feat: inline @box-extractor/core as @pandacss/extractor (#387)

Co-authored-by: Segun Adebayo <[email protected]>

Author: astahmer

.changeset/fresh-paws-cry.md

@@ -0,0 +1,7 @@
+---
+'@pandacss/extractor': minor
+'@pandacss/parser': minor
+'@pandacss/types': minor
+---
+
+refactor: swap dependency from @box-extractor/core to @pandacss/extractor

docs/recipe/03-atomic-recipe.mdx

@@ -8,12 +8,12 @@ The inline recipe takes the following properties:
 - `variants`: The variant styles for the recipe
 - `defaultVariants`: The default variants for the recipe
 
-To define an inline recipe, you’d need to use the `recipe` function like this.
+To define an inline recipe, you’d need to use the `cva` function like this.
 
 ```jsx
-import { recipe } from '../panda/css'
+import { cva } from '../panda/css'
 
-const button = recipe({
+const button = cva({
   base: {
     display: 'flex',
   },

package.json

@@ -33,11 +33,11 @@
     "@types/node": "18.15.11",
     "@typescript-eslint/eslint-plugin": "5.58.0",
     "@typescript-eslint/parser": "5.58.0",
-    "concurrently": "^8.0.0",
+    "concurrently": "^8.0.1",
     "husky": "8.0.3",
     "lint-staged": "13.2.1",
     "prettier": "2.8.7",
-    "ts-morph": "17.0.1",
+    "ts-morph": "18.0.0",
     "tsup": "6.7.0",
     "tsx": "3.12.6",
     "typescript": "5.0.4",

packages/extractor/__tests__/create-project.ts

@@ -0,0 +1,48 @@
+import { Project, ts } from 'ts-morph'
+import { extract } from '../src/extract'
+import { type ExtractOptions } from '../src/types'
+
+export const createProject = () => {
+  return new Project({
+    compilerOptions: {
+      jsx: ts.JsxEmit.React,
+      jsxFactory: 'React.createElement',
+      jsxFragmentFactory: 'React.Fragment',
+      module: ts.ModuleKind.ESNext,
+      target: ts.ScriptTarget.ESNext,
+      noUnusedParameters: false,
+      noEmit: true,
+      useVirtualFileSystem: true,
+      allowJs: true,
+    },
+    skipAddingFilesFromTsConfig: true,
+    skipFileDependencyResolution: true,
+    skipLoadingLibFiles: true,
+  })
+}
+
+export type TestExtractOptions = Omit<ExtractOptions, 'ast'> & { tagNameList?: string[]; functionNameList?: string[] }
+export const getTestExtract = (
+  project: Project,
+  code: string,
+  { tagNameList, functionNameList, ...options }: TestExtractOptions,
+) => {
+  const sourceFile = project.createSourceFile('file.tsx', code, { overwrite: true, scriptKind: ts.ScriptKind.TSX })
+  return extract({
+    ast: sourceFile,
+    ...options,
+    components: tagNameList
+      ? {
+          matchTag: ({ tagName }) => tagNameList.includes(tagName),
+          matchProp: () => true,
+        }
+      : options.components,
+    functions: functionNameList
+      ? {
+          matchFn: ({ fnName }) => functionNameList.includes(fnName),
+          matchProp: () => true,
+          matchArg: () => true,
+        }
+      : options.functions,
+  })
+}