Skip to content

Commit 5a5db1b

Browse files
nihalgonsalvesnihalgonsalves
authored
fix: support tag.div and tag(Component) (#302)
1 parent e95872d commit 5a5db1b

17 files changed

+256
-196
lines changed

‎lib/rules/classnames-order.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,7 @@ module.exports = {
235235
TextAttribute: attributeVisitor,
236236
CallExpression: callExpressionVisitor,
237237
TaggedTemplateExpression: function (node) {
238-
if (!tags.includes(node.tag.name)) {
238+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
239239
return;
240240
}
241241

‎lib/rules/enforces-negative-arbitrary-values.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ module.exports = {
179179
TextAttribute: attributeVisitor,
180180
CallExpression: callExpressionVisitor,
181181
TaggedTemplateExpression: function (node) {
182-
if (!tags.includes(node.tag.name)) {
182+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
183183
return;
184184
}
185185
parseForNegativeArbitraryClassNames(node, node.quasi);

‎lib/rules/enforces-shorthand.js

+3-4
Original file line numberDiff line numberDiff line change
@@ -362,9 +362,8 @@ module.exports = {
362362
} else if (hasY || hasX) {
363363
const xOrY = hasX ? 'x' : 'y';
364364
const xOrYType = getBodyByShorthand(targetGroups, classname.parentType, xOrY);
365-
const patchedName = `${cls.variants}${important}${minus}${mergedConfig.prefix}${xOrYType}${
366-
absoluteVal.length ? '-' + absoluteVal : ''
367-
}`;
365+
const patchedName = `${cls.variants}${important}${minus}${mergedConfig.prefix}${xOrYType}${absoluteVal.length ? '-' + absoluteVal : ''
366+
}`;
368367
const toBeReplaced = sameVariantAndValue
369368
.filter((c) => {
370369
const candidates = hasX ? ['l', 'r'] : ['t', 'b'];
@@ -501,7 +500,7 @@ module.exports = {
501500
TextAttribute: attributeVisitor,
502501
CallExpression: callExpressionVisitor,
503502
TaggedTemplateExpression: function (node) {
504-
if (!tags.includes(node.tag.name)) {
503+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
505504
return;
506505
}
507506

‎lib/rules/migration-from-tailwind-2.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -290,7 +290,7 @@ module.exports = {
290290
TextAttribute: attributeVisitor,
291291
CallExpression: callExpressionVisitor,
292292
TaggedTemplateExpression: function (node) {
293-
if (!tags.includes(node.tag.name)) {
293+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
294294
return;
295295
}
296296
parseForObsoleteClassNames(node, node.quasi);

‎lib/rules/no-arbitrary-value.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ module.exports = {
179179
TextAttribute: attributeVisitor,
180180
CallExpression: callExpressionVisitor,
181181
TaggedTemplateExpression: function (node) {
182-
if (!tags.includes(node.tag.name)) {
182+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
183183
return;
184184
}
185185
parseForArbitraryValues(node, node.quasi);

‎lib/rules/no-contradicting-classname.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,7 @@ module.exports = {
203203
TextAttribute: attributeVisitor,
204204
CallExpression: callExpressionVisitor,
205205
TaggedTemplateExpression: function (node) {
206-
if (!tags.includes(node.tag.name)) {
206+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
207207
return;
208208
}
209209

‎lib/rules/no-custom-classname.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,7 @@ module.exports = {
182182
TextAttribute: attributeVisitor,
183183
CallExpression: callExpressionVisitor,
184184
TaggedTemplateExpression: function (node) {
185-
if (!tags.includes(node.tag.name)) {
185+
if (!tags.includes(node.tag.name ?? node.tag.object?.name ?? node.tag.callee?.name)) {
186186
return;
187187
}
188188
astUtil.parseNodeRecursive(node, node.quasi, parseForCustomClassNames, false, false, ignoredKeys);

‎package-lock.json

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@
5050
},
5151
"packageManager": "npm@10.2.5+sha256.8002e3e7305d2abd4016e1368af48d49b066c269079eeb10a56e7d6598acfdaa",
5252
"engines": {
53-
"node": ">=12.13.0"
53+
"node": ">=14.0.0"
5454
},
5555
"license": "MIT"
5656
}

‎tests/lib/rules/arbitrary-values.js

+9
Original file line numberDiff line numberDiff line change
@@ -677,5 +677,14 @@ ruleTester.run("arbitrary-values", rule, {
677677
options: config,
678678
errors: generateErrors("stroke-[angle:var(--some)]"),
679679
},
680+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].map(tag => ({
681+
code: `${tag}\`stroke-[var(--some)] stroke-['yolo'] stroke-[angle:var(--some)]\``,
682+
errors: generateErrors("stroke-[angle:var(--some)]"),
683+
options: [
684+
{
685+
tags: ["myTag"],
686+
},
687+
],
688+
}))),
680689
],
681690
});

‎tests/lib/rules/classnames-order.js

+85-83
Original file line numberDiff line numberDiff line change
@@ -187,8 +187,8 @@ ruleTester.run("classnames-order", rule, {
187187
},
188188
},
189189
},
190-
{
191-
code: `myTag\`
190+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].map(tag => ({
191+
code: `${tag}\`
192192
container
193193
flex
194194
w-12
@@ -200,7 +200,7 @@ ruleTester.run("classnames-order", rule, {
200200
tags: ["myTag"],
201201
},
202202
],
203-
},
203+
}))),
204204
{
205205
code: `<div class="z-dialog flex w-12">Number values</div>`,
206206
settings: {
@@ -699,86 +699,88 @@ ruleTester.run("classnames-order", rule, {
699699
`,
700700
errors: generateErrors(2),
701701
},
702-
{
703-
code: `
704-
myTag\`
705-
invalid
706-
sm:w-6
707-
container
708-
w-12
709-
flex
710-
lg:w-4
711-
\`;`,
712-
output: `
713-
myTag\`
714-
invalid
715-
container
716-
flex
717-
w-12
718-
sm:w-6
719-
lg:w-4
720-
\`;`,
721-
options: [
722-
{
723-
tags: ["myTag"],
724-
},
725-
],
726-
errors: errors,
727-
},
728-
{
729-
code: `
730-
const buttonClasses = myTag\`
731-
\${fullWidth ? "w-12" : "w-6"}
732-
container
733-
\${fullWidth ? "sm:w-8" : "sm:w-4"}
734-
lg:w-9
735-
flex
736-
\${hasError && "bg-red"}
737-
\`;`,
738-
output: `
739-
const buttonClasses = myTag\`
740-
\${fullWidth ? "w-12" : "w-6"}
741-
container
742-
\${fullWidth ? "sm:w-8" : "sm:w-4"}
743-
flex
744-
lg:w-9
745-
\${hasError && "bg-red"}
746-
\`;`,
747-
options: [
748-
{
749-
tags: ["myTag"],
750-
},
751-
],
752-
errors: errors,
753-
},
754-
{
755-
code: `
756-
const buttonClasses = myTag\`
757-
\${fullWidth ? "w-12" : "w-6"}
758-
flex
759-
container
760-
\${fullWidth ? "sm:w-7" : "sm:w-4"}
761-
lg:py-4
762-
sm:py-6
763-
\${hasError && "bg-red"}
764-
\`;`,
765-
output: `
766-
const buttonClasses = myTag\`
767-
\${fullWidth ? "w-12" : "w-6"}
768-
container
769-
flex
770-
\${fullWidth ? "sm:w-7" : "sm:w-4"}
771-
sm:py-6
772-
lg:py-4
773-
\${hasError && "bg-red"}
774-
\`;`,
775-
options: [
776-
{
777-
tags: ["myTag"],
778-
},
779-
],
780-
errors: generateErrors(2),
781-
},
702+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].flatMap(tag => ([
703+
{
704+
code: `
705+
${tag}\`
706+
invalid
707+
sm:w-6
708+
container
709+
w-12
710+
flex
711+
lg:w-4
712+
\`;`,
713+
output: `
714+
${tag}\`
715+
invalid
716+
container
717+
flex
718+
w-12
719+
sm:w-6
720+
lg:w-4
721+
\`;`,
722+
options: [
723+
{
724+
tags: ["myTag"],
725+
},
726+
],
727+
errors: errors,
728+
},
729+
{
730+
code: `
731+
const buttonClasses = ${tag}\`
732+
\${fullWidth ? "w-12" : "w-6"}
733+
container
734+
\${fullWidth ? "sm:w-8" : "sm:w-4"}
735+
lg:w-9
736+
flex
737+
\${hasError && "bg-red"}
738+
\`;`,
739+
output: `
740+
const buttonClasses = ${tag}\`
741+
\${fullWidth ? "w-12" : "w-6"}
742+
container
743+
\${fullWidth ? "sm:w-8" : "sm:w-4"}
744+
flex
745+
lg:w-9
746+
\${hasError && "bg-red"}
747+
\`;`,
748+
options: [
749+
{
750+
tags: ["myTag"],
751+
},
752+
],
753+
errors: errors,
754+
},
755+
{
756+
code: `
757+
const buttonClasses = ${tag}\`
758+
\${fullWidth ? "w-12" : "w-6"}
759+
flex
760+
container
761+
\${fullWidth ? "sm:w-7" : "sm:w-4"}
762+
lg:py-4
763+
sm:py-6
764+
\${hasError && "bg-red"}
765+
\`;`,
766+
output: `
767+
const buttonClasses = ${tag}\`
768+
\${fullWidth ? "w-12" : "w-6"}
769+
container
770+
flex
771+
\${fullWidth ? "sm:w-7" : "sm:w-4"}
772+
sm:py-6
773+
lg:py-4
774+
\${hasError && "bg-red"}
775+
\`;`,
776+
options: [
777+
{
778+
tags: ["myTag"],
779+
},
780+
],
781+
errors: generateErrors(2),
782+
},
783+
]))),
782784
{
783785
code: `
784786
classnames([

‎tests/lib/rules/enforces-negative-arbitrary-values.js

+9
Original file line numberDiff line numberDiff line change
@@ -140,5 +140,14 @@ ruleTester.run("enforces-negative-arbitrary-values", rule, {
140140
code: `<div class="group/edit:-inset-[1px] group/edit:top-[-1px]">support named group/peer syntax</div>`,
141141
errors: generateErrors("group/edit:-inset-[1px]"),
142142
},
143+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].map(tag => ({
144+
code: `${tag}\`-my-[1px] -mx-[1px]\``,
145+
errors: generateErrors("-my-[1px] -mx-[1px]"),
146+
options: [
147+
{
148+
tags: ["myTag"],
149+
},
150+
],
151+
}))),
143152
],
144153
});

‎tests/lib/rules/enforces-shorthand.js

+10
Original file line numberDiff line numberDiff line change
@@ -800,5 +800,15 @@ ruleTester.run("shorthands", rule, {
800800
errors: [generateError(["h-custom", "w-custom"], "size-custom")],
801801
options: customSpacingOnlyOptions,
802802
},
803+
...["myTag", "myTag.subTag", "myTag(SomeComponent)"].map((tag) => ({
804+
code: `${tag}\`overflow-hidden text-ellipsis whitespace-nowrap text-white text-xl\``,
805+
output: `${tag}\`truncate text-white text-xl\``,
806+
errors: [generateError(["overflow-hidden", "text-ellipsis", "whitespace-nowrap"], "truncate")],
807+
options: [
808+
{
809+
tags: ["myTag"],
810+
},
811+
],
812+
})),
803813
],
804814
});

‎tests/lib/rules/migration-from-tailwind-2.js

+18
Original file line numberDiff line numberDiff line change
@@ -382,5 +382,23 @@ ruleTester.run("migration-from-tailwind-2", rule, {
382382
filename: "test.vue",
383383
parser: require.resolve("vue-eslint-parser"),
384384
},
385+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].map(tag => ({
386+
code: `${tag}\`flex-grow-0\``,
387+
output: `${tag}\`grow-0\``,
388+
errors: [
389+
{
390+
messageId: "classnameChanged",
391+
data: {
392+
deprecated: "flex-grow-0",
393+
updated: "grow-0",
394+
},
395+
},
396+
],
397+
options: [
398+
{
399+
tags: ["myTag"],
400+
},
401+
],
402+
}))),
385403
],
386404
});

‎tests/lib/rules/no-arbitrary-value.js

+9
Original file line numberDiff line numberDiff line change
@@ -160,5 +160,14 @@ ruleTester.run("no-arbitrary-value", rule, {
160160
code: `<div className={'min-h-[75dvh]'}>Dynamic viewport units</div>`,
161161
errors: generateErrors(["min-h-[75dvh]"]),
162162
},
163+
...(['myTag', 'myTag.subTag', 'myTag(SomeComponent)'].map(tag => ({
164+
code: `${tag}\`w-[100px]\``,
165+
errors: generateErrors("w-[100px]"),
166+
options: [
167+
{
168+
tags: ["myTag"],
169+
},
170+
],
171+
}))),
163172
],
164173
});

0 commit comments

Comments
 (0)