eslint-plugin-tailwindcss
Advanced tools
Comparing version 1.5.5 to 1.6.0
@@ -27,3 +27,4 @@ # Detect classnames which do not belong to Tailwind CSS (no-custom-classname) | ||
"callees": Array<string>, | ||
"config": <string>|<object> | ||
"config": <string>|<object>, | ||
"whitelist": Array<string> | ||
}] | ||
@@ -53,4 +54,12 @@ ... | ||
### `whitelist` (default: `[]`) | ||
The `whitelist` is empty by default but you can add custom regular expressions to this array to avoid getting warnings or errors while using your custom classes. | ||
For example, imagine we are using the following custom classnames: `skin-summer`, `skin-xmas`, `custom-1`, `custom-2`, `custom-3`. | ||
The `whitelist` options should be set to `['skin\-(summer|xmas)', 'custom\-[1-3]']` | ||
## Further Reading | ||
This rule will not fix the issue but will let you know about the issue. |
@@ -27,3 +27,3 @@ /** | ||
members: | ||
'(block|flex|grid|flow\\-root|contents|hidden|inline(\\-(block|flex|table|grid))?|table\\-(column|footer|header|row)\\-group|table(\\-(caption|row|cell|column))?|list\\-item)', | ||
'block|flex|grid|flow\\-root|contents|hidden|inline(\\-(block|flex|table|grid))?|table\\-(column|footer|header|row)\\-group|table(\\-(caption|row|cell|column))?|list\\-item', | ||
}, | ||
@@ -30,0 +30,0 @@ { |
@@ -48,2 +48,7 @@ /** | ||
}, | ||
whitelist: { | ||
type: 'array', | ||
items: { type: 'string', minLength: 0 }, | ||
uniqueItems: true, | ||
}, | ||
}, | ||
@@ -58,2 +63,3 @@ }, | ||
const twConfig = configuration.config || 'tailwind.config.js'; | ||
const whitelist = configuration.whitelist || []; | ||
@@ -72,3 +78,4 @@ const mergedConfig = customConfig.resolve(twConfig); | ||
const idx = groupUtil.getGroupIndex(className, groups, mergedConfig.separator); | ||
if (idx === -1) { | ||
const whitelistIdx = groupUtil.getGroupIndex(className, whitelist, mergedConfig.separator); | ||
if (idx === -1 && whitelistIdx === -1) { | ||
context.report({ | ||
@@ -75,0 +82,0 @@ node, |
@@ -170,3 +170,3 @@ /** | ||
let idx = arr.findIndex((pattern) => { | ||
const classRe = new RegExp(`^${pattern}$`); | ||
const classRe = new RegExp(`^(${pattern})$`); | ||
return classRe.test(classSuffix); | ||
@@ -173,0 +173,0 @@ }, classSuffix); |
{ | ||
"name": "eslint-plugin-tailwindcss", | ||
"version": "1.5.5", | ||
"version": "1.6.0", | ||
"description": "Rules enforcing best practices while using Tailwind CSS", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
@@ -95,2 +95,10 @@ /** | ||
}, | ||
{ | ||
code: `<div className="flex skin-summer custom-2">whitelisted</div>`, | ||
options: [ | ||
{ | ||
whitelist: ["skin\\-(summer|xmas)", "custom\\-[1-3]"], | ||
}, | ||
], | ||
}, | ||
], | ||
@@ -211,3 +219,19 @@ | ||
}, | ||
{ | ||
code: `<div className="flex skin-summer custom-2 custom-not-whitelisted">incomplete whitelist</div>`, | ||
options: [ | ||
{ | ||
whitelist: ["skin\\-(summer|xmas)", "custom\\-[1-3]"], | ||
}, | ||
], | ||
errors: [ | ||
{ | ||
messageId: "customClassnameDetected", | ||
data: { | ||
classname: "custom-not-whitelisted", | ||
}, | ||
}, | ||
], | ||
}, | ||
], | ||
}); |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
97466
2511