1- import type { TSESTree } from '@typescript-eslint/utils'
1+ import { type TSESTree } from '@typescript-eslint/utils'
22import { type Rule , createRule } from '../utils'
33import { isInPandaFunction , isPandaAttribute , isPandaProp , isRecipeVariant } from '../utils/helpers'
44import {
@@ -17,48 +17,69 @@ const rule: Rule = createRule({
1717 meta : {
1818 docs : {
1919 description :
20- "Ensure user doesn 't use dynamic styling at any point. \nPrefer to use static styles, leverage css variables or recipes for known dynamic styles." ,
20+ "Ensure users don 't use dynamic styling. Prefer static styles, leverage CSS variables, or recipes for known dynamic styles." ,
2121 } ,
2222 messages : {
23- dynamic : 'Remove dynamic value. Prefer static styles' ,
24- dynamicProperty : 'Remove dynamic property. Prefer static style property' ,
25- dynamicRecipeVariant : 'Remove dynamic variant. Prefer static variant definition' ,
23+ dynamic : 'Remove dynamic value. Prefer static styles. ' ,
24+ dynamicProperty : 'Remove dynamic property. Prefer static style property. ' ,
25+ dynamicRecipeVariant : 'Remove dynamic variant. Prefer static variant definition. ' ,
2626 } ,
27- type : 'suggestion ' ,
27+ type : 'problem ' ,
2828 schema : [ ] ,
2929 } ,
3030 defaultOptions : [ ] ,
3131 create ( context ) {
32+ // Helper function to determine if a node represents a static value
33+ function isStaticValue ( node : TSESTree . Node | null | undefined ) : boolean {
34+ if ( ! node ) return false
35+ if ( isLiteral ( node ) ) return true
36+ if ( isTemplateLiteral ( node ) && node . expressions . length === 0 ) return true
37+ if ( isObjectExpression ( node ) ) return true // Conditions are acceptable
38+ return false
39+ }
40+
41+ // Function to check array elements for dynamic values
42+ function checkArrayElements ( array : TSESTree . ArrayExpression ) {
43+ array . elements . forEach ( ( element ) => {
44+ if ( ! element ) return
45+ if ( isStaticValue ( element ) ) return
46+
47+ context . report ( {
48+ node : element ,
49+ messageId : 'dynamic' ,
50+ } )
51+ } )
52+ }
53+
3254 return {
33- JSXAttribute ( node ) {
55+ // JSX Attributes
56+ JSXAttribute ( node : TSESTree . JSXAttribute ) {
3457 if ( ! node . value ) return
35- if ( isLiteral ( node . value ) ) return
36- if ( isJSXExpressionContainer ( node . value ) && isLiteral ( node . value . expression ) ) return
37-
38- // For syntax like: <Circle property={`value that could be multiline`} />
39- if (
40- isJSXExpressionContainer ( node . value ) &&
41- isTemplateLiteral ( node . value . expression ) &&
42- node . value . expression . expressions . length === 0
43- )
44- return
4558
46- // Don't warn for objects. Those are conditions
47- if ( isObjectExpression ( node . value . expression ) ) return
59+ if ( isLiteral ( node . value ) ) return
60+ // Check if it's a Panda prop early to avoid unnecessary processing
4861 if ( ! isPandaProp ( node , context ) ) return
4962
50- if ( isArrayExpression ( node . value . expression ) ) {
51- return checkArrayElements ( node . value . expression , context )
63+ if ( isJSXExpressionContainer ( node . value ) ) {
64+ const expr = node . value . expression
65+
66+ if ( isStaticValue ( expr ) ) return
67+
68+ if ( isArrayExpression ( expr ) ) {
69+ checkArrayElements ( expr )
70+ return
71+ }
5272 }
5373
74+ // Report dynamic value usage
5475 context . report ( {
5576 node : node . value ,
5677 messageId : 'dynamic' ,
5778 } )
5879 } ,
5980
60- // Dynamic properties
61- 'Property[computed=true]' ( node : TSESTree . Property ) {
81+ // Dynamic properties with computed keys
82+ 'Property[computed=true]' : ( node : TSESTree . Property ) => {
6283 if ( ! isInPandaFunction ( node , context ) ) return
6384
6485 context . report ( {
@@ -67,22 +88,22 @@ const rule: Rule = createRule({
6788 } )
6889 } ,
6990
70- Property ( node ) {
91+ // Object Properties
92+ Property ( node : TSESTree . Property ) {
7193 if ( ! isIdentifier ( node . key ) ) return
72- if ( isLiteral ( node . value ) ) return
73-
74- // For syntax like: { property: `value that could be multiline` }
75- if ( isTemplateLiteral ( node . value ) && node . value . expressions . length === 0 ) return
76-
77- // Don't warn for objects. Those are conditions
78- if ( isObjectExpression ( node . value ) ) return
7994
95+ // Check if it's a Panda attribute early to avoid unnecessary processing
8096 if ( ! isPandaAttribute ( node , context ) ) return
97+ if ( isRecipeVariant ( node , context ) ) return
98+
99+ if ( isStaticValue ( node . value ) ) return
81100
82101 if ( isArrayExpression ( node . value ) ) {
83- return checkArrayElements ( node . value , context )
102+ checkArrayElements ( node . value )
103+ return
84104 }
85105
106+ // Report dynamic value usage
86107 context . report ( {
87108 node : node . value ,
88109 messageId : 'dynamic' ,
@@ -92,17 +113,4 @@ const rule: Rule = createRule({
92113 } ,
93114} )
94115
95- function checkArrayElements ( array : TSESTree . ArrayExpression , context : Parameters < ( typeof rule ) [ 'create' ] > [ 0 ] ) {
96- array . elements . forEach ( ( node ) => {
97- if ( ! node ) return
98- if ( isLiteral ( node ) ) return
99- if ( isTemplateLiteral ( node ) && node . expressions . length === 0 ) return
100-
101- context . report ( {
102- node : node ,
103- messageId : 'dynamic' ,
104- } )
105- } )
106- }
107-
108116export default rule
0 commit comments