@primer/primitives 4.8.1 → 5.0.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 (37) hide show
  1. package/CHANGELOG.md +53 -0
  2. package/README.md +98 -3
  3. package/dist/deprecated/colors.json +1 -0
  4. package/dist/js/colors/dark.d.ts +47 -493
  5. package/dist/js/colors/dark.js +50 -584
  6. package/dist/js/colors/dark_dimmed.d.ts +47 -493
  7. package/dist/js/colors/dark_dimmed.js +51 -585
  8. package/dist/js/colors/dark_high_contrast.d.ts +47 -493
  9. package/dist/js/colors/dark_high_contrast.js +50 -584
  10. package/dist/js/colors/dark_protanopia.d.ts +47 -493
  11. package/dist/js/colors/dark_protanopia.js +50 -584
  12. package/dist/js/colors/index.d.ts +1419 -4095
  13. package/dist/js/colors/light.d.ts +47 -493
  14. package/dist/js/colors/light.js +50 -584
  15. package/dist/js/colors/light_protanopia.d.ts +47 -493
  16. package/dist/js/colors/light_protanopia.js +50 -584
  17. package/dist/js/index.d.ts +1419 -4095
  18. package/dist/json/colors/dark.json +50 -584
  19. package/dist/json/colors/dark_dimmed.json +51 -585
  20. package/dist/json/colors/dark_high_contrast.json +50 -584
  21. package/dist/json/colors/dark_protanopia.json +50 -584
  22. package/dist/json/colors/light.json +50 -584
  23. package/dist/json/colors/light_protanopia.json +50 -584
  24. package/dist/{deprecations → removed}/colors.json +0 -5
  25. package/dist/scss/colors/_dark.scss +27 -415
  26. package/dist/scss/colors/_dark_dimmed.scss +28 -416
  27. package/dist/scss/colors/_dark_high_contrast.scss +27 -415
  28. package/dist/scss/colors/_dark_protanopia.scss +27 -415
  29. package/dist/scss/colors/_light.scss +27 -415
  30. package/dist/scss/colors/_light_protanopia.scss +27 -415
  31. package/dist/ts/colors/dark.ts +50 -584
  32. package/dist/ts/colors/dark_dimmed.ts +51 -585
  33. package/dist/ts/colors/dark_high_contrast.ts +50 -584
  34. package/dist/ts/colors/dark_protanopia.ts +50 -584
  35. package/dist/ts/colors/light.ts +50 -584
  36. package/dist/ts/colors/light_protanopia.ts +50 -584
  37. package/package.json +1 -1
@@ -1,469 +1,11 @@
1
1
  declare const _default: {
2
- auto: {
3
- black: string;
4
- white: string;
5
- gray: string[];
6
- blue: string[];
7
- green: string[];
8
- yellow: string[];
9
- orange: string[];
10
- red: string[];
11
- purple: string[];
12
- pink: string[];
13
- };
14
- text: {
15
- primary: string;
16
- secondary: string;
17
- tertiary: string;
18
- placeholder: string;
19
- disabled: string;
20
- inverse: string;
21
- link: string;
22
- danger: string;
23
- success: string;
24
- warning: string;
25
- white: string;
26
- };
27
- icon: {
28
- primary: string;
29
- secondary: string;
30
- tertiary: string;
31
- info: string;
32
- danger: string;
33
- success: string;
34
- warning: string;
35
- };
36
- border: {
37
- primary: string;
38
- secondary: string;
39
- tertiary: string;
40
- overlay: string;
41
- inverse: string;
42
- info: string;
43
- danger: string;
44
- success: string;
45
- warning: string;
46
- default: string;
47
- muted: string;
48
- subtle: string;
49
- };
50
- bg: {
51
- canvas: string;
52
- canvasMobile: string;
53
- canvasInverse: string;
54
- canvasInset: string;
2
+ canvasDefaultTransparent: string;
3
+ marketingIcon: {
55
4
  primary: string;
56
5
  secondary: string;
57
- tertiary: string;
58
- overlay: string;
59
- backdrop: string;
60
- info: string;
61
- infoInverse: string;
62
- danger: string;
63
- dangerInverse: string;
64
- success: string;
65
- successInverse: string;
66
- warning: string;
67
- warningInverse: string;
68
- };
69
- shadow: {
70
- highlight: string;
71
- inset: string;
72
- small: string;
73
- medium: string;
74
- large: string;
75
- extraLarge: string;
76
- };
77
- state: {
78
- hover: {
79
- primaryBg: string;
80
- primaryBorder: string;
81
- primaryText: string;
82
- primaryIcon: string;
83
- secondaryBg: string;
84
- secondaryBorder: string;
85
- };
86
- selected: {
87
- primaryBg: string;
88
- primaryBorder: string;
89
- primaryText: string;
90
- primaryIcon: string;
91
- };
92
- focus: {
93
- border: string;
94
- shadow: string;
95
- };
96
- };
97
- fade: {
98
- fg10: string;
99
- fg15: string;
100
- fg30: string;
101
- fg50: string;
102
- fg70: string;
103
- fg85: string;
104
- black10: string;
105
- black15: string;
106
- black30: string;
107
- black50: string;
108
- black70: string;
109
- black85: string;
110
- white10: string;
111
- white15: string;
112
- white30: string;
113
- white50: string;
114
- white70: string;
115
- white85: string;
116
- };
117
- alert: {
118
- info: {
119
- text: string;
120
- icon: string;
121
- bg: string;
122
- border: string;
123
- };
124
- warn: {
125
- text: string;
126
- icon: string;
127
- bg: string;
128
- border: string;
129
- };
130
- error: {
131
- text: string;
132
- icon: string;
133
- bg: string;
134
- border: string;
135
- };
136
- success: {
137
- text: string;
138
- icon: string;
139
- bg: string;
140
- border: string;
141
- };
142
- };
143
- autocomplete: {
144
- shadow: string;
145
- rowBorder: string;
146
- };
147
- blankslate: {
148
- icon: string;
149
- };
150
- counter: {
151
- text: string;
152
- bg: string;
153
- primary: {
154
- text: string;
155
- bg: string;
156
- };
157
- secondary: {
158
- text: string;
159
- bg: string;
160
- };
161
- };
162
- box: {
163
- blueBorder: string;
164
- rowYellowBg: string;
165
- rowBlueBg: string;
166
- headerBlueBg: string;
167
- headerBlueBorder: string;
168
- borderInfo: string;
169
- bgInfo: string;
170
- borderWarning: string;
171
- bgWarning: string;
172
- };
173
- branchName: {
174
- text: string;
175
- icon: string;
176
- bg: string;
177
- link: {
178
- text: string;
179
- icon: string;
180
- bg: string;
181
- };
182
- };
183
- markdown: {
184
- codeBg: string;
185
- frameBorder: string;
186
- blockquoteBorder: string;
187
- tableBorder: string;
188
- tableTrBorder: string;
189
- };
190
- filterItem: {
191
- barBg: string;
192
- };
193
- hiddenTextExpander: {
194
- bg: string;
195
- bgHover: string;
196
- };
197
- dragAndDrop: {
198
- border: string;
199
- };
200
- uploadEnabled: {
201
- border: string;
202
- borderFocused: string;
203
- };
204
- previewableCommentForm: {
205
- border: string;
206
- };
207
- verifiedBadge: {
208
- text: string;
209
- bg: string;
210
- border: string;
211
- };
212
- socialCount: {
213
- bg: string;
214
- };
215
- tooltip: {
216
- text: string;
217
- bg: string;
218
- };
219
- filesExplorerIcon: string;
220
- hlAuthorBg: string;
221
- hlAuthorBorder: string;
222
- logoSubdued: string;
223
- discussionBorder: string;
224
- discussionBgSuccess: string;
225
- actionsWorkflowTableStickyBg: string;
226
- repoLanguageColorBorder: string;
227
- codeSelectionBg: string;
228
- highlight: {
229
- text: string;
230
- bg: string;
231
- };
232
- blob: {
233
- lineHighlightBg: string;
234
- lineHighlightBorder: string;
235
- };
236
- topicTag: {
237
- text: string;
238
- bg: string;
239
- hoverBg: string;
240
- activeBg: string;
241
- border: string;
242
- };
243
- footerInvertocat: {
244
- octicon: string;
245
- octiconHover: string;
246
- };
247
- dropdown: {
248
- shadow: string;
249
- };
250
- label: {
251
- border: string;
252
- primary: {
253
- text: string;
254
- border: string;
255
- };
256
- secondary: {
257
- text: string;
258
- border: string;
259
- };
260
- info: {
261
- text: string;
262
- border: string;
263
- };
264
- success: {
265
- text: string;
266
- border: string;
267
- };
268
- warning: {
269
- text: string;
270
- border: string;
271
- };
272
- danger: {
273
- text: string;
274
- border: string;
275
- };
276
- orange: {
277
- text: string;
278
- border: string;
279
- };
280
- };
281
- input: {
282
- bg: string;
283
- contrastBg: string;
284
- border: string;
285
- shadow: string;
286
- disabledBorder: string;
287
- warningBorder: string;
288
- errorBorder: string;
289
- tooltip: {
290
- success: {
291
- text: string;
292
- bg: string;
293
- border: string;
294
- };
295
- warning: {
296
- text: string;
297
- bg: string;
298
- border: string;
299
- };
300
- error: {
301
- text: string;
302
- bg: string;
303
- border: string;
304
- };
305
- };
306
- disabledBg: string;
307
- };
308
- toast: {
309
- text: string;
310
- bg: string;
311
- border: string;
312
- shadow: string;
313
- icon: string;
314
- iconBg: string;
315
- iconBorder: string;
316
- success: {
317
- text: string;
318
- border: string;
319
- icon: string;
320
- iconBg: string;
321
- iconBorder: string;
322
- };
323
- warning: {
324
- text: string;
325
- border: string;
326
- icon: string;
327
- iconBg: string;
328
- iconBorder: string;
329
- };
330
- danger: {
331
- text: string;
332
- border: string;
333
- icon: string;
334
- iconBg: string;
335
- iconBorder: string;
336
- };
337
- loading: {
338
- text: string;
339
- border: string;
340
- icon: string;
341
- iconBg: string;
342
- iconBorder: string;
343
- };
344
- };
345
- timeline: {
346
- text: string;
347
- badgeSuccessBorder: string;
348
- targetBadgeBorder: string;
349
- targetBadgeShadow: string;
350
- badgeBg: string;
351
- };
352
- diffstat: {
353
- neutralBg: string;
354
- neutralBorder: string;
355
- deletionBorder: string;
356
- additionBorder: string;
357
- deletionBg: string;
358
- additionBg: string;
359
- };
360
- diff: {
361
- addition: {
362
- text: string;
363
- bg: string;
364
- border: string;
365
- };
366
- deletion: {
367
- text: string;
368
- bg: string;
369
- border: string;
370
- };
371
- change: {
372
- text: string;
373
- bg: string;
374
- border: string;
375
- };
376
- };
377
- mergeBox: {
378
- successIconBg: string;
379
- successIconText: string;
380
- successIconBorder: string;
381
- successIndicatorBg: string;
382
- successIndicatorBorder: string;
383
- mergedIconBg: string;
384
- mergedIconText: string;
385
- mergedIconBorder: string;
386
- mergedBoxBorder: string;
387
- neutralIconBg: string;
388
- neutralIconText: string;
389
- neutralIconBorder: string;
390
- neutralIndicatorBg: string;
391
- neutralIndicatorBorder: string;
392
- warningIconBg: string;
393
- warningIconText: string;
394
- warningIconBorder: string;
395
- warningBoxBorder: string;
396
- warningMergeHighlight: string;
397
- errorIconBg: string;
398
- errorIconText: string;
399
- errorIconBorder: string;
400
- errorIndicatorBg: string;
401
- errorIndicatorBorder: string;
402
- };
403
- underlinenav: {
404
- border: string;
405
- borderHover: string;
406
- borderActive: string;
407
- text: string;
408
- textHover: string;
409
- textActive: string;
410
- icon: string;
411
- iconHover: string;
412
- iconActive: string;
413
- counterText: string;
414
- counterBg: string;
415
- };
416
- selectMenu: {
417
- borderSecondary: string;
418
- shadow: string;
419
- backdropBg: string;
420
- backdropBorder: string;
421
- tapHighlight: string;
422
- tapFocusBg: string;
423
- };
424
- sidenav: {
425
- borderActive: string;
426
- selectedBg: string;
427
- };
428
- menu: {
429
- headingText: string;
430
- borderActive: string;
431
- bgActive: string;
432
- };
433
- project: {
434
- cardBg: string;
435
- headerBg: string;
436
- sidebarBg: string;
437
- gradientIn: string;
438
- gradientOut: string;
439
- };
440
- prState: {
441
- draft: {
442
- text: string;
443
- bg: string;
444
- border: string;
445
- };
446
- open: {
447
- text: string;
448
- bg: string;
449
- border: string;
450
- };
451
- merged: {
452
- text: string;
453
- bg: string;
454
- border: string;
455
- };
456
- closed: {
457
- text: string;
458
- bg: string;
459
- border: string;
460
- };
461
6
  };
462
7
  diffBlob: {
463
- numText: string;
464
- numHoverText: string;
465
8
  addition: {
466
- numHoverText: string;
467
9
  numText: string;
468
10
  fg: string;
469
11
  numBg: string;
@@ -471,7 +13,6 @@ declare const _default: {
471
13
  wordBg: string;
472
14
  };
473
15
  deletion: {
474
- numHoverText: string;
475
16
  numText: string;
476
17
  fg: string;
477
18
  numBg: string;
@@ -479,45 +20,17 @@ declare const _default: {
479
20
  wordBg: string;
480
21
  };
481
22
  hunk: {
482
- text: string;
483
23
  numBg: string;
484
- lineBg: string;
485
24
  };
486
- emptyBlockBg: string;
487
- selectedLineHighlightBg: string;
488
- selectedLineHighlightBorder: string;
489
25
  expander: {
490
- hoverIcon: string;
491
- hoverBg: string;
492
- icon: string;
493
- };
494
- commentButton: {
495
26
  icon: string;
496
- bg: string;
497
- gradientBg: string;
498
27
  };
499
28
  selectedLineHighlightMixBlendMode: string;
500
29
  };
501
- globalNav: {
502
- logo: string;
503
- bg: string;
504
- text: string;
505
- icon: string;
506
- inputBg: string;
507
- inputBorder: string;
508
- inputIcon: string;
509
- inputPlaceholder: string;
510
- };
511
- introShelf: {
512
- gradientLeft: string;
513
- gradientRight: string;
514
- gradientIn: string;
515
- gradientOut: string;
516
- };
517
- canvasDefaultTransparent: string;
518
- marketingIcon: {
519
- primary: string;
520
- secondary: string;
30
+ diffstat: {
31
+ deletionBorder: string;
32
+ additionBorder: string;
33
+ additionBg: string;
521
34
  };
522
35
  searchKeyword: {
523
36
  hl: string;
@@ -656,6 +169,12 @@ declare const _default: {
656
169
  cyanBright: string;
657
170
  };
658
171
  };
172
+ project: {
173
+ headerBg: string;
174
+ sidebarBg: string;
175
+ gradientIn: string;
176
+ gradientOut: string;
177
+ };
659
178
  mktg: {
660
179
  success: string;
661
180
  info: string;
@@ -728,6 +247,14 @@ declare const _default: {
728
247
  stackFadeMore: string;
729
248
  childShadow: string;
730
249
  };
250
+ topicTag: {
251
+ border: string;
252
+ };
253
+ selectMenu: {
254
+ backdropBorder: string;
255
+ tapHighlight: string;
256
+ tapFocusBg: string;
257
+ };
731
258
  overlay: {
732
259
  shadow: string;
733
260
  };
@@ -740,6 +267,18 @@ declare const _default: {
740
267
  bg: string;
741
268
  border: string;
742
269
  };
270
+ sidenav: {
271
+ selectedBg: string;
272
+ };
273
+ menu: {
274
+ bgActive: string;
275
+ };
276
+ input: {
277
+ disabledBg: string;
278
+ };
279
+ timeline: {
280
+ badgeBg: string;
281
+ };
743
282
  ansi: {
744
283
  black: string;
745
284
  blackBright: string;
@@ -836,6 +375,10 @@ declare const _default: {
836
375
  icon: string;
837
376
  };
838
377
  };
378
+ underlinenav: {
379
+ icon: string;
380
+ borderHover: string;
381
+ };
839
382
  fg: {
840
383
  default: string;
841
384
  muted: string;
@@ -848,6 +391,17 @@ declare const _default: {
848
391
  inset: string;
849
392
  subtle: string;
850
393
  };
394
+ border: {
395
+ default: string;
396
+ muted: string;
397
+ subtle: string;
398
+ };
399
+ shadow: {
400
+ small: string;
401
+ medium: string;
402
+ large: string;
403
+ extraLarge: string;
404
+ };
851
405
  neutral: {
852
406
  emphasisPlus: string;
853
407
  emphasis: string;