wip: file-matcher

chakra-ui · Feb 11, 2025 · 4a608aa · 4a608aa
1 parent 046521b
commit 4a608aa
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 9 deletions.
diff --git a/packages/core/__tests__/file-matcher.test.ts b/packages/core/__tests__/file-matcher.test.ts
@@ -105,7 +105,7 @@ describe('file matcher', () => {
     expect(file.isValidPattern('stack')).toMatchInlineSnapshot('true')
 
     expect(file.isValidPattern('__vstack')).toMatchInlineSnapshot('true')
-    expect(file.isValidPattern('vstack')).toMatchInlineSnapshot('true')
+    expect(file.isValidPattern('vstack')).toMatchInlineSnapshot('false') // This shouldnt match vstack is aliased as __vstack
   })
 
   test('is valid recipe', () => {
@@ -126,28 +126,35 @@ describe('file matcher', () => {
     ])
 
     expect(file.isValidRecipe('randxxx')).toMatchInlineSnapshot('false')
-    expect(file.isValidRecipe('button')).toMatchInlineSnapshot('true')
+    expect(file.isValidRecipe('button')).toMatchInlineSnapshot('false') // this shouldnt match button is aliased as buttonStyle
 
     expect(file.isValidRecipe('buttonStyle')).toMatchInlineSnapshot('true')
-    expect(file.isValidRecipe('button')).toMatchInlineSnapshot('true')
+    expect(file.isValidRecipe('button')).toMatchInlineSnapshot('false') // Redundant test?
     expect(file.isValidRecipe('xxxbutton')).toMatchInlineSnapshot('false')
   })
 
   test('is raw fn', () => {
     const ctx = createContext()
 
     const file = ctx.imports.file([
+      { mod: 'other-system/css', name: 'css', alias: 'css' },
       { mod: 'styled-system/css', name: 'css', alias: 'xcss' },
       { mod: 'styled-system/css', name: 'cva', alias: 'cva' },
       { mod: 'styled-system/patterns', name: 'stack', alias: 'stack' },
+      { mod: 'styled-system/patterns', name: 'grid', alias: 'aliasedGrid' },
     ])
 
-    expect(file.isRawFn('css')).toMatchInlineSnapshot('true')
-    expect(file.isRawFn('xcss')).toMatchInlineSnapshot('false')
+    expect(file.isRawFn('css')).toMatchInlineSnapshot('false')
+    expect(file.isRawFn('xcss')).toMatchInlineSnapshot('true')
+
+    expect(file.isRawFn('css.raw')).toMatchInlineSnapshot('false')
+    expect(file.isRawFn('xcss.raw')).toMatchInlineSnapshot('true')
 
-    expect(file.isRawFn('css.raw')).toMatchInlineSnapshot('true')
     expect(file.isRawFn('stack.raw')).toMatchInlineSnapshot('true')
 
+    expect(file.isRawFn('card.raw')).toMatchInlineSnapshot('false')
+    expect(file.isRawFn('aliasedGrid.raw')).toMatchInlineSnapshot('true')
+
     expect(file.isRawFn('cva.raw')).toMatchInlineSnapshot('false')
   })
 

diff --git a/packages/core/src/file-matcher.ts b/packages/core/src/file-matcher.ts
@@ -145,8 +145,11 @@ export class FileMatcher {
         if (mod.kind === 'namespace') {
           return keys.includes(id.replace(`${mod.alias}.`, ''))
         }
-
-        return mod.alias === id || mod.name === id
+        // prefer alias
+        if (mod.alias) {
+          return mod.alias === id
+        }
+        return mod.name === id
       })
     })
   }
@@ -177,9 +180,16 @@ export class FileMatcher {
     return this._recipesMatcher(id)
   }
 
+  private _cssMatcher: ReturnType<typeof this.createMatch> | undefined
+
+  isValidCss = (id: string) => {
+    this._cssMatcher ||= this.createMatch(this.importMap.css, ['css'])
+    return this._cssMatcher(id)
+  }
+
   isRawFn = (fnName: string) => {
     const name = fnName.split('.raw')[0] ?? ''
-    return name === 'css' || this.isValidPattern(name) || this.isValidRecipe(name)
+    return this.isValidCss(name) || this.isValidPattern(name) || this.isValidRecipe(name)
   }
 
   isNamespaced = (fnName: string) => {