@primer/primitives 10.3.0-rc.b425078b → 10.3.0

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 (56) hide show
  1. package/dist/build/transformers/colorToHex.js +3 -3
  2. package/dist/build/transformers/colorToRgbAlpha.js +2 -2
  3. package/dist/build/transformers/shadowToCss.js +2 -2
  4. package/dist/build/transformers/utilities/alpha.d.ts +2 -2
  5. package/dist/build/transformers/utilities/alpha.js +3 -3
  6. package/dist/build/utilities/log.d.ts +6 -0
  7. package/dist/build/utilities/log.js +34 -0
  8. package/dist/docs/functional/themes/dark-colorblind.json +174 -12
  9. package/dist/docs/functional/themes/dark-dimmed.json +212 -12
  10. package/dist/docs/functional/themes/dark-high-contrast.json +213 -13
  11. package/dist/docs/functional/themes/dark-tritanopia.json +174 -12
  12. package/dist/docs/functional/themes/dark.json +174 -12
  13. package/dist/docs/functional/themes/light-colorblind.json +170 -10
  14. package/dist/docs/functional/themes/light-high-contrast.json +211 -11
  15. package/dist/docs/functional/themes/light-tritanopia.json +170 -10
  16. package/dist/docs/functional/themes/light.json +170 -10
  17. package/dist/figma/themes/dark-colorblind.json +165 -164
  18. package/dist/figma/themes/dark-dimmed.json +165 -115
  19. package/dist/figma/themes/dark-high-contrast.json +165 -114
  20. package/dist/figma/themes/dark-tritanopia.json +165 -164
  21. package/dist/figma/themes/dark.json +165 -164
  22. package/dist/figma/themes/light-colorblind.json +164 -164
  23. package/dist/figma/themes/light-high-contrast.json +151 -100
  24. package/dist/figma/themes/light-tritanopia.json +164 -164
  25. package/dist/figma/themes/light.json +164 -164
  26. package/dist/styleLint/functional/themes/dark-colorblind.json +174 -12
  27. package/dist/styleLint/functional/themes/dark-dimmed.json +212 -12
  28. package/dist/styleLint/functional/themes/dark-high-contrast.json +213 -13
  29. package/dist/styleLint/functional/themes/dark-tritanopia.json +174 -12
  30. package/dist/styleLint/functional/themes/dark.json +174 -12
  31. package/dist/styleLint/functional/themes/light-colorblind.json +170 -10
  32. package/dist/styleLint/functional/themes/light-high-contrast.json +211 -11
  33. package/dist/styleLint/functional/themes/light-tritanopia.json +170 -10
  34. package/dist/styleLint/functional/themes/light.json +170 -10
  35. package/package.json +1 -1
  36. package/src/tokens/component/header.json5 +65 -0
  37. package/src/tokens/component/headerSerach.json5 +32 -0
  38. package/src/tokens/component/overlay.json5 +68 -0
  39. package/src/tokens/component/skeletonLoader.json5 +29 -0
  40. package/src/tokens/functional/color/dark/app-dark.json5 +0 -81
  41. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -18
  42. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -21
  43. package/src/tokens/functional/color/dark/patterns-dark.json5 +0 -127
  44. package/src/tokens/functional/color/light/app-light.json5 +0 -75
  45. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -21
  46. package/src/tokens/functional/color/light/patterns-light.json5 +0 -127
  47. package/dist/figma/figma.json +0 -133
  48. package/dist/figma/shadows/dark-colorblind.json +0 -1152
  49. package/dist/figma/shadows/dark-dimmed.json +0 -1152
  50. package/dist/figma/shadows/dark-high-contrast.json +0 -1152
  51. package/dist/figma/shadows/dark-tritanopia.json +0 -1152
  52. package/dist/figma/shadows/dark.json +0 -1152
  53. package/dist/figma/shadows/light-colorblind.json +0 -1052
  54. package/dist/figma/shadows/light-high-contrast.json +0 -1052
  55. package/dist/figma/shadows/light-tritanopia.json +0 -1052
  56. package/dist/figma/shadows/light.json +0 -1052
package/dist/figma/themes/light.json CHANGED
@@ -303,103 +303,6 @@
303
303
  "group": "component",
304
304
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
305
305
  },
306
- {
307
- "name": "header/fgColor/default",
308
- "value": {
309
- "r": 1,
310
- "g": 1,
311
- "b": 1,
312
- "a": 0.7
313
- },
314
- "type": "COLOR",
315
- "alpha": 0.7,
316
- "refId": "mode/header/fgColor/default",
317
- "reference": "base/color/light/base/color/neutral/0",
318
- "collection": "mode",
319
- "mode": "light",
320
- "group": "component (internal)",
321
- "scopes": ["TEXT_FILL", "SHAPE_FILL"]
322
- },
323
- {
324
- "name": "header/fgColor/logo",
325
- "value": {
326
- "r": 1,
327
- "g": 1,
328
- "b": 1,
329
- "a": 1
330
- },
331
- "type": "COLOR",
332
- "refId": "mode/header/fgColor/logo",
333
- "reference": "base/color/light/base/color/neutral/0",
334
- "collection": "mode",
335
- "mode": "light",
336
- "group": "component (internal)",
337
- "scopes": ["TEXT_FILL", "SHAPE_FILL"]
338
- },
339
- {
340
- "name": "header/bgColor",
341
- "value": {
342
- "r": 0.1450980392156863,
343
- "g": 0.1607843137254902,
344
- "b": 0.1803921568627451,
345
- "a": 1
346
- },
347
- "type": "COLOR",
348
- "refId": "mode/header/bgColor",
349
- "reference": "base/color/light/base/color/neutral/12",
350
- "collection": "mode",
351
- "mode": "light",
352
- "group": "component (internal)",
353
- "scopes": ["FRAME_FILL", "SHAPE_FILL"]
354
- },
355
- {
356
- "name": "header/borderColor/divider",
357
- "value": {
358
- "r": 0.5058823529411764,
359
- "g": 0.5450980392156862,
360
- "b": 0.596078431372549,
361
- "a": 1
362
- },
363
- "type": "COLOR",
364
- "refId": "mode/header/borderColor/divider",
365
- "reference": "base/color/light/base/color/neutral/8",
366
- "collection": "mode",
367
- "mode": "light",
368
- "group": "component (internal)",
369
- "scopes": ["STROKE_COLOR"]
370
- },
371
- {
372
- "name": "headerSearch/bgColor",
373
- "value": {
374
- "r": 0.1450980392156863,
375
- "g": 0.1607843137254902,
376
- "b": 0.1803921568627451,
377
- "a": 1
378
- },
379
- "type": "COLOR",
380
- "refId": "mode/headerSearch/bgColor",
381
- "reference": "base/color/light/base/color/neutral/12",
382
- "collection": "mode",
383
- "mode": "light",
384
- "group": "component (internal)",
385
- "scopes": ["FRAME_FILL", "SHAPE_FILL"]
386
- },
387
- {
388
- "name": "headerSearch/borderColor",
389
- "value": {
390
- "r": 0.5058823529411764,
391
- "g": 0.5450980392156862,
392
- "b": 0.596078431372549,
393
- "a": 1
394
- },
395
- "type": "COLOR",
396
- "refId": "mode/headerSearch/borderColor",
397
- "reference": "base/color/light/base/color/neutral/8",
398
- "collection": "mode",
399
- "mode": "light",
400
- "group": "component (internal)",
401
- "scopes": ["STROKE_COLOR"]
402
- },
403
306
  {
404
307
  "name": "data/blue/color/emphasis",
405
308
  "value": {
@@ -4676,56 +4579,6 @@
4676
4579
  "group": "component (internal)",
4677
4580
  "scopes": ["FRAME_FILL", "SHAPE_FILL"]
4678
4581
  },
4679
- {
4680
- "name": "overlay/bgColor",
4681
- "value": {
4682
- "r": 1,
4683
- "g": 1,
4684
- "b": 1,
4685
- "a": 1
4686
- },
4687
- "type": "COLOR",
4688
- "refId": "mode/overlay/bgColor",
4689
- "reference": "base/color/light/base/color/neutral/0",
4690
- "collection": "mode",
4691
- "mode": "light",
4692
- "group": "component (internal)",
4693
- "scopes": ["FRAME_FILL", "SHAPE_FILL"]
4694
- },
4695
- {
4696
- "name": "overlay/borderColor",
4697
- "value": {
4698
- "r": 0.8196078431372549,
4699
- "g": 0.8509803921568627,
4700
- "b": 0.8784313725490196,
4701
- "a": 0.5
4702
- },
4703
- "type": "COLOR",
4704
- "alpha": 0.5,
4705
- "refId": "mode/overlay/borderColor",
4706
- "reference": "mode/borderColor/muted",
4707
- "collection": "mode",
4708
- "mode": "light",
4709
- "group": "component (internal)",
4710
- "scopes": ["ALL_SCOPES"]
4711
- },
4712
- {
4713
- "name": "overlay/backdrop/bgColor",
4714
- "value": {
4715
- "r": 0.7843137254901961,
4716
- "g": 0.8196078431372549,
4717
- "b": 0.8549019607843137,
4718
- "a": 0.4
4719
- },
4720
- "type": "COLOR",
4721
- "alpha": 0.4,
4722
- "refId": "mode/overlay/backdrop/bgColor",
4723
- "reference": "base/color/light/base/color/neutral/7",
4724
- "collection": "mode",
4725
- "mode": "light",
4726
- "group": "component (internal)",
4727
- "scopes": ["FRAME_FILL", "SHAPE_FILL"]
4728
- },
4729
4582
  {
4730
4583
  "name": "selectMenu/borderColor",
4731
4584
  "value": {
@@ -4774,23 +4627,6 @@
4774
4627
  "group": "component (internal)",
4775
4628
  "scopes": ["FRAME_FILL", "SHAPE_FILL"]
4776
4629
  },
4777
- {
4778
- "name": "skeletonLoader/bgColor",
4779
- "value": {
4780
- "r": 0.5058823529411764,
4781
- "g": 0.5450980392156862,
4782
- "b": 0.596078431372549,
4783
- "a": 0.1
4784
- },
4785
- "type": "COLOR",
4786
- "alpha": 0.1,
4787
- "refId": "mode/skeletonLoader/bgColor",
4788
- "reference": "base/color/light/base/color/neutral/8",
4789
- "collection": "mode",
4790
- "mode": "light",
4791
- "group": "component",
4792
- "scopes": ["FRAME_FILL", "SHAPE_FILL"]
4793
- },
4794
4630
  {
4795
4631
  "name": "treeViewItem/leadingVisual/iconColor/rest",
4796
4632
  "value": {
@@ -10073,6 +9909,103 @@
10073
9909
  "group": "component",
10074
9910
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
10075
9911
  },
9912
+ {
9913
+ "name": "header/bgColor",
9914
+ "value": {
9915
+ "r": 0.1450980392156863,
9916
+ "g": 0.1607843137254902,
9917
+ "b": 0.1803921568627451,
9918
+ "a": 1
9919
+ },
9920
+ "type": "COLOR",
9921
+ "refId": "mode/header/bgColor",
9922
+ "reference": "base/color/light/base/color/neutral/12",
9923
+ "collection": "mode",
9924
+ "mode": "light",
9925
+ "group": "component (internal)",
9926
+ "scopes": ["FRAME_FILL", "SHAPE_FILL"]
9927
+ },
9928
+ {
9929
+ "name": "header/fgColor/default",
9930
+ "value": {
9931
+ "r": 1,
9932
+ "g": 1,
9933
+ "b": 1,
9934
+ "a": 0.7
9935
+ },
9936
+ "type": "COLOR",
9937
+ "alpha": 0.7,
9938
+ "refId": "mode/header/fgColor/default",
9939
+ "reference": "base/color/light/base/color/neutral/0",
9940
+ "collection": "mode",
9941
+ "mode": "light",
9942
+ "group": "component (internal)",
9943
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
9944
+ },
9945
+ {
9946
+ "name": "header/fgColor/logo",
9947
+ "value": {
9948
+ "r": 1,
9949
+ "g": 1,
9950
+ "b": 1,
9951
+ "a": 1
9952
+ },
9953
+ "type": "COLOR",
9954
+ "refId": "mode/header/fgColor/logo",
9955
+ "reference": "base/color/light/base/color/neutral/0",
9956
+ "collection": "mode",
9957
+ "mode": "light",
9958
+ "group": "component (internal)",
9959
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
9960
+ },
9961
+ {
9962
+ "name": "header/borderColor/divider",
9963
+ "value": {
9964
+ "r": 0.5058823529411764,
9965
+ "g": 0.5450980392156862,
9966
+ "b": 0.596078431372549,
9967
+ "a": 1
9968
+ },
9969
+ "type": "COLOR",
9970
+ "refId": "mode/header/borderColor/divider",
9971
+ "reference": "base/color/light/base/color/neutral/8",
9972
+ "collection": "mode",
9973
+ "mode": "light",
9974
+ "group": "component (internal)",
9975
+ "scopes": ["STROKE_COLOR"]
9976
+ },
9977
+ {
9978
+ "name": "headerSearch/bgColor",
9979
+ "value": {
9980
+ "r": 0.1450980392156863,
9981
+ "g": 0.1607843137254902,
9982
+ "b": 0.1803921568627451,
9983
+ "a": 1
9984
+ },
9985
+ "type": "COLOR",
9986
+ "refId": "mode/headerSearch/bgColor",
9987
+ "reference": "base/color/light/base/color/neutral/12",
9988
+ "collection": "mode",
9989
+ "mode": "light",
9990
+ "group": "component (internal)",
9991
+ "scopes": ["FRAME_FILL", "SHAPE_FILL"]
9992
+ },
9993
+ {
9994
+ "name": "headerSearch/borderColor",
9995
+ "value": {
9996
+ "r": 0.5058823529411764,
9997
+ "g": 0.5450980392156862,
9998
+ "b": 0.596078431372549,
9999
+ "a": 1
10000
+ },
10001
+ "type": "COLOR",
10002
+ "refId": "mode/headerSearch/borderColor",
10003
+ "reference": "base/color/light/base/color/neutral/8",
10004
+ "collection": "mode",
10005
+ "mode": "light",
10006
+ "group": "component (internal)",
10007
+ "scopes": ["STROKE_COLOR"]
10008
+ },
10076
10009
  {
10077
10010
  "name": "highlight/neutral/bgColor",
10078
10011
  "value": {
@@ -10089,6 +10022,56 @@
10089
10022
  "group": "component",
10090
10023
  "scopes": ["FRAME_FILL", "SHAPE_FILL"]
10091
10024
  },
10025
+ {
10026
+ "name": "overlay/bgColor",
10027
+ "value": {
10028
+ "r": 1,
10029
+ "g": 1,
10030
+ "b": 1,
10031
+ "a": 1
10032
+ },
10033
+ "type": "COLOR",
10034
+ "refId": "mode/overlay/bgColor",
10035
+ "reference": "base/color/light/base/color/neutral/0",
10036
+ "collection": "mode",
10037
+ "mode": "light",
10038
+ "group": "component (internal)",
10039
+ "scopes": ["FRAME_FILL", "SHAPE_FILL"]
10040
+ },
10041
+ {
10042
+ "name": "overlay/borderColor",
10043
+ "value": {
10044
+ "r": 0.8196078431372549,
10045
+ "g": 0.8509803921568627,
10046
+ "b": 0.8784313725490196,
10047
+ "a": 0.5
10048
+ },
10049
+ "type": "COLOR",
10050
+ "alpha": 0.5,
10051
+ "refId": "mode/overlay/borderColor",
10052
+ "reference": "mode/borderColor/muted",
10053
+ "collection": "mode",
10054
+ "mode": "light",
10055
+ "group": "component (internal)",
10056
+ "scopes": ["ALL_SCOPES"]
10057
+ },
10058
+ {
10059
+ "name": "overlay/backdrop/bgColor",
10060
+ "value": {
10061
+ "r": 0.7843137254901961,
10062
+ "g": 0.8196078431372549,
10063
+ "b": 0.8549019607843137,
10064
+ "a": 0.4
10065
+ },
10066
+ "type": "COLOR",
10067
+ "alpha": 0.4,
10068
+ "refId": "mode/overlay/backdrop/bgColor",
10069
+ "reference": "base/color/light/base/color/neutral/7",
10070
+ "collection": "mode",
10071
+ "mode": "light",
10072
+ "group": "component (internal)",
10073
+ "scopes": ["FRAME_FILL", "SHAPE_FILL"]
10074
+ },
10092
10075
  {
10093
10076
  "name": "page/header/bgColor",
10094
10077
  "value": {
@@ -10168,6 +10151,23 @@
10168
10151
  "group": "component (internal)",
10169
10152
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
10170
10153
  },
10154
+ {
10155
+ "name": "skeletonLoader/bgColor",
10156
+ "value": {
10157
+ "r": 0.5058823529411764,
10158
+ "g": 0.5450980392156862,
10159
+ "b": 0.596078431372549,
10160
+ "a": 0.1
10161
+ },
10162
+ "type": "COLOR",
10163
+ "alpha": 0.1,
10164
+ "refId": "mode/skeletonLoader/bgColor",
10165
+ "reference": "base/color/light/base/color/neutral/8",
10166
+ "collection": "mode",
10167
+ "mode": "light",
10168
+ "group": "component",
10169
+ "scopes": ["FRAME_FILL", "SHAPE_FILL"]
10170
+ },
10171
10171
  {
10172
10172
  "name": "timelineBadge/bgColor",
10173
10173
  "value": {