@primer/primitives 11.4.0 → 11.4.1-rc.24c79953

package/dist/docs/base/motion/motion.json

@@ -4,14 +4,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "0ms",
+      "$value": {
+        "value": 0,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.0}"
     },
     "name": "base-duration-0",
     "attributes": {},
     "path": ["base", "duration", "0"],
-    "value": "0ms",
+    "value": {
+      "value": 0,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-100": {
@@ -19,14 +25,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "100ms",
+      "$value": {
+        "value": 100,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.100}"
     },
     "name": "base-duration-100",
     "attributes": {},
     "path": ["base", "duration", "100"],
-    "value": "100ms",
+    "value": {
+      "value": 100,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-1000": {
@@ -34,14 +46,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "1000ms",
+      "$value": {
+        "value": 1000,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.1000}"
     },
     "name": "base-duration-1000",
     "attributes": {},
     "path": ["base", "duration", "1000"],
-    "value": "1000ms",
+    "value": {
+      "value": 1000,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-200": {
@@ -49,14 +67,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "200ms",
+      "$value": {
+        "value": 200,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.200}"
     },
     "name": "base-duration-200",
     "attributes": {},
     "path": ["base", "duration", "200"],
-    "value": "200ms",
+    "value": {
+      "value": 200,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-300": {
@@ -64,14 +88,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "300ms",
+      "$value": {
+        "value": 300,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.300}"
     },
     "name": "base-duration-300",
     "attributes": {},
     "path": ["base", "duration", "300"],
-    "value": "300ms",
+    "value": {
+      "value": 300,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-400": {
@@ -79,14 +109,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "400ms",
+      "$value": {
+        "value": 400,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.400}"
     },
     "name": "base-duration-400",
     "attributes": {},
     "path": ["base", "duration", "400"],
-    "value": "400ms",
+    "value": {
+      "value": 400,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-50": {
@@ -94,14 +130,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "50ms",
+      "$value": {
+        "value": 50,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.50}"
     },
     "name": "base-duration-50",
     "attributes": {},
     "path": ["base", "duration", "50"],
-    "value": "50ms",
+    "value": {
+      "value": 50,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-500": {
@@ -109,14 +151,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "500ms",
+      "$value": {
+        "value": 500,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.500}"
     },
     "name": "base-duration-500",
     "attributes": {},
     "path": ["base", "duration", "500"],
-    "value": "500ms",
+    "value": {
+      "value": 500,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-600": {
@@ -124,14 +172,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "600ms",
+      "$value": {
+        "value": 600,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.600}"
     },
     "name": "base-duration-600",
     "attributes": {},
     "path": ["base", "duration", "600"],
-    "value": "600ms",
+    "value": {
+      "value": 600,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-700": {
@@ -139,14 +193,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "700ms",
+      "$value": {
+        "value": 700,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.700}"
     },
     "name": "base-duration-700",
     "attributes": {},
     "path": ["base", "duration", "700"],
-    "value": "700ms",
+    "value": {
+      "value": 700,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-800": {
@@ -154,14 +214,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "800ms",
+      "$value": {
+        "value": 800,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.800}"
     },
     "name": "base-duration-800",
     "attributes": {},
     "path": ["base", "duration", "800"],
-    "value": "800ms",
+    "value": {
+      "value": 800,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-duration-900": {
@@ -169,14 +235,20 @@
     "filePath": "src/tokens/base/motion/timing.json5",
     "isSource": true,
     "original": {
-      "$value": "900ms",
+      "$value": {
+        "value": 900,
+        "unit": "ms"
+      },
       "$type": "duration",
       "key": "{base.duration.900}"
     },
     "name": "base-duration-900",
     "attributes": {},
     "path": ["base", "duration", "900"],
-    "value": "900ms",
+    "value": {
+      "value": 900,
+      "unit": "ms"
+    },
     "type": "duration"
   },
   "base-easing-ease": {

package/dist/docs/base/size/size.json

@@ -10,7 +10,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "112px",
+      "$value": {
+        "value": 112,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -37,7 +40,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "12px",
+      "$value": {
+        "value": 12,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -64,7 +70,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "128px",
+      "$value": {
+        "value": 128,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -91,7 +100,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "16px",
+      "$value": {
+        "value": 16,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -118,7 +130,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "2px",
+      "$value": {
+        "value": 2,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -145,7 +160,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "20px",
+      "$value": {
+        "value": 20,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -172,7 +190,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "24px",
+      "$value": {
+        "value": 24,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -199,7 +220,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "28px",
+      "$value": {
+        "value": 28,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -226,7 +250,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "32px",
+      "$value": {
+        "value": 32,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -253,7 +280,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "36px",
+      "$value": {
+        "value": 36,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -280,7 +310,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "4px",
+      "$value": {
+        "value": 4,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -307,7 +340,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "40px",
+      "$value": {
+        "value": 40,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -334,7 +370,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "44px",
+      "$value": {
+        "value": 44,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -361,7 +400,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "48px",
+      "$value": {
+        "value": 48,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -388,7 +430,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "6px",
+      "$value": {
+        "value": 6,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -415,7 +460,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "64px",
+      "$value": {
+        "value": 64,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -442,7 +490,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "8px",
+      "$value": {
+        "value": 8,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -469,7 +520,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "80px",
+      "$value": {
+        "value": 80,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -496,7 +550,10 @@
     "filePath": "src/tokens/base/size/size.json5",
     "isSource": true,
     "original": {
-      "$value": "96px",
+      "$value": {
+        "value": 96,
+        "unit": "px"
+      },
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {

package/dist/docs/base/typography/typography.json

@@ -155,7 +155,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "2.5rem",
+      "$value": {
+        "value": 2.5,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "40px - Display text for hero sections.",
       "$extensions": {
@@ -184,7 +187,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "1.25rem",
+      "$value": {
+        "value": 1.25,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "20px - Medium titles and subtitles.",
       "$extensions": {
@@ -213,7 +219,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "1rem",
+      "$value": {
+        "value": 1,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "16px - Large body text and small titles.",
       "$extensions": {
@@ -242,7 +251,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "0.875rem",
+      "$value": {
+        "value": 0.875,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "14px - Default body text size for UI.",
       "$extensions": {
@@ -271,7 +283,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "2rem",
+      "$value": {
+        "value": 2,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "32px - Large titles and page headings.",
       "$extensions": {
@@ -300,7 +315,10 @@
     "filePath": "src/tokens/base/typography/typography.json5",
     "isSource": true,
     "original": {
-      "$value": "0.75rem",
+      "$value": {
+        "value": 0.75,
+        "unit": "rem"
+      },
       "$type": "dimension",
       "$description": "12px - Smallest text size for captions and compact UI elements.",
       "$extensions": {

package/dist/docs/functional/size/border.json

@@ -43,7 +43,10 @@
     "filePath": "src/tokens/functional/size/border.json5",
     "isSource": true,
     "original": {
-      "$value": "2px",
+      "$value": {
+        "value": 2,
+        "unit": "px"
+      },
       "$description": "Thick 2px border for emphasis. Use for focus indicators, selected states, or to emphasize important boundaries",
       "$type": "dimension",
       "$extensions": {
@@ -76,7 +79,10 @@
     "filePath": "src/tokens/functional/size/border.json5",
     "isSource": true,
     "original": {
-      "$value": "4px",
+      "$value": {
+        "value": 4,
+        "unit": "px"
+      },
       "$description": "Extra thick 4px border for maximum emphasis. Use sparingly for high-contrast focus indicators or critical visual separators",
       "$type": "dimension",
       "$extensions": {
@@ -105,7 +111,10 @@
     "filePath": "src/tokens/functional/size/border.json5",
     "isSource": true,
     "original": {
-      "$value": "1px",
+      "$value": {
+        "value": 1,
+        "unit": "px"
+      },
       "$description": "Standard 1px border width. Use for most borders, dividers, and outlines throughout the interface",
       "$type": "dimension",
       "$extensions": {
@@ -130,14 +139,14 @@
     "original": {
       "$value": "inset 0 0 0 {borderWidth.thick}",
       "$description": "Thick shadow (2px) used instead of a border for emphasis without layout shift",
-      "$type": "string",
+      "$type": "custom-string",
       "key": "{boxShadow.thick}"
     },
     "name": "boxShadow-thick",
     "attributes": {},
     "path": ["boxShadow", "thick"],
     "value": "inset 0 0 0 0.125rem",
-    "type": "string",
+    "type": "custom-string",
     "description": "Thick shadow (2px) used instead of a border for emphasis without layout shift"
   },
   "boxShadow-thicker": {
@@ -147,14 +156,14 @@
     "original": {
       "$value": "inset 0 0 0 {borderWidth.thicker}",
       "$description": "Thickest shadow (4px) used for high emphasis borders without layout shift. Use sparingly for maximum visual impact",
-      "$type": "string",
+      "$type": "custom-string",
       "key": "{boxShadow.thicker}"
     },
     "name": "boxShadow-thicker",
     "attributes": {},
     "path": ["boxShadow", "thicker"],
     "value": "inset 0 0 0 0.25rem",
-    "type": "string",
+    "type": "custom-string",
     "description": "Thickest shadow (4px) used for high emphasis borders without layout shift. Use sparingly for maximum visual impact"
   },
   "boxShadow-thin": {
@@ -164,14 +173,14 @@
     "original": {
       "$value": "inset 0 0 0 {borderWidth.thin}",
       "$description": "Thin shadow used instead of a border to prevent layout shift",
-      "$type": "string",
+      "$type": "custom-string",
       "key": "{boxShadow.thin}"
     },
     "name": "boxShadow-thin",
     "attributes": {},
     "path": ["boxShadow", "thin"],
     "value": "inset 0 0 0 0.0625rem",
-    "type": "string",
+    "type": "custom-string",
     "description": "Thin shadow used instead of a border to prevent layout shift"
   },
   "outline-focus-offset": {
@@ -185,7 +194,10 @@
     "filePath": "src/tokens/functional/size/border.json5",
     "isSource": true,
     "original": {
-      "$value": "-2px",
+      "$value": {
+        "value": -2,
+        "unit": "px"
+      },
       "$description": "Focus outline offset (-2px). Negative value creates an inset outline for keyboard focus indicators, ensuring the focus ring stays within the element bounds",
       "$type": "dimension",
       "$extensions": {
@@ -218,7 +230,10 @@
     "filePath": "src/tokens/functional/size/border.json5",
     "isSource": true,
     "original": {
-      "$value": "2px",
+      "$value": {
+        "value": 2,
+        "unit": "px"
+      },
       "$description": "Focus outline width (2px). Standard width for keyboard focus indicators to meet WCAG 2.4.7 accessibility requirements",
       "$type": "dimension",
       "$extensions": {