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

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,9 @@
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
+ - [#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
10
 
9
11
  ## 12.7.0
10
12
 
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.ad3398b",
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,1289 @@
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
+ "--color-select-menu-tap-focus-bg": [
288
+ {
289
+ "props": ["background"],
290
+ "replacement": "--selectMenu-bgColor-active"
291
+ }
292
+ ],
293
+ "--color-sidenav-selected-bg": [
294
+ {
295
+ "props": ["background"],
296
+ "replacement": "--sideNav-bgColor-selected"
297
+ }
298
+ ],
299
+ "--color-menu-bg-active": [
300
+ {
301
+ "props": ["background"],
302
+ "replacement": "--menu-bgColor-active"
303
+ }
304
+ ],
305
+ "--color-input-disabled-bg": [
306
+ {
307
+ "props": ["background"],
308
+ "replacement": "--control-bgColor-disabled"
309
+ }
310
+ ],
311
+ "--color-timeline-badge-bg": [
312
+ {
313
+ "props": ["background"],
314
+ "replacement": "--timelineBadge-bgColor"
315
+ }
316
+ ],
317
+ "--color-btn-bg": [
318
+ {
319
+ "props": ["background"],
320
+ "replacement": "--button-default-bgColor-rest"
321
+ }
322
+ ],
323
+ "--color-btn-border": [
324
+ {
325
+ "props": ["border", "background"],
326
+ "replacement": "--button-default-borderColor-rest"
327
+ }
328
+ ],
329
+ "--color-btn-hover-bg": [
330
+ {
331
+ "props": ["background"],
332
+ "replacement": "--button-default-bgColor-hover"
333
+ }
334
+ ],
335
+ "--color-btn-hover-border": [
336
+ {
337
+ "props": ["border", "background"],
338
+ "replacement": "--button-default-borderColor-hover"
339
+ }
340
+ ],
341
+ "--color-btn-active-bg": [
342
+ {
343
+ "props": ["background"],
344
+ "replacement": "--button-default-bgColor-active"
345
+ }
346
+ ],
347
+ "--color-btn-active-border": [
348
+ {
349
+ "props": ["border", "background"],
350
+ "replacement": "--button-default-borderColor-active"
351
+ }
352
+ ],
353
+ "--color-btn-selected-bg": [
354
+ {
355
+ "props": ["color", "fill"],
356
+ "replacement": "--button-default-bgColor-selected"
357
+ }
358
+ ],
359
+ "--color-btn-counter-bg": [
360
+ {
361
+ "props": ["background"],
362
+ "replacement": "--buttonCounter-default-bgColor-rest"
363
+ }
364
+ ],
365
+ "--color-btn-primary-text": [
366
+ {
367
+ "props": ["color", "fill"],
368
+ "replacement": "--button-primary-fgColor-rest"
369
+ }
370
+ ],
371
+ "--color-btn-primary-bg": [
372
+ {
373
+ "props": ["background"],
374
+ "replacement": "--button-primary-bgColor-rest"
375
+ }
376
+ ],
377
+ "--color-btn-primary-border": [
378
+ {
379
+ "props": ["border", "background"],
380
+ "replacement": "--button-primary-borderColor-rest"
381
+ }
382
+ ],
383
+ "--color-btn-primary-hover-bg": [
384
+ {
385
+ "props": ["background"],
386
+ "replacement": "--button-primary-bgColor-hover"
387
+ }
388
+ ],
389
+ "--color-btn-primary-hover-border": [
390
+ {
391
+ "props": ["border", "background"],
392
+ "replacement": "--button-primary-borderColor-hover"
393
+ }
394
+ ],
395
+ "--color-btn-primary-selected-bg": [
396
+ {
397
+ "props": ["background"],
398
+ "replacement": "--button-primary-bgColor-active"
399
+ }
400
+ ],
401
+ "--color-btn-primary-disabled-text": [
402
+ {
403
+ "props": ["color", "fill"],
404
+ "replacement": "--button-primary-fgColor-disabled"
405
+ }
406
+ ],
407
+ "--color-btn-primary-disabled-bg": [
408
+ {
409
+ "props": ["background"],
410
+ "replacement": "--button-primary-bgColor-disabled"
411
+ }
412
+ ],
413
+ "--color-btn-primary-disabled-border": [
414
+ {
415
+ "props": ["border", "background"],
416
+ "replacement": "--button-primary-borderColor-disabled"
417
+ }
418
+ ],
419
+ "--color-btn-primary-icon": [
420
+ {
421
+ "props": ["color", "fill"],
422
+ "replacement": "--button-primary-iconColor-rest"
423
+ }
424
+ ],
425
+ "--color-btn-primary-counter-bg": [
426
+ {
427
+ "props": ["background"],
428
+ "replacement": "--buttonCounter-primary-bgColor-rest"
429
+ }
430
+ ],
431
+ "--color-btn-outline-text": [
432
+ {
433
+ "props": ["color", "fill"],
434
+ "replacement": "--button-outline-fgColor-rest"
435
+ }
436
+ ],
437
+ "--color-btn-outline-hover-text": [
438
+ {
439
+ "props": ["color", "fill"],
440
+ "replacement": "--button-outline-fgColor-hover"
441
+ }
442
+ ],
443
+ "--color-btn-outline-hover-bg": [
444
+ {
445
+ "props": ["background"],
446
+ "replacement": "--button-outline-bgColor-hover"
447
+ }
448
+ ],
449
+ "--color-btn-outline-hover-border": [
450
+ {
451
+ "props": ["border", "background"],
452
+ "replacement": "--button-outline-borderColor-hover"
453
+ }
454
+ ],
455
+ "--color-btn-outline-hover-counter-bg": [
456
+ {
457
+ "props": ["background"],
458
+ "replacement": "--buttonCounter-outline-bgColor-hover"
459
+ }
460
+ ],
461
+ "--color-btn-outline-selected-text": [
462
+ {
463
+ "props": ["color", "fill"],
464
+ "replacement": "--button-outline-fgColor-active"
465
+ }
466
+ ],
467
+ "--color-btn-outline-selected-bg": [
468
+ {
469
+ "props": ["background"],
470
+ "replacement": "--button-outline-bgColor-active"
471
+ }
472
+ ],
473
+ "--color-btn-outline-selected-border": [
474
+ {
475
+ "props": ["border", "background"],
476
+ "replacement": "--button-outline-borderColor-active"
477
+ }
478
+ ],
479
+ "--color-btn-outline-disabled-text": [
480
+ {
481
+ "props": ["color", "fill"],
482
+ "replacement": "--button-outline-fgColor-disabled"
483
+ }
484
+ ],
485
+ "--color-btn-outline-disabled-bg": [
486
+ {
487
+ "props": ["background"],
488
+ "replacement": "--button-outline-bgColor-disabled"
489
+ }
490
+ ],
491
+ "--color-btn-outline-disabled-counter-bg": [
492
+ {
493
+ "props": ["background"],
494
+ "replacement": "--buttonCounter-outline-bgColor-disabled"
495
+ }
496
+ ],
497
+ "--color-btn-outline-counter-bg": [
498
+ {
499
+ "props": ["background"],
500
+ "replacement": "--buttonCounter-outline-bgColor-rest"
501
+ }
502
+ ],
503
+ "--color-btn-danger-text": [
504
+ {
505
+ "props": ["color", "fill"],
506
+ "replacement": "--button-danger-fgColor-rest"
507
+ }
508
+ ],
509
+ "--color-btn-danger-hover-text": [
510
+ {
511
+ "props": ["color", "fill"],
512
+ "replacement": "--button-danger-fgColor-hover"
513
+ }
514
+ ],
515
+ "--color-btn-danger-hover-bg": [
516
+ {
517
+ "props": ["background"],
518
+ "replacement": "--button-danger-bgColor-hover"
519
+ }
520
+ ],
521
+ "--color-btn-danger-hover-border": [
522
+ {
523
+ "props": ["border", "background"],
524
+ "replacement": "--button-danger-borderColor-hover"
525
+ }
526
+ ],
527
+ "--color-btn-danger-hover-counter-bg": [
528
+ {
529
+ "props": ["background"],
530
+ "replacement": "--buttonCounter-danger-bgColor-hover"
531
+ }
532
+ ],
533
+ "--color-btn-danger-selected-text": [
534
+ {
535
+ "props": ["color", "fill"],
536
+ "replacement": "--button-danger-fgColor-active"
537
+ }
538
+ ],
539
+ "--color-btn-danger-selected-bg": [
540
+ {
541
+ "props": ["background"],
542
+ "replacement": "--button-danger-bgColor-active"
543
+ }
544
+ ],
545
+ "--color-btn-danger-selected-border": [
546
+ {
547
+ "props": ["border", "background"],
548
+ "replacement": "--button-danger-borderColor-active"
549
+ }
550
+ ],
551
+ "--color-btn-danger-disabled-text": [
552
+ {
553
+ "props": ["color", "fill"],
554
+ "replacement": "--button-danger-fgColor-disabled"
555
+ }
556
+ ],
557
+ "--color-btn-danger-disabled-bg": [
558
+ {
559
+ "props": ["color", "fill"],
560
+ "replacement": "--button-danger-bgColor-disabled"
561
+ }
562
+ ],
563
+ "--color-btn-danger-disabled-counter-bg": [
564
+ {
565
+ "props": ["background"],
566
+ "replacement": "--buttonCounter-danger-bgColor-disabled"
567
+ }
568
+ ],
569
+ "--color-btn-danger-counter-bg": [
570
+ {
571
+ "props": ["background"],
572
+ "replacement": "--buttonCounter-danger-bgColor-rest"
573
+ }
574
+ ],
575
+ "--color-btn-danger-icon": [
576
+ {
577
+ "props": ["color", "fill"],
578
+ "replacement": "--button-danger-iconColor-rest"
579
+ }
580
+ ],
581
+ "--color-btn-danger-hover-icon": [
582
+ {
583
+ "props": ["color", "fill"],
584
+ "replacement": "--button-danger-iconColor-hover"
585
+ }
586
+ ],
587
+ "--color-underlinenav-icon": [
588
+ {
589
+ "props": ["color", "fill"],
590
+ "replacement": "--underlineNav-iconColor-rest"
591
+ }
592
+ ],
593
+ "--color-underlinenav-border-hover": [
594
+ {
595
+ "props": ["border", "background"],
596
+ "replacement": "--underlineNav-borderColor-hover"
597
+ }
598
+ ],
599
+ "--color-action-list-item-inline-divider": [
600
+ {
601
+ "props": ["border", "background"],
602
+ "replacement": "--borderColor-decorative"
603
+ }
604
+ ],
605
+ "--color-action-list-item-default-hover-bg": [
606
+ {
607
+ "props": ["background"],
608
+ "replacement": "--control-transparent-bgColor-hover"
609
+ }
610
+ ],
611
+ "--color-action-list-item-default-hover-border": [
612
+ {
613
+ "props": ["border", "background"],
614
+ "replacement": "--control-transparent-borderColor-hover"
615
+ }
616
+ ],
617
+ "--color-action-list-item-default-active-bg": [
618
+ {
619
+ "props": ["background"],
620
+ "replacement": "--control-transparent-bgColor-active"
621
+ }
622
+ ],
623
+ "--color-action-list-item-default-active-border": [
624
+ {
625
+ "props": ["border", "background"],
626
+ "replacement": "--control-transparent-borderColor-active"
627
+ }
628
+ ],
629
+ "--color-action-list-item-default-selected-bg": [
630
+ {
631
+ "props": ["background"],
632
+ "replacement": "--control-transparent-bgColor-selected"
633
+ }
634
+ ],
635
+ "--color-action-list-item-danger-hover-bg": [
636
+ {
637
+ "props": ["background"],
638
+ "replacement": "--control-danger-bgColor-hover"
639
+ }
640
+ ],
641
+ "--color-action-list-item-danger-active-bg": [
642
+ {
643
+ "props": ["background"],
644
+ "replacement": "--control-danger-bgColor-active"
645
+ }
646
+ ],
647
+ "--color-action-list-item-danger-hover-text": [
648
+ {
649
+ "props": ["color", "fill"],
650
+ "replacement": "--control-danger-fgColor-hover"
651
+ }
652
+ ],
653
+ "--color-switch-track-bg": [
654
+ {
655
+ "props": ["background"],
656
+ "replacement": "--controlTrack-bgColor-rest"
657
+ }
658
+ ],
659
+ "--color-switch-track-hover-bg": [
660
+ {
661
+ "props": ["background"],
662
+ "replacement": "--controlTrack-bgColor-hover"
663
+ }
664
+ ],
665
+ "--color-switch-track-active-bg": [
666
+ {
667
+ "props": ["background"],
668
+ "replacement": "--controlTrack-bgColor-active"
669
+ }
670
+ ],
671
+ "--color-switch-track-disabled-bg": [
672
+ {
673
+ "props": ["background"],
674
+ "replacement": "--controlTrack-bgColor-disabled"
675
+ }
676
+ ],
677
+ "--color-switch-track-fg": [
678
+ {
679
+ "props": ["color", "fill"],
680
+ "replacement": "--controlTrack-fgColor-rest"
681
+ }
682
+ ],
683
+ "--color-switch-track-disabled-fg": [
684
+ {
685
+ "props": ["color", "fill"],
686
+ "replacement": "--controlTrack-fgColor-disabled"
687
+ }
688
+ ],
689
+ "--color-switch-track-border": [
690
+ {
691
+ "props": ["border", "background"],
692
+ "replacement": "--controlTrack-borderColor-rest"
693
+ }
694
+ ],
695
+ "--color-switch-track-checked-bg": [
696
+ {
697
+ "props": ["background"],
698
+ "replacement": "--control-checked-bgColor-rest"
699
+ }
700
+ ],
701
+ "--color-switch-track-checked-hover-bg": [
702
+ {
703
+ "props": ["background"],
704
+ "replacement": "--control-checked-bgColor-hover"
705
+ }
706
+ ],
707
+ "--color-switch-track-checked-active-bg": [
708
+ {
709
+ "props": ["background"],
710
+ "replacement": "--control-checked-bgColor-active"
711
+ }
712
+ ],
713
+ "--color-switch-track-checked-fg": [
714
+ {
715
+ "props": ["color", "fill"],
716
+ "replacement": "--control-checked-fgColor-rest"
717
+ }
718
+ ],
719
+ "--color-switch-track-checked-disabled-fg": [
720
+ {
721
+ "props": ["color", "fill"],
722
+ "replacement": "--control-checked-fgColor-disabled"
723
+ }
724
+ ],
725
+ "--color-switch-track-checked-border": [],
726
+ "--color-switch-knob-bg": [
727
+ {
728
+ "props": ["background"],
729
+ "replacement": "--controlKnob-bgColor-rest"
730
+ }
731
+ ],
732
+ "--color-switch-knob-disabled-bg": [
733
+ {
734
+ "props": ["background"],
735
+ "replacement": "--controlKnob-bgColor-disabled"
736
+ }
737
+ ],
738
+ "--color-switch-knob-border": [
739
+ {
740
+ "props": ["border", "background"],
741
+ "replacement": "--controlKnob-borderColor-rest"
742
+ }
743
+ ],
744
+ "--color-switch-knob-checked-bg": [
745
+ {
746
+ "props": ["background"],
747
+ "replacement": "--controlKnob-bgColor-checked"
748
+ }
749
+ ],
750
+ "--color-switch-knob-checked-disabled-bg": [
751
+ {
752
+ "props": ["background"],
753
+ "replacement": "--controlKnob-bgColor-disabled"
754
+ }
755
+ ],
756
+ "--color-switch-knob-checked-border": [
757
+ {
758
+ "props": ["border", "background"],
759
+ "replacement": "--controlKnob-borderColor-checked"
760
+ }
761
+ ],
762
+ "--color-segmented-control-bg": [
763
+ {
764
+ "props": ["background"],
765
+ "replacement": "--controlTrack-bgColor-rest"
766
+ }
767
+ ],
768
+ "--color-segmented-control-button-bg": [
769
+ {
770
+ "props": ["background"],
771
+ "replacement": "--controlKnob-bgColor-rest"
772
+ }
773
+ ],
774
+ "--color-segmented-control-button-hover-bg": [
775
+ {
776
+ "props": ["background"],
777
+ "replacement": "--controlTrack-bgColor-hover"
778
+ }
779
+ ],
780
+ "--color-segmented-control-button-active-bg": [
781
+ {
782
+ "props": ["background"],
783
+ "replacement": "--controlTrack-bgColor-active"
784
+ }
785
+ ],
786
+ "--color-segmented-control-button-selected-border": [
787
+ {
788
+ "props": ["border", "background"],
789
+ "replacement": "--controlKnob-borderColor-rest"
790
+ }
791
+ ],
792
+ "--color-tree-view-item-chevron-hover-bg": [
793
+ {
794
+ "props": ["background"],
795
+ "replacement": "--control-transparent-bgColor-hover"
796
+ }
797
+ ],
798
+ "--color-tree-view-item-directory-fill": [
799
+ {
800
+ "props": ["background"],
801
+ "replacement": "--treeViewItem-leadingVisual-bgColor-rest"
802
+ }
803
+ ],
804
+ "--color-canvas-default-transparent": [],
805
+ "--color-fg-default": [
806
+ {
807
+ "props": ["color", "fill"],
808
+ "replacement": "--fgColor-default"
809
+ }
810
+ ],
811
+ "--color-fg-muted": [
812
+ {
813
+ "props": ["color", "fill"],
814
+ "replacement": "--fgColor-muted"
815
+ }
816
+ ],
817
+ "--color-fg-subtle": [
818
+ {
819
+ "props": ["color", "fill"],
820
+ "replacement": "--fgColor-muted"
821
+ }
822
+ ],
823
+ "--color-fg-on-emphasis": [
824
+ {
825
+ "props": ["color", "fill"],
826
+ "replacement": "--fgColor-onEmphasis"
827
+ }
828
+ ],
829
+ "--color-canvas-default": [
830
+ {
831
+ "props": ["background"],
832
+ "replacement": "--bgColor-default"
833
+ }
834
+ ],
835
+ "--color-canvas-overlay": [
836
+ {
837
+ "props": ["background"],
838
+ "replacement": "--overlay-bgColor"
839
+ }
840
+ ],
841
+ "--color-canvas-inset": [
842
+ {
843
+ "props": ["background"],
844
+ "replacement": "--bgColor-muted"
845
+ }
846
+ ],
847
+ "--color-canvas-subtle": [
848
+ {
849
+ "props": ["background"],
850
+ "replacement": "--bgColor-muted"
851
+ }
852
+ ],
853
+ "--color-border-default": [
854
+ {
855
+ "props": ["border", "background"],
856
+ "replacement": "--borderColor-default"
857
+ }
858
+ ],
859
+ "--color-border-muted": [
860
+ {
861
+ "props": ["border", "background"],
862
+ "replacement": "--borderColor-muted"
863
+ }
864
+ ],
865
+ "--color-border-subtle": [
866
+ {
867
+ "props": ["border", "background"],
868
+ "replacement": "--borderColor-muted"
869
+ }
870
+ ],
871
+ "--color-neutral-emphasis-plus": [
872
+ {
873
+ "props": ["background"],
874
+ "replacement": "--bgColor-emphasis"
875
+ }
876
+ ],
877
+ "--color-neutral-emphasis": [
878
+ {
879
+ "props": ["background"],
880
+ "replacement": "--bgColor-neutral-emphasis"
881
+ },
882
+ {
883
+ "props": ["border"],
884
+ "replacement": "--borderColor-neutral-emphasis"
885
+ }
886
+ ],
887
+ "--color-neutral-muted": [
888
+ {
889
+ "props": ["border"],
890
+ "replacement": "--borderColor-neutral-muted"
891
+ }
892
+ ],
893
+ "--color-neutral-subtle": [
894
+ {
895
+ "props": ["background"],
896
+ "replacement": "--bgColor-neutral-muted"
897
+ }
898
+ ],
899
+ "--color-accent-fg": [
900
+ {
901
+ "props": ["color", "fill"],
902
+ "replacement": "--fgColor-accent"
903
+ }
904
+ ],
905
+ "--color-accent-emphasis": [
906
+ {
907
+ "props": ["background"],
908
+ "replacement": "--bgColor-accent-emphasis"
909
+ },
910
+ {
911
+ "props": ["border"],
912
+ "replacement": "--borderColor-accent-emphasis"
913
+ }
914
+ ],
915
+ "--color-accent-muted": [
916
+ {
917
+ "props": ["border"],
918
+ "replacement": "--borderColor-accent-muted"
919
+ }
920
+ ],
921
+ "--color-accent-subtle": [
922
+ {
923
+ "props": ["background"],
924
+ "replacement": "--bgColor-accent-muted"
925
+ }
926
+ ],
927
+ "--color-success-fg": [
928
+ {
929
+ "props": ["color", "fill"],
930
+ "replacement": "--fgColor-success"
931
+ }
932
+ ],
933
+ "--color-success-emphasis": [
934
+ {
935
+ "props": ["background"],
936
+ "replacement": "--bgColor-success-emphasis"
937
+ },
938
+ {
939
+ "props": ["border"],
940
+ "replacement": "--borderColor-success-emphasis"
941
+ }
942
+ ],
943
+ "--color-success-muted": [
944
+ {
945
+ "props": ["border"],
946
+ "replacement": "--borderColor-success-muted"
947
+ }
948
+ ],
949
+ "--color-success-subtle": [
950
+ {
951
+ "props": ["background"],
952
+ "replacement": "--bgColor-success-muted"
953
+ }
954
+ ],
955
+ "--color-attention-fg": [
956
+ {
957
+ "props": ["color", "fill"],
958
+ "replacement": "--fgColor-attention"
959
+ }
960
+ ],
961
+ "--color-attention-emphasis": [
962
+ {
963
+ "props": ["background"],
964
+ "replacement": "--bgColor-attention-emphasis"
965
+ },
966
+ {
967
+ "props": ["border"],
968
+ "replacement": "--borderColor-attention-emphasis"
969
+ }
970
+ ],
971
+ "--color-attention-muted": [
972
+ {
973
+ "props": ["border"],
974
+ "replacement": "--borderColor-attention-muted"
975
+ }
976
+ ],
977
+ "--color-attention-subtle": [
978
+ {
979
+ "props": ["background"],
980
+ "replacement": "--bgColor-attention-muted"
981
+ }
982
+ ],
983
+ "--color-severe-fg": [
984
+ {
985
+ "props": ["color", "fill"],
986
+ "replacement": "--fgColor-severe"
987
+ }
988
+ ],
989
+ "--color-severe-emphasis": [
990
+ {
991
+ "props": ["background"],
992
+ "replacement": "--bgColor-severe-emphasis"
993
+ },
994
+ {
995
+ "props": ["border"],
996
+ "replacement": "--borderColor-severe-emphasis"
997
+ }
998
+ ],
999
+ "--color-severe-muted": [
1000
+ {
1001
+ "props": ["border"],
1002
+ "replacement": "--borderColor-severe-muted"
1003
+ }
1004
+ ],
1005
+ "--color-severe-subtle": [
1006
+ {
1007
+ "props": ["background"],
1008
+ "replacement": "--bgColor-severe-muted"
1009
+ }
1010
+ ],
1011
+ "--color-danger-fg": [
1012
+ {
1013
+ "props": ["color", "fill"],
1014
+ "replacement": "--fgColor-danger"
1015
+ }
1016
+ ],
1017
+ "--color-danger-emphasis": [
1018
+ {
1019
+ "props": ["background"],
1020
+ "replacement": "--bgColor-danger-emphasis"
1021
+ },
1022
+ {
1023
+ "props": ["border"],
1024
+ "replacement": "--borderColor-danger-emphasis"
1025
+ }
1026
+ ],
1027
+ "--color-danger-muted": [
1028
+ {
1029
+ "props": ["border"],
1030
+ "replacement": "--borderColor-danger-muted"
1031
+ }
1032
+ ],
1033
+ "--color-danger-subtle": [
1034
+ {
1035
+ "props": ["background"],
1036
+ "replacement": "--bgColor-danger-muted"
1037
+ }
1038
+ ],
1039
+ "--color-open-fg": [
1040
+ {
1041
+ "props": ["color", "fill"],
1042
+ "replacement": "--fgColor-open"
1043
+ }
1044
+ ],
1045
+ "--color-open-emphasis": [
1046
+ {
1047
+ "props": ["background"],
1048
+ "replacement": "--bgColor-open-emphasis"
1049
+ },
1050
+ {
1051
+ "props": ["border"],
1052
+ "replacement": "--borderColor-open-emphasis"
1053
+ }
1054
+ ],
1055
+ "--color-open-muted": [
1056
+ {
1057
+ "props": ["border"],
1058
+ "replacement": "--borderColor-open-muted"
1059
+ }
1060
+ ],
1061
+ "--color-open-subtle": [
1062
+ {
1063
+ "props": ["background"],
1064
+ "replacement": "--bgColor-open-muted"
1065
+ }
1066
+ ],
1067
+ "--color-closed-fg": [
1068
+ {
1069
+ "props": ["color", "fill"],
1070
+ "replacement": "--fgColor-closed"
1071
+ }
1072
+ ],
1073
+ "--color-closed-emphasis": [
1074
+ {
1075
+ "props": ["background"],
1076
+ "replacement": "--bgColor-closed-emphasis"
1077
+ },
1078
+ {
1079
+ "props": ["border"],
1080
+ "replacement": "--borderColor-closed-emphasis"
1081
+ }
1082
+ ],
1083
+ "--color-closed-muted": [
1084
+ {
1085
+ "props": ["border"],
1086
+ "replacement": "--borderColor-closed-muted"
1087
+ }
1088
+ ],
1089
+ "--color-closed-subtle": [
1090
+ {
1091
+ "props": ["background"],
1092
+ "replacement": "--bgColor-closed-muted"
1093
+ }
1094
+ ],
1095
+ "--color-done-fg": [
1096
+ {
1097
+ "props": ["color", "fill"],
1098
+ "replacement": "--fgColor-done"
1099
+ }
1100
+ ],
1101
+ "--color-done-emphasis": [
1102
+ {
1103
+ "props": ["background"],
1104
+ "replacement": "--bgColor-done-emphasis"
1105
+ },
1106
+ {
1107
+ "props": ["border"],
1108
+ "replacement": "--borderColor-done-emphasis"
1109
+ }
1110
+ ],
1111
+ "--color-done-muted": [
1112
+ {
1113
+ "props": ["border"],
1114
+ "replacement": "--borderColor-done-muted"
1115
+ }
1116
+ ],
1117
+ "--color-done-subtle": [
1118
+ {
1119
+ "props": ["background"],
1120
+ "replacement": "--bgColor-done-muted"
1121
+ }
1122
+ ],
1123
+ "--color-sponsors-fg": [
1124
+ {
1125
+ "props": ["color", "fill"],
1126
+ "replacement": "--fgColor-sponsors"
1127
+ }
1128
+ ],
1129
+ "--color-sponsors-emphasis": [
1130
+ {
1131
+ "props": ["background"],
1132
+ "replacement": "--bgColor-sponsors-emphasis"
1133
+ },
1134
+ {
1135
+ "props": ["border"],
1136
+ "replacement": "--borderColor-sponsors-emphasis"
1137
+ }
1138
+ ],
1139
+ "--color-sponsors-muted": [
1140
+ {
1141
+ "props": ["border"],
1142
+ "replacement": "--borderColor-sponsors-muted"
1143
+ }
1144
+ ],
1145
+ "--color-sponsors-subtle": [
1146
+ {
1147
+ "props": ["background"],
1148
+ "replacement": "--bgColor-sponsors-muted"
1149
+ }
1150
+ ],
1151
+ "--color-primer-fg-disabled": [
1152
+ {
1153
+ "props": ["color", "fill"],
1154
+ "replacement": "--fgColor-disabled"
1155
+ }
1156
+ ],
1157
+ "--color-primer-canvas-backdrop": [
1158
+ {
1159
+ "props": ["background"],
1160
+ "replacement": "--overlay-backdrop-bgColor"
1161
+ }
1162
+ ],
1163
+ "--color-primer-border-active": [
1164
+ {
1165
+ "props": ["border", "background"],
1166
+ "replacement": "--underlineNav-borderColor-active"
1167
+ }
1168
+ ],
1169
+ "--color-primer-border-contrast": [
1170
+ {
1171
+ "props": ["border", "background"],
1172
+ "replacement": "--borderColor-muted"
1173
+ }
1174
+ ],
1175
+ "--color-avatar-child-shadow": [
1176
+ {
1177
+ "props": ["box-shadow"],
1178
+ "replacement": "--avatar-shadow"
1179
+ }
1180
+ ],
1181
+ "--color-btn-shadow": [
1182
+ {
1183
+ "props": ["box-shadow"],
1184
+ "replacement": "--button-default-shadow-resting"
1185
+ }
1186
+ ],
1187
+ "--color-btn-inset-shadow": [
1188
+ {
1189
+ "props": ["box-shadow"],
1190
+ "replacement": "--button-default-shadow-inset"
1191
+ }
1192
+ ],
1193
+ "--color-btn-primary-shadow": [
1194
+ {
1195
+ "props": ["box-shadow"],
1196
+ "replacement": "--shadow-resting-small"
1197
+ }
1198
+ ],
1199
+ "--color-btn-primary-inset-shadow": [
1200
+ {
1201
+ "props": ["box-shadow"],
1202
+ "replacement": "--shadow-highlight"
1203
+ }
1204
+ ],
1205
+ "--color-btn-primary-selected-shadow": [
1206
+ {
1207
+ "props": ["box-shadow"],
1208
+ "replacement": "--button-primary-shadow-selected"
1209
+ }
1210
+ ],
1211
+ "--color-btn-outline-hover-shadow": [
1212
+ {
1213
+ "props": ["box-shadow"],
1214
+ "replacement": "--shadow-resting-small"
1215
+ }
1216
+ ],
1217
+ "--color-btn-outline-hover-inset-shadow": [
1218
+ {
1219
+ "props": ["box-shadow"],
1220
+ "replacement": "--shadow-highlight"
1221
+ }
1222
+ ],
1223
+ "--color-btn-outline-selected-shadow": [
1224
+ {
1225
+ "props": ["box-shadow"],
1226
+ "replacement": "--button-outline-shadow-selected"
1227
+ }
1228
+ ],
1229
+ "--color-btn-danger-hover-shadow": [
1230
+ {
1231
+ "props": ["box-shadow"],
1232
+ "replacement": "--shadow-resting-small"
1233
+ }
1234
+ ],
1235
+ "--color-btn-danger-hover-inset-shadow": [
1236
+ {
1237
+ "props": ["box-shadow"],
1238
+ "replacement": "--shadow-highlight"
1239
+ }
1240
+ ],
1241
+ "--color-btn-danger-selected-shadow": [
1242
+ {
1243
+ "props": ["box-shadow"],
1244
+ "replacement": "--button-danger-shadow-selected"
1245
+ }
1246
+ ],
1247
+ "--color-overlay-shadow": [
1248
+ {
1249
+ "props": ["box-shadow"],
1250
+ "replacement": "--shadow-floating-small"
1251
+ }
1252
+ ],
1253
+ "--color-primer-shadow-highlight": [
1254
+ {
1255
+ "props": ["box-shadow"],
1256
+ "replacement": "--shadow-highlight"
1257
+ }
1258
+ ],
1259
+ "--color-primer-shadow-inset": [
1260
+ {
1261
+ "props": ["box-shadow"],
1262
+ "replacement": "--shadow-inset"
1263
+ }
1264
+ ],
1265
+ "--color-shadow-small": [
1266
+ {
1267
+ "props": ["box-shadow"],
1268
+ "replacement": "--shadow-resting-small"
1269
+ }
1270
+ ],
1271
+ "--color-shadow-medium": [
1272
+ {
1273
+ "props": ["box-shadow"],
1274
+ "replacement": "--shadow-resting-medium"
1275
+ }
1276
+ ],
1277
+ "--color-shadow-large": [
1278
+ {
1279
+ "props": ["box-shadow"],
1280
+ "replacement": "--shadow-floating-large"
1281
+ }
1282
+ ],
1283
+ "--color-shadow-extra-large": [
1284
+ {
1285
+ "props": ["box-shadow"],
1286
+ "replacement": "--shadow-floating-xlarge"
1287
+ }
1288
+ ]
1289
+ }
@@ -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