@esri/calcite-design-tokens 3.1.1-next.0 → 3.2.0-next.0

package/dist/js/global.js

@@ -9,6 +9,7 @@ export default {
     color: {
       background: {
         default: {
+          key: "{semantic.color.background.default}",
           value: {
             light: "#f7f7f7",
             dark: "#363636",
@@ -40,12 +41,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.background.default}",
           },
           name: "Color Background",
           path: ["semantic", "color", "background", "default"],
-          key: "{semantic.color.background.default}",
         },
         none: {
+          key: "{semantic.color.background.none}",
           value: "rgba(255, 255, 255, 0)",
           type: "color",
           attributes: {
@@ -74,14 +76,15 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.background.none}",
           },
           name: "Color Background None",
           path: ["semantic", "color", "background", "none"],
-          key: "{semantic.color.background.none}",
         },
       },
       foreground: {
         1: {
+          key: "{semantic.color.foreground.1}",
           value: {
             light: "#ffffff",
             dark: "#2b2b2b",
@@ -113,12 +116,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.foreground.1}",
           },
           name: "Color Foreground 1",
           path: ["semantic", "color", "foreground", "1"],
-          key: "{semantic.color.foreground.1}",
         },
         2: {
+          key: "{semantic.color.foreground.2}",
           value: {
             light: "#f2f2f2",
             dark: "#212121",
@@ -150,12 +154,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.foreground.2}",
           },
           name: "Color Foreground 2",
           path: ["semantic", "color", "foreground", "2"],
-          key: "{semantic.color.foreground.2}",
         },
         3: {
+          key: "{semantic.color.foreground.3}",
           value: {
             light: "#ebebeb",
             dark: "#141414",
@@ -187,15 +192,16 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.foreground.3}",
           },
           name: "Color Foreground 3",
           path: ["semantic", "color", "foreground", "3"],
-          key: "{semantic.color.foreground.3}",
         },
         current: {
+          key: "{semantic.color.foreground.current}",
           value: {
-            light: "#c7eaff",
-            dark: "#214155",
+            light: "#d6efff",
+            dark: "#2b465f",
           },
           type: "color",
           attributes: {
@@ -203,6 +209,16 @@ export default {
             type: "color",
             item: "foreground",
             subitem: "current",
+            value: "#d6efff",
+            description:
+              "deprecated, use --calcite-color-foreground-highlight instead",
+            filePath: "src/tokens/semantic/color/light.json",
+            isSource: false,
+            key: "{semantic.color.foreground.current}",
+            name: "calcite-semantic-color-foreground-current",
+            path: ["semantic", "color", "foreground", "current"],
+            comment:
+              "deprecated, use --calcite-color-foreground-highlight instead",
             names: {
               scss: "$calcite-color-foreground-current",
               css: "var(--calcite-color-foreground-current)",
@@ -216,6 +232,8 @@ export default {
               type: "color",
             },
           },
+          description:
+            "deprecated, use --calcite-color-foreground-highlight instead",
           filePath: "src/tokens/semantic/color/light.json",
           isSource: false,
           original: {
@@ -224,15 +242,58 @@ export default {
             attributes: {
               category: "color",
             },
+            description:
+              "deprecated, use --calcite-color-foreground-highlight instead",
+            key: "{semantic.color.foreground.current}",
           },
           name: "Color Foreground Current",
           path: ["semantic", "color", "foreground", "current"],
-          key: "{semantic.color.foreground.current}",
+          comment:
+            "deprecated, use --calcite-color-foreground-highlight instead",
+        },
+        highlight: {
+          key: "{semantic.color.foreground.highlight}",
+          value: {
+            light: "#d6efff",
+            dark: "#2b465f",
+          },
+          type: "color",
+          attributes: {
+            category: "color",
+            type: "color",
+            item: "foreground",
+            subitem: "highlight",
+            names: {
+              scss: "$calcite-color-foreground-highlight",
+              css: "var(--calcite-color-foreground-highlight)",
+              js: "semantic.color.foreground.highlight",
+              docs: "semantic.color.foreground.highlight",
+              es6: "calciteColorForegroundHighlight",
+            },
+            "calcite-schema": {
+              system: "calcite",
+              tier: "color",
+              type: "color",
+            },
+          },
+          filePath: "src/tokens/semantic/color/light.json",
+          isSource: false,
+          original: {
+            value: "{core.color.high-saturation.blue.h-bb-010}",
+            type: "color",
+            attributes: {
+              category: "color",
+            },
+            key: "{semantic.color.foreground.highlight}",
+          },
+          name: "Color Foreground Highlight",
+          path: ["semantic", "color", "foreground", "highlight"],
         },
       },
       transparent: {
         default: {
           default: {
+            key: "{semantic.color.transparent.default.default}",
             value: {
               light: "rgba(0, 0, 0, 0)",
               dark: "rgba(255, 255, 255, 0)",
@@ -265,12 +326,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.transparent.default.default}",
             },
             name: "Color Transparent",
             path: ["semantic", "color", "transparent", "default", "default"],
-            key: "{semantic.color.transparent.default.default}",
           },
           hover: {
+            key: "{semantic.color.transparent.default.hover}",
             value: {
               light: "rgba(0, 0, 0, 0.04)",
               dark: "rgba(255, 255, 255, 0.12)",
@@ -303,12 +365,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.transparent.default.hover}",
             },
             name: "Color Transparent Hover",
             path: ["semantic", "color", "transparent", "default", "hover"],
-            key: "{semantic.color.transparent.default.hover}",
           },
           press: {
+            key: "{semantic.color.transparent.default.press}",
             value: {
               light: "rgba(0, 0, 0, 0.08)",
               dark: "rgba(255, 255, 255, 0.16)",
@@ -341,14 +404,15 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.transparent.default.press}",
             },
             name: "Color Transparent Press",
             path: ["semantic", "color", "transparent", "default", "press"],
-            key: "{semantic.color.transparent.default.press}",
           },
         },
         inverse: {
           hover: {
+            key: "{semantic.color.transparent.inverse.hover}",
             value: {
               light: "rgba(255, 255, 255, 0.12)",
               dark: "rgba(0, 0, 0, 0.04)",
@@ -381,12 +445,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.transparent.inverse.hover}",
             },
             name: "Color Transparent Inverse Hover",
             path: ["semantic", "color", "transparent", "inverse", "hover"],
-            key: "{semantic.color.transparent.inverse.hover}",
           },
           press: {
+            key: "{semantic.color.transparent.inverse.press}",
             value: {
               light: "rgba(255, 255, 255, 0.16)",
               dark: "rgba(0, 0, 0, 0.08)",
@@ -419,13 +484,14 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.transparent.inverse.press}",
             },
             name: "Color Transparent Inverse Press",
             path: ["semantic", "color", "transparent", "inverse", "press"],
-            key: "{semantic.color.transparent.inverse.press}",
           },
         },
         scrim: {
+          key: "{semantic.color.transparent.scrim}",
           value: {
             light: "rgba(255, 255, 255, 0.85)",
             dark: "rgba(0, 0, 0, 0.85)",
@@ -457,12 +523,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.transparent.scrim}",
           },
           name: "Color Transparent Scrim",
           path: ["semantic", "color", "transparent", "scrim"],
-          key: "{semantic.color.transparent.scrim}",
         },
         tint: {
+          key: "{semantic.color.transparent.tint}",
           value: {
             light: "rgba(255, 255, 255, 0.8)",
             dark: "rgba(43, 43, 43, 0.8)",
@@ -494,15 +561,16 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.transparent.tint}",
           },
           name: "Color Transparent Tint",
           path: ["semantic", "color", "transparent", "tint"],
-          key: "{semantic.color.transparent.tint}",
         },
       },
       brand: {
         default: {
           default: {
+            key: "{semantic.color.brand.default.default}",
             value: {
               light: "#007ac2",
               dark: "#009af2",
@@ -535,12 +603,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.brand.default.default}",
             },
             name: "Color Brand",
             path: ["semantic", "color", "brand", "default", "default"],
-            key: "{semantic.color.brand.default.default}",
           },
           hover: {
+            key: "{semantic.color.brand.default.hover}",
             value: {
               light: "#00619b",
               dark: "#007ac2",
@@ -573,12 +642,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.brand.default.hover}",
             },
             name: "Color Brand Hover",
             path: ["semantic", "color", "brand", "default", "hover"],
-            key: "{semantic.color.brand.default.hover}",
           },
           press: {
+            key: "{semantic.color.brand.default.press}",
             value: {
               light: "#004874",
               dark: "#00619b",
@@ -611,13 +681,14 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.brand.default.press}",
             },
             name: "Color Brand Press",
             path: ["semantic", "color", "brand", "default", "press"],
-            key: "{semantic.color.brand.default.press}",
           },
         },
         underline: {
+          key: "{semantic.color.brand.underline}",
           type: "color",
           value: {
             light: "rgba(0, 97, 155, 0.4)",
@@ -650,15 +721,16 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.brand.underline}",
           },
           name: "Color Brand Underline",
           path: ["semantic", "color", "brand", "underline"],
-          key: "{semantic.color.brand.underline}",
         },
       },
       status: {
         info: {
           default: {
+            key: "{semantic.color.status.info.default}",
             value: {
               light: "#00619b",
               dark: "#00a0ff",
@@ -691,12 +763,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.info.default}",
             },
             name: "Color Status Info",
             path: ["semantic", "color", "status", "info", "default"],
-            key: "{semantic.color.status.info.default}",
           },
           hover: {
+            key: "{semantic.color.status.info.hover}",
             value: {
               light: "#004874",
               dark: "#3db8ff",
@@ -729,12 +802,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.info.hover}",
             },
             name: "Color Status Info Hover",
             path: ["semantic", "color", "status", "info", "hover"],
-            key: "{semantic.color.status.info.hover}",
           },
           press: {
+            key: "{semantic.color.status.info.press}",
             value: {
               light: "#00304d",
               dark: "#009af2",
@@ -767,14 +841,15 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.info.press}",
             },
             name: "Color Status Info Press",
             path: ["semantic", "color", "status", "info", "press"],
-            key: "{semantic.color.status.info.press}",
           },
         },
         success: {
           default: {
+            key: "{semantic.color.status.success.default}",
             value: {
               light: "#35ac46",
               dark: "#36da43",
@@ -807,12 +882,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.success.default}",
             },
             name: "Color Status Success",
             path: ["semantic", "color", "status", "success", "default"],
-            key: "{semantic.color.status.success.default}",
           },
           hover: {
+            key: "{semantic.color.status.success.hover}",
             value: {
               light: "#288835",
               dark: "#3bed52",
@@ -845,12 +921,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.success.hover}",
             },
             name: "Color Status Success Hover",
             path: ["semantic", "color", "status", "success", "hover"],
-            key: "{semantic.color.status.success.hover}",
           },
           press: {
+            key: "{semantic.color.status.success.press}",
             value: {
               light: "#1a6324",
               dark: "#00b81b",
@@ -883,14 +960,15 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.success.press}",
             },
             name: "Color Status Success Press",
             path: ["semantic", "color", "status", "success", "press"],
-            key: "{semantic.color.status.success.press}",
           },
         },
         warning: {
           default: {
+            key: "{semantic.color.status.warning.default}",
             value: {
               light: "#f89927",
               dark: "#f89927",
@@ -923,12 +1001,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.warning.default}",
             },
             name: "Color Status Warning",
             path: ["semantic", "color", "status", "warning", "default"],
-            key: "{semantic.color.status.warning.default}",
           },
           hover: {
+            key: "{semantic.color.status.warning.hover}",
             value: {
               light: "#d17300",
               dark: "#ffb54d",
@@ -961,12 +1040,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.warning.hover}",
             },
             name: "Color Status Warning Hover",
             path: ["semantic", "color", "status", "warning", "hover"],
-            key: "{semantic.color.status.warning.hover}",
           },
           press: {
+            key: "{semantic.color.status.warning.press}",
             value: {
               light: "#9a5b10",
               dark: "#ff9500",
@@ -999,14 +1079,15 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.warning.press}",
             },
             name: "Color Status Warning Press",
             path: ["semantic", "color", "status", "warning", "press"],
-            key: "{semantic.color.status.warning.press}",
           },
         },
         danger: {
           default: {
+            key: "{semantic.color.status.danger.default}",
             value: {
               light: "#d83020",
               dark: "#fe583e",
@@ -1039,12 +1120,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.danger.default}",
             },
             name: "Color Status Danger",
             path: ["semantic", "color", "status", "danger", "default"],
-            key: "{semantic.color.status.danger.default}",
           },
           hover: {
+            key: "{semantic.color.status.danger.hover}",
             value: {
               light: "#a82b1e",
               dark: "#ff0015",
@@ -1077,12 +1159,13 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.danger.hover}",
             },
             name: "Color Status Danger Hover",
             path: ["semantic", "color", "status", "danger", "hover"],
-            key: "{semantic.color.status.danger.hover}",
           },
           press: {
+            key: "{semantic.color.status.danger.press}",
             value: {
               light: "#7c1d13",
               dark: "#d90012",
@@ -1115,15 +1198,16 @@ export default {
               attributes: {
                 category: "color",
               },
+              key: "{semantic.color.status.danger.press}",
             },
             name: "Color Status Danger Press",
             path: ["semantic", "color", "status", "danger", "press"],
-            key: "{semantic.color.status.danger.press}",
           },
         },
       },
       inverse: {
         default: {
+          key: "{semantic.color.inverse.default}",
           value: {
             light: "#363636",
             dark: "#f7f7f7",
@@ -1155,12 +1239,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.inverse.default}",
           },
           name: "Color Inverse",
           path: ["semantic", "color", "inverse", "default"],
-          key: "{semantic.color.inverse.default}",
         },
         hover: {
+          key: "{semantic.color.inverse.hover}",
           value: {
             light: "#2b2b2b",
             dark: "#ffffff",
@@ -1192,12 +1277,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.inverse.hover}",
           },
           name: "Color Inverse Hover",
           path: ["semantic", "color", "inverse", "hover"],
-          key: "{semantic.color.inverse.hover}",
         },
         press: {
+          key: "{semantic.color.inverse.press}",
           value: {
             light: "#212121",
             dark: "#f2f2f2",
@@ -1229,14 +1315,15 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.inverse.press}",
           },
           name: "Color Inverse Press",
           path: ["semantic", "color", "inverse", "press"],
-          key: "{semantic.color.inverse.press}",
         },
       },
       text: {
         1: {
+          key: "{semantic.color.text.1}",
           value: {
             light: "#141414",
             dark: "#ffffff",
@@ -1268,12 +1355,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.1}",
           },
           name: "Color Text 1",
           path: ["semantic", "color", "text", "1"],
-          key: "{semantic.color.text.1}",
         },
         2: {
+          key: "{semantic.color.text.2}",
           value: {
             light: "#4a4a4a",
             dark: "#bfbfbf",
@@ -1305,12 +1393,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.2}",
           },
           name: "Color Text 2",
           path: ["semantic", "color", "text", "2"],
-          key: "{semantic.color.text.2}",
         },
         3: {
+          key: "{semantic.color.text.3}",
           value: {
             light: "#6b6b6b",
             dark: "#9e9e9e",
@@ -1342,15 +1431,16 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.3}",
           },
           name: "Color Text 3",
           path: ["semantic", "color", "text", "3"],
-          key: "{semantic.color.text.3}",
         },
         highlight: {
+          key: "{semantic.color.text.highlight}",
           value: {
             light: "#004874",
-            dark: "#c7eaff",
+            dark: "#d6efff",
           },
           type: "color",
           attributes: {
@@ -1379,12 +1469,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.highlight}",
           },
           name: "Color Text Highlight",
           path: ["semantic", "color", "text", "highlight"],
-          key: "{semantic.color.text.highlight}",
         },
         inverse: {
+          key: "{semantic.color.text.inverse}",
           value: {
             light: "#ffffff",
             dark: "#141414",
@@ -1416,12 +1507,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.inverse}",
           },
           name: "Color Text Inverse",
           path: ["semantic", "color", "text", "inverse"],
-          key: "{semantic.color.text.inverse}",
         },
         link: {
+          key: "{semantic.color.text.link}",
           value: {
             light: "#00619b",
             dark: "#00a0ff",
@@ -1453,14 +1545,15 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.text.link}",
           },
           name: "Color Text Link",
           path: ["semantic", "color", "text", "link"],
-          key: "{semantic.color.text.link}",
         },
       },
       border: {
         1: {
+          key: "{semantic.color.border.1}",
           value: {
             light: "#c9c9c9",
             dark: "#545454",
@@ -1492,12 +1585,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.1}",
           },
           name: "Color Border 1",
           path: ["semantic", "color", "border", "1"],
-          key: "{semantic.color.border.1}",
         },
         2: {
+          key: "{semantic.color.border.2}",
           value: {
             light: "#d4d4d4",
             dark: "#4a4a4a",
@@ -1529,12 +1623,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.2}",
           },
           name: "Color Border 2",
           path: ["semantic", "color", "border", "2"],
-          key: "{semantic.color.border.2}",
         },
         3: {
+          key: "{semantic.color.border.3}",
           value: {
             light: "#dedede",
             dark: "#404040",
@@ -1566,12 +1661,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.3}",
           },
           name: "Color Border 3",
           path: ["semantic", "color", "border", "3"],
-          key: "{semantic.color.border.3}",
         },
         input: {
+          key: "{semantic.color.border.input}",
           value: {
             light: "#949494",
             dark: "#757575",
@@ -1603,12 +1699,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.input}",
           },
           name: "Color Border Input",
           path: ["semantic", "color", "border", "input"],
-          key: "{semantic.color.border.input}",
         },
         ghost: {
+          key: "{semantic.color.border.ghost}",
           value: {
             light: "rgba(0, 0, 0, 0.3)",
             dark: "rgba(117, 117, 117, 0.3)",
@@ -1640,12 +1737,13 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.ghost}",
           },
           name: "Color Border Ghost",
           path: ["semantic", "color", "border", "ghost"],
-          key: "{semantic.color.border.ghost}",
         },
         white: {
+          key: "{semantic.color.border.white}",
           value: {
             light: "#ffffff",
             dark: "#f7f7f7",
@@ -1677,16 +1775,17 @@ export default {
             attributes: {
               category: "color",
             },
+            key: "{semantic.color.border.white}",
           },
           name: "Color Border White",
           path: ["semantic", "color", "border", "white"],
-          key: "{semantic.color.border.white}",
         },
       },
     },
     border: {
       width: {
         none: {
+          key: "{semantic.border.width.none}",
           value: "0",
           type: "dimension",
           attributes: {
@@ -1715,12 +1814,13 @@ export default {
             attributes: {
               category: "border",
             },
+            key: "{semantic.border.width.none}",
           },
           name: "Border Width None",
           path: ["semantic", "border", "width", "none"],
-          key: "{semantic.border.width.none}",
         },
         sm: {
+          key: "{semantic.border.width.sm}",
           value: "1px",
           type: "dimension",
           attributes: {
@@ -1749,12 +1849,13 @@ export default {
             attributes: {
               category: "border",
             },
+            key: "{semantic.border.width.sm}",
           },
           name: "Border Width Sm",
           path: ["semantic", "border", "width", "sm"],
-          key: "{semantic.border.width.sm}",
         },
         md: {
+          key: "{semantic.border.width.md}",
           value: "2px",
           type: "dimension",
           attributes: {
@@ -1783,12 +1884,13 @@ export default {
             attributes: {
               category: "border",
             },
+            key: "{semantic.border.width.md}",
           },
           name: "Border Width Md",
           path: ["semantic", "border", "width", "md"],
-          key: "{semantic.border.width.md}",
         },
         lg: {
+          key: "{semantic.border.width.lg}",
           value: "4px",
           type: "dimension",
           attributes: {
@@ -1817,16 +1919,17 @@ export default {
             attributes: {
               category: "border",
             },
+            key: "{semantic.border.width.lg}",
           },
           name: "Border Width Lg",
           path: ["semantic", "border", "width", "lg"],
-          key: "{semantic.border.width.lg}",
         },
       },
     },
     "container-size": {
       height: {
         xxs: {
+          key: "{semantic.container-size.height.xxs}",
           value: {
             min: "0",
             max: "154px",
@@ -1845,6 +1948,7 @@ export default {
             description: "Small handheld devices and mini-windows",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.xxs}",
             name: "calcite-semantic-container-size-height-xxs",
             path: ["semantic", "container-size", "height", "xxs"],
             comment: "Small handheld devices and mini-windows",
@@ -1873,13 +1977,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.xxs}",
           },
           name: "Container Size Height Xxs",
           path: ["semantic", "container-size", "height", "xxs"],
           comment: "Small handheld devices and mini-windows",
-          key: "{semantic.container-size.height.xxs}",
         },
         xs: {
+          key: "{semantic.container-size.height.xs}",
           value: {
             min: "155px",
             max: "328px",
@@ -1898,6 +2003,7 @@ export default {
             description: "Handheld devices",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.xs}",
             name: "calcite-semantic-container-size-height-xs",
             path: ["semantic", "container-size", "height", "xs"],
             comment: "Handheld devices",
@@ -1926,13 +2032,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.xs}",
           },
           name: "Container Size Height Xs",
           path: ["semantic", "container-size", "height", "xs"],
           comment: "Handheld devices",
-          key: "{semantic.container-size.height.xs}",
         },
         sm: {
+          key: "{semantic.container-size.height.sm}",
           value: {
             min: "329px",
             max: "504px",
@@ -1951,6 +2058,7 @@ export default {
             description: "Small tablets",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.sm}",
             name: "calcite-semantic-container-size-height-sm",
             path: ["semantic", "container-size", "height", "sm"],
             comment: "Small tablets",
@@ -1979,13 +2087,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.sm}",
           },
           name: "Container Size Height Sm",
           path: ["semantic", "container-size", "height", "sm"],
           comment: "Small tablets",
-          key: "{semantic.container-size.height.sm}",
         },
         md: {
+          key: "{semantic.container-size.height.md}",
           value: {
             min: "505px",
             max: "678px",
@@ -2004,6 +2113,7 @@ export default {
             description: "Small laptops",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.md}",
             name: "calcite-semantic-container-size-height-md",
             path: ["semantic", "container-size", "height", "md"],
             comment: "Small laptops",
@@ -2032,13 +2142,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.md}",
           },
           name: "Container Size Height Md",
           path: ["semantic", "container-size", "height", "md"],
           comment: "Small laptops",
-          key: "{semantic.container-size.height.md}",
         },
         lg: {
+          key: "{semantic.container-size.height.lg}",
           value: {
             min: "679px",
             max: "854px",
@@ -2057,6 +2168,7 @@ export default {
             description: "Large laptops and desktop computers",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.lg}",
             name: "calcite-semantic-container-size-height-lg",
             path: ["semantic", "container-size", "height", "lg"],
             comment: "Large laptops and desktop computers",
@@ -2085,13 +2197,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.lg}",
           },
           name: "Container Size Height Lg",
           path: ["semantic", "container-size", "height", "lg"],
           comment: "Large laptops and desktop computers",
-          key: "{semantic.container-size.height.lg}",
         },
         xl: {
+          key: "{semantic.container-size.height.xl}",
           value: {
             min: "855px",
           },
@@ -2108,6 +2221,7 @@ export default {
             description: "Projectors and televisions",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.height.xl}",
             name: "calcite-semantic-container-size-height-xl",
             path: ["semantic", "container-size", "height", "xl"],
             comment: "Projectors and televisions",
@@ -2135,15 +2249,16 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.height.xl}",
           },
           name: "Container Size Height Xl",
           path: ["semantic", "container-size", "height", "xl"],
           comment: "Projectors and televisions",
-          key: "{semantic.container-size.height.xl}",
         },
       },
       width: {
         xxs: {
+          key: "{semantic.container-size.width.xxs}",
           value: {
             min: "0",
             max: "320px",
@@ -2156,12 +2271,13 @@ export default {
             item: "width",
             subitem: "xxs",
             value: {
-              min: 0,
+              min: "0",
               max: "320px",
             },
             description: "Small handheld devices and mini-windows",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.xxs}",
             name: "calcite-semantic-container-size-width-xxs",
             path: ["semantic", "container-size", "width", "xxs"],
             comment: "Small handheld devices and mini-windows",
@@ -2182,7 +2298,7 @@ export default {
           isSource: true,
           original: {
             value: {
-              min: 0,
+              min: "0",
               max: "{core.container-size.320}",
             },
             type: "dimension",
@@ -2190,13 +2306,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.xxs}",
           },
           name: "Container Size Width Xxs",
           path: ["semantic", "container-size", "width", "xxs"],
           comment: "Small handheld devices and mini-windows",
-          key: "{semantic.container-size.width.xxs}",
         },
         xs: {
+          key: "{semantic.container-size.width.xs}",
           value: {
             min: "321px",
             max: "476px",
@@ -2215,6 +2332,7 @@ export default {
             description: "Handheld devices",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.xs}",
             name: "calcite-semantic-container-size-width-xs",
             path: ["semantic", "container-size", "width", "xs"],
             comment: "Handheld devices",
@@ -2243,13 +2361,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.xs}",
           },
           name: "Container Size Width Xs",
           path: ["semantic", "container-size", "width", "xs"],
           comment: "Handheld devices",
-          key: "{semantic.container-size.width.xs}",
         },
         sm: {
+          key: "{semantic.container-size.width.sm}",
           value: {
             min: "477px",
             max: "768px",
@@ -2268,6 +2387,7 @@ export default {
             description: "Small tablets",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.sm}",
             name: "calcite-semantic-container-size-width-sm",
             path: ["semantic", "container-size", "width", "sm"],
             comment: "Small tablets",
@@ -2296,13 +2416,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.sm}",
           },
           name: "Container Size Width Sm",
           path: ["semantic", "container-size", "width", "sm"],
           comment: "Small tablets",
-          key: "{semantic.container-size.width.sm}",
         },
         md: {
+          key: "{semantic.container-size.width.md}",
           value: {
             min: "769px",
             max: "1152px",
@@ -2321,6 +2442,7 @@ export default {
             description: "Small laptops",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.md}",
             name: "calcite-semantic-container-size-width-md",
             path: ["semantic", "container-size", "width", "md"],
             comment: "Small laptops",
@@ -2349,13 +2471,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.md}",
           },
           name: "Container Size Width Md",
           path: ["semantic", "container-size", "width", "md"],
           comment: "Small laptops",
-          key: "{semantic.container-size.width.md}",
         },
         lg: {
+          key: "{semantic.container-size.width.lg}",
           value: {
             min: "1153px",
             max: "1440px",
@@ -2374,6 +2497,7 @@ export default {
             description: "Large laptops and desktop computers",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.lg}",
             name: "calcite-semantic-container-size-width-lg",
             path: ["semantic", "container-size", "width", "lg"],
             comment: "Large laptops and desktop computers",
@@ -2402,13 +2526,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.lg}",
           },
           name: "Container Size Width Lg",
           path: ["semantic", "container-size", "width", "lg"],
           comment: "Large laptops and desktop computers",
-          key: "{semantic.container-size.width.lg}",
         },
         xl: {
+          key: "{semantic.container-size.width.xl}",
           value: {
             min: "1441px",
           },
@@ -2425,6 +2550,7 @@ export default {
             description: "Projectors and televisions",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.width.xl}",
             name: "calcite-semantic-container-size-width-xl",
             path: ["semantic", "container-size", "width", "xl"],
             comment: "Projectors and televisions",
@@ -2452,14 +2578,15 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.width.xl}",
           },
           name: "Container Size Width Xl",
           path: ["semantic", "container-size", "width", "xl"],
           comment: "Projectors and televisions",
-          key: "{semantic.container-size.width.xl}",
         },
       },
       margin: {
+        key: "{semantic.container-size.margin}",
         value: "24px",
         type: "dimension",
         attributes: {
@@ -2487,12 +2614,13 @@ export default {
           attributes: {
             category: "breakpoint",
           },
+          key: "{semantic.container-size.margin}",
         },
         name: "Container Size Margin",
         path: ["semantic", "container-size", "margin"],
-        key: "{semantic.container-size.margin}",
       },
       gutter: {
+        key: "{semantic.container-size.gutter}",
         value: "16px",
         type: "dimension",
         attributes: {
@@ -2520,13 +2648,14 @@ export default {
           attributes: {
             category: "breakpoint",
           },
+          key: "{semantic.container-size.gutter}",
         },
         name: "Container Size Gutter",
         path: ["semantic", "container-size", "gutter"],
-        key: "{semantic.container-size.gutter}",
       },
       content: {
         fluid: {
+          key: "{semantic.container-size.content.fluid}",
           value: "100%",
           type: "dimension",
           description: "for fluid grid widths",
@@ -2539,6 +2668,7 @@ export default {
             description: "for fluid grid widths",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.content.fluid}",
             name: "calcite-semantic-container-size-content-fluid",
             path: ["semantic", "container-size", "content", "fluid"],
             comment: "for fluid grid widths",
@@ -2564,13 +2694,14 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.content.fluid}",
           },
           name: "Container Size Content Fluid",
           path: ["semantic", "container-size", "content", "fluid"],
           comment: "for fluid grid widths",
-          key: "{semantic.container-size.content.fluid}",
         },
         fixed: {
+          key: "{semantic.container-size.content.fixed}",
           value: "1440px",
           type: "dimension",
           description: "only for lg breakpoint fixed grid width",
@@ -2583,6 +2714,7 @@ export default {
             description: "only for lg breakpoint fixed grid width",
             filePath: "src/tokens/semantic/container-size.json",
             isSource: true,
+            key: "{semantic.container-size.content.fixed}",
             name: "calcite-semantic-container-size-content-fixed",
             path: ["semantic", "container-size", "content", "fixed"],
             comment: "only for lg breakpoint fixed grid width",
@@ -2608,17 +2740,18 @@ export default {
             attributes: {
               category: "breakpoint",
             },
+            key: "{semantic.container-size.content.fixed}",
           },
           name: "Container Size Content Fixed",
           path: ["semantic", "container-size", "content", "fixed"],
           comment: "only for lg breakpoint fixed grid width",
-          key: "{semantic.container-size.content.fixed}",
         },
       },
     },
     corner: {
       radius: {
         default: {
+          key: "{semantic.corner.radius.default}",
           value: "0",
           type: "dimension",
           attributes: {
@@ -2647,12 +2780,13 @@ export default {
             attributes: {
               category: "corner",
             },
+            key: "{semantic.corner.radius.default}",
           },
           name: "Corner Radius",
           path: ["semantic", "corner", "radius", "default"],
-          key: "{semantic.corner.radius.default}",
         },
         sharp: {
+          key: "{semantic.corner.radius.sharp}",
           value: "0",
           type: "dimension",
           attributes: {
@@ -2661,12 +2795,13 @@ export default {
             item: "radius",
             subitem: "sharp",
             value: "0",
-            description: "deprecated, use --calcite-conder-radius-none instead",
+            description: "deprecated, use --calcite-corner-radius-none instead",
             filePath: "src/tokens/semantic/corner.json",
             isSource: true,
+            key: "{semantic.corner.radius.sharp}",
             name: "calcite-semantic-corner-radius-sharp",
             path: ["semantic", "corner", "radius", "sharp"],
-            comment: "deprecated, use --calcite-conder-radius-none instead",
+            comment: "deprecated, use --calcite-corner-radius-none instead",
             names: {
               scss: "$calcite-corner-radius-sharp",
               css: "var(--calcite-corner-radius-sharp)",
@@ -2680,7 +2815,7 @@ export default {
               type: "dimension",
             },
           },
-          description: "deprecated, use --calcite-conder-radius-none instead",
+          description: "deprecated, use --calcite-corner-radius-none instead",
           filePath: "src/tokens/semantic/corner.json",
           isSource: true,
           original: {
@@ -2689,14 +2824,15 @@ export default {
             attributes: {
               category: "corner",
             },
-            description: "deprecated, use --calcite-conder-radius-none instead",
+            description: "deprecated, use --calcite-corner-radius-none instead",
+            key: "{semantic.corner.radius.sharp}",
           },
           name: "Corner Radius Sharp",
           path: ["semantic", "corner", "radius", "sharp"],
-          comment: "deprecated, use --calcite-conder-radius-none instead",
-          key: "{semantic.corner.radius.sharp}",
+          comment: "deprecated, use --calcite-corner-radius-none instead",
         },
         none: {
+          key: "{semantic.corner.radius.none}",
           value: "0",
           type: "dimension",
           attributes: {
@@ -2725,12 +2861,13 @@ export default {
             attributes: {
               category: "corner",
             },
+            key: "{semantic.corner.radius.none}",
           },
           name: "Corner Radius None",
           path: ["semantic", "corner", "radius", "none"],
-          key: "{semantic.corner.radius.none}",
         },
         xs: {
+          key: "{semantic.corner.radius.xs}",
           value: "2px",
           type: "dimension",
           attributes: {
@@ -2759,12 +2896,13 @@ export default {
             attributes: {
               category: "corner",
             },
+            key: "{semantic.corner.radius.xs}",
           },
           name: "Corner Radius Xs",
           path: ["semantic", "corner", "radius", "xs"],
-          key: "{semantic.corner.radius.xs}",
         },
         sm: {
+          key: "{semantic.corner.radius.sm}",
           value: "4px",
           type: "dimension",
           attributes: {
@@ -2793,12 +2931,13 @@ export default {
             attributes: {
               category: "corner",
             },
+            key: "{semantic.corner.radius.sm}",
           },
           name: "Corner Radius Sm",
           path: ["semantic", "corner", "radius", "sm"],
-          key: "{semantic.corner.radius.sm}",
         },
         round: {
+          key: "{semantic.corner.radius.round}",
           value: "4px",
           type: "dimension",
           attributes: {
@@ -2810,6 +2949,7 @@ export default {
             description: "deprecated, use --calcite-corner-radius-sm instead",
             filePath: "src/tokens/semantic/corner.json",
             isSource: true,
+            key: "{semantic.corner.radius.round}",
             name: "calcite-semantic-corner-radius-round",
             path: ["semantic", "corner", "radius", "round"],
             comment: "deprecated, use --calcite-corner-radius-sm instead",
@@ -2836,13 +2976,14 @@ export default {
               category: "corner",
             },
             description: "deprecated, use --calcite-corner-radius-sm instead",
+            key: "{semantic.corner.radius.round}",
           },
           name: "Corner Radius Round",
           path: ["semantic", "corner", "radius", "round"],
           comment: "deprecated, use --calcite-corner-radius-sm instead",
-          key: "{semantic.corner.radius.round}",
         },
         pill: {
+          key: "{semantic.corner.radius.pill}",
           value: "100%",
           type: "dimension",
           attributes: {
@@ -2873,29 +3014,30 @@ export default {
               element: "",
               category: "corner",
             },
+            key: "{semantic.corner.radius.pill}",
           },
           name: "Corner Radius Pill",
           path: ["semantic", "corner", "radius", "pill"],
-          key: "{semantic.corner.radius.pill}",
         },
       },
     },
     font: {
       family: {
         default: {
+          key: "{semantic.font.family.default}",
           value: ["Avenir Next", "Avenir", "Helvetica Neue", "sans-serif"],
           type: "fontFamily",
-          description: "Primary font with fallbacks",
           attributes: {
             group: "family",
             category: "semantic",
             type: "fontFamily",
             item: "family",
             subitem: "default",
-            value: ["Avenir Next", "Avenir", "Helvetica Neue", "sans-serif"],
+            value: "Avenir Next,Avenir,Helvetica Neue,sans-serif",
             description: "Primary font with fallbacks",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.family.default}",
             name: "calcite-semantic-font-family-default",
             path: ["semantic", "font", "family", "default"],
             comment: "Primary font with fallbacks",
@@ -2912,27 +3054,25 @@ export default {
               type: "fontFamily",
             },
           },
+          description: "Primary font with fallbacks",
           filePath: "src/tokens/semantic/font.json",
           isSource: true,
           original: {
-            value: [
-              "{core.font.family.avenirNext}",
-              "{core.font.family.avenir}",
-              "{core.font.family.helveticaNeue}",
-              "{core.font.family.sansSerif}",
-            ],
+            value:
+              "{core.font.family.avenirNext},{core.font.family.avenir},{core.font.family.helveticaNeue},{core.font.family.sansSerif}",
             type: "fontFamily",
-            description: "Primary font with fallbacks",
             attributes: {
               group: "family",
             },
+            description: "Primary font with fallbacks",
+            key: "{semantic.font.family.default}",
           },
           name: "Font Family",
           path: ["semantic", "font", "family", "default"],
           comment: "Primary font with fallbacks",
-          key: "{semantic.font.family.default}",
         },
         code: {
+          key: "{semantic.font.family.code}",
           value: [
             "Monaco",
             "Consolas",
@@ -2941,22 +3081,16 @@ export default {
             "monospace",
           ],
           type: "fontFamily",
-          description: "Font family for code with fallbacks",
           attributes: {
             category: "font",
             type: "fontFamily",
             item: "family",
             subitem: "code",
-            value: [
-              "Monaco",
-              "Consolas",
-              "Andale Mono",
-              "Lucida Console",
-              "monospace",
-            ],
+            value: "Monaco,Consolas,Andale Mono,Lucida Console,monospace",
             description: "Font family for code with fallbacks",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.family.code}",
             name: "calcite-semantic-font-family-code",
             path: ["semantic", "font", "family", "code"],
             comment: "Font family for code with fallbacks",
@@ -2973,33 +3107,29 @@ export default {
               type: "fontFamily",
             },
           },
+          description: "Font family for code with fallbacks",
           filePath: "src/tokens/semantic/font.json",
           isSource: true,
           original: {
-            value: [
-              "{core.font.family.monaco}",
-              "{core.font.family.consolas}",
-              "{core.font.family.andaleMono}",
-              "{core.font.family.lucidaConsole}",
-              "{core.font.family.monospace}",
-            ],
+            value:
+              "{core.font.family.monaco},{core.font.family.consolas},{core.font.family.andaleMono},{core.font.family.lucidaConsole},{core.font.family.monospace}",
             type: "fontFamily",
-            description: "Font family for code with fallbacks",
             attributes: {
               category: "font",
             },
+            description: "Font family for code with fallbacks",
+            key: "{semantic.font.family.code}",
           },
           name: "Font Family Code",
           path: ["semantic", "font", "family", "code"],
           comment: "Font family for code with fallbacks",
-          key: "{semantic.font.family.code}",
         },
       },
       weight: {
         light: {
+          key: "{semantic.font.weight.light}",
           value: "300",
           type: "fontWeight",
-          description: "For Avenir Next World (secondary font family)",
           attributes: {
             category: "font",
             type: "fontWeight",
@@ -3009,6 +3139,7 @@ export default {
             description: "For Avenir Next World (secondary font family)",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.weight.light}",
             name: "calcite-semantic-font-weight-light",
             path: ["semantic", "font", "weight", "light"],
             comment: "For Avenir Next World (secondary font family)",
@@ -3025,26 +3156,26 @@ export default {
               type: "fontWeight",
             },
           },
+          description: "For Avenir Next World (secondary font family)",
           filePath: "src/tokens/semantic/font.json",
           isSource: true,
           original: {
             value: "{core.font.weight.light}",
             type: "fontWeight",
-            description: "For Avenir Next World (secondary font family)",
             attributes: {
               category: "font",
             },
+            description: "For Avenir Next World (secondary font family)",
+            key: "{semantic.font.weight.light}",
           },
           name: "Font Weight Light",
           path: ["semantic", "font", "weight", "light"],
           comment: "For Avenir Next World (secondary font family)",
-          key: "{semantic.font.weight.light}",
         },
         normal: {
+          key: "{semantic.font.weight.normal}",
           value: "400",
           type: "fontWeight",
-          description:
-            'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
           extensions: {
             "calcite.deprecated": true,
           },
@@ -3054,13 +3185,14 @@ export default {
             item: "weight",
             subitem: "normal",
             value: "400",
-            description:
-              'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
             extensions: {
               "calcite.deprecated": true,
             },
+            description:
+              'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.weight.normal}",
             name: "calcite-semantic-font-weight-normal",
             path: ["semantic", "font", "weight", "normal"],
             comment:
@@ -3078,27 +3210,30 @@ export default {
               type: "fontWeight",
             },
           },
+          description:
+            'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
           filePath: "src/tokens/semantic/font.json",
           isSource: true,
           original: {
             value: "{core.font.weight.regular}",
             type: "fontWeight",
-            description:
-              'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
             extensions: {
               "calcite.deprecated": true,
             },
             attributes: {
               category: "font",
             },
+            description:
+              'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
+            key: "{semantic.font.weight.normal}",
           },
           name: "Font Weight Normal",
           path: ["semantic", "font", "weight", "normal"],
           comment:
             'For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word "regular"',
-          key: "{semantic.font.weight.normal}",
         },
         regular: {
+          key: "{semantic.font.weight.regular}",
           value: "400",
           type: "fontWeight",
           attributes: {
@@ -3127,12 +3262,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.weight.regular}",
           },
           name: "Font Weight Regular",
           path: ["semantic", "font", "weight", "regular"],
-          key: "{semantic.font.weight.regular}",
         },
         medium: {
+          key: "{semantic.font.weight.medium}",
           value: "500",
           type: "fontWeight",
           attributes: {
@@ -3161,12 +3297,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.weight.medium}",
           },
           name: "Font Weight Medium",
           path: ["semantic", "font", "weight", "medium"],
-          key: "{semantic.font.weight.medium}",
         },
         semibold: {
+          key: "{semantic.font.weight.semibold}",
           value: "600",
           type: "fontWeight",
           attributes: {
@@ -3195,12 +3332,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.weight.semibold}",
           },
           name: "Font Weight Semibold",
           path: ["semantic", "font", "weight", "semibold"],
-          key: "{semantic.font.weight.semibold}",
         },
         bold: {
+          key: "{semantic.font.weight.bold}",
           value: "600",
           type: "fontWeight",
           attributes: {
@@ -3229,14 +3367,15 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.weight.bold}",
           },
           name: "Font Weight Bold",
           path: ["semantic", "font", "weight", "bold"],
-          key: "{semantic.font.weight.bold}",
         },
       },
       size: {
         xs: {
+          key: "{semantic.font.size.xs}",
           value: "10px",
           type: "fontSize",
           attributes: {
@@ -3265,12 +3404,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.xs}",
           },
           name: "Font Size Xs",
           path: ["semantic", "font", "size", "xs"],
-          key: "{semantic.font.size.xs}",
         },
         sm: {
+          key: "{semantic.font.size.sm}",
           value: "12px",
           type: "fontSize",
           attributes: {
@@ -3299,12 +3439,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.sm}",
           },
           name: "Font Size Sm",
           path: ["semantic", "font", "size", "sm"],
-          key: "{semantic.font.size.sm}",
         },
         default: {
+          key: "{semantic.font.size.default}",
           value: "14px",
           type: "fontSize",
           attributes: {
@@ -3333,12 +3474,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.default}",
           },
           name: "Font Size",
           path: ["semantic", "font", "size", "default"],
-          key: "{semantic.font.size.default}",
         },
         md: {
+          key: "{semantic.font.size.md}",
           value: "16px",
           type: "fontSize",
           attributes: {
@@ -3367,12 +3509,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.md}",
           },
           name: "Font Size Md",
           path: ["semantic", "font", "size", "md"],
-          key: "{semantic.font.size.md}",
         },
         lg: {
+          key: "{semantic.font.size.lg}",
           value: "18px",
           type: "fontSize",
           attributes: {
@@ -3401,12 +3544,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.lg}",
           },
           name: "Font Size Lg",
           path: ["semantic", "font", "size", "lg"],
-          key: "{semantic.font.size.lg}",
         },
         xl: {
+          key: "{semantic.font.size.xl}",
           value: "20px",
           type: "fontSize",
           attributes: {
@@ -3435,12 +3579,13 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.xl}",
           },
           name: "Font Size Xl",
           path: ["semantic", "font", "size", "xl"],
-          key: "{semantic.font.size.xl}",
         },
         xxl: {
+          key: "{semantic.font.size.xxl}",
           value: "24px",
           type: "fontSize",
           attributes: {
@@ -3469,14 +3614,15 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.size.xxl}",
           },
           name: "Font Size Xxl",
           path: ["semantic", "font", "size", "xxl"],
-          key: "{semantic.font.size.xxl}",
         },
       },
       style: {
         emphasis: {
+          key: "{semantic.font.style.emphasis}",
           value: "italic",
           type: "fontStyle",
           description: "used in ratings",
@@ -3489,6 +3635,7 @@ export default {
             description: "used in ratings",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.style.emphasis}",
             name: "calcite-semantic-font-style-emphasis",
             path: ["semantic", "font", "style", "emphasis"],
             comment: "used in ratings",
@@ -3514,16 +3661,17 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.style.emphasis}",
           },
           name: "Font Style Emphasis",
           path: ["semantic", "font", "style", "emphasis"],
           comment: "used in ratings",
-          key: "{semantic.font.style.emphasis}",
         },
       },
       "line-height": {
         fixed: {
           sm: {
+            key: "{semantic.font.line-height.fixed.sm}",
             value: "12px",
             type: "lineHeight",
             attributes: {
@@ -3553,12 +3701,13 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.fixed.sm}",
             },
             name: "Font Line Height Fixed Sm",
             path: ["semantic", "font", "line-height", "fixed", "sm"],
-            key: "{semantic.font.line-height.fixed.sm}",
           },
           base: {
+            key: "{semantic.font.line-height.fixed.base}",
             value: "16px",
             type: "lineHeight",
             attributes: {
@@ -3588,12 +3737,13 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.fixed.base}",
             },
             name: "Font Line Height Fixed Base",
             path: ["semantic", "font", "line-height", "fixed", "base"],
-            key: "{semantic.font.line-height.fixed.base}",
           },
           lg: {
+            key: "{semantic.font.line-height.fixed.lg}",
             value: "20px",
             type: "lineHeight",
             attributes: {
@@ -3623,12 +3773,13 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.fixed.lg}",
             },
             name: "Font Line Height Fixed Lg",
             path: ["semantic", "font", "line-height", "fixed", "lg"],
-            key: "{semantic.font.line-height.fixed.lg}",
           },
           xl: {
+            key: "{semantic.font.line-height.fixed.xl}",
             value: "24px",
             type: "lineHeight",
             attributes: {
@@ -3658,14 +3809,15 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.fixed.xl}",
             },
             name: "Font Line Height Fixed Xl",
             path: ["semantic", "font", "line-height", "fixed", "xl"],
-            key: "{semantic.font.line-height.fixed.xl}",
           },
         },
         relative: {
           default: {
+            key: "{semantic.font.line-height.relative.default}",
             value: "auto",
             type: "lineHeight",
             description: "1",
@@ -3679,6 +3831,7 @@ export default {
               description: "1",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.default}",
               name: "calcite-semantic-font-line-height-relative-default",
               path: ["semantic", "font", "line-height", "relative", "default"],
               comment: "1",
@@ -3704,13 +3857,14 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.default}",
             },
             name: "Font Line Height Relative",
             path: ["semantic", "font", "line-height", "relative", "default"],
             comment: "1",
-            key: "{semantic.font.line-height.relative.default}",
           },
           tight: {
+            key: "{semantic.font.line-height.relative.tight}",
             value: "1.25",
             type: "lineHeight",
             description: "1.25",
@@ -3724,6 +3878,7 @@ export default {
               description: "1.25",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.tight}",
               name: "calcite-semantic-font-line-height-relative-tight",
               path: ["semantic", "font", "line-height", "relative", "tight"],
               comment: "1.25",
@@ -3749,13 +3904,14 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.tight}",
             },
             name: "Font Line Height Relative Tight",
             path: ["semantic", "font", "line-height", "relative", "tight"],
             comment: "1.25",
-            key: "{semantic.font.line-height.relative.tight}",
           },
           snug: {
+            key: "{semantic.font.line-height.relative.snug}",
             value: "1.375",
             type: "lineHeight",
             description: "1.375",
@@ -3769,6 +3925,7 @@ export default {
               description: "1.375",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.snug}",
               name: "calcite-semantic-font-line-height-relative-snug",
               path: ["semantic", "font", "line-height", "relative", "snug"],
               comment: "1.375",
@@ -3794,13 +3951,14 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.snug}",
             },
             name: "Font Line Height Relative Snug",
             path: ["semantic", "font", "line-height", "relative", "snug"],
             comment: "1.375",
-            key: "{semantic.font.line-height.relative.snug}",
           },
           normal: {
+            key: "{semantic.font.line-height.relative.normal}",
             value: "1.5",
             type: "lineHeight",
             description: "1.5",
@@ -3814,6 +3972,7 @@ export default {
               description: "1.5",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.normal}",
               name: "calcite-semantic-font-line-height-relative-normal",
               path: ["semantic", "font", "line-height", "relative", "normal"],
               comment: "1.5",
@@ -3839,13 +3998,14 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.normal}",
             },
             name: "Font Line Height Relative Normal",
             path: ["semantic", "font", "line-height", "relative", "normal"],
             comment: "1.5",
-            key: "{semantic.font.line-height.relative.normal}",
           },
           relaxed: {
+            key: "{semantic.font.line-height.relative.relaxed}",
             value: "1.625",
             type: "lineHeight",
             description: "1.625",
@@ -3859,6 +4019,7 @@ export default {
               description: "1.625",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.relaxed}",
               name: "calcite-semantic-font-line-height-relative-relaxed",
               path: ["semantic", "font", "line-height", "relative", "relaxed"],
               comment: "1.625",
@@ -3884,13 +4045,14 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.relaxed}",
             },
             name: "Font Line Height Relative Relaxed",
             path: ["semantic", "font", "line-height", "relative", "relaxed"],
             comment: "1.625",
-            key: "{semantic.font.line-height.relative.relaxed}",
           },
           loose: {
+            key: "{semantic.font.line-height.relative.loose}",
             value: "2",
             type: "lineHeight",
             description: "2",
@@ -3904,6 +4066,7 @@ export default {
               description: "2",
               filePath: "src/tokens/semantic/font.json",
               isSource: true,
+              key: "{semantic.font.line-height.relative.loose}",
               name: "calcite-semantic-font-line-height-relative-loose",
               path: ["semantic", "font", "line-height", "relative", "loose"],
               comment: "2",
@@ -3929,16 +4092,17 @@ export default {
               attributes: {
                 category: "font",
               },
+              key: "{semantic.font.line-height.relative.loose}",
             },
             name: "Font Line Height Relative Loose",
             path: ["semantic", "font", "line-height", "relative", "loose"],
             comment: "2",
-            key: "{semantic.font.line-height.relative.loose}",
           },
         },
       },
       "letter-spacing": {
         tight: {
+          key: "{semantic.font.letter-spacing.tight}",
           value: "-0.4px",
           type: "dimension",
           description: "Deprecated",
@@ -3951,6 +4115,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.letter-spacing.tight}",
             name: "calcite-semantic-font-letter-spacing-tight",
             path: ["semantic", "font", "letter-spacing", "tight"],
             comment: "Deprecated",
@@ -3976,13 +4141,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.letter-spacing.tight}",
           },
           name: "Font Letter Spacing Tight",
           path: ["semantic", "font", "letter-spacing", "tight"],
           comment: "Deprecated",
-          key: "{semantic.font.letter-spacing.tight}",
         },
         normal: {
+          key: "{semantic.font.letter-spacing.normal}",
           value: "0",
           type: "dimension",
           description: "Deprecated",
@@ -3995,6 +4161,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.letter-spacing.normal}",
             name: "calcite-semantic-font-letter-spacing-normal",
             path: ["semantic", "font", "letter-spacing", "normal"],
             comment: "Deprecated",
@@ -4020,13 +4187,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.letter-spacing.normal}",
           },
           name: "Font Letter Spacing Normal",
           path: ["semantic", "font", "letter-spacing", "normal"],
           comment: "Deprecated",
-          key: "{semantic.font.letter-spacing.normal}",
         },
         wide: {
+          key: "{semantic.font.letter-spacing.wide}",
           value: "0.4px",
           type: "dimension",
           description: "Deprecated",
@@ -4039,6 +4207,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.letter-spacing.wide}",
             name: "calcite-semantic-font-letter-spacing-wide",
             path: ["semantic", "font", "letter-spacing", "wide"],
             comment: "Deprecated",
@@ -4064,15 +4233,16 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.letter-spacing.wide}",
           },
           name: "Font Letter Spacing Wide",
           path: ["semantic", "font", "letter-spacing", "wide"],
           comment: "Deprecated",
-          key: "{semantic.font.letter-spacing.wide}",
         },
       },
       "paragraph-spacing": {
         normal: {
+          key: "{semantic.font.paragraph-spacing.normal}",
           value: "4px",
           type: "dimension",
           description: "Deprecated",
@@ -4085,6 +4255,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.paragraph-spacing.normal}",
             name: "calcite-semantic-font-paragraph-spacing-normal",
             path: ["semantic", "font", "paragraph-spacing", "normal"],
             comment: "Deprecated",
@@ -4110,15 +4281,16 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.paragraph-spacing.normal}",
           },
           name: "Font Paragraph Spacing Normal",
           path: ["semantic", "font", "paragraph-spacing", "normal"],
           comment: "Deprecated",
-          key: "{semantic.font.paragraph-spacing.normal}",
         },
       },
       "text-decoration": {
         none: {
+          key: "{semantic.font.text-decoration.none}",
           value: "none",
           type: "textDecoration",
           description: "Deprecated",
@@ -4131,6 +4303,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-decoration.none}",
             name: "calcite-semantic-font-text-decoration-none",
             path: ["semantic", "font", "text-decoration", "none"],
             comment: "Deprecated",
@@ -4156,13 +4329,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-decoration.none}",
           },
           name: "Font Text Decoration None",
           path: ["semantic", "font", "text-decoration", "none"],
           comment: "Deprecated",
-          key: "{semantic.font.text-decoration.none}",
         },
         underline: {
+          key: "{semantic.font.text-decoration.underline}",
           value: "underline",
           type: "textDecoration",
           description: "Deprecated",
@@ -4175,6 +4349,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-decoration.underline}",
             name: "calcite-semantic-font-text-decoration-underline",
             path: ["semantic", "font", "text-decoration", "underline"],
             comment: "Deprecated",
@@ -4200,15 +4375,16 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-decoration.underline}",
           },
           name: "Font Text Decoration Underline",
           path: ["semantic", "font", "text-decoration", "underline"],
           comment: "Deprecated",
-          key: "{semantic.font.text-decoration.underline}",
         },
       },
       "text-case": {
         none: {
+          key: "{semantic.font.text-case.none}",
           value: "none",
           type: "textCase",
           description: "Deprecated",
@@ -4221,6 +4397,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-case.none}",
             name: "calcite-semantic-font-text-case-none",
             path: ["semantic", "font", "text-case", "none"],
             comment: "Deprecated",
@@ -4246,13 +4423,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-case.none}",
           },
           name: "Font Text Case None",
           path: ["semantic", "font", "text-case", "none"],
           comment: "Deprecated",
-          key: "{semantic.font.text-case.none}",
         },
         uppercase: {
+          key: "{semantic.font.text-case.uppercase}",
           value: "uppercase",
           type: "textCase",
           description: "Deprecated",
@@ -4265,6 +4443,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-case.uppercase}",
             name: "calcite-semantic-font-text-case-uppercase",
             path: ["semantic", "font", "text-case", "uppercase"],
             comment: "Deprecated",
@@ -4290,13 +4469,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-case.uppercase}",
           },
           name: "Font Text Case Uppercase",
           path: ["semantic", "font", "text-case", "uppercase"],
           comment: "Deprecated",
-          key: "{semantic.font.text-case.uppercase}",
         },
         lowercase: {
+          key: "{semantic.font.text-case.lowercase}",
           value: "lowercase",
           type: "textCase",
           description: "Deprecated",
@@ -4309,6 +4489,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-case.lowercase}",
             name: "calcite-semantic-font-text-case-lowercase",
             path: ["semantic", "font", "text-case", "lowercase"],
             comment: "Deprecated",
@@ -4334,13 +4515,14 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-case.lowercase}",
           },
           name: "Font Text Case Lowercase",
           path: ["semantic", "font", "text-case", "lowercase"],
           comment: "Deprecated",
-          key: "{semantic.font.text-case.lowercase}",
         },
         capitalize: {
+          key: "{semantic.font.text-case.capitalize}",
           value: "capitalize",
           type: "textCase",
           description: "Deprecated",
@@ -4353,6 +4535,7 @@ export default {
             description: "Deprecated",
             filePath: "src/tokens/semantic/font.json",
             isSource: true,
+            key: "{semantic.font.text-case.capitalize}",
             name: "calcite-semantic-font-text-case-capitalize",
             path: ["semantic", "font", "text-case", "capitalize"],
             comment: "Deprecated",
@@ -4378,16 +4561,17 @@ export default {
             attributes: {
               category: "font",
             },
+            key: "{semantic.font.text-case.capitalize}",
           },
           name: "Font Text Case Capitalize",
           path: ["semantic", "font", "text-case", "capitalize"],
           comment: "Deprecated",
-          key: "{semantic.font.text-case.capitalize}",
         },
       },
     },
     opacity: {
       light: {
+        key: "{semantic.opacity.light}",
         value: "0.4",
         type: "opacity",
         attributes: {
@@ -4415,12 +4599,13 @@ export default {
           attributes: {
             category: "opacity",
           },
+          key: "{semantic.opacity.light}",
         },
         name: "Opacity Light",
         path: ["semantic", "opacity", "light"],
-        key: "{semantic.opacity.light}",
       },
       half: {
+        key: "{semantic.opacity.half}",
         value: "0.5",
         type: "opacity",
         attributes: {
@@ -4448,12 +4633,13 @@ export default {
           attributes: {
             category: "opacity",
           },
+          key: "{semantic.opacity.half}",
         },
         name: "Opacity Half",
         path: ["semantic", "opacity", "half"],
-        key: "{semantic.opacity.half}",
       },
       dark: {
+        key: "{semantic.opacity.dark}",
         value: "0.85",
         type: "opacity",
         attributes: {
@@ -4481,12 +4667,13 @@ export default {
           attributes: {
             category: "opacity",
           },
+          key: "{semantic.opacity.dark}",
         },
         name: "Opacity Dark",
         path: ["semantic", "opacity", "dark"],
-        key: "{semantic.opacity.dark}",
       },
       full: {
+        key: "{semantic.opacity.full}",
         value: "1",
         type: "opacity",
         attributes: {
@@ -4514,12 +4701,13 @@ export default {
           attributes: {
             category: "opacity",
           },
+          key: "{semantic.opacity.full}",
         },
         name: "Opacity Full",
         path: ["semantic", "opacity", "full"],
-        key: "{semantic.opacity.full}",
       },
       disabled: {
+        key: "{semantic.opacity.disabled}",
         value: "0.5",
         type: "opacity",
         attributes: {
@@ -4547,14 +4735,15 @@ export default {
           attributes: {
             category: "opacity",
           },
+          key: "{semantic.opacity.disabled}",
         },
         name: "Opacity Disabled",
         path: ["semantic", "opacity", "disabled"],
-        key: "{semantic.opacity.disabled}",
       },
     },
     shadow: {
       none: {
+        key: "{semantic.shadow.none}",
         value: {
           blur: "0",
           spread: "0",
@@ -4583,23 +4772,18 @@ export default {
         filePath: "src/tokens/semantic/shadow.json",
         isSource: true,
         original: {
-          value: {
-            blur: "0",
-            spread: "0",
-            color: "rgba({core.color.neutral.blk-240}, {core.opacity.0})",
-            offsetX: "0",
-            offsetY: "0",
-          },
+          value: "{core.shadow.0}",
           type: "shadow",
           attributes: {
             category: "shadow",
           },
+          key: "{semantic.shadow.none}",
         },
         name: "Shadow None",
         path: ["semantic", "shadow", "none"],
-        key: "{semantic.shadow.none}",
       },
       sm: {
+        key: "{semantic.shadow.sm}",
         value: [
           {
             blur: "8px",
@@ -4642,12 +4826,13 @@ export default {
           attributes: {
             category: "shadow",
           },
+          key: "{semantic.shadow.sm}",
         },
         name: "Shadow Sm",
         path: ["semantic", "shadow", "sm"],
-        key: "{semantic.shadow.sm}",
       },
       md: {
+        key: "{semantic.shadow.md}",
         value: [
           {
             blur: "20px",
@@ -4690,18 +4875,18 @@ export default {
           attributes: {
             category: "shadow",
           },
+          key: "{semantic.shadow.md}",
         },
         name: "Shadow Md",
         path: ["semantic", "shadow", "md"],
-        key: "{semantic.shadow.md}",
       },
     },
     size: {
       fixed: {
         xxxs: {
+          key: "{semantic.size.fixed.xxxs}",
           value: "2px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4711,6 +4896,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xxxs}",
             name: "calcite-semantic-size-fixed-xxxs",
             path: ["semantic", "size", "fixed", "xxxs"],
             comment: "deprecated",
@@ -4727,25 +4913,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.2}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xxxs}",
           },
           name: "Size Fixed Xxxs",
           path: ["semantic", "size", "fixed", "xxxs"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xxxs}",
         },
         xxs: {
+          key: "{semantic.size.fixed.xxs}",
           value: "4px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4755,6 +4942,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xxs}",
             name: "calcite-semantic-size-fixed-xxs",
             path: ["semantic", "size", "fixed", "xxs"],
             comment: "deprecated",
@@ -4771,25 +4959,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.4}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xxs}",
           },
           name: "Size Fixed Xxs",
           path: ["semantic", "size", "fixed", "xxs"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xxs}",
         },
         xs: {
+          key: "{semantic.size.fixed.xs}",
           value: "6px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4799,6 +4988,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xs}",
             name: "calcite-semantic-size-fixed-xs",
             path: ["semantic", "size", "fixed", "xs"],
             comment: "deprecated",
@@ -4815,25 +5005,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.6}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xs}",
           },
           name: "Size Fixed Xs",
           path: ["semantic", "size", "fixed", "xs"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xs}",
         },
         sm: {
+          key: "{semantic.size.fixed.sm}",
           value: "8px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4843,6 +5034,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.sm}",
             name: "calcite-semantic-size-fixed-sm",
             path: ["semantic", "size", "fixed", "sm"],
             comment: "deprecated",
@@ -4859,25 +5051,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.8}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.sm}",
           },
           name: "Size Fixed Sm",
           path: ["semantic", "size", "fixed", "sm"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.sm}",
         },
         "sm+": {
+          key: "{semantic.size.fixed.sm+}",
           value: "10px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4887,6 +5080,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.sm+}",
             name: "calcite-semantic-size-fixed-sm",
             path: ["semantic", "size", "fixed", "sm+"],
             comment: "deprecated",
@@ -4903,25 +5097,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.10}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.sm+}",
           },
           name: "Size Fixed Sm Plus",
           path: ["semantic", "size", "fixed", "sm+"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.sm+}",
         },
         md: {
+          key: "{semantic.size.fixed.md}",
           value: "12px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4931,6 +5126,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.md}",
             name: "calcite-semantic-size-fixed-md",
             path: ["semantic", "size", "fixed", "md"],
             comment: "deprecated",
@@ -4947,25 +5143,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.12}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.md}",
           },
           name: "Size Fixed Md",
           path: ["semantic", "size", "fixed", "md"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.md}",
         },
         "md+": {
+          key: "{semantic.size.fixed.md+}",
           value: "14px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -4975,6 +5172,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.md+}",
             name: "calcite-semantic-size-fixed-md",
             path: ["semantic", "size", "fixed", "md+"],
             comment: "deprecated",
@@ -4991,25 +5189,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.14}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.md+}",
           },
           name: "Size Fixed Md Plus",
           path: ["semantic", "size", "fixed", "md+"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.md+}",
         },
         lg: {
+          key: "{semantic.size.fixed.lg}",
           value: "16px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -5019,6 +5218,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.lg}",
             name: "calcite-semantic-size-fixed-lg",
             path: ["semantic", "size", "fixed", "lg"],
             comment: "deprecated",
@@ -5035,25 +5235,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.16}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.lg}",
           },
           name: "Size Fixed Lg",
           path: ["semantic", "size", "fixed", "lg"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.lg}",
         },
         xl: {
+          key: "{semantic.size.fixed.xl}",
           value: "20px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -5063,6 +5264,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xl}",
             name: "calcite-semantic-size-fixed-xl",
             path: ["semantic", "size", "fixed", "xl"],
             comment: "deprecated",
@@ -5079,25 +5281,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.20}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xl}",
           },
           name: "Size Fixed Xl",
           path: ["semantic", "size", "fixed", "xl"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xl}",
         },
         xxl: {
+          key: "{semantic.size.fixed.xxl}",
           value: "24px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -5107,6 +5310,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xxl}",
             name: "calcite-semantic-size-fixed-xxl",
             path: ["semantic", "size", "fixed", "xxl"],
             comment: "deprecated",
@@ -5123,25 +5327,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.24}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xxl}",
           },
           name: "Size Fixed Xxl",
           path: ["semantic", "size", "fixed", "xxl"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xxl}",
         },
         xxxl: {
+          key: "{semantic.size.fixed.xxxl}",
           value: "32px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "size",
             type: "dimension",
@@ -5151,6 +5356,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/size.json",
             isSource: true,
+            key: "{semantic.size.fixed.xxxl}",
             name: "calcite-semantic-size-fixed-xxxl",
             path: ["semantic", "size", "fixed", "xxxl"],
             comment: "deprecated",
@@ -5167,24 +5373,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/size.json",
           isSource: true,
           original: {
             value: "{core.size.default.32}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "size",
             },
+            description: "deprecated",
+            key: "{semantic.size.fixed.xxxl}",
           },
           name: "Size Fixed Xxxl",
           path: ["semantic", "size", "fixed", "xxxl"],
           comment: "deprecated",
-          key: "{semantic.size.fixed.xxxl}",
         },
       },
       default: {
         px: {
+          key: "{semantic.size.default.px}",
           value: "1px",
           type: "dimension",
           attributes: {
@@ -5213,12 +5421,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.px}",
           },
           name: "Size Px",
           path: ["semantic", "size", "default", "px"],
-          key: "{semantic.size.default.px}",
         },
         xxxs: {
+          key: "{semantic.size.default.xxxs}",
           value: "0.75rem",
           type: "dimension",
           attributes: {
@@ -5247,12 +5456,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xxxs}",
           },
           name: "Size Xxxs",
           path: ["semantic", "size", "default", "xxxs"],
-          key: "{semantic.size.default.xxxs}",
         },
         xxs: {
+          key: "{semantic.size.default.xxs}",
           value: "0.875rem",
           type: "dimension",
           attributes: {
@@ -5281,12 +5491,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xxs}",
           },
           name: "Size Xxs",
           path: ["semantic", "size", "default", "xxs"],
-          key: "{semantic.size.default.xxs}",
         },
         xs: {
+          key: "{semantic.size.default.xs}",
           value: "1rem",
           type: "dimension",
           attributes: {
@@ -5315,12 +5526,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xs}",
           },
           name: "Size Xs",
           path: ["semantic", "size", "default", "xs"],
-          key: "{semantic.size.default.xs}",
         },
         sm: {
+          key: "{semantic.size.default.sm}",
           value: "1.5rem",
           type: "dimension",
           attributes: {
@@ -5349,12 +5561,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.sm}",
           },
           name: "Size Sm",
           path: ["semantic", "size", "default", "sm"],
-          key: "{semantic.size.default.sm}",
         },
         md: {
+          key: "{semantic.size.default.md}",
           value: "2rem",
           type: "dimension",
           attributes: {
@@ -5383,12 +5596,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.md}",
           },
           name: "Size Md",
           path: ["semantic", "size", "default", "md"],
-          key: "{semantic.size.default.md}",
         },
         lg: {
+          key: "{semantic.size.default.lg}",
           value: "2.75rem",
           type: "dimension",
           attributes: {
@@ -5417,12 +5631,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.lg}",
           },
           name: "Size Lg",
           path: ["semantic", "size", "default", "lg"],
-          key: "{semantic.size.default.lg}",
         },
         xl: {
+          key: "{semantic.size.default.xl}",
           value: "3rem",
           type: "dimension",
           attributes: {
@@ -5451,12 +5666,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xl}",
           },
           name: "Size Xl",
           path: ["semantic", "size", "default", "xl"],
-          key: "{semantic.size.default.xl}",
         },
         xxl: {
+          key: "{semantic.size.default.xxl}",
           value: "4rem",
           type: "dimension",
           attributes: {
@@ -5485,12 +5701,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xxl}",
           },
           name: "Size Xxl",
           path: ["semantic", "size", "default", "xxl"],
-          key: "{semantic.size.default.xxl}",
         },
         xxxl: {
+          key: "{semantic.size.default.xxxl}",
           value: "6rem",
           type: "dimension",
           attributes: {
@@ -5519,19 +5736,19 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.size.default.xxxl}",
           },
           name: "Size Xxxl",
           path: ["semantic", "size", "default", "xxxl"],
-          key: "{semantic.size.default.xxxl}",
         },
       },
     },
     spacing: {
       fixed: {
         xxs: {
+          key: "{semantic.spacing.fixed.xxs}",
           value: "4px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5541,6 +5758,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.xxs}",
             name: "calcite-semantic-spacing-fixed-xxs",
             path: ["semantic", "spacing", "fixed", "xxs"],
             comment: "deprecated",
@@ -5557,25 +5775,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.4}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.xxs}",
           },
           name: "Spacing Fixed Xxs",
           path: ["semantic", "spacing", "fixed", "xxs"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.xxs}",
         },
         xs: {
+          key: "{semantic.spacing.fixed.xs}",
           value: "6px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5585,6 +5804,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.xs}",
             name: "calcite-semantic-spacing-fixed-xs",
             path: ["semantic", "spacing", "fixed", "xs"],
             comment: "deprecated",
@@ -5601,25 +5821,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.6}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.xs}",
           },
           name: "Spacing Fixed Xs",
           path: ["semantic", "spacing", "fixed", "xs"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.xs}",
         },
         sm: {
+          key: "{semantic.spacing.fixed.sm}",
           value: "8px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5629,6 +5850,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.sm}",
             name: "calcite-semantic-spacing-fixed-sm",
             path: ["semantic", "spacing", "fixed", "sm"],
             comment: "deprecated",
@@ -5645,25 +5867,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.8}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.sm}",
           },
           name: "Spacing Fixed Sm",
           path: ["semantic", "spacing", "fixed", "sm"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.sm}",
         },
         md: {
+          key: "{semantic.spacing.fixed.md}",
           value: "12px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5673,6 +5896,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.md}",
             name: "calcite-semantic-spacing-fixed-md",
             path: ["semantic", "spacing", "fixed", "md"],
             comment: "deprecated",
@@ -5689,25 +5913,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.12}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.md}",
           },
           name: "Spacing Fixed Md",
           path: ["semantic", "spacing", "fixed", "md"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.md}",
         },
         lg: {
+          key: "{semantic.spacing.fixed.lg}",
           value: "14px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5717,6 +5942,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.lg}",
             name: "calcite-semantic-spacing-fixed-lg",
             path: ["semantic", "spacing", "fixed", "lg"],
             comment: "deprecated",
@@ -5733,25 +5959,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.14}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.lg}",
           },
           name: "Spacing Fixed Lg",
           path: ["semantic", "spacing", "fixed", "lg"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.lg}",
         },
         xl: {
+          key: "{semantic.spacing.fixed.xl}",
           value: "16px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5761,6 +5988,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.xl}",
             name: "calcite-semantic-spacing-fixed-xl",
             path: ["semantic", "spacing", "fixed", "xl"],
             comment: "deprecated",
@@ -5777,25 +6005,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.16}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.xl}",
           },
           name: "Spacing Fixed Xl",
           path: ["semantic", "spacing", "fixed", "xl"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.xl}",
         },
         xxl: {
+          key: "{semantic.spacing.fixed.xxl}",
           value: "20px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5805,6 +6034,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.xxl}",
             name: "calcite-semantic-spacing-fixed-xxl",
             path: ["semantic", "spacing", "fixed", "xxl"],
             comment: "deprecated",
@@ -5821,25 +6051,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.20}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.xxl}",
           },
           name: "Spacing Fixed Xxl",
           path: ["semantic", "spacing", "fixed", "xxl"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.xxl}",
         },
         xxxl: {
+          key: "{semantic.spacing.fixed.xxxl}",
           value: "32px",
           type: "dimension",
-          description: "deprecated",
           attributes: {
             category: "space",
             type: "dimension",
@@ -5849,6 +6080,7 @@ export default {
             description: "deprecated",
             filePath: "src/tokens/semantic/space.json",
             isSource: true,
+            key: "{semantic.spacing.fixed.xxxl}",
             name: "calcite-semantic-spacing-fixed-xxxl",
             path: ["semantic", "spacing", "fixed", "xxxl"],
             comment: "deprecated",
@@ -5865,24 +6097,26 @@ export default {
               type: "dimension",
             },
           },
+          description: "deprecated",
           filePath: "src/tokens/semantic/space.json",
           isSource: true,
           original: {
             value: "{core.size.default.32}",
             type: "dimension",
-            description: "deprecated",
             attributes: {
               category: "space",
             },
+            description: "deprecated",
+            key: "{semantic.spacing.fixed.xxxl}",
           },
           name: "Spacing Fixed Xxxl",
           path: ["semantic", "spacing", "fixed", "xxxl"],
           comment: "deprecated",
-          key: "{semantic.spacing.fixed.xxxl}",
         },
       },
       default: {
         none: {
+          key: "{semantic.spacing.default.none}",
           value: "0",
           type: "dimension",
           attributes: {
@@ -5913,12 +6147,13 @@ export default {
               pattern: "",
               category: "space",
             },
+            key: "{semantic.spacing.default.none}",
           },
           name: "Spacing None",
           path: ["semantic", "spacing", "default", "none"],
-          key: "{semantic.spacing.default.none}",
         },
         px: {
+          key: "{semantic.spacing.default.px}",
           value: "1px",
           type: "dimension",
           attributes: {
@@ -5949,12 +6184,13 @@ export default {
               pattern: "",
               category: "space",
             },
+            key: "{semantic.spacing.default.px}",
           },
           name: "Spacing Px",
           path: ["semantic", "spacing", "default", "px"],
-          key: "{semantic.spacing.default.px}",
         },
         base: {
+          key: "{semantic.spacing.default.base}",
           value: "2px",
           type: "dimension",
           attributes: {
@@ -5985,12 +6221,13 @@ export default {
               pattern: "",
               category: "space",
             },
+            key: "{semantic.spacing.default.base}",
           },
           name: "Spacing Base",
           path: ["semantic", "spacing", "default", "base"],
-          key: "{semantic.spacing.default.base}",
         },
         xxs: {
+          key: "{semantic.spacing.default.xxs}",
           value: "0.25rem",
           type: "dimension",
           attributes: {
@@ -6019,12 +6256,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.spacing.default.xxs}",
           },
           name: "Spacing Xxs",
           path: ["semantic", "spacing", "default", "xxs"],
-          key: "{semantic.spacing.default.xxs}",
         },
         xs: {
+          key: "{semantic.spacing.default.xs}",
           value: "0.375rem",
           type: "dimension",
           attributes: {
@@ -6053,12 +6291,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.spacing.default.xs}",
           },
           name: "Spacing Xs",
           path: ["semantic", "spacing", "default", "xs"],
-          key: "{semantic.spacing.default.xs}",
         },
         sm: {
+          key: "{semantic.spacing.default.sm}",
           value: "0.5rem",
           type: "dimension",
           attributes: {
@@ -6087,12 +6326,13 @@ export default {
             attributes: {
               category: "size",
             },
+            key: "{semantic.spacing.default.sm}",
           },
           name: "Spacing Sm",
           path: ["semantic", "spacing", "default", "sm"],
-          key: "{semantic.spacing.default.sm}",
         },
         "sm+": {
+          key: "{semantic.spacing.default.sm+}",
           value: "0.625rem",
           type: "dimension",
           attributes: {
@@ -6121,12 +6361,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.sm+}",
           },
           name: "Spacing Sm Plus",
           path: ["semantic", "spacing", "default", "sm+"],
-          key: "{semantic.spacing.default.sm+}",
         },
         md: {
+          key: "{semantic.spacing.default.md}",
           value: "0.75rem",
           type: "dimension",
           attributes: {
@@ -6155,12 +6396,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.md}",
           },
           name: "Spacing Md",
           path: ["semantic", "spacing", "default", "md"],
-          key: "{semantic.spacing.default.md}",
         },
         "md+": {
+          key: "{semantic.spacing.default.md+}",
           value: "0.875rem",
           type: "dimension",
           attributes: {
@@ -6189,12 +6431,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.md+}",
           },
           name: "Spacing Md Plus",
           path: ["semantic", "spacing", "default", "md+"],
-          key: "{semantic.spacing.default.md+}",
         },
         lg: {
+          key: "{semantic.spacing.default.lg}",
           value: "1rem",
           type: "dimension",
           attributes: {
@@ -6223,12 +6466,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.lg}",
           },
           name: "Spacing Lg",
           path: ["semantic", "spacing", "default", "lg"],
-          key: "{semantic.spacing.default.lg}",
         },
         xl: {
+          key: "{semantic.spacing.default.xl}",
           value: "1.25rem",
           type: "dimension",
           attributes: {
@@ -6257,12 +6501,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.xl}",
           },
           name: "Spacing Xl",
           path: ["semantic", "spacing", "default", "xl"],
-          key: "{semantic.spacing.default.xl}",
         },
         xxl: {
+          key: "{semantic.spacing.default.xxl}",
           value: "1.5rem",
           type: "dimension",
           attributes: {
@@ -6291,12 +6536,13 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.xxl}",
           },
           name: "Spacing Xxl",
           path: ["semantic", "spacing", "default", "xxl"],
-          key: "{semantic.spacing.default.xxl}",
         },
         xxxl: {
+          key: "{semantic.spacing.default.xxxl}",
           value: "2rem",
           type: "dimension",
           attributes: {
@@ -6325,16 +6571,17 @@ export default {
             attributes: {
               category: "space",
             },
+            key: "{semantic.spacing.default.xxxl}",
           },
           name: "Spacing Xxxl",
           path: ["semantic", "spacing", "default", "xxxl"],
-          key: "{semantic.spacing.default.xxxl}",
         },
       },
     },
     typography: {
       default: {
         default: {
+          key: "{semantic.typography.default.default}",
           type: "typography",
           value: {
             fontFamily: [
@@ -6386,13 +6633,14 @@ export default {
             attributes: {
               category: "",
             },
+            key: "{semantic.typography.default.default}",
           },
           name: "Typography",
           path: ["semantic", "typography", "default", "default"],
-          key: "{semantic.typography.default.default}",
         },
         light: {
           "-3h": {
+            key: "{semantic.typography.default.light.-3h}",
             value: {
               fontSize: "10px",
               fontWeight: "300",
@@ -6450,12 +6698,13 @@ export default {
               attributes: {
                 category: "",
               },
+              key: "{semantic.typography.default.light.-3h}",
             },
             name: "Typography Light Minus 3h",
             path: ["semantic", "typography", "default", "light", "-3h"],
-            key: "{semantic.typography.default.light.-3h}",
           },
           "-2h": {
+            key: "{semantic.typography.default.light.-2h}",
             value: {
               fontSize: "12px",
               fontWeight: "300",
@@ -6511,12 +6760,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.light.-2h}",
             },
             name: "Typography Light Minus 2h",
             path: ["semantic", "typography", "default", "light", "-2h"],
-            key: "{semantic.typography.default.light.-2h}",
           },
           "-1h": {
+            key: "{semantic.typography.default.light.-1h}",
             value: {
               fontWeight: "300",
             },
@@ -6570,12 +6820,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.light.-1h}",
             },
             name: "Typography Light Minus 1h",
             path: ["semantic", "typography", "default", "light", "-1h"],
-            key: "{semantic.typography.default.light.-1h}",
           },
           "0h": {
+            key: "{semantic.typography.default.light.0h}",
             value: {
               fontSize: "16px",
               fontWeight: "300",
@@ -6633,12 +6884,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.light.0h}",
             },
             name: "Typography Light 0h",
             path: ["semantic", "typography", "default", "light", "0h"],
-            key: "{semantic.typography.default.light.0h}",
           },
           "1h": {
+            key: "{semantic.typography.default.light.1h}",
             value: {
               fontSize: "18px",
               fontWeight: "300",
@@ -6696,14 +6948,15 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.light.1h}",
             },
             name: "Typography Light 1h",
             path: ["semantic", "typography", "default", "light", "1h"],
-            key: "{semantic.typography.default.light.1h}",
           },
         },
         regular: {
           "-3h": {
+            key: "{semantic.typography.default.regular.-3h}",
             value: {
               lineHeight: "12px",
               fontSize: "10px",
@@ -6759,12 +7012,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.regular.-3h}",
             },
             name: "Typography Regular Minus 3h",
             path: ["semantic", "typography", "default", "regular", "-3h"],
-            key: "{semantic.typography.default.regular.-3h}",
           },
           "-2h": {
+            key: "{semantic.typography.default.regular.-2h}",
             value: {
               fontSize: "12px",
             },
@@ -6818,12 +7072,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.regular.-2h}",
             },
             name: "Typography Regular Minus 2h",
             path: ["semantic", "typography", "default", "regular", "-2h"],
-            key: "{semantic.typography.default.regular.-2h}",
           },
           "-1h": {
+            key: "{semantic.typography.default.regular.-1h}",
             value: {
               fontFamily: [
                 "Avenir Next",
@@ -6862,26 +7117,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontFamily: "{semantic.font.family.default}",
-                fontSize: "{semantic.font.size.default}",
-                fontWeight: "{semantic.font.weight.regular}",
-                letterSpacing: "{semantic.font.letter-spacing.normal}",
-                lineHeight: "{semantic.font.line-height.fixed.base}",
-                paragraphSpacing: "{semantic.font.paragraph-spacing.normal}",
-                textCase: "{semantic.font.text-case.none}",
-                textDecoration: "{semantic.font.text-decoration.none}",
-              },
+              value: "{semantic.typography.default.default}",
               type: "typography",
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.regular.-1h}",
             },
             name: "Typography Regular Minus 1h",
             path: ["semantic", "typography", "default", "regular", "-1h"],
-            key: "{semantic.typography.default.regular.-1h}",
           },
           "0h": {
+            key: "{semantic.typography.default.regular.0h}",
             value: {
               lineHeight: "20px",
               fontSize: "16px",
@@ -6937,12 +7184,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.regular.0h}",
             },
             name: "Typography Regular 0h",
             path: ["semantic", "typography", "default", "regular", "0h"],
-            key: "{semantic.typography.default.regular.0h}",
           },
           "1h": {
+            key: "{semantic.typography.default.regular.1h}",
             value: {
               lineHeight: "24px",
               fontSize: "18px",
@@ -6998,14 +7246,15 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.regular.1h}",
             },
             name: "Typography Regular 1h",
             path: ["semantic", "typography", "default", "regular", "1h"],
-            key: "{semantic.typography.default.regular.1h}",
           },
         },
         medium: {
           "-3h": {
+            key: "{semantic.typography.default.medium.-3h}",
             value: {
               fontWeight: "500",
               lineHeight: "12px",
@@ -7063,12 +7312,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.medium.-3h}",
             },
             name: "Typography Medium Minus 3h",
             path: ["semantic", "typography", "default", "medium", "-3h"],
-            key: "{semantic.typography.default.medium.-3h}",
           },
           "-2h": {
+            key: "{semantic.typography.default.medium.-2h}",
             value: {
               fontWeight: "500",
               fontSize: "12px",
@@ -7124,12 +7374,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.medium.-2h}",
             },
             name: "Typography Medium Minus 2h",
             path: ["semantic", "typography", "default", "medium", "-2h"],
-            key: "{semantic.typography.default.medium.-2h}",
           },
           "-1h": {
+            key: "{semantic.typography.default.medium.-1h}",
             value: {
               fontWeight: "500",
             },
@@ -7183,12 +7434,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.medium.-1h}",
             },
             name: "Typography Medium Minus 1h",
             path: ["semantic", "typography", "default", "medium", "-1h"],
-            key: "{semantic.typography.default.medium.-1h}",
           },
           "0h": {
+            key: "{semantic.typography.default.medium.0h}",
             value: {
               fontWeight: "500",
               lineHeight: "20px",
@@ -7246,12 +7498,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.medium.0h}",
             },
             name: "Typography Medium 0h",
             path: ["semantic", "typography", "default", "medium", "0h"],
-            key: "{semantic.typography.default.medium.0h}",
           },
           "1h": {
+            key: "{semantic.typography.default.medium.1h}",
             value: {
               fontWeight: "500",
               lineHeight: "24px",
@@ -7309,14 +7562,15 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.medium.1h}",
             },
             name: "Typography Medium 1h",
             path: ["semantic", "typography", "default", "medium", "1h"],
-            key: "{semantic.typography.default.medium.1h}",
           },
         },
         bold: {
           "-3h": {
+            key: "{semantic.typography.default.bold.-3h}",
             value: {
               fontWeight: "600",
               lineHeight: "12px",
@@ -7374,12 +7628,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.bold.-3h}",
             },
             name: "Typography Bold Minus 3h",
             path: ["semantic", "typography", "default", "bold", "-3h"],
-            key: "{semantic.typography.default.bold.-3h}",
           },
           "-2h": {
+            key: "{semantic.typography.default.bold.-2h}",
             value: {
               fontWeight: "600",
               fontSize: "12px",
@@ -7435,12 +7690,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.bold.-2h}",
             },
             name: "Typography Bold Minus 2h",
             path: ["semantic", "typography", "default", "bold", "-2h"],
-            key: "{semantic.typography.default.bold.-2h}",
           },
           "-1h": {
+            key: "{semantic.typography.default.bold.-1h}",
             value: {
               fontWeight: "600",
             },
@@ -7494,12 +7750,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.bold.-1h}",
             },
             name: "Typography Bold Minus 1h",
             path: ["semantic", "typography", "default", "bold", "-1h"],
-            key: "{semantic.typography.default.bold.-1h}",
           },
           "0h": {
+            key: "{semantic.typography.default.bold.0h}",
             value: {
               fontWeight: "600",
               lineHeight: "20px",
@@ -7557,12 +7814,13 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.bold.0h}",
             },
             name: "Typography Bold 0h",
             path: ["semantic", "typography", "default", "bold", "0h"],
-            key: "{semantic.typography.default.bold.0h}",
           },
           "1h": {
+            key: "{semantic.typography.default.bold.1h}",
             value: {
               fontWeight: "600",
               lineHeight: "24px",
@@ -7620,16 +7878,17 @@ export default {
               attributes: {
                 category: "default",
               },
+              key: "{semantic.typography.default.bold.1h}",
             },
             name: "Typography Bold 1h",
             path: ["semantic", "typography", "default", "bold", "1h"],
-            key: "{semantic.typography.default.bold.1h}",
           },
         },
       },
       wrap: {
         light: {
           0: {
+            key: "{semantic.typography.wrap.light.0}",
             value: {
               fontWeight: "300",
               lineHeight: "1.375",
@@ -7687,12 +7946,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.0}",
             },
             name: "Typography Wrap Light 0",
             path: ["semantic", "typography", "wrap", "light", "0"],
-            key: "{semantic.typography.wrap.light.0}",
           },
           1: {
+            key: "{semantic.typography.wrap.light.1}",
             value: {
               fontWeight: "300",
               lineHeight: "1.375",
@@ -7750,12 +8010,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.1}",
             },
             name: "Typography Wrap Light 1",
             path: ["semantic", "typography", "wrap", "light", "1"],
-            key: "{semantic.typography.wrap.light.1}",
           },
           2: {
+            key: "{semantic.typography.wrap.light.2}",
             value: {
               fontWeight: "300",
               lineHeight: "1.375",
@@ -7813,12 +8074,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.2}",
             },
             name: "Typography Wrap Light 2",
             path: ["semantic", "typography", "wrap", "light", "2"],
-            key: "{semantic.typography.wrap.light.2}",
           },
           3: {
+            key: "{semantic.typography.wrap.light.3}",
             value: {
               fontWeight: "300",
               lineHeight: "1.25",
@@ -7876,12 +8138,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.3}",
             },
             name: "Typography Wrap Light 3",
             path: ["semantic", "typography", "wrap", "light", "3"],
-            key: "{semantic.typography.wrap.light.3}",
           },
           "-2": {
+            key: "{semantic.typography.wrap.light.-2}",
             value: {
               fontWeight: "300",
               lineHeight: "1.375",
@@ -7939,12 +8202,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.-2}",
             },
             name: "Typography Wrap Light Minus 2",
             path: ["semantic", "typography", "wrap", "light", "-2"],
-            key: "{semantic.typography.wrap.light.-2}",
           },
           "-1": {
+            key: "{semantic.typography.wrap.light.-1}",
             value: {
               fontWeight: "300",
               lineHeight: "1.375",
@@ -8000,14 +8264,15 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.light.-1}",
             },
             name: "Typography Wrap Light Minus 1",
             path: ["semantic", "typography", "wrap", "light", "-1"],
-            key: "{semantic.typography.wrap.light.-1}",
           },
         },
         regular: {
           0: {
+            key: "{semantic.typography.wrap.regular.0}",
             value: {
               lineHeight: "1.375",
               fontSize: "16px",
@@ -8063,12 +8328,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.0}",
             },
             name: "Typography Wrap Regular 0",
             path: ["semantic", "typography", "wrap", "regular", "0"],
-            key: "{semantic.typography.wrap.regular.0}",
           },
           1: {
+            key: "{semantic.typography.wrap.regular.1}",
             value: {
               lineHeight: "1.375",
               fontSize: "18px",
@@ -8124,12 +8390,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.1}",
             },
             name: "Typography Wrap Regular 1",
             path: ["semantic", "typography", "wrap", "regular", "1"],
-            key: "{semantic.typography.wrap.regular.1}",
           },
           2: {
+            key: "{semantic.typography.wrap.regular.2}",
             value: {
               lineHeight: "1.375",
               fontSize: "20px",
@@ -8185,12 +8452,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.2}",
             },
             name: "Typography Wrap Regular 2",
             path: ["semantic", "typography", "wrap", "regular", "2"],
-            key: "{semantic.typography.wrap.regular.2}",
           },
           3: {
+            key: "{semantic.typography.wrap.regular.3}",
             value: {
               lineHeight: "1.375",
               fontSize: "24px",
@@ -8246,12 +8514,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.3}",
             },
             name: "Typography Wrap Regular 3",
             path: ["semantic", "typography", "wrap", "regular", "3"],
-            key: "{semantic.typography.wrap.regular.3}",
           },
           "-2": {
+            key: "{semantic.typography.wrap.regular.-2}",
             value: {
               lineHeight: "1.375",
               fontSize: "12px",
@@ -8307,12 +8576,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.-2}",
             },
             name: "Typography Wrap Regular Minus 2",
             path: ["semantic", "typography", "wrap", "regular", "-2"],
-            key: "{semantic.typography.wrap.regular.-2}",
           },
           "-1": {
+            key: "{semantic.typography.wrap.regular.-1}",
             value: {
               lineHeight: "1.375",
             },
@@ -8366,14 +8636,15 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.regular.-1}",
             },
             name: "Typography Wrap Regular Minus 1",
             path: ["semantic", "typography", "wrap", "regular", "-1"],
-            key: "{semantic.typography.wrap.regular.-1}",
           },
         },
         medium: {
           0: {
+            key: "{semantic.typography.wrap.medium.0}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8431,12 +8702,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.0}",
             },
             name: "Typography Wrap Medium 0",
             path: ["semantic", "typography", "wrap", "medium", "0"],
-            key: "{semantic.typography.wrap.medium.0}",
           },
           1: {
+            key: "{semantic.typography.wrap.medium.1}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8494,12 +8766,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.1}",
             },
             name: "Typography Wrap Medium 1",
             path: ["semantic", "typography", "wrap", "medium", "1"],
-            key: "{semantic.typography.wrap.medium.1}",
           },
           2: {
+            key: "{semantic.typography.wrap.medium.2}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8557,12 +8830,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.2}",
             },
             name: "Typography Wrap Medium 2",
             path: ["semantic", "typography", "wrap", "medium", "2"],
-            key: "{semantic.typography.wrap.medium.2}",
           },
           3: {
+            key: "{semantic.typography.wrap.medium.3}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8620,12 +8894,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.3}",
             },
             name: "Typography Wrap Medium 3",
             path: ["semantic", "typography", "wrap", "medium", "3"],
-            key: "{semantic.typography.wrap.medium.3}",
           },
           "-2": {
+            key: "{semantic.typography.wrap.medium.-2}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8683,12 +8958,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.-2}",
             },
             name: "Typography Wrap Medium Minus 2",
             path: ["semantic", "typography", "wrap", "medium", "-2"],
-            key: "{semantic.typography.wrap.medium.-2}",
           },
           "-1": {
+            key: "{semantic.typography.wrap.medium.-1}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -8744,14 +9020,15 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.medium.-1}",
             },
             name: "Typography Wrap Medium Minus 1",
             path: ["semantic", "typography", "wrap", "medium", "-1"],
-            key: "{semantic.typography.wrap.medium.-1}",
           },
         },
         bold: {
           0: {
+            key: "{semantic.typography.wrap.bold.0}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -8809,12 +9086,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.0}",
             },
             name: "Typography Wrap Bold 0",
             path: ["semantic", "typography", "wrap", "bold", "0"],
-            key: "{semantic.typography.wrap.bold.0}",
           },
           1: {
+            key: "{semantic.typography.wrap.bold.1}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -8872,12 +9150,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.1}",
             },
             name: "Typography Wrap Bold 1",
             path: ["semantic", "typography", "wrap", "bold", "1"],
-            key: "{semantic.typography.wrap.bold.1}",
           },
           2: {
+            key: "{semantic.typography.wrap.bold.2}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -8935,12 +9214,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.2}",
             },
             name: "Typography Wrap Bold 2",
             path: ["semantic", "typography", "wrap", "bold", "2"],
-            key: "{semantic.typography.wrap.bold.2}",
           },
           3: {
+            key: "{semantic.typography.wrap.bold.3}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -8998,12 +9278,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.3}",
             },
             name: "Typography Wrap Bold 3",
             path: ["semantic", "typography", "wrap", "bold", "3"],
-            key: "{semantic.typography.wrap.bold.3}",
           },
           "-2": {
+            key: "{semantic.typography.wrap.bold.-2}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -9061,12 +9342,13 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.-2}",
             },
             name: "Typography Wrap Bold Minus 2",
             path: ["semantic", "typography", "wrap", "bold", "-2"],
-            key: "{semantic.typography.wrap.bold.-2}",
           },
           "-1": {
+            key: "{semantic.typography.wrap.bold.-1}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -9122,16 +9404,17 @@ export default {
               attributes: {
                 category: "wrap",
               },
+              key: "{semantic.typography.wrap.bold.-1}",
             },
             name: "Typography Wrap Bold Minus 1",
             path: ["semantic", "typography", "wrap", "bold", "-1"],
-            key: "{semantic.typography.wrap.bold.-1}",
           },
         },
       },
       hierarchy: {
         display: {
           1: {
+            key: "{semantic.typography.hierarchy.display.1}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -9160,21 +9443,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.semibold}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.xxl}",
-              },
+              value: "{semantic.typography.wrap.bold.3}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.display.1}",
             },
             name: "Typography Hierarchy Display 1",
             path: ["semantic", "typography", "hierarchy", "display", "1"],
-            key: "{semantic.typography.hierarchy.display.1}",
           },
           2: {
+            key: "{semantic.typography.hierarchy.display.2}",
             value: {
               fontWeight: "600",
               lineHeight: "1.375",
@@ -9203,23 +9483,20 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.semibold}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.xl}",
-              },
+              value: "{semantic.typography.wrap.bold.2}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.display.2}",
             },
             name: "Typography Hierarchy Display 2",
             path: ["semantic", "typography", "hierarchy", "display", "2"],
-            key: "{semantic.typography.hierarchy.display.2}",
           },
         },
         heading: {
           1: {
+            key: "{semantic.typography.hierarchy.heading.1}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -9248,21 +9525,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.medium}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.xxl}",
-              },
+              value: "{semantic.typography.wrap.medium.3}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.heading.1}",
             },
             name: "Typography Hierarchy Heading 1",
             path: ["semantic", "typography", "hierarchy", "heading", "1"],
-            key: "{semantic.typography.hierarchy.heading.1}",
           },
           2: {
+            key: "{semantic.typography.hierarchy.heading.2}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -9291,21 +9565,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.medium}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.xl}",
-              },
+              value: "{semantic.typography.wrap.medium.2}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.heading.2}",
             },
             name: "Typography Hierarchy Heading 2",
             path: ["semantic", "typography", "hierarchy", "heading", "2"],
-            key: "{semantic.typography.hierarchy.heading.2}",
           },
           3: {
+            key: "{semantic.typography.hierarchy.heading.3}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -9334,21 +9605,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.medium}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.lg}",
-              },
+              value: "{semantic.typography.wrap.medium.1}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.heading.3}",
             },
             name: "Typography Hierarchy Heading 3",
             path: ["semantic", "typography", "hierarchy", "heading", "3"],
-            key: "{semantic.typography.hierarchy.heading.3}",
           },
           4: {
+            key: "{semantic.typography.hierarchy.heading.4}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -9377,21 +9645,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.medium}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-                fontSize: "{semantic.font.size.md}",
-              },
+              value: "{semantic.typography.wrap.medium.0}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.heading.4}",
             },
             name: "Typography Hierarchy Heading 4",
             path: ["semantic", "typography", "hierarchy", "heading", "4"],
-            key: "{semantic.typography.hierarchy.heading.4}",
           },
           5: {
+            key: "{semantic.typography.hierarchy.heading.5}",
             value: {
               fontWeight: "500",
               lineHeight: "1.375",
@@ -9419,22 +9684,20 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontWeight: "{semantic.font.weight.medium}",
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-              },
+              value: "{semantic.typography.wrap.medium.-1}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.heading.5}",
             },
             name: "Typography Hierarchy Heading 5",
             path: ["semantic", "typography", "hierarchy", "heading", "5"],
-            key: "{semantic.typography.hierarchy.heading.5}",
           },
         },
         body: {
           snug: {
+            key: "{semantic.typography.hierarchy.body.snug}",
             value: {
               lineHeight: "1.375",
             },
@@ -9461,19 +9724,18 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                lineHeight: "{semantic.font.line-height.relative.snug}",
-              },
+              value: "{semantic.typography.wrap.regular.-1}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.body.snug}",
             },
             name: "Typography Hierarchy Body Snug",
             path: ["semantic", "typography", "hierarchy", "body", "snug"],
-            key: "{semantic.typography.hierarchy.body.snug}",
           },
           default: {
+            key: "{semantic.typography.hierarchy.body.default}",
             value: {
               fontFamily: [
                 "Avenir Next",
@@ -9512,27 +9774,19 @@ export default {
             filePath: "src/tokens/semantic/typography.json",
             isSource: true,
             original: {
-              value: {
-                fontFamily: "{semantic.font.family.default}",
-                fontSize: "{semantic.font.size.default}",
-                fontWeight: "{semantic.font.weight.regular}",
-                letterSpacing: "{semantic.font.letter-spacing.normal}",
-                lineHeight: "{semantic.font.line-height.fixed.base}",
-                paragraphSpacing: "{semantic.font.paragraph-spacing.normal}",
-                textCase: "{semantic.font.text-case.none}",
-                textDecoration: "{semantic.font.text-decoration.none}",
-              },
+              value: "{semantic.typography.default.default}",
               type: "typography",
               attributes: {
                 category: "hierarchy",
               },
+              key: "{semantic.typography.hierarchy.body.default}",
             },
             name: "Typography Hierarchy Body",
             path: ["semantic", "typography", "hierarchy", "body", "default"],
-            key: "{semantic.typography.hierarchy.body.default}",
           },
         },
         overline: {
+          key: "{semantic.typography.hierarchy.overline}",
           value: {
             lineHeight: "12px",
             textCase: "uppercase",
@@ -9569,12 +9823,13 @@ export default {
             attributes: {
               category: "hierarchy",
             },
+            key: "{semantic.typography.hierarchy.overline}",
           },
           name: "Typography Hierarchy Overline",
           path: ["semantic", "typography", "hierarchy", "overline"],
-          key: "{semantic.typography.hierarchy.overline}",
         },
         caption: {
+          key: "{semantic.typography.hierarchy.caption}",
           value: {
             lineHeight: "1.375",
             fontSize: "12px",
@@ -9601,23 +9856,21 @@ export default {
           filePath: "src/tokens/semantic/typography.json",
           isSource: true,
           original: {
-            value: {
-              lineHeight: "{semantic.font.line-height.relative.snug}",
-              fontSize: "{semantic.font.size.sm}",
-            },
+            value: "{semantic.typography.wrap.regular.-2}",
             type: "typography",
             attributes: {
               category: "hierarchy",
             },
+            key: "{semantic.typography.hierarchy.caption}",
           },
           name: "Typography Hierarchy Caption",
           path: ["semantic", "typography", "hierarchy", "caption"],
-          key: "{semantic.typography.hierarchy.caption}",
         },
       },
     },
     "z-index": {
       deep: {
+        key: "{semantic.z-index.deep}",
         value: "-999999",
         type: "z-index",
         attributes: {
@@ -9645,12 +9898,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.deep}",
         },
         name: "Z Index Deep",
         path: ["semantic", "z-index", "deep"],
-        key: "{semantic.z-index.deep}",
       },
       default: {
+        key: "{semantic.z-index.default}",
         value: "1",
         type: "z-index",
         attributes: {
@@ -9678,12 +9932,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.default}",
         },
         name: "Z Index",
         path: ["semantic", "z-index", "default"],
-        key: "{semantic.z-index.default}",
       },
       sticky: {
+        key: "{semantic.z-index.sticky}",
         value: "300",
         type: "z-index",
         attributes: {
@@ -9711,12 +9966,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.sticky}",
         },
         name: "Z Index Sticky",
         path: ["semantic", "z-index", "sticky"],
-        key: "{semantic.z-index.sticky}",
       },
       header: {
+        key: "{semantic.z-index.header}",
         value: "400",
         type: "z-index",
         attributes: {
@@ -9744,12 +10000,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.header}",
         },
         name: "Z Index Header",
         path: ["semantic", "z-index", "header"],
-        key: "{semantic.z-index.header}",
       },
       toast: {
+        key: "{semantic.z-index.toast}",
         value: "500",
         type: "z-index",
         attributes: {
@@ -9777,12 +10034,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.toast}",
         },
         name: "Z Index Toast",
         path: ["semantic", "z-index", "toast"],
-        key: "{semantic.z-index.toast}",
       },
       dropdown: {
+        key: "{semantic.z-index.dropdown}",
         value: "600",
         type: "z-index",
         attributes: {
@@ -9810,12 +10068,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.dropdown}",
         },
         name: "Z Index Dropdown",
         path: ["semantic", "z-index", "dropdown"],
-        key: "{semantic.z-index.dropdown}",
       },
       overlay: {
+        key: "{semantic.z-index.overlay}",
         value: "700",
         type: "z-index",
         attributes: {
@@ -9843,12 +10102,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.overlay}",
         },
         name: "Z Index Overlay",
         path: ["semantic", "z-index", "overlay"],
-        key: "{semantic.z-index.overlay}",
       },
       modal: {
+        key: "{semantic.z-index.modal}",
         value: "800",
         type: "z-index",
         attributes: {
@@ -9876,12 +10136,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.modal}",
         },
         name: "Z Index Modal",
         path: ["semantic", "z-index", "modal"],
-        key: "{semantic.z-index.modal}",
       },
       popup: {
+        key: "{semantic.z-index.popup}",
         value: "900",
         type: "z-index",
         attributes: {
@@ -9909,12 +10170,13 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.popup}",
         },
         name: "Z Index Popup",
         path: ["semantic", "z-index", "popup"],
-        key: "{semantic.z-index.popup}",
       },
       tooltip: {
+        key: "{semantic.z-index.tooltip}",
         value: "901",
         type: "z-index",
         attributes: {
@@ -9942,10 +10204,10 @@ export default {
           attributes: {
             category: "z-index",
           },
+          key: "{semantic.z-index.tooltip}",
         },
         name: "Z Index Tooltip",
         path: ["semantic", "z-index", "tooltip"],
-        key: "{semantic.z-index.tooltip}",
       },
     },
   },