@primer/primitives 8.2.4-rc.a3f65a09 → 8.2.4-rc.acc4193a

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 (32) hide show
  1. package/README.md +17 -18
  2. package/dist/css/functional/size/border.css +1 -0
  3. package/dist/css/functional/themes/dark-high-contrast.css +170 -170
  4. package/dist/css/functional/themes/light-high-contrast.css +114 -114
  5. package/dist/css/primitives.css +1 -0
  6. package/dist/docs/functional/size/border.json +31 -0
  7. package/dist/docs/functional/themes/dark-high-contrast.json +216 -216
  8. package/dist/docs/functional/themes/light-high-contrast.json +171 -171
  9. package/dist/fallbacks/functional/size/border.json +1 -0
  10. package/dist/figma/dimension/dimension.json +14 -0
  11. package/dist/figma/themes/dark-high-contrast.json +297 -297
  12. package/dist/figma/themes/light-high-contrast.json +218 -218
  13. package/dist/internalCss/dark-high-contrast.css +170 -170
  14. package/dist/internalCss/light-high-contrast.css +114 -114
  15. package/dist/styleLint/functional/size/border.json +31 -0
  16. package/dist/styleLint/functional/themes/dark-high-contrast.json +216 -216
  17. package/dist/styleLint/functional/themes/light-high-contrast.json +171 -171
  18. package/package.json +28 -28
  19. package/src/formats/cssAdvanced.ts +3 -3
  20. package/src/formats/cssCustomMedia.ts +2 -2
  21. package/src/formats/javascriptCommonJs.ts +2 -2
  22. package/src/formats/javascriptEsm.ts +2 -2
  23. package/src/formats/jsonFigma.ts +2 -2
  24. package/src/formats/jsonNestedPrefixed.ts +2 -2
  25. package/src/formats/jsonOneDimensional.ts +2 -2
  26. package/src/formats/jsonPostCssFallback.ts +2 -2
  27. package/src/formats/typescriptExportDefinition.ts +2 -2
  28. package/src/schemas/designToken.ts +1 -1
  29. package/src/schemas/validTokenType.ts +1 -1
  30. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +383 -2
  31. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +344 -0
  32. package/src/tokens/functional/size/border.json +13 -0
package/dist/internalCss/light-high-contrast.css CHANGED
@@ -348,100 +348,100 @@
348
348
  --data-gray-color: #808fa3;
349
349
  --data-gray-color-muted: #e8ecf2;
350
350
  --display-blue-bgColor-muted: #d1f0ff;
351
- --display-blue-bgColor-emphasis: #006edb;
352
- --display-blue-fgColor: #005fcc;
351
+ --display-blue-bgColor-emphasis: #004db3;
352
+ --display-blue-fgColor: #003d99;
353
353
  --display-blue-borderColor-muted: #ade1ff;
354
- --display-blue-borderColor-emphasis: #006edb;
354
+ --display-blue-borderColor-emphasis: #005fcc;
355
355
  --display-green-bgColor-muted: #caf7ca;
356
- --display-green-bgColor-emphasis: #2c8141;
357
- --display-green-fgColor: #2b6e3f;
356
+ --display-green-bgColor-emphasis: #285c3b;
357
+ --display-green-fgColor: #254b34;
358
358
  --display-green-borderColor-muted: #9ceda0;
359
- --display-green-borderColor-emphasis: #2c8141;
359
+ --display-green-borderColor-emphasis: #2b6e3f;
360
360
  --display-orange-bgColor-muted: #ffe7d1;
361
- --display-orange-bgColor-emphasis: #b8500f;
362
- --display-orange-fgColor: #a24610;
361
+ --display-orange-bgColor-emphasis: #8d3c11;
362
+ --display-orange-fgColor: #70300f;
363
363
  --display-orange-borderColor-muted: #fecfaa;
364
- --display-orange-borderColor-emphasis: #b8500f;
364
+ --display-orange-borderColor-emphasis: #a24610;
365
365
  --display-purple-bgColor-muted: #f1e5ff;
366
- --display-purple-bgColor-emphasis: #894ceb;
367
- --display-purple-fgColor: #783ae4;
366
+ --display-purple-bgColor-emphasis: #6223d7;
367
+ --display-purple-fgColor: #4f21ab;
368
368
  --display-purple-borderColor-muted: #e6d2fe;
369
- --display-purple-borderColor-emphasis: #894ceb;
369
+ --display-purple-borderColor-emphasis: #783ae4;
370
370
  --display-plum-bgColor-muted: #f8e5ff;
371
- --display-plum-bgColor-emphasis: #a830e8;
372
- --display-plum-fgColor: #961edc;
371
+ --display-plum-bgColor-emphasis: #7d1eb8;
372
+ --display-plum-fgColor: #651d96;
373
373
  --display-plum-borderColor-muted: #f0cdfe;
374
- --display-plum-borderColor-emphasis: #a830e8;
374
+ --display-plum-borderColor-emphasis: #961edc;
375
375
  --display-red-bgColor-muted: #ffe2e0;
376
- --display-red-bgColor-emphasis: #df0c24;
377
- --display-red-fgColor: #c50d28;
376
+ --display-red-bgColor-emphasis: #a60c29;
377
+ --display-red-fgColor: #880c27;
378
378
  --display-red-borderColor-muted: #fecdcd;
379
- --display-red-borderColor-emphasis: #df0c24;
379
+ --display-red-borderColor-emphasis: #c50d28;
380
380
  --display-coral-bgColor-muted: #ffe5db;
381
- --display-coral-bgColor-emphasis: #d43511;
382
- --display-coral-fgColor: #ba2e12;
381
+ --display-coral-bgColor-emphasis: #9b2712;
382
+ --display-coral-fgColor: #7e2011;
383
383
  --display-coral-borderColor-muted: #fecebe;
384
- --display-coral-borderColor-emphasis: #d43511;
384
+ --display-coral-borderColor-emphasis: #ba2e12;
385
385
  --display-yellow-bgColor-muted: #ffec9e;
386
- --display-yellow-bgColor-emphasis: #946a00;
387
- --display-yellow-fgColor: #805900;
386
+ --display-yellow-bgColor-emphasis: #704d00;
387
+ --display-yellow-fgColor: #5c3d00;
388
388
  --display-yellow-borderColor-muted: #ffd642;
389
- --display-yellow-borderColor-emphasis: #946a00;
389
+ --display-yellow-borderColor-emphasis: #805900;
390
390
  --display-gray-bgColor-muted: #e8ecf2;
391
- --display-gray-bgColor-emphasis: #647182;
392
- --display-gray-fgColor: #5c6570;
391
+ --display-gray-bgColor-emphasis: #4e535a;
392
+ --display-gray-fgColor: #424448;
393
393
  --display-gray-borderColor-muted: #d2dae4;
394
- --display-gray-borderColor-emphasis: #647182;
394
+ --display-gray-borderColor-emphasis: #5c6570;
395
395
  --display-auburn-bgColor-muted: #f2e9e9;
396
- --display-auburn-bgColor-emphasis: #9d615c;
397
- --display-auburn-fgColor: #8a5551;
396
+ --display-auburn-bgColor-emphasis: #744744;
397
+ --display-auburn-fgColor: #5d3937;
398
398
  --display-auburn-borderColor-muted: #e6d6d5;
399
- --display-auburn-borderColor-emphasis: #9d615c;
399
+ --display-auburn-borderColor-emphasis: #8a5551;
400
400
  --display-brown-bgColor-muted: #eeeae2;
401
- --display-brown-bgColor-emphasis: #856d4c;
402
- --display-brown-fgColor: #755f43;
401
+ --display-brown-bgColor-emphasis: #64513a;
402
+ --display-brown-fgColor: #51412f;
403
403
  --display-brown-borderColor-muted: #dfd7c8;
404
- --display-brown-borderColor-emphasis: #856d4c;
404
+ --display-brown-borderColor-emphasis: #755f43;
405
405
  --display-lemon-bgColor-muted: #f7eea1;
406
- --display-lemon-bgColor-emphasis: #866e04;
407
- --display-lemon-fgColor: #786002;
406
+ --display-lemon-bgColor-emphasis: #654f01;
407
+ --display-lemon-fgColor: #523f00;
408
408
  --display-lemon-borderColor-muted: #f0db3d;
409
- --display-lemon-borderColor-emphasis: #866e04;
409
+ --display-lemon-borderColor-emphasis: #786002;
410
410
  --display-olive-bgColor-muted: #f0f0ad;
411
- --display-olive-bgColor-emphasis: #64762d;
412
- --display-olive-fgColor: #56682c;
411
+ --display-olive-bgColor-emphasis: #495a2b;
412
+ --display-olive-fgColor: #3b4927;
413
413
  --display-olive-borderColor-muted: #dbe170;
414
- --display-olive-borderColor-emphasis: #64762d;
414
+ --display-olive-borderColor-emphasis: #56682c;
415
415
  --display-lime-bgColor-muted: #e3f2b5;
416
- --display-lime-bgColor-emphasis: #527a29;
417
- --display-lime-fgColor: #476c28;
416
+ --display-lime-bgColor-emphasis: #3a5b25;
417
+ --display-lime-fgColor: #2f4a21;
418
418
  --display-lime-borderColor-muted: #c7e580;
419
- --display-lime-borderColor-emphasis: #527a29;
419
+ --display-lime-borderColor-emphasis: #476c28;
420
420
  --display-pine-bgColor-muted: #bff8db;
421
- --display-pine-bgColor-emphasis: #167e53;
422
- --display-pine-fgColor: #156f4b;
421
+ --display-pine-bgColor-emphasis: #135d41;
422
+ --display-pine-fgColor: #114b36;
423
423
  --display-pine-borderColor-muted: #80efb9;
424
- --display-pine-borderColor-emphasis: #167e53;
424
+ --display-pine-borderColor-emphasis: #156f4b;
425
425
  --display-teal-bgColor-muted: #c7f5ef;
426
- --display-teal-bgColor-emphasis: #127e81;
427
- --display-teal-fgColor: #106e75;
426
+ --display-teal-bgColor-emphasis: #0d5b63;
427
+ --display-teal-fgColor: #0a4852;
428
428
  --display-teal-borderColor-muted: #89ebe1;
429
- --display-teal-borderColor-emphasis: #127e81;
429
+ --display-teal-borderColor-emphasis: #106e75;
430
430
  --display-cyan-bgColor-muted: #bdf4ff;
431
- --display-cyan-bgColor-emphasis: #007b94;
432
- --display-cyan-fgColor: #006a80;
431
+ --display-cyan-bgColor-emphasis: #00596b;
432
+ --display-cyan-fgColor: #004857;
433
433
  --display-cyan-borderColor-muted: #7ae9ff;
434
- --display-cyan-borderColor-emphasis: #007b94;
434
+ --display-cyan-borderColor-emphasis: #006a80;
435
435
  --display-indigo-bgColor-muted: #e5e9ff;
436
- --display-indigo-bgColor-emphasis: #5a61e7;
437
- --display-indigo-fgColor: #494edf;
436
+ --display-indigo-bgColor-emphasis: #393cd5;
437
+ --display-indigo-fgColor: #2d2db4;
438
438
  --display-indigo-borderColor-muted: #d2d7fe;
439
- --display-indigo-borderColor-emphasis: #5a61e7;
439
+ --display-indigo-borderColor-emphasis: #494edf;
440
440
  --display-pink-bgColor-muted: #ffe5f1;
441
- --display-pink-bgColor-emphasis: #ce2c85;
442
- --display-pink-fgColor: #b12f79;
441
+ --display-pink-bgColor-emphasis: #8e2e66;
442
+ --display-pink-fgColor: #6e2b53;
443
443
  --display-pink-borderColor-muted: #fdc9e2;
444
- --display-pink-borderColor-emphasis: #ce2c85;
444
+ --display-pink-borderColor-emphasis: #b12f79;
445
445
  --avatar-bgColor: #ffffff;
446
446
  --avatar-borderColor: #010409e6;
447
447
  --avatar-shadow: 0px 0px 0px 2px #ffffffcc;
@@ -1197,100 +1197,100 @@
1197
1197
  --data-gray-color: #808fa3;
1198
1198
  --data-gray-color-muted: #e8ecf2;
1199
1199
  --display-blue-bgColor-muted: #d1f0ff;
1200
- --display-blue-bgColor-emphasis: #006edb;
1201
- --display-blue-fgColor: #005fcc;
1200
+ --display-blue-bgColor-emphasis: #004db3;
1201
+ --display-blue-fgColor: #003d99;
1202
1202
  --display-blue-borderColor-muted: #ade1ff;
1203
- --display-blue-borderColor-emphasis: #006edb;
1203
+ --display-blue-borderColor-emphasis: #005fcc;
1204
1204
  --display-green-bgColor-muted: #caf7ca;
1205
- --display-green-bgColor-emphasis: #2c8141;
1206
- --display-green-fgColor: #2b6e3f;
1205
+ --display-green-bgColor-emphasis: #285c3b;
1206
+ --display-green-fgColor: #254b34;
1207
1207
  --display-green-borderColor-muted: #9ceda0;
1208
- --display-green-borderColor-emphasis: #2c8141;
1208
+ --display-green-borderColor-emphasis: #2b6e3f;
1209
1209
  --display-orange-bgColor-muted: #ffe7d1;
1210
- --display-orange-bgColor-emphasis: #b8500f;
1211
- --display-orange-fgColor: #a24610;
1210
+ --display-orange-bgColor-emphasis: #8d3c11;
1211
+ --display-orange-fgColor: #70300f;
1212
1212
  --display-orange-borderColor-muted: #fecfaa;
1213
- --display-orange-borderColor-emphasis: #b8500f;
1213
+ --display-orange-borderColor-emphasis: #a24610;
1214
1214
  --display-purple-bgColor-muted: #f1e5ff;
1215
- --display-purple-bgColor-emphasis: #894ceb;
1216
- --display-purple-fgColor: #783ae4;
1215
+ --display-purple-bgColor-emphasis: #6223d7;
1216
+ --display-purple-fgColor: #4f21ab;
1217
1217
  --display-purple-borderColor-muted: #e6d2fe;
1218
- --display-purple-borderColor-emphasis: #894ceb;
1218
+ --display-purple-borderColor-emphasis: #783ae4;
1219
1219
  --display-plum-bgColor-muted: #f8e5ff;
1220
- --display-plum-bgColor-emphasis: #a830e8;
1221
- --display-plum-fgColor: #961edc;
1220
+ --display-plum-bgColor-emphasis: #7d1eb8;
1221
+ --display-plum-fgColor: #651d96;
1222
1222
  --display-plum-borderColor-muted: #f0cdfe;
1223
- --display-plum-borderColor-emphasis: #a830e8;
1223
+ --display-plum-borderColor-emphasis: #961edc;
1224
1224
  --display-red-bgColor-muted: #ffe2e0;
1225
- --display-red-bgColor-emphasis: #df0c24;
1226
- --display-red-fgColor: #c50d28;
1225
+ --display-red-bgColor-emphasis: #a60c29;
1226
+ --display-red-fgColor: #880c27;
1227
1227
  --display-red-borderColor-muted: #fecdcd;
1228
- --display-red-borderColor-emphasis: #df0c24;
1228
+ --display-red-borderColor-emphasis: #c50d28;
1229
1229
  --display-coral-bgColor-muted: #ffe5db;
1230
- --display-coral-bgColor-emphasis: #d43511;
1231
- --display-coral-fgColor: #ba2e12;
1230
+ --display-coral-bgColor-emphasis: #9b2712;
1231
+ --display-coral-fgColor: #7e2011;
1232
1232
  --display-coral-borderColor-muted: #fecebe;
1233
- --display-coral-borderColor-emphasis: #d43511;
1233
+ --display-coral-borderColor-emphasis: #ba2e12;
1234
1234
  --display-yellow-bgColor-muted: #ffec9e;
1235
- --display-yellow-bgColor-emphasis: #946a00;
1236
- --display-yellow-fgColor: #805900;
1235
+ --display-yellow-bgColor-emphasis: #704d00;
1236
+ --display-yellow-fgColor: #5c3d00;
1237
1237
  --display-yellow-borderColor-muted: #ffd642;
1238
- --display-yellow-borderColor-emphasis: #946a00;
1238
+ --display-yellow-borderColor-emphasis: #805900;
1239
1239
  --display-gray-bgColor-muted: #e8ecf2;
1240
- --display-gray-bgColor-emphasis: #647182;
1241
- --display-gray-fgColor: #5c6570;
1240
+ --display-gray-bgColor-emphasis: #4e535a;
1241
+ --display-gray-fgColor: #424448;
1242
1242
  --display-gray-borderColor-muted: #d2dae4;
1243
- --display-gray-borderColor-emphasis: #647182;
1243
+ --display-gray-borderColor-emphasis: #5c6570;
1244
1244
  --display-auburn-bgColor-muted: #f2e9e9;
1245
- --display-auburn-bgColor-emphasis: #9d615c;
1246
- --display-auburn-fgColor: #8a5551;
1245
+ --display-auburn-bgColor-emphasis: #744744;
1246
+ --display-auburn-fgColor: #5d3937;
1247
1247
  --display-auburn-borderColor-muted: #e6d6d5;
1248
- --display-auburn-borderColor-emphasis: #9d615c;
1248
+ --display-auburn-borderColor-emphasis: #8a5551;
1249
1249
  --display-brown-bgColor-muted: #eeeae2;
1250
- --display-brown-bgColor-emphasis: #856d4c;
1251
- --display-brown-fgColor: #755f43;
1250
+ --display-brown-bgColor-emphasis: #64513a;
1251
+ --display-brown-fgColor: #51412f;
1252
1252
  --display-brown-borderColor-muted: #dfd7c8;
1253
- --display-brown-borderColor-emphasis: #856d4c;
1253
+ --display-brown-borderColor-emphasis: #755f43;
1254
1254
  --display-lemon-bgColor-muted: #f7eea1;
1255
- --display-lemon-bgColor-emphasis: #866e04;
1256
- --display-lemon-fgColor: #786002;
1255
+ --display-lemon-bgColor-emphasis: #654f01;
1256
+ --display-lemon-fgColor: #523f00;
1257
1257
  --display-lemon-borderColor-muted: #f0db3d;
1258
- --display-lemon-borderColor-emphasis: #866e04;
1258
+ --display-lemon-borderColor-emphasis: #786002;
1259
1259
  --display-olive-bgColor-muted: #f0f0ad;
1260
- --display-olive-bgColor-emphasis: #64762d;
1261
- --display-olive-fgColor: #56682c;
1260
+ --display-olive-bgColor-emphasis: #495a2b;
1261
+ --display-olive-fgColor: #3b4927;
1262
1262
  --display-olive-borderColor-muted: #dbe170;
1263
- --display-olive-borderColor-emphasis: #64762d;
1263
+ --display-olive-borderColor-emphasis: #56682c;
1264
1264
  --display-lime-bgColor-muted: #e3f2b5;
1265
- --display-lime-bgColor-emphasis: #527a29;
1266
- --display-lime-fgColor: #476c28;
1265
+ --display-lime-bgColor-emphasis: #3a5b25;
1266
+ --display-lime-fgColor: #2f4a21;
1267
1267
  --display-lime-borderColor-muted: #c7e580;
1268
- --display-lime-borderColor-emphasis: #527a29;
1268
+ --display-lime-borderColor-emphasis: #476c28;
1269
1269
  --display-pine-bgColor-muted: #bff8db;
1270
- --display-pine-bgColor-emphasis: #167e53;
1271
- --display-pine-fgColor: #156f4b;
1270
+ --display-pine-bgColor-emphasis: #135d41;
1271
+ --display-pine-fgColor: #114b36;
1272
1272
  --display-pine-borderColor-muted: #80efb9;
1273
- --display-pine-borderColor-emphasis: #167e53;
1273
+ --display-pine-borderColor-emphasis: #156f4b;
1274
1274
  --display-teal-bgColor-muted: #c7f5ef;
1275
- --display-teal-bgColor-emphasis: #127e81;
1276
- --display-teal-fgColor: #106e75;
1275
+ --display-teal-bgColor-emphasis: #0d5b63;
1276
+ --display-teal-fgColor: #0a4852;
1277
1277
  --display-teal-borderColor-muted: #89ebe1;
1278
- --display-teal-borderColor-emphasis: #127e81;
1278
+ --display-teal-borderColor-emphasis: #106e75;
1279
1279
  --display-cyan-bgColor-muted: #bdf4ff;
1280
- --display-cyan-bgColor-emphasis: #007b94;
1281
- --display-cyan-fgColor: #006a80;
1280
+ --display-cyan-bgColor-emphasis: #00596b;
1281
+ --display-cyan-fgColor: #004857;
1282
1282
  --display-cyan-borderColor-muted: #7ae9ff;
1283
- --display-cyan-borderColor-emphasis: #007b94;
1283
+ --display-cyan-borderColor-emphasis: #006a80;
1284
1284
  --display-indigo-bgColor-muted: #e5e9ff;
1285
- --display-indigo-bgColor-emphasis: #5a61e7;
1286
- --display-indigo-fgColor: #494edf;
1285
+ --display-indigo-bgColor-emphasis: #393cd5;
1286
+ --display-indigo-fgColor: #2d2db4;
1287
1287
  --display-indigo-borderColor-muted: #d2d7fe;
1288
- --display-indigo-borderColor-emphasis: #5a61e7;
1288
+ --display-indigo-borderColor-emphasis: #494edf;
1289
1289
  --display-pink-bgColor-muted: #ffe5f1;
1290
- --display-pink-bgColor-emphasis: #ce2c85;
1291
- --display-pink-fgColor: #b12f79;
1290
+ --display-pink-bgColor-emphasis: #8e2e66;
1291
+ --display-pink-fgColor: #6e2b53;
1292
1292
  --display-pink-borderColor-muted: #fdc9e2;
1293
- --display-pink-borderColor-emphasis: #ce2c85;
1293
+ --display-pink-borderColor-emphasis: #b12f79;
1294
1294
  --avatar-bgColor: #ffffff;
1295
1295
  --avatar-borderColor: #010409e6;
1296
1296
  --avatar-shadow: 0px 0px 0px 2px #ffffffcc;
package/dist/styleLint/functional/size/border.json CHANGED
@@ -205,6 +205,37 @@
205
205
  "attributes": {},
206
206
  "path": ["borderRadius", "full"]
207
207
  },
208
+ "borderRadius-default": {
209
+ "value": ["0.0234375rem", "0.375px"],
210
+ "$type": "dimension",
211
+ "$extensions": {
212
+ "org.primer.figma": {
213
+ "collection": "functional/size",
214
+ "scopes": ["radius"],
215
+ "codeSyntax": {
216
+ "web": "var(--borderRadius-default) /* utility class: .rounded-2 */"
217
+ }
218
+ }
219
+ },
220
+ "filePath": "src/tokens/functional/size/border.json",
221
+ "isSource": true,
222
+ "original": {
223
+ "value": "{borderRadius.medium}",
224
+ "$type": "dimension",
225
+ "$extensions": {
226
+ "org.primer.figma": {
227
+ "collection": "functional/size",
228
+ "scopes": ["radius"],
229
+ "codeSyntax": {
230
+ "web": "var(--borderRadius-default) /* utility class: .rounded-2 */"
231
+ }
232
+ }
233
+ }
234
+ },
235
+ "name": "borderRadius-default",
236
+ "attributes": {},
237
+ "path": ["borderRadius", "default"]
238
+ },
208
239
  "outline-focus-offset": {
209
240
  "value": ["-0.125rem", "-2px"],
210
241
  "$type": "dimension",