@phcdevworks/spectre-tokens 4.3.0 → 4.5.0

package/README.md

@@ -17,7 +17,7 @@ contracts for specific frameworks and runtimes.
 | Project team           | `project-design`                 |
 | Repository role        | Spectre L1 design-token contract |
 | Package/artifact       | `@phcdevworks/spectre-tokens`    |
-| Current version/status | 4.3.0                            |
+| Current version/status | 4.5.0                            |
 
 ## Standard Workflow
 
@@ -301,6 +301,7 @@ The generated token object includes these namespaces:
 - `text`
 - `component`
 - `modes`
+- `tracking`
 
 The exported runtime token object is a flattened string-based tree generated
 from `tokens/`. Source-only wrapper fields such as `value` and `metadata` are

package/dist/index.cjs

@@ -1209,7 +1209,14 @@ var coreTokens = {
     "md": "0 2px 6px -1px {colors.black} / 0.08",
     "lg": "0 6px 16px -4px {colors.black} / 0.12",
     "xl": "0 12px 24px -6px {colors.black} / 0.15",
-    "2xl": "0 20px 48px -12px {colors.black} / 0.20"
+    "2xl": "0 20px 48px -12px {colors.black} / 0.20",
+    "inset": {
+      "sm": "inset 0 1px 2px 0 {colors.black} / 0.06, inset 0 -1px 2px 0 {colors.black} / 0.06",
+      "md": "inset 0 2px 6px -1px {colors.black} / 0.08, inset 0 -2px 6px -1px {colors.black} / 0.08",
+      "lg": "inset 0 6px 16px -4px {colors.black} / 0.12, inset 0 -6px 16px -4px {colors.black} / 0.12",
+      "xl": "inset 0 12px 24px -6px {colors.black} / 0.15, inset 0 -12px 24px -6px {colors.black} / 0.15",
+      "2xl": "inset 0 20px 48px -12px {colors.black} / 0.20, inset 0 -20px 48px -12px {colors.black} / 0.20"
+    }
   },
   "breakpoints": {
     "sm": "640px",
@@ -1386,6 +1393,15 @@ var coreTokens = {
       "dotted": "dotted"
     }
   },
+  "tracking": {
+    "tightest": "-0.075em",
+    "tighter": "-0.05em",
+    "tight": "-0.025em",
+    "normal": "0em",
+    "wide": "0.025em",
+    "wider": "0.05em",
+    "widest": "0.1em"
+  },
   "surface": {
     "page": "{colors.neutral.50}",
     "card": "{colors.white}",
@@ -1784,6 +1800,12 @@ var createCssVariableMap = (tokens2, options = {}) => {
   Object.entries(baseTokens.radii).forEach(([key, value]) => {
     assign(toVariableName(prefix, "radius", key), value);
   });
+  const tracking = baseTokens.tracking;
+  if (tracking) {
+    Object.entries(tracking).forEach(([key, value]) => {
+      assign(toVariableName(prefix, "tracking", key), value);
+    });
+  }
   const icons = baseTokens.icons;
   if (icons) {
     Object.entries(icons).forEach(([key, value]) => {
@@ -1836,7 +1858,13 @@ var createCssVariableMap = (tokens2, options = {}) => {
     assignRole(["body"], body);
   }
   Object.entries(baseTokens.shadows).forEach(([key, value]) => {
-    assign(toVariableName(prefix, "shadow", key), value);
+    if (typeof value === "string") {
+      assign(toVariableName(prefix, "shadow", key), value);
+      return;
+    }
+    Object.entries(value).forEach(([nestedKey, nestedValue]) => {
+      assign(toVariableName(prefix, "shadow", key, nestedKey), nestedValue);
+    });
   });
   Object.entries(baseTokens.breakpoints).forEach(([key, value]) => {
     assign(toVariableName(prefix, "breakpoint", key), value);