Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

eslint-plugin-tailwindcss

Package Overview
Dependencies
Maintainers
1
Versions
184
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

eslint-plugin-tailwindcss - npm Package Compare versions

Comparing version 3.0.4 to 3.1.0-beta.0

lib/rules/enforces-shorthand.js

118

lib/config/groups.js

@@ -101,2 +101,4 @@ /**

members: 'overflow\\-(?<value>auto|hidden|clip|visible|scroll)',
shorthand: 'all',
body: 'overflow',
},

@@ -106,2 +108,4 @@ {

members: 'overflow\\-x\\-(?<value>auto|hidden|clip|visible|scroll)',
shorthand: 'x',
body: 'overflow-x',
},

@@ -111,2 +115,4 @@ {

members: 'overflow\\-y\\-(?<value>auto|hidden|clip|visible|scroll)',
shorthand: 'y',
body: 'overflow-y',
},

@@ -121,2 +127,4 @@ ],

members: 'overscroll\\-(?<value>auto|contain|none)',
shorthand: 'all',
body: 'overscroll',
},

@@ -126,2 +134,4 @@ {

members: 'overscroll\\-x\\-(?<value>auto|contain|none)',
shorthand: 'x',
body: 'overscroll-x',
},

@@ -131,2 +141,4 @@ {

members: 'overscroll\\-y\\-(?<value>auto|contain|none)',
shorthand: 'y',
body: 'overscroll-y',
},

@@ -145,2 +157,4 @@ ],

members: '(inset\\-(?<value>${inset})|\\-inset\\-(?<negativeValue>${-inset}))',
shorthand: 'all',
body: 'inset',
},

@@ -150,2 +164,4 @@ {

members: '(inset\\-y\\-(?<value>${inset})|\\-inset\\-y\\-(?<negativeValue>${-inset}))',
shorthand: 'y',
body: 'inset-y',
},

@@ -155,2 +171,4 @@ {

members: '(inset\\-x\\-(?<value>${inset})|\\-inset\\-x\\-(?<negativeValue>${-inset}))',
shorthand: 'x',
body: 'inset-x',
},

@@ -160,2 +178,4 @@ {

members: '(top\\-(?<value>${inset})|\\-top\\-(?<negativeValue>${-inset}))',
shorthand: 't',
body: 'top',
},

@@ -165,2 +185,4 @@ {

members: '(right\\-(?<value>${inset})|\\-right\\-(?<negativeValue>${-inset}))',
shorthand: 'r',
body: 'right',
},

@@ -170,2 +192,4 @@ {

members: '(bottom\\-(?<value>${inset})|\\-bottom\\-(?<negativeValue>${-inset}))',
shorthand: 'b',
body: 'bottom',
},

@@ -175,2 +199,4 @@ {

members: '(left\\-(?<value>${inset})|\\-left\\-(?<negativeValue>${-inset}))',
shorthand: 'l',
body: 'left',
},

@@ -280,2 +306,4 @@ ],

members: 'gap\\-(?<value>${gap})',
shorthand: 'all',
body: 'gap',
},

@@ -285,2 +313,4 @@ {

members: 'gap\\-x\\-(?<value>${gap})',
shorthand: 'x',
body: 'gap-x',
},

@@ -290,2 +320,4 @@ {

members: 'gap\\-y\\-(?<value>${gap})',
shorthand: 'y',
body: 'gap-y',
},

@@ -341,2 +373,4 @@ ],

members: 'p\\-(?<value>${padding})',
shorthand: 'all',
body: 'p',
},

@@ -346,2 +380,4 @@ {

members: 'py\\-(?<value>${padding})',
shorthand: 'y',
body: 'py',
},

@@ -351,2 +387,4 @@ {

members: 'px\\-(?<value>${padding})',
shorthand: 'x',
body: 'px',
},

@@ -356,2 +394,4 @@ {

members: 'pt\\-(?<value>${padding})',
shorthand: 't',
body: 'pt',
},

@@ -361,2 +401,4 @@ {

members: 'pr\\-(?<value>${padding})',
shorthand: 'r',
body: 'pr',
},

@@ -366,2 +408,4 @@ {

members: 'pb\\-(?<value>${padding})',
shorthand: 'b',
body: 'pb',
},

@@ -371,2 +415,4 @@ {

members: 'pl\\-(?<value>${padding})',
shorthand: 'l',
body: 'pl',
},

@@ -381,2 +427,4 @@ ],

members: '(m\\-(?<value>${margin})|\\-m\\-(?<negativeValue>${-margin}))',
shorthand: 'all',
body: 'm',
},

@@ -386,2 +434,4 @@ {

members: '(my\\-(?<value>${margin})|\\-my\\-(?<negativeValue>${-margin}))',
shorthand: 'y',
body: 'my',
},

@@ -391,2 +441,4 @@ {

members: '(mx\\-(?<value>${margin})|\\-mx\\-(?<negativeValue>${-margin}))',
shorthand: 'x',
body: 'mx',
},

@@ -396,2 +448,4 @@ {

members: '(mt\\-(?<value>${margin})|\\-mt\\-(?<negativeValue>${-margin}))',
shorthand: 't',
body: 'mt',
},

@@ -401,2 +455,4 @@ {

members: '(mr\\-(?<value>${margin})|\\-mr\\-(?<negativeValue>${-margin}))',
shorthand: 'r',
body: 'mr',
},

@@ -406,2 +462,4 @@ {

members: '(mb\\-(?<value>${margin})|\\-mb\\-(?<negativeValue>${-margin}))',
shorthand: 'b',
body: 'mb',
},

@@ -411,2 +469,4 @@ {

members: '(ml\\-(?<value>${margin})|\\-ml\\-(?<negativeValue>${-margin}))',
shorthand: 'l',
body: 'ml',
},

@@ -632,2 +692,4 @@ ],

members: 'rounded(\\-(?<value>${borderRadius}))?',
shorthand: 'all',
body: 'rounded',
},

@@ -637,2 +699,4 @@ {

members: 'rounded\\-t(\\-(?<value>${borderRadius}))?',
shorthand: 't',
body: 'rounded-t',
},

@@ -642,2 +706,4 @@ {

members: 'rounded\\-r(\\-(?<value>${borderRadius}))?',
shorthand: 'r',
body: 'rounded-r',
},

@@ -647,2 +713,4 @@ {

members: 'rounded\\-b(\\-(?<value>${borderRadius}))?',
shorthand: 'b',
body: 'rounded-b',
},

@@ -652,2 +720,4 @@ {

members: 'rounded\\-l(\\-(?<value>${borderRadius}))?',
shorthand: 'l',
body: 'rounded-l',
},

@@ -657,2 +727,4 @@ {

members: 'rounded\\-tl(\\-(?<value>${borderRadius}))?',
shorthand: 'tl',
body: 'rounded-tl',
},

@@ -662,2 +734,4 @@ {

members: 'rounded\\-tr(\\-(?<value>${borderRadius}))?',
shorthand: 'tr',
body: 'rounded-tr',
},

@@ -667,2 +741,4 @@ {

members: 'rounded\\-br(\\-(?<value>${borderRadius}))?',
shorthand: 'br',
body: 'rounded-br',
},

@@ -672,2 +748,4 @@ {

members: 'rounded\\-bl(\\-(?<value>${borderRadius}))?',
shorthand: 'bl',
body: 'rounded-bl',
},

@@ -682,2 +760,4 @@ ],

members: 'border(\\-(?<value>${borderWidth}))?',
shorthand: 'all',
body: 'border',
},

@@ -687,2 +767,4 @@ {

members: 'border\\-y(\\-(?<value>${borderWidth}))?',
shorthand: 'y',
body: 'border-y',
},

@@ -692,2 +774,4 @@ {

members: 'border\\-x(\\-(?<value>${borderWidth}))?',
shorthand: 'x',
body: 'border-x',
},

@@ -697,2 +781,4 @@ {

members: 'border\\-t(\\-(?<value>${borderWidth}))?',
shorthand: 't',
body: 'border-t',
},

@@ -702,2 +788,4 @@ {

members: 'border\\-r(\\-(?<value>${borderWidth}))?',
shorthand: 'r',
body: 'border-r',
},

@@ -707,2 +795,4 @@ {

members: 'border\\-b(\\-(?<value>${borderWidth}))?',
shorthand: 'b',
body: 'border-b',
},

@@ -712,2 +802,4 @@ {

members: 'border\\-l(\\-(?<value>${borderWidth}))?',
shorthand: 'l',
body: 'border-l',
},

@@ -722,2 +814,4 @@ ],

members: 'border\\-(?<value>${borderColor})',
shorthand: 'all',
body: 'border',
},

@@ -727,2 +821,4 @@ {

members: 'border\\-y\\-(?<value>${borderColor})',
shorthand: 'y',
body: 'border-y',
},

@@ -732,2 +828,4 @@ {

members: 'border\\-x\\-(?<value>${borderColor})',
shorthand: 'x',
body: 'border-x',
},

@@ -737,2 +835,4 @@ {

members: 'border\\-t\\-(?<value>${borderColor})',
shorthand: 't',
body: 'border-t',
},

@@ -742,2 +842,4 @@ {

members: 'border\\-r\\-(?<value>${borderColor})',
shorthand: 'r',
body: 'border-r',
},

@@ -747,2 +849,4 @@ {

members: 'border\\-b\\-(?<value>${borderColor})',
shorthand: 'b',
body: 'border-b',
},

@@ -752,2 +856,4 @@ {

members: 'border\\-l\\-(?<value>${borderColor})',
shorthand: 'l',
body: 'border-l',
},

@@ -1006,11 +1112,17 @@ ],

type: 'scale',
members: 'scale\\-(?<value>${scale})',
members: 'scale\\-(?<value>${scale})|\\-scale\\-(?<negativeValue>${-scale})',
shorthand: 'all',
body: 'scale',
},
{
type: 'scale-y',
members: 'scale\\-y\\-(?<value>${scale})',
members: 'scale\\-y\\-(?<value>${scale})|\\-scale\\-y\\-(?<negativeValue>${-scale})',
shorthand: 'y',
body: 'scale-y',
},
{
type: 'scale-x',
members: 'scale\\-x\\-(?<value>${scale})',
members: 'scale\\-x\\-(?<value>${scale})|\\-scale\\-x\\-(?<negativeValue>${-scale})',
shorthand: 'x',
body: 'scale-x',
},

@@ -1017,0 +1129,0 @@ ],

@@ -16,2 +16,3 @@ /**

'classnames-order': require(base + 'classnames-order'),
'enforces-shorthand': require(base + 'enforces-shorthand'),
'migration-from-tailwind-2': require(base + 'migration-from-tailwind-2'),

@@ -31,2 +32,3 @@ 'no-contradicting-classname': require(base + 'no-contradicting-classname'),

'tailwindcss/classnames-order': 'warn',
'tailwindcss/enforces-shorthand': 'warn',
'tailwindcss/migration-from-tailwind-2': 'warn',

@@ -33,0 +35,0 @@ 'tailwindcss/no-custom-classname': 'warn',

@@ -411,2 +411,13 @@ /**

/**
* Get the prefixes of the full classname
*
* @param {String} className The target classname
* @param {String} separator The delimiter to be used between variants
* @returns {String} The variants
*/
function getPrefixes(className, separator = ':') {
return className.split(separator).slice(0, -1).join(separator);
}
/**
* Get the last part of the full classname

@@ -435,2 +446,81 @@ *

/**
* Find the group of a classname
*
* @param {String} name Classname to be find using patterns
* @param {Array} group The group bein tested
* @param {Object} config TailwindCSS config
* @param {String} parentType The name of the parent group
* @returns {Object} The infos
*/
function findInGroup(name, group, config, parentType = null) {
if (typeof group.members === 'string') {
const pattern = patchRegex(group.members, config);
const classRe = new RegExp(`^(${pattern})$`);
if (classRe.test(name)) {
const res = classRe.exec(name);
let value = '';
if (res && res.groups) {
if (res.groups.value) {
value = res.groups.value;
}
if (res.groups.negativeValue) {
value = '-' + res.groups.negativeValue;
}
}
return {
group: parentType,
...group,
value: value,
};
} else {
return null;
}
} else {
const innerGroup = group.members.find((v) => findInGroup(name, v, config, group.type));
if (!innerGroup) {
return null;
} else {
return findInGroup(name, innerGroup, config, group.type);
}
}
}
/**
* Returns an object with parsed properties
*
* @param {String} name Classname to be parsed
* @param {Array} arr The flatten array containing the regex
* @param {Object} config The TailwindCSS config
* @param {Number} index The index
* @returns {Object} Parsed infos
*/
function parseClassname(name, arr, config, index = null) {
const classPrefixes = getPrefixes(name, config.separator);
const classSuffix = getSuffix(name, config.separator);
let slot = null;
arr.forEach((group) => {
if (slot === null) {
const found = findInGroup(classSuffix, group, config);
if (found) {
slot = found;
}
}
});
const variants = classPrefixes ? classPrefixes + config.separator : '';
const value = slot ? slot.value : '';
const isNegative = value[0] === '-';
const off = isNegative ? 1 : 0;
const body = name.substr(0, name.length - value.length + off).substr(variants.length + off);
return {
index: index,
name: name,
variants: variants,
parentType: slot ? slot.group : '',
body: body,
value: value,
shorthand: slot ? slot.shorthand : '',
};
}
module.exports = {

@@ -440,3 +530,5 @@ initGroupSlots,

getGroupIndex,
getPrefixes,
getSuffix,
parseClassname,
};

2

package.json
{
"name": "eslint-plugin-tailwindcss",
"version": "3.0.4",
"version": "3.1.0-beta.0",
"description": "Rules enforcing best practices while using Tailwind CSS",

@@ -5,0 +5,0 @@ "keywords": [

@@ -36,2 +36,4 @@ # eslint-plugin-tailwindcss

- New rule: [`enforces-shorthand`](docs/rules/enforces-shorthand.md) merging multiple classnames when possible
- FIX: [correctly handle number values in config](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/86) (by [patrikholcak](https://github.com/patrikholcak) 🙏)

@@ -38,0 +40,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc