@primer/primitives 11.4.0 → 11.4.1-rc.0499d5a6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/DESIGN_TOKENS_GUIDE.md +185 -0
  2. package/DESIGN_TOKENS_SPEC.md +565 -0
  3. package/dist/build/formats/jsonFigma.js +8 -1
  4. package/dist/build/formats/markdownLlmGuidelines.d.ts +7 -6
  5. package/dist/build/formats/markdownLlmGuidelines.js +1034 -60
  6. package/dist/build/schemas/borderToken.d.ts +61 -5
  7. package/dist/build/schemas/borderToken.js +2 -1
  8. package/dist/build/schemas/colorToken.d.ts +639 -30
  9. package/dist/build/schemas/colorToken.js +3 -2
  10. package/dist/build/schemas/colorW3cValue.d.ts +28 -0
  11. package/dist/build/schemas/colorW3cValue.js +42 -0
  12. package/dist/build/schemas/cubicBezierToken.d.ts +1 -1
  13. package/dist/build/schemas/dimensionToken.d.ts +9 -2
  14. package/dist/build/schemas/dimensionValue.d.ts +12 -1
  15. package/dist/build/schemas/dimensionValue.js +10 -13
  16. package/dist/build/schemas/durationToken.d.ts +8 -2
  17. package/dist/build/schemas/durationValue.d.ts +11 -1
  18. package/dist/build/schemas/durationValue.js +13 -3
  19. package/dist/build/schemas/fontFamilyToken.d.ts +1 -1
  20. package/dist/build/schemas/fontWeightToken.d.ts +1 -1
  21. package/dist/build/schemas/gradientToken.d.ts +23 -2
  22. package/dist/build/schemas/gradientToken.js +2 -1
  23. package/dist/build/schemas/numberToken.d.ts +1 -1
  24. package/dist/build/schemas/shadowToken.d.ts +1751 -127
  25. package/dist/build/schemas/shadowToken.js +8 -2
  26. package/dist/build/schemas/stringToken.d.ts +1 -1
  27. package/dist/build/schemas/stringToken.js +1 -1
  28. package/dist/build/schemas/tokenType.d.ts +1 -1
  29. package/dist/build/schemas/transitionToken.d.ts +15 -3
  30. package/dist/build/schemas/typographyToken.d.ts +19 -5
  31. package/dist/build/schemas/typographyToken.js +1 -1
  32. package/dist/build/schemas/validTokenType.d.ts +1 -1
  33. package/dist/build/schemas/validTokenType.js +1 -1
  34. package/dist/build/schemas/viewportRangeToken.d.ts +1 -1
  35. package/dist/build/transformers/borderToCss.js +19 -1
  36. package/dist/build/transformers/colorAlphaToCss.js +6 -3
  37. package/dist/build/transformers/colorToHex.js +5 -2
  38. package/dist/build/transformers/colorToRgbAlpha.js +5 -2
  39. package/dist/build/transformers/colorToRgbaFloat.js +5 -0
  40. package/dist/build/transformers/dimensionToPixelUnitless.d.ts +3 -2
  41. package/dist/build/transformers/dimensionToPixelUnitless.js +22 -26
  42. package/dist/build/transformers/dimensionToRem.d.ts +2 -1
  43. package/dist/build/transformers/dimensionToRem.js +21 -22
  44. package/dist/build/transformers/dimensionToRemPxArray.d.ts +2 -1
  45. package/dist/build/transformers/dimensionToRemPxArray.js +21 -22
  46. package/dist/build/transformers/durationToCss.d.ts +2 -1
  47. package/dist/build/transformers/durationToCss.js +18 -11
  48. package/dist/build/transformers/gradientToCss.js +2 -1
  49. package/dist/build/transformers/shadowToCss.js +15 -1
  50. package/dist/build/transformers/utilities/normalizeColorValue.d.ts +23 -0
  51. package/dist/build/transformers/utilities/normalizeColorValue.js +74 -0
  52. package/dist/build/transformers/utilities/parseDimension.d.ts +12 -0
  53. package/dist/build/transformers/utilities/parseDimension.js +31 -0
  54. package/dist/build/types/borderTokenValue.d.ts +5 -2
  55. package/dist/build/types/dimensionTokenValue.d.ts +9 -0
  56. package/dist/build/types/shadowTokenValue.d.ts +8 -5
  57. package/dist/css/functional/themes/dark-colorblind-high-contrast.css +32 -28
  58. package/dist/css/functional/themes/dark-colorblind.css +32 -28
  59. package/dist/css/functional/themes/dark-dimmed-high-contrast.css +32 -28
  60. package/dist/css/functional/themes/dark-dimmed.css +32 -28
  61. package/dist/css/functional/themes/dark-high-contrast.css +32 -28
  62. package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +32 -28
  63. package/dist/css/functional/themes/dark-tritanopia.css +32 -28
  64. package/dist/css/functional/themes/dark.css +32 -28
  65. package/dist/css/functional/themes/light-colorblind-high-contrast.css +32 -28
  66. package/dist/css/functional/themes/light-colorblind.css +32 -28
  67. package/dist/css/functional/themes/light-high-contrast.css +32 -28
  68. package/dist/css/functional/themes/light-tritanopia-high-contrast.css +32 -28
  69. package/dist/css/functional/themes/light-tritanopia.css +32 -28
  70. package/dist/css/functional/themes/light.css +32 -28
  71. package/dist/css/primitives.css +4 -0
  72. package/dist/docs/base/motion/motion.json +96 -24
  73. package/dist/docs/base/size/size.json +76 -19
  74. package/dist/docs/base/typography/typography.json +24 -6
  75. package/dist/docs/functional/size/border.json +26 -11
  76. package/dist/docs/functional/size/breakpoints.json +24 -6
  77. package/dist/docs/functional/size/radius.json +16 -4
  78. package/dist/docs/functional/size/size.json +60 -15
  79. package/dist/docs/functional/themes/dark-colorblind-high-contrast.json +2629 -346
  80. package/dist/docs/functional/themes/dark-colorblind.json +2629 -346
  81. package/dist/docs/functional/themes/dark-dimmed-high-contrast.json +2629 -346
  82. package/dist/docs/functional/themes/dark-dimmed.json +2629 -346
  83. package/dist/docs/functional/themes/dark-high-contrast.json +2629 -346
  84. package/dist/docs/functional/themes/dark-tritanopia-high-contrast.json +2629 -346
  85. package/dist/docs/functional/themes/dark-tritanopia.json +2629 -346
  86. package/dist/docs/functional/themes/dark.json +2629 -346
  87. package/dist/docs/functional/themes/light-colorblind-high-contrast.json +2635 -352
  88. package/dist/docs/functional/themes/light-colorblind.json +2632 -349
  89. package/dist/docs/functional/themes/light-high-contrast.json +2635 -352
  90. package/dist/docs/functional/themes/light-tritanopia-high-contrast.json +2635 -352
  91. package/dist/docs/functional/themes/light-tritanopia.json +2632 -349
  92. package/dist/docs/functional/themes/light.json +2632 -349
  93. package/dist/docs/functional/typography/typography.json +8 -2
  94. package/dist/fallbacks/base/motion/motion.json +48 -12
  95. package/dist/figma/themes/light-colorblind.json +4 -4
  96. package/dist/figma/themes/light-high-contrast.json +4 -4
  97. package/dist/figma/themes/light-tritanopia.json +4 -4
  98. package/dist/figma/themes/light.json +4 -4
  99. package/dist/internalCss/dark-colorblind-high-contrast.css +28 -28
  100. package/dist/internalCss/dark-colorblind.css +28 -28
  101. package/dist/internalCss/dark-dimmed-high-contrast.css +28 -28
  102. package/dist/internalCss/dark-dimmed.css +28 -28
  103. package/dist/internalCss/dark-high-contrast.css +28 -28
  104. package/dist/internalCss/dark-tritanopia-high-contrast.css +28 -28
  105. package/dist/internalCss/dark-tritanopia.css +28 -28
  106. package/dist/internalCss/dark.css +28 -28
  107. package/dist/internalCss/light-colorblind-high-contrast.css +28 -28
  108. package/dist/internalCss/light-colorblind.css +28 -28
  109. package/dist/internalCss/light-high-contrast.css +28 -28
  110. package/dist/internalCss/light-tritanopia-high-contrast.css +28 -28
  111. package/dist/internalCss/light-tritanopia.css +28 -28
  112. package/dist/internalCss/light.css +28 -28
  113. package/dist/styleLint/base/motion/motion.json +96 -24
  114. package/dist/styleLint/base/size/size.json +76 -19
  115. package/dist/styleLint/base/typography/typography.json +30 -12
  116. package/dist/styleLint/functional/size/border.json +27 -12
  117. package/dist/styleLint/functional/size/breakpoints.json +24 -6
  118. package/dist/styleLint/functional/size/radius.json +17 -5
  119. package/dist/styleLint/functional/size/size-coarse.json +3 -3
  120. package/dist/styleLint/functional/size/size-fine.json +3 -3
  121. package/dist/styleLint/functional/size/size.json +111 -66
  122. package/dist/styleLint/functional/themes/dark-colorblind-high-contrast.json +2757 -366
  123. package/dist/styleLint/functional/themes/dark-colorblind.json +2757 -366
  124. package/dist/styleLint/functional/themes/dark-dimmed-high-contrast.json +2757 -366
  125. package/dist/styleLint/functional/themes/dark-dimmed.json +2757 -366
  126. package/dist/styleLint/functional/themes/dark-high-contrast.json +2757 -366
  127. package/dist/styleLint/functional/themes/dark-tritanopia-high-contrast.json +2757 -366
  128. package/dist/styleLint/functional/themes/dark-tritanopia.json +2757 -366
  129. package/dist/styleLint/functional/themes/dark.json +2757 -366
  130. package/dist/styleLint/functional/themes/light-colorblind-high-contrast.json +2763 -372
  131. package/dist/styleLint/functional/themes/light-colorblind.json +2760 -369
  132. package/dist/styleLint/functional/themes/light-high-contrast.json +2763 -372
  133. package/dist/styleLint/functional/themes/light-tritanopia-high-contrast.json +2763 -372
  134. package/dist/styleLint/functional/themes/light-tritanopia.json +2760 -369
  135. package/dist/styleLint/functional/themes/light.json +2760 -369
  136. package/dist/styleLint/functional/typography/typography.json +28 -22
  137. package/package.json +9 -7
  138. package/src/tokens/base/motion/timing.json5 +12 -12
  139. package/src/tokens/base/size/size.json5 +194 -194
  140. package/src/tokens/base/typography/typography.json5 +6 -6
  141. package/src/tokens/component/avatar.json5 +72 -44
  142. package/src/tokens/component/button.json5 +1545 -1193
  143. package/src/tokens/functional/border/border.json5 +4 -1
  144. package/src/tokens/functional/color/bgColor.json5 +8 -0
  145. package/src/tokens/functional/color/display.json5 +7 -0
  146. package/src/tokens/functional/color/fgColor.json5 +8 -0
  147. package/src/tokens/functional/color/syntax.json5 +14 -0
  148. package/src/tokens/functional/shadow/shadow.json5 +1254 -163
  149. package/src/tokens/functional/size/border.json5 +8 -8
  150. package/src/tokens/functional/size/breakpoints.json5 +6 -6
  151. package/src/tokens/functional/size/radius.json5 +4 -4
  152. package/src/tokens/functional/size/size.json5 +15 -15
  153. package/src/tokens/functional/typography/typography.json5 +8 -4
  154. package/dist/build/parsers/index.d.ts +0 -1
  155. package/dist/build/parsers/index.js +0 -1
  156. package/dist/build/parsers/w3cJsonParser.d.ts +0 -6
  157. package/dist/build/parsers/w3cJsonParser.js +0 -25
  158. package/dist/removed/testing.json5 +0 -4
  159. package/guidelines/color.llm.md +0 -16
  160. package/guidelines/guidelines.llm.md +0 -34
  161. package/guidelines/motion.llm.md +0 -41
  162. package/guidelines/spacing.llm.md +0 -20
  163. package/guidelines/typography.llm.md +0 -14
  164. package/src/tokens/removed/testing.json5 +0 -4
  165. package/token-guidelines.llm.md +0 -695
@@ -165,7 +165,7 @@
165
165
  },
166
166
  "avatar-shadow": {
167
167
  "key": "{avatar.shadow}",
168
- "$value": "0px 0px 0px 2px #ffffffcc",
168
+ "$value": "0 0 0 2px #ffffffcc",
169
169
  "$type": "shadow",
170
170
  "$extensions": {
171
171
  "org.primer.figma": {
@@ -178,10 +178,22 @@
178
178
  {
179
179
  "color": "#f6f8fa",
180
180
  "alpha": 1,
181
- "offsetX": "0px",
182
- "offsetY": "0px",
183
- "blur": "0px",
184
- "spread": "2px"
181
+ "offsetX": {
182
+ "value": 0,
183
+ "unit": "px"
184
+ },
185
+ "offsetY": {
186
+ "value": 0,
187
+ "unit": "px"
188
+ },
189
+ "blur": {
190
+ "value": 0,
191
+ "unit": "px"
192
+ },
193
+ "spread": {
194
+ "value": 2,
195
+ "unit": "px"
196
+ }
185
197
  }
186
198
  ],
187
199
  "filePath": "src/tokens/component/avatar.json5",
@@ -197,10 +209,22 @@
197
209
  {
198
210
  "color": "{base.color.neutral.0}",
199
211
  "alpha": 0.8,
200
- "offsetX": "0px",
201
- "offsetY": "0px",
202
- "blur": "0px",
203
- "spread": "2px"
212
+ "offsetX": {
213
+ "value": 0,
214
+ "unit": "px"
215
+ },
216
+ "offsetY": {
217
+ "value": 0,
218
+ "unit": "px"
219
+ },
220
+ "blur": {
221
+ "value": 0,
222
+ "unit": "px"
223
+ },
224
+ "spread": {
225
+ "value": 2,
226
+ "unit": "px"
227
+ }
204
228
  }
205
229
  ],
206
230
  "$type": "shadow",
@@ -215,10 +239,22 @@
215
239
  {
216
240
  "color": "{base.color.neutral.1}",
217
241
  "alpha": 1,
218
- "offsetX": "0px",
219
- "offsetY": "0px",
220
- "blur": "0px",
221
- "spread": "2px"
242
+ "offsetX": {
243
+ "value": 0,
244
+ "unit": "px"
245
+ },
246
+ "offsetY": {
247
+ "value": 0,
248
+ "unit": "px"
249
+ },
250
+ "blur": {
251
+ "value": 0,
252
+ "unit": "px"
253
+ },
254
+ "spread": {
255
+ "value": 2,
256
+ "unit": "px"
257
+ }
222
258
  }
223
259
  ],
224
260
  "filePath": "src/tokens/component/avatar.json5",
@@ -546,6 +582,10 @@
546
582
  },
547
583
  "org.primer.overrides": {
548
584
  "dark": "#ffffff"
585
+ },
586
+ "org.primer.llm": {
587
+ "doNotUse": true,
588
+ "rules": "Avoid using raw black. Use semantic alternatives: bgColor.emphasis for dark backgrounds, bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
549
589
  }
550
590
  },
551
591
  "filePath": "src/tokens/functional/color/bgColor.json5",
@@ -562,6 +602,10 @@
562
602
  },
563
603
  "org.primer.overrides": {
564
604
  "dark": "{base.color.neutral.0}"
605
+ },
606
+ "org.primer.llm": {
607
+ "doNotUse": true,
608
+ "rules": "Avoid using raw black. Use semantic alternatives: bgColor.emphasis for dark backgrounds, bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
565
609
  }
566
610
  },
567
611
  "key": "{bgColor.black}"
@@ -2438,6 +2482,10 @@
2438
2482
  },
2439
2483
  "org.primer.overrides": {
2440
2484
  "dark": "#1f2328"
2485
+ },
2486
+ "org.primer.llm": {
2487
+ "doNotUse": true,
2488
+ "rules": "Avoid using raw white. Use semantic alternatives: bgColor.default for standard backgrounds, bgColor.inset for recessed areas, or bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
2441
2489
  }
2442
2490
  },
2443
2491
  "filePath": "src/tokens/functional/color/bgColor.json5",
@@ -2454,6 +2502,10 @@
2454
2502
  },
2455
2503
  "org.primer.overrides": {
2456
2504
  "dark": "{base.color.neutral.13}"
2505
+ },
2506
+ "org.primer.llm": {
2507
+ "doNotUse": true,
2508
+ "rules": "Avoid using raw white. Use semantic alternatives: bgColor.default for standard backgrounds, bgColor.inset for recessed areas, or bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
2457
2509
  }
2458
2510
  },
2459
2511
  "key": "{bgColor.white}"
@@ -2464,7 +2516,11 @@
2464
2516
  },
2465
2517
  "border-accent-emphasis": {
2466
2518
  "key": "{border.accent.emphasis}",
2467
- "$value": "0.00390625rem,0.0625px solid #0969da",
2519
+ "$value": {
2520
+ "color": "#0969da",
2521
+ "style": "solid",
2522
+ "width": ["0.0625rem", "1px"]
2523
+ },
2468
2524
  "$type": "border",
2469
2525
  "filePath": "src/tokens/functional/border/border.json5",
2470
2526
  "isSource": true,
@@ -2483,7 +2539,11 @@
2483
2539
  },
2484
2540
  "border-accent-muted": {
2485
2541
  "key": "{border.accent.muted}",
2486
- "$value": "0.00390625rem,0.0625px solid #54aeff66",
2542
+ "$value": {
2543
+ "color": "#54aeff66",
2544
+ "style": "solid",
2545
+ "width": ["0.0625rem", "1px"]
2546
+ },
2487
2547
  "$type": "border",
2488
2548
  "filePath": "src/tokens/functional/border/border.json5",
2489
2549
  "isSource": true,
@@ -2502,7 +2562,11 @@
2502
2562
  },
2503
2563
  "border-attention-emphasis": {
2504
2564
  "key": "{border.attention.emphasis}",
2505
- "$value": "0.00390625rem,0.0625px solid #9a6700",
2565
+ "$value": {
2566
+ "color": "#9a6700",
2567
+ "style": "solid",
2568
+ "width": ["0.0625rem", "1px"]
2569
+ },
2506
2570
  "$type": "border",
2507
2571
  "filePath": "src/tokens/functional/border/border.json5",
2508
2572
  "isSource": true,
@@ -2521,7 +2585,11 @@
2521
2585
  },
2522
2586
  "border-attention-muted": {
2523
2587
  "key": "{border.attention.muted}",
2524
- "$value": "0.00390625rem,0.0625px solid #d4a72c66",
2588
+ "$value": {
2589
+ "color": "#d4a72c66",
2590
+ "style": "solid",
2591
+ "width": ["0.0625rem", "1px"]
2592
+ },
2525
2593
  "$type": "border",
2526
2594
  "filePath": "src/tokens/functional/border/border.json5",
2527
2595
  "isSource": true,
@@ -2540,7 +2608,11 @@
2540
2608
  },
2541
2609
  "border-closed-emphasis": {
2542
2610
  "key": "{border.closed.emphasis}",
2543
- "$value": "0.00390625rem,0.0625px solid #cf222e",
2611
+ "$value": {
2612
+ "color": "#cf222e",
2613
+ "style": "solid",
2614
+ "width": ["0.0625rem", "1px"]
2615
+ },
2544
2616
  "$type": "border",
2545
2617
  "filePath": "src/tokens/functional/border/border.json5",
2546
2618
  "isSource": true,
@@ -2555,7 +2627,11 @@
2555
2627
  },
2556
2628
  "border-closed-muted": {
2557
2629
  "key": "{border.closed.muted}",
2558
- "$value": "0.00390625rem,0.0625px solid #ff818266",
2630
+ "$value": {
2631
+ "color": "#ff818266",
2632
+ "style": "solid",
2633
+ "width": ["0.0625rem", "1px"]
2634
+ },
2559
2635
  "$type": "border",
2560
2636
  "filePath": "src/tokens/functional/border/border.json5",
2561
2637
  "isSource": true,
@@ -2570,7 +2646,11 @@
2570
2646
  },
2571
2647
  "border-danger-emphasis": {
2572
2648
  "key": "{border.danger.emphasis}",
2573
- "$value": "0.00390625rem,0.0625px solid #cf222e",
2649
+ "$value": {
2650
+ "color": "#cf222e",
2651
+ "style": "solid",
2652
+ "width": ["0.0625rem", "1px"]
2653
+ },
2574
2654
  "$type": "border",
2575
2655
  "filePath": "src/tokens/functional/border/border.json5",
2576
2656
  "isSource": true,
@@ -2589,7 +2669,11 @@
2589
2669
  },
2590
2670
  "border-danger-muted": {
2591
2671
  "key": "{border.danger.muted}",
2592
- "$value": "0.00390625rem,0.0625px solid #ff818266",
2672
+ "$value": {
2673
+ "color": "#ff818266",
2674
+ "style": "solid",
2675
+ "width": ["0.0625rem", "1px"]
2676
+ },
2593
2677
  "$type": "border",
2594
2678
  "filePath": "src/tokens/functional/border/border.json5",
2595
2679
  "isSource": true,
@@ -2608,7 +2692,11 @@
2608
2692
  },
2609
2693
  "border-default": {
2610
2694
  "key": "{border.default}",
2611
- "$value": "0.00390625rem,0.0625px solid #d1d9e0",
2695
+ "$value": {
2696
+ "color": "#d1d9e0",
2697
+ "style": "solid",
2698
+ "width": ["0.0625rem", "1px"]
2699
+ },
2612
2700
  "$type": "border",
2613
2701
  "filePath": "src/tokens/functional/border/border.json5",
2614
2702
  "isSource": true,
@@ -2627,7 +2715,11 @@
2627
2715
  },
2628
2716
  "border-disabled": {
2629
2717
  "key": "{border.disabled}",
2630
- "$value": "0.00390625rem,0.0625px solid #818b981a",
2718
+ "$value": {
2719
+ "color": "#818b981a",
2720
+ "style": "solid",
2721
+ "width": ["0.0625rem", "1px"]
2722
+ },
2631
2723
  "$type": "border",
2632
2724
  "filePath": "src/tokens/functional/border/border.json5",
2633
2725
  "isSource": true,
@@ -2646,7 +2738,11 @@
2646
2738
  },
2647
2739
  "border-done-emphasis": {
2648
2740
  "key": "{border.done.emphasis}",
2649
- "$value": "0.00390625rem,0.0625px solid #8250df",
2741
+ "$value": {
2742
+ "color": "#8250df",
2743
+ "style": "solid",
2744
+ "width": ["0.0625rem", "1px"]
2745
+ },
2650
2746
  "$type": "border",
2651
2747
  "filePath": "src/tokens/functional/border/border.json5",
2652
2748
  "isSource": true,
@@ -2665,7 +2761,11 @@
2665
2761
  },
2666
2762
  "border-done-muted": {
2667
2763
  "key": "{border.done.muted}",
2668
- "$value": "0.00390625rem,0.0625px solid #c297ff66",
2764
+ "$value": {
2765
+ "color": "#c297ff66",
2766
+ "style": "solid",
2767
+ "width": ["0.0625rem", "1px"]
2768
+ },
2669
2769
  "$type": "border",
2670
2770
  "filePath": "src/tokens/functional/border/border.json5",
2671
2771
  "isSource": true,
@@ -2684,7 +2784,11 @@
2684
2784
  },
2685
2785
  "border-emphasis": {
2686
2786
  "key": "{border.emphasis}",
2687
- "$value": "0.00390625rem,0.0625px solid #818b98",
2787
+ "$value": {
2788
+ "color": "#818b98",
2789
+ "style": "solid",
2790
+ "width": ["0.0625rem", "1px"]
2791
+ },
2688
2792
  "$type": "border",
2689
2793
  "filePath": "src/tokens/functional/border/border.json5",
2690
2794
  "isSource": true,
@@ -2703,7 +2807,11 @@
2703
2807
  },
2704
2808
  "border-muted": {
2705
2809
  "key": "{border.muted}",
2706
- "$value": "0.00390625rem,0.0625px solid #d1d9e0b3",
2810
+ "$value": {
2811
+ "color": "#d1d9e0b3",
2812
+ "style": "solid",
2813
+ "width": ["0.0625rem", "1px"]
2814
+ },
2707
2815
  "$type": "border",
2708
2816
  "filePath": "src/tokens/functional/border/border.json5",
2709
2817
  "isSource": true,
@@ -2722,7 +2830,11 @@
2722
2830
  },
2723
2831
  "border-neutral-emphasis": {
2724
2832
  "key": "{border.neutral.emphasis}",
2725
- "$value": "0.00390625rem,0.0625px solid #59636e",
2833
+ "$value": {
2834
+ "color": "#59636e",
2835
+ "style": "solid",
2836
+ "width": ["0.0625rem", "1px"]
2837
+ },
2726
2838
  "$type": "border",
2727
2839
  "filePath": "src/tokens/functional/border/border.json5",
2728
2840
  "isSource": true,
@@ -2741,7 +2853,11 @@
2741
2853
  },
2742
2854
  "border-neutral-muted": {
2743
2855
  "key": "{border.neutral.muted}",
2744
- "$value": "0.00390625rem,0.0625px solid #d1d9e0b3",
2856
+ "$value": {
2857
+ "color": "#d1d9e0b3",
2858
+ "style": "solid",
2859
+ "width": ["0.0625rem", "1px"]
2860
+ },
2745
2861
  "$type": "border",
2746
2862
  "filePath": "src/tokens/functional/border/border.json5",
2747
2863
  "isSource": true,
@@ -2760,7 +2876,11 @@
2760
2876
  },
2761
2877
  "border-open-emphasis": {
2762
2878
  "key": "{border.open.emphasis}",
2763
- "$value": "0.00390625rem,0.0625px solid #1a7f37",
2879
+ "$value": {
2880
+ "color": "#1a7f37",
2881
+ "style": "solid",
2882
+ "width": ["0.0625rem", "1px"]
2883
+ },
2764
2884
  "$type": "border",
2765
2885
  "filePath": "src/tokens/functional/border/border.json5",
2766
2886
  "isSource": true,
@@ -2775,7 +2895,11 @@
2775
2895
  },
2776
2896
  "border-open-muted": {
2777
2897
  "key": "{border.open.muted}",
2778
- "$value": "0.00390625rem,0.0625px solid #4ac26b66",
2898
+ "$value": {
2899
+ "color": "#4ac26b66",
2900
+ "style": "solid",
2901
+ "width": ["0.0625rem", "1px"]
2902
+ },
2779
2903
  "$type": "border",
2780
2904
  "filePath": "src/tokens/functional/border/border.json5",
2781
2905
  "isSource": true,
@@ -2790,7 +2914,11 @@
2790
2914
  },
2791
2915
  "border-severe-emphasis": {
2792
2916
  "key": "{border.severe.emphasis}",
2793
- "$value": "0.00390625rem,0.0625px solid #bc4c00",
2917
+ "$value": {
2918
+ "color": "#bc4c00",
2919
+ "style": "solid",
2920
+ "width": ["0.0625rem", "1px"]
2921
+ },
2794
2922
  "$type": "border",
2795
2923
  "filePath": "src/tokens/functional/border/border.json5",
2796
2924
  "isSource": true,
@@ -2809,7 +2937,11 @@
2809
2937
  },
2810
2938
  "border-severe-muted": {
2811
2939
  "key": "{border.severe.muted}",
2812
- "$value": "0.00390625rem,0.0625px solid #fb8f4466",
2940
+ "$value": {
2941
+ "color": "#fb8f4466",
2942
+ "style": "solid",
2943
+ "width": ["0.0625rem", "1px"]
2944
+ },
2813
2945
  "$type": "border",
2814
2946
  "filePath": "src/tokens/functional/border/border.json5",
2815
2947
  "isSource": true,
@@ -2828,7 +2960,11 @@
2828
2960
  },
2829
2961
  "border-sponsors-emphasis": {
2830
2962
  "key": "{border.sponsors.emphasis}",
2831
- "$value": "0.00390625rem,0.0625px solid #bf3989",
2963
+ "$value": {
2964
+ "color": "#bf3989",
2965
+ "style": "solid",
2966
+ "width": ["0.0625rem", "1px"]
2967
+ },
2832
2968
  "$type": "border",
2833
2969
  "filePath": "src/tokens/functional/border/border.json5",
2834
2970
  "isSource": true,
@@ -2847,7 +2983,11 @@
2847
2983
  },
2848
2984
  "border-sponsors-muted": {
2849
2985
  "key": "{border.sponsors.muted}",
2850
- "$value": "0.00390625rem,0.0625px solid #ff80c866",
2986
+ "$value": {
2987
+ "color": "#ff80c866",
2988
+ "style": "solid",
2989
+ "width": ["0.0625rem", "1px"]
2990
+ },
2851
2991
  "$type": "border",
2852
2992
  "filePath": "src/tokens/functional/border/border.json5",
2853
2993
  "isSource": true,
@@ -2866,7 +3006,11 @@
2866
3006
  },
2867
3007
  "border-success-emphasis": {
2868
3008
  "key": "{border.success.emphasis}",
2869
- "$value": "0.00390625rem,0.0625px solid #1a7f37",
3009
+ "$value": {
3010
+ "color": "#1a7f37",
3011
+ "style": "solid",
3012
+ "width": ["0.0625rem", "1px"]
3013
+ },
2870
3014
  "$type": "border",
2871
3015
  "filePath": "src/tokens/functional/border/border.json5",
2872
3016
  "isSource": true,
@@ -2885,7 +3029,11 @@
2885
3029
  },
2886
3030
  "border-success-muted": {
2887
3031
  "key": "{border.success.muted}",
2888
- "$value": "0.00390625rem,0.0625px solid #4ac26b66",
3032
+ "$value": {
3033
+ "color": "#4ac26b66",
3034
+ "style": "solid",
3035
+ "width": ["0.0625rem", "1px"]
3036
+ },
2889
3037
  "$type": "border",
2890
3038
  "filePath": "src/tokens/functional/border/border.json5",
2891
3039
  "isSource": true,
@@ -2904,7 +3052,11 @@
2904
3052
  },
2905
3053
  "border-transparent": {
2906
3054
  "key": "{border.transparent}",
2907
- "$value": "0.00390625rem,0.0625px solid #ffffff00",
3055
+ "$value": {
3056
+ "color": "#ffffff00",
3057
+ "style": "solid",
3058
+ "width": ["0.0625rem", "1px"]
3059
+ },
2908
3060
  "$type": "border",
2909
3061
  "filePath": "src/tokens/functional/border/border.json5",
2910
3062
  "isSource": true,
@@ -2923,7 +3075,11 @@
2923
3075
  },
2924
3076
  "border-upsell-emphasis": {
2925
3077
  "key": "{border.upsell.emphasis}",
2926
- "$value": "0.00390625rem,0.0625px solid #8250df",
3078
+ "$value": {
3079
+ "color": "#8250df",
3080
+ "style": "solid",
3081
+ "width": ["0.0625rem", "1px"]
3082
+ },
2927
3083
  "$type": "border",
2928
3084
  "filePath": "src/tokens/functional/border/border.json5",
2929
3085
  "isSource": true,
@@ -2942,7 +3098,11 @@
2942
3098
  },
2943
3099
  "border-upsell-muted": {
2944
3100
  "key": "{border.upsell.muted}",
2945
- "$value": "0.00390625rem,0.0625px solid #c297ff66",
3101
+ "$value": {
3102
+ "color": "#c297ff66",
3103
+ "style": "solid",
3104
+ "width": ["0.0625rem", "1px"]
3105
+ },
2946
3106
  "$type": "border",
2947
3107
  "filePath": "src/tokens/functional/border/border.json5",
2948
3108
  "isSource": true,
@@ -6928,7 +7088,7 @@
6928
7088
  },
6929
7089
  "button-danger-shadow-selected": {
6930
7090
  "key": "{button.danger.shadow.selected}",
6931
- "$value": "inset 0px 1px 0px 0px #4c001433",
7091
+ "$value": "inset 0 1px 0 0 #4c001433",
6932
7092
  "$type": "shadow",
6933
7093
  "$extensions": {
6934
7094
  "org.primer.figma": {
@@ -6941,10 +7101,22 @@
6941
7101
  {
6942
7102
  "color": "#471700",
6943
7103
  "alpha": 0.2,
6944
- "offsetX": "0px",
6945
- "offsetY": "1px",
6946
- "blur": "0px",
6947
- "spread": "0px",
7104
+ "offsetX": {
7105
+ "value": 0,
7106
+ "unit": "px"
7107
+ },
7108
+ "offsetY": {
7109
+ "value": 1,
7110
+ "unit": "px"
7111
+ },
7112
+ "blur": {
7113
+ "value": 0,
7114
+ "unit": "px"
7115
+ },
7116
+ "spread": {
7117
+ "value": 0,
7118
+ "unit": "px"
7119
+ },
6948
7120
  "inset": true
6949
7121
  }
6950
7122
  ],
@@ -6957,10 +7129,22 @@
6957
7129
  {
6958
7130
  "color": "#ffffff00",
6959
7131
  "alpha": 0,
6960
- "offsetX": "0px",
6961
- "offsetY": "0px",
6962
- "blur": "0px",
6963
- "spread": "0px",
7132
+ "offsetX": {
7133
+ "value": 0,
7134
+ "unit": "px"
7135
+ },
7136
+ "offsetY": {
7137
+ "value": 0,
7138
+ "unit": "px"
7139
+ },
7140
+ "blur": {
7141
+ "value": 0,
7142
+ "unit": "px"
7143
+ },
7144
+ "spread": {
7145
+ "value": 0,
7146
+ "unit": "px"
7147
+ },
6964
7148
  "inset": false
6965
7149
  }
6966
7150
  ],
@@ -6977,10 +7161,22 @@
6977
7161
  {
6978
7162
  "color": "{base.color.red.9}",
6979
7163
  "alpha": 0.2,
6980
- "offsetX": "0px",
6981
- "offsetY": "1px",
6982
- "blur": "0px",
6983
- "spread": "0px",
7164
+ "offsetX": {
7165
+ "value": 0,
7166
+ "unit": "px"
7167
+ },
7168
+ "offsetY": {
7169
+ "value": 1,
7170
+ "unit": "px"
7171
+ },
7172
+ "blur": {
7173
+ "value": 0,
7174
+ "unit": "px"
7175
+ },
7176
+ "spread": {
7177
+ "value": 0,
7178
+ "unit": "px"
7179
+ },
6984
7180
  "inset": true
6985
7181
  }
6986
7182
  ],
@@ -6996,10 +7192,22 @@
6996
7192
  {
6997
7193
  "color": "{base.color.orange.9}",
6998
7194
  "alpha": 0.2,
6999
- "offsetX": "0px",
7000
- "offsetY": "1px",
7001
- "blur": "0px",
7002
- "spread": "0px",
7195
+ "offsetX": {
7196
+ "value": 0,
7197
+ "unit": "px"
7198
+ },
7199
+ "offsetY": {
7200
+ "value": 1,
7201
+ "unit": "px"
7202
+ },
7203
+ "blur": {
7204
+ "value": 0,
7205
+ "unit": "px"
7206
+ },
7207
+ "spread": {
7208
+ "value": 0,
7209
+ "unit": "px"
7210
+ },
7003
7211
  "inset": true
7004
7212
  }
7005
7213
  ],
@@ -7012,10 +7220,22 @@
7012
7220
  {
7013
7221
  "color": "{base.color.transparent}",
7014
7222
  "alpha": 0,
7015
- "offsetX": "0px",
7016
- "offsetY": "0px",
7017
- "blur": "0px",
7018
- "spread": "0px",
7223
+ "offsetX": {
7224
+ "value": 0,
7225
+ "unit": "px"
7226
+ },
7227
+ "offsetY": {
7228
+ "value": 0,
7229
+ "unit": "px"
7230
+ },
7231
+ "blur": {
7232
+ "value": 0,
7233
+ "unit": "px"
7234
+ },
7235
+ "spread": {
7236
+ "value": 0,
7237
+ "unit": "px"
7238
+ },
7019
7239
  "inset": false
7020
7240
  }
7021
7241
  ],
@@ -7391,7 +7611,7 @@
7391
7611
  },
7392
7612
  "button-default-shadow-resting": {
7393
7613
  "key": "{button.default.shadow.resting}",
7394
- "$value": "0px 1px 0px 0px #1f23280a",
7614
+ "$value": "0 1px 0 0 #1f23280a",
7395
7615
  "$type": "shadow",
7396
7616
  "$extensions": {
7397
7617
  "org.primer.figma": {
@@ -7404,10 +7624,22 @@
7404
7624
  {
7405
7625
  "color": "#ffffff00",
7406
7626
  "alpha": 0,
7407
- "offsetX": "0px",
7408
- "offsetY": "0px",
7409
- "blur": "0px",
7410
- "spread": "0px",
7627
+ "offsetX": {
7628
+ "value": 0,
7629
+ "unit": "px"
7630
+ },
7631
+ "offsetY": {
7632
+ "value": 0,
7633
+ "unit": "px"
7634
+ },
7635
+ "blur": {
7636
+ "value": 0,
7637
+ "unit": "px"
7638
+ },
7639
+ "spread": {
7640
+ "value": 0,
7641
+ "unit": "px"
7642
+ },
7411
7643
  "inset": false
7412
7644
  }
7413
7645
  ],
@@ -7424,10 +7656,22 @@
7424
7656
  {
7425
7657
  "color": "{base.color.neutral.13}",
7426
7658
  "alpha": 0.04,
7427
- "offsetX": "0px",
7428
- "offsetY": "1px",
7429
- "blur": "0px",
7430
- "spread": "0px",
7659
+ "offsetX": {
7660
+ "value": 0,
7661
+ "unit": "px"
7662
+ },
7663
+ "offsetY": {
7664
+ "value": 1,
7665
+ "unit": "px"
7666
+ },
7667
+ "blur": {
7668
+ "value": 0,
7669
+ "unit": "px"
7670
+ },
7671
+ "spread": {
7672
+ "value": 0,
7673
+ "unit": "px"
7674
+ },
7431
7675
  "inset": false
7432
7676
  }
7433
7677
  ],
@@ -7443,10 +7687,22 @@
7443
7687
  {
7444
7688
  "color": "{base.color.transparent}",
7445
7689
  "alpha": 0,
7446
- "offsetX": "0px",
7447
- "offsetY": "0px",
7448
- "blur": "0px",
7449
- "spread": "0px",
7690
+ "offsetX": {
7691
+ "value": 0,
7692
+ "unit": "px"
7693
+ },
7694
+ "offsetY": {
7695
+ "value": 0,
7696
+ "unit": "px"
7697
+ },
7698
+ "blur": {
7699
+ "value": 0,
7700
+ "unit": "px"
7701
+ },
7702
+ "spread": {
7703
+ "value": 0,
7704
+ "unit": "px"
7705
+ },
7450
7706
  "inset": false
7451
7707
  }
7452
7708
  ],
@@ -9150,7 +9406,7 @@
9150
9406
  },
9151
9407
  "button-outline-shadow-selected": {
9152
9408
  "key": "{button.outline.shadow.selected}",
9153
- "$value": "inset 0px 1px 0px 0px #00215533",
9409
+ "$value": "inset 0 1px 0 0 #00215533",
9154
9410
  "$type": "shadow",
9155
9411
  "$extensions": {
9156
9412
  "org.primer.figma": {
@@ -9163,10 +9419,22 @@
9163
9419
  {
9164
9420
  "color": "#ffffff00",
9165
9421
  "alpha": 0,
9166
- "offsetX": "0px",
9167
- "offsetY": "0px",
9168
- "blur": "0px",
9169
- "spread": "0px",
9422
+ "offsetX": {
9423
+ "value": 0,
9424
+ "unit": "px"
9425
+ },
9426
+ "offsetY": {
9427
+ "value": 0,
9428
+ "unit": "px"
9429
+ },
9430
+ "blur": {
9431
+ "value": 0,
9432
+ "unit": "px"
9433
+ },
9434
+ "spread": {
9435
+ "value": 0,
9436
+ "unit": "px"
9437
+ },
9170
9438
  "inset": false
9171
9439
  }
9172
9440
  ],
@@ -9183,10 +9451,22 @@
9183
9451
  {
9184
9452
  "color": "{base.color.blue.9}",
9185
9453
  "alpha": 0.2,
9186
- "offsetX": "0px",
9187
- "offsetY": "1px",
9188
- "blur": "0px",
9189
- "spread": "0px",
9454
+ "offsetX": {
9455
+ "value": 0,
9456
+ "unit": "px"
9457
+ },
9458
+ "offsetY": {
9459
+ "value": 1,
9460
+ "unit": "px"
9461
+ },
9462
+ "blur": {
9463
+ "value": 0,
9464
+ "unit": "px"
9465
+ },
9466
+ "spread": {
9467
+ "value": 0,
9468
+ "unit": "px"
9469
+ },
9190
9470
  "inset": true
9191
9471
  }
9192
9472
  ],
@@ -9202,10 +9482,22 @@
9202
9482
  {
9203
9483
  "color": "{base.color.transparent}",
9204
9484
  "alpha": 0,
9205
- "offsetX": "0px",
9206
- "offsetY": "0px",
9207
- "blur": "0px",
9208
- "spread": "0px",
9485
+ "offsetX": {
9486
+ "value": 0,
9487
+ "unit": "px"
9488
+ },
9489
+ "offsetY": {
9490
+ "value": 0,
9491
+ "unit": "px"
9492
+ },
9493
+ "blur": {
9494
+ "value": 0,
9495
+ "unit": "px"
9496
+ },
9497
+ "spread": {
9498
+ "value": 0,
9499
+ "unit": "px"
9500
+ },
9209
9501
  "inset": false
9210
9502
  }
9211
9503
  ],
@@ -10358,7 +10650,7 @@
10358
10650
  },
10359
10651
  "button-primary-shadow-selected": {
10360
10652
  "key": "{button.primary.shadow.selected}",
10361
- "$value": "inset 0px 1px 0px 0px #002d114d",
10653
+ "$value": "inset 0 1px 0 0 #002d114d",
10362
10654
  "$type": "shadow",
10363
10655
  "$extensions": {
10364
10656
  "org.primer.figma": {
@@ -10371,10 +10663,22 @@
10371
10663
  {
10372
10664
  "color": "#002155",
10373
10665
  "alpha": 0.3,
10374
- "offsetX": "0px",
10375
- "offsetY": "1px",
10376
- "blur": "0px",
10377
- "spread": "0px",
10666
+ "offsetX": {
10667
+ "value": 0,
10668
+ "unit": "px"
10669
+ },
10670
+ "offsetY": {
10671
+ "value": 1,
10672
+ "unit": "px"
10673
+ },
10674
+ "blur": {
10675
+ "value": 0,
10676
+ "unit": "px"
10677
+ },
10678
+ "spread": {
10679
+ "value": 0,
10680
+ "unit": "px"
10681
+ },
10378
10682
  "inset": true
10379
10683
  }
10380
10684
  ],
@@ -10387,10 +10691,22 @@
10387
10691
  {
10388
10692
  "color": "#002155",
10389
10693
  "alpha": 0.3,
10390
- "offsetX": "0px",
10391
- "offsetY": "1px",
10392
- "blur": "0px",
10393
- "spread": "0px",
10694
+ "offsetX": {
10695
+ "value": 0,
10696
+ "unit": "px"
10697
+ },
10698
+ "offsetY": {
10699
+ "value": 1,
10700
+ "unit": "px"
10701
+ },
10702
+ "blur": {
10703
+ "value": 0,
10704
+ "unit": "px"
10705
+ },
10706
+ "spread": {
10707
+ "value": 0,
10708
+ "unit": "px"
10709
+ },
10394
10710
  "inset": true
10395
10711
  }
10396
10712
  ],
@@ -10403,10 +10719,22 @@
10403
10719
  {
10404
10720
  "color": "#ffffff00",
10405
10721
  "alpha": 0,
10406
- "offsetX": "0px",
10407
- "offsetY": "0px",
10408
- "blur": "0px",
10409
- "spread": "0px",
10722
+ "offsetX": {
10723
+ "value": 0,
10724
+ "unit": "px"
10725
+ },
10726
+ "offsetY": {
10727
+ "value": 0,
10728
+ "unit": "px"
10729
+ },
10730
+ "blur": {
10731
+ "value": 0,
10732
+ "unit": "px"
10733
+ },
10734
+ "spread": {
10735
+ "value": 0,
10736
+ "unit": "px"
10737
+ },
10410
10738
  "inset": false
10411
10739
  }
10412
10740
  ],
@@ -10423,10 +10751,22 @@
10423
10751
  {
10424
10752
  "color": "{base.color.green.9}",
10425
10753
  "alpha": 0.3,
10426
- "offsetX": "0px",
10427
- "offsetY": "1px",
10428
- "blur": "0px",
10429
- "spread": "0px",
10754
+ "offsetX": {
10755
+ "value": 0,
10756
+ "unit": "px"
10757
+ },
10758
+ "offsetY": {
10759
+ "value": 1,
10760
+ "unit": "px"
10761
+ },
10762
+ "blur": {
10763
+ "value": 0,
10764
+ "unit": "px"
10765
+ },
10766
+ "spread": {
10767
+ "value": 0,
10768
+ "unit": "px"
10769
+ },
10430
10770
  "inset": true
10431
10771
  }
10432
10772
  ],
@@ -10442,10 +10782,22 @@
10442
10782
  {
10443
10783
  "color": "{base.color.blue.9}",
10444
10784
  "alpha": 0.3,
10445
- "offsetX": "0px",
10446
- "offsetY": "1px",
10447
- "blur": "0px",
10448
- "spread": "0px",
10785
+ "offsetX": {
10786
+ "value": 0,
10787
+ "unit": "px"
10788
+ },
10789
+ "offsetY": {
10790
+ "value": 1,
10791
+ "unit": "px"
10792
+ },
10793
+ "blur": {
10794
+ "value": 0,
10795
+ "unit": "px"
10796
+ },
10797
+ "spread": {
10798
+ "value": 0,
10799
+ "unit": "px"
10800
+ },
10449
10801
  "inset": true
10450
10802
  }
10451
10803
  ],
@@ -10458,10 +10810,22 @@
10458
10810
  {
10459
10811
  "color": "{base.color.blue.9}",
10460
10812
  "alpha": 0.3,
10461
- "offsetX": "0px",
10462
- "offsetY": "1px",
10463
- "blur": "0px",
10464
- "spread": "0px",
10813
+ "offsetX": {
10814
+ "value": 0,
10815
+ "unit": "px"
10816
+ },
10817
+ "offsetY": {
10818
+ "value": 1,
10819
+ "unit": "px"
10820
+ },
10821
+ "blur": {
10822
+ "value": 0,
10823
+ "unit": "px"
10824
+ },
10825
+ "spread": {
10826
+ "value": 0,
10827
+ "unit": "px"
10828
+ },
10465
10829
  "inset": true
10466
10830
  }
10467
10831
  ],
@@ -10474,10 +10838,22 @@
10474
10838
  {
10475
10839
  "color": "{base.color.transparent}",
10476
10840
  "alpha": 0,
10477
- "offsetX": "0px",
10478
- "offsetY": "0px",
10479
- "blur": "0px",
10480
- "spread": "0px",
10841
+ "offsetX": {
10842
+ "value": 0,
10843
+ "unit": "px"
10844
+ },
10845
+ "offsetY": {
10846
+ "value": 0,
10847
+ "unit": "px"
10848
+ },
10849
+ "blur": {
10850
+ "value": 0,
10851
+ "unit": "px"
10852
+ },
10853
+ "spread": {
10854
+ "value": 0,
10855
+ "unit": "px"
10856
+ },
10481
10857
  "inset": false
10482
10858
  }
10483
10859
  ],
@@ -37214,6 +37590,10 @@
37214
37590
  },
37215
37591
  "org.primer.overrides": {
37216
37592
  "dark": "#ffffff"
37593
+ },
37594
+ "org.primer.llm": {
37595
+ "doNotUse": true,
37596
+ "rules": "Avoid using raw black. Use semantic alternatives: fgColor.default for standard text, fgColor.muted for secondary text. Raw black/white ignore theme preferences and accessibility settings."
37217
37597
  }
37218
37598
  },
37219
37599
  "filePath": "src/tokens/functional/color/fgColor.json5",
@@ -37230,6 +37610,10 @@
37230
37610
  },
37231
37611
  "org.primer.overrides": {
37232
37612
  "dark": "{base.color.neutral.0}"
37613
+ },
37614
+ "org.primer.llm": {
37615
+ "doNotUse": true,
37616
+ "rules": "Avoid using raw black. Use semantic alternatives: fgColor.default for standard text, fgColor.muted for secondary text. Raw black/white ignore theme preferences and accessibility settings."
37233
37617
  }
37234
37618
  },
37235
37619
  "key": "{fgColor.black}"
@@ -38203,6 +38587,10 @@
38203
38587
  },
38204
38588
  "org.primer.overrides": {
38205
38589
  "dark": "#1f2328"
38590
+ },
38591
+ "org.primer.llm": {
38592
+ "doNotUse": true,
38593
+ "rules": "Avoid using raw white. Use semantic alternatives: fgColor.onEmphasis for text on dark backgrounds, fgColor.onInverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
38206
38594
  }
38207
38595
  },
38208
38596
  "filePath": "src/tokens/functional/color/fgColor.json5",
@@ -38219,6 +38607,10 @@
38219
38607
  },
38220
38608
  "org.primer.overrides": {
38221
38609
  "dark": "{base.color.neutral.13}"
38610
+ },
38611
+ "org.primer.llm": {
38612
+ "doNotUse": true,
38613
+ "rules": "Avoid using raw white. Use semantic alternatives: fgColor.onEmphasis for text on dark backgrounds, fgColor.onInverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
38222
38614
  }
38223
38615
  },
38224
38616
  "key": "{fgColor.white}"
@@ -38244,7 +38636,10 @@
38244
38636
  "$value": {
38245
38637
  "color": "{focus.outlineColor}",
38246
38638
  "style": "solid",
38247
- "width": "2px"
38639
+ "width": {
38640
+ "value": 2,
38641
+ "unit": "px"
38642
+ }
38248
38643
  },
38249
38644
  "$type": "border",
38250
38645
  "$description": "Focus ring outline for keyboard navigation and accessibility.",
@@ -47395,7 +47790,7 @@
47395
47790
  },
47396
47791
  "shadow-floating-large": {
47397
47792
  "key": "{shadow.floating.large}",
47398
- "$value": "0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d",
47793
+ "$value": "0 0 0 1px #d1d9e000, 0 40px 80px 0 #25292e3d",
47399
47794
  "$type": "shadow",
47400
47795
  "$description": "Large floating shadow for modals and dialogs",
47401
47796
  "$extensions": {
@@ -47409,18 +47804,183 @@
47409
47804
  {
47410
47805
  "color": "#d1d9e080",
47411
47806
  "alpha": 1,
47412
- "offsetX": "0px",
47413
- "offsetY": "0px",
47414
- "blur": "0px",
47415
- "spread": "1px"
47807
+ "offsetX": {
47808
+ "value": 0,
47809
+ "unit": "px"
47810
+ },
47811
+ "offsetY": {
47812
+ "value": 0,
47813
+ "unit": "px"
47814
+ },
47815
+ "blur": {
47816
+ "value": 0,
47817
+ "unit": "px"
47818
+ },
47819
+ "spread": {
47820
+ "value": 1,
47821
+ "unit": "px"
47822
+ }
47416
47823
  },
47417
47824
  {
47418
47825
  "color": "#ffffff",
47419
47826
  "alpha": 1,
47420
- "offsetX": "0px",
47421
- "offsetY": "24px",
47422
- "blur": "48px",
47423
- "spread": "0px"
47827
+ "offsetX": {
47828
+ "value": 0,
47829
+ "unit": "px"
47830
+ },
47831
+ "offsetY": {
47832
+ "value": 24,
47833
+ "unit": "px"
47834
+ },
47835
+ "blur": {
47836
+ "value": 48,
47837
+ "unit": "px"
47838
+ },
47839
+ "spread": {
47840
+ "value": 0,
47841
+ "unit": "px"
47842
+ }
47843
+ }
47844
+ ],
47845
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47846
+ "isSource": true,
47847
+ "$type": "shadow"
47848
+ },
47849
+ "light-high-contrast": {
47850
+ "$value": [
47851
+ {
47852
+ "color": "#d1d9e080",
47853
+ "alpha": 1,
47854
+ "offsetX": {
47855
+ "value": 0,
47856
+ "unit": "px"
47857
+ },
47858
+ "offsetY": {
47859
+ "value": 0,
47860
+ "unit": "px"
47861
+ },
47862
+ "blur": {
47863
+ "value": 0,
47864
+ "unit": "px"
47865
+ },
47866
+ "spread": {
47867
+ "value": 1,
47868
+ "unit": "px"
47869
+ }
47870
+ },
47871
+ {
47872
+ "color": "#25292e",
47873
+ "alpha": 0.24,
47874
+ "offsetX": {
47875
+ "value": 0,
47876
+ "unit": "px"
47877
+ },
47878
+ "offsetY": {
47879
+ "value": 40,
47880
+ "unit": "px"
47881
+ },
47882
+ "blur": {
47883
+ "value": 80,
47884
+ "unit": "px"
47885
+ },
47886
+ "spread": {
47887
+ "value": 0,
47888
+ "unit": "px"
47889
+ }
47890
+ }
47891
+ ],
47892
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47893
+ "isSource": true,
47894
+ "$type": "shadow"
47895
+ },
47896
+ "light-protanopia-deuteranopia-high-contrast": {
47897
+ "$value": [
47898
+ {
47899
+ "color": "#d1d9e080",
47900
+ "alpha": 1,
47901
+ "offsetX": {
47902
+ "value": 0,
47903
+ "unit": "px"
47904
+ },
47905
+ "offsetY": {
47906
+ "value": 0,
47907
+ "unit": "px"
47908
+ },
47909
+ "blur": {
47910
+ "value": 0,
47911
+ "unit": "px"
47912
+ },
47913
+ "spread": {
47914
+ "value": 1,
47915
+ "unit": "px"
47916
+ }
47917
+ },
47918
+ {
47919
+ "color": "#25292e",
47920
+ "alpha": 0.24,
47921
+ "offsetX": {
47922
+ "value": 0,
47923
+ "unit": "px"
47924
+ },
47925
+ "offsetY": {
47926
+ "value": 40,
47927
+ "unit": "px"
47928
+ },
47929
+ "blur": {
47930
+ "value": 80,
47931
+ "unit": "px"
47932
+ },
47933
+ "spread": {
47934
+ "value": 0,
47935
+ "unit": "px"
47936
+ }
47937
+ }
47938
+ ],
47939
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47940
+ "isSource": true,
47941
+ "$type": "shadow"
47942
+ },
47943
+ "light-tritanopia-high-contrast": {
47944
+ "$value": [
47945
+ {
47946
+ "color": "#d1d9e080",
47947
+ "alpha": 1,
47948
+ "offsetX": {
47949
+ "value": 0,
47950
+ "unit": "px"
47951
+ },
47952
+ "offsetY": {
47953
+ "value": 0,
47954
+ "unit": "px"
47955
+ },
47956
+ "blur": {
47957
+ "value": 0,
47958
+ "unit": "px"
47959
+ },
47960
+ "spread": {
47961
+ "value": 1,
47962
+ "unit": "px"
47963
+ }
47964
+ },
47965
+ {
47966
+ "color": "#25292e",
47967
+ "alpha": 0.24,
47968
+ "offsetX": {
47969
+ "value": 0,
47970
+ "unit": "px"
47971
+ },
47972
+ "offsetY": {
47973
+ "value": 40,
47974
+ "unit": "px"
47975
+ },
47976
+ "blur": {
47977
+ "value": 80,
47978
+ "unit": "px"
47979
+ },
47980
+ "spread": {
47981
+ "value": 0,
47982
+ "unit": "px"
47983
+ }
47424
47984
  }
47425
47985
  ],
47426
47986
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47440,18 +48000,42 @@
47440
48000
  {
47441
48001
  "color": "{overlay.borderColor}",
47442
48002
  "alpha": 0,
47443
- "offsetX": "0px",
47444
- "offsetY": "0px",
47445
- "blur": "0px",
47446
- "spread": "1px"
48003
+ "offsetX": {
48004
+ "value": 0,
48005
+ "unit": "px"
48006
+ },
48007
+ "offsetY": {
48008
+ "value": 0,
48009
+ "unit": "px"
48010
+ },
48011
+ "blur": {
48012
+ "value": 0,
48013
+ "unit": "px"
48014
+ },
48015
+ "spread": {
48016
+ "value": 1,
48017
+ "unit": "px"
48018
+ }
47447
48019
  },
47448
48020
  {
47449
48021
  "color": "{base.color.neutral.12}",
47450
48022
  "alpha": 0.24,
47451
- "offsetX": "0px",
47452
- "offsetY": "40px",
47453
- "blur": "80px",
47454
- "spread": "0px"
48023
+ "offsetX": {
48024
+ "value": 0,
48025
+ "unit": "px"
48026
+ },
48027
+ "offsetY": {
48028
+ "value": 40,
48029
+ "unit": "px"
48030
+ },
48031
+ "blur": {
48032
+ "value": 80,
48033
+ "unit": "px"
48034
+ },
48035
+ "spread": {
48036
+ "value": 0,
48037
+ "unit": "px"
48038
+ }
47455
48039
  }
47456
48040
  ],
47457
48041
  "$type": "shadow",
@@ -47467,18 +48051,183 @@
47467
48051
  {
47468
48052
  "color": "{overlay.borderColor}",
47469
48053
  "alpha": 1,
47470
- "offsetX": "0px",
47471
- "offsetY": "0px",
47472
- "blur": "0px",
47473
- "spread": "1px"
48054
+ "offsetX": {
48055
+ "value": 0,
48056
+ "unit": "px"
48057
+ },
48058
+ "offsetY": {
48059
+ "value": 0,
48060
+ "unit": "px"
48061
+ },
48062
+ "blur": {
48063
+ "value": 0,
48064
+ "unit": "px"
48065
+ },
48066
+ "spread": {
48067
+ "value": 1,
48068
+ "unit": "px"
48069
+ }
47474
48070
  },
47475
48071
  {
47476
48072
  "color": "{base.color.neutral.0}",
47477
48073
  "alpha": 1,
47478
- "offsetX": "0px",
47479
- "offsetY": "24px",
47480
- "blur": "48px",
47481
- "spread": "0px"
48074
+ "offsetX": {
48075
+ "value": 0,
48076
+ "unit": "px"
48077
+ },
48078
+ "offsetY": {
48079
+ "value": 24,
48080
+ "unit": "px"
48081
+ },
48082
+ "blur": {
48083
+ "value": 48,
48084
+ "unit": "px"
48085
+ },
48086
+ "spread": {
48087
+ "value": 0,
48088
+ "unit": "px"
48089
+ }
48090
+ }
48091
+ ],
48092
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48093
+ "isSource": true,
48094
+ "$type": "shadow"
48095
+ },
48096
+ "light-high-contrast": {
48097
+ "$value": [
48098
+ {
48099
+ "color": "{overlay.borderColor}",
48100
+ "alpha": 1,
48101
+ "offsetX": {
48102
+ "value": 0,
48103
+ "unit": "px"
48104
+ },
48105
+ "offsetY": {
48106
+ "value": 0,
48107
+ "unit": "px"
48108
+ },
48109
+ "blur": {
48110
+ "value": 0,
48111
+ "unit": "px"
48112
+ },
48113
+ "spread": {
48114
+ "value": 1,
48115
+ "unit": "px"
48116
+ }
48117
+ },
48118
+ {
48119
+ "color": "{base.color.neutral.12}",
48120
+ "alpha": 0.24,
48121
+ "offsetX": {
48122
+ "value": 0,
48123
+ "unit": "px"
48124
+ },
48125
+ "offsetY": {
48126
+ "value": 40,
48127
+ "unit": "px"
48128
+ },
48129
+ "blur": {
48130
+ "value": 80,
48131
+ "unit": "px"
48132
+ },
48133
+ "spread": {
48134
+ "value": 0,
48135
+ "unit": "px"
48136
+ }
48137
+ }
48138
+ ],
48139
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48140
+ "isSource": true,
48141
+ "$type": "shadow"
48142
+ },
48143
+ "light-protanopia-deuteranopia-high-contrast": {
48144
+ "$value": [
48145
+ {
48146
+ "color": "{overlay.borderColor}",
48147
+ "alpha": 1,
48148
+ "offsetX": {
48149
+ "value": 0,
48150
+ "unit": "px"
48151
+ },
48152
+ "offsetY": {
48153
+ "value": 0,
48154
+ "unit": "px"
48155
+ },
48156
+ "blur": {
48157
+ "value": 0,
48158
+ "unit": "px"
48159
+ },
48160
+ "spread": {
48161
+ "value": 1,
48162
+ "unit": "px"
48163
+ }
48164
+ },
48165
+ {
48166
+ "color": "{base.color.neutral.12}",
48167
+ "alpha": 0.24,
48168
+ "offsetX": {
48169
+ "value": 0,
48170
+ "unit": "px"
48171
+ },
48172
+ "offsetY": {
48173
+ "value": 40,
48174
+ "unit": "px"
48175
+ },
48176
+ "blur": {
48177
+ "value": 80,
48178
+ "unit": "px"
48179
+ },
48180
+ "spread": {
48181
+ "value": 0,
48182
+ "unit": "px"
48183
+ }
48184
+ }
48185
+ ],
48186
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48187
+ "isSource": true,
48188
+ "$type": "shadow"
48189
+ },
48190
+ "light-tritanopia-high-contrast": {
48191
+ "$value": [
48192
+ {
48193
+ "color": "{overlay.borderColor}",
48194
+ "alpha": 1,
48195
+ "offsetX": {
48196
+ "value": 0,
48197
+ "unit": "px"
48198
+ },
48199
+ "offsetY": {
48200
+ "value": 0,
48201
+ "unit": "px"
48202
+ },
48203
+ "blur": {
48204
+ "value": 0,
48205
+ "unit": "px"
48206
+ },
48207
+ "spread": {
48208
+ "value": 1,
48209
+ "unit": "px"
48210
+ }
48211
+ },
48212
+ {
48213
+ "color": "{base.color.neutral.12}",
48214
+ "alpha": 0.24,
48215
+ "offsetX": {
48216
+ "value": 0,
48217
+ "unit": "px"
48218
+ },
48219
+ "offsetY": {
48220
+ "value": 40,
48221
+ "unit": "px"
48222
+ },
48223
+ "blur": {
48224
+ "value": 80,
48225
+ "unit": "px"
48226
+ },
48227
+ "spread": {
48228
+ "value": 0,
48229
+ "unit": "px"
48230
+ }
47482
48231
  }
47483
48232
  ],
47484
48233
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47499,8 +48248,9 @@
47499
48248
  },
47500
48249
  "shadow-floating-legacy": {
47501
48250
  "key": "{shadow.floating.legacy}",
47502
- "$value": "0px 6px 12px -3px #25292e0a, 0px 6px 18px 0px #25292e1f",
48251
+ "$value": "0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f",
47503
48252
  "$type": "shadow",
48253
+ "$description": "Legacy floating shadow for backward compatibility",
47504
48254
  "$extensions": {
47505
48255
  "org.primer.figma": {},
47506
48256
  "org.primer.overrides": {
@@ -47509,24 +48259,52 @@
47509
48259
  {
47510
48260
  "color": "#ffffff",
47511
48261
  "alpha": 0.4,
47512
- "offsetX": "0px",
47513
- "offsetY": "6px",
47514
- "blur": "12px",
47515
- "spread": "-3px"
48262
+ "offsetX": {
48263
+ "value": 0,
48264
+ "unit": "px"
48265
+ },
48266
+ "offsetY": {
48267
+ "value": 6,
48268
+ "unit": "px"
48269
+ },
48270
+ "blur": {
48271
+ "value": 12,
48272
+ "unit": "px"
48273
+ },
48274
+ "spread": {
48275
+ "value": -3,
48276
+ "unit": "px"
48277
+ }
47516
48278
  },
47517
48279
  {
47518
48280
  "color": "#ffffff",
47519
48281
  "alpha": 0.4,
47520
- "offsetX": "0px",
47521
- "offsetY": "6px",
47522
- "blur": "18px",
47523
- "spread": "0px"
48282
+ "offsetX": {
48283
+ "value": 0,
48284
+ "unit": "px"
48285
+ },
48286
+ "offsetY": {
48287
+ "value": 6,
48288
+ "unit": "px"
48289
+ },
48290
+ "blur": {
48291
+ "value": 18,
48292
+ "unit": "px"
48293
+ },
48294
+ "spread": {
48295
+ "value": 0,
48296
+ "unit": "px"
48297
+ }
47524
48298
  }
47525
48299
  ],
47526
48300
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47527
48301
  "isSource": true,
47528
48302
  "$type": "shadow"
47529
48303
  }
48304
+ },
48305
+ "org.primer.llm": {
48306
+ "usage": ["legacy-component", "backward-compatibility"],
48307
+ "rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
47530
48308
  }
47531
48309
  },
47532
48310
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47536,21 +48314,46 @@
47536
48314
  {
47537
48315
  "color": "{base.color.neutral.12}",
47538
48316
  "alpha": 0.04,
47539
- "offsetX": "0px",
47540
- "offsetY": "6px",
47541
- "blur": "12px",
47542
- "spread": "-3px"
48317
+ "offsetX": {
48318
+ "value": 0,
48319
+ "unit": "px"
48320
+ },
48321
+ "offsetY": {
48322
+ "value": 6,
48323
+ "unit": "px"
48324
+ },
48325
+ "blur": {
48326
+ "value": 12,
48327
+ "unit": "px"
48328
+ },
48329
+ "spread": {
48330
+ "value": -3,
48331
+ "unit": "px"
48332
+ }
47543
48333
  },
47544
48334
  {
47545
48335
  "color": "{base.color.neutral.12}",
47546
48336
  "alpha": 0.12,
47547
- "offsetX": "0px",
47548
- "offsetY": "6px",
47549
- "blur": "18px",
47550
- "spread": "0px"
48337
+ "offsetX": {
48338
+ "value": 0,
48339
+ "unit": "px"
48340
+ },
48341
+ "offsetY": {
48342
+ "value": 6,
48343
+ "unit": "px"
48344
+ },
48345
+ "blur": {
48346
+ "value": 18,
48347
+ "unit": "px"
48348
+ },
48349
+ "spread": {
48350
+ "value": 0,
48351
+ "unit": "px"
48352
+ }
47551
48353
  }
47552
48354
  ],
47553
48355
  "$type": "shadow",
48356
+ "$description": "Legacy floating shadow for backward compatibility",
47554
48357
  "$extensions": {
47555
48358
  "org.primer.figma": {},
47556
48359
  "org.primer.overrides": {
@@ -47559,24 +48362,52 @@
47559
48362
  {
47560
48363
  "color": "{base.color.neutral.0}",
47561
48364
  "alpha": 0.4,
47562
- "offsetX": "0px",
47563
- "offsetY": "6px",
47564
- "blur": "12px",
47565
- "spread": "-3px"
48365
+ "offsetX": {
48366
+ "value": 0,
48367
+ "unit": "px"
48368
+ },
48369
+ "offsetY": {
48370
+ "value": 6,
48371
+ "unit": "px"
48372
+ },
48373
+ "blur": {
48374
+ "value": 12,
48375
+ "unit": "px"
48376
+ },
48377
+ "spread": {
48378
+ "value": -3,
48379
+ "unit": "px"
48380
+ }
47566
48381
  },
47567
48382
  {
47568
48383
  "color": "{base.color.neutral.0}",
47569
48384
  "alpha": 0.4,
47570
- "offsetX": "0px",
47571
- "offsetY": "6px",
47572
- "blur": "18px",
47573
- "spread": "0px"
48385
+ "offsetX": {
48386
+ "value": 0,
48387
+ "unit": "px"
48388
+ },
48389
+ "offsetY": {
48390
+ "value": 6,
48391
+ "unit": "px"
48392
+ },
48393
+ "blur": {
48394
+ "value": 18,
48395
+ "unit": "px"
48396
+ },
48397
+ "spread": {
48398
+ "value": 0,
48399
+ "unit": "px"
48400
+ }
47574
48401
  }
47575
48402
  ],
47576
48403
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47577
48404
  "isSource": true,
47578
48405
  "$type": "shadow"
47579
48406
  }
48407
+ },
48408
+ "org.primer.llm": {
48409
+ "usage": ["legacy-component", "backward-compatibility"],
48410
+ "rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
47580
48411
  }
47581
48412
  },
47582
48413
  "key": "{shadow.floating.legacy}"
@@ -47587,8 +48418,9 @@
47587
48418
  },
47588
48419
  "shadow-floating-medium": {
47589
48420
  "key": "{shadow.floating.medium}",
47590
- "$value": "0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14",
48421
+ "$value": "0 0 0 1px #d1d9e000, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14",
47591
48422
  "$type": "shadow",
48423
+ "$description": "Medium floating shadow for popovers and action menus",
47592
48424
  "$extensions": {
47593
48425
  "org.primer.figma": {
47594
48426
  "collection": "mode",
@@ -47600,48 +48432,433 @@
47600
48432
  {
47601
48433
  "color": "#d1d9e080",
47602
48434
  "alpha": 1,
47603
- "offsetX": "0px",
47604
- "offsetY": "0px",
47605
- "blur": "0px",
47606
- "spread": "1px"
48435
+ "offsetX": {
48436
+ "value": 0,
48437
+ "unit": "px"
48438
+ },
48439
+ "offsetY": {
48440
+ "value": 0,
48441
+ "unit": "px"
48442
+ },
48443
+ "blur": {
48444
+ "value": 0,
48445
+ "unit": "px"
48446
+ },
48447
+ "spread": {
48448
+ "value": 1,
48449
+ "unit": "px"
48450
+ }
47607
48451
  },
47608
48452
  {
47609
48453
  "color": "#ffffff",
47610
48454
  "alpha": 0.4,
47611
- "offsetX": "0px",
47612
- "offsetY": "8px",
47613
- "blur": "16px",
47614
- "spread": "-4px"
48455
+ "offsetX": {
48456
+ "value": 0,
48457
+ "unit": "px"
48458
+ },
48459
+ "offsetY": {
48460
+ "value": 8,
48461
+ "unit": "px"
48462
+ },
48463
+ "blur": {
48464
+ "value": 16,
48465
+ "unit": "px"
48466
+ },
48467
+ "spread": {
48468
+ "value": -4,
48469
+ "unit": "px"
48470
+ }
47615
48471
  },
47616
48472
  {
47617
48473
  "color": "#ffffff",
47618
48474
  "alpha": 0.4,
47619
- "offsetX": "0px",
47620
- "offsetY": "4px",
47621
- "blur": "32px",
47622
- "spread": "-4px"
48475
+ "offsetX": {
48476
+ "value": 0,
48477
+ "unit": "px"
48478
+ },
48479
+ "offsetY": {
48480
+ "value": 4,
48481
+ "unit": "px"
48482
+ },
48483
+ "blur": {
48484
+ "value": 32,
48485
+ "unit": "px"
48486
+ },
48487
+ "spread": {
48488
+ "value": -4,
48489
+ "unit": "px"
48490
+ }
47623
48491
  },
47624
48492
  {
47625
48493
  "color": "#ffffff",
47626
48494
  "alpha": 0.4,
47627
- "offsetX": "0px",
47628
- "offsetY": "24px",
47629
- "blur": "48px",
47630
- "spread": "-12px"
48495
+ "offsetX": {
48496
+ "value": 0,
48497
+ "unit": "px"
48498
+ },
48499
+ "offsetY": {
48500
+ "value": 24,
48501
+ "unit": "px"
48502
+ },
48503
+ "blur": {
48504
+ "value": 48,
48505
+ "unit": "px"
48506
+ },
48507
+ "spread": {
48508
+ "value": -12,
48509
+ "unit": "px"
48510
+ }
47631
48511
  },
47632
48512
  {
47633
48513
  "color": "#ffffff",
47634
48514
  "alpha": 0.4,
47635
- "offsetX": "0px",
47636
- "offsetY": "48px",
47637
- "blur": "96px",
47638
- "spread": "-24px"
48515
+ "offsetX": {
48516
+ "value": 0,
48517
+ "unit": "px"
48518
+ },
48519
+ "offsetY": {
48520
+ "value": 48,
48521
+ "unit": "px"
48522
+ },
48523
+ "blur": {
48524
+ "value": 96,
48525
+ "unit": "px"
48526
+ },
48527
+ "spread": {
48528
+ "value": -24,
48529
+ "unit": "px"
48530
+ }
48531
+ }
48532
+ ],
48533
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48534
+ "isSource": true,
48535
+ "$type": "shadow"
48536
+ },
48537
+ "light-high-contrast": {
48538
+ "$value": [
48539
+ {
48540
+ "color": "#d1d9e080",
48541
+ "alpha": 1,
48542
+ "offsetX": {
48543
+ "value": 0,
48544
+ "unit": "px"
48545
+ },
48546
+ "offsetY": {
48547
+ "value": 0,
48548
+ "unit": "px"
48549
+ },
48550
+ "blur": {
48551
+ "value": 0,
48552
+ "unit": "px"
48553
+ },
48554
+ "spread": {
48555
+ "value": 1,
48556
+ "unit": "px"
48557
+ }
48558
+ },
48559
+ {
48560
+ "color": "#25292e",
48561
+ "alpha": 0.08,
48562
+ "offsetX": {
48563
+ "value": 0,
48564
+ "unit": "px"
48565
+ },
48566
+ "offsetY": {
48567
+ "value": 8,
48568
+ "unit": "px"
48569
+ },
48570
+ "blur": {
48571
+ "value": 16,
48572
+ "unit": "px"
48573
+ },
48574
+ "spread": {
48575
+ "value": -4,
48576
+ "unit": "px"
48577
+ }
48578
+ },
48579
+ {
48580
+ "color": "#25292e",
48581
+ "alpha": 0.08,
48582
+ "offsetX": {
48583
+ "value": 0,
48584
+ "unit": "px"
48585
+ },
48586
+ "offsetY": {
48587
+ "value": 4,
48588
+ "unit": "px"
48589
+ },
48590
+ "blur": {
48591
+ "value": 32,
48592
+ "unit": "px"
48593
+ },
48594
+ "spread": {
48595
+ "value": -4,
48596
+ "unit": "px"
48597
+ }
48598
+ },
48599
+ {
48600
+ "color": "#25292e",
48601
+ "alpha": 0.08,
48602
+ "offsetX": {
48603
+ "value": 0,
48604
+ "unit": "px"
48605
+ },
48606
+ "offsetY": {
48607
+ "value": 24,
48608
+ "unit": "px"
48609
+ },
48610
+ "blur": {
48611
+ "value": 48,
48612
+ "unit": "px"
48613
+ },
48614
+ "spread": {
48615
+ "value": -12,
48616
+ "unit": "px"
48617
+ }
48618
+ },
48619
+ {
48620
+ "color": "#25292e",
48621
+ "alpha": 0.08,
48622
+ "offsetX": {
48623
+ "value": 0,
48624
+ "unit": "px"
48625
+ },
48626
+ "offsetY": {
48627
+ "value": 48,
48628
+ "unit": "px"
48629
+ },
48630
+ "blur": {
48631
+ "value": 96,
48632
+ "unit": "px"
48633
+ },
48634
+ "spread": {
48635
+ "value": -24,
48636
+ "unit": "px"
48637
+ }
48638
+ }
48639
+ ],
48640
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48641
+ "isSource": true,
48642
+ "$type": "shadow"
48643
+ },
48644
+ "light-protanopia-deuteranopia-high-contrast": {
48645
+ "$value": [
48646
+ {
48647
+ "color": "#d1d9e080",
48648
+ "alpha": 1,
48649
+ "offsetX": {
48650
+ "value": 0,
48651
+ "unit": "px"
48652
+ },
48653
+ "offsetY": {
48654
+ "value": 0,
48655
+ "unit": "px"
48656
+ },
48657
+ "blur": {
48658
+ "value": 0,
48659
+ "unit": "px"
48660
+ },
48661
+ "spread": {
48662
+ "value": 1,
48663
+ "unit": "px"
48664
+ }
48665
+ },
48666
+ {
48667
+ "color": "#25292e",
48668
+ "alpha": 0.08,
48669
+ "offsetX": {
48670
+ "value": 0,
48671
+ "unit": "px"
48672
+ },
48673
+ "offsetY": {
48674
+ "value": 8,
48675
+ "unit": "px"
48676
+ },
48677
+ "blur": {
48678
+ "value": 16,
48679
+ "unit": "px"
48680
+ },
48681
+ "spread": {
48682
+ "value": -4,
48683
+ "unit": "px"
48684
+ }
48685
+ },
48686
+ {
48687
+ "color": "#25292e",
48688
+ "alpha": 0.08,
48689
+ "offsetX": {
48690
+ "value": 0,
48691
+ "unit": "px"
48692
+ },
48693
+ "offsetY": {
48694
+ "value": 4,
48695
+ "unit": "px"
48696
+ },
48697
+ "blur": {
48698
+ "value": 32,
48699
+ "unit": "px"
48700
+ },
48701
+ "spread": {
48702
+ "value": -4,
48703
+ "unit": "px"
48704
+ }
48705
+ },
48706
+ {
48707
+ "color": "#25292e",
48708
+ "alpha": 0.08,
48709
+ "offsetX": {
48710
+ "value": 0,
48711
+ "unit": "px"
48712
+ },
48713
+ "offsetY": {
48714
+ "value": 24,
48715
+ "unit": "px"
48716
+ },
48717
+ "blur": {
48718
+ "value": 48,
48719
+ "unit": "px"
48720
+ },
48721
+ "spread": {
48722
+ "value": -12,
48723
+ "unit": "px"
48724
+ }
48725
+ },
48726
+ {
48727
+ "color": "#25292e",
48728
+ "alpha": 0.08,
48729
+ "offsetX": {
48730
+ "value": 0,
48731
+ "unit": "px"
48732
+ },
48733
+ "offsetY": {
48734
+ "value": 48,
48735
+ "unit": "px"
48736
+ },
48737
+ "blur": {
48738
+ "value": 96,
48739
+ "unit": "px"
48740
+ },
48741
+ "spread": {
48742
+ "value": -24,
48743
+ "unit": "px"
48744
+ }
48745
+ }
48746
+ ],
48747
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48748
+ "isSource": true,
48749
+ "$type": "shadow"
48750
+ },
48751
+ "light-tritanopia-high-contrast": {
48752
+ "$value": [
48753
+ {
48754
+ "color": "#d1d9e080",
48755
+ "alpha": 1,
48756
+ "offsetX": {
48757
+ "value": 0,
48758
+ "unit": "px"
48759
+ },
48760
+ "offsetY": {
48761
+ "value": 0,
48762
+ "unit": "px"
48763
+ },
48764
+ "blur": {
48765
+ "value": 0,
48766
+ "unit": "px"
48767
+ },
48768
+ "spread": {
48769
+ "value": 1,
48770
+ "unit": "px"
48771
+ }
48772
+ },
48773
+ {
48774
+ "color": "#25292e",
48775
+ "alpha": 0.08,
48776
+ "offsetX": {
48777
+ "value": 0,
48778
+ "unit": "px"
48779
+ },
48780
+ "offsetY": {
48781
+ "value": 8,
48782
+ "unit": "px"
48783
+ },
48784
+ "blur": {
48785
+ "value": 16,
48786
+ "unit": "px"
48787
+ },
48788
+ "spread": {
48789
+ "value": -4,
48790
+ "unit": "px"
48791
+ }
48792
+ },
48793
+ {
48794
+ "color": "#25292e",
48795
+ "alpha": 0.08,
48796
+ "offsetX": {
48797
+ "value": 0,
48798
+ "unit": "px"
48799
+ },
48800
+ "offsetY": {
48801
+ "value": 4,
48802
+ "unit": "px"
48803
+ },
48804
+ "blur": {
48805
+ "value": 32,
48806
+ "unit": "px"
48807
+ },
48808
+ "spread": {
48809
+ "value": -4,
48810
+ "unit": "px"
48811
+ }
48812
+ },
48813
+ {
48814
+ "color": "#25292e",
48815
+ "alpha": 0.08,
48816
+ "offsetX": {
48817
+ "value": 0,
48818
+ "unit": "px"
48819
+ },
48820
+ "offsetY": {
48821
+ "value": 24,
48822
+ "unit": "px"
48823
+ },
48824
+ "blur": {
48825
+ "value": 48,
48826
+ "unit": "px"
48827
+ },
48828
+ "spread": {
48829
+ "value": -12,
48830
+ "unit": "px"
48831
+ }
48832
+ },
48833
+ {
48834
+ "color": "#25292e",
48835
+ "alpha": 0.08,
48836
+ "offsetX": {
48837
+ "value": 0,
48838
+ "unit": "px"
48839
+ },
48840
+ "offsetY": {
48841
+ "value": 48,
48842
+ "unit": "px"
48843
+ },
48844
+ "blur": {
48845
+ "value": 96,
48846
+ "unit": "px"
48847
+ },
48848
+ "spread": {
48849
+ "value": -24,
48850
+ "unit": "px"
48851
+ }
47639
48852
  }
47640
48853
  ],
47641
48854
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47642
48855
  "isSource": true,
47643
48856
  "$type": "shadow"
47644
48857
  }
48858
+ },
48859
+ "org.primer.llm": {
48860
+ "usage": ["popover", "action-menu", "select-panel", "autocomplete"],
48861
+ "rules": "Use for medium-sized floating elements like popovers and action menus. More prominent than small but less than dialogs. Do NOT use for full modals."
47645
48862
  }
47646
48863
  },
47647
48864
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47651,45 +48868,106 @@
47651
48868
  {
47652
48869
  "color": "{overlay.borderColor}",
47653
48870
  "alpha": 0,
47654
- "offsetX": "0px",
47655
- "offsetY": "0px",
47656
- "blur": "0px",
47657
- "spread": "1px"
48871
+ "offsetX": {
48872
+ "value": 0,
48873
+ "unit": "px"
48874
+ },
48875
+ "offsetY": {
48876
+ "value": 0,
48877
+ "unit": "px"
48878
+ },
48879
+ "blur": {
48880
+ "value": 0,
48881
+ "unit": "px"
48882
+ },
48883
+ "spread": {
48884
+ "value": 1,
48885
+ "unit": "px"
48886
+ }
47658
48887
  },
47659
48888
  {
47660
48889
  "color": "{base.color.neutral.12}",
47661
48890
  "alpha": 0.08,
47662
- "offsetX": "0px",
47663
- "offsetY": "8px",
47664
- "blur": "16px",
47665
- "spread": "-4px"
48891
+ "offsetX": {
48892
+ "value": 0,
48893
+ "unit": "px"
48894
+ },
48895
+ "offsetY": {
48896
+ "value": 8,
48897
+ "unit": "px"
48898
+ },
48899
+ "blur": {
48900
+ "value": 16,
48901
+ "unit": "px"
48902
+ },
48903
+ "spread": {
48904
+ "value": -4,
48905
+ "unit": "px"
48906
+ }
47666
48907
  },
47667
48908
  {
47668
48909
  "color": "{base.color.neutral.12}",
47669
48910
  "alpha": 0.08,
47670
- "offsetX": "0px",
47671
- "offsetY": "4px",
47672
- "blur": "32px",
47673
- "spread": "-4px"
48911
+ "offsetX": {
48912
+ "value": 0,
48913
+ "unit": "px"
48914
+ },
48915
+ "offsetY": {
48916
+ "value": 4,
48917
+ "unit": "px"
48918
+ },
48919
+ "blur": {
48920
+ "value": 32,
48921
+ "unit": "px"
48922
+ },
48923
+ "spread": {
48924
+ "value": -4,
48925
+ "unit": "px"
48926
+ }
47674
48927
  },
47675
48928
  {
47676
48929
  "color": "{base.color.neutral.12}",
47677
48930
  "alpha": 0.08,
47678
- "offsetX": "0px",
47679
- "offsetY": "24px",
47680
- "blur": "48px",
47681
- "spread": "-12px"
48931
+ "offsetX": {
48932
+ "value": 0,
48933
+ "unit": "px"
48934
+ },
48935
+ "offsetY": {
48936
+ "value": 24,
48937
+ "unit": "px"
48938
+ },
48939
+ "blur": {
48940
+ "value": 48,
48941
+ "unit": "px"
48942
+ },
48943
+ "spread": {
48944
+ "value": -12,
48945
+ "unit": "px"
48946
+ }
47682
48947
  },
47683
48948
  {
47684
48949
  "color": "{base.color.neutral.12}",
47685
48950
  "alpha": 0.08,
47686
- "offsetX": "0px",
47687
- "offsetY": "48px",
47688
- "blur": "96px",
47689
- "spread": "-24px"
48951
+ "offsetX": {
48952
+ "value": 0,
48953
+ "unit": "px"
48954
+ },
48955
+ "offsetY": {
48956
+ "value": 48,
48957
+ "unit": "px"
48958
+ },
48959
+ "blur": {
48960
+ "value": 96,
48961
+ "unit": "px"
48962
+ },
48963
+ "spread": {
48964
+ "value": -24,
48965
+ "unit": "px"
48966
+ }
47690
48967
  }
47691
48968
  ],
47692
48969
  "$type": "shadow",
48970
+ "$description": "Medium floating shadow for popovers and action menus",
47693
48971
  "$extensions": {
47694
48972
  "org.primer.figma": {
47695
48973
  "collection": "mode",
@@ -47701,48 +48979,433 @@
47701
48979
  {
47702
48980
  "color": "{overlay.borderColor}",
47703
48981
  "alpha": 1,
47704
- "offsetX": "0px",
47705
- "offsetY": "0px",
47706
- "blur": "0px",
47707
- "spread": "1px"
48982
+ "offsetX": {
48983
+ "value": 0,
48984
+ "unit": "px"
48985
+ },
48986
+ "offsetY": {
48987
+ "value": 0,
48988
+ "unit": "px"
48989
+ },
48990
+ "blur": {
48991
+ "value": 0,
48992
+ "unit": "px"
48993
+ },
48994
+ "spread": {
48995
+ "value": 1,
48996
+ "unit": "px"
48997
+ }
47708
48998
  },
47709
48999
  {
47710
49000
  "color": "{base.color.neutral.0}",
47711
49001
  "alpha": 0.4,
47712
- "offsetX": "0px",
47713
- "offsetY": "8px",
47714
- "blur": "16px",
47715
- "spread": "-4px"
49002
+ "offsetX": {
49003
+ "value": 0,
49004
+ "unit": "px"
49005
+ },
49006
+ "offsetY": {
49007
+ "value": 8,
49008
+ "unit": "px"
49009
+ },
49010
+ "blur": {
49011
+ "value": 16,
49012
+ "unit": "px"
49013
+ },
49014
+ "spread": {
49015
+ "value": -4,
49016
+ "unit": "px"
49017
+ }
47716
49018
  },
47717
49019
  {
47718
49020
  "color": "{base.color.neutral.0}",
47719
49021
  "alpha": 0.4,
47720
- "offsetX": "0px",
47721
- "offsetY": "4px",
47722
- "blur": "32px",
47723
- "spread": "-4px"
49022
+ "offsetX": {
49023
+ "value": 0,
49024
+ "unit": "px"
49025
+ },
49026
+ "offsetY": {
49027
+ "value": 4,
49028
+ "unit": "px"
49029
+ },
49030
+ "blur": {
49031
+ "value": 32,
49032
+ "unit": "px"
49033
+ },
49034
+ "spread": {
49035
+ "value": -4,
49036
+ "unit": "px"
49037
+ }
47724
49038
  },
47725
49039
  {
47726
49040
  "color": "{base.color.neutral.0}",
47727
49041
  "alpha": 0.4,
47728
- "offsetX": "0px",
47729
- "offsetY": "24px",
47730
- "blur": "48px",
47731
- "spread": "-12px"
49042
+ "offsetX": {
49043
+ "value": 0,
49044
+ "unit": "px"
49045
+ },
49046
+ "offsetY": {
49047
+ "value": 24,
49048
+ "unit": "px"
49049
+ },
49050
+ "blur": {
49051
+ "value": 48,
49052
+ "unit": "px"
49053
+ },
49054
+ "spread": {
49055
+ "value": -12,
49056
+ "unit": "px"
49057
+ }
47732
49058
  },
47733
49059
  {
47734
49060
  "color": "{base.color.neutral.0}",
47735
49061
  "alpha": 0.4,
47736
- "offsetX": "0px",
47737
- "offsetY": "48px",
47738
- "blur": "96px",
47739
- "spread": "-24px"
49062
+ "offsetX": {
49063
+ "value": 0,
49064
+ "unit": "px"
49065
+ },
49066
+ "offsetY": {
49067
+ "value": 48,
49068
+ "unit": "px"
49069
+ },
49070
+ "blur": {
49071
+ "value": 96,
49072
+ "unit": "px"
49073
+ },
49074
+ "spread": {
49075
+ "value": -24,
49076
+ "unit": "px"
49077
+ }
49078
+ }
49079
+ ],
49080
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49081
+ "isSource": true,
49082
+ "$type": "shadow"
49083
+ },
49084
+ "light-high-contrast": {
49085
+ "$value": [
49086
+ {
49087
+ "color": "{overlay.borderColor}",
49088
+ "alpha": 1,
49089
+ "offsetX": {
49090
+ "value": 0,
49091
+ "unit": "px"
49092
+ },
49093
+ "offsetY": {
49094
+ "value": 0,
49095
+ "unit": "px"
49096
+ },
49097
+ "blur": {
49098
+ "value": 0,
49099
+ "unit": "px"
49100
+ },
49101
+ "spread": {
49102
+ "value": 1,
49103
+ "unit": "px"
49104
+ }
49105
+ },
49106
+ {
49107
+ "color": "{base.color.neutral.12}",
49108
+ "alpha": 0.08,
49109
+ "offsetX": {
49110
+ "value": 0,
49111
+ "unit": "px"
49112
+ },
49113
+ "offsetY": {
49114
+ "value": 8,
49115
+ "unit": "px"
49116
+ },
49117
+ "blur": {
49118
+ "value": 16,
49119
+ "unit": "px"
49120
+ },
49121
+ "spread": {
49122
+ "value": -4,
49123
+ "unit": "px"
49124
+ }
49125
+ },
49126
+ {
49127
+ "color": "{base.color.neutral.12}",
49128
+ "alpha": 0.08,
49129
+ "offsetX": {
49130
+ "value": 0,
49131
+ "unit": "px"
49132
+ },
49133
+ "offsetY": {
49134
+ "value": 4,
49135
+ "unit": "px"
49136
+ },
49137
+ "blur": {
49138
+ "value": 32,
49139
+ "unit": "px"
49140
+ },
49141
+ "spread": {
49142
+ "value": -4,
49143
+ "unit": "px"
49144
+ }
49145
+ },
49146
+ {
49147
+ "color": "{base.color.neutral.12}",
49148
+ "alpha": 0.08,
49149
+ "offsetX": {
49150
+ "value": 0,
49151
+ "unit": "px"
49152
+ },
49153
+ "offsetY": {
49154
+ "value": 24,
49155
+ "unit": "px"
49156
+ },
49157
+ "blur": {
49158
+ "value": 48,
49159
+ "unit": "px"
49160
+ },
49161
+ "spread": {
49162
+ "value": -12,
49163
+ "unit": "px"
49164
+ }
49165
+ },
49166
+ {
49167
+ "color": "{base.color.neutral.12}",
49168
+ "alpha": 0.08,
49169
+ "offsetX": {
49170
+ "value": 0,
49171
+ "unit": "px"
49172
+ },
49173
+ "offsetY": {
49174
+ "value": 48,
49175
+ "unit": "px"
49176
+ },
49177
+ "blur": {
49178
+ "value": 96,
49179
+ "unit": "px"
49180
+ },
49181
+ "spread": {
49182
+ "value": -24,
49183
+ "unit": "px"
49184
+ }
49185
+ }
49186
+ ],
49187
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49188
+ "isSource": true,
49189
+ "$type": "shadow"
49190
+ },
49191
+ "light-protanopia-deuteranopia-high-contrast": {
49192
+ "$value": [
49193
+ {
49194
+ "color": "{overlay.borderColor}",
49195
+ "alpha": 1,
49196
+ "offsetX": {
49197
+ "value": 0,
49198
+ "unit": "px"
49199
+ },
49200
+ "offsetY": {
49201
+ "value": 0,
49202
+ "unit": "px"
49203
+ },
49204
+ "blur": {
49205
+ "value": 0,
49206
+ "unit": "px"
49207
+ },
49208
+ "spread": {
49209
+ "value": 1,
49210
+ "unit": "px"
49211
+ }
49212
+ },
49213
+ {
49214
+ "color": "{base.color.neutral.12}",
49215
+ "alpha": 0.08,
49216
+ "offsetX": {
49217
+ "value": 0,
49218
+ "unit": "px"
49219
+ },
49220
+ "offsetY": {
49221
+ "value": 8,
49222
+ "unit": "px"
49223
+ },
49224
+ "blur": {
49225
+ "value": 16,
49226
+ "unit": "px"
49227
+ },
49228
+ "spread": {
49229
+ "value": -4,
49230
+ "unit": "px"
49231
+ }
49232
+ },
49233
+ {
49234
+ "color": "{base.color.neutral.12}",
49235
+ "alpha": 0.08,
49236
+ "offsetX": {
49237
+ "value": 0,
49238
+ "unit": "px"
49239
+ },
49240
+ "offsetY": {
49241
+ "value": 4,
49242
+ "unit": "px"
49243
+ },
49244
+ "blur": {
49245
+ "value": 32,
49246
+ "unit": "px"
49247
+ },
49248
+ "spread": {
49249
+ "value": -4,
49250
+ "unit": "px"
49251
+ }
49252
+ },
49253
+ {
49254
+ "color": "{base.color.neutral.12}",
49255
+ "alpha": 0.08,
49256
+ "offsetX": {
49257
+ "value": 0,
49258
+ "unit": "px"
49259
+ },
49260
+ "offsetY": {
49261
+ "value": 24,
49262
+ "unit": "px"
49263
+ },
49264
+ "blur": {
49265
+ "value": 48,
49266
+ "unit": "px"
49267
+ },
49268
+ "spread": {
49269
+ "value": -12,
49270
+ "unit": "px"
49271
+ }
49272
+ },
49273
+ {
49274
+ "color": "{base.color.neutral.12}",
49275
+ "alpha": 0.08,
49276
+ "offsetX": {
49277
+ "value": 0,
49278
+ "unit": "px"
49279
+ },
49280
+ "offsetY": {
49281
+ "value": 48,
49282
+ "unit": "px"
49283
+ },
49284
+ "blur": {
49285
+ "value": 96,
49286
+ "unit": "px"
49287
+ },
49288
+ "spread": {
49289
+ "value": -24,
49290
+ "unit": "px"
49291
+ }
49292
+ }
49293
+ ],
49294
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49295
+ "isSource": true,
49296
+ "$type": "shadow"
49297
+ },
49298
+ "light-tritanopia-high-contrast": {
49299
+ "$value": [
49300
+ {
49301
+ "color": "{overlay.borderColor}",
49302
+ "alpha": 1,
49303
+ "offsetX": {
49304
+ "value": 0,
49305
+ "unit": "px"
49306
+ },
49307
+ "offsetY": {
49308
+ "value": 0,
49309
+ "unit": "px"
49310
+ },
49311
+ "blur": {
49312
+ "value": 0,
49313
+ "unit": "px"
49314
+ },
49315
+ "spread": {
49316
+ "value": 1,
49317
+ "unit": "px"
49318
+ }
49319
+ },
49320
+ {
49321
+ "color": "{base.color.neutral.12}",
49322
+ "alpha": 0.08,
49323
+ "offsetX": {
49324
+ "value": 0,
49325
+ "unit": "px"
49326
+ },
49327
+ "offsetY": {
49328
+ "value": 8,
49329
+ "unit": "px"
49330
+ },
49331
+ "blur": {
49332
+ "value": 16,
49333
+ "unit": "px"
49334
+ },
49335
+ "spread": {
49336
+ "value": -4,
49337
+ "unit": "px"
49338
+ }
49339
+ },
49340
+ {
49341
+ "color": "{base.color.neutral.12}",
49342
+ "alpha": 0.08,
49343
+ "offsetX": {
49344
+ "value": 0,
49345
+ "unit": "px"
49346
+ },
49347
+ "offsetY": {
49348
+ "value": 4,
49349
+ "unit": "px"
49350
+ },
49351
+ "blur": {
49352
+ "value": 32,
49353
+ "unit": "px"
49354
+ },
49355
+ "spread": {
49356
+ "value": -4,
49357
+ "unit": "px"
49358
+ }
49359
+ },
49360
+ {
49361
+ "color": "{base.color.neutral.12}",
49362
+ "alpha": 0.08,
49363
+ "offsetX": {
49364
+ "value": 0,
49365
+ "unit": "px"
49366
+ },
49367
+ "offsetY": {
49368
+ "value": 24,
49369
+ "unit": "px"
49370
+ },
49371
+ "blur": {
49372
+ "value": 48,
49373
+ "unit": "px"
49374
+ },
49375
+ "spread": {
49376
+ "value": -12,
49377
+ "unit": "px"
49378
+ }
49379
+ },
49380
+ {
49381
+ "color": "{base.color.neutral.12}",
49382
+ "alpha": 0.08,
49383
+ "offsetX": {
49384
+ "value": 0,
49385
+ "unit": "px"
49386
+ },
49387
+ "offsetY": {
49388
+ "value": 48,
49389
+ "unit": "px"
49390
+ },
49391
+ "blur": {
49392
+ "value": 96,
49393
+ "unit": "px"
49394
+ },
49395
+ "spread": {
49396
+ "value": -24,
49397
+ "unit": "px"
49398
+ }
47740
49399
  }
47741
49400
  ],
47742
49401
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47743
49402
  "isSource": true,
47744
49403
  "$type": "shadow"
47745
49404
  }
49405
+ },
49406
+ "org.primer.llm": {
49407
+ "usage": ["popover", "action-menu", "select-panel", "autocomplete"],
49408
+ "rules": "Use for medium-sized floating elements like popovers and action menus. More prominent than small but less than dialogs. Do NOT use for full modals."
47746
49409
  }
47747
49410
  },
47748
49411
  "key": "{shadow.floating.medium}"
@@ -47753,7 +49416,7 @@
47753
49416
  },
47754
49417
  "shadow-floating-small": {
47755
49418
  "key": "{shadow.floating.small}",
47756
- "$value": "0px 0px 0px 1px #d1d9e080, 0px 6px 12px -3px #25292e0a, 0px 6px 18px 0px #25292e1f",
49419
+ "$value": "0 0 0 1px #d1d9e080, 0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f",
47757
49420
  "$type": "shadow",
47758
49421
  "$description": "Small floating shadow for dropdowns, tooltips, and small overlays",
47759
49422
  "$extensions": {
@@ -47767,26 +49430,62 @@
47767
49430
  {
47768
49431
  "color": "#d1d9e080",
47769
49432
  "alpha": 1,
47770
- "offsetX": "0px",
47771
- "offsetY": "0px",
47772
- "blur": "0px",
47773
- "spread": "1px"
49433
+ "offsetX": {
49434
+ "value": 0,
49435
+ "unit": "px"
49436
+ },
49437
+ "offsetY": {
49438
+ "value": 0,
49439
+ "unit": "px"
49440
+ },
49441
+ "blur": {
49442
+ "value": 0,
49443
+ "unit": "px"
49444
+ },
49445
+ "spread": {
49446
+ "value": 1,
49447
+ "unit": "px"
49448
+ }
47774
49449
  },
47775
49450
  {
47776
49451
  "color": "#ffffff",
47777
49452
  "alpha": 0.4,
47778
- "offsetX": "0px",
47779
- "offsetY": "6px",
47780
- "blur": "12px",
47781
- "spread": "-3px"
49453
+ "offsetX": {
49454
+ "value": 0,
49455
+ "unit": "px"
49456
+ },
49457
+ "offsetY": {
49458
+ "value": 6,
49459
+ "unit": "px"
49460
+ },
49461
+ "blur": {
49462
+ "value": 12,
49463
+ "unit": "px"
49464
+ },
49465
+ "spread": {
49466
+ "value": -3,
49467
+ "unit": "px"
49468
+ }
47782
49469
  },
47783
49470
  {
47784
49471
  "color": "#ffffff",
47785
49472
  "alpha": 0.4,
47786
- "offsetX": "0px",
47787
- "offsetY": "6px",
47788
- "blur": "18px",
47789
- "spread": "0px"
49473
+ "offsetX": {
49474
+ "value": 0,
49475
+ "unit": "px"
49476
+ },
49477
+ "offsetY": {
49478
+ "value": 6,
49479
+ "unit": "px"
49480
+ },
49481
+ "blur": {
49482
+ "value": 18,
49483
+ "unit": "px"
49484
+ },
49485
+ "spread": {
49486
+ "value": 0,
49487
+ "unit": "px"
49488
+ }
47790
49489
  }
47791
49490
  ],
47792
49491
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47806,26 +49505,62 @@
47806
49505
  {
47807
49506
  "color": "{overlay.borderColor}",
47808
49507
  "alpha": 0.5,
47809
- "offsetX": "0px",
47810
- "offsetY": "0px",
47811
- "blur": "0px",
47812
- "spread": "1px"
49508
+ "offsetX": {
49509
+ "value": 0,
49510
+ "unit": "px"
49511
+ },
49512
+ "offsetY": {
49513
+ "value": 0,
49514
+ "unit": "px"
49515
+ },
49516
+ "blur": {
49517
+ "value": 0,
49518
+ "unit": "px"
49519
+ },
49520
+ "spread": {
49521
+ "value": 1,
49522
+ "unit": "px"
49523
+ }
47813
49524
  },
47814
49525
  {
47815
49526
  "color": "{base.color.neutral.12}",
47816
49527
  "alpha": 0.04,
47817
- "offsetX": "0px",
47818
- "offsetY": "6px",
47819
- "blur": "12px",
47820
- "spread": "-3px"
49528
+ "offsetX": {
49529
+ "value": 0,
49530
+ "unit": "px"
49531
+ },
49532
+ "offsetY": {
49533
+ "value": 6,
49534
+ "unit": "px"
49535
+ },
49536
+ "blur": {
49537
+ "value": 12,
49538
+ "unit": "px"
49539
+ },
49540
+ "spread": {
49541
+ "value": -3,
49542
+ "unit": "px"
49543
+ }
47821
49544
  },
47822
49545
  {
47823
49546
  "color": "{base.color.neutral.12}",
47824
49547
  "alpha": 0.12,
47825
- "offsetX": "0px",
47826
- "offsetY": "6px",
47827
- "blur": "18px",
47828
- "spread": "0px"
49548
+ "offsetX": {
49549
+ "value": 0,
49550
+ "unit": "px"
49551
+ },
49552
+ "offsetY": {
49553
+ "value": 6,
49554
+ "unit": "px"
49555
+ },
49556
+ "blur": {
49557
+ "value": 18,
49558
+ "unit": "px"
49559
+ },
49560
+ "spread": {
49561
+ "value": 0,
49562
+ "unit": "px"
49563
+ }
47829
49564
  }
47830
49565
  ],
47831
49566
  "$type": "shadow",
@@ -47841,26 +49576,62 @@
47841
49576
  {
47842
49577
  "color": "{overlay.borderColor}",
47843
49578
  "alpha": 1,
47844
- "offsetX": "0px",
47845
- "offsetY": "0px",
47846
- "blur": "0px",
47847
- "spread": "1px"
49579
+ "offsetX": {
49580
+ "value": 0,
49581
+ "unit": "px"
49582
+ },
49583
+ "offsetY": {
49584
+ "value": 0,
49585
+ "unit": "px"
49586
+ },
49587
+ "blur": {
49588
+ "value": 0,
49589
+ "unit": "px"
49590
+ },
49591
+ "spread": {
49592
+ "value": 1,
49593
+ "unit": "px"
49594
+ }
47848
49595
  },
47849
49596
  {
47850
49597
  "color": "{base.color.neutral.0}",
47851
49598
  "alpha": 0.4,
47852
- "offsetX": "0px",
47853
- "offsetY": "6px",
47854
- "blur": "12px",
47855
- "spread": "-3px"
49599
+ "offsetX": {
49600
+ "value": 0,
49601
+ "unit": "px"
49602
+ },
49603
+ "offsetY": {
49604
+ "value": 6,
49605
+ "unit": "px"
49606
+ },
49607
+ "blur": {
49608
+ "value": 12,
49609
+ "unit": "px"
49610
+ },
49611
+ "spread": {
49612
+ "value": -3,
49613
+ "unit": "px"
49614
+ }
47856
49615
  },
47857
49616
  {
47858
49617
  "color": "{base.color.neutral.0}",
47859
49618
  "alpha": 0.4,
47860
- "offsetX": "0px",
47861
- "offsetY": "6px",
47862
- "blur": "18px",
47863
- "spread": "0px"
49619
+ "offsetX": {
49620
+ "value": 0,
49621
+ "unit": "px"
49622
+ },
49623
+ "offsetY": {
49624
+ "value": 6,
49625
+ "unit": "px"
49626
+ },
49627
+ "blur": {
49628
+ "value": 18,
49629
+ "unit": "px"
49630
+ },
49631
+ "spread": {
49632
+ "value": 0,
49633
+ "unit": "px"
49634
+ }
47864
49635
  }
47865
49636
  ],
47866
49637
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47881,8 +49652,9 @@
47881
49652
  },
47882
49653
  "shadow-floating-xlarge": {
47883
49654
  "key": "{shadow.floating.xlarge}",
47884
- "$value": "0px 0px 0px 1px #d1d9e0, 0px 56px 112px 0px #25292e52",
49655
+ "$value": "0 0 0 1px #d1d9e000, 0 56px 112px 0 #25292e52",
47885
49656
  "$type": "shadow",
49657
+ "$description": "Extra large floating shadow for full-screen overlays and sheets",
47886
49658
  "$extensions": {
47887
49659
  "org.primer.figma": {
47888
49660
  "collection": "mode",
@@ -47894,24 +49666,193 @@
47894
49666
  {
47895
49667
  "color": "#d1d9e080",
47896
49668
  "alpha": 1,
47897
- "offsetX": "0px",
47898
- "offsetY": "0px",
47899
- "blur": "0px",
47900
- "spread": "1px"
49669
+ "offsetX": {
49670
+ "value": 0,
49671
+ "unit": "px"
49672
+ },
49673
+ "offsetY": {
49674
+ "value": 0,
49675
+ "unit": "px"
49676
+ },
49677
+ "blur": {
49678
+ "value": 0,
49679
+ "unit": "px"
49680
+ },
49681
+ "spread": {
49682
+ "value": 1,
49683
+ "unit": "px"
49684
+ }
47901
49685
  },
47902
49686
  {
47903
49687
  "color": "#ffffff",
47904
49688
  "alpha": 1,
47905
- "offsetX": "0px",
47906
- "offsetY": "32px",
47907
- "blur": "64px",
47908
- "spread": "0px"
49689
+ "offsetX": {
49690
+ "value": 0,
49691
+ "unit": "px"
49692
+ },
49693
+ "offsetY": {
49694
+ "value": 32,
49695
+ "unit": "px"
49696
+ },
49697
+ "blur": {
49698
+ "value": 64,
49699
+ "unit": "px"
49700
+ },
49701
+ "spread": {
49702
+ "value": 0,
49703
+ "unit": "px"
49704
+ }
49705
+ }
49706
+ ],
49707
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49708
+ "isSource": true,
49709
+ "$type": "shadow"
49710
+ },
49711
+ "light-high-contrast": {
49712
+ "$value": [
49713
+ {
49714
+ "color": "#d1d9e080",
49715
+ "alpha": 1,
49716
+ "offsetX": {
49717
+ "value": 0,
49718
+ "unit": "px"
49719
+ },
49720
+ "offsetY": {
49721
+ "value": 0,
49722
+ "unit": "px"
49723
+ },
49724
+ "blur": {
49725
+ "value": 0,
49726
+ "unit": "px"
49727
+ },
49728
+ "spread": {
49729
+ "value": 1,
49730
+ "unit": "px"
49731
+ }
49732
+ },
49733
+ {
49734
+ "color": "#25292e",
49735
+ "alpha": 0.32,
49736
+ "offsetX": {
49737
+ "value": 0,
49738
+ "unit": "px"
49739
+ },
49740
+ "offsetY": {
49741
+ "value": 56,
49742
+ "unit": "px"
49743
+ },
49744
+ "blur": {
49745
+ "value": 112,
49746
+ "unit": "px"
49747
+ },
49748
+ "spread": {
49749
+ "value": 0,
49750
+ "unit": "px"
49751
+ }
49752
+ }
49753
+ ],
49754
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49755
+ "isSource": true,
49756
+ "$type": "shadow"
49757
+ },
49758
+ "light-protanopia-deuteranopia-high-contrast": {
49759
+ "$value": [
49760
+ {
49761
+ "color": "#d1d9e080",
49762
+ "alpha": 1,
49763
+ "offsetX": {
49764
+ "value": 0,
49765
+ "unit": "px"
49766
+ },
49767
+ "offsetY": {
49768
+ "value": 0,
49769
+ "unit": "px"
49770
+ },
49771
+ "blur": {
49772
+ "value": 0,
49773
+ "unit": "px"
49774
+ },
49775
+ "spread": {
49776
+ "value": 1,
49777
+ "unit": "px"
49778
+ }
49779
+ },
49780
+ {
49781
+ "color": "#25292e",
49782
+ "alpha": 0.32,
49783
+ "offsetX": {
49784
+ "value": 0,
49785
+ "unit": "px"
49786
+ },
49787
+ "offsetY": {
49788
+ "value": 56,
49789
+ "unit": "px"
49790
+ },
49791
+ "blur": {
49792
+ "value": 112,
49793
+ "unit": "px"
49794
+ },
49795
+ "spread": {
49796
+ "value": 0,
49797
+ "unit": "px"
49798
+ }
49799
+ }
49800
+ ],
49801
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49802
+ "isSource": true,
49803
+ "$type": "shadow"
49804
+ },
49805
+ "light-tritanopia-high-contrast": {
49806
+ "$value": [
49807
+ {
49808
+ "color": "#d1d9e080",
49809
+ "alpha": 1,
49810
+ "offsetX": {
49811
+ "value": 0,
49812
+ "unit": "px"
49813
+ },
49814
+ "offsetY": {
49815
+ "value": 0,
49816
+ "unit": "px"
49817
+ },
49818
+ "blur": {
49819
+ "value": 0,
49820
+ "unit": "px"
49821
+ },
49822
+ "spread": {
49823
+ "value": 1,
49824
+ "unit": "px"
49825
+ }
49826
+ },
49827
+ {
49828
+ "color": "#25292e",
49829
+ "alpha": 0.32,
49830
+ "offsetX": {
49831
+ "value": 0,
49832
+ "unit": "px"
49833
+ },
49834
+ "offsetY": {
49835
+ "value": 56,
49836
+ "unit": "px"
49837
+ },
49838
+ "blur": {
49839
+ "value": 112,
49840
+ "unit": "px"
49841
+ },
49842
+ "spread": {
49843
+ "value": 0,
49844
+ "unit": "px"
49845
+ }
47909
49846
  }
47910
49847
  ],
47911
49848
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47912
49849
  "isSource": true,
47913
49850
  "$type": "shadow"
47914
49851
  }
49852
+ },
49853
+ "org.primer.llm": {
49854
+ "usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
49855
+ "rules": "Use for full-screen or near-full-screen overlays like side sheets and drawers. Maximum elevation in the system. Do NOT use for small floating elements."
47915
49856
  }
47916
49857
  },
47917
49858
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47921,21 +49862,46 @@
47921
49862
  {
47922
49863
  "color": "{overlay.borderColor}",
47923
49864
  "alpha": 0,
47924
- "offsetX": "0px",
47925
- "offsetY": "0px",
47926
- "blur": "0px",
47927
- "spread": "1px"
49865
+ "offsetX": {
49866
+ "value": 0,
49867
+ "unit": "px"
49868
+ },
49869
+ "offsetY": {
49870
+ "value": 0,
49871
+ "unit": "px"
49872
+ },
49873
+ "blur": {
49874
+ "value": 0,
49875
+ "unit": "px"
49876
+ },
49877
+ "spread": {
49878
+ "value": 1,
49879
+ "unit": "px"
49880
+ }
47928
49881
  },
47929
49882
  {
47930
49883
  "color": "{base.color.neutral.12}",
47931
49884
  "alpha": 0.32,
47932
- "offsetX": "0px",
47933
- "offsetY": "56px",
47934
- "blur": "112px",
47935
- "spread": "0px"
49885
+ "offsetX": {
49886
+ "value": 0,
49887
+ "unit": "px"
49888
+ },
49889
+ "offsetY": {
49890
+ "value": 56,
49891
+ "unit": "px"
49892
+ },
49893
+ "blur": {
49894
+ "value": 112,
49895
+ "unit": "px"
49896
+ },
49897
+ "spread": {
49898
+ "value": 0,
49899
+ "unit": "px"
49900
+ }
47936
49901
  }
47937
49902
  ],
47938
49903
  "$type": "shadow",
49904
+ "$description": "Extra large floating shadow for full-screen overlays and sheets",
47939
49905
  "$extensions": {
47940
49906
  "org.primer.figma": {
47941
49907
  "collection": "mode",
@@ -47947,24 +49913,193 @@
47947
49913
  {
47948
49914
  "color": "{overlay.borderColor}",
47949
49915
  "alpha": 1,
47950
- "offsetX": "0px",
47951
- "offsetY": "0px",
47952
- "blur": "0px",
47953
- "spread": "1px"
49916
+ "offsetX": {
49917
+ "value": 0,
49918
+ "unit": "px"
49919
+ },
49920
+ "offsetY": {
49921
+ "value": 0,
49922
+ "unit": "px"
49923
+ },
49924
+ "blur": {
49925
+ "value": 0,
49926
+ "unit": "px"
49927
+ },
49928
+ "spread": {
49929
+ "value": 1,
49930
+ "unit": "px"
49931
+ }
47954
49932
  },
47955
49933
  {
47956
49934
  "color": "{base.color.neutral.0}",
47957
49935
  "alpha": 1,
47958
- "offsetX": "0px",
47959
- "offsetY": "32px",
47960
- "blur": "64px",
47961
- "spread": "0px"
49936
+ "offsetX": {
49937
+ "value": 0,
49938
+ "unit": "px"
49939
+ },
49940
+ "offsetY": {
49941
+ "value": 32,
49942
+ "unit": "px"
49943
+ },
49944
+ "blur": {
49945
+ "value": 64,
49946
+ "unit": "px"
49947
+ },
49948
+ "spread": {
49949
+ "value": 0,
49950
+ "unit": "px"
49951
+ }
49952
+ }
49953
+ ],
49954
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49955
+ "isSource": true,
49956
+ "$type": "shadow"
49957
+ },
49958
+ "light-high-contrast": {
49959
+ "$value": [
49960
+ {
49961
+ "color": "{overlay.borderColor}",
49962
+ "alpha": 1,
49963
+ "offsetX": {
49964
+ "value": 0,
49965
+ "unit": "px"
49966
+ },
49967
+ "offsetY": {
49968
+ "value": 0,
49969
+ "unit": "px"
49970
+ },
49971
+ "blur": {
49972
+ "value": 0,
49973
+ "unit": "px"
49974
+ },
49975
+ "spread": {
49976
+ "value": 1,
49977
+ "unit": "px"
49978
+ }
49979
+ },
49980
+ {
49981
+ "color": "{base.color.neutral.12}",
49982
+ "alpha": 0.32,
49983
+ "offsetX": {
49984
+ "value": 0,
49985
+ "unit": "px"
49986
+ },
49987
+ "offsetY": {
49988
+ "value": 56,
49989
+ "unit": "px"
49990
+ },
49991
+ "blur": {
49992
+ "value": 112,
49993
+ "unit": "px"
49994
+ },
49995
+ "spread": {
49996
+ "value": 0,
49997
+ "unit": "px"
49998
+ }
49999
+ }
50000
+ ],
50001
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
50002
+ "isSource": true,
50003
+ "$type": "shadow"
50004
+ },
50005
+ "light-protanopia-deuteranopia-high-contrast": {
50006
+ "$value": [
50007
+ {
50008
+ "color": "{overlay.borderColor}",
50009
+ "alpha": 1,
50010
+ "offsetX": {
50011
+ "value": 0,
50012
+ "unit": "px"
50013
+ },
50014
+ "offsetY": {
50015
+ "value": 0,
50016
+ "unit": "px"
50017
+ },
50018
+ "blur": {
50019
+ "value": 0,
50020
+ "unit": "px"
50021
+ },
50022
+ "spread": {
50023
+ "value": 1,
50024
+ "unit": "px"
50025
+ }
50026
+ },
50027
+ {
50028
+ "color": "{base.color.neutral.12}",
50029
+ "alpha": 0.32,
50030
+ "offsetX": {
50031
+ "value": 0,
50032
+ "unit": "px"
50033
+ },
50034
+ "offsetY": {
50035
+ "value": 56,
50036
+ "unit": "px"
50037
+ },
50038
+ "blur": {
50039
+ "value": 112,
50040
+ "unit": "px"
50041
+ },
50042
+ "spread": {
50043
+ "value": 0,
50044
+ "unit": "px"
50045
+ }
50046
+ }
50047
+ ],
50048
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
50049
+ "isSource": true,
50050
+ "$type": "shadow"
50051
+ },
50052
+ "light-tritanopia-high-contrast": {
50053
+ "$value": [
50054
+ {
50055
+ "color": "{overlay.borderColor}",
50056
+ "alpha": 1,
50057
+ "offsetX": {
50058
+ "value": 0,
50059
+ "unit": "px"
50060
+ },
50061
+ "offsetY": {
50062
+ "value": 0,
50063
+ "unit": "px"
50064
+ },
50065
+ "blur": {
50066
+ "value": 0,
50067
+ "unit": "px"
50068
+ },
50069
+ "spread": {
50070
+ "value": 1,
50071
+ "unit": "px"
50072
+ }
50073
+ },
50074
+ {
50075
+ "color": "{base.color.neutral.12}",
50076
+ "alpha": 0.32,
50077
+ "offsetX": {
50078
+ "value": 0,
50079
+ "unit": "px"
50080
+ },
50081
+ "offsetY": {
50082
+ "value": 56,
50083
+ "unit": "px"
50084
+ },
50085
+ "blur": {
50086
+ "value": 112,
50087
+ "unit": "px"
50088
+ },
50089
+ "spread": {
50090
+ "value": 0,
50091
+ "unit": "px"
50092
+ }
47962
50093
  }
47963
50094
  ],
47964
50095
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47965
50096
  "isSource": true,
47966
50097
  "$type": "shadow"
47967
50098
  }
50099
+ },
50100
+ "org.primer.llm": {
50101
+ "usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
50102
+ "rules": "Use for full-screen or near-full-screen overlays like side sheets and drawers. Maximum elevation in the system. Do NOT use for small floating elements."
47968
50103
  }
47969
50104
  },
47970
50105
  "key": "{shadow.floating.xlarge}"
@@ -47975,8 +50110,9 @@
47975
50110
  },
47976
50111
  "shadow-inset": {
47977
50112
  "key": "{shadow.inset}",
47978
- "$value": "inset 0px 1px 0px 0px #1f23280a",
50113
+ "$value": "inset 0 1px 0 0 #1f23280a",
47979
50114
  "$type": "shadow",
50115
+ "$description": "Inset shadow for recessed elements",
47980
50116
  "$extensions": {
47981
50117
  "org.primer.figma": {
47982
50118
  "collection": "mode",
@@ -47987,16 +50123,32 @@
47987
50123
  "$value": {
47988
50124
  "color": "#ffffff",
47989
50125
  "alpha": 0.24,
47990
- "offsetX": "0px",
47991
- "offsetY": "1px",
47992
- "blur": "0px",
47993
- "spread": "0px",
50126
+ "offsetX": {
50127
+ "value": 0,
50128
+ "unit": "px"
50129
+ },
50130
+ "offsetY": {
50131
+ "value": 1,
50132
+ "unit": "px"
50133
+ },
50134
+ "blur": {
50135
+ "value": 0,
50136
+ "unit": "px"
50137
+ },
50138
+ "spread": {
50139
+ "value": 0,
50140
+ "unit": "px"
50141
+ },
47994
50142
  "inset": true
47995
50143
  },
47996
50144
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47997
50145
  "isSource": true,
47998
50146
  "$type": "shadow"
47999
50147
  }
50148
+ },
50149
+ "org.primer.llm": {
50150
+ "usage": ["input-field", "pressed-button", "recessed-area", "well"],
50151
+ "rules": "Use for elements that appear pressed or inset into the surface. Commonly used for input fields and wells. Do NOT use for floating elements."
48000
50152
  }
48001
50153
  },
48002
50154
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48005,13 +50157,26 @@
48005
50157
  "$value": {
48006
50158
  "color": "{base.color.neutral.13}",
48007
50159
  "alpha": 0.04,
48008
- "offsetX": "0px",
48009
- "offsetY": "1px",
48010
- "blur": "0px",
48011
- "spread": "0px",
50160
+ "offsetX": {
50161
+ "value": 0,
50162
+ "unit": "px"
50163
+ },
50164
+ "offsetY": {
50165
+ "value": 1,
50166
+ "unit": "px"
50167
+ },
50168
+ "blur": {
50169
+ "value": 0,
50170
+ "unit": "px"
50171
+ },
50172
+ "spread": {
50173
+ "value": 0,
50174
+ "unit": "px"
50175
+ },
48012
50176
  "inset": true
48013
50177
  },
48014
50178
  "$type": "shadow",
50179
+ "$description": "Inset shadow for recessed elements",
48015
50180
  "$extensions": {
48016
50181
  "org.primer.figma": {
48017
50182
  "collection": "mode",
@@ -48022,16 +50187,32 @@
48022
50187
  "$value": {
48023
50188
  "color": "{base.color.neutral.0}",
48024
50189
  "alpha": 0.24,
48025
- "offsetX": "0px",
48026
- "offsetY": "1px",
48027
- "blur": "0px",
48028
- "spread": "0px",
50190
+ "offsetX": {
50191
+ "value": 0,
50192
+ "unit": "px"
50193
+ },
50194
+ "offsetY": {
50195
+ "value": 1,
50196
+ "unit": "px"
50197
+ },
50198
+ "blur": {
50199
+ "value": 0,
50200
+ "unit": "px"
50201
+ },
50202
+ "spread": {
50203
+ "value": 0,
50204
+ "unit": "px"
50205
+ },
48029
50206
  "inset": true
48030
50207
  },
48031
50208
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48032
50209
  "isSource": true,
48033
50210
  "$type": "shadow"
48034
50211
  }
50212
+ },
50213
+ "org.primer.llm": {
50214
+ "usage": ["input-field", "pressed-button", "recessed-area", "well"],
50215
+ "rules": "Use for elements that appear pressed or inset into the surface. Commonly used for input fields and wells. Do NOT use for floating elements."
48035
50216
  }
48036
50217
  },
48037
50218
  "key": "{shadow.inset}"
@@ -48042,8 +50223,9 @@
48042
50223
  },
48043
50224
  "shadow-resting-medium": {
48044
50225
  "key": "{shadow.resting.medium}",
48045
- "$value": "0px 1px 1px 0px #25292e1a, 0px 3px 6px 0px #25292e1f",
50226
+ "$value": "0 1px 1px 0 #25292e1a, 0 3px 6px 0 #25292e1f",
48046
50227
  "$type": "shadow",
50228
+ "$description": "Medium resting shadow for cards and elevated surfaces",
48047
50229
  "$extensions": {
48048
50230
  "org.primer.figma": {
48049
50231
  "collection": "mode",
@@ -48055,24 +50237,52 @@
48055
50237
  {
48056
50238
  "color": "#ffffff",
48057
50239
  "alpha": 0.4,
48058
- "offsetX": "0px",
48059
- "offsetY": "1px",
48060
- "blur": "1px",
48061
- "spread": "0px"
50240
+ "offsetX": {
50241
+ "value": 0,
50242
+ "unit": "px"
50243
+ },
50244
+ "offsetY": {
50245
+ "value": 1,
50246
+ "unit": "px"
50247
+ },
50248
+ "blur": {
50249
+ "value": 1,
50250
+ "unit": "px"
50251
+ },
50252
+ "spread": {
50253
+ "value": 0,
50254
+ "unit": "px"
50255
+ }
48062
50256
  },
48063
50257
  {
48064
50258
  "color": "#ffffff",
48065
50259
  "alpha": 0.8,
48066
- "offsetX": "0px",
48067
- "offsetY": "3px",
48068
- "blur": "6px",
48069
- "spread": "0px"
50260
+ "offsetX": {
50261
+ "value": 0,
50262
+ "unit": "px"
50263
+ },
50264
+ "offsetY": {
50265
+ "value": 3,
50266
+ "unit": "px"
50267
+ },
50268
+ "blur": {
50269
+ "value": 6,
50270
+ "unit": "px"
50271
+ },
50272
+ "spread": {
50273
+ "value": 0,
50274
+ "unit": "px"
50275
+ }
48070
50276
  }
48071
50277
  ],
48072
50278
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48073
50279
  "isSource": true,
48074
50280
  "$type": "shadow"
48075
50281
  }
50282
+ },
50283
+ "org.primer.llm": {
50284
+ "usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
50285
+ "rules": "Use for cards and content panels that sit above the page surface. Provides moderate elevation without appearing to float. Do NOT use for overlays or modals."
48076
50286
  }
48077
50287
  },
48078
50288
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48082,21 +50292,46 @@
48082
50292
  {
48083
50293
  "color": "{base.color.neutral.12}",
48084
50294
  "alpha": 0.1,
48085
- "offsetX": "0px",
48086
- "offsetY": "1px",
48087
- "blur": "1px",
48088
- "spread": "0px"
50295
+ "offsetX": {
50296
+ "value": 0,
50297
+ "unit": "px"
50298
+ },
50299
+ "offsetY": {
50300
+ "value": 1,
50301
+ "unit": "px"
50302
+ },
50303
+ "blur": {
50304
+ "value": 1,
50305
+ "unit": "px"
50306
+ },
50307
+ "spread": {
50308
+ "value": 0,
50309
+ "unit": "px"
50310
+ }
48089
50311
  },
48090
50312
  {
48091
50313
  "color": "{base.color.neutral.12}",
48092
50314
  "alpha": 0.12,
48093
- "offsetX": "0px",
48094
- "offsetY": "3px",
48095
- "blur": "6px",
48096
- "spread": "0px"
50315
+ "offsetX": {
50316
+ "value": 0,
50317
+ "unit": "px"
50318
+ },
50319
+ "offsetY": {
50320
+ "value": 3,
50321
+ "unit": "px"
50322
+ },
50323
+ "blur": {
50324
+ "value": 6,
50325
+ "unit": "px"
50326
+ },
50327
+ "spread": {
50328
+ "value": 0,
50329
+ "unit": "px"
50330
+ }
48097
50331
  }
48098
50332
  ],
48099
50333
  "$type": "shadow",
50334
+ "$description": "Medium resting shadow for cards and elevated surfaces",
48100
50335
  "$extensions": {
48101
50336
  "org.primer.figma": {
48102
50337
  "collection": "mode",
@@ -48108,24 +50343,52 @@
48108
50343
  {
48109
50344
  "color": "{base.color.neutral.0}",
48110
50345
  "alpha": 0.4,
48111
- "offsetX": "0px",
48112
- "offsetY": "1px",
48113
- "blur": "1px",
48114
- "spread": "0px"
50346
+ "offsetX": {
50347
+ "value": 0,
50348
+ "unit": "px"
50349
+ },
50350
+ "offsetY": {
50351
+ "value": 1,
50352
+ "unit": "px"
50353
+ },
50354
+ "blur": {
50355
+ "value": 1,
50356
+ "unit": "px"
50357
+ },
50358
+ "spread": {
50359
+ "value": 0,
50360
+ "unit": "px"
50361
+ }
48115
50362
  },
48116
50363
  {
48117
50364
  "color": "{base.color.neutral.0}",
48118
50365
  "alpha": 0.8,
48119
- "offsetX": "0px",
48120
- "offsetY": "3px",
48121
- "blur": "6px",
48122
- "spread": "0px"
50366
+ "offsetX": {
50367
+ "value": 0,
50368
+ "unit": "px"
50369
+ },
50370
+ "offsetY": {
50371
+ "value": 3,
50372
+ "unit": "px"
50373
+ },
50374
+ "blur": {
50375
+ "value": 6,
50376
+ "unit": "px"
50377
+ },
50378
+ "spread": {
50379
+ "value": 0,
50380
+ "unit": "px"
50381
+ }
48123
50382
  }
48124
50383
  ],
48125
50384
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48126
50385
  "isSource": true,
48127
50386
  "$type": "shadow"
48128
50387
  }
50388
+ },
50389
+ "org.primer.llm": {
50390
+ "usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
50391
+ "rules": "Use for cards and content panels that sit above the page surface. Provides moderate elevation without appearing to float. Do NOT use for overlays or modals."
48129
50392
  }
48130
50393
  },
48131
50394
  "key": "{shadow.resting.medium}"
@@ -48136,8 +50399,9 @@
48136
50399
  },
48137
50400
  "shadow-resting-small": {
48138
50401
  "key": "{shadow.resting.small}",
48139
- "$value": "0px 1px 1px 0px #1f23280f, 0px 1px 3px 0px #1f23280f",
50402
+ "$value": "0 1px 1px 0 #1f23280a, 0 1px 2px 0 #1f232808",
48140
50403
  "$type": "shadow",
50404
+ "$description": "Small resting shadow for buttons and interactive elements",
48141
50405
  "$extensions": {
48142
50406
  "org.primer.figma": {
48143
50407
  "collection": "mode",
@@ -48149,19 +50413,43 @@
48149
50413
  {
48150
50414
  "color": "#ffffff",
48151
50415
  "alpha": 0.6,
48152
- "offsetX": "0px",
48153
- "offsetY": "1px",
48154
- "blur": "1px",
48155
- "spread": "0px",
50416
+ "offsetX": {
50417
+ "value": 0,
50418
+ "unit": "px"
50419
+ },
50420
+ "offsetY": {
50421
+ "value": 1,
50422
+ "unit": "px"
50423
+ },
50424
+ "blur": {
50425
+ "value": 1,
50426
+ "unit": "px"
50427
+ },
50428
+ "spread": {
50429
+ "value": 0,
50430
+ "unit": "px"
50431
+ },
48156
50432
  "inset": false
48157
50433
  },
48158
50434
  {
48159
50435
  "color": "#ffffff",
48160
50436
  "alpha": 0.6,
48161
- "offsetX": "0px",
48162
- "offsetY": "1px",
48163
- "blur": "3px",
48164
- "spread": "0px",
50437
+ "offsetX": {
50438
+ "value": 0,
50439
+ "unit": "px"
50440
+ },
50441
+ "offsetY": {
50442
+ "value": 1,
50443
+ "unit": "px"
50444
+ },
50445
+ "blur": {
50446
+ "value": 3,
50447
+ "unit": "px"
50448
+ },
50449
+ "spread": {
50450
+ "value": 0,
50451
+ "unit": "px"
50452
+ },
48165
50453
  "inset": false
48166
50454
  }
48167
50455
  ],
@@ -48169,6 +50457,10 @@
48169
50457
  "isSource": true,
48170
50458
  "$type": "shadow"
48171
50459
  }
50460
+ },
50461
+ "org.primer.llm": {
50462
+ "usage": ["button", "interactive-card", "clickable-element"],
50463
+ "rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
48172
50464
  }
48173
50465
  },
48174
50466
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48177,24 +50469,49 @@
48177
50469
  "$value": [
48178
50470
  {
48179
50471
  "color": "{base.color.neutral.13}",
48180
- "alpha": 0.06,
48181
- "offsetX": "0px",
48182
- "offsetY": "1px",
48183
- "blur": "1px",
48184
- "spread": "0px",
50472
+ "alpha": 0.04,
50473
+ "offsetX": {
50474
+ "value": 0,
50475
+ "unit": "px"
50476
+ },
50477
+ "offsetY": {
50478
+ "value": 1,
50479
+ "unit": "px"
50480
+ },
50481
+ "blur": {
50482
+ "value": 1,
50483
+ "unit": "px"
50484
+ },
50485
+ "spread": {
50486
+ "value": 0,
50487
+ "unit": "px"
50488
+ },
48185
50489
  "inset": false
48186
50490
  },
48187
50491
  {
48188
50492
  "color": "{base.color.neutral.13}",
48189
- "alpha": 0.06,
48190
- "offsetX": "0px",
48191
- "offsetY": "1px",
48192
- "blur": "3px",
48193
- "spread": "0px",
50493
+ "alpha": 0.03,
50494
+ "offsetX": {
50495
+ "value": 0,
50496
+ "unit": "px"
50497
+ },
50498
+ "offsetY": {
50499
+ "value": 1,
50500
+ "unit": "px"
50501
+ },
50502
+ "blur": {
50503
+ "value": 2,
50504
+ "unit": "px"
50505
+ },
50506
+ "spread": {
50507
+ "value": 0,
50508
+ "unit": "px"
50509
+ },
48194
50510
  "inset": false
48195
50511
  }
48196
50512
  ],
48197
50513
  "$type": "shadow",
50514
+ "$description": "Small resting shadow for buttons and interactive elements",
48198
50515
  "$extensions": {
48199
50516
  "org.primer.figma": {
48200
50517
  "collection": "mode",
@@ -48206,19 +50523,43 @@
48206
50523
  {
48207
50524
  "color": "{base.color.neutral.0}",
48208
50525
  "alpha": 0.6,
48209
- "offsetX": "0px",
48210
- "offsetY": "1px",
48211
- "blur": "1px",
48212
- "spread": "0px",
50526
+ "offsetX": {
50527
+ "value": 0,
50528
+ "unit": "px"
50529
+ },
50530
+ "offsetY": {
50531
+ "value": 1,
50532
+ "unit": "px"
50533
+ },
50534
+ "blur": {
50535
+ "value": 1,
50536
+ "unit": "px"
50537
+ },
50538
+ "spread": {
50539
+ "value": 0,
50540
+ "unit": "px"
50541
+ },
48213
50542
  "inset": false
48214
50543
  },
48215
50544
  {
48216
50545
  "color": "{base.color.neutral.0}",
48217
50546
  "alpha": 0.6,
48218
- "offsetX": "0px",
48219
- "offsetY": "1px",
48220
- "blur": "3px",
48221
- "spread": "0px",
50547
+ "offsetX": {
50548
+ "value": 0,
50549
+ "unit": "px"
50550
+ },
50551
+ "offsetY": {
50552
+ "value": 1,
50553
+ "unit": "px"
50554
+ },
50555
+ "blur": {
50556
+ "value": 3,
50557
+ "unit": "px"
50558
+ },
50559
+ "spread": {
50560
+ "value": 0,
50561
+ "unit": "px"
50562
+ },
48222
50563
  "inset": false
48223
50564
  }
48224
50565
  ],
@@ -48226,6 +50567,10 @@
48226
50567
  "isSource": true,
48227
50568
  "$type": "shadow"
48228
50569
  }
50570
+ },
50571
+ "org.primer.llm": {
50572
+ "usage": ["button", "interactive-card", "clickable-element"],
50573
+ "rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
48229
50574
  }
48230
50575
  },
48231
50576
  "key": "{shadow.resting.small}"
@@ -48236,8 +50581,9 @@
48236
50581
  },
48237
50582
  "shadow-resting-xsmall": {
48238
50583
  "key": "{shadow.resting.xsmall}",
48239
- "$value": "0px 1px 1px 0px #1f23280f",
50584
+ "$value": "0 1px 1px 0 #1f23280d",
48240
50585
  "$type": "shadow",
50586
+ "$description": "Extra small resting shadow for minimal elevation",
48241
50587
  "$extensions": {
48242
50588
  "org.primer.figma": {
48243
50589
  "collection": "mode",
@@ -48248,16 +50594,32 @@
48248
50594
  "$value": {
48249
50595
  "color": "#ffffff",
48250
50596
  "alpha": 0.8,
48251
- "offsetX": "0px",
48252
- "offsetY": "1px",
48253
- "blur": "1px",
48254
- "spread": "0px",
50597
+ "offsetX": {
50598
+ "value": 0,
50599
+ "unit": "px"
50600
+ },
50601
+ "offsetY": {
50602
+ "value": 1,
50603
+ "unit": "px"
50604
+ },
50605
+ "blur": {
50606
+ "value": 1,
50607
+ "unit": "px"
50608
+ },
50609
+ "spread": {
50610
+ "value": 0,
50611
+ "unit": "px"
50612
+ },
48255
50613
  "inset": false
48256
50614
  },
48257
50615
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48258
50616
  "isSource": true,
48259
50617
  "$type": "shadow"
48260
50618
  }
50619
+ },
50620
+ "org.primer.llm": {
50621
+ "usage": ["badge", "chip", "small-card", "subtle-elevation"],
50622
+ "rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
48261
50623
  }
48262
50624
  },
48263
50625
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48265,14 +50627,27 @@
48265
50627
  "original": {
48266
50628
  "$value": {
48267
50629
  "color": "{base.color.neutral.13}",
48268
- "alpha": 0.06,
48269
- "offsetX": "0px",
48270
- "offsetY": "1px",
48271
- "blur": "1px",
48272
- "spread": "0px",
50630
+ "alpha": 0.05,
50631
+ "offsetX": {
50632
+ "value": 0,
50633
+ "unit": "px"
50634
+ },
50635
+ "offsetY": {
50636
+ "value": 1,
50637
+ "unit": "px"
50638
+ },
50639
+ "blur": {
50640
+ "value": 1,
50641
+ "unit": "px"
50642
+ },
50643
+ "spread": {
50644
+ "value": 0,
50645
+ "unit": "px"
50646
+ },
48273
50647
  "inset": false
48274
50648
  },
48275
50649
  "$type": "shadow",
50650
+ "$description": "Extra small resting shadow for minimal elevation",
48276
50651
  "$extensions": {
48277
50652
  "org.primer.figma": {
48278
50653
  "collection": "mode",
@@ -48283,16 +50658,32 @@
48283
50658
  "$value": {
48284
50659
  "color": "{base.color.neutral.0}",
48285
50660
  "alpha": 0.8,
48286
- "offsetX": "0px",
48287
- "offsetY": "1px",
48288
- "blur": "1px",
48289
- "spread": "0px",
50661
+ "offsetX": {
50662
+ "value": 0,
50663
+ "unit": "px"
50664
+ },
50665
+ "offsetY": {
50666
+ "value": 1,
50667
+ "unit": "px"
50668
+ },
50669
+ "blur": {
50670
+ "value": 1,
50671
+ "unit": "px"
50672
+ },
50673
+ "spread": {
50674
+ "value": 0,
50675
+ "unit": "px"
50676
+ },
48290
50677
  "inset": false
48291
50678
  },
48292
50679
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48293
50680
  "isSource": true,
48294
50681
  "$type": "shadow"
48295
50682
  }
50683
+ },
50684
+ "org.primer.llm": {
50685
+ "usage": ["badge", "chip", "small-card", "subtle-elevation"],
50686
+ "rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
48296
50687
  }
48297
50688
  },
48298
50689
  "key": "{shadow.resting.xsmall}"