@primer/stylelint-config 12.7.1-rc.59e46db → 12.7.1-rc.c4a4e27

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.
package/CHANGELOG.md CHANGED
@@ -4,7 +4,11 @@
4
4
 
5
5
  ### Patch Changes
6
6
 
7
- - [`726d7d1`](https://github.com/primer/stylelint-config/commit/726d7d1bf4eac82a032c448cb0be32d5bf66b29a) Thanks [@jonrohan](https://github.com/jonrohan)! - Updating no-deprecated-colors for primitives v8
7
+ - [#328](https://github.com/primer/stylelint-config/pull/328) [`5ae7400`](https://github.com/primer/stylelint-config/commit/5ae7400340afc2cd21006093ce7b33206a00372e) Thanks [@langermank](https://github.com/langermank)! - Fix failing tests in no-deprecated-colors
8
+
9
+ - [#332](https://github.com/primer/stylelint-config/pull/332) [`6485cf0`](https://github.com/primer/stylelint-config/commit/6485cf053f502d71a8ce8c407ad01a939038959c) Thanks [@langermank](https://github.com/langermank)! - Updated deprecated json color file
10
+
11
+ - [#322](https://github.com/primer/stylelint-config/pull/322) [`726d7d1`](https://github.com/primer/stylelint-config/commit/726d7d1bf4eac82a032c448cb0be32d5bf66b29a) Thanks [@jonrohan](https://github.com/jonrohan)! - Updating no-deprecated-colors for primitives v8
8
12
 
9
13
  ## 12.7.0
10
14
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/stylelint-config",
3
- "version": "12.7.1-rc.59e46db",
3
+ "version": "12.7.1-rc.c4a4e27",
4
4
  "description": "Sharable stylelint config used by GitHub's CSS",
5
5
  "homepage": "http://primer.style/css/tools/linting",
6
6
  "author": "GitHub, Inc.",
@@ -0,0 +1,1306 @@
1
+ {
2
+ "--color-page-header-bg": [
3
+ {
4
+ "props": ["background"],
5
+ "replacement": "--page-header-bgColor"
6
+ }
7
+ ],
8
+ "--color-diff-blob-addition-num-text": [
9
+ {
10
+ "props": ["color", "fill"],
11
+ "replacement": "--diffBlob-addition-fgColor-num"
12
+ }
13
+ ],
14
+ "--color-diff-blob-addition-fg": [
15
+ {
16
+ "props": ["color", "fill"],
17
+ "replacement": "--diffBlob-addition-fgColor-text"
18
+ }
19
+ ],
20
+ "--color-diff-blob-addition-num-bg": [
21
+ {
22
+ "props": ["background"],
23
+ "replacement": "--diffBlob-addition-bgColor-num"
24
+ }
25
+ ],
26
+ "--color-diff-blob-addition-line-bg": [
27
+ {
28
+ "props": ["background"],
29
+ "replacement": "--diffBlob-addition-bgColor-line"
30
+ }
31
+ ],
32
+ "--color-diff-blob-addition-word-bg": [
33
+ {
34
+ "props": ["background"],
35
+ "replacement": "--diffBlob-addition-bgColor-word"
36
+ }
37
+ ],
38
+ "--color-diff-blob-deletion-num-text": [
39
+ {
40
+ "props": ["color", "fill"],
41
+ "replacement": "--diffBlob-deletion-fgColor-num"
42
+ }
43
+ ],
44
+ "--color-diff-blob-deletion-fg": [
45
+ {
46
+ "props": ["color", "fill"],
47
+ "replacement": "--diffBlob-deletion-fgColor-text"
48
+ }
49
+ ],
50
+ "--color-diff-blob-deletion-num-bg": [
51
+ {
52
+ "props": ["background"],
53
+ "replacement": "--diffBlob-deletion-bgColor-num"
54
+ }
55
+ ],
56
+ "--color-diff-blob-deletion-line-bg": [
57
+ {
58
+ "props": ["background"],
59
+ "replacement": "--diffBlob-deletion-bgColor-line"
60
+ }
61
+ ],
62
+ "--color-diff-blob-deletion-word-bg": [
63
+ {
64
+ "props": ["background"],
65
+ "replacement": "--diffBlob-deletion-bgColor-word"
66
+ }
67
+ ],
68
+ "--color-diff-blob-hunk-num-bg": [
69
+ {
70
+ "props": ["background"],
71
+ "replacement": "--diffBlob-hunk-bgColor-num"
72
+ }
73
+ ],
74
+ "--color-diff-blob-expander-icon": [
75
+ {
76
+ "props": ["color", "fill"],
77
+ "replacement": "--diffBlob-expander-iconColor"
78
+ }
79
+ ],
80
+ "--color-diffstat-deletion-border": [],
81
+ "--color-diffstat-addition-border": [],
82
+ "--color-diffstat-addition-bg": [
83
+ {
84
+ "props": ["background"],
85
+ "replacement": "--diffStat-addition-bgColor"
86
+ }
87
+ ],
88
+ "--color-search-keyword-hl": [
89
+ {
90
+ "props": ["background"],
91
+ "replacement": "--highlight-neutral-bgColor"
92
+ }
93
+ ],
94
+ "--color-codemirror-text": [
95
+ {
96
+ "props": ["color", "fill"],
97
+ "replacement": "--codeMirror-fgColor"
98
+ }
99
+ ],
100
+ "--color-codemirror-bg": [
101
+ {
102
+ "props": ["background"],
103
+ "replacement": "--codeMirror-bgColor"
104
+ }
105
+ ],
106
+ "--color-codemirror-gutters-bg": [
107
+ {
108
+ "props": ["background"],
109
+ "replacement": "--codeMirror-gutters-bgColor"
110
+ }
111
+ ],
112
+ "--color-codemirror-guttermarker-text": [
113
+ {
114
+ "props": ["color", "fill"],
115
+ "replacement": "--codeMirror-gutterMarker-fgColor-default"
116
+ }
117
+ ],
118
+ "--color-codemirror-guttermarker-subtle-text": [
119
+ {
120
+ "props": ["color", "fill"],
121
+ "replacement": "--codeMirror-gutterMarker-fgColor-muted"
122
+ }
123
+ ],
124
+ "--color-codemirror-linenumber-text": [
125
+ {
126
+ "props": ["color", "fill"],
127
+ "replacement": "--codeMirror-lineNumber-fgColor"
128
+ }
129
+ ],
130
+ "--color-codemirror-cursor": [
131
+ {
132
+ "props": ["color", "fill"],
133
+ "replacement": "--codeMirror-cursor-fgColor"
134
+ }
135
+ ],
136
+ "--color-codemirror-selection-bg": [
137
+ {
138
+ "props": ["background"],
139
+ "replacement": "--codeMirror-selection-bgColor"
140
+ }
141
+ ],
142
+ "--color-codemirror-activeline-bg": [
143
+ {
144
+ "props": ["background"],
145
+ "replacement": "--codeMirror-activeline-bgColor"
146
+ }
147
+ ],
148
+ "--color-codemirror-matchingbracket-text": [
149
+ {
150
+ "props": ["color", "fill"],
151
+ "replacement": "--codeMirror-matchingBracket-fgColor"
152
+ }
153
+ ],
154
+ "--color-codemirror-lines-bg": [
155
+ {
156
+ "props": ["background"],
157
+ "replacement": "--codeMirror-lines-bgColor"
158
+ }
159
+ ],
160
+ "--color-codemirror-syntax-comment": [
161
+ {
162
+ "props": ["color", "fill"],
163
+ "replacement": "--codeMirror-syntax-fgColor-comment"
164
+ }
165
+ ],
166
+ "--color-codemirror-syntax-constant": [
167
+ {
168
+ "props": ["color", "fill"],
169
+ "replacement": "--codeMirror-syntax-fgColor-constant"
170
+ }
171
+ ],
172
+ "--color-codemirror-syntax-entity": [
173
+ {
174
+ "props": ["color", "fill"],
175
+ "replacement": "--codeMirror-syntax-fgColor-entity"
176
+ }
177
+ ],
178
+ "--color-codemirror-syntax-keyword": [
179
+ {
180
+ "props": ["color", "fill"],
181
+ "replacement": "--codeMirror-syntax-fgColor-keyword"
182
+ }
183
+ ],
184
+ "--color-codemirror-syntax-storage": [
185
+ {
186
+ "props": ["color", "fill"],
187
+ "replacement": "--codeMirror-syntax-fgColor-storage"
188
+ }
189
+ ],
190
+ "--color-codemirror-syntax-string": [
191
+ {
192
+ "props": ["color", "fill"],
193
+ "replacement": "--codeMirror-syntax-fgColor-string"
194
+ }
195
+ ],
196
+ "--color-codemirror-syntax-support": [
197
+ {
198
+ "props": ["color", "fill"],
199
+ "replacement": "--codeMirror-syntax-fgColor-support"
200
+ }
201
+ ],
202
+ "--color-codemirror-syntax-variable": [
203
+ {
204
+ "props": ["color", "fill"],
205
+ "replacement": "--codeMirror-syntax-fgColor-variable"
206
+ }
207
+ ],
208
+ "--color-header-text": [
209
+ {
210
+ "props": ["color", "fill"],
211
+ "replacement": "--header-fgColor-default"
212
+ }
213
+ ],
214
+ "--color-header-bg": [
215
+ {
216
+ "props": ["background"],
217
+ "replacement": "--header-bgColor"
218
+ }
219
+ ],
220
+ "--color-header-divider": [
221
+ {
222
+ "props": ["border", "background"],
223
+ "replacement": "--header-borderColor-divider"
224
+ }
225
+ ],
226
+ "--color-header-logo": [
227
+ {
228
+ "props": ["color", "fill"],
229
+ "replacement": "--header-fgColor-logo"
230
+ }
231
+ ],
232
+ "--color-header-search-bg": [
233
+ {
234
+ "props": ["background"],
235
+ "replacement": "--headerSearch-bgColor"
236
+ }
237
+ ],
238
+ "--color-header-search-border": [
239
+ {
240
+ "props": ["border", "background"],
241
+ "replacement": "--headerSearch-borderColor"
242
+ }
243
+ ],
244
+ "--color-avatar-bg": [
245
+ {
246
+ "props": ["background"],
247
+ "replacement": "--avatar-bgColor"
248
+ }
249
+ ],
250
+ "--color-avatar-border": [
251
+ {
252
+ "props": ["border", "background"],
253
+ "replacement": "--avatar-borderColor"
254
+ }
255
+ ],
256
+ "--color-avatar-stack-fade": [
257
+ {
258
+ "props": ["background"],
259
+ "replacement": "--avatarStack-fade-bgColor-default"
260
+ }
261
+ ],
262
+ "--color-avatar-stack-fade-more": [
263
+ {
264
+ "props": ["background"],
265
+ "replacement": "--avatarStack-fade-bgColor-muted"
266
+ }
267
+ ],
268
+ "--color-topic-tag-border": [
269
+ {
270
+ "props": ["border", "background"],
271
+ "replacement": "--topicTag-borderColor"
272
+ }
273
+ ],
274
+ "--color-counter-border": [
275
+ {
276
+ "props": ["border", "background"],
277
+ "replacement": "--counter-borderColor"
278
+ }
279
+ ],
280
+ "--color-select-menu-backdrop-border": [
281
+ {
282
+ "props": ["border", "background"],
283
+ "replacement": "--selectMenu-borderColor"
284
+ }
285
+ ],
286
+ "--color-select-menu-tap-highlight": [
287
+ {
288
+ "props": ["background"],
289
+ "replacement": "--control-bgColor-active"
290
+ }
291
+ ],
292
+ "--color-select-menu-tap-focus-bg": [
293
+ {
294
+ "props": ["background"],
295
+ "replacement": "--selectMenu-bgColor-active"
296
+ }
297
+ ],
298
+ "--color-sidenav-selected-bg": [
299
+ {
300
+ "props": ["background"],
301
+ "replacement": "--sideNav-bgColor-selected"
302
+ }
303
+ ],
304
+ "--color-menu-bg-active": [
305
+ {
306
+ "props": ["background"],
307
+ "replacement": "--menu-bgColor-active"
308
+ }
309
+ ],
310
+ "--color-input-disabled-bg": [
311
+ {
312
+ "props": ["background"],
313
+ "replacement": "--control-bgColor-disabled"
314
+ }
315
+ ],
316
+ "--color-timeline-badge-bg": [
317
+ {
318
+ "props": ["background"],
319
+ "replacement": "--timelineBadge-bgColor"
320
+ }
321
+ ],
322
+ "--color-btn-bg": [
323
+ {
324
+ "props": ["background"],
325
+ "replacement": "--button-default-bgColor-rest"
326
+ }
327
+ ],
328
+ "--color-btn-border": [
329
+ {
330
+ "props": ["border", "background"],
331
+ "replacement": "--button-default-borderColor-rest"
332
+ }
333
+ ],
334
+ "--color-btn-hover-bg": [
335
+ {
336
+ "props": ["background"],
337
+ "replacement": "--button-default-bgColor-hover"
338
+ }
339
+ ],
340
+ "--color-btn-hover-border": [
341
+ {
342
+ "props": ["border", "background"],
343
+ "replacement": "--button-default-borderColor-hover"
344
+ }
345
+ ],
346
+ "--color-btn-active-bg": [
347
+ {
348
+ "props": ["background"],
349
+ "replacement": "--button-default-bgColor-active"
350
+ }
351
+ ],
352
+ "--color-btn-active-border": [
353
+ {
354
+ "props": ["border", "background"],
355
+ "replacement": "--button-default-borderColor-active"
356
+ }
357
+ ],
358
+ "--color-btn-selected-bg": [
359
+ {
360
+ "props": ["background"],
361
+ "replacement": "--button-default-bgColor-selected"
362
+ }
363
+ ],
364
+ "--color-btn-counter-bg": [
365
+ {
366
+ "props": ["background"],
367
+ "replacement": "--buttonCounter-default-bgColor-rest"
368
+ }
369
+ ],
370
+ "--color-btn-primary-text": [
371
+ {
372
+ "props": ["color", "fill"],
373
+ "replacement": "--button-primary-fgColor-rest"
374
+ }
375
+ ],
376
+ "--color-btn-primary-bg": [
377
+ {
378
+ "props": ["background"],
379
+ "replacement": "--button-primary-bgColor-rest"
380
+ }
381
+ ],
382
+ "--color-btn-primary-border": [
383
+ {
384
+ "props": ["border", "background"],
385
+ "replacement": "--button-primary-borderColor-rest"
386
+ }
387
+ ],
388
+ "--color-btn-primary-hover-bg": [
389
+ {
390
+ "props": ["background"],
391
+ "replacement": "--button-primary-bgColor-hover"
392
+ }
393
+ ],
394
+ "--color-btn-primary-hover-border": [
395
+ {
396
+ "props": ["border", "background"],
397
+ "replacement": "--button-primary-borderColor-hover"
398
+ }
399
+ ],
400
+ "--color-btn-primary-selected-bg": [
401
+ {
402
+ "props": ["background"],
403
+ "replacement": "--button-primary-bgColor-active"
404
+ }
405
+ ],
406
+ "--color-btn-primary-disabled-text": [
407
+ {
408
+ "props": ["color", "fill"],
409
+ "replacement": "--button-primary-fgColor-disabled"
410
+ }
411
+ ],
412
+ "--color-btn-primary-disabled-bg": [
413
+ {
414
+ "props": ["background"],
415
+ "replacement": "--button-primary-bgColor-disabled"
416
+ }
417
+ ],
418
+ "--color-btn-primary-disabled-border": [
419
+ {
420
+ "props": ["border", "background"],
421
+ "replacement": "--button-primary-borderColor-disabled"
422
+ }
423
+ ],
424
+ "--color-btn-primary-icon": [
425
+ {
426
+ "props": ["color", "fill"],
427
+ "replacement": "--button-primary-iconColor-rest"
428
+ }
429
+ ],
430
+ "--color-btn-primary-counter-bg": [
431
+ {
432
+ "props": ["background"],
433
+ "replacement": "--buttonCounter-primary-bgColor-rest"
434
+ }
435
+ ],
436
+ "--color-btn-outline-text": [
437
+ {
438
+ "props": ["color", "fill"],
439
+ "replacement": "--button-outline-fgColor-rest"
440
+ }
441
+ ],
442
+ "--color-btn-outline-hover-text": [
443
+ {
444
+ "props": ["color", "fill"],
445
+ "replacement": "--button-outline-fgColor-hover"
446
+ }
447
+ ],
448
+ "--color-btn-outline-hover-bg": [
449
+ {
450
+ "props": ["background"],
451
+ "replacement": "--button-outline-bgColor-hover"
452
+ }
453
+ ],
454
+ "--color-btn-outline-hover-border": [
455
+ {
456
+ "props": ["border", "background"],
457
+ "replacement": "--button-outline-borderColor-hover"
458
+ }
459
+ ],
460
+ "--color-btn-outline-hover-counter-bg": [
461
+ {
462
+ "props": ["background"],
463
+ "replacement": "--buttonCounter-outline-bgColor-hover"
464
+ }
465
+ ],
466
+ "--color-btn-outline-selected-text": [
467
+ {
468
+ "props": ["color", "fill"],
469
+ "replacement": "--button-outline-fgColor-active"
470
+ }
471
+ ],
472
+ "--color-btn-outline-selected-bg": [
473
+ {
474
+ "props": ["background"],
475
+ "replacement": "--button-outline-bgColor-active"
476
+ }
477
+ ],
478
+ "--color-btn-outline-selected-border": [
479
+ {
480
+ "props": ["border", "background"],
481
+ "replacement": "--button-outline-borderColor-active"
482
+ }
483
+ ],
484
+ "--color-btn-outline-disabled-text": [
485
+ {
486
+ "props": ["color", "fill"],
487
+ "replacement": "--button-outline-fgColor-disabled"
488
+ }
489
+ ],
490
+ "--color-btn-outline-disabled-bg": [
491
+ {
492
+ "props": ["background"],
493
+ "replacement": "--button-outline-bgColor-disabled"
494
+ }
495
+ ],
496
+ "--color-btn-outline-disabled-counter-bg": [
497
+ {
498
+ "props": ["background"],
499
+ "replacement": "--buttonCounter-outline-bgColor-disabled"
500
+ }
501
+ ],
502
+ "--color-btn-outline-counter-bg": [
503
+ {
504
+ "props": ["background"],
505
+ "replacement": "--buttonCounter-outline-bgColor-rest"
506
+ }
507
+ ],
508
+ "--color-btn-danger-text": [
509
+ {
510
+ "props": ["color", "fill"],
511
+ "replacement": "--button-danger-fgColor-rest"
512
+ }
513
+ ],
514
+ "--color-btn-danger-hover-text": [
515
+ {
516
+ "props": ["color", "fill"],
517
+ "replacement": "--button-danger-fgColor-hover"
518
+ }
519
+ ],
520
+ "--color-btn-danger-hover-bg": [
521
+ {
522
+ "props": ["background"],
523
+ "replacement": "--button-danger-bgColor-hover"
524
+ }
525
+ ],
526
+ "--color-btn-danger-hover-border": [
527
+ {
528
+ "props": ["border", "background"],
529
+ "replacement": "--button-danger-borderColor-hover"
530
+ }
531
+ ],
532
+ "--color-btn-danger-hover-counter-bg": [
533
+ {
534
+ "props": ["background"],
535
+ "replacement": "--buttonCounter-danger-bgColor-hover"
536
+ }
537
+ ],
538
+ "--color-btn-danger-selected-text": [
539
+ {
540
+ "props": ["color", "fill"],
541
+ "replacement": "--button-danger-fgColor-active"
542
+ }
543
+ ],
544
+ "--color-btn-danger-selected-bg": [
545
+ {
546
+ "props": ["background"],
547
+ "replacement": "--button-danger-bgColor-active"
548
+ }
549
+ ],
550
+ "--color-btn-danger-selected-border": [
551
+ {
552
+ "props": ["border", "background"],
553
+ "replacement": "--button-danger-borderColor-active"
554
+ }
555
+ ],
556
+ "--color-btn-danger-disabled-text": [
557
+ {
558
+ "props": ["color", "fill"],
559
+ "replacement": "--button-danger-fgColor-disabled"
560
+ }
561
+ ],
562
+ "--color-btn-danger-disabled-bg": [
563
+ {
564
+ "props": ["background"],
565
+ "replacement": "--button-danger-bgColor-disabled"
566
+ }
567
+ ],
568
+ "--color-btn-danger-disabled-counter-bg": [
569
+ {
570
+ "props": ["background"],
571
+ "replacement": "--buttonCounter-danger-bgColor-disabled"
572
+ }
573
+ ],
574
+ "--color-btn-danger-counter-bg": [
575
+ {
576
+ "props": ["background"],
577
+ "replacement": "--buttonCounter-danger-bgColor-rest"
578
+ }
579
+ ],
580
+ "--color-btn-danger-icon": [
581
+ {
582
+ "props": ["color", "fill"],
583
+ "replacement": "--button-danger-iconColor-rest"
584
+ }
585
+ ],
586
+ "--color-btn-danger-hover-icon": [
587
+ {
588
+ "props": ["color", "fill"],
589
+ "replacement": "--button-danger-iconColor-hover"
590
+ }
591
+ ],
592
+ "--color-underlinenav-icon": [
593
+ {
594
+ "props": ["color", "fill"],
595
+ "replacement": "--underlineNav-iconColor-rest"
596
+ }
597
+ ],
598
+ "--color-underlinenav-border-hover": [
599
+ {
600
+ "props": ["border", "background"],
601
+ "replacement": "--underlineNav-borderColor-hover"
602
+ }
603
+ ],
604
+ "--color-action-list-item-inline-divider": [
605
+ {
606
+ "props": ["border", "background"],
607
+ "replacement": "--borderColor-decorative"
608
+ }
609
+ ],
610
+ "--color-action-list-item-default-hover-bg": [
611
+ {
612
+ "props": ["background"],
613
+ "replacement": "--control-transparent-bgColor-hover"
614
+ }
615
+ ],
616
+ "--color-action-list-item-default-hover-border": [
617
+ {
618
+ "props": ["border", "background"],
619
+ "replacement": "--control-transparent-borderColor-hover"
620
+ }
621
+ ],
622
+ "--color-action-list-item-default-active-bg": [
623
+ {
624
+ "props": ["background"],
625
+ "replacement": "--control-transparent-bgColor-active"
626
+ }
627
+ ],
628
+ "--color-action-list-item-default-active-border": [
629
+ {
630
+ "props": ["border", "background"],
631
+ "replacement": "--control-transparent-borderColor-active"
632
+ }
633
+ ],
634
+ "--color-action-list-item-default-selected-bg": [
635
+ {
636
+ "props": ["background"],
637
+ "replacement": "--control-transparent-bgColor-selected"
638
+ }
639
+ ],
640
+ "--color-action-list-item-danger-hover-bg": [
641
+ {
642
+ "props": ["background"],
643
+ "replacement": "--control-danger-bgColor-hover"
644
+ }
645
+ ],
646
+ "--color-action-list-item-danger-active-bg": [
647
+ {
648
+ "props": ["background"],
649
+ "replacement": "--control-danger-bgColor-active"
650
+ }
651
+ ],
652
+ "--color-action-list-item-danger-hover-text": [
653
+ {
654
+ "props": ["color", "fill"],
655
+ "replacement": "--control-danger-fgColor-hover"
656
+ }
657
+ ],
658
+ "--color-switch-track-bg": [
659
+ {
660
+ "props": ["background"],
661
+ "replacement": "--controlTrack-bgColor-rest"
662
+ }
663
+ ],
664
+ "--color-switch-track-hover-bg": [
665
+ {
666
+ "props": ["background"],
667
+ "replacement": "--controlTrack-bgColor-hover"
668
+ }
669
+ ],
670
+ "--color-switch-track-active-bg": [
671
+ {
672
+ "props": ["background"],
673
+ "replacement": "--controlTrack-bgColor-active"
674
+ }
675
+ ],
676
+ "--color-switch-track-disabled-bg": [
677
+ {
678
+ "props": ["background"],
679
+ "replacement": "--controlTrack-bgColor-disabled"
680
+ }
681
+ ],
682
+ "--color-switch-track-fg": [
683
+ {
684
+ "props": ["color", "fill"],
685
+ "replacement": "--controlTrack-fgColor-rest"
686
+ }
687
+ ],
688
+ "--color-switch-track-disabled-fg": [
689
+ {
690
+ "props": ["color", "fill"],
691
+ "replacement": "--controlTrack-fgColor-disabled"
692
+ }
693
+ ],
694
+ "--color-switch-track-border": [
695
+ {
696
+ "props": ["border", "background"],
697
+ "replacement": "--controlTrack-borderColor-rest"
698
+ }
699
+ ],
700
+ "--color-switch-track-checked-bg": [
701
+ {
702
+ "props": ["background"],
703
+ "replacement": "--control-checked-bgColor-rest"
704
+ }
705
+ ],
706
+ "--color-switch-track-checked-hover-bg": [
707
+ {
708
+ "props": ["background"],
709
+ "replacement": "--control-checked-bgColor-hover"
710
+ }
711
+ ],
712
+ "--color-switch-track-checked-active-bg": [
713
+ {
714
+ "props": ["background"],
715
+ "replacement": "--control-checked-bgColor-active"
716
+ }
717
+ ],
718
+ "--color-switch-track-checked-fg": [
719
+ {
720
+ "props": ["color", "fill"],
721
+ "replacement": "--control-checked-fgColor-rest"
722
+ }
723
+ ],
724
+ "--color-switch-track-checked-disabled-fg": [
725
+ {
726
+ "props": ["color", "fill"],
727
+ "replacement": "--control-checked-fgColor-disabled"
728
+ }
729
+ ],
730
+ "--color-switch-track-checked-border": [],
731
+ "--color-switch-knob-bg": [
732
+ {
733
+ "props": ["background"],
734
+ "replacement": "--controlKnob-bgColor-rest"
735
+ }
736
+ ],
737
+ "--color-switch-knob-disabled-bg": [
738
+ {
739
+ "props": ["background"],
740
+ "replacement": "--controlKnob-bgColor-disabled"
741
+ }
742
+ ],
743
+ "--color-switch-knob-border": [
744
+ {
745
+ "props": ["border", "background"],
746
+ "replacement": "--controlKnob-borderColor-rest"
747
+ }
748
+ ],
749
+ "--color-switch-knob-checked-bg": [
750
+ {
751
+ "props": ["background"],
752
+ "replacement": "--controlKnob-bgColor-checked"
753
+ }
754
+ ],
755
+ "--color-switch-knob-checked-disabled-bg": [
756
+ {
757
+ "props": ["background"],
758
+ "replacement": "--controlKnob-bgColor-disabled"
759
+ }
760
+ ],
761
+ "--color-switch-knob-checked-border": [
762
+ {
763
+ "props": ["border", "background"],
764
+ "replacement": "--controlKnob-borderColor-checked"
765
+ }
766
+ ],
767
+ "--color-segmented-control-bg": [
768
+ {
769
+ "props": ["background"],
770
+ "replacement": "--controlTrack-bgColor-rest"
771
+ }
772
+ ],
773
+ "--color-segmented-control-button-bg": [
774
+ {
775
+ "props": ["background"],
776
+ "replacement": "--controlKnob-bgColor-rest"
777
+ }
778
+ ],
779
+ "--color-segmented-control-button-hover-bg": [
780
+ {
781
+ "props": ["background"],
782
+ "replacement": "--controlTrack-bgColor-hover"
783
+ }
784
+ ],
785
+ "--color-segmented-control-button-active-bg": [
786
+ {
787
+ "props": ["background"],
788
+ "replacement": "--controlTrack-bgColor-active"
789
+ }
790
+ ],
791
+ "--color-segmented-control-button-selected-border": [
792
+ {
793
+ "props": ["border", "background"],
794
+ "replacement": "--controlKnob-borderColor-rest"
795
+ }
796
+ ],
797
+ "--color-tree-view-item-chevron-hover-bg": [
798
+ {
799
+ "props": ["background"],
800
+ "replacement": "--control-transparent-bgColor-hover"
801
+ }
802
+ ],
803
+ "--color-tree-view-item-directory-fill": [
804
+ {
805
+ "props": ["background"],
806
+ "replacement": "--treeViewItem-leadingVisual-bgColor-rest"
807
+ }
808
+ ],
809
+ "--color-canvas-default-transparent": [],
810
+ "--color-fg-default": [
811
+ {
812
+ "props": ["color", "fill"],
813
+ "replacement": "--fgColor-default"
814
+ }
815
+ ],
816
+ "--color-fg-muted": [
817
+ {
818
+ "props": ["color", "fill"],
819
+ "replacement": "--fgColor-muted"
820
+ }
821
+ ],
822
+ "--color-fg-subtle": [
823
+ {
824
+ "props": ["color", "fill"],
825
+ "replacement": "--fgColor-muted"
826
+ }
827
+ ],
828
+ "--color-fg-on-emphasis": [
829
+ {
830
+ "props": ["color", "fill"],
831
+ "replacement": "--fgColor-onEmphasis"
832
+ }
833
+ ],
834
+ "--color-canvas-default": [
835
+ {
836
+ "props": ["background"],
837
+ "replacement": "--bgColor-default"
838
+ }
839
+ ],
840
+ "--color-canvas-overlay": [
841
+ {
842
+ "props": ["background"],
843
+ "replacement": "--overlay-bgColor"
844
+ }
845
+ ],
846
+ "--color-canvas-inset": [
847
+ {
848
+ "props": ["background"],
849
+ "replacement": "--bgColor-muted"
850
+ }
851
+ ],
852
+ "--color-canvas-subtle": [
853
+ {
854
+ "props": ["background"],
855
+ "replacement": "--bgColor-muted"
856
+ }
857
+ ],
858
+ "--color-border-default": [
859
+ {
860
+ "props": ["border", "background", "box-shadow"],
861
+ "replacement": "--borderColor-default"
862
+ }
863
+ ],
864
+ "--color-border-muted": [
865
+ {
866
+ "props": ["border", "background"],
867
+ "replacement": "--borderColor-muted"
868
+ }
869
+ ],
870
+ "--color-border-subtle": [
871
+ {
872
+ "props": ["border", "background"],
873
+ "replacement": "--borderColor-muted"
874
+ }
875
+ ],
876
+ "--color-neutral-emphasis-plus": [
877
+ {
878
+ "props": ["background", "border", "color"],
879
+ "replacement": "--bgColor-emphasis"
880
+ }
881
+ ],
882
+ "--color-neutral-emphasis": [
883
+ {
884
+ "props": ["background"],
885
+ "replacement": "--bgColor-neutral-emphasis"
886
+ },
887
+ {
888
+ "props": ["border"],
889
+ "replacement": "--borderColor-neutral-emphasis"
890
+ }
891
+ ],
892
+ "--color-neutral-muted": [
893
+ {
894
+ "props": ["border"],
895
+ "replacement": "--borderColor-neutral-muted"
896
+ },
897
+ {
898
+ "props": ["background"],
899
+ "replacement": "--bgColor-neutral-muted"
900
+ }
901
+ ],
902
+ "--color-neutral-subtle": [
903
+ {
904
+ "props": ["background"],
905
+ "replacement": "--bgColor-neutral-muted"
906
+ }
907
+ ],
908
+ "--color-accent-fg": [
909
+ {
910
+ "props": ["color", "fill"],
911
+ "replacement": "--fgColor-accent"
912
+ },
913
+ {
914
+ "props": ["border"],
915
+ "replacement": "--borderColor-accent-emphasis"
916
+ }
917
+ ],
918
+ "--color-accent-emphasis": [
919
+ {
920
+ "props": ["background"],
921
+ "replacement": "--bgColor-accent-emphasis"
922
+ },
923
+ {
924
+ "props": ["border"],
925
+ "replacement": "--borderColor-accent-emphasis"
926
+ },
927
+ {
928
+ "props": ["color", "fill"],
929
+ "replacement": "--fgColor-accent"
930
+ }
931
+ ],
932
+ "--color-accent-muted": [
933
+ {
934
+ "props": ["border"],
935
+ "replacement": "--borderColor-accent-muted"
936
+ }
937
+ ],
938
+ "--color-accent-subtle": [
939
+ {
940
+ "props": ["background"],
941
+ "replacement": "--bgColor-accent-muted"
942
+ }
943
+ ],
944
+ "--color-success-fg": [
945
+ {
946
+ "props": ["color", "fill"],
947
+ "replacement": "--fgColor-success"
948
+ }
949
+ ],
950
+ "--color-success-emphasis": [
951
+ {
952
+ "props": ["background"],
953
+ "replacement": "--bgColor-success-emphasis"
954
+ },
955
+ {
956
+ "props": ["border"],
957
+ "replacement": "--borderColor-success-emphasis"
958
+ }
959
+ ],
960
+ "--color-success-muted": [
961
+ {
962
+ "props": ["border"],
963
+ "replacement": "--borderColor-success-muted"
964
+ }
965
+ ],
966
+ "--color-success-subtle": [
967
+ {
968
+ "props": ["background"],
969
+ "replacement": "--bgColor-success-muted"
970
+ }
971
+ ],
972
+ "--color-attention-fg": [
973
+ {
974
+ "props": ["color", "fill"],
975
+ "replacement": "--fgColor-attention"
976
+ }
977
+ ],
978
+ "--color-attention-emphasis": [
979
+ {
980
+ "props": ["background"],
981
+ "replacement": "--bgColor-attention-emphasis"
982
+ },
983
+ {
984
+ "props": ["border"],
985
+ "replacement": "--borderColor-attention-emphasis"
986
+ }
987
+ ],
988
+ "--color-attention-muted": [
989
+ {
990
+ "props": ["border"],
991
+ "replacement": "--borderColor-attention-muted"
992
+ }
993
+ ],
994
+ "--color-attention-subtle": [
995
+ {
996
+ "props": ["background"],
997
+ "replacement": "--bgColor-attention-muted"
998
+ }
999
+ ],
1000
+ "--color-severe-fg": [
1001
+ {
1002
+ "props": ["color", "fill"],
1003
+ "replacement": "--fgColor-severe"
1004
+ }
1005
+ ],
1006
+ "--color-severe-emphasis": [
1007
+ {
1008
+ "props": ["background"],
1009
+ "replacement": "--bgColor-severe-emphasis"
1010
+ },
1011
+ {
1012
+ "props": ["border"],
1013
+ "replacement": "--borderColor-severe-emphasis"
1014
+ }
1015
+ ],
1016
+ "--color-severe-muted": [
1017
+ {
1018
+ "props": ["border"],
1019
+ "replacement": "--borderColor-severe-muted"
1020
+ }
1021
+ ],
1022
+ "--color-severe-subtle": [
1023
+ {
1024
+ "props": ["background"],
1025
+ "replacement": "--bgColor-severe-muted"
1026
+ }
1027
+ ],
1028
+ "--color-danger-fg": [
1029
+ {
1030
+ "props": ["color", "fill"],
1031
+ "replacement": "--fgColor-danger"
1032
+ }
1033
+ ],
1034
+ "--color-danger-emphasis": [
1035
+ {
1036
+ "props": ["background"],
1037
+ "replacement": "--bgColor-danger-emphasis"
1038
+ },
1039
+ {
1040
+ "props": ["border"],
1041
+ "replacement": "--borderColor-danger-emphasis"
1042
+ }
1043
+ ],
1044
+ "--color-danger-muted": [
1045
+ {
1046
+ "props": ["border"],
1047
+ "replacement": "--borderColor-danger-muted"
1048
+ }
1049
+ ],
1050
+ "--color-danger-subtle": [
1051
+ {
1052
+ "props": ["background"],
1053
+ "replacement": "--bgColor-danger-muted"
1054
+ }
1055
+ ],
1056
+ "--color-open-fg": [
1057
+ {
1058
+ "props": ["color", "fill"],
1059
+ "replacement": "--fgColor-open"
1060
+ }
1061
+ ],
1062
+ "--color-open-emphasis": [
1063
+ {
1064
+ "props": ["background"],
1065
+ "replacement": "--bgColor-open-emphasis"
1066
+ },
1067
+ {
1068
+ "props": ["border"],
1069
+ "replacement": "--borderColor-open-emphasis"
1070
+ }
1071
+ ],
1072
+ "--color-open-muted": [
1073
+ {
1074
+ "props": ["border"],
1075
+ "replacement": "--borderColor-open-muted"
1076
+ }
1077
+ ],
1078
+ "--color-open-subtle": [
1079
+ {
1080
+ "props": ["background"],
1081
+ "replacement": "--bgColor-open-muted"
1082
+ }
1083
+ ],
1084
+ "--color-closed-fg": [
1085
+ {
1086
+ "props": ["color", "fill"],
1087
+ "replacement": "--fgColor-closed"
1088
+ }
1089
+ ],
1090
+ "--color-closed-emphasis": [
1091
+ {
1092
+ "props": ["background"],
1093
+ "replacement": "--bgColor-closed-emphasis"
1094
+ },
1095
+ {
1096
+ "props": ["border"],
1097
+ "replacement": "--borderColor-closed-emphasis"
1098
+ }
1099
+ ],
1100
+ "--color-closed-muted": [
1101
+ {
1102
+ "props": ["border"],
1103
+ "replacement": "--borderColor-closed-muted"
1104
+ }
1105
+ ],
1106
+ "--color-closed-subtle": [
1107
+ {
1108
+ "props": ["background"],
1109
+ "replacement": "--bgColor-closed-muted"
1110
+ }
1111
+ ],
1112
+ "--color-done-fg": [
1113
+ {
1114
+ "props": ["color", "fill"],
1115
+ "replacement": "--fgColor-done"
1116
+ }
1117
+ ],
1118
+ "--color-done-emphasis": [
1119
+ {
1120
+ "props": ["background"],
1121
+ "replacement": "--bgColor-done-emphasis"
1122
+ },
1123
+ {
1124
+ "props": ["border"],
1125
+ "replacement": "--borderColor-done-emphasis"
1126
+ }
1127
+ ],
1128
+ "--color-done-muted": [
1129
+ {
1130
+ "props": ["border"],
1131
+ "replacement": "--borderColor-done-muted"
1132
+ }
1133
+ ],
1134
+ "--color-done-subtle": [
1135
+ {
1136
+ "props": ["background"],
1137
+ "replacement": "--bgColor-done-muted"
1138
+ }
1139
+ ],
1140
+ "--color-sponsors-fg": [
1141
+ {
1142
+ "props": ["color", "fill"],
1143
+ "replacement": "--fgColor-sponsors"
1144
+ }
1145
+ ],
1146
+ "--color-sponsors-emphasis": [
1147
+ {
1148
+ "props": ["background"],
1149
+ "replacement": "--bgColor-sponsors-emphasis"
1150
+ },
1151
+ {
1152
+ "props": ["border"],
1153
+ "replacement": "--borderColor-sponsors-emphasis"
1154
+ }
1155
+ ],
1156
+ "--color-sponsors-muted": [
1157
+ {
1158
+ "props": ["border"],
1159
+ "replacement": "--borderColor-sponsors-muted"
1160
+ }
1161
+ ],
1162
+ "--color-sponsors-subtle": [
1163
+ {
1164
+ "props": ["background"],
1165
+ "replacement": "--bgColor-sponsors-muted"
1166
+ }
1167
+ ],
1168
+ "--color-primer-fg-disabled": [
1169
+ {
1170
+ "props": ["color", "fill"],
1171
+ "replacement": "--fgColor-disabled"
1172
+ }
1173
+ ],
1174
+ "--color-primer-canvas-backdrop": [
1175
+ {
1176
+ "props": ["background"],
1177
+ "replacement": "--overlay-backdrop-bgColor"
1178
+ }
1179
+ ],
1180
+ "--color-primer-border-active": [
1181
+ {
1182
+ "props": ["border", "background"],
1183
+ "replacement": "--underlineNav-borderColor-active"
1184
+ }
1185
+ ],
1186
+ "--color-primer-border-contrast": [
1187
+ {
1188
+ "props": ["border", "background"],
1189
+ "replacement": "--borderColor-muted"
1190
+ }
1191
+ ],
1192
+ "--color-avatar-child-shadow": [
1193
+ {
1194
+ "props": ["box-shadow"],
1195
+ "replacement": "--avatar-shadow"
1196
+ }
1197
+ ],
1198
+ "--color-btn-shadow": [
1199
+ {
1200
+ "props": ["box-shadow"],
1201
+ "replacement": "--button-default-shadow-resting"
1202
+ }
1203
+ ],
1204
+ "--color-btn-inset-shadow": [
1205
+ {
1206
+ "props": ["box-shadow"],
1207
+ "replacement": "--button-default-shadow-inset"
1208
+ }
1209
+ ],
1210
+ "--color-btn-primary-shadow": [
1211
+ {
1212
+ "props": ["box-shadow"],
1213
+ "replacement": "--shadow-resting-small"
1214
+ }
1215
+ ],
1216
+ "--color-btn-primary-inset-shadow": [
1217
+ {
1218
+ "props": ["box-shadow"],
1219
+ "replacement": "--shadow-highlight"
1220
+ }
1221
+ ],
1222
+ "--color-btn-primary-selected-shadow": [
1223
+ {
1224
+ "props": ["box-shadow"],
1225
+ "replacement": "--button-primary-shadow-selected"
1226
+ }
1227
+ ],
1228
+ "--color-btn-outline-hover-shadow": [
1229
+ {
1230
+ "props": ["box-shadow"],
1231
+ "replacement": "--shadow-resting-small"
1232
+ }
1233
+ ],
1234
+ "--color-btn-outline-hover-inset-shadow": [
1235
+ {
1236
+ "props": ["box-shadow"],
1237
+ "replacement": "--shadow-highlight"
1238
+ }
1239
+ ],
1240
+ "--color-btn-outline-selected-shadow": [
1241
+ {
1242
+ "props": ["box-shadow"],
1243
+ "replacement": "--button-outline-shadow-selected"
1244
+ }
1245
+ ],
1246
+ "--color-btn-danger-hover-shadow": [
1247
+ {
1248
+ "props": ["box-shadow"],
1249
+ "replacement": "--shadow-resting-small"
1250
+ }
1251
+ ],
1252
+ "--color-btn-danger-hover-inset-shadow": [
1253
+ {
1254
+ "props": ["box-shadow"],
1255
+ "replacement": "--shadow-highlight"
1256
+ }
1257
+ ],
1258
+ "--color-btn-danger-selected-shadow": [
1259
+ {
1260
+ "props": ["box-shadow"],
1261
+ "replacement": "--button-danger-shadow-selected"
1262
+ }
1263
+ ],
1264
+ "--color-overlay-shadow": [
1265
+ {
1266
+ "props": ["box-shadow"],
1267
+ "replacement": "--shadow-floating-small"
1268
+ }
1269
+ ],
1270
+ "--color-primer-shadow-highlight": [
1271
+ {
1272
+ "props": ["box-shadow"],
1273
+ "replacement": "--shadow-highlight"
1274
+ }
1275
+ ],
1276
+ "--color-primer-shadow-inset": [
1277
+ {
1278
+ "props": ["box-shadow"],
1279
+ "replacement": "--shadow-inset"
1280
+ }
1281
+ ],
1282
+ "--color-shadow-small": [
1283
+ {
1284
+ "props": ["box-shadow"],
1285
+ "replacement": "--shadow-resting-small"
1286
+ }
1287
+ ],
1288
+ "--color-shadow-medium": [
1289
+ {
1290
+ "props": ["box-shadow"],
1291
+ "replacement": "--shadow-resting-medium"
1292
+ }
1293
+ ],
1294
+ "--color-shadow-large": [
1295
+ {
1296
+ "props": ["box-shadow"],
1297
+ "replacement": "--shadow-floating-large"
1298
+ }
1299
+ ],
1300
+ "--color-shadow-extra-large": [
1301
+ {
1302
+ "props": ["box-shadow"],
1303
+ "replacement": "--shadow-floating-xlarge"
1304
+ }
1305
+ ]
1306
+ }
@@ -3,12 +3,12 @@ const matchAll = require('string.prototype.matchall')
3
3
 
4
4
  const ruleName = 'primer/no-deprecated-colors'
5
5
  const messages = stylelint.utils.ruleMessages(ruleName, {
6
- rejected: (varName, replacement) => {
6
+ rejected: (varName, replacement, property) => {
7
7
  if (replacement === null) {
8
- return `${varName} is a deprecated color variable. Please consult the primer color docs for a replacement. https://primer.style/primitives/storybook/?path=/story/migration-tables`
8
+ return `Variable ${varName} is deprecated for property ${property}. Please consult the primer color docs for a replacement. https://primer.style/primitives/storybook/?path=/story/migration-tables`
9
9
  }
10
10
 
11
- return `${varName} is a deprecated color variable. Please use the replacement ${replacement}.`
11
+ return `Variable ${varName} is deprecated for property ${property}. Please use the replacement ${replacement}.`
12
12
  }
13
13
  })
14
14
 
@@ -32,7 +32,7 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
32
32
  const seen = new WeakMap()
33
33
 
34
34
  // eslint-disable-next-line import/no-dynamic-require
35
- const variableChecks = require(options.deprecatedFile || '../__tests__/__fixtures__/primitives-v8.json')
35
+ const variableChecks = require(options.deprecatedFile || './lib/primitives-v8.json')
36
36
 
37
37
  const lintResult = (root, result) => {
38
38
  // Walk all declarations
@@ -55,10 +55,13 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
55
55
  if (variableName in variableChecks) {
56
56
  let replacement = variableChecks[variableName]
57
57
  if (typeof replacement === 'object') {
58
- for (const property of Object.keys(replacement)) {
59
- if (node.prop.includes(property)) {
60
- replacement = replacement[property]
61
- break
58
+ if (node.prop) {
59
+ for (const prop of replacement) {
60
+ // Check if node.prop starts with one of the props array elements
61
+ if (prop['props'].some(p => node.prop.startsWith(p))) {
62
+ replacement = prop['replacement']
63
+ break
64
+ }
62
65
  }
63
66
  }
64
67
  if (typeof replacement === 'object') {
@@ -79,7 +82,7 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
79
82
  }
80
83
 
81
84
  stylelint.utils.report({
82
- message: messages.rejected(variableName, replacement),
85
+ message: messages.rejected(variableName, replacement, node.prop),
83
86
  node,
84
87
  ruleName,
85
88
  result