Upgrading to stylelint-config-12.4.0 (#2041)

jonrohan · web-flow · commit 20550bbfaa23 · 2022-04-25T17:59:58.000-07:00
* Upgrading to stylelint-config-12.4.0

* Create tame-clouds-shop.md
diff --git a/.changeset/tame-clouds-shop.md b/.changeset/tame-clouds-shop.md
@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+Upgrading to stylelint-config-12.4.0
diff --git a/package.json b/package.json
@@ -48,7 +48,7 @@
     "@changesets/cli": "2.22.0",
     "@github/prettier-config": "0.0.4",
     "@koddsson/postcss-sass": "5.0.1",
-    "@primer/stylelint-config": "^12.3.3",
+    "@primer/stylelint-config": "^12.4.0",
     "autoprefixer": "10.4.4",
     "chokidar-cli": "3.0.0",
     "cssstats": "4.0.5",
diff --git a/src/box/box-overlay.scss b/src/box/box-overlay.scss
@@ -1,4 +1,5 @@
 .Box--overlay {
+  // stylelint-disable-next-line primer/responsive-widths
   width: 448px;
   margin-right: auto;
   margin-left: auto;
@@ -22,6 +23,7 @@
 }
 
 .Box-overlay--wide {
+  // stylelint-disable-next-line primer/responsive-widths
   width: 640px;
 }
 
diff --git a/src/forms/form-group.scss b/src/forms/form-group.scss
@@ -23,6 +23,7 @@
 
   // Text fields
   .form-control {
+    // stylelint-disable-next-line primer/responsive-widths
     width: 440px;
     max-width: 100%;
     // stylelint-disable-next-line primer/spacing
diff --git a/src/marketing/type/typography.scss b/src/marketing/type/typography.scss
@@ -15,18 +15,25 @@
 
 @each $header, $sizes in $mktg-headers {
   .h#{$header}-mktg {
+    // stylelint-disable-next-line function-no-unknown
     $pairing: map-get($mktg-header-pairings, nth($sizes, 1));
+    // stylelint-disable-next-line function-no-unknown
     $pairing-md: map-get($mktg-header-pairings, nth($sizes, 2));
+    // stylelint-disable-next-line function-no-unknown
     $pairing-lg: map-get($mktg-header-pairings, nth($sizes, 3));
 
+    // stylelint-disable-next-line function-no-unknown
     font-size: map-get($pairing, 'size') !important;
+    // stylelint-disable-next-line function-no-unknown
     line-height: map-get($pairing, 'lh') !important;
 
     @if (map-get($pairing, 'size') >= $mktg-header-weight-threshold) { font-weight: $mktg-header-weight-large !important; }
 
     @if (nth($sizes, 1) != nth($sizes, 2)) {
       @include breakpoint(md) {
+        // stylelint-disable-next-line function-no-unknown
         font-size: map-get($pairing-md, 'size') !important;
+        // stylelint-disable-next-line function-no-unknown
         line-height: map-get($pairing-md, 'lh') !important;
 
         @if (map-get($pairing-md, 'size') >= $mktg-header-spacing-threshold and map-get($pairing, 'size') < $mktg-header-spacing-threshold) {
@@ -41,7 +48,9 @@
 
     @if (nth($sizes, 2) != nth($sizes, 3)) {
       @include breakpoint(lg) {
+        // stylelint-disable-next-line function-no-unknown
         font-size: map-get($pairing-lg, 'size') !important;
+        // stylelint-disable-next-line function-no-unknown
         line-height: map-get($pairing-lg, 'lh') !important;
 
         @if (map-get($pairing-lg, 'size') >= $mktg-header-spacing-threshold and map-get($pairing-md, 'size') < $mktg-header-spacing-threshold) {
@@ -70,11 +79,16 @@
 
 @each $body, $sizes in $mktg-bodies {
   .f#{$body}-mktg {
+    // stylelint-disable-next-line function-no-unknown
     $pairing: map-get($mktg-body-pairings, nth($sizes, 1));
+    // stylelint-disable-next-line function-no-unknown
     $pairing-md: map-get($mktg-body-pairings, nth($sizes, 2));
+    // stylelint-disable-next-line function-no-unknown
     $pairing-lg: map-get($mktg-body-pairings, nth($sizes, 3));
 
+    // stylelint-disable-next-line function-no-unknown
     font-size: map-get($pairing, 'size') !important;
+    // stylelint-disable-next-line function-no-unknown
     line-height: map-get($pairing, 'lh') !important;
 
     @if (map-get($pairing, 'size') >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
@@ -83,7 +97,9 @@
 
     @if (nth($sizes, 1) != nth($sizes, 2)) {
       @include breakpoint(md) {
+        // stylelint-disable-next-line function-no-unknown
         font-size: map-get($pairing-md, 'size') !important;
+        // stylelint-disable-next-line function-no-unknown
         line-height: map-get($pairing-md, 'lh') !important;
 
         @if (map-get($pairing-md, 'size') >= $mktg-body-spacing-threshold and map-get($pairing, 'size') < $mktg-body-spacing-threshold) {
@@ -98,7 +114,9 @@
 
     @if (nth($sizes, 2) != nth($sizes, 3)) {
       @include breakpoint(lg) {
+        // stylelint-disable-next-line function-no-unknown
         font-size: map-get($pairing-lg, 'size') !important;
+        // stylelint-disable-next-line function-no-unknown
         line-height: map-get($pairing-lg, 'lh') !important;
 
         @if (map-get($pairing-lg, 'size') >= $mktg-body-spacing-threshold and map-get($pairing-md, 'size') < $mktg-body-spacing-threshold) {
diff --git a/src/marketing/utilities/layout.scss b/src/marketing/utilities/layout.scss
@@ -27,7 +27,7 @@
 @each $breakpoint, $variant in $responsive-variants {
   @include breakpoint($breakpoint) {
     @for $offset from 1 through 7 {
-      // stylelint-disable-next-line primer/spacing
+      // stylelint-disable-next-line primer/spacing, function-no-unknown
       .offset#{$variant}-n#{$offset} { margin-left: -($offset * 0.0833333333 * 100%); }
     }
   }
diff --git a/src/navigation/subnav.scss b/src/navigation/subnav.scss
@@ -90,6 +90,7 @@
 }
 
 .subnav-search-input-wide {
+  // stylelint-disable-next-line primer/responsive-widths
   width: 500px;
 }
 
diff --git a/src/popover/popover.scss b/src/popover/popover.scss
@@ -122,6 +122,7 @@
   }
 
   &::before {
+    // stylelint-disable-next-line function-no-unknown
     margin-top: -($spacer-2 + 1);
   }
 
diff --git a/src/support/mixins/color-modes.scss b/src/support/mixins/color-modes.scss
@@ -84,10 +84,12 @@
   @each $name, $value in $color-map {
     @each $type, $color in $value {
       @if $type == dark {
+        // stylelint-disable-next-line function-no-unknown
         $dark-colors: append($dark-colors, (--color-#{$name}, #{$color}));
       }
 
       @else {
+        // stylelint-disable-next-line function-no-unknown
         $light-colors: append($light-colors, (--color-#{$name}, #{$color}));
       }
     }
diff --git a/src/support/mixins/layout.scss b/src/support/mixins/layout.scss
@@ -7,6 +7,7 @@
 
   @else {
     // Retrieves the value from the key
+    // stylelint-disable-next-line function-no-unknown
     $value: map-get($breakpoints, $breakpoint);
 
     // If the key exists in the map
diff --git a/src/support/variables/layout.scss b/src/support/variables/layout.scss
@@ -82,6 +82,7 @@ $spacers-large: (
   12: $spacer-12,
 ) !default;
 
+// stylelint-disable-next-line function-no-unknown
 $spacer-map-extended: map-merge(
   (
     0: 0,
diff --git a/src/timeline/timeline-item.scss b/src/timeline/timeline-item.scss
@@ -57,6 +57,7 @@
 
 .TimelineItem-avatar {
   position: absolute;
+  // stylelint-disable-next-line function-no-unknown
   left: -($spacer-6 + $spacer-5);
   z-index: 1;
 }
@@ -67,6 +68,7 @@
   height: $spacer-4;
   margin: 0;
   margin-bottom: -$spacer-3;
+  // stylelint-disable-next-line function-no-unknown
   margin-left: -($spacer-6 + $spacer-3);
   background-color: var(--color-canvas-default);
   border: 0;
diff --git a/yarn.lock b/yarn.lock
@@ -1167,18 +1167,18 @@
   resolved "https://registry.yarnpkg.com/@primer/primitives/-/primitives-7.7.0.tgz#4e838afaf997036720a43ebab0211d2de77b1606"
   integrity sha512-LSd96U2/A70obilbdYiEKI8D/wXUtZnKmUI/ScLOlGDju4iuwd3pJsmFoBwM1Us6vV23V6mapIG+lh27RzauaA==
 
-"@primer/stylelint-config@^12.3.3":
-  version "12.3.3"
-  resolved "https://registry.yarnpkg.com/@primer/stylelint-config/-/stylelint-config-12.3.3.tgz#f4ef0548a7884229358e5243d746d6d3af6a73a5"
-  integrity sha512-PHcBGEM/8mToW9aVrcRi9RVZN0WpW8zHN1C8+deP6tozclP06jzHsdprJG02buyR6N1BmDllsEBYZ2KK4Y71Bg==
+"@primer/stylelint-config@^12.4.0":
+  version "12.4.0"
+  resolved "https://registry.yarnpkg.com/@primer/stylelint-config/-/stylelint-config-12.4.0.tgz#3a9e8ed20673ed6ea17c703bb754b95b82a8a0f4"
+  integrity sha512-7fjs9KBnMdXLlWbPO7Q9WLS1y4kFitmISdVoADtvLxx0k5bY9XWc0sOhEiazioYo9ipwk80VwF4LlijeaZT7JA==
   dependencies:
     anymatch "^3.1.1"
     globby "^11.0.1"
     lodash.kebabcase "^4.1.1"
     postcss-scss "^4.0.2"
     postcss-value-parser "^4.0.2"
     string.prototype.matchall "^4.0.2"
-    stylelint-config-standard "24.0.0"
+    stylelint-config-standard "25.0.0"
     stylelint-no-unsupported-browser-features "^5.0.1"
     stylelint-order "^5.0.0"
     stylelint-scss "^4.0.0"
@@ -5383,17 +5383,17 @@ style-search@^0.1.0:
   resolved "https://registry.yarnpkg.com/style-search/-/style-search-0.1.0.tgz#7958c793e47e32e07d2b5cafe5c0bf8e12e77902"
   integrity sha1-eVjHk+R+MuB9K1yv5cC/jhLneQI=
 
-stylelint-config-recommended@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-6.0.0.tgz#fd2523a322836005ad9bf473d3e5534719c09f9d"
-  integrity sha512-ZorSSdyMcxWpROYUvLEMm0vSZud2uB7tX1hzBZwvVY9SV/uly4AvvJPPhCcymZL3fcQhEQG5AELmrxWqtmzacw==
+stylelint-config-recommended@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-7.0.0.tgz#7497372ae83ab7a6fffc18d7d7b424c6480ae15e"
+  integrity sha512-yGn84Bf/q41J4luis1AZ95gj0EQwRX8lWmGmBwkwBNSkpGSpl66XcPTulxGa/Z91aPoNGuIGBmFkcM1MejMo9Q==
 
-stylelint-config-standard@24.0.0:
-  version "24.0.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-24.0.0.tgz#6823f207ab997ae0b641f9a636d007cc44d77541"
-  integrity sha512-+RtU7fbNT+VlNbdXJvnjc3USNPZRiRVp/d2DxOF/vBDDTi0kH5RX2Ny6errdtZJH3boO+bmqIYEllEmok4jiuw==
+stylelint-config-standard@25.0.0:
+  version "25.0.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-25.0.0.tgz#2c916984e6655d40d6e8748b19baa8603b680bff"
+  integrity sha512-21HnP3VSpaT1wFjFvv9VjvOGDtAviv47uTp3uFmzcN+3Lt+RYRv6oAplLaV51Kf792JSxJ6svCJh/G18E9VnCA==
   dependencies:
-    stylelint-config-recommended "^6.0.0"
+    stylelint-config-recommended "^7.0.0"
 
 stylelint-no-unsupported-browser-features@^5.0.1:
   version "5.0.2"

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@primer/css": patch
 +---
++
 +Upgrading to stylelint-config-12.4.0
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`.Box--overlay {`
	`2`	`+ // stylelint-disable-next-line primer/responsive-widths`
`2`	`3`	`width: 448px;`
`3`	`4`	`margin-right: auto;`
`4`	`5`	`margin-left: auto;`
`@@ -22,6 +23,7 @@`
`22`	`23`	`}`
`23`	`24`
`24`	`25`	`.Box-overlay--wide {`
	`26`	`+ // stylelint-disable-next-line primer/responsive-widths`
`25`	`27`	`width: 640px;`
`26`	`28`	`}`
`27`	`29`
Original file line number	Diff line number	Diff line change
`@@ -27,7 +27,7 @@`
`27`	`27`	`@each $breakpoint, $variant in $responsive-variants {`
`28`	`28`	`@include breakpoint($breakpoint) {`
`29`	`29`	`@for $offset from 1 through 7 {`
`30`		`- // stylelint-disable-next-line primer/spacing`
	`30`	`+ // stylelint-disable-next-line primer/spacing, function-no-unknown`
`31`	`31`	`.offset#{$variant}-n#{$offset} { margin-left: -($offset * 0.0833333333 * 100%); }`
`32`	`32`	`}`
`33`	`33`	`}`
Original file line number	Diff line number	Diff line change
`@@ -90,6 +90,7 @@`
`90`	`90`	`}`
`91`	`91`
`92`	`92`	`.subnav-search-input-wide {`
	`93`	`+ // stylelint-disable-next-line primer/responsive-widths`
`93`	`94`	`width: 500px;`
`94`	`95`	`}`
`95`	`96`
Original file line number	Diff line number	Diff line change
`@@ -122,6 +122,7 @@`
`122`	`122`	`}`
`123`	`123`
`124`	`124`	`&::before {`
	`125`	`+ // stylelint-disable-next-line function-no-unknown`
`125`	`126`	`margin-top: -($spacer-2 + 1);`
`126`	`127`	`}`
`127`	`128`
Original file line number	Diff line number	Diff line change
`@@ -84,10 +84,12 @@`
`84`	`84`	`@each $name, $value in $color-map {`
`85`	`85`	`@each $type, $color in $value {`
`86`	`86`	`@if $type == dark {`
	`87`	`+ // stylelint-disable-next-line function-no-unknown`
`87`	`88`	`$dark-colors: append($dark-colors, (--color-#{$name}, #{$color}));`
`88`	`89`	`}`
`89`	`90`
`90`	`91`	`@else {`
	`92`	`+ // stylelint-disable-next-line function-no-unknown`
`91`	`93`	`$light-colors: append($light-colors, (--color-#{$name}, #{$color}));`
`92`	`94`	`}`
`93`	`95`	`}`