@primer/primitives 10.1.0 → 10.2.0-rc.356b5bb4

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 (60) hide show
  1. package/dist/build/primerStyleDictionary.js +2 -0
  2. package/dist/build/schemas/colorToken.d.ts +1 -6
  3. package/dist/build/schemas/colorToken.js +1 -1
  4. package/dist/build/transformers/colorAlphaToCss.d.ts +3 -0
  5. package/dist/build/transformers/colorAlphaToCss.js +23 -0
  6. package/dist/build/transformers/colorToHex.js +1 -2
  7. package/dist/css/functional/themes/dark-colorblind.css +2 -2
  8. package/dist/css/functional/themes/dark-high-contrast.css +2 -2
  9. package/dist/css/functional/themes/dark-tritanopia.css +2 -2
  10. package/dist/css/functional/themes/dark.css +2 -2
  11. package/dist/css/functional/themes/light-colorblind.css +2 -2
  12. package/dist/css/functional/themes/light-high-contrast.css +2 -2
  13. package/dist/css/functional/themes/light-tritanopia.css +2 -2
  14. package/dist/css/functional/themes/light.css +2 -2
  15. package/dist/docs/functional/themes/dark-colorblind.json +47 -59
  16. package/dist/docs/functional/themes/dark-dimmed.json +13 -5
  17. package/dist/docs/functional/themes/dark-high-contrast.json +39 -17
  18. package/dist/docs/functional/themes/dark-tritanopia.json +57 -85
  19. package/dist/docs/functional/themes/dark.json +41 -33
  20. package/dist/docs/functional/themes/light-colorblind.json +37 -33
  21. package/dist/docs/functional/themes/light-high-contrast.json +35 -13
  22. package/dist/docs/functional/themes/light-tritanopia.json +37 -33
  23. package/dist/docs/functional/themes/light.json +35 -27
  24. package/dist/figma/themes/dark-colorblind.json +25 -24
  25. package/dist/figma/themes/dark-dimmed.json +6 -4
  26. package/dist/figma/themes/dark-high-contrast.json +20 -2
  27. package/dist/figma/themes/dark-tritanopia.json +29 -27
  28. package/dist/figma/themes/dark.json +31 -28
  29. package/dist/figma/themes/light-colorblind.json +16 -16
  30. package/dist/figma/themes/light-high-contrast.json +16 -0
  31. package/dist/figma/themes/light-tritanopia.json +16 -16
  32. package/dist/figma/themes/light.json +16 -16
  33. package/dist/internalCss/dark-colorblind.css +2 -2
  34. package/dist/internalCss/dark-high-contrast.css +2 -2
  35. package/dist/internalCss/dark-tritanopia.css +2 -2
  36. package/dist/internalCss/dark.css +2 -2
  37. package/dist/internalCss/light-colorblind.css +2 -2
  38. package/dist/internalCss/light-high-contrast.css +2 -2
  39. package/dist/internalCss/light-tritanopia.css +2 -2
  40. package/dist/internalCss/light.css +2 -2
  41. package/dist/styleLint/functional/themes/dark-colorblind.json +47 -59
  42. package/dist/styleLint/functional/themes/dark-dimmed.json +13 -5
  43. package/dist/styleLint/functional/themes/dark-high-contrast.json +39 -17
  44. package/dist/styleLint/functional/themes/dark-tritanopia.json +57 -85
  45. package/dist/styleLint/functional/themes/dark.json +41 -33
  46. package/dist/styleLint/functional/themes/light-colorblind.json +37 -33
  47. package/dist/styleLint/functional/themes/light-high-contrast.json +35 -13
  48. package/dist/styleLint/functional/themes/light-tritanopia.json +37 -33
  49. package/dist/styleLint/functional/themes/light.json +35 -27
  50. package/package.json +1 -1
  51. package/src/tokens/component/topicTag.json5 +19 -0
  52. package/src/tokens/functional/color/dark/app-dark.json5 +0 -14
  53. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -6
  54. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +5 -15
  55. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +9 -27
  56. package/src/tokens/functional/color/dark/primitives-dark.json5 +3 -3
  57. package/src/tokens/functional/color/light/app-light.json5 +0 -13
  58. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -6
  59. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +1 -3
  60. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +1 -3
package/dist/styleLint/functional/themes/light-tritanopia.json CHANGED
@@ -1,31 +1,4 @@
1
1
  {
2
- "topicTag-borderColor": {
3
- "$value": "#ffffff00",
4
- "$type": "color",
5
- "$extensions": {
6
- "org.primer.figma": {
7
- "collection": "mode",
8
- "group": "component",
9
- "scopes": ["borderColor"]
10
- }
11
- },
12
- "filePath": "src/tokens/functional/color/light/app-light.json5",
13
- "isSource": true,
14
- "original": {
15
- "$value": "{base.color.transparent}",
16
- "$type": "color",
17
- "$extensions": {
18
- "org.primer.figma": {
19
- "collection": "mode",
20
- "group": "component",
21
- "scopes": ["borderColor"]
22
- }
23
- }
24
- },
25
- "name": "topicTag-borderColor",
26
- "attributes": {},
27
- "path": ["topicTag", "borderColor"]
28
- },
29
2
  "highlight-neutral-bgColor": {
30
3
  "$value": "#fff8c5",
31
4
  "$type": "color",
@@ -13710,17 +13683,13 @@
13710
13683
  "borderColor-closed-muted": {
13711
13684
  "$value": "#d1d9e066",
13712
13685
  "$type": "color",
13713
- "$extensions": {
13714
- "alpha": 0.4
13715
- },
13686
+ "alpha": 0.4,
13716
13687
  "filePath": "src/tokens/functional/color/light/overrides/light.tritanopia.json5",
13717
13688
  "isSource": true,
13718
13689
  "original": {
13719
13690
  "$value": "{borderColor.default}",
13720
13691
  "$type": "color",
13721
- "$extensions": {
13722
- "alpha": 0.4
13723
- }
13692
+ "alpha": 0.4
13724
13693
  },
13725
13694
  "name": "borderColor-closed-muted",
13726
13695
  "attributes": {},
@@ -15829,5 +15798,40 @@
15829
15798
  "name": "border-sponsors-muted",
15830
15799
  "attributes": {},
15831
15800
  "path": ["border", "sponsors", "muted"]
15801
+ },
15802
+ "topicTag-borderColor": {
15803
+ "$value": "#ffffff00",
15804
+ "$type": "color",
15805
+ "$extensions": {
15806
+ "org.primer.figma": {
15807
+ "collection": "mode",
15808
+ "group": "component",
15809
+ "scopes": ["borderColor"]
15810
+ },
15811
+ "org.primer.overrides": {
15812
+ "light-high-contrast": "#0969da",
15813
+ "dark-high-contrast": "#0969da"
15814
+ }
15815
+ },
15816
+ "filePath": "src/tokens/component/topicTag.json5",
15817
+ "isSource": true,
15818
+ "original": {
15819
+ "$value": "{base.color.transparent}",
15820
+ "$type": "color",
15821
+ "$extensions": {
15822
+ "org.primer.figma": {
15823
+ "collection": "mode",
15824
+ "group": "component",
15825
+ "scopes": ["borderColor"]
15826
+ },
15827
+ "org.primer.overrides": {
15828
+ "light-high-contrast": "{borderColor.accent.emphasis}",
15829
+ "dark-high-contrast": "{borderColor.accent.emphasis}"
15830
+ }
15831
+ }
15832
+ },
15833
+ "name": "topicTag-borderColor",
15834
+ "attributes": {},
15835
+ "path": ["topicTag", "borderColor"]
15832
15836
  }
15833
15837
  }
package/dist/styleLint/functional/themes/light.json CHANGED
@@ -1,31 +1,4 @@
1
1
  {
2
- "topicTag-borderColor": {
3
- "$value": "#ffffff00",
4
- "$type": "color",
5
- "$extensions": {
6
- "org.primer.figma": {
7
- "collection": "mode",
8
- "group": "component",
9
- "scopes": ["borderColor"]
10
- }
11
- },
12
- "filePath": "src/tokens/functional/color/light/app-light.json5",
13
- "isSource": true,
14
- "original": {
15
- "$value": "{base.color.transparent}",
16
- "$type": "color",
17
- "$extensions": {
18
- "org.primer.figma": {
19
- "collection": "mode",
20
- "group": "component",
21
- "scopes": ["borderColor"]
22
- }
23
- }
24
- },
25
- "name": "topicTag-borderColor",
26
- "attributes": {},
27
- "path": ["topicTag", "borderColor"]
28
- },
29
2
  "highlight-neutral-bgColor": {
30
3
  "$value": "#fff8c5",
31
4
  "$type": "color",
@@ -16447,5 +16420,40 @@
16447
16420
  "name": "border-sponsors-muted",
16448
16421
  "attributes": {},
16449
16422
  "path": ["border", "sponsors", "muted"]
16423
+ },
16424
+ "topicTag-borderColor": {
16425
+ "$value": "#ffffff00",
16426
+ "$type": "color",
16427
+ "$extensions": {
16428
+ "org.primer.figma": {
16429
+ "collection": "mode",
16430
+ "group": "component",
16431
+ "scopes": ["borderColor"]
16432
+ },
16433
+ "org.primer.overrides": {
16434
+ "light-high-contrast": "#0969da",
16435
+ "dark-high-contrast": "#0969da"
16436
+ }
16437
+ },
16438
+ "filePath": "src/tokens/component/topicTag.json5",
16439
+ "isSource": true,
16440
+ "original": {
16441
+ "$value": "{base.color.transparent}",
16442
+ "$type": "color",
16443
+ "$extensions": {
16444
+ "org.primer.figma": {
16445
+ "collection": "mode",
16446
+ "group": "component",
16447
+ "scopes": ["borderColor"]
16448
+ },
16449
+ "org.primer.overrides": {
16450
+ "light-high-contrast": "{borderColor.accent.emphasis}",
16451
+ "dark-high-contrast": "{borderColor.accent.emphasis}"
16452
+ }
16453
+ }
16454
+ },
16455
+ "name": "topicTag-borderColor",
16456
+ "attributes": {},
16457
+ "path": ["topicTag", "borderColor"]
16450
16458
  }
16451
16459
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/primitives",
3
- "version": "10.1.0",
3
+ "version": "10.2.0-rc.356b5bb4",
4
4
  "description": "Typography, spacing, and color primitives for Primer design system",
5
5
  "type": "module",
6
6
  "files": [
package/src/tokens/component/topicTag.json5 ADDED
@@ -0,0 +1,19 @@
1
+ {
2
+ topicTag: {
3
+ borderColor: {
4
+ $value: '{base.color.transparent}',
5
+ $type: 'color',
6
+ $extensions: {
7
+ 'org.primer.figma': {
8
+ collection: 'mode',
9
+ group: 'component',
10
+ scopes: ['borderColor'],
11
+ },
12
+ 'org.primer.overrides': {
13
+ 'light-high-contrast': '{borderColor.accent.emphasis}',
14
+ 'dark-high-contrast': '{borderColor.accent.emphasis}',
15
+ },
16
+ },
17
+ },
18
+ },
19
+ }
package/src/tokens/functional/color/dark/app-dark.json5 CHANGED
@@ -1,18 +1,4 @@
1
1
  {
2
- topicTag: {
3
- borderColor: {
4
- $value: '{base.color.transparent}',
5
- $type: 'color',
6
- $extensions: {
7
- 'org.primer.figma': {
8
- collection: 'mode',
9
-
10
- group: 'component',
11
- scopes: ['borderColor'],
12
- },
13
- },
14
- },
15
- },
16
2
  highlight: {
17
3
  neutral: {
18
4
  bgColor: {
package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 CHANGED
@@ -220,12 +220,6 @@
220
220
  alpha: 0.9,
221
221
  },
222
222
  },
223
- topicTag: {
224
- borderColor: {
225
- $value: '{borderColor.accent.emphasis}',
226
- $type: 'color',
227
- },
228
- },
229
223
  counter: {
230
224
  borderColor: {
231
225
  $value: '{borderColor.default}',
package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 CHANGED
@@ -60,9 +60,7 @@
60
60
  muted: {
61
61
  $value: '{bgColor.neutral.muted}',
62
62
  $type: 'color',
63
- $extensions: {
64
- alpha: 0.1,
65
- },
63
+ alpha: 0.1,
66
64
  },
67
65
  emphasis: {
68
66
  $value: '{bgColor.neutral.emphasis}',
@@ -86,9 +84,7 @@
86
84
  muted: {
87
85
  $value: '{borderColor.muted}',
88
86
  $type: 'color',
89
- $extensions: {
90
- alpha: 0.4,
91
- },
87
+ alpha: 0.4,
92
88
  },
93
89
  emphasis: {
94
90
  $value: '{borderColor.emphasis}',
@@ -231,16 +227,12 @@
231
227
  rest: {
232
228
  $value: '{base.color.neutral.6}',
233
229
  $type: 'color',
234
- $extensions: {
235
- alpha: 1,
236
- },
230
+ alpha: 1,
237
231
  },
238
232
  hover: {
239
233
  $value: '{base.color.neutral.8}',
240
234
  $type: 'color',
241
- $extensions: {
242
- alpha: 1,
243
- },
235
+ alpha: 1,
244
236
  },
245
237
  },
246
238
  },
@@ -248,9 +240,7 @@
248
240
  bgColor: {
249
241
  $value: '{base.color.neutral.3}',
250
242
  $type: 'color',
251
- $extensions: {
252
- alpha: 1,
253
- },
243
+ alpha: 1,
254
244
  },
255
245
  },
256
246
  },
package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 CHANGED
@@ -80,9 +80,7 @@
80
80
  muted: {
81
81
  $value: '{base.color.blue.4}',
82
82
  $type: 'color',
83
- $extensions: {
84
- alpha: 0.4,
85
- },
83
+ alpha: 0.4,
86
84
  },
87
85
  emphasis: {
88
86
  $value: '{base.color.blue.5}',
@@ -93,9 +91,7 @@
93
91
  muted: {
94
92
  $value: '{base.color.red.4}',
95
93
  $type: 'color',
96
- $extensions: {
97
- alpha: 0.4,
98
- },
94
+ alpha: 0.4,
99
95
  },
100
96
  emphasis: {
101
97
  $value: '{base.color.red.5}',
@@ -106,9 +102,7 @@
106
102
  muted: {
107
103
  $value: '{base.color.red.4}',
108
104
  $type: 'color',
109
- $extensions: {
110
- alpha: 0.4,
111
- },
105
+ alpha: 0.4,
112
106
  },
113
107
  emphasis: {
114
108
  $value: '{base.color.red.5}',
@@ -119,9 +113,7 @@
119
113
  muted: {
120
114
  $value: '{borderColor.default}',
121
115
  $type: 'color',
122
- $extensions: {
123
- alpha: 0.4,
124
- },
116
+ alpha: 0.4,
125
117
  },
126
118
  emphasis: {
127
119
  $value: '{borderColor.emphasis}',
@@ -134,18 +126,14 @@
134
126
  bgColor: {
135
127
  $value: '{base.color.blue.3}',
136
128
  $type: 'color',
137
- $extensions: {
138
- alpha: 0.3,
139
- },
129
+ alpha: 0.3,
140
130
  },
141
131
  },
142
132
  additionWord: {
143
133
  bgColor: {
144
134
  $value: '{base.color.blue.4}',
145
135
  $type: 'color',
146
- $extensions: {
147
- alpha: 0.4,
148
- },
136
+ alpha: 0.4,
149
137
  },
150
138
  },
151
139
  hunkNum: {
@@ -153,16 +141,12 @@
153
141
  rest: {
154
142
  $value: '{base.color.neutral.6}',
155
143
  $type: 'color',
156
- $extensions: {
157
- alpha: 1,
158
- },
144
+ alpha: 1,
159
145
  },
160
146
  hover: {
161
147
  $value: '{base.color.neutral.8}',
162
148
  $type: 'color',
163
- $extensions: {
164
- alpha: 1,
165
- },
149
+ alpha: 1,
166
150
  },
167
151
  },
168
152
  },
@@ -170,9 +154,7 @@
170
154
  bgColor: {
171
155
  $value: '{base.color.neutral.3}',
172
156
  $type: 'color',
173
- $extensions: {
174
- alpha: 1,
175
- },
157
+ alpha: 1,
176
158
  },
177
159
  },
178
160
  },
package/src/tokens/functional/color/dark/primitives-dark.json5 CHANGED
@@ -84,8 +84,8 @@
84
84
  disabled: {
85
85
  $value: '{base.color.neutral.8}',
86
86
  $type: 'color',
87
+ alpha: 0.6,
87
88
  $extensions: {
88
- alpha: 0.6,
89
89
  'org.primer.figma': {
90
90
  collection: 'mode',
91
91
 
@@ -592,8 +592,8 @@
592
592
  muted: {
593
593
  $value: '{base.color.red.4}',
594
594
  $type: 'color',
595
+ alpha: 0.1,
595
596
  $extensions: {
596
- alpha: 0.1,
597
597
  'org.primer.figma': {
598
598
  collection: 'mode',
599
599
 
@@ -625,8 +625,8 @@
625
625
  muted: {
626
626
  $value: '{bgColor.danger.muted}',
627
627
  $type: 'color',
628
+ alpha: 0.1,
628
629
  $extensions: {
629
- alpha: 0.1,
630
630
  'org.primer.figma': {
631
631
  collection: 'mode',
632
632
 
package/src/tokens/functional/color/light/app-light.json5 CHANGED
@@ -1,17 +1,4 @@
1
1
  {
2
- topicTag: {
3
- borderColor: {
4
- $value: '{base.color.transparent}',
5
- $type: 'color',
6
- $extensions: {
7
- 'org.primer.figma': {
8
- collection: 'mode',
9
- group: 'component',
10
- scopes: ['borderColor'],
11
- },
12
- },
13
- },
14
- },
15
2
  highlight: {
16
3
  neutral: {
17
4
  bgColor: {
package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 CHANGED
@@ -198,12 +198,6 @@
198
198
  alpha: 0.9,
199
199
  },
200
200
  },
201
- topicTag: {
202
- borderColor: {
203
- $value: '{borderColor.accent.emphasis}',
204
- $type: 'color',
205
- },
206
- },
207
201
  counter: {
208
202
  borderColor: {
209
203
  $value: '{borderColor.default}',
package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 CHANGED
@@ -80,9 +80,7 @@
80
80
  muted: {
81
81
  $value: '{borderColor.default}',
82
82
  $type: 'color',
83
- $extensions: {
84
- alpha: 0.4,
85
- },
83
+ alpha: 0.4,
86
84
  },
87
85
  emphasis: {
88
86
  $value: '{borderColor.emphasis}',
package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 CHANGED
@@ -102,9 +102,7 @@
102
102
  muted: {
103
103
  $value: '{borderColor.default}',
104
104
  $type: 'color',
105
- $extensions: {
106
- alpha: 0.4,
107
- },
105
+ alpha: 0.4,
108
106
  },
109
107
  emphasis: {
110
108
  $value: '{borderColor.emphasis}',