@primer/primitives 11.4.0 → 11.4.1-rc.14fb4bb1

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
package/dist/docs/functional/themes/dark.json CHANGED
@@ -178,10 +178,22 @@
178
178
  {
179
179
  "color": "#0d1117",
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.1}",
199
211
  "alpha": 1,
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",
@@ -232,7 +268,7 @@
232
268
  "name": "avatar-shadow",
233
269
  "attributes": {},
234
270
  "path": ["avatar", "shadow"],
235
- "value": "0px 0px 0px 2px #0d1117",
271
+ "value": "0 0 0 2px #0d1117",
236
272
  "type": "shadow"
237
273
  },
238
274
  "avatarStack-fade-bgColor-default": {
@@ -549,6 +585,10 @@
549
585
  },
550
586
  "org.primer.overrides": {
551
587
  "dark": "#010409"
588
+ },
589
+ "org.primer.llm": {
590
+ "doNotUse": true,
591
+ "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."
552
592
  }
553
593
  },
554
594
  "filePath": "src/tokens/functional/color/bgColor.json5",
@@ -565,6 +605,10 @@
565
605
  },
566
606
  "org.primer.overrides": {
567
607
  "dark": "{base.color.neutral.0}"
608
+ },
609
+ "org.primer.llm": {
610
+ "doNotUse": true,
611
+ "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."
568
612
  }
569
613
  },
570
614
  "key": "{bgColor.black}"
@@ -2451,6 +2495,10 @@
2451
2495
  },
2452
2496
  "org.primer.overrides": {
2453
2497
  "dark": "#ffffff"
2498
+ },
2499
+ "org.primer.llm": {
2500
+ "doNotUse": true,
2501
+ "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."
2454
2502
  }
2455
2503
  },
2456
2504
  "filePath": "src/tokens/functional/color/bgColor.json5",
@@ -2467,6 +2515,10 @@
2467
2515
  },
2468
2516
  "org.primer.overrides": {
2469
2517
  "dark": "{base.color.neutral.13}"
2518
+ },
2519
+ "org.primer.llm": {
2520
+ "doNotUse": true,
2521
+ "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."
2470
2522
  }
2471
2523
  },
2472
2524
  "key": "{bgColor.white}"
@@ -6955,10 +7007,22 @@
6955
7007
  {
6956
7008
  "color": "#3d1300",
6957
7009
  "alpha": 0.2,
6958
- "offsetX": "0px",
6959
- "offsetY": "1px",
6960
- "blur": "0px",
6961
- "spread": "0px",
7010
+ "offsetX": {
7011
+ "value": 0,
7012
+ "unit": "px"
7013
+ },
7014
+ "offsetY": {
7015
+ "value": 1,
7016
+ "unit": "px"
7017
+ },
7018
+ "blur": {
7019
+ "value": 0,
7020
+ "unit": "px"
7021
+ },
7022
+ "spread": {
7023
+ "value": 0,
7024
+ "unit": "px"
7025
+ },
6962
7026
  "inset": true
6963
7027
  }
6964
7028
  ],
@@ -6971,10 +7035,22 @@
6971
7035
  {
6972
7036
  "color": "#00000000",
6973
7037
  "alpha": 0,
6974
- "offsetX": "0px",
6975
- "offsetY": "0px",
6976
- "blur": "0px",
6977
- "spread": "0px",
7038
+ "offsetX": {
7039
+ "value": 0,
7040
+ "unit": "px"
7041
+ },
7042
+ "offsetY": {
7043
+ "value": 0,
7044
+ "unit": "px"
7045
+ },
7046
+ "blur": {
7047
+ "value": 0,
7048
+ "unit": "px"
7049
+ },
7050
+ "spread": {
7051
+ "value": 0,
7052
+ "unit": "px"
7053
+ },
6978
7054
  "inset": false
6979
7055
  }
6980
7056
  ],
@@ -6991,10 +7067,22 @@
6991
7067
  {
6992
7068
  "color": "{base.color.transparent}",
6993
7069
  "alpha": 0,
6994
- "offsetX": "0px",
6995
- "offsetY": "0px",
6996
- "blur": "0px",
6997
- "spread": "0px",
7070
+ "offsetX": {
7071
+ "value": 0,
7072
+ "unit": "px"
7073
+ },
7074
+ "offsetY": {
7075
+ "value": 0,
7076
+ "unit": "px"
7077
+ },
7078
+ "blur": {
7079
+ "value": 0,
7080
+ "unit": "px"
7081
+ },
7082
+ "spread": {
7083
+ "value": 0,
7084
+ "unit": "px"
7085
+ },
6998
7086
  "inset": false
6999
7087
  }
7000
7088
  ],
@@ -7010,10 +7098,22 @@
7010
7098
  {
7011
7099
  "color": "{base.color.orange.9}",
7012
7100
  "alpha": 0.2,
7013
- "offsetX": "0px",
7014
- "offsetY": "1px",
7015
- "blur": "0px",
7016
- "spread": "0px",
7101
+ "offsetX": {
7102
+ "value": 0,
7103
+ "unit": "px"
7104
+ },
7105
+ "offsetY": {
7106
+ "value": 1,
7107
+ "unit": "px"
7108
+ },
7109
+ "blur": {
7110
+ "value": 0,
7111
+ "unit": "px"
7112
+ },
7113
+ "spread": {
7114
+ "value": 0,
7115
+ "unit": "px"
7116
+ },
7017
7117
  "inset": true
7018
7118
  }
7019
7119
  ],
@@ -7026,10 +7126,22 @@
7026
7126
  {
7027
7127
  "color": "{base.color.transparent}",
7028
7128
  "alpha": 0,
7029
- "offsetX": "0px",
7030
- "offsetY": "0px",
7031
- "blur": "0px",
7032
- "spread": "0px",
7129
+ "offsetX": {
7130
+ "value": 0,
7131
+ "unit": "px"
7132
+ },
7133
+ "offsetY": {
7134
+ "value": 0,
7135
+ "unit": "px"
7136
+ },
7137
+ "blur": {
7138
+ "value": 0,
7139
+ "unit": "px"
7140
+ },
7141
+ "spread": {
7142
+ "value": 0,
7143
+ "unit": "px"
7144
+ },
7033
7145
  "inset": false
7034
7146
  }
7035
7147
  ],
@@ -7044,7 +7156,7 @@
7044
7156
  "name": "button-danger-shadow-selected",
7045
7157
  "attributes": {},
7046
7158
  "path": ["button", "danger", "shadow", "selected"],
7047
- "value": "0px 0px 0px 0px #000000",
7159
+ "value": "0 0 0 0 #00000000",
7048
7160
  "type": "shadow"
7049
7161
  },
7050
7162
  "button-default-bgColor-active": {
@@ -7418,10 +7530,22 @@
7418
7530
  {
7419
7531
  "color": "#00000000",
7420
7532
  "alpha": 0,
7421
- "offsetX": "0px",
7422
- "offsetY": "0px",
7423
- "blur": "0px",
7424
- "spread": "0px",
7533
+ "offsetX": {
7534
+ "value": 0,
7535
+ "unit": "px"
7536
+ },
7537
+ "offsetY": {
7538
+ "value": 0,
7539
+ "unit": "px"
7540
+ },
7541
+ "blur": {
7542
+ "value": 0,
7543
+ "unit": "px"
7544
+ },
7545
+ "spread": {
7546
+ "value": 0,
7547
+ "unit": "px"
7548
+ },
7425
7549
  "inset": false
7426
7550
  }
7427
7551
  ],
@@ -7438,10 +7562,22 @@
7438
7562
  {
7439
7563
  "color": "{base.color.transparent}",
7440
7564
  "alpha": 0,
7441
- "offsetX": "0px",
7442
- "offsetY": "0px",
7443
- "blur": "0px",
7444
- "spread": "0px",
7565
+ "offsetX": {
7566
+ "value": 0,
7567
+ "unit": "px"
7568
+ },
7569
+ "offsetY": {
7570
+ "value": 0,
7571
+ "unit": "px"
7572
+ },
7573
+ "blur": {
7574
+ "value": 0,
7575
+ "unit": "px"
7576
+ },
7577
+ "spread": {
7578
+ "value": 0,
7579
+ "unit": "px"
7580
+ },
7445
7581
  "inset": false
7446
7582
  }
7447
7583
  ],
@@ -7457,10 +7593,22 @@
7457
7593
  {
7458
7594
  "color": "{base.color.transparent}",
7459
7595
  "alpha": 0,
7460
- "offsetX": "0px",
7461
- "offsetY": "0px",
7462
- "blur": "0px",
7463
- "spread": "0px",
7596
+ "offsetX": {
7597
+ "value": 0,
7598
+ "unit": "px"
7599
+ },
7600
+ "offsetY": {
7601
+ "value": 0,
7602
+ "unit": "px"
7603
+ },
7604
+ "blur": {
7605
+ "value": 0,
7606
+ "unit": "px"
7607
+ },
7608
+ "spread": {
7609
+ "value": 0,
7610
+ "unit": "px"
7611
+ },
7464
7612
  "inset": false
7465
7613
  }
7466
7614
  ],
@@ -7475,7 +7623,7 @@
7475
7623
  "name": "button-default-shadow-resting",
7476
7624
  "attributes": {},
7477
7625
  "path": ["button", "default", "shadow", "resting"],
7478
- "value": "0px 0px 0px 0px #000000",
7626
+ "value": "0 0 0 0 #00000000",
7479
7627
  "type": "shadow"
7480
7628
  },
7481
7629
  "button-inactive-bgColor": {
@@ -9177,10 +9325,22 @@
9177
9325
  {
9178
9326
  "color": "#00000000",
9179
9327
  "alpha": 0,
9180
- "offsetX": "0px",
9181
- "offsetY": "0px",
9182
- "blur": "0px",
9183
- "spread": "0px",
9328
+ "offsetX": {
9329
+ "value": 0,
9330
+ "unit": "px"
9331
+ },
9332
+ "offsetY": {
9333
+ "value": 0,
9334
+ "unit": "px"
9335
+ },
9336
+ "blur": {
9337
+ "value": 0,
9338
+ "unit": "px"
9339
+ },
9340
+ "spread": {
9341
+ "value": 0,
9342
+ "unit": "px"
9343
+ },
9184
9344
  "inset": false
9185
9345
  }
9186
9346
  ],
@@ -9197,10 +9357,22 @@
9197
9357
  {
9198
9358
  "color": "{base.color.transparent}",
9199
9359
  "alpha": 0,
9200
- "offsetX": "0px",
9201
- "offsetY": "0px",
9202
- "blur": "0px",
9203
- "spread": "0px",
9360
+ "offsetX": {
9361
+ "value": 0,
9362
+ "unit": "px"
9363
+ },
9364
+ "offsetY": {
9365
+ "value": 0,
9366
+ "unit": "px"
9367
+ },
9368
+ "blur": {
9369
+ "value": 0,
9370
+ "unit": "px"
9371
+ },
9372
+ "spread": {
9373
+ "value": 0,
9374
+ "unit": "px"
9375
+ },
9204
9376
  "inset": false
9205
9377
  }
9206
9378
  ],
@@ -9216,10 +9388,22 @@
9216
9388
  {
9217
9389
  "color": "{base.color.transparent}",
9218
9390
  "alpha": 0,
9219
- "offsetX": "0px",
9220
- "offsetY": "0px",
9221
- "blur": "0px",
9222
- "spread": "0px",
9391
+ "offsetX": {
9392
+ "value": 0,
9393
+ "unit": "px"
9394
+ },
9395
+ "offsetY": {
9396
+ "value": 0,
9397
+ "unit": "px"
9398
+ },
9399
+ "blur": {
9400
+ "value": 0,
9401
+ "unit": "px"
9402
+ },
9403
+ "spread": {
9404
+ "value": 0,
9405
+ "unit": "px"
9406
+ },
9223
9407
  "inset": false
9224
9408
  }
9225
9409
  ],
@@ -9234,7 +9418,7 @@
9234
9418
  "name": "button-outline-shadow-selected",
9235
9419
  "attributes": {},
9236
9420
  "path": ["button", "outline", "shadow", "selected"],
9237
- "value": "0px 0px 0px 0px #000000",
9421
+ "value": "0 0 0 0 #00000000",
9238
9422
  "type": "shadow"
9239
9423
  },
9240
9424
  "button-primary-bgColor-active": {
@@ -10383,10 +10567,22 @@
10383
10567
  {
10384
10568
  "color": "#051d4d",
10385
10569
  "alpha": 0.3,
10386
- "offsetX": "0px",
10387
- "offsetY": "1px",
10388
- "blur": "0px",
10389
- "spread": "0px",
10570
+ "offsetX": {
10571
+ "value": 0,
10572
+ "unit": "px"
10573
+ },
10574
+ "offsetY": {
10575
+ "value": 1,
10576
+ "unit": "px"
10577
+ },
10578
+ "blur": {
10579
+ "value": 0,
10580
+ "unit": "px"
10581
+ },
10582
+ "spread": {
10583
+ "value": 0,
10584
+ "unit": "px"
10585
+ },
10390
10586
  "inset": true
10391
10587
  }
10392
10588
  ],
@@ -10399,10 +10595,22 @@
10399
10595
  {
10400
10596
  "color": "#051d4d",
10401
10597
  "alpha": 0.3,
10402
- "offsetX": "0px",
10403
- "offsetY": "1px",
10404
- "blur": "0px",
10405
- "spread": "0px",
10598
+ "offsetX": {
10599
+ "value": 0,
10600
+ "unit": "px"
10601
+ },
10602
+ "offsetY": {
10603
+ "value": 1,
10604
+ "unit": "px"
10605
+ },
10606
+ "blur": {
10607
+ "value": 0,
10608
+ "unit": "px"
10609
+ },
10610
+ "spread": {
10611
+ "value": 0,
10612
+ "unit": "px"
10613
+ },
10406
10614
  "inset": true
10407
10615
  }
10408
10616
  ],
@@ -10415,10 +10623,22 @@
10415
10623
  {
10416
10624
  "color": "#00000000",
10417
10625
  "alpha": 0,
10418
- "offsetX": "0px",
10419
- "offsetY": "0px",
10420
- "blur": "0px",
10421
- "spread": "0px",
10626
+ "offsetX": {
10627
+ "value": 0,
10628
+ "unit": "px"
10629
+ },
10630
+ "offsetY": {
10631
+ "value": 0,
10632
+ "unit": "px"
10633
+ },
10634
+ "blur": {
10635
+ "value": 0,
10636
+ "unit": "px"
10637
+ },
10638
+ "spread": {
10639
+ "value": 0,
10640
+ "unit": "px"
10641
+ },
10422
10642
  "inset": false
10423
10643
  }
10424
10644
  ],
@@ -10435,10 +10655,22 @@
10435
10655
  {
10436
10656
  "color": "{base.color.transparent}",
10437
10657
  "alpha": 0,
10438
- "offsetX": "0px",
10439
- "offsetY": "0px",
10440
- "blur": "0px",
10441
- "spread": "0px",
10658
+ "offsetX": {
10659
+ "value": 0,
10660
+ "unit": "px"
10661
+ },
10662
+ "offsetY": {
10663
+ "value": 0,
10664
+ "unit": "px"
10665
+ },
10666
+ "blur": {
10667
+ "value": 0,
10668
+ "unit": "px"
10669
+ },
10670
+ "spread": {
10671
+ "value": 0,
10672
+ "unit": "px"
10673
+ },
10442
10674
  "inset": false
10443
10675
  }
10444
10676
  ],
@@ -10454,10 +10686,22 @@
10454
10686
  {
10455
10687
  "color": "{base.color.blue.9}",
10456
10688
  "alpha": 0.3,
10457
- "offsetX": "0px",
10458
- "offsetY": "1px",
10459
- "blur": "0px",
10460
- "spread": "0px",
10689
+ "offsetX": {
10690
+ "value": 0,
10691
+ "unit": "px"
10692
+ },
10693
+ "offsetY": {
10694
+ "value": 1,
10695
+ "unit": "px"
10696
+ },
10697
+ "blur": {
10698
+ "value": 0,
10699
+ "unit": "px"
10700
+ },
10701
+ "spread": {
10702
+ "value": 0,
10703
+ "unit": "px"
10704
+ },
10461
10705
  "inset": true
10462
10706
  }
10463
10707
  ],
@@ -10470,10 +10714,22 @@
10470
10714
  {
10471
10715
  "color": "{base.color.blue.9}",
10472
10716
  "alpha": 0.3,
10473
- "offsetX": "0px",
10474
- "offsetY": "1px",
10475
- "blur": "0px",
10476
- "spread": "0px",
10717
+ "offsetX": {
10718
+ "value": 0,
10719
+ "unit": "px"
10720
+ },
10721
+ "offsetY": {
10722
+ "value": 1,
10723
+ "unit": "px"
10724
+ },
10725
+ "blur": {
10726
+ "value": 0,
10727
+ "unit": "px"
10728
+ },
10729
+ "spread": {
10730
+ "value": 0,
10731
+ "unit": "px"
10732
+ },
10477
10733
  "inset": true
10478
10734
  }
10479
10735
  ],
@@ -10486,10 +10742,22 @@
10486
10742
  {
10487
10743
  "color": "{base.color.transparent}",
10488
10744
  "alpha": 0,
10489
- "offsetX": "0px",
10490
- "offsetY": "0px",
10491
- "blur": "0px",
10492
- "spread": "0px",
10745
+ "offsetX": {
10746
+ "value": 0,
10747
+ "unit": "px"
10748
+ },
10749
+ "offsetY": {
10750
+ "value": 0,
10751
+ "unit": "px"
10752
+ },
10753
+ "blur": {
10754
+ "value": 0,
10755
+ "unit": "px"
10756
+ },
10757
+ "spread": {
10758
+ "value": 0,
10759
+ "unit": "px"
10760
+ },
10493
10761
  "inset": false
10494
10762
  }
10495
10763
  ],
@@ -10504,7 +10772,7 @@
10504
10772
  "name": "button-primary-shadow-selected",
10505
10773
  "attributes": {},
10506
10774
  "path": ["button", "primary", "shadow", "selected"],
10507
- "value": "0px 0px 0px 0px #000000",
10775
+ "value": "0 0 0 0 #00000000",
10508
10776
  "type": "shadow"
10509
10777
  },
10510
10778
  "button-star-iconColor": {
@@ -37239,6 +37507,10 @@
37239
37507
  },
37240
37508
  "org.primer.overrides": {
37241
37509
  "dark": "#010409"
37510
+ },
37511
+ "org.primer.llm": {
37512
+ "doNotUse": true,
37513
+ "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."
37242
37514
  }
37243
37515
  },
37244
37516
  "filePath": "src/tokens/functional/color/fgColor.json5",
@@ -37255,6 +37527,10 @@
37255
37527
  },
37256
37528
  "org.primer.overrides": {
37257
37529
  "dark": "{base.color.neutral.0}"
37530
+ },
37531
+ "org.primer.llm": {
37532
+ "doNotUse": true,
37533
+ "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."
37258
37534
  }
37259
37535
  },
37260
37536
  "key": "{fgColor.black}"
@@ -38228,6 +38504,10 @@
38228
38504
  },
38229
38505
  "org.primer.overrides": {
38230
38506
  "dark": "#ffffff"
38507
+ },
38508
+ "org.primer.llm": {
38509
+ "doNotUse": true,
38510
+ "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."
38231
38511
  }
38232
38512
  },
38233
38513
  "filePath": "src/tokens/functional/color/fgColor.json5",
@@ -38244,6 +38524,10 @@
38244
38524
  },
38245
38525
  "org.primer.overrides": {
38246
38526
  "dark": "{base.color.neutral.13}"
38527
+ },
38528
+ "org.primer.llm": {
38529
+ "doNotUse": true,
38530
+ "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."
38247
38531
  }
38248
38532
  },
38249
38533
  "key": "{fgColor.white}"
@@ -38269,7 +38553,10 @@
38269
38553
  "$value": {
38270
38554
  "color": "{focus.outlineColor}",
38271
38555
  "style": "solid",
38272
- "width": "2px"
38556
+ "width": {
38557
+ "value": 2,
38558
+ "unit": "px"
38559
+ }
38273
38560
  },
38274
38561
  "$type": "border",
38275
38562
  "$description": "Focus ring outline for keyboard navigation and accessibility.",
@@ -47442,18 +47729,183 @@
47442
47729
  {
47443
47730
  "color": "#3d444db3",
47444
47731
  "alpha": 1,
47445
- "offsetX": "0px",
47446
- "offsetY": "0px",
47447
- "blur": "0px",
47448
- "spread": "1px"
47732
+ "offsetX": {
47733
+ "value": 0,
47734
+ "unit": "px"
47735
+ },
47736
+ "offsetY": {
47737
+ "value": 0,
47738
+ "unit": "px"
47739
+ },
47740
+ "blur": {
47741
+ "value": 0,
47742
+ "unit": "px"
47743
+ },
47744
+ "spread": {
47745
+ "value": 1,
47746
+ "unit": "px"
47747
+ }
47449
47748
  },
47450
47749
  {
47451
47750
  "color": "#010409",
47452
47751
  "alpha": 1,
47453
- "offsetX": "0px",
47454
- "offsetY": "24px",
47455
- "blur": "48px",
47456
- "spread": "0px"
47752
+ "offsetX": {
47753
+ "value": 0,
47754
+ "unit": "px"
47755
+ },
47756
+ "offsetY": {
47757
+ "value": 24,
47758
+ "unit": "px"
47759
+ },
47760
+ "blur": {
47761
+ "value": 48,
47762
+ "unit": "px"
47763
+ },
47764
+ "spread": {
47765
+ "value": 0,
47766
+ "unit": "px"
47767
+ }
47768
+ }
47769
+ ],
47770
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47771
+ "isSource": true,
47772
+ "$type": "shadow"
47773
+ },
47774
+ "light-high-contrast": {
47775
+ "$value": [
47776
+ {
47777
+ "color": "#3d444db3",
47778
+ "alpha": 1,
47779
+ "offsetX": {
47780
+ "value": 0,
47781
+ "unit": "px"
47782
+ },
47783
+ "offsetY": {
47784
+ "value": 0,
47785
+ "unit": "px"
47786
+ },
47787
+ "blur": {
47788
+ "value": 0,
47789
+ "unit": "px"
47790
+ },
47791
+ "spread": {
47792
+ "value": 1,
47793
+ "unit": "px"
47794
+ }
47795
+ },
47796
+ {
47797
+ "color": "#f0f6fc",
47798
+ "alpha": 0.24,
47799
+ "offsetX": {
47800
+ "value": 0,
47801
+ "unit": "px"
47802
+ },
47803
+ "offsetY": {
47804
+ "value": 40,
47805
+ "unit": "px"
47806
+ },
47807
+ "blur": {
47808
+ "value": 80,
47809
+ "unit": "px"
47810
+ },
47811
+ "spread": {
47812
+ "value": 0,
47813
+ "unit": "px"
47814
+ }
47815
+ }
47816
+ ],
47817
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47818
+ "isSource": true,
47819
+ "$type": "shadow"
47820
+ },
47821
+ "light-protanopia-deuteranopia-high-contrast": {
47822
+ "$value": [
47823
+ {
47824
+ "color": "#3d444db3",
47825
+ "alpha": 1,
47826
+ "offsetX": {
47827
+ "value": 0,
47828
+ "unit": "px"
47829
+ },
47830
+ "offsetY": {
47831
+ "value": 0,
47832
+ "unit": "px"
47833
+ },
47834
+ "blur": {
47835
+ "value": 0,
47836
+ "unit": "px"
47837
+ },
47838
+ "spread": {
47839
+ "value": 1,
47840
+ "unit": "px"
47841
+ }
47842
+ },
47843
+ {
47844
+ "color": "#f0f6fc",
47845
+ "alpha": 0.24,
47846
+ "offsetX": {
47847
+ "value": 0,
47848
+ "unit": "px"
47849
+ },
47850
+ "offsetY": {
47851
+ "value": 40,
47852
+ "unit": "px"
47853
+ },
47854
+ "blur": {
47855
+ "value": 80,
47856
+ "unit": "px"
47857
+ },
47858
+ "spread": {
47859
+ "value": 0,
47860
+ "unit": "px"
47861
+ }
47862
+ }
47863
+ ],
47864
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
47865
+ "isSource": true,
47866
+ "$type": "shadow"
47867
+ },
47868
+ "light-tritanopia-high-contrast": {
47869
+ "$value": [
47870
+ {
47871
+ "color": "#3d444db3",
47872
+ "alpha": 1,
47873
+ "offsetX": {
47874
+ "value": 0,
47875
+ "unit": "px"
47876
+ },
47877
+ "offsetY": {
47878
+ "value": 0,
47879
+ "unit": "px"
47880
+ },
47881
+ "blur": {
47882
+ "value": 0,
47883
+ "unit": "px"
47884
+ },
47885
+ "spread": {
47886
+ "value": 1,
47887
+ "unit": "px"
47888
+ }
47889
+ },
47890
+ {
47891
+ "color": "#f0f6fc",
47892
+ "alpha": 0.24,
47893
+ "offsetX": {
47894
+ "value": 0,
47895
+ "unit": "px"
47896
+ },
47897
+ "offsetY": {
47898
+ "value": 40,
47899
+ "unit": "px"
47900
+ },
47901
+ "blur": {
47902
+ "value": 80,
47903
+ "unit": "px"
47904
+ },
47905
+ "spread": {
47906
+ "value": 0,
47907
+ "unit": "px"
47908
+ }
47457
47909
  }
47458
47910
  ],
47459
47911
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47473,18 +47925,42 @@
47473
47925
  {
47474
47926
  "color": "{overlay.borderColor}",
47475
47927
  "alpha": 1,
47476
- "offsetX": "0px",
47477
- "offsetY": "0px",
47478
- "blur": "0px",
47479
- "spread": "1px"
47928
+ "offsetX": {
47929
+ "value": 0,
47930
+ "unit": "px"
47931
+ },
47932
+ "offsetY": {
47933
+ "value": 0,
47934
+ "unit": "px"
47935
+ },
47936
+ "blur": {
47937
+ "value": 0,
47938
+ "unit": "px"
47939
+ },
47940
+ "spread": {
47941
+ "value": 1,
47942
+ "unit": "px"
47943
+ }
47480
47944
  },
47481
47945
  {
47482
47946
  "color": "{base.color.neutral.0}",
47483
47947
  "alpha": 1,
47484
- "offsetX": "0px",
47485
- "offsetY": "24px",
47486
- "blur": "48px",
47487
- "spread": "0px"
47948
+ "offsetX": {
47949
+ "value": 0,
47950
+ "unit": "px"
47951
+ },
47952
+ "offsetY": {
47953
+ "value": 24,
47954
+ "unit": "px"
47955
+ },
47956
+ "blur": {
47957
+ "value": 48,
47958
+ "unit": "px"
47959
+ },
47960
+ "spread": {
47961
+ "value": 0,
47962
+ "unit": "px"
47963
+ }
47488
47964
  }
47489
47965
  ],
47490
47966
  "$type": "shadow",
@@ -47500,18 +47976,183 @@
47500
47976
  {
47501
47977
  "color": "{overlay.borderColor}",
47502
47978
  "alpha": 1,
47503
- "offsetX": "0px",
47504
- "offsetY": "0px",
47505
- "blur": "0px",
47506
- "spread": "1px"
47979
+ "offsetX": {
47980
+ "value": 0,
47981
+ "unit": "px"
47982
+ },
47983
+ "offsetY": {
47984
+ "value": 0,
47985
+ "unit": "px"
47986
+ },
47987
+ "blur": {
47988
+ "value": 0,
47989
+ "unit": "px"
47990
+ },
47991
+ "spread": {
47992
+ "value": 1,
47993
+ "unit": "px"
47994
+ }
47507
47995
  },
47508
47996
  {
47509
47997
  "color": "{base.color.neutral.0}",
47510
47998
  "alpha": 1,
47511
- "offsetX": "0px",
47512
- "offsetY": "24px",
47513
- "blur": "48px",
47514
- "spread": "0px"
47999
+ "offsetX": {
48000
+ "value": 0,
48001
+ "unit": "px"
48002
+ },
48003
+ "offsetY": {
48004
+ "value": 24,
48005
+ "unit": "px"
48006
+ },
48007
+ "blur": {
48008
+ "value": 48,
48009
+ "unit": "px"
48010
+ },
48011
+ "spread": {
48012
+ "value": 0,
48013
+ "unit": "px"
48014
+ }
48015
+ }
48016
+ ],
48017
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48018
+ "isSource": true,
48019
+ "$type": "shadow"
48020
+ },
48021
+ "light-high-contrast": {
48022
+ "$value": [
48023
+ {
48024
+ "color": "{overlay.borderColor}",
48025
+ "alpha": 1,
48026
+ "offsetX": {
48027
+ "value": 0,
48028
+ "unit": "px"
48029
+ },
48030
+ "offsetY": {
48031
+ "value": 0,
48032
+ "unit": "px"
48033
+ },
48034
+ "blur": {
48035
+ "value": 0,
48036
+ "unit": "px"
48037
+ },
48038
+ "spread": {
48039
+ "value": 1,
48040
+ "unit": "px"
48041
+ }
48042
+ },
48043
+ {
48044
+ "color": "{base.color.neutral.12}",
48045
+ "alpha": 0.24,
48046
+ "offsetX": {
48047
+ "value": 0,
48048
+ "unit": "px"
48049
+ },
48050
+ "offsetY": {
48051
+ "value": 40,
48052
+ "unit": "px"
48053
+ },
48054
+ "blur": {
48055
+ "value": 80,
48056
+ "unit": "px"
48057
+ },
48058
+ "spread": {
48059
+ "value": 0,
48060
+ "unit": "px"
48061
+ }
48062
+ }
48063
+ ],
48064
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48065
+ "isSource": true,
48066
+ "$type": "shadow"
48067
+ },
48068
+ "light-protanopia-deuteranopia-high-contrast": {
48069
+ "$value": [
48070
+ {
48071
+ "color": "{overlay.borderColor}",
48072
+ "alpha": 1,
48073
+ "offsetX": {
48074
+ "value": 0,
48075
+ "unit": "px"
48076
+ },
48077
+ "offsetY": {
48078
+ "value": 0,
48079
+ "unit": "px"
48080
+ },
48081
+ "blur": {
48082
+ "value": 0,
48083
+ "unit": "px"
48084
+ },
48085
+ "spread": {
48086
+ "value": 1,
48087
+ "unit": "px"
48088
+ }
48089
+ },
48090
+ {
48091
+ "color": "{base.color.neutral.12}",
48092
+ "alpha": 0.24,
48093
+ "offsetX": {
48094
+ "value": 0,
48095
+ "unit": "px"
48096
+ },
48097
+ "offsetY": {
48098
+ "value": 40,
48099
+ "unit": "px"
48100
+ },
48101
+ "blur": {
48102
+ "value": 80,
48103
+ "unit": "px"
48104
+ },
48105
+ "spread": {
48106
+ "value": 0,
48107
+ "unit": "px"
48108
+ }
48109
+ }
48110
+ ],
48111
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48112
+ "isSource": true,
48113
+ "$type": "shadow"
48114
+ },
48115
+ "light-tritanopia-high-contrast": {
48116
+ "$value": [
48117
+ {
48118
+ "color": "{overlay.borderColor}",
48119
+ "alpha": 1,
48120
+ "offsetX": {
48121
+ "value": 0,
48122
+ "unit": "px"
48123
+ },
48124
+ "offsetY": {
48125
+ "value": 0,
48126
+ "unit": "px"
48127
+ },
48128
+ "blur": {
48129
+ "value": 0,
48130
+ "unit": "px"
48131
+ },
48132
+ "spread": {
48133
+ "value": 1,
48134
+ "unit": "px"
48135
+ }
48136
+ },
48137
+ {
48138
+ "color": "{base.color.neutral.12}",
48139
+ "alpha": 0.24,
48140
+ "offsetX": {
48141
+ "value": 0,
48142
+ "unit": "px"
48143
+ },
48144
+ "offsetY": {
48145
+ "value": 40,
48146
+ "unit": "px"
48147
+ },
48148
+ "blur": {
48149
+ "value": 80,
48150
+ "unit": "px"
48151
+ },
48152
+ "spread": {
48153
+ "value": 0,
48154
+ "unit": "px"
48155
+ }
47515
48156
  }
47516
48157
  ],
47517
48158
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47529,7 +48170,7 @@
47529
48170
  "name": "shadow-floating-large",
47530
48171
  "attributes": {},
47531
48172
  "path": ["shadow", "floating", "large"],
47532
- "value": "0px 0px 0px 1px #3d444d, 0px 24px 48px 0px #010409",
48173
+ "value": "0 0 0 1px #3d444d, 0 24px 48px 0 #010409",
47533
48174
  "type": "shadow",
47534
48175
  "description": "Large floating shadow for modals and dialogs"
47535
48176
  },
@@ -47543,24 +48184,52 @@
47543
48184
  {
47544
48185
  "color": "#010409",
47545
48186
  "alpha": 0.4,
47546
- "offsetX": "0px",
47547
- "offsetY": "6px",
47548
- "blur": "12px",
47549
- "spread": "-3px"
48187
+ "offsetX": {
48188
+ "value": 0,
48189
+ "unit": "px"
48190
+ },
48191
+ "offsetY": {
48192
+ "value": 6,
48193
+ "unit": "px"
48194
+ },
48195
+ "blur": {
48196
+ "value": 12,
48197
+ "unit": "px"
48198
+ },
48199
+ "spread": {
48200
+ "value": -3,
48201
+ "unit": "px"
48202
+ }
47550
48203
  },
47551
48204
  {
47552
48205
  "color": "#010409",
47553
48206
  "alpha": 0.4,
47554
- "offsetX": "0px",
47555
- "offsetY": "6px",
47556
- "blur": "18px",
47557
- "spread": "0px"
48207
+ "offsetX": {
48208
+ "value": 0,
48209
+ "unit": "px"
48210
+ },
48211
+ "offsetY": {
48212
+ "value": 6,
48213
+ "unit": "px"
48214
+ },
48215
+ "blur": {
48216
+ "value": 18,
48217
+ "unit": "px"
48218
+ },
48219
+ "spread": {
48220
+ "value": 0,
48221
+ "unit": "px"
48222
+ }
47558
48223
  }
47559
48224
  ],
47560
48225
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47561
48226
  "isSource": true,
47562
48227
  "$type": "shadow"
47563
48228
  }
48229
+ },
48230
+ "org.primer.llm": {
48231
+ "usage": ["legacy-component", "backward-compatibility"],
48232
+ "rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
47564
48233
  }
47565
48234
  },
47566
48235
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47570,21 +48239,46 @@
47570
48239
  {
47571
48240
  "color": "{base.color.neutral.0}",
47572
48241
  "alpha": 0.4,
47573
- "offsetX": "0px",
47574
- "offsetY": "6px",
47575
- "blur": "12px",
47576
- "spread": "-3px"
48242
+ "offsetX": {
48243
+ "value": 0,
48244
+ "unit": "px"
48245
+ },
48246
+ "offsetY": {
48247
+ "value": 6,
48248
+ "unit": "px"
48249
+ },
48250
+ "blur": {
48251
+ "value": 12,
48252
+ "unit": "px"
48253
+ },
48254
+ "spread": {
48255
+ "value": -3,
48256
+ "unit": "px"
48257
+ }
47577
48258
  },
47578
48259
  {
47579
48260
  "color": "{base.color.neutral.0}",
47580
48261
  "alpha": 0.4,
47581
- "offsetX": "0px",
47582
- "offsetY": "6px",
47583
- "blur": "18px",
47584
- "spread": "0px"
48262
+ "offsetX": {
48263
+ "value": 0,
48264
+ "unit": "px"
48265
+ },
48266
+ "offsetY": {
48267
+ "value": 6,
48268
+ "unit": "px"
48269
+ },
48270
+ "blur": {
48271
+ "value": 18,
48272
+ "unit": "px"
48273
+ },
48274
+ "spread": {
48275
+ "value": 0,
48276
+ "unit": "px"
48277
+ }
47585
48278
  }
47586
48279
  ],
47587
48280
  "$type": "shadow",
48281
+ "$description": "Legacy floating shadow for backward compatibility",
47588
48282
  "$extensions": {
47589
48283
  "org.primer.figma": {},
47590
48284
  "org.primer.overrides": {
@@ -47593,24 +48287,52 @@
47593
48287
  {
47594
48288
  "color": "{base.color.neutral.0}",
47595
48289
  "alpha": 0.4,
47596
- "offsetX": "0px",
47597
- "offsetY": "6px",
47598
- "blur": "12px",
47599
- "spread": "-3px"
48290
+ "offsetX": {
48291
+ "value": 0,
48292
+ "unit": "px"
48293
+ },
48294
+ "offsetY": {
48295
+ "value": 6,
48296
+ "unit": "px"
48297
+ },
48298
+ "blur": {
48299
+ "value": 12,
48300
+ "unit": "px"
48301
+ },
48302
+ "spread": {
48303
+ "value": -3,
48304
+ "unit": "px"
48305
+ }
47600
48306
  },
47601
48307
  {
47602
48308
  "color": "{base.color.neutral.0}",
47603
48309
  "alpha": 0.4,
47604
- "offsetX": "0px",
47605
- "offsetY": "6px",
47606
- "blur": "18px",
47607
- "spread": "0px"
48310
+ "offsetX": {
48311
+ "value": 0,
48312
+ "unit": "px"
48313
+ },
48314
+ "offsetY": {
48315
+ "value": 6,
48316
+ "unit": "px"
48317
+ },
48318
+ "blur": {
48319
+ "value": 18,
48320
+ "unit": "px"
48321
+ },
48322
+ "spread": {
48323
+ "value": 0,
48324
+ "unit": "px"
48325
+ }
47608
48326
  }
47609
48327
  ],
47610
48328
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47611
48329
  "isSource": true,
47612
48330
  "$type": "shadow"
47613
48331
  }
48332
+ },
48333
+ "org.primer.llm": {
48334
+ "usage": ["legacy-component", "backward-compatibility"],
48335
+ "rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
47614
48336
  }
47615
48337
  },
47616
48338
  "key": "{shadow.floating.legacy}"
@@ -47618,8 +48340,9 @@
47618
48340
  "name": "shadow-floating-legacy",
47619
48341
  "attributes": {},
47620
48342
  "path": ["shadow", "floating", "legacy"],
47621
- "value": "0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966",
47622
- "type": "shadow"
48343
+ "value": "0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966",
48344
+ "type": "shadow",
48345
+ "description": "Legacy floating shadow for backward compatibility"
47623
48346
  },
47624
48347
  "shadow-floating-medium": {
47625
48348
  "key": "{shadow.floating.medium}",
@@ -47634,48 +48357,433 @@
47634
48357
  {
47635
48358
  "color": "#3d444db3",
47636
48359
  "alpha": 1,
47637
- "offsetX": "0px",
47638
- "offsetY": "0px",
47639
- "blur": "0px",
47640
- "spread": "1px"
48360
+ "offsetX": {
48361
+ "value": 0,
48362
+ "unit": "px"
48363
+ },
48364
+ "offsetY": {
48365
+ "value": 0,
48366
+ "unit": "px"
48367
+ },
48368
+ "blur": {
48369
+ "value": 0,
48370
+ "unit": "px"
48371
+ },
48372
+ "spread": {
48373
+ "value": 1,
48374
+ "unit": "px"
48375
+ }
47641
48376
  },
47642
48377
  {
47643
48378
  "color": "#010409",
47644
48379
  "alpha": 0.4,
47645
- "offsetX": "0px",
47646
- "offsetY": "8px",
47647
- "blur": "16px",
47648
- "spread": "-4px"
48380
+ "offsetX": {
48381
+ "value": 0,
48382
+ "unit": "px"
48383
+ },
48384
+ "offsetY": {
48385
+ "value": 8,
48386
+ "unit": "px"
48387
+ },
48388
+ "blur": {
48389
+ "value": 16,
48390
+ "unit": "px"
48391
+ },
48392
+ "spread": {
48393
+ "value": -4,
48394
+ "unit": "px"
48395
+ }
47649
48396
  },
47650
48397
  {
47651
48398
  "color": "#010409",
47652
48399
  "alpha": 0.4,
47653
- "offsetX": "0px",
47654
- "offsetY": "4px",
47655
- "blur": "32px",
47656
- "spread": "-4px"
48400
+ "offsetX": {
48401
+ "value": 0,
48402
+ "unit": "px"
48403
+ },
48404
+ "offsetY": {
48405
+ "value": 4,
48406
+ "unit": "px"
48407
+ },
48408
+ "blur": {
48409
+ "value": 32,
48410
+ "unit": "px"
48411
+ },
48412
+ "spread": {
48413
+ "value": -4,
48414
+ "unit": "px"
48415
+ }
47657
48416
  },
47658
48417
  {
47659
48418
  "color": "#010409",
47660
48419
  "alpha": 0.4,
47661
- "offsetX": "0px",
47662
- "offsetY": "24px",
47663
- "blur": "48px",
47664
- "spread": "-12px"
48420
+ "offsetX": {
48421
+ "value": 0,
48422
+ "unit": "px"
48423
+ },
48424
+ "offsetY": {
48425
+ "value": 24,
48426
+ "unit": "px"
48427
+ },
48428
+ "blur": {
48429
+ "value": 48,
48430
+ "unit": "px"
48431
+ },
48432
+ "spread": {
48433
+ "value": -12,
48434
+ "unit": "px"
48435
+ }
47665
48436
  },
47666
48437
  {
47667
48438
  "color": "#010409",
47668
48439
  "alpha": 0.4,
47669
- "offsetX": "0px",
47670
- "offsetY": "48px",
47671
- "blur": "96px",
47672
- "spread": "-24px"
48440
+ "offsetX": {
48441
+ "value": 0,
48442
+ "unit": "px"
48443
+ },
48444
+ "offsetY": {
48445
+ "value": 48,
48446
+ "unit": "px"
48447
+ },
48448
+ "blur": {
48449
+ "value": 96,
48450
+ "unit": "px"
48451
+ },
48452
+ "spread": {
48453
+ "value": -24,
48454
+ "unit": "px"
48455
+ }
48456
+ }
48457
+ ],
48458
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48459
+ "isSource": true,
48460
+ "$type": "shadow"
48461
+ },
48462
+ "light-high-contrast": {
48463
+ "$value": [
48464
+ {
48465
+ "color": "#3d444db3",
48466
+ "alpha": 1,
48467
+ "offsetX": {
48468
+ "value": 0,
48469
+ "unit": "px"
48470
+ },
48471
+ "offsetY": {
48472
+ "value": 0,
48473
+ "unit": "px"
48474
+ },
48475
+ "blur": {
48476
+ "value": 0,
48477
+ "unit": "px"
48478
+ },
48479
+ "spread": {
48480
+ "value": 1,
48481
+ "unit": "px"
48482
+ }
48483
+ },
48484
+ {
48485
+ "color": "#f0f6fc",
48486
+ "alpha": 0.08,
48487
+ "offsetX": {
48488
+ "value": 0,
48489
+ "unit": "px"
48490
+ },
48491
+ "offsetY": {
48492
+ "value": 8,
48493
+ "unit": "px"
48494
+ },
48495
+ "blur": {
48496
+ "value": 16,
48497
+ "unit": "px"
48498
+ },
48499
+ "spread": {
48500
+ "value": -4,
48501
+ "unit": "px"
48502
+ }
48503
+ },
48504
+ {
48505
+ "color": "#f0f6fc",
48506
+ "alpha": 0.08,
48507
+ "offsetX": {
48508
+ "value": 0,
48509
+ "unit": "px"
48510
+ },
48511
+ "offsetY": {
48512
+ "value": 4,
48513
+ "unit": "px"
48514
+ },
48515
+ "blur": {
48516
+ "value": 32,
48517
+ "unit": "px"
48518
+ },
48519
+ "spread": {
48520
+ "value": -4,
48521
+ "unit": "px"
48522
+ }
48523
+ },
48524
+ {
48525
+ "color": "#f0f6fc",
48526
+ "alpha": 0.08,
48527
+ "offsetX": {
48528
+ "value": 0,
48529
+ "unit": "px"
48530
+ },
48531
+ "offsetY": {
48532
+ "value": 24,
48533
+ "unit": "px"
48534
+ },
48535
+ "blur": {
48536
+ "value": 48,
48537
+ "unit": "px"
48538
+ },
48539
+ "spread": {
48540
+ "value": -12,
48541
+ "unit": "px"
48542
+ }
48543
+ },
48544
+ {
48545
+ "color": "#f0f6fc",
48546
+ "alpha": 0.08,
48547
+ "offsetX": {
48548
+ "value": 0,
48549
+ "unit": "px"
48550
+ },
48551
+ "offsetY": {
48552
+ "value": 48,
48553
+ "unit": "px"
48554
+ },
48555
+ "blur": {
48556
+ "value": 96,
48557
+ "unit": "px"
48558
+ },
48559
+ "spread": {
48560
+ "value": -24,
48561
+ "unit": "px"
48562
+ }
48563
+ }
48564
+ ],
48565
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48566
+ "isSource": true,
48567
+ "$type": "shadow"
48568
+ },
48569
+ "light-protanopia-deuteranopia-high-contrast": {
48570
+ "$value": [
48571
+ {
48572
+ "color": "#3d444db3",
48573
+ "alpha": 1,
48574
+ "offsetX": {
48575
+ "value": 0,
48576
+ "unit": "px"
48577
+ },
48578
+ "offsetY": {
48579
+ "value": 0,
48580
+ "unit": "px"
48581
+ },
48582
+ "blur": {
48583
+ "value": 0,
48584
+ "unit": "px"
48585
+ },
48586
+ "spread": {
48587
+ "value": 1,
48588
+ "unit": "px"
48589
+ }
48590
+ },
48591
+ {
48592
+ "color": "#f0f6fc",
48593
+ "alpha": 0.08,
48594
+ "offsetX": {
48595
+ "value": 0,
48596
+ "unit": "px"
48597
+ },
48598
+ "offsetY": {
48599
+ "value": 8,
48600
+ "unit": "px"
48601
+ },
48602
+ "blur": {
48603
+ "value": 16,
48604
+ "unit": "px"
48605
+ },
48606
+ "spread": {
48607
+ "value": -4,
48608
+ "unit": "px"
48609
+ }
48610
+ },
48611
+ {
48612
+ "color": "#f0f6fc",
48613
+ "alpha": 0.08,
48614
+ "offsetX": {
48615
+ "value": 0,
48616
+ "unit": "px"
48617
+ },
48618
+ "offsetY": {
48619
+ "value": 4,
48620
+ "unit": "px"
48621
+ },
48622
+ "blur": {
48623
+ "value": 32,
48624
+ "unit": "px"
48625
+ },
48626
+ "spread": {
48627
+ "value": -4,
48628
+ "unit": "px"
48629
+ }
48630
+ },
48631
+ {
48632
+ "color": "#f0f6fc",
48633
+ "alpha": 0.08,
48634
+ "offsetX": {
48635
+ "value": 0,
48636
+ "unit": "px"
48637
+ },
48638
+ "offsetY": {
48639
+ "value": 24,
48640
+ "unit": "px"
48641
+ },
48642
+ "blur": {
48643
+ "value": 48,
48644
+ "unit": "px"
48645
+ },
48646
+ "spread": {
48647
+ "value": -12,
48648
+ "unit": "px"
48649
+ }
48650
+ },
48651
+ {
48652
+ "color": "#f0f6fc",
48653
+ "alpha": 0.08,
48654
+ "offsetX": {
48655
+ "value": 0,
48656
+ "unit": "px"
48657
+ },
48658
+ "offsetY": {
48659
+ "value": 48,
48660
+ "unit": "px"
48661
+ },
48662
+ "blur": {
48663
+ "value": 96,
48664
+ "unit": "px"
48665
+ },
48666
+ "spread": {
48667
+ "value": -24,
48668
+ "unit": "px"
48669
+ }
48670
+ }
48671
+ ],
48672
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
48673
+ "isSource": true,
48674
+ "$type": "shadow"
48675
+ },
48676
+ "light-tritanopia-high-contrast": {
48677
+ "$value": [
48678
+ {
48679
+ "color": "#3d444db3",
48680
+ "alpha": 1,
48681
+ "offsetX": {
48682
+ "value": 0,
48683
+ "unit": "px"
48684
+ },
48685
+ "offsetY": {
48686
+ "value": 0,
48687
+ "unit": "px"
48688
+ },
48689
+ "blur": {
48690
+ "value": 0,
48691
+ "unit": "px"
48692
+ },
48693
+ "spread": {
48694
+ "value": 1,
48695
+ "unit": "px"
48696
+ }
48697
+ },
48698
+ {
48699
+ "color": "#f0f6fc",
48700
+ "alpha": 0.08,
48701
+ "offsetX": {
48702
+ "value": 0,
48703
+ "unit": "px"
48704
+ },
48705
+ "offsetY": {
48706
+ "value": 8,
48707
+ "unit": "px"
48708
+ },
48709
+ "blur": {
48710
+ "value": 16,
48711
+ "unit": "px"
48712
+ },
48713
+ "spread": {
48714
+ "value": -4,
48715
+ "unit": "px"
48716
+ }
48717
+ },
48718
+ {
48719
+ "color": "#f0f6fc",
48720
+ "alpha": 0.08,
48721
+ "offsetX": {
48722
+ "value": 0,
48723
+ "unit": "px"
48724
+ },
48725
+ "offsetY": {
48726
+ "value": 4,
48727
+ "unit": "px"
48728
+ },
48729
+ "blur": {
48730
+ "value": 32,
48731
+ "unit": "px"
48732
+ },
48733
+ "spread": {
48734
+ "value": -4,
48735
+ "unit": "px"
48736
+ }
48737
+ },
48738
+ {
48739
+ "color": "#f0f6fc",
48740
+ "alpha": 0.08,
48741
+ "offsetX": {
48742
+ "value": 0,
48743
+ "unit": "px"
48744
+ },
48745
+ "offsetY": {
48746
+ "value": 24,
48747
+ "unit": "px"
48748
+ },
48749
+ "blur": {
48750
+ "value": 48,
48751
+ "unit": "px"
48752
+ },
48753
+ "spread": {
48754
+ "value": -12,
48755
+ "unit": "px"
48756
+ }
48757
+ },
48758
+ {
48759
+ "color": "#f0f6fc",
48760
+ "alpha": 0.08,
48761
+ "offsetX": {
48762
+ "value": 0,
48763
+ "unit": "px"
48764
+ },
48765
+ "offsetY": {
48766
+ "value": 48,
48767
+ "unit": "px"
48768
+ },
48769
+ "blur": {
48770
+ "value": 96,
48771
+ "unit": "px"
48772
+ },
48773
+ "spread": {
48774
+ "value": -24,
48775
+ "unit": "px"
48776
+ }
47673
48777
  }
47674
48778
  ],
47675
48779
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47676
48780
  "isSource": true,
47677
48781
  "$type": "shadow"
47678
48782
  }
48783
+ },
48784
+ "org.primer.llm": {
48785
+ "usage": ["popover", "action-menu", "select-panel", "autocomplete"],
48786
+ "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."
47679
48787
  }
47680
48788
  },
47681
48789
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47685,45 +48793,106 @@
47685
48793
  {
47686
48794
  "color": "{overlay.borderColor}",
47687
48795
  "alpha": 1,
47688
- "offsetX": "0px",
47689
- "offsetY": "0px",
47690
- "blur": "0px",
47691
- "spread": "1px"
48796
+ "offsetX": {
48797
+ "value": 0,
48798
+ "unit": "px"
48799
+ },
48800
+ "offsetY": {
48801
+ "value": 0,
48802
+ "unit": "px"
48803
+ },
48804
+ "blur": {
48805
+ "value": 0,
48806
+ "unit": "px"
48807
+ },
48808
+ "spread": {
48809
+ "value": 1,
48810
+ "unit": "px"
48811
+ }
47692
48812
  },
47693
48813
  {
47694
48814
  "color": "{base.color.neutral.0}",
47695
48815
  "alpha": 0.4,
47696
- "offsetX": "0px",
47697
- "offsetY": "8px",
47698
- "blur": "16px",
47699
- "spread": "-4px"
48816
+ "offsetX": {
48817
+ "value": 0,
48818
+ "unit": "px"
48819
+ },
48820
+ "offsetY": {
48821
+ "value": 8,
48822
+ "unit": "px"
48823
+ },
48824
+ "blur": {
48825
+ "value": 16,
48826
+ "unit": "px"
48827
+ },
48828
+ "spread": {
48829
+ "value": -4,
48830
+ "unit": "px"
48831
+ }
47700
48832
  },
47701
48833
  {
47702
48834
  "color": "{base.color.neutral.0}",
47703
48835
  "alpha": 0.4,
47704
- "offsetX": "0px",
47705
- "offsetY": "4px",
47706
- "blur": "32px",
47707
- "spread": "-4px"
48836
+ "offsetX": {
48837
+ "value": 0,
48838
+ "unit": "px"
48839
+ },
48840
+ "offsetY": {
48841
+ "value": 4,
48842
+ "unit": "px"
48843
+ },
48844
+ "blur": {
48845
+ "value": 32,
48846
+ "unit": "px"
48847
+ },
48848
+ "spread": {
48849
+ "value": -4,
48850
+ "unit": "px"
48851
+ }
47708
48852
  },
47709
48853
  {
47710
48854
  "color": "{base.color.neutral.0}",
47711
48855
  "alpha": 0.4,
47712
- "offsetX": "0px",
47713
- "offsetY": "24px",
47714
- "blur": "48px",
47715
- "spread": "-12px"
48856
+ "offsetX": {
48857
+ "value": 0,
48858
+ "unit": "px"
48859
+ },
48860
+ "offsetY": {
48861
+ "value": 24,
48862
+ "unit": "px"
48863
+ },
48864
+ "blur": {
48865
+ "value": 48,
48866
+ "unit": "px"
48867
+ },
48868
+ "spread": {
48869
+ "value": -12,
48870
+ "unit": "px"
48871
+ }
47716
48872
  },
47717
48873
  {
47718
48874
  "color": "{base.color.neutral.0}",
47719
48875
  "alpha": 0.4,
47720
- "offsetX": "0px",
47721
- "offsetY": "48px",
47722
- "blur": "96px",
47723
- "spread": "-24px"
48876
+ "offsetX": {
48877
+ "value": 0,
48878
+ "unit": "px"
48879
+ },
48880
+ "offsetY": {
48881
+ "value": 48,
48882
+ "unit": "px"
48883
+ },
48884
+ "blur": {
48885
+ "value": 96,
48886
+ "unit": "px"
48887
+ },
48888
+ "spread": {
48889
+ "value": -24,
48890
+ "unit": "px"
48891
+ }
47724
48892
  }
47725
48893
  ],
47726
48894
  "$type": "shadow",
48895
+ "$description": "Medium floating shadow for popovers and action menus",
47727
48896
  "$extensions": {
47728
48897
  "org.primer.figma": {
47729
48898
  "collection": "mode",
@@ -47735,48 +48904,433 @@
47735
48904
  {
47736
48905
  "color": "{overlay.borderColor}",
47737
48906
  "alpha": 1,
47738
- "offsetX": "0px",
47739
- "offsetY": "0px",
47740
- "blur": "0px",
47741
- "spread": "1px"
48907
+ "offsetX": {
48908
+ "value": 0,
48909
+ "unit": "px"
48910
+ },
48911
+ "offsetY": {
48912
+ "value": 0,
48913
+ "unit": "px"
48914
+ },
48915
+ "blur": {
48916
+ "value": 0,
48917
+ "unit": "px"
48918
+ },
48919
+ "spread": {
48920
+ "value": 1,
48921
+ "unit": "px"
48922
+ }
47742
48923
  },
47743
48924
  {
47744
48925
  "color": "{base.color.neutral.0}",
47745
48926
  "alpha": 0.4,
47746
- "offsetX": "0px",
47747
- "offsetY": "8px",
47748
- "blur": "16px",
47749
- "spread": "-4px"
48927
+ "offsetX": {
48928
+ "value": 0,
48929
+ "unit": "px"
48930
+ },
48931
+ "offsetY": {
48932
+ "value": 8,
48933
+ "unit": "px"
48934
+ },
48935
+ "blur": {
48936
+ "value": 16,
48937
+ "unit": "px"
48938
+ },
48939
+ "spread": {
48940
+ "value": -4,
48941
+ "unit": "px"
48942
+ }
47750
48943
  },
47751
48944
  {
47752
48945
  "color": "{base.color.neutral.0}",
47753
48946
  "alpha": 0.4,
47754
- "offsetX": "0px",
47755
- "offsetY": "4px",
47756
- "blur": "32px",
47757
- "spread": "-4px"
48947
+ "offsetX": {
48948
+ "value": 0,
48949
+ "unit": "px"
48950
+ },
48951
+ "offsetY": {
48952
+ "value": 4,
48953
+ "unit": "px"
48954
+ },
48955
+ "blur": {
48956
+ "value": 32,
48957
+ "unit": "px"
48958
+ },
48959
+ "spread": {
48960
+ "value": -4,
48961
+ "unit": "px"
48962
+ }
47758
48963
  },
47759
48964
  {
47760
48965
  "color": "{base.color.neutral.0}",
47761
48966
  "alpha": 0.4,
47762
- "offsetX": "0px",
47763
- "offsetY": "24px",
47764
- "blur": "48px",
47765
- "spread": "-12px"
48967
+ "offsetX": {
48968
+ "value": 0,
48969
+ "unit": "px"
48970
+ },
48971
+ "offsetY": {
48972
+ "value": 24,
48973
+ "unit": "px"
48974
+ },
48975
+ "blur": {
48976
+ "value": 48,
48977
+ "unit": "px"
48978
+ },
48979
+ "spread": {
48980
+ "value": -12,
48981
+ "unit": "px"
48982
+ }
47766
48983
  },
47767
48984
  {
47768
48985
  "color": "{base.color.neutral.0}",
47769
48986
  "alpha": 0.4,
47770
- "offsetX": "0px",
47771
- "offsetY": "48px",
47772
- "blur": "96px",
47773
- "spread": "-24px"
48987
+ "offsetX": {
48988
+ "value": 0,
48989
+ "unit": "px"
48990
+ },
48991
+ "offsetY": {
48992
+ "value": 48,
48993
+ "unit": "px"
48994
+ },
48995
+ "blur": {
48996
+ "value": 96,
48997
+ "unit": "px"
48998
+ },
48999
+ "spread": {
49000
+ "value": -24,
49001
+ "unit": "px"
49002
+ }
49003
+ }
49004
+ ],
49005
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49006
+ "isSource": true,
49007
+ "$type": "shadow"
49008
+ },
49009
+ "light-high-contrast": {
49010
+ "$value": [
49011
+ {
49012
+ "color": "{overlay.borderColor}",
49013
+ "alpha": 1,
49014
+ "offsetX": {
49015
+ "value": 0,
49016
+ "unit": "px"
49017
+ },
49018
+ "offsetY": {
49019
+ "value": 0,
49020
+ "unit": "px"
49021
+ },
49022
+ "blur": {
49023
+ "value": 0,
49024
+ "unit": "px"
49025
+ },
49026
+ "spread": {
49027
+ "value": 1,
49028
+ "unit": "px"
49029
+ }
49030
+ },
49031
+ {
49032
+ "color": "{base.color.neutral.12}",
49033
+ "alpha": 0.08,
49034
+ "offsetX": {
49035
+ "value": 0,
49036
+ "unit": "px"
49037
+ },
49038
+ "offsetY": {
49039
+ "value": 8,
49040
+ "unit": "px"
49041
+ },
49042
+ "blur": {
49043
+ "value": 16,
49044
+ "unit": "px"
49045
+ },
49046
+ "spread": {
49047
+ "value": -4,
49048
+ "unit": "px"
49049
+ }
49050
+ },
49051
+ {
49052
+ "color": "{base.color.neutral.12}",
49053
+ "alpha": 0.08,
49054
+ "offsetX": {
49055
+ "value": 0,
49056
+ "unit": "px"
49057
+ },
49058
+ "offsetY": {
49059
+ "value": 4,
49060
+ "unit": "px"
49061
+ },
49062
+ "blur": {
49063
+ "value": 32,
49064
+ "unit": "px"
49065
+ },
49066
+ "spread": {
49067
+ "value": -4,
49068
+ "unit": "px"
49069
+ }
49070
+ },
49071
+ {
49072
+ "color": "{base.color.neutral.12}",
49073
+ "alpha": 0.08,
49074
+ "offsetX": {
49075
+ "value": 0,
49076
+ "unit": "px"
49077
+ },
49078
+ "offsetY": {
49079
+ "value": 24,
49080
+ "unit": "px"
49081
+ },
49082
+ "blur": {
49083
+ "value": 48,
49084
+ "unit": "px"
49085
+ },
49086
+ "spread": {
49087
+ "value": -12,
49088
+ "unit": "px"
49089
+ }
49090
+ },
49091
+ {
49092
+ "color": "{base.color.neutral.12}",
49093
+ "alpha": 0.08,
49094
+ "offsetX": {
49095
+ "value": 0,
49096
+ "unit": "px"
49097
+ },
49098
+ "offsetY": {
49099
+ "value": 48,
49100
+ "unit": "px"
49101
+ },
49102
+ "blur": {
49103
+ "value": 96,
49104
+ "unit": "px"
49105
+ },
49106
+ "spread": {
49107
+ "value": -24,
49108
+ "unit": "px"
49109
+ }
49110
+ }
49111
+ ],
49112
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49113
+ "isSource": true,
49114
+ "$type": "shadow"
49115
+ },
49116
+ "light-protanopia-deuteranopia-high-contrast": {
49117
+ "$value": [
49118
+ {
49119
+ "color": "{overlay.borderColor}",
49120
+ "alpha": 1,
49121
+ "offsetX": {
49122
+ "value": 0,
49123
+ "unit": "px"
49124
+ },
49125
+ "offsetY": {
49126
+ "value": 0,
49127
+ "unit": "px"
49128
+ },
49129
+ "blur": {
49130
+ "value": 0,
49131
+ "unit": "px"
49132
+ },
49133
+ "spread": {
49134
+ "value": 1,
49135
+ "unit": "px"
49136
+ }
49137
+ },
49138
+ {
49139
+ "color": "{base.color.neutral.12}",
49140
+ "alpha": 0.08,
49141
+ "offsetX": {
49142
+ "value": 0,
49143
+ "unit": "px"
49144
+ },
49145
+ "offsetY": {
49146
+ "value": 8,
49147
+ "unit": "px"
49148
+ },
49149
+ "blur": {
49150
+ "value": 16,
49151
+ "unit": "px"
49152
+ },
49153
+ "spread": {
49154
+ "value": -4,
49155
+ "unit": "px"
49156
+ }
49157
+ },
49158
+ {
49159
+ "color": "{base.color.neutral.12}",
49160
+ "alpha": 0.08,
49161
+ "offsetX": {
49162
+ "value": 0,
49163
+ "unit": "px"
49164
+ },
49165
+ "offsetY": {
49166
+ "value": 4,
49167
+ "unit": "px"
49168
+ },
49169
+ "blur": {
49170
+ "value": 32,
49171
+ "unit": "px"
49172
+ },
49173
+ "spread": {
49174
+ "value": -4,
49175
+ "unit": "px"
49176
+ }
49177
+ },
49178
+ {
49179
+ "color": "{base.color.neutral.12}",
49180
+ "alpha": 0.08,
49181
+ "offsetX": {
49182
+ "value": 0,
49183
+ "unit": "px"
49184
+ },
49185
+ "offsetY": {
49186
+ "value": 24,
49187
+ "unit": "px"
49188
+ },
49189
+ "blur": {
49190
+ "value": 48,
49191
+ "unit": "px"
49192
+ },
49193
+ "spread": {
49194
+ "value": -12,
49195
+ "unit": "px"
49196
+ }
49197
+ },
49198
+ {
49199
+ "color": "{base.color.neutral.12}",
49200
+ "alpha": 0.08,
49201
+ "offsetX": {
49202
+ "value": 0,
49203
+ "unit": "px"
49204
+ },
49205
+ "offsetY": {
49206
+ "value": 48,
49207
+ "unit": "px"
49208
+ },
49209
+ "blur": {
49210
+ "value": 96,
49211
+ "unit": "px"
49212
+ },
49213
+ "spread": {
49214
+ "value": -24,
49215
+ "unit": "px"
49216
+ }
49217
+ }
49218
+ ],
49219
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49220
+ "isSource": true,
49221
+ "$type": "shadow"
49222
+ },
49223
+ "light-tritanopia-high-contrast": {
49224
+ "$value": [
49225
+ {
49226
+ "color": "{overlay.borderColor}",
49227
+ "alpha": 1,
49228
+ "offsetX": {
49229
+ "value": 0,
49230
+ "unit": "px"
49231
+ },
49232
+ "offsetY": {
49233
+ "value": 0,
49234
+ "unit": "px"
49235
+ },
49236
+ "blur": {
49237
+ "value": 0,
49238
+ "unit": "px"
49239
+ },
49240
+ "spread": {
49241
+ "value": 1,
49242
+ "unit": "px"
49243
+ }
49244
+ },
49245
+ {
49246
+ "color": "{base.color.neutral.12}",
49247
+ "alpha": 0.08,
49248
+ "offsetX": {
49249
+ "value": 0,
49250
+ "unit": "px"
49251
+ },
49252
+ "offsetY": {
49253
+ "value": 8,
49254
+ "unit": "px"
49255
+ },
49256
+ "blur": {
49257
+ "value": 16,
49258
+ "unit": "px"
49259
+ },
49260
+ "spread": {
49261
+ "value": -4,
49262
+ "unit": "px"
49263
+ }
49264
+ },
49265
+ {
49266
+ "color": "{base.color.neutral.12}",
49267
+ "alpha": 0.08,
49268
+ "offsetX": {
49269
+ "value": 0,
49270
+ "unit": "px"
49271
+ },
49272
+ "offsetY": {
49273
+ "value": 4,
49274
+ "unit": "px"
49275
+ },
49276
+ "blur": {
49277
+ "value": 32,
49278
+ "unit": "px"
49279
+ },
49280
+ "spread": {
49281
+ "value": -4,
49282
+ "unit": "px"
49283
+ }
49284
+ },
49285
+ {
49286
+ "color": "{base.color.neutral.12}",
49287
+ "alpha": 0.08,
49288
+ "offsetX": {
49289
+ "value": 0,
49290
+ "unit": "px"
49291
+ },
49292
+ "offsetY": {
49293
+ "value": 24,
49294
+ "unit": "px"
49295
+ },
49296
+ "blur": {
49297
+ "value": 48,
49298
+ "unit": "px"
49299
+ },
49300
+ "spread": {
49301
+ "value": -12,
49302
+ "unit": "px"
49303
+ }
49304
+ },
49305
+ {
49306
+ "color": "{base.color.neutral.12}",
49307
+ "alpha": 0.08,
49308
+ "offsetX": {
49309
+ "value": 0,
49310
+ "unit": "px"
49311
+ },
49312
+ "offsetY": {
49313
+ "value": 48,
49314
+ "unit": "px"
49315
+ },
49316
+ "blur": {
49317
+ "value": 96,
49318
+ "unit": "px"
49319
+ },
49320
+ "spread": {
49321
+ "value": -24,
49322
+ "unit": "px"
49323
+ }
47774
49324
  }
47775
49325
  ],
47776
49326
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47777
49327
  "isSource": true,
47778
49328
  "$type": "shadow"
47779
49329
  }
49330
+ },
49331
+ "org.primer.llm": {
49332
+ "usage": ["popover", "action-menu", "select-panel", "autocomplete"],
49333
+ "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."
47780
49334
  }
47781
49335
  },
47782
49336
  "key": "{shadow.floating.medium}"
@@ -47784,8 +49338,9 @@
47784
49338
  "name": "shadow-floating-medium",
47785
49339
  "attributes": {},
47786
49340
  "path": ["shadow", "floating", "medium"],
47787
- "value": "0px 0px 0px 1px #3d444d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966",
47788
- "type": "shadow"
49341
+ "value": "0 0 0 1px #3d444d, 0 8px 16px -4px #01040966, 0 4px 32px -4px #01040966, 0 24px 48px -12px #01040966, 0 48px 96px -24px #01040966",
49342
+ "type": "shadow",
49343
+ "description": "Medium floating shadow for popovers and action menus"
47789
49344
  },
47790
49345
  "shadow-floating-small": {
47791
49346
  "key": "{shadow.floating.small}",
@@ -47800,26 +49355,62 @@
47800
49355
  {
47801
49356
  "color": "#3d444db3",
47802
49357
  "alpha": 1,
47803
- "offsetX": "0px",
47804
- "offsetY": "0px",
47805
- "blur": "0px",
47806
- "spread": "1px"
49358
+ "offsetX": {
49359
+ "value": 0,
49360
+ "unit": "px"
49361
+ },
49362
+ "offsetY": {
49363
+ "value": 0,
49364
+ "unit": "px"
49365
+ },
49366
+ "blur": {
49367
+ "value": 0,
49368
+ "unit": "px"
49369
+ },
49370
+ "spread": {
49371
+ "value": 1,
49372
+ "unit": "px"
49373
+ }
47807
49374
  },
47808
49375
  {
47809
49376
  "color": "#010409",
47810
49377
  "alpha": 0.4,
47811
- "offsetX": "0px",
47812
- "offsetY": "6px",
47813
- "blur": "12px",
47814
- "spread": "-3px"
49378
+ "offsetX": {
49379
+ "value": 0,
49380
+ "unit": "px"
49381
+ },
49382
+ "offsetY": {
49383
+ "value": 6,
49384
+ "unit": "px"
49385
+ },
49386
+ "blur": {
49387
+ "value": 12,
49388
+ "unit": "px"
49389
+ },
49390
+ "spread": {
49391
+ "value": -3,
49392
+ "unit": "px"
49393
+ }
47815
49394
  },
47816
49395
  {
47817
49396
  "color": "#010409",
47818
49397
  "alpha": 0.4,
47819
- "offsetX": "0px",
47820
- "offsetY": "6px",
47821
- "blur": "18px",
47822
- "spread": "0px"
49398
+ "offsetX": {
49399
+ "value": 0,
49400
+ "unit": "px"
49401
+ },
49402
+ "offsetY": {
49403
+ "value": 6,
49404
+ "unit": "px"
49405
+ },
49406
+ "blur": {
49407
+ "value": 18,
49408
+ "unit": "px"
49409
+ },
49410
+ "spread": {
49411
+ "value": 0,
49412
+ "unit": "px"
49413
+ }
47823
49414
  }
47824
49415
  ],
47825
49416
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47839,26 +49430,62 @@
47839
49430
  {
47840
49431
  "color": "{overlay.borderColor}",
47841
49432
  "alpha": 1,
47842
- "offsetX": "0px",
47843
- "offsetY": "0px",
47844
- "blur": "0px",
47845
- "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
+ }
47846
49449
  },
47847
49450
  {
47848
49451
  "color": "{base.color.neutral.0}",
47849
49452
  "alpha": 0.4,
47850
- "offsetX": "0px",
47851
- "offsetY": "6px",
47852
- "blur": "12px",
47853
- "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
+ }
47854
49469
  },
47855
49470
  {
47856
49471
  "color": "{base.color.neutral.0}",
47857
49472
  "alpha": 0.4,
47858
- "offsetX": "0px",
47859
- "offsetY": "6px",
47860
- "blur": "18px",
47861
- "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
+ }
47862
49489
  }
47863
49490
  ],
47864
49491
  "$type": "shadow",
@@ -47874,26 +49501,62 @@
47874
49501
  {
47875
49502
  "color": "{overlay.borderColor}",
47876
49503
  "alpha": 1,
47877
- "offsetX": "0px",
47878
- "offsetY": "0px",
47879
- "blur": "0px",
47880
- "spread": "1px"
49504
+ "offsetX": {
49505
+ "value": 0,
49506
+ "unit": "px"
49507
+ },
49508
+ "offsetY": {
49509
+ "value": 0,
49510
+ "unit": "px"
49511
+ },
49512
+ "blur": {
49513
+ "value": 0,
49514
+ "unit": "px"
49515
+ },
49516
+ "spread": {
49517
+ "value": 1,
49518
+ "unit": "px"
49519
+ }
47881
49520
  },
47882
49521
  {
47883
49522
  "color": "{base.color.neutral.0}",
47884
49523
  "alpha": 0.4,
47885
- "offsetX": "0px",
47886
- "offsetY": "6px",
47887
- "blur": "12px",
47888
- "spread": "-3px"
49524
+ "offsetX": {
49525
+ "value": 0,
49526
+ "unit": "px"
49527
+ },
49528
+ "offsetY": {
49529
+ "value": 6,
49530
+ "unit": "px"
49531
+ },
49532
+ "blur": {
49533
+ "value": 12,
49534
+ "unit": "px"
49535
+ },
49536
+ "spread": {
49537
+ "value": -3,
49538
+ "unit": "px"
49539
+ }
47889
49540
  },
47890
49541
  {
47891
49542
  "color": "{base.color.neutral.0}",
47892
49543
  "alpha": 0.4,
47893
- "offsetX": "0px",
47894
- "offsetY": "6px",
47895
- "blur": "18px",
47896
- "spread": "0px"
49544
+ "offsetX": {
49545
+ "value": 0,
49546
+ "unit": "px"
49547
+ },
49548
+ "offsetY": {
49549
+ "value": 6,
49550
+ "unit": "px"
49551
+ },
49552
+ "blur": {
49553
+ "value": 18,
49554
+ "unit": "px"
49555
+ },
49556
+ "spread": {
49557
+ "value": 0,
49558
+ "unit": "px"
49559
+ }
47897
49560
  }
47898
49561
  ],
47899
49562
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47911,7 +49574,7 @@
47911
49574
  "name": "shadow-floating-small",
47912
49575
  "attributes": {},
47913
49576
  "path": ["shadow", "floating", "small"],
47914
- "value": "0px 0px 0px 1px #3d444d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966",
49577
+ "value": "0 0 0 1px #3d444d, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966",
47915
49578
  "type": "shadow",
47916
49579
  "description": "Small floating shadow for dropdowns, tooltips, and small overlays"
47917
49580
  },
@@ -47928,24 +49591,193 @@
47928
49591
  {
47929
49592
  "color": "#3d444db3",
47930
49593
  "alpha": 1,
47931
- "offsetX": "0px",
47932
- "offsetY": "0px",
47933
- "blur": "0px",
47934
- "spread": "1px"
49594
+ "offsetX": {
49595
+ "value": 0,
49596
+ "unit": "px"
49597
+ },
49598
+ "offsetY": {
49599
+ "value": 0,
49600
+ "unit": "px"
49601
+ },
49602
+ "blur": {
49603
+ "value": 0,
49604
+ "unit": "px"
49605
+ },
49606
+ "spread": {
49607
+ "value": 1,
49608
+ "unit": "px"
49609
+ }
47935
49610
  },
47936
49611
  {
47937
49612
  "color": "#010409",
47938
49613
  "alpha": 1,
47939
- "offsetX": "0px",
47940
- "offsetY": "32px",
47941
- "blur": "64px",
47942
- "spread": "0px"
49614
+ "offsetX": {
49615
+ "value": 0,
49616
+ "unit": "px"
49617
+ },
49618
+ "offsetY": {
49619
+ "value": 32,
49620
+ "unit": "px"
49621
+ },
49622
+ "blur": {
49623
+ "value": 64,
49624
+ "unit": "px"
49625
+ },
49626
+ "spread": {
49627
+ "value": 0,
49628
+ "unit": "px"
49629
+ }
49630
+ }
49631
+ ],
49632
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49633
+ "isSource": true,
49634
+ "$type": "shadow"
49635
+ },
49636
+ "light-high-contrast": {
49637
+ "$value": [
49638
+ {
49639
+ "color": "#3d444db3",
49640
+ "alpha": 1,
49641
+ "offsetX": {
49642
+ "value": 0,
49643
+ "unit": "px"
49644
+ },
49645
+ "offsetY": {
49646
+ "value": 0,
49647
+ "unit": "px"
49648
+ },
49649
+ "blur": {
49650
+ "value": 0,
49651
+ "unit": "px"
49652
+ },
49653
+ "spread": {
49654
+ "value": 1,
49655
+ "unit": "px"
49656
+ }
49657
+ },
49658
+ {
49659
+ "color": "#f0f6fc",
49660
+ "alpha": 0.32,
49661
+ "offsetX": {
49662
+ "value": 0,
49663
+ "unit": "px"
49664
+ },
49665
+ "offsetY": {
49666
+ "value": 56,
49667
+ "unit": "px"
49668
+ },
49669
+ "blur": {
49670
+ "value": 112,
49671
+ "unit": "px"
49672
+ },
49673
+ "spread": {
49674
+ "value": 0,
49675
+ "unit": "px"
49676
+ }
49677
+ }
49678
+ ],
49679
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49680
+ "isSource": true,
49681
+ "$type": "shadow"
49682
+ },
49683
+ "light-protanopia-deuteranopia-high-contrast": {
49684
+ "$value": [
49685
+ {
49686
+ "color": "#3d444db3",
49687
+ "alpha": 1,
49688
+ "offsetX": {
49689
+ "value": 0,
49690
+ "unit": "px"
49691
+ },
49692
+ "offsetY": {
49693
+ "value": 0,
49694
+ "unit": "px"
49695
+ },
49696
+ "blur": {
49697
+ "value": 0,
49698
+ "unit": "px"
49699
+ },
49700
+ "spread": {
49701
+ "value": 1,
49702
+ "unit": "px"
49703
+ }
49704
+ },
49705
+ {
49706
+ "color": "#f0f6fc",
49707
+ "alpha": 0.32,
49708
+ "offsetX": {
49709
+ "value": 0,
49710
+ "unit": "px"
49711
+ },
49712
+ "offsetY": {
49713
+ "value": 56,
49714
+ "unit": "px"
49715
+ },
49716
+ "blur": {
49717
+ "value": 112,
49718
+ "unit": "px"
49719
+ },
49720
+ "spread": {
49721
+ "value": 0,
49722
+ "unit": "px"
49723
+ }
49724
+ }
49725
+ ],
49726
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49727
+ "isSource": true,
49728
+ "$type": "shadow"
49729
+ },
49730
+ "light-tritanopia-high-contrast": {
49731
+ "$value": [
49732
+ {
49733
+ "color": "#3d444db3",
49734
+ "alpha": 1,
49735
+ "offsetX": {
49736
+ "value": 0,
49737
+ "unit": "px"
49738
+ },
49739
+ "offsetY": {
49740
+ "value": 0,
49741
+ "unit": "px"
49742
+ },
49743
+ "blur": {
49744
+ "value": 0,
49745
+ "unit": "px"
49746
+ },
49747
+ "spread": {
49748
+ "value": 1,
49749
+ "unit": "px"
49750
+ }
49751
+ },
49752
+ {
49753
+ "color": "#f0f6fc",
49754
+ "alpha": 0.32,
49755
+ "offsetX": {
49756
+ "value": 0,
49757
+ "unit": "px"
49758
+ },
49759
+ "offsetY": {
49760
+ "value": 56,
49761
+ "unit": "px"
49762
+ },
49763
+ "blur": {
49764
+ "value": 112,
49765
+ "unit": "px"
49766
+ },
49767
+ "spread": {
49768
+ "value": 0,
49769
+ "unit": "px"
49770
+ }
47943
49771
  }
47944
49772
  ],
47945
49773
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47946
49774
  "isSource": true,
47947
49775
  "$type": "shadow"
47948
49776
  }
49777
+ },
49778
+ "org.primer.llm": {
49779
+ "usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
49780
+ "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."
47949
49781
  }
47950
49782
  },
47951
49783
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -47955,21 +49787,46 @@
47955
49787
  {
47956
49788
  "color": "{overlay.borderColor}",
47957
49789
  "alpha": 1,
47958
- "offsetX": "0px",
47959
- "offsetY": "0px",
47960
- "blur": "0px",
47961
- "spread": "1px"
49790
+ "offsetX": {
49791
+ "value": 0,
49792
+ "unit": "px"
49793
+ },
49794
+ "offsetY": {
49795
+ "value": 0,
49796
+ "unit": "px"
49797
+ },
49798
+ "blur": {
49799
+ "value": 0,
49800
+ "unit": "px"
49801
+ },
49802
+ "spread": {
49803
+ "value": 1,
49804
+ "unit": "px"
49805
+ }
47962
49806
  },
47963
49807
  {
47964
49808
  "color": "{base.color.neutral.0}",
47965
49809
  "alpha": 1,
47966
- "offsetX": "0px",
47967
- "offsetY": "32px",
47968
- "blur": "64px",
47969
- "spread": "0px"
49810
+ "offsetX": {
49811
+ "value": 0,
49812
+ "unit": "px"
49813
+ },
49814
+ "offsetY": {
49815
+ "value": 32,
49816
+ "unit": "px"
49817
+ },
49818
+ "blur": {
49819
+ "value": 64,
49820
+ "unit": "px"
49821
+ },
49822
+ "spread": {
49823
+ "value": 0,
49824
+ "unit": "px"
49825
+ }
47970
49826
  }
47971
49827
  ],
47972
49828
  "$type": "shadow",
49829
+ "$description": "Extra large floating shadow for full-screen overlays and sheets",
47973
49830
  "$extensions": {
47974
49831
  "org.primer.figma": {
47975
49832
  "collection": "mode",
@@ -47981,24 +49838,193 @@
47981
49838
  {
47982
49839
  "color": "{overlay.borderColor}",
47983
49840
  "alpha": 1,
47984
- "offsetX": "0px",
47985
- "offsetY": "0px",
47986
- "blur": "0px",
47987
- "spread": "1px"
49841
+ "offsetX": {
49842
+ "value": 0,
49843
+ "unit": "px"
49844
+ },
49845
+ "offsetY": {
49846
+ "value": 0,
49847
+ "unit": "px"
49848
+ },
49849
+ "blur": {
49850
+ "value": 0,
49851
+ "unit": "px"
49852
+ },
49853
+ "spread": {
49854
+ "value": 1,
49855
+ "unit": "px"
49856
+ }
47988
49857
  },
47989
49858
  {
47990
49859
  "color": "{base.color.neutral.0}",
47991
49860
  "alpha": 1,
47992
- "offsetX": "0px",
47993
- "offsetY": "32px",
47994
- "blur": "64px",
47995
- "spread": "0px"
49861
+ "offsetX": {
49862
+ "value": 0,
49863
+ "unit": "px"
49864
+ },
49865
+ "offsetY": {
49866
+ "value": 32,
49867
+ "unit": "px"
49868
+ },
49869
+ "blur": {
49870
+ "value": 64,
49871
+ "unit": "px"
49872
+ },
49873
+ "spread": {
49874
+ "value": 0,
49875
+ "unit": "px"
49876
+ }
49877
+ }
49878
+ ],
49879
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49880
+ "isSource": true,
49881
+ "$type": "shadow"
49882
+ },
49883
+ "light-high-contrast": {
49884
+ "$value": [
49885
+ {
49886
+ "color": "{overlay.borderColor}",
49887
+ "alpha": 1,
49888
+ "offsetX": {
49889
+ "value": 0,
49890
+ "unit": "px"
49891
+ },
49892
+ "offsetY": {
49893
+ "value": 0,
49894
+ "unit": "px"
49895
+ },
49896
+ "blur": {
49897
+ "value": 0,
49898
+ "unit": "px"
49899
+ },
49900
+ "spread": {
49901
+ "value": 1,
49902
+ "unit": "px"
49903
+ }
49904
+ },
49905
+ {
49906
+ "color": "{base.color.neutral.12}",
49907
+ "alpha": 0.32,
49908
+ "offsetX": {
49909
+ "value": 0,
49910
+ "unit": "px"
49911
+ },
49912
+ "offsetY": {
49913
+ "value": 56,
49914
+ "unit": "px"
49915
+ },
49916
+ "blur": {
49917
+ "value": 112,
49918
+ "unit": "px"
49919
+ },
49920
+ "spread": {
49921
+ "value": 0,
49922
+ "unit": "px"
49923
+ }
49924
+ }
49925
+ ],
49926
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49927
+ "isSource": true,
49928
+ "$type": "shadow"
49929
+ },
49930
+ "light-protanopia-deuteranopia-high-contrast": {
49931
+ "$value": [
49932
+ {
49933
+ "color": "{overlay.borderColor}",
49934
+ "alpha": 1,
49935
+ "offsetX": {
49936
+ "value": 0,
49937
+ "unit": "px"
49938
+ },
49939
+ "offsetY": {
49940
+ "value": 0,
49941
+ "unit": "px"
49942
+ },
49943
+ "blur": {
49944
+ "value": 0,
49945
+ "unit": "px"
49946
+ },
49947
+ "spread": {
49948
+ "value": 1,
49949
+ "unit": "px"
49950
+ }
49951
+ },
49952
+ {
49953
+ "color": "{base.color.neutral.12}",
49954
+ "alpha": 0.32,
49955
+ "offsetX": {
49956
+ "value": 0,
49957
+ "unit": "px"
49958
+ },
49959
+ "offsetY": {
49960
+ "value": 56,
49961
+ "unit": "px"
49962
+ },
49963
+ "blur": {
49964
+ "value": 112,
49965
+ "unit": "px"
49966
+ },
49967
+ "spread": {
49968
+ "value": 0,
49969
+ "unit": "px"
49970
+ }
49971
+ }
49972
+ ],
49973
+ "filePath": "src/tokens/functional/shadow/shadow.json5",
49974
+ "isSource": true,
49975
+ "$type": "shadow"
49976
+ },
49977
+ "light-tritanopia-high-contrast": {
49978
+ "$value": [
49979
+ {
49980
+ "color": "{overlay.borderColor}",
49981
+ "alpha": 1,
49982
+ "offsetX": {
49983
+ "value": 0,
49984
+ "unit": "px"
49985
+ },
49986
+ "offsetY": {
49987
+ "value": 0,
49988
+ "unit": "px"
49989
+ },
49990
+ "blur": {
49991
+ "value": 0,
49992
+ "unit": "px"
49993
+ },
49994
+ "spread": {
49995
+ "value": 1,
49996
+ "unit": "px"
49997
+ }
49998
+ },
49999
+ {
50000
+ "color": "{base.color.neutral.12}",
50001
+ "alpha": 0.32,
50002
+ "offsetX": {
50003
+ "value": 0,
50004
+ "unit": "px"
50005
+ },
50006
+ "offsetY": {
50007
+ "value": 56,
50008
+ "unit": "px"
50009
+ },
50010
+ "blur": {
50011
+ "value": 112,
50012
+ "unit": "px"
50013
+ },
50014
+ "spread": {
50015
+ "value": 0,
50016
+ "unit": "px"
50017
+ }
47996
50018
  }
47997
50019
  ],
47998
50020
  "filePath": "src/tokens/functional/shadow/shadow.json5",
47999
50021
  "isSource": true,
48000
50022
  "$type": "shadow"
48001
50023
  }
50024
+ },
50025
+ "org.primer.llm": {
50026
+ "usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
50027
+ "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."
48002
50028
  }
48003
50029
  },
48004
50030
  "key": "{shadow.floating.xlarge}"
@@ -48006,8 +50032,9 @@
48006
50032
  "name": "shadow-floating-xlarge",
48007
50033
  "attributes": {},
48008
50034
  "path": ["shadow", "floating", "xlarge"],
48009
- "value": "0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409",
48010
- "type": "shadow"
50035
+ "value": "0 0 0 1px #3d444d, 0 32px 64px 0 #010409",
50036
+ "type": "shadow",
50037
+ "description": "Extra large floating shadow for full-screen overlays and sheets"
48011
50038
  },
48012
50039
  "shadow-inset": {
48013
50040
  "key": "{shadow.inset}",
@@ -48021,16 +50048,32 @@
48021
50048
  "$value": {
48022
50049
  "color": "#010409",
48023
50050
  "alpha": 0.24,
48024
- "offsetX": "0px",
48025
- "offsetY": "1px",
48026
- "blur": "0px",
48027
- "spread": "0px",
50051
+ "offsetX": {
50052
+ "value": 0,
50053
+ "unit": "px"
50054
+ },
50055
+ "offsetY": {
50056
+ "value": 1,
50057
+ "unit": "px"
50058
+ },
50059
+ "blur": {
50060
+ "value": 0,
50061
+ "unit": "px"
50062
+ },
50063
+ "spread": {
50064
+ "value": 0,
50065
+ "unit": "px"
50066
+ },
48028
50067
  "inset": true
48029
50068
  },
48030
50069
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48031
50070
  "isSource": true,
48032
50071
  "$type": "shadow"
48033
50072
  }
50073
+ },
50074
+ "org.primer.llm": {
50075
+ "usage": ["input-field", "pressed-button", "recessed-area", "well"],
50076
+ "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."
48034
50077
  }
48035
50078
  },
48036
50079
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48039,13 +50082,26 @@
48039
50082
  "$value": {
48040
50083
  "color": "{base.color.neutral.0}",
48041
50084
  "alpha": 0.24,
48042
- "offsetX": "0px",
48043
- "offsetY": "1px",
48044
- "blur": "0px",
48045
- "spread": "0px",
50085
+ "offsetX": {
50086
+ "value": 0,
50087
+ "unit": "px"
50088
+ },
50089
+ "offsetY": {
50090
+ "value": 1,
50091
+ "unit": "px"
50092
+ },
50093
+ "blur": {
50094
+ "value": 0,
50095
+ "unit": "px"
50096
+ },
50097
+ "spread": {
50098
+ "value": 0,
50099
+ "unit": "px"
50100
+ },
48046
50101
  "inset": true
48047
50102
  },
48048
50103
  "$type": "shadow",
50104
+ "$description": "Inset shadow for recessed elements",
48049
50105
  "$extensions": {
48050
50106
  "org.primer.figma": {
48051
50107
  "collection": "mode",
@@ -48056,16 +50112,32 @@
48056
50112
  "$value": {
48057
50113
  "color": "{base.color.neutral.0}",
48058
50114
  "alpha": 0.24,
48059
- "offsetX": "0px",
48060
- "offsetY": "1px",
48061
- "blur": "0px",
48062
- "spread": "0px",
50115
+ "offsetX": {
50116
+ "value": 0,
50117
+ "unit": "px"
50118
+ },
50119
+ "offsetY": {
50120
+ "value": 1,
50121
+ "unit": "px"
50122
+ },
50123
+ "blur": {
50124
+ "value": 0,
50125
+ "unit": "px"
50126
+ },
50127
+ "spread": {
50128
+ "value": 0,
50129
+ "unit": "px"
50130
+ },
48063
50131
  "inset": true
48064
50132
  },
48065
50133
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48066
50134
  "isSource": true,
48067
50135
  "$type": "shadow"
48068
50136
  }
50137
+ },
50138
+ "org.primer.llm": {
50139
+ "usage": ["input-field", "pressed-button", "recessed-area", "well"],
50140
+ "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."
48069
50141
  }
48070
50142
  },
48071
50143
  "key": "{shadow.inset}"
@@ -48073,8 +50145,9 @@
48073
50145
  "name": "shadow-inset",
48074
50146
  "attributes": {},
48075
50147
  "path": ["shadow", "inset"],
48076
- "value": "inset 0px 1px 0px 0px #0104093d",
48077
- "type": "shadow"
50148
+ "value": "inset 0 1px 0 0 #0104093d",
50149
+ "type": "shadow",
50150
+ "description": "Inset shadow for recessed elements"
48078
50151
  },
48079
50152
  "shadow-resting-medium": {
48080
50153
  "key": "{shadow.resting.medium}",
@@ -48089,24 +50162,52 @@
48089
50162
  {
48090
50163
  "color": "#010409",
48091
50164
  "alpha": 0.4,
48092
- "offsetX": "0px",
48093
- "offsetY": "1px",
48094
- "blur": "1px",
48095
- "spread": "0px"
50165
+ "offsetX": {
50166
+ "value": 0,
50167
+ "unit": "px"
50168
+ },
50169
+ "offsetY": {
50170
+ "value": 1,
50171
+ "unit": "px"
50172
+ },
50173
+ "blur": {
50174
+ "value": 1,
50175
+ "unit": "px"
50176
+ },
50177
+ "spread": {
50178
+ "value": 0,
50179
+ "unit": "px"
50180
+ }
48096
50181
  },
48097
50182
  {
48098
50183
  "color": "#010409",
48099
50184
  "alpha": 0.8,
48100
- "offsetX": "0px",
48101
- "offsetY": "3px",
48102
- "blur": "6px",
48103
- "spread": "0px"
50185
+ "offsetX": {
50186
+ "value": 0,
50187
+ "unit": "px"
50188
+ },
50189
+ "offsetY": {
50190
+ "value": 3,
50191
+ "unit": "px"
50192
+ },
50193
+ "blur": {
50194
+ "value": 6,
50195
+ "unit": "px"
50196
+ },
50197
+ "spread": {
50198
+ "value": 0,
50199
+ "unit": "px"
50200
+ }
48104
50201
  }
48105
50202
  ],
48106
50203
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48107
50204
  "isSource": true,
48108
50205
  "$type": "shadow"
48109
50206
  }
50207
+ },
50208
+ "org.primer.llm": {
50209
+ "usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
50210
+ "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."
48110
50211
  }
48111
50212
  },
48112
50213
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48116,21 +50217,46 @@
48116
50217
  {
48117
50218
  "color": "{base.color.neutral.0}",
48118
50219
  "alpha": 0.4,
48119
- "offsetX": "0px",
48120
- "offsetY": "1px",
48121
- "blur": "1px",
48122
- "spread": "0px"
50220
+ "offsetX": {
50221
+ "value": 0,
50222
+ "unit": "px"
50223
+ },
50224
+ "offsetY": {
50225
+ "value": 1,
50226
+ "unit": "px"
50227
+ },
50228
+ "blur": {
50229
+ "value": 1,
50230
+ "unit": "px"
50231
+ },
50232
+ "spread": {
50233
+ "value": 0,
50234
+ "unit": "px"
50235
+ }
48123
50236
  },
48124
50237
  {
48125
50238
  "color": "{base.color.neutral.0}",
48126
50239
  "alpha": 0.8,
48127
- "offsetX": "0px",
48128
- "offsetY": "3px",
48129
- "blur": "6px",
48130
- "spread": "0px"
50240
+ "offsetX": {
50241
+ "value": 0,
50242
+ "unit": "px"
50243
+ },
50244
+ "offsetY": {
50245
+ "value": 3,
50246
+ "unit": "px"
50247
+ },
50248
+ "blur": {
50249
+ "value": 6,
50250
+ "unit": "px"
50251
+ },
50252
+ "spread": {
50253
+ "value": 0,
50254
+ "unit": "px"
50255
+ }
48131
50256
  }
48132
50257
  ],
48133
50258
  "$type": "shadow",
50259
+ "$description": "Medium resting shadow for cards and elevated surfaces",
48134
50260
  "$extensions": {
48135
50261
  "org.primer.figma": {
48136
50262
  "collection": "mode",
@@ -48142,24 +50268,52 @@
48142
50268
  {
48143
50269
  "color": "{base.color.neutral.0}",
48144
50270
  "alpha": 0.4,
48145
- "offsetX": "0px",
48146
- "offsetY": "1px",
48147
- "blur": "1px",
48148
- "spread": "0px"
50271
+ "offsetX": {
50272
+ "value": 0,
50273
+ "unit": "px"
50274
+ },
50275
+ "offsetY": {
50276
+ "value": 1,
50277
+ "unit": "px"
50278
+ },
50279
+ "blur": {
50280
+ "value": 1,
50281
+ "unit": "px"
50282
+ },
50283
+ "spread": {
50284
+ "value": 0,
50285
+ "unit": "px"
50286
+ }
48149
50287
  },
48150
50288
  {
48151
50289
  "color": "{base.color.neutral.0}",
48152
50290
  "alpha": 0.8,
48153
- "offsetX": "0px",
48154
- "offsetY": "3px",
48155
- "blur": "6px",
48156
- "spread": "0px"
50291
+ "offsetX": {
50292
+ "value": 0,
50293
+ "unit": "px"
50294
+ },
50295
+ "offsetY": {
50296
+ "value": 3,
50297
+ "unit": "px"
50298
+ },
50299
+ "blur": {
50300
+ "value": 6,
50301
+ "unit": "px"
50302
+ },
50303
+ "spread": {
50304
+ "value": 0,
50305
+ "unit": "px"
50306
+ }
48157
50307
  }
48158
50308
  ],
48159
50309
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48160
50310
  "isSource": true,
48161
50311
  "$type": "shadow"
48162
50312
  }
50313
+ },
50314
+ "org.primer.llm": {
50315
+ "usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
50316
+ "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."
48163
50317
  }
48164
50318
  },
48165
50319
  "key": "{shadow.resting.medium}"
@@ -48167,8 +50321,9 @@
48167
50321
  "name": "shadow-resting-medium",
48168
50322
  "attributes": {},
48169
50323
  "path": ["shadow", "resting", "medium"],
48170
- "value": "0px 1px 1px 0px #01040966, 0px 3px 6px 0px #010409cc",
48171
- "type": "shadow"
50324
+ "value": "0 1px 1px 0 #01040966, 0 3px 6px 0 #010409cc",
50325
+ "type": "shadow",
50326
+ "description": "Medium resting shadow for cards and elevated surfaces"
48172
50327
  },
48173
50328
  "shadow-resting-small": {
48174
50329
  "key": "{shadow.resting.small}",
@@ -48183,19 +50338,43 @@
48183
50338
  {
48184
50339
  "color": "#010409",
48185
50340
  "alpha": 0.6,
48186
- "offsetX": "0px",
48187
- "offsetY": "1px",
48188
- "blur": "1px",
48189
- "spread": "0px",
50341
+ "offsetX": {
50342
+ "value": 0,
50343
+ "unit": "px"
50344
+ },
50345
+ "offsetY": {
50346
+ "value": 1,
50347
+ "unit": "px"
50348
+ },
50349
+ "blur": {
50350
+ "value": 1,
50351
+ "unit": "px"
50352
+ },
50353
+ "spread": {
50354
+ "value": 0,
50355
+ "unit": "px"
50356
+ },
48190
50357
  "inset": false
48191
50358
  },
48192
50359
  {
48193
50360
  "color": "#010409",
48194
50361
  "alpha": 0.6,
48195
- "offsetX": "0px",
48196
- "offsetY": "1px",
48197
- "blur": "3px",
48198
- "spread": "0px",
50362
+ "offsetX": {
50363
+ "value": 0,
50364
+ "unit": "px"
50365
+ },
50366
+ "offsetY": {
50367
+ "value": 1,
50368
+ "unit": "px"
50369
+ },
50370
+ "blur": {
50371
+ "value": 3,
50372
+ "unit": "px"
50373
+ },
50374
+ "spread": {
50375
+ "value": 0,
50376
+ "unit": "px"
50377
+ },
48199
50378
  "inset": false
48200
50379
  }
48201
50380
  ],
@@ -48203,6 +50382,10 @@
48203
50382
  "isSource": true,
48204
50383
  "$type": "shadow"
48205
50384
  }
50385
+ },
50386
+ "org.primer.llm": {
50387
+ "usage": ["button", "interactive-card", "clickable-element"],
50388
+ "rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
48206
50389
  }
48207
50390
  },
48208
50391
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48212,23 +50395,48 @@
48212
50395
  {
48213
50396
  "color": "{base.color.neutral.0}",
48214
50397
  "alpha": 0.6,
48215
- "offsetX": "0px",
48216
- "offsetY": "1px",
48217
- "blur": "1px",
48218
- "spread": "0px",
50398
+ "offsetX": {
50399
+ "value": 0,
50400
+ "unit": "px"
50401
+ },
50402
+ "offsetY": {
50403
+ "value": 1,
50404
+ "unit": "px"
50405
+ },
50406
+ "blur": {
50407
+ "value": 1,
50408
+ "unit": "px"
50409
+ },
50410
+ "spread": {
50411
+ "value": 0,
50412
+ "unit": "px"
50413
+ },
48219
50414
  "inset": false
48220
50415
  },
48221
50416
  {
48222
50417
  "color": "{base.color.neutral.0}",
48223
50418
  "alpha": 0.6,
48224
- "offsetX": "0px",
48225
- "offsetY": "1px",
48226
- "blur": "3px",
48227
- "spread": "0px",
50419
+ "offsetX": {
50420
+ "value": 0,
50421
+ "unit": "px"
50422
+ },
50423
+ "offsetY": {
50424
+ "value": 1,
50425
+ "unit": "px"
50426
+ },
50427
+ "blur": {
50428
+ "value": 3,
50429
+ "unit": "px"
50430
+ },
50431
+ "spread": {
50432
+ "value": 0,
50433
+ "unit": "px"
50434
+ },
48228
50435
  "inset": false
48229
50436
  }
48230
50437
  ],
48231
50438
  "$type": "shadow",
50439
+ "$description": "Small resting shadow for buttons and interactive elements",
48232
50440
  "$extensions": {
48233
50441
  "org.primer.figma": {
48234
50442
  "collection": "mode",
@@ -48240,19 +50448,43 @@
48240
50448
  {
48241
50449
  "color": "{base.color.neutral.0}",
48242
50450
  "alpha": 0.6,
48243
- "offsetX": "0px",
48244
- "offsetY": "1px",
48245
- "blur": "1px",
48246
- "spread": "0px",
50451
+ "offsetX": {
50452
+ "value": 0,
50453
+ "unit": "px"
50454
+ },
50455
+ "offsetY": {
50456
+ "value": 1,
50457
+ "unit": "px"
50458
+ },
50459
+ "blur": {
50460
+ "value": 1,
50461
+ "unit": "px"
50462
+ },
50463
+ "spread": {
50464
+ "value": 0,
50465
+ "unit": "px"
50466
+ },
48247
50467
  "inset": false
48248
50468
  },
48249
50469
  {
48250
50470
  "color": "{base.color.neutral.0}",
48251
50471
  "alpha": 0.6,
48252
- "offsetX": "0px",
48253
- "offsetY": "1px",
48254
- "blur": "3px",
48255
- "spread": "0px",
50472
+ "offsetX": {
50473
+ "value": 0,
50474
+ "unit": "px"
50475
+ },
50476
+ "offsetY": {
50477
+ "value": 1,
50478
+ "unit": "px"
50479
+ },
50480
+ "blur": {
50481
+ "value": 3,
50482
+ "unit": "px"
50483
+ },
50484
+ "spread": {
50485
+ "value": 0,
50486
+ "unit": "px"
50487
+ },
48256
50488
  "inset": false
48257
50489
  }
48258
50490
  ],
@@ -48260,6 +50492,10 @@
48260
50492
  "isSource": true,
48261
50493
  "$type": "shadow"
48262
50494
  }
50495
+ },
50496
+ "org.primer.llm": {
50497
+ "usage": ["button", "interactive-card", "clickable-element"],
50498
+ "rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
48263
50499
  }
48264
50500
  },
48265
50501
  "key": "{shadow.resting.small}"
@@ -48267,8 +50503,9 @@
48267
50503
  "name": "shadow-resting-small",
48268
50504
  "attributes": {},
48269
50505
  "path": ["shadow", "resting", "small"],
48270
- "value": "0px 1px 1px 0px #01040999, 0px 1px 3px 0px #01040999",
48271
- "type": "shadow"
50506
+ "value": "0 1px 1px 0 #01040999, 0 1px 3px 0 #01040999",
50507
+ "type": "shadow",
50508
+ "description": "Small resting shadow for buttons and interactive elements"
48272
50509
  },
48273
50510
  "shadow-resting-xsmall": {
48274
50511
  "key": "{shadow.resting.xsmall}",
@@ -48282,16 +50519,32 @@
48282
50519
  "$value": {
48283
50520
  "color": "#010409",
48284
50521
  "alpha": 0.8,
48285
- "offsetX": "0px",
48286
- "offsetY": "1px",
48287
- "blur": "1px",
48288
- "spread": "0px",
50522
+ "offsetX": {
50523
+ "value": 0,
50524
+ "unit": "px"
50525
+ },
50526
+ "offsetY": {
50527
+ "value": 1,
50528
+ "unit": "px"
50529
+ },
50530
+ "blur": {
50531
+ "value": 1,
50532
+ "unit": "px"
50533
+ },
50534
+ "spread": {
50535
+ "value": 0,
50536
+ "unit": "px"
50537
+ },
48289
50538
  "inset": false
48290
50539
  },
48291
50540
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48292
50541
  "isSource": true,
48293
50542
  "$type": "shadow"
48294
50543
  }
50544
+ },
50545
+ "org.primer.llm": {
50546
+ "usage": ["badge", "chip", "small-card", "subtle-elevation"],
50547
+ "rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
48295
50548
  }
48296
50549
  },
48297
50550
  "filePath": "src/tokens/functional/shadow/shadow.json5",
@@ -48300,13 +50553,26 @@
48300
50553
  "$value": {
48301
50554
  "color": "{base.color.neutral.0}",
48302
50555
  "alpha": 0.8,
48303
- "offsetX": "0px",
48304
- "offsetY": "1px",
48305
- "blur": "1px",
48306
- "spread": "0px",
50556
+ "offsetX": {
50557
+ "value": 0,
50558
+ "unit": "px"
50559
+ },
50560
+ "offsetY": {
50561
+ "value": 1,
50562
+ "unit": "px"
50563
+ },
50564
+ "blur": {
50565
+ "value": 1,
50566
+ "unit": "px"
50567
+ },
50568
+ "spread": {
50569
+ "value": 0,
50570
+ "unit": "px"
50571
+ },
48307
50572
  "inset": false
48308
50573
  },
48309
50574
  "$type": "shadow",
50575
+ "$description": "Extra small resting shadow for minimal elevation",
48310
50576
  "$extensions": {
48311
50577
  "org.primer.figma": {
48312
50578
  "collection": "mode",
@@ -48317,16 +50583,32 @@
48317
50583
  "$value": {
48318
50584
  "color": "{base.color.neutral.0}",
48319
50585
  "alpha": 0.8,
48320
- "offsetX": "0px",
48321
- "offsetY": "1px",
48322
- "blur": "1px",
48323
- "spread": "0px",
50586
+ "offsetX": {
50587
+ "value": 0,
50588
+ "unit": "px"
50589
+ },
50590
+ "offsetY": {
50591
+ "value": 1,
50592
+ "unit": "px"
50593
+ },
50594
+ "blur": {
50595
+ "value": 1,
50596
+ "unit": "px"
50597
+ },
50598
+ "spread": {
50599
+ "value": 0,
50600
+ "unit": "px"
50601
+ },
48324
50602
  "inset": false
48325
50603
  },
48326
50604
  "filePath": "src/tokens/functional/shadow/shadow.json5",
48327
50605
  "isSource": true,
48328
50606
  "$type": "shadow"
48329
50607
  }
50608
+ },
50609
+ "org.primer.llm": {
50610
+ "usage": ["badge", "chip", "small-card", "subtle-elevation"],
50611
+ "rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
48330
50612
  }
48331
50613
  },
48332
50614
  "key": "{shadow.resting.xsmall}"
@@ -48334,8 +50616,9 @@
48334
50616
  "name": "shadow-resting-xsmall",
48335
50617
  "attributes": {},
48336
50618
  "path": ["shadow", "resting", "xsmall"],
48337
- "value": "0px 1px 1px 0px #010409cc",
48338
- "type": "shadow"
50619
+ "value": "0 1px 1px 0 #010409cc",
50620
+ "type": "shadow",
50621
+ "description": "Extra small resting shadow for minimal elevation"
48339
50622
  },
48340
50623
  "sideNav-bgColor-selected": {
48341
50624
  "key": "{sideNav.bgColor.selected}",