Skip to content

Commit 2789e2d

Browse files
lgriffeeaaronccasanova
authored andcommitted
Remove deprecated v8 custom properties, functions, mixins, and mixin maps from stylelint-polaris (Shopify#8455)
### WHY are these changes introduced? Fixes Shopify#7622 <hr> 🚨 **Before this PR ships we need to remove the same values from the `_legacy-polaris-v8` file if they exist.** 🚨 - [x] https://github.com/Shopify/web/pull/84457 <hr> ### WHAT is this pull request doing? Removes deprecated v8 custom properties, functions, mixins, and maps from `stylelint-polaris` that do not exist in web (see the linked issue above for a list of these values). --------- Co-authored-by: Aaron Casanova <[email protected]>
1 parent ccbc468 commit 2789e2d

File tree

4 files changed

+19
-68
lines changed

4 files changed

+19
-68
lines changed

.changeset/nice-panthers-doubt.md

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
'@shopify/stylelint-polaris': major
3+
'polaris.shopify.com': patch
4+
---
5+
6+
Remove deprecated v8 custom properties, functions, mixins, and mixin maps from stylelint-polaris

polaris.shopify.com/pages/tools/stylelint-polaris/rules/[rule].tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ const resourceLinks = {
3333
typography:
3434
'the [text component](/components/typography/text) or [font tokens](/tokens/font)',
3535
shape: 'Polaris [shape tokens](/tokens/shape)',
36-
spacing: 'Polaris [spacking tokens](/tokens/spacing)',
36+
spacing: 'Polaris [spacing tokens](/tokens/spacing)',
3737
depth: 'Polaris [depth tokens](/tokens/depth)',
3838
'media queries':
3939
'Polaris [breakpoint sass variables](/tokens/breakpoints#sass-variables)',

stylelint-polaris/index.js

+8-63
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,6 @@ const stylelintPolarisCoverageOptions = {
6464
'polaris/at-rule-disallowed-list': {
6565
include: [
6666
// Legacy mixins
67-
'color-icon',
6867
'recolor-icon',
6968
'ms-high-contrast-color',
7069
].map(matchNameRegExp),
@@ -74,9 +73,6 @@ const stylelintPolarisCoverageOptions = {
7473
/\$polaris-colors/,
7574
/\$color-filter-palette-data/,
7675
/\$color-palette-data/,
77-
// Legacy custom properties
78-
/--p-override-transparent/,
79-
/--p-badge-mix-blend-mode/,
8076
],
8177
},
8278
{
@@ -85,11 +81,9 @@ const stylelintPolarisCoverageOptions = {
8581
],
8682
motion: [
8783
{
88-
'function-disallowed-list': [
89-
'control-icon-transition',
90-
'duration',
91-
'easing',
92-
].map(matchNameRegExp),
84+
'function-disallowed-list': ['control-icon-transition'].map(
85+
matchNameRegExp,
86+
),
9387
'declaration-property-unit-disallowed-list': [
9488
{
9589
'/^animation/': ['ms', 's'],
@@ -102,13 +96,7 @@ const stylelintPolarisCoverageOptions = {
10296
},
10397
'polaris/global-disallowed-list': [
10498
// Legacy mixin map-get data
105-
/\$duration-data/,
106-
/\$polaris-duration-map/,
10799
/\$skeleton-shimmer-duration/,
108-
/\$easing-data/,
109-
// Legacy custom properties
110-
/--p-duration-1-0-0/,
111-
/--p-duration-1-5-0/,
112100
],
113101
},
114102
{
@@ -127,11 +115,9 @@ const stylelintPolarisCoverageOptions = {
127115
},
128116
],
129117
'property-disallowed-list': ['text-transform'],
130-
'function-disallowed-list': [
131-
'font-family',
132-
'font-size',
133-
'line-height',
134-
].map(matchNameRegExp),
118+
'function-disallowed-list': ['font-size', 'line-height'].map(
119+
matchNameRegExp,
120+
),
135121
'polaris/at-rule-disallowed-list': {
136122
include: [
137123
'truncate',
@@ -154,16 +140,10 @@ const stylelintPolarisCoverageOptions = {
154140
},
155141
'polaris/global-disallowed-list': [
156142
// Legacy mixin map-get data
157-
/\$typography-condensed/,
158-
/\$typography-condensed/,
159143
/\$base-font-size/,
160144
/\$line-height-data/,
161-
/\$font-family-data/,
162145
/\$font-size-data/,
163146
/\$default-browser-font-size/,
164-
// Legacy custom properties
165-
/--p-button-font/,
166-
/--p-badge-font/,
167147
],
168148
},
169149
{
@@ -214,16 +194,10 @@ const stylelintPolarisCoverageOptions = {
214194
'control-slim-height',
215195
'mobile-nav-width',
216196
'thumbnail-size',
217-
'icon-size',
218197
'top-bar-height',
219198
].map(matchNameRegExp),
220199
'polaris/at-rule-disallowed-list': {
221-
include: [
222-
'layout-flex-fix',
223-
'safe-area-for',
224-
'skeleton-page-header-layout',
225-
'skeleton-page-secondary-actions-layout',
226-
].map(matchNameRegExp),
200+
include: ['layout-flex-fix', 'safe-area-for'].map(matchNameRegExp),
227201
},
228202
'polaris/global-disallowed-list': [
229203
// Legacy mixin map-get data
@@ -236,9 +210,6 @@ const stylelintPolarisCoverageOptions = {
236210
// Legacy custom properties
237211
/--p-range-slider-thumb-size-base/,
238212
/--p-range-slider-thumb-size-active/,
239-
/--p-range-slider-thumb-scale/,
240-
/--p-override-visible/,
241-
/--p-icon-size/,
242213
/--p-choice-size/,
243214
],
244215
},
@@ -248,7 +219,7 @@ const stylelintPolarisCoverageOptions = {
248219
],
249220
spacing: [
250221
{
251-
'function-disallowed-list': ['control-vertical-padding', 'spacing'].map(
222+
'function-disallowed-list': ['control-vertical-padding'].map(
252223
matchNameRegExp,
253224
),
254225
'declaration-property-unit-disallowed-list': [
@@ -261,8 +232,6 @@ const stylelintPolarisCoverageOptions = {
261232
'polaris/global-disallowed-list': [
262233
// Legacy mixin map-get data
263234
/\$polaris-spacing/,
264-
/\$spacing-data/,
265-
/\$actions-vertical-spacing/,
266235
// Legacy custom properties
267236
/--p-button-group-item-spacing/,
268237
/--p-choice-margin/,
@@ -275,11 +244,6 @@ const stylelintPolarisCoverageOptions = {
275244
],
276245
shape: [
277246
{
278-
'function-disallowed-list': [
279-
'border-radius',
280-
'border-width',
281-
'border',
282-
].map(matchNameRegExp),
283247
'declaration-property-unit-disallowed-list': [
284248
{
285249
'border-width': disallowedUnits,
@@ -299,10 +263,6 @@ const stylelintPolarisCoverageOptions = {
299263
].map(matchNameRegExp),
300264
},
301265
'polaris/global-disallowed-list': [
302-
// Legacy mixin map-get data
303-
/\$border-radius-data/,
304-
/\$border-width-data/,
305-
/\$borders-data/,
306266
// Legacy custom properties
307267
// /--p-border-radius-base/,
308268
/--p-border-radius-wide/,
@@ -314,7 +274,6 @@ const stylelintPolarisCoverageOptions = {
314274
/--p-banner-border-highlight/,
315275
/--p-banner-border-warning/,
316276
/--p-banner-border-critical/,
317-
/--p-text-field-focus-ring-border-radius/,
318277
/--p-text-field-focus-ring-offset/,
319278
],
320279
},
@@ -334,14 +293,6 @@ const stylelintPolarisCoverageOptions = {
334293
'polaris/global-disallowed-list': [
335294
// Legacy mixin map-get data
336295
/\$shadows-data/,
337-
// Legacy custom properties
338-
/--p-button-drop-shadow/,
339-
/--p-button-inner-shadow/,
340-
/--p-button-pressed-inner-shadow/,
341-
/--p-card-shadow/,
342-
/--p-popover-shadow/,
343-
/--p-modal-shadow/,
344-
/--p-top-bar-shadow/,
345296
],
346297
},
347298
{
@@ -485,17 +436,11 @@ const stylelintPolarisCoverageOptions = {
485436
'available-names',
486437
'map-extend',
487438
'em',
488-
'px',
489439
'rem',
490440
].map(matchNameRegExp),
491441
'polaris/global-disallowed-list': [
492442
// Legacy variables
493443
/ \* \$/,
494-
// Legacy custom properties
495-
/--p-override-none/,
496-
/--p-override-one/,
497-
/--p-override-zero/,
498-
/--p-non-null-content/,
499444
],
500445
},
501446
{

stylelint-polaris/plugins/global-disallowed-list/index.test.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
const {ruleName} = require('.');
22

3-
const config = [[/\$font-size-data/, /--p-button-font/]];
3+
const config = [[/\$font-size-data/, /--p-token/]];
44

55
testRule({
66
ruleName,
@@ -26,14 +26,14 @@ testRule({
2626
endColumn: 32,
2727
},
2828
{
29-
code: '.a { color: var(--p-button-font); }',
29+
code: '.a { color: var(--p-token); }',
3030
description: 'Uses something on the disallowed list',
3131
message:
32-
'Unexpected disallowed value "--p-button-font" (polaris/global-disallowed-list)',
32+
'Unexpected disallowed value "--p-token" (polaris/global-disallowed-list)',
3333
line: 1,
3434
column: 17,
3535
endLine: 1,
36-
endColumn: 32,
36+
endColumn: 26,
3737
},
3838
],
3939
});

0 commit comments

Comments
 (0)