@pandacss/parser 0.0.0-dev-20230413133612 → 0.0.0-dev-20230413141731

package/dist/index.d.ts

@@ -1,13 +1,22 @@
 import * as _pandacss_types from '@pandacss/types';
+import { RecipeConfig } from '@pandacss/types';
 import * as ts_morph from 'ts-morph';
 import { ProjectOptions as ProjectOptions$1 } from 'ts-morph';
 
-type ParserNodeOptions = {
+type ParserPatternNode = {
     name: string;
-    type: 'pattern' | 'recipe';
+    type: 'pattern';
     props?: string[];
     baseName: string;
 };
+type ParserRecipeNode = {
+    name: string;
+    type: 'recipe';
+    props: string[];
+    baseName: string;
+    jsx: RecipeConfig['jsx'];
+};
+type ParserNodeOptions = ParserPatternNode | ParserRecipeNode;
 type ParserOptions = {
     importMap: Record<'css' | 'recipe' | 'pattern' | 'jsx', string>;
     jsx?: {
@@ -15,8 +24,9 @@ type ParserOptions = {
         nodes: ParserNodeOptions[];
         isStyleProp: (prop: string) => boolean;
     };
+    getRecipeName: (tagName: string) => string;
+    getRecipeByName: (name: string) => RecipeConfig | undefined;
 };
-type ParserMode = 'box-extractor' | 'internal';
 
 type ProjectOptions = Partial<ProjectOptions$1> & {
     readFile: (filePath: string) => string;
@@ -27,10 +37,10 @@ declare const createProject: ({ getFiles, readFile, parserOptions, ...projectOpt
     getSourceFile: (filePath: string) => ts_morph.SourceFile | undefined;
     removeSourceFile: (filePath: string) => void;
     createSourceFile: (filePath: string) => ts_morph.SourceFile;
-    parseSourceFile: (filePath: string, properties: string[], mode?: ParserMode) => _pandacss_types.ParserResult | undefined;
+    parseSourceFile: (filePath: string, properties: string[]) => _pandacss_types.ParserResult | undefined;
     reloadSourceFile: (filePath: string) => ts_morph.FileSystemRefreshResult | undefined;
     reloadSourceFiles: () => void;
 };
 type Project = ReturnType<typeof createProject>;
 
-export { ParserMode, Project, ProjectOptions, createProject };
+export { Project, ProjectOptions, createProject };

package/dist/index.js

@@ -26,124 +26,19 @@ module.exports = __toCommonJS(src_exports);
 
 // src/project.ts
 var import_lil_fp = require("lil-fp");
-var import_ts_morph5 = require("ts-morph");
+var import_ts_morph2 = require("ts-morph");
 
 // src/parser.ts
 var import_extractor = require("@pandacss/extractor");
 var import_logger = require("@pandacss/logger");
 var import_shared2 = require("@pandacss/shared");
-var import_ts_morph4 = require("ts-morph");
-var import_ts_pattern3 = require("ts-pattern");
-
-// src/call-expression.ts
-var import_ts_morph2 = require("ts-morph");
-
-// src/literal.ts
 var import_ts_morph = require("ts-morph");
 var import_ts_pattern = require("ts-pattern");
 
-// src/strip-quotes.ts
-function stripQuotes(q) {
-  const quoteStart = `'|"|\u2018|\u201C|\u2039|\xAB`;
-  const quoteEnd = `'|"|\u2019|\u201D|\u203A|\xBB`;
-  if (typeof q !== "string")
-    throw new Error(`input was '${typeof q}' and not of type 'string'`);
-  if (!q.length)
-    throw new Error(`input was empty`);
-  let s = q;
-  let t = s.length;
-  if (s.charAt(0).match(new RegExp(quoteStart))) {
-    s = s.substring(1, t--);
-  }
-  if (s.charAt(--t).match(new RegExp(quoteEnd))) {
-    s = s.substring(0, t);
-  }
-  return s;
-}
-
-// src/literal.ts
-function isPrimitiveLiteral(node) {
-  return import_ts_morph.Node.isStringLiteral(node) || import_ts_morph.Node.isNumericLiteral(node) || import_ts_morph.Node.isTrueLiteral(node) || import_ts_morph.Node.isFalseLiteral(node);
-}
-function extractValue(value) {
-  return (0, import_ts_pattern.match)(value).when(
-    (node) => import_ts_morph.Node.isStringLiteral(node) || import_ts_morph.Node.isNoSubstitutionTemplateLiteral(node),
-    (value2) => {
-      return value2.getLiteralValue().replaceAll(/[\n\s]+/g, " ");
-    }
-  ).when(isPrimitiveLiteral, (value2) => {
-    return value2.getLiteralValue();
-  }).when(import_ts_morph.Node.isNullLiteral, () => {
-    return null;
-  }).when(import_ts_morph.Node.isObjectLiteralExpression, (value2) => {
-    return extractObjectLiteral(value2);
-  }).when(import_ts_morph.Node.isArrayLiteralExpression, (value2) => {
-    return extractArrayLiteral(value2);
-  }).otherwise(() => {
-    return void 0;
-  });
-}
-function extractObjectLiteral(node) {
-  const data = {};
-  const properties = node.getProperties();
-  for (const property of properties) {
-    if (import_ts_morph.Node.isPropertyAssignment(property)) {
-      const key = stripQuotes(property.getName());
-      const value = property.getInitializer();
-      const returnValue = extractValue(value);
-      if (returnValue !== void 0) {
-        data[key] = returnValue;
-      }
-    }
-  }
-  return data;
-}
-function extractArrayLiteral(node) {
-  const result = [];
-  node.forEachChild((child) => {
-    (0, import_ts_pattern.match)(child).when(isPrimitiveLiteral, (child2) => {
-      result.push(child2.getLiteralValue());
-    }).when(import_ts_morph.Node.isUndefinedKeyword, () => {
-      result.push(void 0);
-    }).when(import_ts_morph.Node.isNullLiteral, () => {
-      result.push(null);
-    }).when(import_ts_morph.Node.isObjectLiteralExpression, (child2) => {
-      result.push(extractObjectLiteral(child2));
-    }).when(import_ts_morph.Node.isArrayLiteralExpression, (child2) => {
-      result.push(extractArrayLiteral(child2));
-    }).otherwise(() => {
-    });
-  });
-  return result;
-}
-
-// src/call-expression.ts
-function visitCallExpressions(file, options) {
-  const { match: match4, fn } = options;
-  const callExpressions = file.getDescendantsOfKind(import_ts_morph2.ts.SyntaxKind.CallExpression);
-  for (const node of callExpressions) {
-    const expr = node.getExpression();
-    const name = expr.getText();
-    if (!match4(name)) {
-      continue;
-    }
-    const args = node.getArguments();
-    if (args.length === 0) {
-      fn({ name, data: {} });
-      continue;
-    }
-    args.forEach((arg) => {
-      if (import_ts_morph2.Node.isObjectLiteralExpression(arg)) {
-        fn({ name, data: extractObjectLiteral(arg) });
-      }
-    });
-  }
-}
-
 // src/import.ts
 var import_shared = require("@pandacss/shared");
 function getImportDeclarations(file, options) {
-  const { match: match4 } = options;
+  const { match: match2 } = options;
   const result = [];
   file.getImportDeclarations().forEach((node) => {
     const source = node.getModuleSpecifierValue();
@@ -153,7 +48,7 @@ function getImportDeclarations(file, options) {
     specifiers.forEach((specifier) => {
       const name = specifier.getNameNode().getText();
       const alias = specifier.getAliasNode()?.getText() || name;
-      if (!match4({ id: name, mod: source }))
+      if (!match2({ id: name, mod: source }))
         return;
       result.push({ name, alias, mod: source });
     });
@@ -182,49 +77,6 @@ function getImportDeclarations(file, options) {
   };
 }
 
-// src/jsx-element.ts
-var import_ts_morph3 = require("ts-morph");
-var import_ts_pattern2 = require("ts-pattern");
-function visitJsxElement(file, options) {
-  const { match: matchProp, fn } = options;
-  const elements = [
-    ...file.getDescendantsOfKind(import_ts_morph3.ts.SyntaxKind.JsxOpeningElement),
-    ...file.getDescendantsOfKind(import_ts_morph3.ts.SyntaxKind.JsxSelfClosingElement)
-  ];
-  for (const node of elements) {
-    const tag = node.getTagNameNode().getText();
-    if (!tag || !matchProp.tag(tag)) {
-      continue;
-    }
-    const props = node.getAttributes();
-    const data = {};
-    for (const prop of props) {
-      if (!import_ts_morph3.Node.isJsxAttribute(prop)) {
-        continue;
-      }
-      const name = prop.getName();
-      const value = prop.getInitializer();
-      if (!tag || !matchProp.prop({ tag, name })) {
-        continue;
-      }
-      (0, import_ts_pattern2.match)(value).when(import_ts_morph3.Node.isStringLiteral, (value2) => {
-        data[name] = value2.getLiteralValue().replaceAll(/[\n\s]+/g, " ");
-      }).when(import_ts_morph3.Node.isJsxExpression, (value2) => {
-        const expr = value2.getExpression();
-        const returnValue = extractValue(expr);
-        if (returnValue !== void 0) {
-          data[name] = returnValue;
-        }
-      }).otherwise(() => {
-        if (!value) {
-          data[name] = true;
-        }
-      });
-    }
-    fn({ name: tag, data });
-  }
-}
-
 // src/parser-result.ts
 var createParserResult = () => ({
   jsx: /* @__PURE__ */ new Set(),
@@ -252,6 +104,7 @@ var createParserResult = () => ({
 });
 
 // src/parser.ts
+var isNodeRecipe = (node) => node.type === "recipe";
 function createImportMatcher(mod, values) {
   const regex = values ? new RegExp(`^(${values.join("|")})$`) : /.*/;
   return {
@@ -266,11 +119,11 @@ var combineResult = (unboxed) => {
   return [...unboxed.conditions, unboxed.raw, ...unboxed.spreadConditions];
 };
 function createParser(options) {
-  return function parse(sourceFile, confProperties, mode = "internal") {
+  return function parse(sourceFile, confProperties) {
     if (!sourceFile)
       return;
     const filePath = sourceFile.getFilePath();
-    const { jsx, importMap } = options;
+    const { jsx, importMap, getRecipeByName } = options;
     const importRegex = [
       createImportMatcher(importMap.css, ["css", "cva"]),
       createImportMatcher(importMap.recipe),
@@ -296,195 +149,163 @@ function createParser(options) {
     const isValidStyleFn = (name) => name === jsx?.factory;
     const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "panda";
     const jsxPatternNodes = new RegExp(`(${jsx?.nodes.map((node) => node.type === "pattern" && node.name).join("|")})$`);
-    const jsxRecipeNodes = new RegExp(`(${jsx?.nodes.map((node) => node.type === "recipe" && node.name).join("|")})$`);
-    if (mode === "box-extractor") {
-      const recipes = /* @__PURE__ */ new Map();
-      imports.value.forEach((importDeclaration) => {
-        const { name, alias } = importDeclaration;
-        const isRecipe = isValidRecipe(name);
-        if (isRecipe) {
-          recipes.set(alias, true);
-        }
-      });
-      const functions = /* @__PURE__ */ new Map();
-      const components = /* @__PURE__ */ new Map();
-      const propertiesMap = new Map(confProperties.map((prop) => [prop, true]));
-      const cvaAlias = imports.getAlias("cva");
-      const cssAlias = imports.getAlias("css");
-      if (options.jsx) {
-        options.jsx.nodes.forEach((node) => {
-          const properties = node.props ? new Map(propertiesMap) : propertiesMap;
-          const alias = imports.getAlias(node.name);
-          node.props?.forEach((prop) => properties.set(prop, true));
-          functions.set(node.baseName, properties);
-          functions.set(alias, properties);
-          components.set(alias, properties);
-        });
+    const recipes = /* @__PURE__ */ new Map();
+    imports.value.forEach((importDeclaration) => {
+      const { name, alias } = importDeclaration;
+      const isRecipe = isValidRecipe(name);
+      if (isRecipe) {
+        recipes.set(alias, true);
       }
-      const matchTag = (0, import_shared2.memo)((tagName) => {
-        return components.has(tagName) || isUpperCase(tagName) || tagName.startsWith(jsxFactoryAlias);
-      });
-      const matchTagProp = (0, import_shared2.memo)((tagName, propName) => {
-        if (propertiesMap.size === 0)
-          return true;
-        return Boolean(components.get(tagName)?.get(propName)) || propertiesMap.has(propName);
-      });
-      const matchFn = (0, import_shared2.memo)((fnName) => {
-        if (recipes.has(fnName))
-          return true;
-        if (fnName === cvaAlias || fnName === cssAlias || fnName.startsWith(jsxFactoryAlias))
-          return true;
-        return Boolean(functions.get(fnName));
-      });
-      const matchFnProp = (0, import_shared2.memo)((fnName, propName) => {
-        if (propertiesMap.size === 0)
-          return true;
-        if (recipes.has(fnName))
-          return true;
-        if (fnName === cvaAlias)
-          return true;
-        if (fnName.startsWith(jsxFactoryAlias))
-          return true;
-        if (fnName === cssAlias)
-          return Boolean(propertiesMap.get(propName) || propName === "selectors");
-        return Boolean(functions.get(fnName)?.get(propName));
-      });
-      const measure2 = import_logger.logger.time.debug(`Tokens extracted from ${filePath}`);
-      const extractResultByName = (0, import_extractor.extract)({
-        ast: sourceFile,
-        components: {
-          matchTag: (prop) => matchTag(prop.tagName),
-          matchProp: (prop) => matchTagProp(prop.tagName, prop.propName)
-        },
-        functions: {
-          matchFn: (prop) => matchFn(prop.fnName),
-          matchProp: (prop) => matchFnProp(prop.fnName, prop.propName),
-          matchArg: (prop) => {
-            if (prop.fnName === jsxFactoryAlias && prop.index === 1 && import_ts_morph4.Node.isIdentifier(prop.argNode))
-              return false;
-            return true;
+    });
+    const functions = /* @__PURE__ */ new Map();
+    const components = /* @__PURE__ */ new Map();
+    const propertiesMap = new Map(confProperties.map((prop) => [prop, true]));
+    const recipePropertiesByName = /* @__PURE__ */ new Map();
+    const recipeJsxLists = (jsx?.nodes ?? []).filter(isNodeRecipe).reduce(
+      (acc, recipe) => {
+        recipePropertiesByName.set(recipe.baseName, new Set(recipe.props ?? []));
+        recipe.jsx?.forEach((jsx2) => {
+          if (typeof jsx2 === "string") {
+            acc.string.add(jsx2);
+          } else {
+            acc.regex.push(jsx2);
           }
-        },
-        flags: { skipTraverseFiles: true }
+        });
+        return acc;
+      },
+      { string: /* @__PURE__ */ new Set(), regex: [] }
+    );
+    const cvaAlias = imports.getAlias("cva");
+    const cssAlias = imports.getAlias("css");
+    if (options.jsx) {
+      options.jsx.nodes.forEach((node) => {
+        const properties = node.props ? new Map(propertiesMap) : propertiesMap;
+        const alias = imports.getAlias(node.name);
+        node.props?.forEach((prop) => properties.set(prop, true));
+        functions.set(alias, properties);
+        components.set(alias, properties);
       });
-      measure2();
-      extractResultByName.forEach((result, alias) => {
-        const name = imports.getName(alias);
-        import_logger.logger.debug(`ast:${name}`, { filePath, result, alias });
-        if (result.kind === "function") {
-          (0, import_ts_pattern3.match)(name).when(css.match, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.set(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
-              });
-            });
-          }).when(isValidPattern, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.setPattern(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
-              });
+    }
+    const getRecipeName = (0, import_shared2.memo)(options.getRecipeName);
+    const isJsxTagRecipe = (0, import_shared2.memo)(
+      (tagName) => recipeJsxLists.string.has(tagName) || recipeJsxLists.regex.some((regex) => regex.test(tagName))
+    );
+    const matchTag = (0, import_shared2.memo)((tagName) => {
+      return components.has(tagName) || isUpperCase(tagName) || tagName.startsWith(jsxFactoryAlias) || isJsxTagRecipe(tagName);
+    });
+    const matchTagProp = (0, import_shared2.memo)((tagName, propName) => {
+      if (propertiesMap.size === 0)
+        return true;
+      if (Boolean(components.get(tagName)?.get(propName)) || propertiesMap.has(propName))
+        return true;
+      if (isJsxTagRecipe(tagName)) {
+        const recipe = getRecipeByName(getRecipeName(tagName));
+        if (recipe) {
+          return recipePropertiesByName.get(recipe.name)?.has(propName) ?? false;
+        }
+      }
+      return false;
+    });
+    const matchFn = (0, import_shared2.memo)((fnName) => {
+      if (recipes.has(fnName))
+        return true;
+      if (fnName === cvaAlias || fnName === cssAlias || fnName.startsWith(jsxFactoryAlias))
+        return true;
+      return Boolean(functions.get(fnName));
+    });
+    const matchFnProp = (0, import_shared2.memo)((fnName, propName) => {
+      if (propertiesMap.size === 0)
+        return true;
+      if (recipes.has(fnName))
+        return true;
+      if (fnName === cvaAlias)
+        return true;
+      if (fnName.startsWith(jsxFactoryAlias))
+        return true;
+      if (fnName === cssAlias)
+        return Boolean(propertiesMap.get(propName) || propName === "selectors");
+      return Boolean(functions.get(fnName)?.get(propName));
+    });
+    const measure = import_logger.logger.time.debug(`Tokens extracted from ${filePath}`);
+    const extractResultByName = (0, import_extractor.extract)({
+      ast: sourceFile,
+      components: {
+        matchTag: (prop) => matchTag(prop.tagName),
+        matchProp: (prop) => matchTagProp(prop.tagName, prop.propName)
+      },
+      functions: {
+        matchFn: (prop) => matchFn(prop.fnName),
+        matchProp: (prop) => matchFnProp(prop.fnName, prop.propName),
+        matchArg: (prop) => {
+          if (prop.fnName === jsxFactoryAlias && prop.index === 1 && import_ts_morph.Node.isIdentifier(prop.argNode))
+            return false;
+          return true;
+        }
+      },
+      flags: { skipTraverseFiles: true }
+    });
+    measure();
+    extractResultByName.forEach((result, alias) => {
+      const name = imports.getName(alias);
+      import_logger.logger.debug(`ast:${name}`, { filePath, result, alias });
+      if (result.kind === "function") {
+        (0, import_ts_pattern.match)(name).when(css.match, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.set(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
             });
-          }).when(isValidRecipe, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.setRecipe(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
-              });
+          });
+        }).when(isValidPattern, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.setPattern(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
             });
-          }).when(isValidStyleFn, () => {
-            result.queryList.forEach((query) => {
-              collector.setCva({
-                name,
-                box: query.box,
-                data: combineResult((0, import_extractor.unbox)(query.box))
-              });
+          });
+        }).when(isValidRecipe, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.setRecipe(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult((0, import_extractor.unbox)(query.box.value[0]))
             });
-          }).otherwise(() => {
           });
-        } else if (result.kind === "component") {
+        }).when(isValidStyleFn, () => {
           result.queryList.forEach((query) => {
-            let type;
-            const data = combineResult((0, import_extractor.unbox)(query.box));
-            import_logger.logger.debug(`ast:jsx:${name}`, { filePath, result: data });
-            if (jsx && name.startsWith(jsxFactoryAlias)) {
-              type = "jsx-factory";
-            } else if (jsxPatternNodes.test(name)) {
-              type = "pattern";
-            } else if (jsxRecipeNodes.test(name)) {
-              type = "recipe";
-            } else {
-              type = "jsx";
-            }
-            collector.jsx.add({
-              // from "panda.*" -> "panda.button"
+            collector.setCva({
               name,
-              box: query.box,
-              type,
-              data
+              box: query.box.value[1],
+              data: combineResult((0, import_extractor.unbox)(query.box.value[1]))
             });
           });
-        }
-      });
-      return collector;
-    }
-    const measure = import_logger.logger.time.debug(`Tokens extracted & collected from ${filePath}`);
-    visitCallExpressions(sourceFile, {
-      match: (0, import_shared2.memo)((name) => imports.match(name)),
-      fn({ name: _name, data }) {
-        const name = imports.getName(_name);
-        const [css2] = importRegex;
-        const result = { name, data };
-        import_logger.logger.debug(`ast:${name}`, { filePath, result });
-        (0, import_ts_pattern3.match)(name).when(css2.match, (name2) => {
-          collector.set(name2, result);
-        }).when(isValidPattern, (name2) => {
-          collector.setPattern(name2, result);
-        }).when(isValidRecipe, (name2) => {
-          collector.setRecipe(name2, result);
-        }).when(isValidStyleFn, () => {
-          collector.setCva(result);
         }).otherwise(() => {
         });
+      } else if (result.kind === "component") {
+        result.queryList.forEach((query) => {
+          const data = combineResult((0, import_extractor.unbox)(query.box));
+          import_logger.logger.debug(`ast:jsx:${name}`, { filePath, result: data });
+          if (jsx && name.startsWith(jsxFactoryAlias)) {
+            collector.jsx.add({ name, box: query.box, type: "jsx-factory", data });
+          } else if (jsxPatternNodes.test(name)) {
+            collector.setPattern(name, { type: "jsx-pattern", name, box: query.box, data });
+          } else if (recipeJsxLists.string.has(name) || recipeJsxLists.regex.some((regex) => regex.test(name))) {
+            collector.setRecipe(getRecipeName(name), { type: "jsx-recipe", name, box: query.box, data });
+          } else {
+            collector.jsx.add({ name, box: query.box, type: "jsx", data });
+          }
+        });
       }
     });
-    visitJsxElement(sourceFile, {
-      match: {
-        tag: (0, import_shared2.memo)((name) => {
-          return name.startsWith(jsxFactoryAlias) || isUpperCase(name);
-        }),
-        prop: ({ tag, name }) => {
-          const node = jsx?.nodes.find((n) => n.name === tag);
-          return !!jsx?.isStyleProp(name) || !!node?.props?.includes(name);
-        }
-      },
-      fn({ name, data }) {
-        let type;
-        import_logger.logger.debug(`ast:jsx:${name}`, { filePath, result: data });
-        if (jsx && name.startsWith(jsxFactoryAlias)) {
-          type = "jsx-factory";
-        } else if (jsxPatternNodes.test(name)) {
-          type = "pattern";
-        } else if (jsxRecipeNodes.test(name)) {
-          type = "recipe";
-        } else {
-          type = "jsx";
-        }
-        collector.jsx.add({ type, name, data });
-      }
-    });
-    measure();
     return collector;
   };
 }
 var isUpperCase = (value) => value[0] === value[0].toUpperCase();
 
 // src/project.ts
-var createTsProject = (options) => new import_ts_morph5.Project({
+var createTsProject = (options) => new import_ts_morph2.Project({
   skipAddingFilesFromTsConfig: true,
   skipFileDependencyResolution: true,
   skipLoadingLibFiles: true,
@@ -510,10 +331,10 @@ var createProject = ({ getFiles, readFile, parserOptions, ...projectOptions }) =
     },
     createSourceFile: (filePath) => project.createSourceFile(filePath, readFile(filePath), {
       overwrite: true,
-      scriptKind: import_ts_morph5.ScriptKind.TSX
+      scriptKind: import_ts_morph2.ScriptKind.TSX
     }),
-    parseSourceFile: (filePath, properties, mode = "box-extractor") => {
-      return parser(project.getSourceFile(filePath), properties, mode);
+    parseSourceFile: (filePath, properties) => {
+      return parser(project.getSourceFile(filePath), properties);
     }
   })),
   (0, import_lil_fp.tap)(({ createSourceFile }) => {

package/dist/index.mjs

@@ -6,120 +6,13 @@ import { Project as TsProject, ScriptKind } from "ts-morph";
 import { extract, unbox } from "@pandacss/extractor";
 import { logger } from "@pandacss/logger";
 import { memo as memo2 } from "@pandacss/shared";
-import { Node as Node4 } from "ts-morph";
-import { match as match3 } from "ts-pattern";
-
-// src/call-expression.ts
-import { Node as Node2, ts } from "ts-morph";
-
-// src/literal.ts
-import {
-  Node
-} from "ts-morph";
+import { Node } from "ts-morph";
 import { match } from "ts-pattern";
 
-// src/strip-quotes.ts
-function stripQuotes(q) {
-  const quoteStart = `'|"|\u2018|\u201C|\u2039|\xAB`;
-  const quoteEnd = `'|"|\u2019|\u201D|\u203A|\xBB`;
-  if (typeof q !== "string")
-    throw new Error(`input was '${typeof q}' and not of type 'string'`);
-  if (!q.length)
-    throw new Error(`input was empty`);
-  let s = q;
-  let t = s.length;
-  if (s.charAt(0).match(new RegExp(quoteStart))) {
-    s = s.substring(1, t--);
-  }
-  if (s.charAt(--t).match(new RegExp(quoteEnd))) {
-    s = s.substring(0, t);
-  }
-  return s;
-}
-
-// src/literal.ts
-function isPrimitiveLiteral(node) {
-  return Node.isStringLiteral(node) || Node.isNumericLiteral(node) || Node.isTrueLiteral(node) || Node.isFalseLiteral(node);
-}
-function extractValue(value) {
-  return match(value).when(
-    (node) => Node.isStringLiteral(node) || Node.isNoSubstitutionTemplateLiteral(node),
-    (value2) => {
-      return value2.getLiteralValue().replaceAll(/[\n\s]+/g, " ");
-    }
-  ).when(isPrimitiveLiteral, (value2) => {
-    return value2.getLiteralValue();
-  }).when(Node.isNullLiteral, () => {
-    return null;
-  }).when(Node.isObjectLiteralExpression, (value2) => {
-    return extractObjectLiteral(value2);
-  }).when(Node.isArrayLiteralExpression, (value2) => {
-    return extractArrayLiteral(value2);
-  }).otherwise(() => {
-    return void 0;
-  });
-}
-function extractObjectLiteral(node) {
-  const data = {};
-  const properties = node.getProperties();
-  for (const property of properties) {
-    if (Node.isPropertyAssignment(property)) {
-      const key = stripQuotes(property.getName());
-      const value = property.getInitializer();
-      const returnValue = extractValue(value);
-      if (returnValue !== void 0) {
-        data[key] = returnValue;
-      }
-    }
-  }
-  return data;
-}
-function extractArrayLiteral(node) {
-  const result = [];
-  node.forEachChild((child) => {
-    match(child).when(isPrimitiveLiteral, (child2) => {
-      result.push(child2.getLiteralValue());
-    }).when(Node.isUndefinedKeyword, () => {
-      result.push(void 0);
-    }).when(Node.isNullLiteral, () => {
-      result.push(null);
-    }).when(Node.isObjectLiteralExpression, (child2) => {
-      result.push(extractObjectLiteral(child2));
-    }).when(Node.isArrayLiteralExpression, (child2) => {
-      result.push(extractArrayLiteral(child2));
-    }).otherwise(() => {
-    });
-  });
-  return result;
-}
-
-// src/call-expression.ts
-function visitCallExpressions(file, options) {
-  const { match: match4, fn } = options;
-  const callExpressions = file.getDescendantsOfKind(ts.SyntaxKind.CallExpression);
-  for (const node of callExpressions) {
-    const expr = node.getExpression();
-    const name = expr.getText();
-    if (!match4(name)) {
-      continue;
-    }
-    const args = node.getArguments();
-    if (args.length === 0) {
-      fn({ name, data: {} });
-      continue;
-    }
-    args.forEach((arg) => {
-      if (Node2.isObjectLiteralExpression(arg)) {
-        fn({ name, data: extractObjectLiteral(arg) });
-      }
-    });
-  }
-}
-
 // src/import.ts
 import { memo } from "@pandacss/shared";
 function getImportDeclarations(file, options) {
-  const { match: match4 } = options;
+  const { match: match2 } = options;
   const result = [];
   file.getImportDeclarations().forEach((node) => {
     const source = node.getModuleSpecifierValue();
@@ -129,7 +22,7 @@ function getImportDeclarations(file, options) {
     specifiers.forEach((specifier) => {
       const name = specifier.getNameNode().getText();
       const alias = specifier.getAliasNode()?.getText() || name;
-      if (!match4({ id: name, mod: source }))
+      if (!match2({ id: name, mod: source }))
         return;
       result.push({ name, alias, mod: source });
     });
@@ -158,49 +51,6 @@ function getImportDeclarations(file, options) {
   };
 }
 
-// src/jsx-element.ts
-import { Node as Node3, ts as ts2 } from "ts-morph";
-import { match as match2 } from "ts-pattern";
-function visitJsxElement(file, options) {
-  const { match: matchProp, fn } = options;
-  const elements = [
-    ...file.getDescendantsOfKind(ts2.SyntaxKind.JsxOpeningElement),
-    ...file.getDescendantsOfKind(ts2.SyntaxKind.JsxSelfClosingElement)
-  ];
-  for (const node of elements) {
-    const tag = node.getTagNameNode().getText();
-    if (!tag || !matchProp.tag(tag)) {
-      continue;
-    }
-    const props = node.getAttributes();
-    const data = {};
-    for (const prop of props) {
-      if (!Node3.isJsxAttribute(prop)) {
-        continue;
-      }
-      const name = prop.getName();
-      const value = prop.getInitializer();
-      if (!tag || !matchProp.prop({ tag, name })) {
-        continue;
-      }
-      match2(value).when(Node3.isStringLiteral, (value2) => {
-        data[name] = value2.getLiteralValue().replaceAll(/[\n\s]+/g, " ");
-      }).when(Node3.isJsxExpression, (value2) => {
-        const expr = value2.getExpression();
-        const returnValue = extractValue(expr);
-        if (returnValue !== void 0) {
-          data[name] = returnValue;
-        }
-      }).otherwise(() => {
-        if (!value) {
-          data[name] = true;
-        }
-      });
-    }
-    fn({ name: tag, data });
-  }
-}
-
 // src/parser-result.ts
 var createParserResult = () => ({
   jsx: /* @__PURE__ */ new Set(),
@@ -228,6 +78,7 @@ var createParserResult = () => ({
 });
 
 // src/parser.ts
+var isNodeRecipe = (node) => node.type === "recipe";
 function createImportMatcher(mod, values) {
   const regex = values ? new RegExp(`^(${values.join("|")})$`) : /.*/;
   return {
@@ -242,11 +93,11 @@ var combineResult = (unboxed) => {
   return [...unboxed.conditions, unboxed.raw, ...unboxed.spreadConditions];
 };
 function createParser(options) {
-  return function parse(sourceFile, confProperties, mode = "internal") {
+  return function parse(sourceFile, confProperties) {
     if (!sourceFile)
       return;
     const filePath = sourceFile.getFilePath();
-    const { jsx, importMap } = options;
+    const { jsx, importMap, getRecipeByName } = options;
     const importRegex = [
       createImportMatcher(importMap.css, ["css", "cva"]),
       createImportMatcher(importMap.recipe),
@@ -272,188 +123,156 @@ function createParser(options) {
     const isValidStyleFn = (name) => name === jsx?.factory;
     const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "panda";
     const jsxPatternNodes = new RegExp(`(${jsx?.nodes.map((node) => node.type === "pattern" && node.name).join("|")})$`);
-    const jsxRecipeNodes = new RegExp(`(${jsx?.nodes.map((node) => node.type === "recipe" && node.name).join("|")})$`);
-    if (mode === "box-extractor") {
-      const recipes = /* @__PURE__ */ new Map();
-      imports.value.forEach((importDeclaration) => {
-        const { name, alias } = importDeclaration;
-        const isRecipe = isValidRecipe(name);
-        if (isRecipe) {
-          recipes.set(alias, true);
-        }
-      });
-      const functions = /* @__PURE__ */ new Map();
-      const components = /* @__PURE__ */ new Map();
-      const propertiesMap = new Map(confProperties.map((prop) => [prop, true]));
-      const cvaAlias = imports.getAlias("cva");
-      const cssAlias = imports.getAlias("css");
-      if (options.jsx) {
-        options.jsx.nodes.forEach((node) => {
-          const properties = node.props ? new Map(propertiesMap) : propertiesMap;
-          const alias = imports.getAlias(node.name);
-          node.props?.forEach((prop) => properties.set(prop, true));
-          functions.set(node.baseName, properties);
-          functions.set(alias, properties);
-          components.set(alias, properties);
-        });
+    const recipes = /* @__PURE__ */ new Map();
+    imports.value.forEach((importDeclaration) => {
+      const { name, alias } = importDeclaration;
+      const isRecipe = isValidRecipe(name);
+      if (isRecipe) {
+        recipes.set(alias, true);
       }
-      const matchTag = memo2((tagName) => {
-        return components.has(tagName) || isUpperCase(tagName) || tagName.startsWith(jsxFactoryAlias);
-      });
-      const matchTagProp = memo2((tagName, propName) => {
-        if (propertiesMap.size === 0)
-          return true;
-        return Boolean(components.get(tagName)?.get(propName)) || propertiesMap.has(propName);
-      });
-      const matchFn = memo2((fnName) => {
-        if (recipes.has(fnName))
-          return true;
-        if (fnName === cvaAlias || fnName === cssAlias || fnName.startsWith(jsxFactoryAlias))
-          return true;
-        return Boolean(functions.get(fnName));
-      });
-      const matchFnProp = memo2((fnName, propName) => {
-        if (propertiesMap.size === 0)
-          return true;
-        if (recipes.has(fnName))
-          return true;
-        if (fnName === cvaAlias)
-          return true;
-        if (fnName.startsWith(jsxFactoryAlias))
-          return true;
-        if (fnName === cssAlias)
-          return Boolean(propertiesMap.get(propName) || propName === "selectors");
-        return Boolean(functions.get(fnName)?.get(propName));
-      });
-      const measure2 = logger.time.debug(`Tokens extracted from ${filePath}`);
-      const extractResultByName = extract({
-        ast: sourceFile,
-        components: {
-          matchTag: (prop) => matchTag(prop.tagName),
-          matchProp: (prop) => matchTagProp(prop.tagName, prop.propName)
-        },
-        functions: {
-          matchFn: (prop) => matchFn(prop.fnName),
-          matchProp: (prop) => matchFnProp(prop.fnName, prop.propName),
-          matchArg: (prop) => {
-            if (prop.fnName === jsxFactoryAlias && prop.index === 1 && Node4.isIdentifier(prop.argNode))
-              return false;
-            return true;
+    });
+    const functions = /* @__PURE__ */ new Map();
+    const components = /* @__PURE__ */ new Map();
+    const propertiesMap = new Map(confProperties.map((prop) => [prop, true]));
+    const recipePropertiesByName = /* @__PURE__ */ new Map();
+    const recipeJsxLists = (jsx?.nodes ?? []).filter(isNodeRecipe).reduce(
+      (acc, recipe) => {
+        recipePropertiesByName.set(recipe.baseName, new Set(recipe.props ?? []));
+        recipe.jsx?.forEach((jsx2) => {
+          if (typeof jsx2 === "string") {
+            acc.string.add(jsx2);
+          } else {
+            acc.regex.push(jsx2);
           }
-        },
-        flags: { skipTraverseFiles: true }
+        });
+        return acc;
+      },
+      { string: /* @__PURE__ */ new Set(), regex: [] }
+    );
+    const cvaAlias = imports.getAlias("cva");
+    const cssAlias = imports.getAlias("css");
+    if (options.jsx) {
+      options.jsx.nodes.forEach((node) => {
+        const properties = node.props ? new Map(propertiesMap) : propertiesMap;
+        const alias = imports.getAlias(node.name);
+        node.props?.forEach((prop) => properties.set(prop, true));
+        functions.set(alias, properties);
+        components.set(alias, properties);
       });
-      measure2();
-      extractResultByName.forEach((result, alias) => {
-        const name = imports.getName(alias);
-        logger.debug(`ast:${name}`, { filePath, result, alias });
-        if (result.kind === "function") {
-          match3(name).when(css.match, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.set(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult(unbox(query.box.value[0]))
-              });
-            });
-          }).when(isValidPattern, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.setPattern(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult(unbox(query.box.value[0]))
-              });
+    }
+    const getRecipeName = memo2(options.getRecipeName);
+    const isJsxTagRecipe = memo2(
+      (tagName) => recipeJsxLists.string.has(tagName) || recipeJsxLists.regex.some((regex) => regex.test(tagName))
+    );
+    const matchTag = memo2((tagName) => {
+      return components.has(tagName) || isUpperCase(tagName) || tagName.startsWith(jsxFactoryAlias) || isJsxTagRecipe(tagName);
+    });
+    const matchTagProp = memo2((tagName, propName) => {
+      if (propertiesMap.size === 0)
+        return true;
+      if (Boolean(components.get(tagName)?.get(propName)) || propertiesMap.has(propName))
+        return true;
+      if (isJsxTagRecipe(tagName)) {
+        const recipe = getRecipeByName(getRecipeName(tagName));
+        if (recipe) {
+          return recipePropertiesByName.get(recipe.name)?.has(propName) ?? false;
+        }
+      }
+      return false;
+    });
+    const matchFn = memo2((fnName) => {
+      if (recipes.has(fnName))
+        return true;
+      if (fnName === cvaAlias || fnName === cssAlias || fnName.startsWith(jsxFactoryAlias))
+        return true;
+      return Boolean(functions.get(fnName));
+    });
+    const matchFnProp = memo2((fnName, propName) => {
+      if (propertiesMap.size === 0)
+        return true;
+      if (recipes.has(fnName))
+        return true;
+      if (fnName === cvaAlias)
+        return true;
+      if (fnName.startsWith(jsxFactoryAlias))
+        return true;
+      if (fnName === cssAlias)
+        return Boolean(propertiesMap.get(propName) || propName === "selectors");
+      return Boolean(functions.get(fnName)?.get(propName));
+    });
+    const measure = logger.time.debug(`Tokens extracted from ${filePath}`);
+    const extractResultByName = extract({
+      ast: sourceFile,
+      components: {
+        matchTag: (prop) => matchTag(prop.tagName),
+        matchProp: (prop) => matchTagProp(prop.tagName, prop.propName)
+      },
+      functions: {
+        matchFn: (prop) => matchFn(prop.fnName),
+        matchProp: (prop) => matchFnProp(prop.fnName, prop.propName),
+        matchArg: (prop) => {
+          if (prop.fnName === jsxFactoryAlias && prop.index === 1 && Node.isIdentifier(prop.argNode))
+            return false;
+          return true;
+        }
+      },
+      flags: { skipTraverseFiles: true }
+    });
+    measure();
+    extractResultByName.forEach((result, alias) => {
+      const name = imports.getName(alias);
+      logger.debug(`ast:${name}`, { filePath, result, alias });
+      if (result.kind === "function") {
+        match(name).when(css.match, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.set(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult(unbox(query.box.value[0]))
             });
-          }).when(isValidRecipe, (name2) => {
-            result.queryList.forEach((query) => {
-              collector.setRecipe(name2, {
-                name: name2,
-                box: query.box.value[0],
-                data: combineResult(unbox(query.box.value[0]))
-              });
+          });
+        }).when(isValidPattern, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.setPattern(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult(unbox(query.box.value[0]))
             });
-          }).when(isValidStyleFn, () => {
-            result.queryList.forEach((query) => {
-              collector.setCva({
-                name,
-                box: query.box,
-                data: combineResult(unbox(query.box))
-              });
+          });
+        }).when(isValidRecipe, (name2) => {
+          result.queryList.forEach((query) => {
+            collector.setRecipe(name2, {
+              name: name2,
+              box: query.box.value[0],
+              data: combineResult(unbox(query.box.value[0]))
             });
-          }).otherwise(() => {
           });
-        } else if (result.kind === "component") {
+        }).when(isValidStyleFn, () => {
           result.queryList.forEach((query) => {
-            let type;
-            const data = combineResult(unbox(query.box));
-            logger.debug(`ast:jsx:${name}`, { filePath, result: data });
-            if (jsx && name.startsWith(jsxFactoryAlias)) {
-              type = "jsx-factory";
-            } else if (jsxPatternNodes.test(name)) {
-              type = "pattern";
-            } else if (jsxRecipeNodes.test(name)) {
-              type = "recipe";
-            } else {
-              type = "jsx";
-            }
-            collector.jsx.add({
-              // from "panda.*" -> "panda.button"
+            collector.setCva({
               name,
-              box: query.box,
-              type,
-              data
+              box: query.box.value[1],
+              data: combineResult(unbox(query.box.value[1]))
             });
           });
-        }
-      });
-      return collector;
-    }
-    const measure = logger.time.debug(`Tokens extracted & collected from ${filePath}`);
-    visitCallExpressions(sourceFile, {
-      match: memo2((name) => imports.match(name)),
-      fn({ name: _name, data }) {
-        const name = imports.getName(_name);
-        const [css2] = importRegex;
-        const result = { name, data };
-        logger.debug(`ast:${name}`, { filePath, result });
-        match3(name).when(css2.match, (name2) => {
-          collector.set(name2, result);
-        }).when(isValidPattern, (name2) => {
-          collector.setPattern(name2, result);
-        }).when(isValidRecipe, (name2) => {
-          collector.setRecipe(name2, result);
-        }).when(isValidStyleFn, () => {
-          collector.setCva(result);
         }).otherwise(() => {
         });
+      } else if (result.kind === "component") {
+        result.queryList.forEach((query) => {
+          const data = combineResult(unbox(query.box));
+          logger.debug(`ast:jsx:${name}`, { filePath, result: data });
+          if (jsx && name.startsWith(jsxFactoryAlias)) {
+            collector.jsx.add({ name, box: query.box, type: "jsx-factory", data });
+          } else if (jsxPatternNodes.test(name)) {
+            collector.setPattern(name, { type: "jsx-pattern", name, box: query.box, data });
+          } else if (recipeJsxLists.string.has(name) || recipeJsxLists.regex.some((regex) => regex.test(name))) {
+            collector.setRecipe(getRecipeName(name), { type: "jsx-recipe", name, box: query.box, data });
+          } else {
+            collector.jsx.add({ name, box: query.box, type: "jsx", data });
+          }
+        });
       }
     });
-    visitJsxElement(sourceFile, {
-      match: {
-        tag: memo2((name) => {
-          return name.startsWith(jsxFactoryAlias) || isUpperCase(name);
-        }),
-        prop: ({ tag, name }) => {
-          const node = jsx?.nodes.find((n) => n.name === tag);
-          return !!jsx?.isStyleProp(name) || !!node?.props?.includes(name);
-        }
-      },
-      fn({ name, data }) {
-        let type;
-        logger.debug(`ast:jsx:${name}`, { filePath, result: data });
-        if (jsx && name.startsWith(jsxFactoryAlias)) {
-          type = "jsx-factory";
-        } else if (jsxPatternNodes.test(name)) {
-          type = "pattern";
-        } else if (jsxRecipeNodes.test(name)) {
-          type = "recipe";
-        } else {
-          type = "jsx";
-        }
-        collector.jsx.add({ type, name, data });
-      }
-    });
-    measure();
     return collector;
   };
 }
@@ -488,8 +307,8 @@ var createProject = ({ getFiles, readFile, parserOptions, ...projectOptions }) =
       overwrite: true,
       scriptKind: ScriptKind.TSX
     }),
-    parseSourceFile: (filePath, properties, mode = "box-extractor") => {
-      return parser(project.getSourceFile(filePath), properties, mode);
+    parseSourceFile: (filePath, properties) => {
+      return parser(project.getSourceFile(filePath), properties);
     }
   })),
   tap(({ createSourceFile }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/parser",
-  "version": "0.0.0-dev-20230413133612",
+  "version": "0.0.0-dev-20230413141731",
   "description": "The static parser for panda css",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -14,14 +14,15 @@
     "lil-fp": "1.4.5",
     "ts-morph": "18.0.0",
     "ts-pattern": "4.2.2",
-    "@pandacss/extractor": "0.0.0-dev-20230413133612",
-    "@pandacss/is-valid-prop": "0.0.0-dev-20230413133612",
-    "@pandacss/logger": "0.0.0-dev-20230413133612",
-    "@pandacss/shared": "0.0.0-dev-20230413133612",
-    "@pandacss/types": "0.0.0-dev-20230413133612"
+    "@pandacss/extractor": "0.0.0-dev-20230413141731",
+    "@pandacss/is-valid-prop": "0.0.0-dev-20230413141731",
+    "@pandacss/logger": "0.0.0-dev-20230413141731",
+    "@pandacss/shared": "0.0.0-dev-20230413141731",
+    "@pandacss/types": "0.0.0-dev-20230413141731"
   },
   "devDependencies": {
-    "@pandacss/fixture": "0.0.0-dev-20230413133612"
+    "@pandacss/fixture": "0.0.0-dev-20230413141731",
+    "@pandacss/generator": "0.0.0-dev-20230413141731"
   },
   "files": [
     "dist"