@primer/primitives 10.0.0-rc.4782a992 → 10.0.0-rc.4b3d8b21

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/PrimerStyleDictionary.js +2 -1
  2. package/dist/build/filters/isCubicBezier.d.ts +7 -0
  3. package/dist/build/filters/isCubicBezier.js +10 -0
  4. package/dist/build/platforms/css.js +1 -0
  5. package/dist/build/transformers/cubicBezierToCss.d.ts +8 -0
  6. package/dist/build/transformers/cubicBezierToCss.js +23 -0
  7. package/dist/build/transformers/index.d.ts +1 -0
  8. package/dist/build/transformers/index.js +1 -0
  9. package/dist/css/functional/themes/dark-colorblind.css +2 -0
  10. package/dist/css/functional/themes/dark-dimmed.css +2 -0
  11. package/dist/css/functional/themes/dark-high-contrast.css +2 -0
  12. package/dist/css/functional/themes/dark-tritanopia.css +2 -0
  13. package/dist/css/functional/themes/dark.css +2 -0
  14. package/dist/css/functional/themes/light-colorblind.css +2 -0
  15. package/dist/css/functional/themes/light-high-contrast.css +2 -0
  16. package/dist/css/functional/themes/light-tritanopia.css +2 -0
  17. package/dist/css/functional/themes/light.css +2 -0
  18. package/dist/docs/functional/themes/dark-colorblind.json +29 -0
  19. package/dist/docs/functional/themes/dark-dimmed.json +29 -0
  20. package/dist/docs/functional/themes/dark-high-contrast.json +29 -0
  21. package/dist/docs/functional/themes/dark-tritanopia.json +29 -0
  22. package/dist/docs/functional/themes/dark.json +29 -0
  23. package/dist/docs/functional/themes/light-colorblind.json +29 -0
  24. package/dist/docs/functional/themes/light-high-contrast.json +29 -0
  25. package/dist/docs/functional/themes/light-tritanopia.json +29 -0
  26. package/dist/docs/functional/themes/light.json +29 -0
  27. package/dist/figma/themes/dark-colorblind.json +16 -0
  28. package/dist/figma/themes/dark-dimmed.json +16 -0
  29. package/dist/figma/themes/dark-high-contrast.json +16 -0
  30. package/dist/figma/themes/dark-tritanopia.json +16 -0
  31. package/dist/figma/themes/dark.json +16 -0
  32. package/dist/figma/themes/light-colorblind.json +16 -0
  33. package/dist/figma/themes/light-high-contrast.json +16 -0
  34. package/dist/figma/themes/light-tritanopia.json +16 -0
  35. package/dist/figma/themes/light.json +16 -0
  36. package/dist/internalCss/dark-colorblind.css +2 -0
  37. package/dist/internalCss/dark-dimmed.css +2 -0
  38. package/dist/internalCss/dark-high-contrast.css +2 -0
  39. package/dist/internalCss/dark-tritanopia.css +2 -0
  40. package/dist/internalCss/dark.css +2 -0
  41. package/dist/internalCss/light-colorblind.css +2 -0
  42. package/dist/internalCss/light-high-contrast.css +2 -0
  43. package/dist/internalCss/light-tritanopia.css +2 -0
  44. package/dist/internalCss/light.css +2 -0
  45. package/dist/styleLint/functional/themes/dark-colorblind.json +29 -0
  46. package/dist/styleLint/functional/themes/dark-dimmed.json +29 -0
  47. package/dist/styleLint/functional/themes/dark-high-contrast.json +29 -0
  48. package/dist/styleLint/functional/themes/dark-tritanopia.json +29 -0
  49. package/dist/styleLint/functional/themes/dark.json +29 -0
  50. package/dist/styleLint/functional/themes/light-colorblind.json +29 -0
  51. package/dist/styleLint/functional/themes/light-high-contrast.json +29 -0
  52. package/dist/styleLint/functional/themes/light-tritanopia.json +29 -0
  53. package/dist/styleLint/functional/themes/light.json +29 -0
  54. package/package.json +1 -1
  55. package/src/tokens/functional/color/dark/patterns-dark.json5 +12 -0
  56. package/src/tokens/functional/color/light/patterns-light.json5 +13 -1
@@ -5699,6 +5699,22 @@
5699
5699
  "group": "component (internal)",
5700
5700
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5701
5701
  },
5702
+ {
5703
+ "name": "button/invisible/fgColor/active",
5704
+ "value": {
5705
+ "r": 0.9411764705882353,
5706
+ "g": 0.9647058823529412,
5707
+ "b": 0.9882352941176471,
5708
+ "a": 1
5709
+ },
5710
+ "type": "COLOR",
5711
+ "refId": "mode/button/invisible/fgColor/active",
5712
+ "reference": "mode/control/fgColor/rest",
5713
+ "collection": "mode",
5714
+ "mode": "dark tritanopia",
5715
+ "group": "component (internal)",
5716
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5717
+ },
5702
5718
  {
5703
5719
  "name": "button/invisible/fgColor/hover",
5704
5720
  "value": {
@@ -6230,6 +6230,22 @@
6230
6230
  "group": "component (internal)",
6231
6231
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
6232
6232
  },
6233
+ {
6234
+ "name": "button/invisible/fgColor/active",
6235
+ "value": {
6236
+ "r": 0.9411764705882353,
6237
+ "g": 0.9647058823529412,
6238
+ "b": 0.9882352941176471,
6239
+ "a": 1
6240
+ },
6241
+ "type": "COLOR",
6242
+ "refId": "mode/button/invisible/fgColor/active",
6243
+ "reference": "mode/control/fgColor/rest",
6244
+ "collection": "mode",
6245
+ "mode": "dark",
6246
+ "group": "component (internal)",
6247
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
6248
+ },
6233
6249
  {
6234
6250
  "name": "button/invisible/fgColor/hover",
6235
6251
  "value": {
@@ -5496,6 +5496,22 @@
5496
5496
  "group": "component (internal)",
5497
5497
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5498
5498
  },
5499
+ {
5500
+ "name": "button/invisible/fgColor/active",
5501
+ "value": {
5502
+ "r": 0.1450980392156863,
5503
+ "g": 0.1607843137254902,
5504
+ "b": 0.1803921568627451,
5505
+ "a": 1
5506
+ },
5507
+ "type": "COLOR",
5508
+ "refId": "mode/button/invisible/fgColor/active",
5509
+ "reference": "mode/control/fgColor/rest",
5510
+ "collection": "mode",
5511
+ "mode": "light colorblind",
5512
+ "group": "component (internal)",
5513
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5514
+ },
5499
5515
  {
5500
5516
  "name": "button/invisible/fgColor/hover",
5501
5517
  "value": {
@@ -5386,6 +5386,22 @@
5386
5386
  "group": "component (internal)",
5387
5387
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5388
5388
  },
5389
+ {
5390
+ "name": "button/invisible/fgColor/active",
5391
+ "value": {
5392
+ "r": 0.1450980392156863,
5393
+ "g": 0.1607843137254902,
5394
+ "b": 0.1803921568627451,
5395
+ "a": 1
5396
+ },
5397
+ "type": "COLOR",
5398
+ "refId": "mode/button/invisible/fgColor/active",
5399
+ "reference": "mode/control/fgColor/rest",
5400
+ "collection": "mode",
5401
+ "mode": "light high contrast",
5402
+ "group": "component (internal)",
5403
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5404
+ },
5389
5405
  {
5390
5406
  "name": "button/invisible/fgColor/rest",
5391
5407
  "value": {
@@ -5610,6 +5610,22 @@
5610
5610
  "group": "component (internal)",
5611
5611
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5612
5612
  },
5613
+ {
5614
+ "name": "button/invisible/fgColor/active",
5615
+ "value": {
5616
+ "r": 0.1450980392156863,
5617
+ "g": 0.1607843137254902,
5618
+ "b": 0.1803921568627451,
5619
+ "a": 1
5620
+ },
5621
+ "type": "COLOR",
5622
+ "refId": "mode/button/invisible/fgColor/active",
5623
+ "reference": "mode/control/fgColor/rest",
5624
+ "collection": "mode",
5625
+ "mode": "light tritanopia",
5626
+ "group": "component (internal)",
5627
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
5628
+ },
5613
5629
  {
5614
5630
  "name": "button/invisible/fgColor/hover",
5615
5631
  "value": {
@@ -6123,6 +6123,22 @@
6123
6123
  "group": "component (internal)",
6124
6124
  "scopes": ["TEXT_FILL", "SHAPE_FILL"]
6125
6125
  },
6126
+ {
6127
+ "name": "button/invisible/fgColor/active",
6128
+ "value": {
6129
+ "r": 0.1450980392156863,
6130
+ "g": 0.1607843137254902,
6131
+ "b": 0.1803921568627451,
6132
+ "a": 1
6133
+ },
6134
+ "type": "COLOR",
6135
+ "refId": "mode/button/invisible/fgColor/active",
6136
+ "reference": "mode/control/fgColor/rest",
6137
+ "collection": "mode",
6138
+ "mode": "light",
6139
+ "group": "component (internal)",
6140
+ "scopes": ["TEXT_FILL", "SHAPE_FILL"]
6141
+ },
6126
6142
  {
6127
6143
  "name": "button/invisible/fgColor/hover",
6128
6144
  "value": {
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
542
542
  --button-invisible-fgColor-rest: #f0f6fc;
543
543
  --button-invisible-fgColor-hover: #f0f6fc;
544
+ --button-invisible-fgColor-active: #f0f6fc;
544
545
  --button-invisible-fgColor-disabled: #656c7699;
545
546
  --button-invisible-iconColor-rest: #9198a1;
546
547
  --button-invisible-iconColor-hover: #9198a1;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
1410
1411
  --button-invisible-fgColor-rest: #f0f6fc;
1411
1412
  --button-invisible-fgColor-hover: #f0f6fc;
1413
+ --button-invisible-fgColor-active: #f0f6fc;
1412
1414
  --button-invisible-fgColor-disabled: #656c7699;
1413
1415
  --button-invisible-iconColor-rest: #9198a1;
1414
1416
  --button-invisible-iconColor-hover: #9198a1;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
542
542
  --button-invisible-fgColor-rest: #d1d7e0;
543
543
  --button-invisible-fgColor-hover: #d1d7e0;
544
+ --button-invisible-fgColor-active: #d1d7e0;
544
545
  --button-invisible-fgColor-disabled: #656c76;
545
546
  --button-invisible-iconColor-rest: #b7bdc8;
546
547
  --button-invisible-iconColor-hover: #b7bdc8;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
1410
1411
  --button-invisible-fgColor-rest: #d1d7e0;
1411
1412
  --button-invisible-fgColor-hover: #d1d7e0;
1413
+ --button-invisible-fgColor-active: #d1d7e0;
1412
1414
  --button-invisible-fgColor-disabled: #656c76;
1413
1415
  --button-invisible-iconColor-rest: #b7bdc8;
1414
1416
  --button-invisible-iconColor-hover: #b7bdc8;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
542
542
  --button-invisible-fgColor-rest: #ffffff;
543
543
  --button-invisible-fgColor-hover: #ffffff;
544
+ --button-invisible-fgColor-active: #ffffff;
544
545
  --button-invisible-fgColor-disabled: #656c76;
545
546
  --button-invisible-iconColor-rest: #d1d7e0;
546
547
  --button-invisible-iconColor-hover: #d1d7e0;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
1410
1411
  --button-invisible-fgColor-rest: #ffffff;
1411
1412
  --button-invisible-fgColor-hover: #ffffff;
1413
+ --button-invisible-fgColor-active: #ffffff;
1412
1414
  --button-invisible-fgColor-disabled: #656c76;
1413
1415
  --button-invisible-iconColor-rest: #d1d7e0;
1414
1416
  --button-invisible-iconColor-hover: #d1d7e0;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
542
542
  --button-invisible-fgColor-rest: #f0f6fc;
543
543
  --button-invisible-fgColor-hover: #f0f6fc;
544
+ --button-invisible-fgColor-active: #f0f6fc;
544
545
  --button-invisible-fgColor-disabled: #656c7699;
545
546
  --button-invisible-iconColor-rest: #9198a1;
546
547
  --button-invisible-iconColor-hover: #9198a1;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
1410
1411
  --button-invisible-fgColor-rest: #f0f6fc;
1411
1412
  --button-invisible-fgColor-hover: #f0f6fc;
1413
+ --button-invisible-fgColor-active: #f0f6fc;
1412
1414
  --button-invisible-fgColor-disabled: #656c7699;
1413
1415
  --button-invisible-iconColor-rest: #9198a1;
1414
1416
  --button-invisible-iconColor-hover: #9198a1;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
542
542
  --button-invisible-fgColor-rest: #f0f6fc;
543
543
  --button-invisible-fgColor-hover: #f0f6fc;
544
+ --button-invisible-fgColor-active: #f0f6fc;
544
545
  --button-invisible-fgColor-disabled: #656c7699;
545
546
  --button-invisible-iconColor-rest: #9198a1;
546
547
  --button-invisible-iconColor-hover: #9198a1;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
1410
1411
  --button-invisible-fgColor-rest: #f0f6fc;
1411
1412
  --button-invisible-fgColor-hover: #f0f6fc;
1413
+ --button-invisible-fgColor-active: #f0f6fc;
1412
1414
  --button-invisible-fgColor-disabled: #656c7699;
1413
1415
  --button-invisible-iconColor-rest: #9198a1;
1414
1416
  --button-invisible-iconColor-hover: #9198a1;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #0021554d;
542
542
  --button-invisible-fgColor-rest: #25292e;
543
543
  --button-invisible-fgColor-hover: #25292e;
544
+ --button-invisible-fgColor-active: #25292e;
544
545
  --button-invisible-fgColor-disabled: #818b98;
545
546
  --button-invisible-iconColor-rest: #59636e;
546
547
  --button-invisible-iconColor-hover: #59636e;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #0021554d;
1410
1411
  --button-invisible-fgColor-rest: #25292e;
1411
1412
  --button-invisible-fgColor-hover: #25292e;
1413
+ --button-invisible-fgColor-active: #25292e;
1412
1414
  --button-invisible-fgColor-disabled: #818b98;
1413
1415
  --button-invisible-iconColor-rest: #59636e;
1414
1416
  --button-invisible-iconColor-hover: #59636e;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #00230b4d;
542
542
  --button-invisible-fgColor-rest: #25292e;
543
543
  --button-invisible-fgColor-hover: #393f46;
544
+ --button-invisible-fgColor-active: #25292e;
544
545
  --button-invisible-fgColor-disabled: #59636e;
545
546
  --button-invisible-iconColor-rest: #454c54;
546
547
  --button-invisible-iconColor-hover: #393f46;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #00230b4d;
1410
1411
  --button-invisible-fgColor-rest: #25292e;
1411
1412
  --button-invisible-fgColor-hover: #393f46;
1413
+ --button-invisible-fgColor-active: #25292e;
1412
1414
  --button-invisible-fgColor-disabled: #59636e;
1413
1415
  --button-invisible-iconColor-rest: #454c54;
1414
1416
  --button-invisible-iconColor-hover: #393f46;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #0021554d;
542
542
  --button-invisible-fgColor-rest: #25292e;
543
543
  --button-invisible-fgColor-hover: #25292e;
544
+ --button-invisible-fgColor-active: #25292e;
544
545
  --button-invisible-fgColor-disabled: #818b98;
545
546
  --button-invisible-iconColor-rest: #59636e;
546
547
  --button-invisible-iconColor-hover: #59636e;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #0021554d;
1410
1411
  --button-invisible-fgColor-rest: #25292e;
1411
1412
  --button-invisible-fgColor-hover: #25292e;
1413
+ --button-invisible-fgColor-active: #25292e;
1412
1414
  --button-invisible-fgColor-disabled: #818b98;
1413
1415
  --button-invisible-iconColor-rest: #59636e;
1414
1416
  --button-invisible-iconColor-hover: #59636e;
@@ -541,6 +541,7 @@
541
541
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
542
542
  --button-invisible-fgColor-rest: #25292e;
543
543
  --button-invisible-fgColor-hover: #25292e;
544
+ --button-invisible-fgColor-active: #25292e;
544
545
  --button-invisible-fgColor-disabled: #818b98;
545
546
  --button-invisible-iconColor-rest: #59636e;
546
547
  --button-invisible-iconColor-hover: #59636e;
@@ -1409,6 +1410,7 @@
1409
1410
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
1410
1411
  --button-invisible-fgColor-rest: #25292e;
1411
1412
  --button-invisible-fgColor-hover: #25292e;
1413
+ --button-invisible-fgColor-active: #25292e;
1412
1414
  --button-invisible-fgColor-disabled: #818b98;
1413
1415
  --button-invisible-iconColor-rest: #59636e;
1414
1416
  --button-invisible-iconColor-hover: #59636e;
@@ -7113,6 +7113,35 @@
7113
7113
  "attributes": {},
7114
7114
  "path": ["button", "invisible", "fgColor", "hover"]
7115
7115
  },
7116
+ "button-invisible-fgColor-active": {
7117
+ "$value": "#f0f6fc",
7118
+ "$type": "color",
7119
+ "$extensions": {
7120
+ "org.primer.figma": {
7121
+ "collection": "mode",
7122
+ "mode": "dark",
7123
+ "group": "component (internal)",
7124
+ "scopes": ["fgColor"]
7125
+ }
7126
+ },
7127
+ "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
7128
+ "isSource": true,
7129
+ "original": {
7130
+ "$value": "{control.fgColor.rest}",
7131
+ "$type": "color",
7132
+ "$extensions": {
7133
+ "org.primer.figma": {
7134
+ "collection": "mode",
7135
+ "mode": "dark",
7136
+ "group": "component (internal)",
7137
+ "scopes": ["fgColor"]
7138
+ }
7139
+ }
7140
+ },
7141
+ "name": "button-invisible-fgColor-active",
7142
+ "attributes": {},
7143
+ "path": ["button", "invisible", "fgColor", "active"]
7144
+ },
7116
7145
  "button-invisible-fgColor-disabled": {
7117
7146
  "$value": "#656c7699",
7118
7147
  "$type": "color",
@@ -7109,6 +7109,35 @@
7109
7109
  "attributes": {},
7110
7110
  "path": ["button", "invisible", "fgColor", "hover"]
7111
7111
  },
7112
+ "button-invisible-fgColor-active": {
7113
+ "$value": "#d1d7e0",
7114
+ "$type": "color",
7115
+ "$extensions": {
7116
+ "org.primer.figma": {
7117
+ "collection": "mode",
7118
+ "mode": "dark",
7119
+ "group": "component (internal)",
7120
+ "scopes": ["fgColor"]
7121
+ }
7122
+ },
7123
+ "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
7124
+ "isSource": true,
7125
+ "original": {
7126
+ "$value": "{control.fgColor.rest}",
7127
+ "$type": "color",
7128
+ "$extensions": {
7129
+ "org.primer.figma": {
7130
+ "collection": "mode",
7131
+ "mode": "dark",
7132
+ "group": "component (internal)",
7133
+ "scopes": ["fgColor"]
7134
+ }
7135
+ }
7136
+ },
7137
+ "name": "button-invisible-fgColor-active",
7138
+ "attributes": {},
7139
+ "path": ["button", "invisible", "fgColor", "active"]
7140
+ },
7112
7141
  "button-invisible-fgColor-disabled": {
7113
7142
  "$value": "#656c76",
7114
7143
  "$type": "color",
@@ -5837,6 +5837,35 @@
5837
5837
  "attributes": {},
5838
5838
  "path": ["button", "invisible", "fgColor", "hover"]
5839
5839
  },
5840
+ "button-invisible-fgColor-active": {
5841
+ "$value": "#ffffff",
5842
+ "$type": "color",
5843
+ "$extensions": {
5844
+ "org.primer.figma": {
5845
+ "collection": "mode",
5846
+ "mode": "dark",
5847
+ "group": "component (internal)",
5848
+ "scopes": ["fgColor"]
5849
+ }
5850
+ },
5851
+ "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
5852
+ "isSource": true,
5853
+ "original": {
5854
+ "$value": "{control.fgColor.rest}",
5855
+ "$type": "color",
5856
+ "$extensions": {
5857
+ "org.primer.figma": {
5858
+ "collection": "mode",
5859
+ "mode": "dark",
5860
+ "group": "component (internal)",
5861
+ "scopes": ["fgColor"]
5862
+ }
5863
+ }
5864
+ },
5865
+ "name": "button-invisible-fgColor-active",
5866
+ "attributes": {},
5867
+ "path": ["button", "invisible", "fgColor", "active"]
5868
+ },
5840
5869
  "button-invisible-fgColor-disabled": {
5841
5870
  "$value": "#656c76",
5842
5871
  "$type": "color",
@@ -7205,6 +7205,35 @@
7205
7205
  "attributes": {},
7206
7206
  "path": ["button", "invisible", "fgColor", "hover"]
7207
7207
  },
7208
+ "button-invisible-fgColor-active": {
7209
+ "$value": "#f0f6fc",
7210
+ "$type": "color",
7211
+ "$extensions": {
7212
+ "org.primer.figma": {
7213
+ "collection": "mode",
7214
+ "mode": "dark",
7215
+ "group": "component (internal)",
7216
+ "scopes": ["fgColor"]
7217
+ }
7218
+ },
7219
+ "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
7220
+ "isSource": true,
7221
+ "original": {
7222
+ "$value": "{control.fgColor.rest}",
7223
+ "$type": "color",
7224
+ "$extensions": {
7225
+ "org.primer.figma": {
7226
+ "collection": "mode",
7227
+ "mode": "dark",
7228
+ "group": "component (internal)",
7229
+ "scopes": ["fgColor"]
7230
+ }
7231
+ }
7232
+ },
7233
+ "name": "button-invisible-fgColor-active",
7234
+ "attributes": {},
7235
+ "path": ["button", "invisible", "fgColor", "active"]
7236
+ },
7208
7237
  "button-invisible-fgColor-disabled": {
7209
7238
  "$value": "#656c7699",
7210
7239
  "$type": "color",
@@ -7317,6 +7317,35 @@
7317
7317
  "attributes": {},
7318
7318
  "path": ["button", "invisible", "fgColor", "hover"]
7319
7319
  },
7320
+ "button-invisible-fgColor-active": {
7321
+ "$value": "#f0f6fc",
7322
+ "$type": "color",
7323
+ "$extensions": {
7324
+ "org.primer.figma": {
7325
+ "collection": "mode",
7326
+ "mode": "dark",
7327
+ "group": "component (internal)",
7328
+ "scopes": ["fgColor"]
7329
+ }
7330
+ },
7331
+ "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
7332
+ "isSource": true,
7333
+ "original": {
7334
+ "$value": "{control.fgColor.rest}",
7335
+ "$type": "color",
7336
+ "$extensions": {
7337
+ "org.primer.figma": {
7338
+ "collection": "mode",
7339
+ "mode": "dark",
7340
+ "group": "component (internal)",
7341
+ "scopes": ["fgColor"]
7342
+ }
7343
+ }
7344
+ },
7345
+ "name": "button-invisible-fgColor-active",
7346
+ "attributes": {},
7347
+ "path": ["button", "invisible", "fgColor", "active"]
7348
+ },
7320
7349
  "button-invisible-fgColor-disabled": {
7321
7350
  "$value": "#656c7699",
7322
7351
  "$type": "color",
@@ -7123,6 +7123,35 @@
7123
7123
  "attributes": {},
7124
7124
  "path": ["button", "invisible", "fgColor", "hover"]
7125
7125
  },
7126
+ "button-invisible-fgColor-active": {
7127
+ "$value": "#25292e",
7128
+ "$type": "color",
7129
+ "$extensions": {
7130
+ "org.primer.figma": {
7131
+ "collection": "mode",
7132
+ "mode": "light",
7133
+ "group": "component (internal)",
7134
+ "scopes": ["fgColor"]
7135
+ }
7136
+ },
7137
+ "filePath": "src/tokens/functional/color/light/patterns-light.json5",
7138
+ "isSource": true,
7139
+ "original": {
7140
+ "$value": "{control.fgColor.rest}",
7141
+ "$type": "color",
7142
+ "$extensions": {
7143
+ "org.primer.figma": {
7144
+ "collection": "mode",
7145
+ "mode": "light",
7146
+ "group": "component (internal)",
7147
+ "scopes": ["fgColor"]
7148
+ }
7149
+ }
7150
+ },
7151
+ "name": "button-invisible-fgColor-active",
7152
+ "attributes": {},
7153
+ "path": ["button", "invisible", "fgColor", "active"]
7154
+ },
7126
7155
  "button-invisible-fgColor-disabled": {
7127
7156
  "$value": "#818b98",
7128
7157
  "$type": "color",
@@ -5873,6 +5873,35 @@
5873
5873
  "attributes": {},
5874
5874
  "path": ["button", "invisible", "fgColor", "hover"]
5875
5875
  },
5876
+ "button-invisible-fgColor-active": {
5877
+ "$value": "#25292e",
5878
+ "$type": "color",
5879
+ "$extensions": {
5880
+ "org.primer.figma": {
5881
+ "collection": "mode",
5882
+ "mode": "light",
5883
+ "group": "component (internal)",
5884
+ "scopes": ["fgColor"]
5885
+ }
5886
+ },
5887
+ "filePath": "src/tokens/functional/color/light/patterns-light.json5",
5888
+ "isSource": true,
5889
+ "original": {
5890
+ "$value": "{control.fgColor.rest}",
5891
+ "$type": "color",
5892
+ "$extensions": {
5893
+ "org.primer.figma": {
5894
+ "collection": "mode",
5895
+ "mode": "light",
5896
+ "group": "component (internal)",
5897
+ "scopes": ["fgColor"]
5898
+ }
5899
+ }
5900
+ },
5901
+ "name": "button-invisible-fgColor-active",
5902
+ "attributes": {},
5903
+ "path": ["button", "invisible", "fgColor", "active"]
5904
+ },
5876
5905
  "button-invisible-fgColor-disabled": {
5877
5906
  "$value": "#59636e",
5878
5907
  "$type": "color",
@@ -7139,6 +7139,35 @@
7139
7139
  "attributes": {},
7140
7140
  "path": ["button", "invisible", "fgColor", "hover"]
7141
7141
  },
7142
+ "button-invisible-fgColor-active": {
7143
+ "$value": "#25292e",
7144
+ "$type": "color",
7145
+ "$extensions": {
7146
+ "org.primer.figma": {
7147
+ "collection": "mode",
7148
+ "mode": "light",
7149
+ "group": "component (internal)",
7150
+ "scopes": ["fgColor"]
7151
+ }
7152
+ },
7153
+ "filePath": "src/tokens/functional/color/light/patterns-light.json5",
7154
+ "isSource": true,
7155
+ "original": {
7156
+ "$value": "{control.fgColor.rest}",
7157
+ "$type": "color",
7158
+ "$extensions": {
7159
+ "org.primer.figma": {
7160
+ "collection": "mode",
7161
+ "mode": "light",
7162
+ "group": "component (internal)",
7163
+ "scopes": ["fgColor"]
7164
+ }
7165
+ }
7166
+ },
7167
+ "name": "button-invisible-fgColor-active",
7168
+ "attributes": {},
7169
+ "path": ["button", "invisible", "fgColor", "active"]
7170
+ },
7142
7171
  "button-invisible-fgColor-disabled": {
7143
7172
  "$value": "#818b98",
7144
7173
  "$type": "color",
@@ -7283,6 +7283,35 @@
7283
7283
  "attributes": {},
7284
7284
  "path": ["button", "invisible", "fgColor", "hover"]
7285
7285
  },
7286
+ "button-invisible-fgColor-active": {
7287
+ "$value": "#25292e",
7288
+ "$type": "color",
7289
+ "$extensions": {
7290
+ "org.primer.figma": {
7291
+ "collection": "mode",
7292
+ "mode": "light",
7293
+ "group": "component (internal)",
7294
+ "scopes": ["fgColor"]
7295
+ }
7296
+ },
7297
+ "filePath": "src/tokens/functional/color/light/patterns-light.json5",
7298
+ "isSource": true,
7299
+ "original": {
7300
+ "$value": "{control.fgColor.rest}",
7301
+ "$type": "color",
7302
+ "$extensions": {
7303
+ "org.primer.figma": {
7304
+ "collection": "mode",
7305
+ "mode": "light",
7306
+ "group": "component (internal)",
7307
+ "scopes": ["fgColor"]
7308
+ }
7309
+ }
7310
+ },
7311
+ "name": "button-invisible-fgColor-active",
7312
+ "attributes": {},
7313
+ "path": ["button", "invisible", "fgColor", "active"]
7314
+ },
7286
7315
  "button-invisible-fgColor-disabled": {
7287
7316
  "$value": "#818b98",
7288
7317
  "$type": "color",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/primitives",
3
- "version": "10.0.0-rc.4782a992",
3
+ "version": "10.0.0-rc.4b3d8b21",
4
4
  "description": "Typography, spacing, and color primitives for Primer design system",
5
5
  "type": "module",
6
6
  "files": [
@@ -1087,6 +1087,18 @@
1087
1087
  },
1088
1088
  },
1089
1089
  },
1090
+ active: {
1091
+ $value: '{control.fgColor.rest}',
1092
+ $type: 'color',
1093
+ $extensions: {
1094
+ 'org.primer.figma': {
1095
+ collection: 'mode',
1096
+ mode: 'dark',
1097
+ group: 'component (internal)',
1098
+ scopes: ['fgColor'],
1099
+ },
1100
+ },
1101
+ },
1090
1102
  disabled: {
1091
1103
  $value: '{control.fgColor.disabled}',
1092
1104
  $type: 'color',