Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix invalid option warnings for strings in *-list #5934

Merged
merged 1 commit into from Feb 23, 2022
Merged

Fix invalid option warnings for strings in *-list #5934

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion lib/rules/at-rule-property-required-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ Specify a list of required properties for an at-rule.

## Options

`object`: `{ "at-rule-name": ["array", "of", "properties"] }`
`object`: `{ "at-rule-name": ["array", "of", "properties"]|"property" }`

Given:

Expand Down
2 changes: 1 addition & 1 deletion lib/rules/at-rule-property-required-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -6,7 +6,7 @@ testRule({
ruleName,
config: {
'font-face': ['font-display', 'font-family'],
page: ['margin'],
page: 'margin',
},

accept: [
Expand Down
8 changes: 5 additions & 3 deletions lib/rules/at-rule-property-required-list/index.js
View file
Open in desktop
@@ -1,5 +1,6 @@
'use strict';

const flattenArray = require('../../utils/flattenArray');
const isStandardSyntaxAtRule = require('../../utils/isStandardSyntaxAtRule');
const report = require('../../utils/report');
const ruleMessages = require('../../utils/ruleMessages');
Expand All @@ -17,7 +18,7 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/at-rule-property-required-list',
};

/** @type {import('stylelint').Rule<Record<string, string[]>>} */
/** @type {import('stylelint').Rule<Record<string, string | string[]>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
Expand All @@ -36,12 +37,13 @@ const rule = (primary) => {

const { name, nodes } = atRule;
const atRuleName = name.toLowerCase();
const propList = flattenArray(primary[atRuleName]);

if (!primary[atRuleName]) {
if (!propList) {
return;
}

for (const property of primary[atRuleName]) {
for (const property of propList) {
const propertyName = property.toLowerCase();

const hasProperty = nodes.find(
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-unit-allowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ a { width: 100px; }

## Options

`object`: `{ "unprefixed-property-name": ["array", "of", "units"] }`
`object`: `{ "unprefixed-property-name": ["array", "of", "units"]|"unit" }`

If a property name is surrounded with `"/"` (e.g. `"/^animation/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of shorthands: `/^animation/` will match `animation`, `animation-duration`, `animation-timing-function`, etc.

Expand All @@ -20,7 +20,7 @@ Given:
```json
{
"font-size": ["em", "px"],
"/^animation/": ["s"],
"/^animation/": "s",
"line-height": []
}
```
Expand Down
2 changes: 1 addition & 1 deletion lib/rules/declaration-property-unit-allowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -8,7 +8,7 @@ testRule({
config: [
{
'font-size': ['px', 'em'],
margin: ['em'],
margin: 'em',
'background-position': ['%'],
animation: ['s'],
'line-height': [],
Expand Down
7 changes: 4 additions & 3 deletions lib/rules/declaration-property-unit-allowed-list/index.js
View file
Open in desktop
Expand Up @@ -3,6 +3,7 @@
const valueParser = require('postcss-value-parser');

const declarationValueIndex = require('../../utils/declarationValueIndex');
const flattenArray = require('../../utils/flattenArray');
const getUnitFromValueNode = require('../../utils/getUnitFromValueNode');
const matchesStringOrRegExp = require('../../utils/matchesStringOrRegExp');
const optionsMatches = require('../../utils/optionsMatches');
Expand All @@ -23,7 +24,7 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/declaration-property-unit-allowed-list',
};

/** @type {import('stylelint').Rule<Record<string, string[]>>} */
/** @type {import('stylelint').Rule<Record<string, string | string[]>>} */
const rule = (primary, secondaryOptions) => {
return (root, result) => {
const validOptions = validateOptions(
Expand Down Expand Up @@ -60,7 +61,7 @@ const rule = (primary, secondaryOptions) => {
return;
}

const propList = primary[propKey];
const propList = flattenArray(primary[propKey]);

if (!propList) {
return;
Expand All @@ -84,7 +85,7 @@ const rule = (primary, secondaryOptions) => {

const unit = getUnitFromValueNode(node);

if (!unit || (unit && propList.indexOf(unit.toLowerCase())) !== -1) {
if (!unit || (unit && propList.includes(unit.toLowerCase()))) {
return;
}

Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-unit-disallowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ a { width: 100px; }

## Options

`object`: `{ "unprefixed-property-name": ["array", "of", "units"] }`
`object`: `{ "unprefixed-property-name": ["array", "of", "units"]|"unit" }`

If a property name is surrounded with `"/"` (e.g. `"/^animation/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of shorthands: `/^animation/` will match `animation`, `animation-duration`, `animation-timing-function`, etc.

Expand All @@ -20,7 +20,7 @@ Given:
```json
{
"font-size": ["em", "px"],
"/^animation/": ["s"]
"/^animation/": "s"
}
```

Expand Down
2 changes: 1 addition & 1 deletion lib/rules/declaration-property-unit-disallowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -8,7 +8,7 @@ testRule({
config: [
{
'font-size': ['px', 'em'],
margin: ['em'],
margin: 'em',
'background-position': ['%'],
animation: ['s'],
},
Expand Down
5 changes: 3 additions & 2 deletions lib/rules/declaration-property-unit-disallowed-list/index.js
View file
Open in desktop
Expand Up @@ -3,6 +3,7 @@
const valueParser = require('postcss-value-parser');

const declarationValueIndex = require('../../utils/declarationValueIndex');
const flattenArray = require('../../utils/flattenArray');
const getUnitFromValueNode = require('../../utils/getUnitFromValueNode');
const matchesStringOrRegExp = require('../../utils/matchesStringOrRegExp');
const report = require('../../utils/report');
Expand All @@ -22,7 +23,7 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/declaration-property-unit-disallowed-list',
};

/** @type {import('stylelint').Rule<Record<string, string[]>>} */
/** @type {import('stylelint').Rule<Record<string, string | string[]>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
Expand All @@ -48,7 +49,7 @@ const rule = (primary) => {
return;
}

const propList = primary[propKey];
const propList = flattenArray(primary[propKey]);

if (!propList) {
return;
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-value-allowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ a { text-transform: uppercase; }

## Options

`object`: `{ "unprefixed-property-name": ["array", "of", "values"], "unprefixed-property-name": ["/regex/", "non-regex", /regex/] }`
`object`: `{ "unprefixed-property-name": ["array", "of", "values", "/regex/", /regex/]|"value"|"/regex/"|/regex/ }`

If a property name is found in the object, only the listed property values are allowed. This rule complains about all non-matching values. (If the property name is not included in the object, anything goes.)

Expand All @@ -26,7 +26,7 @@ Given:
```json
{
"transform": ["/scale/"],
"whitespace": ["nowrap"],
"whitespace": "nowrap",
"/color/": ["/^green/"]
}
```
Expand Down
2 changes: 1 addition & 1 deletion lib/rules/declaration-property-value-allowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -8,7 +8,7 @@ testRule({
config: [
{
transform: ['/scale/'],
whitespace: ['nowrap'],
whitespace: 'nowrap',
'/color/': ['/^green/'],
},
],
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-value-allowed-list/index.js
View file
Open in desktop
Expand Up @@ -20,12 +20,12 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/declaration-property-value-allowed-list',
};

/** @type {import('stylelint').Rule<Record<string, (string | RegExp)[]>>} */
/** @type {import('stylelint').Rule<Record<string, string | RegExp | Array<string | RegExp>>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
actual: primary,
possible: [validateObjectWithArrayProps([isString, isRegExp])],
possible: [validateObjectWithArrayProps(isString, isRegExp)],
});

if (!validOptions) {
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-value-disallowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ a { text-transform: uppercase; }

## Options

`object`: `{ "unprefixed-property-name": ["array", "of", "values"], "unprefixed-property-name": ["/regex/", "non-regex", /regex/] }`
`object`: `{ "unprefixed-property-name": ["array", "of", "values", "/regex/", /regex/]|"value"|"/regex/"|/regex/ }`

If a property name is surrounded with `"/"` (e.g. `"/^animation/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of shorthands: `/^animation/` will match `animation`, `animation-duration`, `animation-timing-function`, etc.

Expand All @@ -24,7 +24,7 @@ Given:
```json
{
"transform": ["/scale3d/", "/rotate3d/", "/translate3d/"],
"position": ["fixed"],
"position": "fixed",
"color": ["/^green/"],
"/^animation/": ["/ease/"]
}
Expand Down
2 changes: 1 addition & 1 deletion lib/rules/declaration-property-value-disallowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -8,7 +8,7 @@ testRule({
config: [
{
// regular string
'text-transform': ['uppercase'],
'text-transform': 'uppercase',
// regexes
transform: ['/scale3d/', '/rotate3d/', '/translate3d/'],
// mixed string and regex
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/declaration-property-value-disallowed-list/index.js
View file
Open in desktop
Expand Up @@ -20,12 +20,12 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/declaration-property-value-disallowed-list',
};

/** @type {import('stylelint').Rule<Record<string, (string | RegExp)[]>>} */
/** @type {import('stylelint').Rule<Record<string, string | RegExp | Array<string | RegExp>>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
actual: primary,
possible: [validateObjectWithArrayProps([isString, isRegExp])],
possible: [validateObjectWithArrayProps(isString, isRegExp)],
});

if (!validOptions) {
Expand Down
12 changes: 3 additions & 9 deletions lib/rules/media-feature-name-value-allowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,26 +11,20 @@ Specify a list of allowed media feature name and value pairs.

## Options

```js
{
"unprefixed-media-feature-name": ["array", "of", "values"],
"/unprefixed-media-feature-name/": ["/regex/", "non-regex", /real-regex/]
}
```
`object`: `{ "unprefixed-media-feature-name": ["array", "of", "values", "/regex/", /regex/]|"value"|"/regex/"|/regex/ }`

If a media feature name is found in the object, only its allowed-listed values are
allowed. If the media feature name is not included in the object, anything goes.

If a name or value is surrounded with `/` (e.g. `"/width$/"`), it is interpreted
as a regular expression. For example, `/width$/` will match `max-width` and
`min-width`.
as a regular expression. For example, `/width$/` will match `max-width` and `min-width`.

Given:

```json
{
"min-width": ["768px", "1024px"],
"/resolution/": ["/dpcm$/"]
"/resolution/": "/dpcm$/"
}
```

Expand Down
2 changes: 1 addition & 1 deletion lib/rules/media-feature-name-value-allowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -7,7 +7,7 @@ testRule({
config: [
{
'min-width': ['768px', '$sm'],
'/resolution/': ['/dpcm$/'], // Only dpcm unit
'/resolution/': '/dpcm$/', // Only dpcm unit
color: [], // Test boolean context
width: [], // Test range context
},
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/media-feature-name-value-allowed-list/index.js
View file
Open in desktop
Expand Up @@ -24,12 +24,12 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/media-feature-name-value-allowed-list',
};

/** @type {import('stylelint').Rule<Record<string, Array<string | RegExp>>>} */
/** @type {import('stylelint').Rule<Record<string, string | RegExp | Array<string | RegExp>>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
actual: primary,
possible: [validateObjectWithArrayProps([isString, isRegExp])],
possible: [validateObjectWithArrayProps(isString, isRegExp)],
});

if (!validOptions) {
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/rule-selector-property-disallowed-list/README.md
View file
Open in desktop
Expand Up @@ -11,7 +11,7 @@ Specify a list of disallowed properties for selectors within rules.

## Options

`object`: `{ "selector": ["array", "of", "properties"]`
`object`: `{ "selector": ["array", "of", "properties", "/regex/", /regex/]|"property"|"/regex/"|/regex/`

If a selector name is surrounded with `"/"` (e.g. `"/anchor/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of all the potential anchors: `/anchor/` will match `.anchor`, `[data-anchor]`, etc.

Expand All @@ -22,7 +22,7 @@ Given:
```json
{
"a": ["color", "/margin/"],
"/foo/": ["/size/"]
"/foo/": "/size/"
}
```

Expand Down
2 changes: 1 addition & 1 deletion lib/rules/rule-selector-property-disallowed-list/__tests__/index.js
View file
Open in desktop
Expand Up @@ -6,7 +6,7 @@ testRule({
ruleName,
config: {
a: ['color', '/margin/'],
'/foo/': ['/size/'],
'/foo/': '/size/',
},

accept: [
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/rule-selector-property-disallowed-list/index.js
View file
Open in desktop
Expand Up @@ -18,12 +18,12 @@ const meta = {
url: 'https://stylelint.io/user-guide/rules/list/rule-selector-property-disallowed-list',
};

/** @type {import('stylelint').Rule<Record<string, Array<string | RegExp>>>} */
/** @type {import('stylelint').Rule<Record<string, string | RegExp | Array<string | RegExp>>>} */
const rule = (primary) => {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, {
actual: primary,
possible: [validateObjectWithArrayProps([isString, isRegExp])],
possible: [validateObjectWithArrayProps(isString, isRegExp)],
});

if (!validOptions) {
Expand Down
4 changes: 2 additions & 2 deletions lib/rules/unit-allowed-list/README.md
View file
Open in desktop
Expand Up @@ -65,7 +65,7 @@ a { transform: rotate(30deg); }

## Optional secondary options

### `ignoreProperties: { unit: ["property", "/regex/", /regex/] }`
### `ignoreProperties: { "unit": ["property", "/regex/", /regex/]|"property"|"/regex/"|/regex/ }`

Ignore units in the values of declarations with the specified properties.

Expand Down Expand Up @@ -114,7 +114,7 @@ a { -moz-border-radius-topright: 20rem; }
a { height: 100%; }
```

### `ignoreFunctions: ["/regex/", /regex/, "string"]`
### `ignoreFunctions: ["function", "/regex/", /regex/]|"function"|"/regex/"|/regex/`

Ignore units that are inside of the specified functions.

Expand Down