chore: fix jsxfactory

Author: anubra266

plugin/src/utils/helpers.ts

@@ -97,6 +97,12 @@ const isValidStyledProp = <T extends Node>(node: T, context: RuleContext<any, an
 export const isPandaIsh = (name: string, context: RuleContext<any, any>) => {
   const imports = getImports(context)
   if (imports.length === 0) return false
+  // Check if the name is the jsx factory
+  const jsxFactory = syncAction('getJsxFactory', getSyncOpts(context))
+  if (jsxFactory && name === jsxFactory) {
+    // Check if the jsx factory is imported
+    return imports.some((imp) => imp.name === name || imp.alias === name)
+  }
   return syncAction('matchFile', getSyncOpts(context), name, imports)
 }
 
@@ -159,10 +165,14 @@ export const isPandaProp = (node: TSESTree.JSXAttribute, context: RuleContext<an
   const prop = node.name.name
 
   // Ensure component is a panda component
-  if (!isPandaIsh(name, context) && !isLocalStyledFactory(jsxAncestor, context)) return
+  const isPandaComponent = isPandaIsh(name, context) || isLocalStyledFactory(jsxAncestor, context)
+  if (!isPandaComponent) return
 
   // Ensure prop is a styled prop
-  if (typeof prop !== 'string' || !isValidProperty(prop, context, name)) return
+  // For jsx factory components (e.g., styled.div), pass undefined as the pattern name
+  // so that only global property validation is performed
+  const patternName = isJSXMemberExpression(jsxAncestor.name) ? undefined : name
+  if (typeof prop !== 'string' || !isValidProperty(prop, context, patternName)) return
 
   return true
 }

plugin/src/utils/worker.ts

@@ -114,11 +114,19 @@ async function resolveLongHand(ctx: Generator, name: string): Promise<string | u
 async function isValidProperty(ctx: Generator, name: string, patternName?: string) {
   const isValid = ctx.isValidProperty(name)
   if (isValid) return true
-  if (!patternName) return
+  if (!patternName) return false
+
+  // If the pattern name is the jsxFactory (e.g., 'styled'), we should accept
+  // any property that is valid according to the global property check
+  // Since styled components are generic wrappers, we don't need pattern-specific checks
+  if (patternName === ctx.config.jsxFactory) {
+    // Already checked globally above, so return false if we got here
+    return false
+  }
 
   const pattern = ctx.patterns.details.find((p) => p.baseName === patternName || p.jsx.includes(patternName))?.config
     .properties
-  if (!pattern) return
+  if (!pattern) return false
   return Object.keys(pattern).includes(name)
 }
 
@@ -142,6 +150,10 @@ async function matchImports(ctx: Generator, result: MatchImportResult) {
   return isMatch
 }
 
+async function getJsxFactory(ctx: Generator) {
+  return ctx.config.jsxFactory
+}
+
 export function runAsync(action: 'filterInvalidTokens', opts: Opts, paths: string[]): Promise<string[]>
 export function runAsync(action: 'isColorToken', opts: Opts, value: string): Promise<boolean>
 export function runAsync(action: 'isColorAttribute', opts: Opts, attr: string): Promise<boolean>
@@ -152,6 +164,7 @@ export function runAsync(action: 'isValidProperty', opts: Opts, name: string, pa
 export function runAsync(action: 'matchFile', opts: Opts, name: string, imports: ImportResult[]): Promise<boolean>
 export function runAsync(action: 'matchImports', opts: Opts, result: MatchImportResult): Promise<boolean>
 export function runAsync(action: 'getPropCategory', opts: Opts, prop: string): Promise<string>
+export function runAsync(action: 'getJsxFactory', opts: Opts): Promise<string | undefined>
 export function runAsync(
   action: 'filterDeprecatedTokens',
   opts: Opts,
@@ -190,6 +203,8 @@ export async function runAsync(action: string, opts: Opts, ...args: any): Promis
     case 'getPropCategory':
       // @ts-expect-error cast
       return getPropCategory(ctx, ...args)
+    case 'getJsxFactory':
+      return getJsxFactory(ctx)
     case 'filterDeprecatedTokens':
       // @ts-expect-error cast
       return filterDeprecatedTokens(ctx, ...args)
@@ -206,6 +221,7 @@ export function run(action: 'isValidProperty', opts: Opts, name: string, pattern
 export function run(action: 'matchFile', opts: Opts, name: string, imports: ImportResult[]): boolean
 export function run(action: 'matchImports', opts: Opts, result: MatchImportResult): boolean
 export function run(action: 'getPropCategory', opts: Opts, prop: string): string
+export function run(action: 'getJsxFactory', opts: Opts): string | undefined
 export function run(action: 'filterDeprecatedTokens', opts: Opts, tokens: DeprecatedToken[]): DeprecatedToken[]
 export function run(action: string, opts: Opts, ...args: any[]): any {
   // @ts-expect-error cast