Skip to content

Commit 9b30fbd

Browse files
romainmenkeromainmenke
authored
Remove display-notation secondary options while the specification is in flux (#9006)
1 parent 17ebd25 commit 9b30fbd

4 files changed

Lines changed: 9 additions & 276 deletions

File tree

‎lib/rules/display-notation/README.md‎

Lines changed: 2 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ a { display: block; }
1111

1212
Modern `display` property values allow you to define both the [outer and inner display type](https://drafts.csswg.org/css-display-3/#the-display-properties) separately (e.g. `inline flex`). While CSS 2 used a single-keyword, precomposed syntax for the `display` property (e.g. `inline-flex`).
1313

14-
In the [Display Module Level 3 specification](https://drafts.csswg.org/css-display-3/) the following precomposed values are defined as legacy:
14+
In the [Display Module Level 3 specification](https://drafts.csswg.org/css-display-3/) the following precomposed values are defined:
1515

1616
- `inline-block`
1717
- `inline-flex`
@@ -22,7 +22,7 @@ More recent and future inner display types (e.g. `grid-lanes`) can only be combi
2222

2323
The full notation explicitly describes the inner and outer display types of elements. This notation makes it easier to understand how an element will behave and to learn about the various display types.
2424

25-
The short notation omits defaults or switches to legacy values, and doesn't follow the modern principle of value composition.
25+
The short notation omits defaults or switches to precomposed values, and doesn't follow the modern principle of value composition.
2626

2727
This rule ignores `$sass`, `@less`, and `var(--custom-property)` variable syntaxes.
2828

@@ -117,109 +117,3 @@ a { display: grid; }
117117
```css
118118
a { display: list-item; }
119119
```
120-
121-
## Optional secondary options
122-
123-
### `ignore`
124-
125-
```json
126-
{ "ignore": ["array", "of", "options"] }
127-
```
128-
129-
#### `"non-legacy-values"`
130-
131-
Ignore display values that are not legacy values.
132-
133-
Given:
134-
135-
```json
136-
{
137-
"display-notation": ["full", { "ignore": ["non-legacy-values"] }]
138-
}
139-
```
140-
141-
The following patterns are considered problems:
142-
143-
```css
144-
a {
145-
display: inline-block;
146-
}
147-
```
148-
149-
```css
150-
a {
151-
display: inline-flex;
152-
}
153-
```
154-
155-
The following patterns are _not_ considered problems:
156-
157-
```css
158-
a {
159-
display: inline;
160-
}
161-
```
162-
163-
```css
164-
a {
165-
display: grid;
166-
}
167-
```
168-
169-
```css
170-
a {
171-
display: inline flow-root;
172-
}
173-
```
174-
175-
### `except`
176-
177-
```json
178-
{ "except": ["array", "of", "options"] }
179-
```
180-
181-
#### `"legacy-values"`
182-
183-
Reverse the primary option for legacy values.
184-
185-
Given:
186-
187-
```json
188-
{
189-
"display-notation": ["short", { "except": ["legacy-values"] }]
190-
}
191-
```
192-
193-
The following patterns are considered problems:
194-
195-
```css
196-
a {
197-
display: inline-block;
198-
}
199-
```
200-
201-
```css
202-
a {
203-
display: inline-flex;
204-
}
205-
```
206-
207-
The following patterns are _not_ considered problems:
208-
209-
```css
210-
a {
211-
display: block;
212-
}
213-
```
214-
215-
```css
216-
a {
217-
display: inline flow-root;
218-
}
219-
```
220-
221-
```css
222-
a {
223-
display: inline list-root;
224-
}
225-
```

‎lib/rules/display-notation/__tests__/index.mjs‎

Lines changed: 0 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -95,71 +95,6 @@ testRule({
9595
],
9696
});
9797

98-
testRule({
99-
ruleName,
100-
config: ['short', { except: 'legacy-values' }],
101-
fix: true,
102-
computeEditInfo: true,
103-
104-
accept: [
105-
{
106-
code: 'a { display: block; }',
107-
},
108-
{
109-
code: 'a { display: run-in flow-root; }',
110-
},
111-
{
112-
code: 'a { display: flow-root list-item; }',
113-
},
114-
{
115-
code: 'a { display: inline flow-root; }',
116-
},
117-
],
118-
119-
reject: [
120-
{
121-
code: 'a { display: block flow; }',
122-
fixed: 'a { display: block; }',
123-
message: messages.expected('block flow', 'block'),
124-
line: 1,
125-
column: 14,
126-
endLine: 1,
127-
endColumn: 24,
128-
fix: { range: [18, 23], text: '' },
129-
},
130-
{
131-
code: 'a { display: inline-block; }',
132-
fixed: 'a { display: inline flow-root; }',
133-
message: messages.expected('inline-block', 'inline flow-root'),
134-
line: 1,
135-
column: 14,
136-
endLine: 1,
137-
endColumn: 26,
138-
fix: { range: [19, 25], text: ' flow-root' },
139-
},
140-
{
141-
code: 'a { display: block list-item; }',
142-
fixed: 'a { display: list-item; }',
143-
message: messages.expected('block list-item', 'list-item'),
144-
line: 1,
145-
column: 14,
146-
endLine: 1,
147-
endColumn: 29,
148-
fix: { range: [13, 19], text: '' },
149-
},
150-
{
151-
code: 'a { display: flow list-item; }',
152-
fixed: 'a { display: list-item; }',
153-
message: messages.expected('flow list-item', 'list-item'),
154-
line: 1,
155-
column: 14,
156-
endLine: 1,
157-
endColumn: 28,
158-
fix: { range: [13, 18], text: '' },
159-
},
160-
],
161-
});
162-
16398
testRule({
16499
ruleName,
165100
config: ['full'],
@@ -242,38 +177,6 @@ testRule({
242177
],
243178
});
244179

245-
testRule({
246-
ruleName,
247-
config: ['full', { ignore: ['non-legacy-values'] }],
248-
fix: true,
249-
computeEditInfo: true,
250-
251-
accept: [
252-
{
253-
code: 'a { display: inline; }',
254-
},
255-
{
256-
code: 'a { display: grid; }',
257-
},
258-
{
259-
code: 'a { display: inline flow-root; }',
260-
},
261-
],
262-
263-
reject: [
264-
{
265-
code: 'a { display: inline-block; }',
266-
fixed: 'a { display: inline flow-root; }',
267-
message: messages.expected('inline-block', 'inline flow-root'),
268-
line: 1,
269-
column: 14,
270-
endLine: 1,
271-
endColumn: 26,
272-
fix: { range: [19, 25], text: ' flow-root' },
273-
},
274-
],
275-
});
276-
277180
testRule({
278181
ruleName,
279182
customSyntax: 'postcss-scss',

‎lib/rules/display-notation/index.mjs‎

Lines changed: 6 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
import { declarationValueIndex } from '../../utils/nodeFieldIndices.mjs';
1212
import getDeclarationValue from '../../utils/getDeclarationValue.mjs';
1313
import isStandardSyntaxValue from '../../utils/isStandardSyntaxValue.mjs';
14-
import optionsMatches from '../../utils/optionsMatches.mjs';
1514
import report from '../../utils/report.mjs';
1615
import ruleMessages from '../../utils/ruleMessages.mjs';
1716
import setDeclarationValue from '../../utils/setDeclarationValue.mjs';
@@ -87,68 +86,16 @@ const LONG_TO_SHORT = {
8786
'run-in flow': ['run-in'],
8887
};
8988

90-
const NON_LEGACY_VALUES = [
91-
'block flex',
92-
'block flow list-item',
93-
'block flow',
94-
'block flow-root',
95-
'block grid',
96-
'block list-item',
97-
'block ruby',
98-
'block table',
99-
'block',
100-
'flex',
101-
'flow list-item',
102-
'flow-root',
103-
'grid',
104-
'inline flex',
105-
'inline flow list-item',
106-
'inline flow',
107-
'inline flow-root',
108-
'inline grid',
109-
'inline list-item',
110-
'inline ruby',
111-
'inline table',
112-
'inline',
113-
'list-item',
114-
'ruby',
115-
'run-in flow',
116-
'run-in',
117-
'table',
118-
];
119-
12089
/** @type {import('stylelint').CoreRules[ruleName]} */
121-
const rule = (primary, secondaryOptions) => {
90+
const rule = (primary) => {
12291
return (root, result) => {
123-
const validOptions = validateOptions(
124-
result,
125-
ruleName,
126-
{
127-
actual: primary,
128-
possible: ['short', 'full'],
129-
},
130-
{
131-
actual: secondaryOptions,
132-
possible: {
133-
except: ['legacy-values'],
134-
ignore: ['non-legacy-values'],
135-
},
136-
optional: true,
137-
},
138-
);
92+
const validOptions = validateOptions(result, ruleName, {
93+
actual: primary,
94+
possible: ['short', 'full'],
95+
});
13996

14097
if (!validOptions) return;
14198

142-
const except = optionsMatches(secondaryOptions, 'except', 'legacy-values')
143-
? [
144-
...DISPLAY_LEGACY_KEYWORDS,
145-
...DISPLAY_LEGACY_KEYWORDS.map((keyword) => SHORT_TO_LONG[keyword]?.join(' ')),
146-
]
147-
: [];
148-
const ignore = optionsMatches(secondaryOptions, 'ignore', 'non-legacy-values')
149-
? NON_LEGACY_VALUES
150-
: [];
151-
15299
root.walkDecls(DISPLAY_PROPERTY, (decl) => {
153100
const value = getDeclarationValue(decl);
154101

@@ -171,16 +118,8 @@ const rule = (primary, secondaryOptions) => {
171118

172119
const normalizedValue = normalizeValue(keywords);
173120

174-
if (ignore.includes(normalizedValue)) return;
175-
176-
let expected = primary;
177-
178-
if (except.includes(normalizedValue)) {
179-
expected = primary === 'short' ? 'full' : 'short';
180-
}
181-
182121
const replacementValue =
183-
expected === 'short' ? LONG_TO_SHORT[normalizedValue] : SHORT_TO_LONG[normalizedValue];
122+
primary === 'short' ? LONG_TO_SHORT[normalizedValue] : SHORT_TO_LONG[normalizedValue];
184123

185124
if (!replacementValue) return;
186125

‎types/stylelint/index.d.ts‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -562,10 +562,7 @@ declare namespace stylelint {
562562
'custom-property-pattern': PatternRule;
563563
'display-notation': CoreRule<
564564
'short' | 'full',
565-
{
566-
except: OneOrMany<'legacy-values'>;
567-
ignore: OneOrMany<'non-legacy-values'>;
568-
},
565+
{},
569566
ExpectedMessage<[unexpected: string, expected: string]>
570567
>;
571568
'declaration-block-no-duplicate-custom-properties': CoreRule<

0 commit comments

Comments
 (0)