@pandacss/generator 0.7.0 → 0.9.0

package/dist/index.mjs

@@ -388,7 +388,7 @@ var generateStaticCss = (ctx) => {
         return [];
       return Object.keys(values);
     },
-    getRecipeKeys: (recipe) => recipes.details.find((detail) => detail.config.name === recipe)?.variantKeyMap ?? {}
+    getRecipeKeys: (recipe) => recipes.details.find((detail) => detail.baseName === recipe)?.variantKeyMap ?? {}
   });
   results.css.forEach((css2) => {
     sheet.processAtomic(css2);
@@ -398,7 +398,7 @@ var generateStaticCss = (ctx) => {
       const recipeConfig = recipes.getConfig(name);
       if (!recipeConfig)
         return;
-      sheet.processRecipe(recipeConfig, value);
+      sheet.processRecipe(name, recipeConfig, value);
     });
   });
   const output = sheet.toCss({ optimize });
@@ -593,16 +593,22 @@ function generateCssFn(ctx) {
   return {
     dts: outdent4`
     import type { SystemStyleObject } from '../types'
-    export declare function css(styles: SystemStyleObject): string
+
+    interface CssFunction {
+      (styles: SystemStyleObject): string
+      raw: (styles: SystemStyleObject) => SystemStyleObject
+    }
+
+    export declare const css: CssFunction;
     `,
     js: outdent4`
     ${ctx.file.import("createCss, createMergeCss, hypenateProperty, withoutSpace", "../helpers")}
     ${ctx.file.import("sortConditions, finalizeConditions", "./conditions")}
 
     const classNameMap = ${stringify(utility.entries())}
-    
+
     const shorthands = ${stringify(utility.shorthands)}
-    
+
     const breakpointKeys = ${JSON.stringify(conditions.breakpoints.keys)}
 
     const hasShorthand = ${utility.hasShorthand ? "true" : "false"}
@@ -632,6 +638,7 @@ function generateCssFn(ctx) {
     }
 
     export const css = createCss(context)
+    css.raw = (styles) => styles
 
     export const { mergeCss, assignCss } = createMergeCss(context)
     `
@@ -855,7 +862,7 @@ function generatePattern(ctx) {
   if (ctx.patterns.isEmpty())
     return;
   return ctx.patterns.details.map((pattern) => {
-    const { name, config, dashName, upperName, styleFnName, blocklistType } = pattern;
+    const { baseName, config, dashName, upperName, styleFnName, blocklistType } = pattern;
     const { properties, transform, strict, description } = config;
     const transformFn = stringify2({ transform }) ?? "";
     const helperImports = ["mapObject"];
@@ -891,12 +898,17 @@ function generatePattern(ctx) {
       }).join("\n	")}
       }
 
-      ${strict ? outdent10`export declare function ${name}(options: ${upperName}Properties): string` : outdent10`
+      ${strict ? outdent10`export declare function ${baseName}(options: ${upperName}Properties): string` : outdent10`
 
           type ${upperName}Options = ${upperName}Properties & Omit<SystemStyleObject, keyof ${upperName}Properties ${blocklistType}>
 
+          interface ${upperName}PatternFn {
+            (options?: ${upperName}Options): string
+            raw: (options: ${upperName}Options) => ${upperName}Options
+          }
+
           ${description ? `/** ${description} */` : ""}
-          export declare function ${name}(options?: ${upperName}Options): string
+          export declare const ${baseName}: ${upperName}PatternFn;
           `}
 
      `,
@@ -904,12 +916,13 @@ function generatePattern(ctx) {
     ${ctx.file.import(helperImports.join(", "), "../helpers")}
     ${ctx.file.import("css", "../css/index")}
 
-    const ${name}Config = ${transformFn.replace(`{transform`, `{
+    const ${baseName}Config = ${transformFn.replace(`{transform`, `{
 transform`)}
 
-    export const ${styleFnName} = (styles = {}) => ${name}Config.transform(styles, { map: mapObject })
+    export const ${styleFnName} = (styles = {}) => ${baseName}Config.transform(styles, { map: mapObject })
 
-    export const ${name} = (styles) => css(${styleFnName}(styles))
+    export const ${baseName} = (styles) => css(${styleFnName}(styles))
+    ${baseName}.raw = (styles) => styles
     `
     };
   });
@@ -974,29 +987,26 @@ function generateRecipes(ctx) {
   return [
     createRecipeFn,
     ...ctx.recipes.details.map((recipe) => {
-      const { config, upperName, variantKeyMap, dashName } = recipe;
-      const { name, description, defaultVariants, compoundVariants } = config;
+      const { baseName, config, upperName, variantKeyMap, dashName } = recipe;
+      const { description, defaultVariants, compoundVariants } = config;
       return {
         name: dashName,
         js: outdent11`
         ${ctx.file.import("splitProps", "../helpers")}
         ${ctx.file.import("createRecipe", "./create-recipe")}
 
-        const ${name}Fn = createRecipe('${name}', ${stringify3(defaultVariants ?? {})}, ${stringify3(
+        const ${baseName}Fn = createRecipe('${baseName}', ${stringify3(defaultVariants ?? {})}, ${stringify3(
           compoundVariants ?? []
         )})
 
-        const variantKeys = ${stringify3(Object.keys(variantKeyMap))}
-
-        function splitVariantProps(props) {
-          return splitProps(props, variantKeys)
-        }
-        
-        export const ${name} = Object.assign(${name}Fn, {
+        export const ${baseName} = Object.assign(${baseName}Fn, {
           __recipe__: true,
-          variantKeys,
+          raw: (props) => props,
+          variantKeys: ${stringify3(Object.keys(variantKeyMap))},
           variantMap: ${stringify3(variantKeyMap)},
-          splitVariantProps,
+          splitVariantProps(props) {
+            return splitProps(props, ${stringify3(Object.keys(variantKeyMap))})
+          },
         })
         `,
         dts: outdent11`
@@ -1023,13 +1033,14 @@ function generateRecipes(ctx) {
         interface ${upperName}Recipe {
           __type: ${upperName}VariantProps
           (props?: ${upperName}VariantProps): string
+          raw: (props?: ${upperName}VariantProps) => ${upperName}VariantProps
           variantMap: ${upperName}VariantMap
           variantKeys: Array<keyof ${upperName}Variant>
           splitVariantProps<Props extends ${upperName}VariantProps>(props: Props): [${upperName}VariantProps, Pretty<Omit<Props, keyof ${upperName}VariantProps>>]
         }
 
         ${description ? `/** ${description} */` : ""}
-        export declare const ${name}: ${upperName}Recipe
+        export declare const ${baseName}: ${upperName}Recipe
         `
       };
     })
@@ -1710,12 +1721,16 @@ import { ${upperName} } from '../types/jsx'
 export declare const ${factoryName}: ${upperName}
     `,
     jsxType: outdent25`
-import type { ComponentProps, ElementType } from 'react'
+import type { ComponentPropsWithoutRef, ElementType, ElementRef, Ref } from 'react'
 import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
 import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
 
 type Dict = Record<string, unknown>
 
+type ComponentProps<T extends ElementType> = Omit<ComponentPropsWithoutRef<T>, 'ref'> & {
+  ref?: Ref<ElementRef<T>>
+}
+
 export type ${componentName}<T extends ElementType, P extends Dict = {}> = {
   (props: JsxHTMLProps<ComponentProps<T>, Assign<JsxStyleProps, P>>): JSX.Element
   displayName?: string
@@ -1801,10 +1816,14 @@ import { ${upperName} } from '../types/jsx'
 export declare const ${factoryName}: ${upperName}
     `,
     jsxType: outdent27`
-import type { ComponentProps, ElementType } from 'react'
+import type { ComponentPropsWithoutRef, ElementType, ElementRef, Ref } from 'react'
 
 type Dict = Record<string, unknown>
 
+type ComponentProps<T extends ElementType> = Omit<ComponentPropsWithoutRef<T>, 'ref'> & {
+  ref?: Ref<ElementRef<T>>
+}
+
 export type ${componentName}<T extends ElementType> = {
   (args: { raw: readonly string[] | ArrayLike<string> }): (props: ComponentProps<T>) => JSX.Element
   displayName?: string
@@ -2636,38 +2655,38 @@ function generateJsxPatterns(ctx) {
 // src/artifacts/pkg-json.ts
 function generatePackageJson(ctx) {
   const {
-    config: { outdir }
+    config: { outdir, outExtension: ext = "mjs" }
   } = ctx;
   const pkg = {
     name: outdir,
-    description: "This package is auto-generated by CSS Panda",
+    description: "This package is auto-generated by Panda CSS",
     version: `0.0.0-${performance.now()}`,
     type: "module",
     exports: {
       "./css": {
         types: "./css/index.d.ts",
-        require: "./css/index.mjs",
-        import: "./css/index.mjs"
+        require: `./css/index.${ext}`,
+        import: `./css/index.${ext}`
       },
       "./jsx": {
         types: "./jsx/index.d.ts",
-        require: "./jsx/index.mjs",
-        import: "./jsx/index.mjs"
+        require: `./jsx/index.${ext}`,
+        import: `./jsx/index.${ext}`
       },
       "./patterns": {
         types: "./patterns/index.d.ts",
-        require: "./patterns/index.mjs",
-        import: "./patterns/index.mjs"
+        require: `./patterns/index.${ext}`,
+        import: `./patterns/index.${ext}`
       },
       "./recipes": {
         types: "./recipes/index.d.ts",
-        require: "./recipes/index.mjs",
-        import: "./recipes/index.mjs"
+        require: `./recipes/index.${ext}`,
+        import: `./recipes/index.${ext}`
       },
       "./tokens": {
         types: "./tokens/index.d.ts",
-        require: "./tokens/index.mjs",
-        import: "./tokens/index.mjs"
+        require: `./tokens/index.${ext}`,
+        import: `./tokens/index.${ext}`
       },
       "./types": {
         types: "./types/index.d.ts"
@@ -2695,12 +2714,12 @@ var composition_d_ts_default = {
 
 // src/artifacts/generated/recipe.d.ts.json
 var recipe_d_ts_default = {
-  content: "import type { SystemStyleObject } from './system-types'\n\ntype Pretty<T> = T extends infer U ? { [K in keyof U]: U[K] } : never\n\ntype StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T\n\nexport type RecipeVariantRecord = Record<any, Record<any, SystemStyleObject>>\n\nexport type RecipeSelection<T extends RecipeVariantRecord> = keyof any extends keyof T\n  ? {}\n  : {\n      [K in keyof T]?: StringToBoolean<keyof T[K]>\n    }\n\nexport type RecipeVariantFn<T extends RecipeVariantRecord> = (props?: RecipeSelection<T>) => string\n\nexport type RecipeVariantProps<T extends RecipeVariantFn<RecipeVariantRecord>> = Pretty<Parameters<T>[0]>\n\ntype RecipeVariantMap<T extends RecipeVariantRecord> = {\n  [K in keyof T]: Array<keyof T[K]>\n}\n\nexport type RecipeRuntimeFn<T extends RecipeVariantRecord> = RecipeVariantFn<T> & {\n  __type: RecipeSelection<T>\n  variantKeys: (keyof T)[]\n  variantMap: RecipeVariantMap<T>\n  resolve: (props: RecipeSelection<T>) => SystemStyleObject\n  config: RecipeConfig<T>\n  splitVariantProps<Props extends RecipeSelection<T>>(props: Props): [RecipeSelection<T>, Pretty<Omit<Props, keyof T>>]\n}\n\nexport type RecipeCompoundSelection<T extends RecipeVariantRecord> = {\n  [K in keyof T]?: StringToBoolean<keyof T[K]> | Array<StringToBoolean<keyof T[K]>>\n}\n\nexport type RecipeCompoundVariant<T extends RecipeVariantRecord> = RecipeCompoundSelection<T> & {\n  css: SystemStyleObject\n}\n\nexport type RecipeDefinition<T extends RecipeVariantRecord> = {\n  /**\n   * The base styles of the recipe.\n   */\n  base?: SystemStyleObject\n  /**\n   * The multi-variant styles of the recipe.\n   */\n  variants?: T | RecipeVariantRecord\n  /**\n   * The default variants of the recipe.\n   */\n  defaultVariants?: RecipeSelection<T>\n  /**\n   * The styles to apply when a combination of variants is selected.\n   */\n  compoundVariants?: Array<RecipeCompoundVariant<T>>\n}\n\nexport type RecipeCreatorFn = <T extends RecipeVariantRecord>(config: RecipeDefinition<T>) => RecipeRuntimeFn<T>\n\nexport type RecipeConfig<T extends RecipeVariantRecord = RecipeVariantRecord> = RecipeDefinition<T> & {\n  /**\n   * The name of the recipe.\n   */\n  name: string\n  /**\n   * The description of the recipe. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The jsx elements to track for this recipe. Can be string or Regexp.\n   *\n   * @default capitalize(recipe.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n}\n"
+  content: "import type { SystemStyleObject } from './system-types'\n\ntype Pretty<T> = T extends infer U ? { [K in keyof U]: U[K] } : never\n\ntype StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T\n\nexport type RecipeVariantRecord = Record<any, Record<any, SystemStyleObject>>\n\nexport type RecipeSelection<T extends RecipeVariantRecord> = keyof any extends keyof T\n  ? {}\n  : {\n      [K in keyof T]?: StringToBoolean<keyof T[K]>\n    }\n\nexport type RecipeVariantFn<T extends RecipeVariantRecord> = (props?: RecipeSelection<T>) => string\n\nexport type RecipeVariantProps<T extends RecipeVariantFn<RecipeVariantRecord>> = Pretty<Parameters<T>[0]>\n\ntype RecipeVariantMap<T extends RecipeVariantRecord> = {\n  [K in keyof T]: Array<keyof T[K]>\n}\n\nexport type RecipeRuntimeFn<T extends RecipeVariantRecord> = RecipeVariantFn<T> & {\n  __type: RecipeSelection<T>\n  variantKeys: (keyof T)[]\n  variantMap: RecipeVariantMap<T>\n  resolve: (props: RecipeSelection<T>) => SystemStyleObject\n  config: RecipeConfig<T>\n  splitVariantProps<Props extends RecipeSelection<T>>(props: Props): [RecipeSelection<T>, Pretty<Omit<Props, keyof T>>]\n}\n\nexport type RecipeCompoundSelection<T extends RecipeVariantRecord> = {\n  [K in keyof T]?: StringToBoolean<keyof T[K]> | Array<StringToBoolean<keyof T[K]>>\n}\n\nexport type RecipeCompoundVariant<T extends RecipeVariantRecord> = RecipeCompoundSelection<T> & {\n  css: SystemStyleObject\n}\n\nexport type RecipeDefinition<T extends RecipeVariantRecord> = {\n  /**\n   * The base styles of the recipe.\n   */\n  base?: SystemStyleObject\n  /**\n   * The multi-variant styles of the recipe.\n   */\n  variants?: T | RecipeVariantRecord\n  /**\n   * The default variants of the recipe.\n   */\n  defaultVariants?: RecipeSelection<T>\n  /**\n   * The styles to apply when a combination of variants is selected.\n   */\n  compoundVariants?: Array<RecipeCompoundVariant<T>>\n}\n\nexport type RecipeCreatorFn = <T extends RecipeVariantRecord>(config: RecipeDefinition<T>) => RecipeRuntimeFn<T>\n\nexport type RecipeConfig<T extends RecipeVariantRecord = RecipeVariantRecord> = RecipeDefinition<T> & {\n  /**\n   * The name of the recipe.\n   */\n  className: string\n  /**\n   * The description of the recipe. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The jsx elements to track for this recipe. Can be string or Regexp.\n   *\n   * @default capitalize(recipe.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n}\n"
 };
 
 // src/artifacts/generated/pattern.d.ts.json
 var pattern_d_ts_default = {
-  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport type PatternHelpers = {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\nexport type PatternProperties = Record<string, PatternProperty>\n\ntype Props<T> = Record<LiteralUnion<keyof T>, any>\n\nexport type PatternConfig<T extends PatternProperties = PatternProperties> = {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsx?: string\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
+  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport type PatternHelpers = {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\nexport type PatternProperties = Record<string, PatternProperty>\n\ntype Props<T> = Record<LiteralUnion<keyof T>, any>\n\nexport type PatternConfig<T extends PatternProperties = PatternProperties> = {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsxName?: string\n  /**\n   * The jsx elements to track for this pattern. Can be string or Regexp.\n   *\n   * @default capitalize(pattern.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
 };
 
 // src/artifacts/generated/parts.d.ts.json
@@ -3154,21 +3173,21 @@ var generateParserCss = (ctx) => (result) => pipe(
         sheet.processStyleProps(data);
       });
     });
-    result2.recipe.forEach((recipeSet, name) => {
+    result2.recipe.forEach((recipeSet, recipeName) => {
       try {
         for (const recipe of recipeSet) {
-          const recipeConfig = recipes.getConfig(name);
+          const recipeConfig = recipes.getConfig(recipeName);
           if (!recipeConfig)
             continue;
-          match6(recipe).with({ type: "jsx-recipe", name: P.string }, ({ name: name2 }) => {
+          match6(recipe).with({ type: "jsx-recipe" }, () => {
             recipe.data.forEach((data) => {
-              const [recipeProps, styleProps] = recipes.splitProps(name2, data);
+              const [recipeProps, styleProps] = recipes.splitProps(recipeName, data);
               sheet.processStyleProps(styleProps);
-              sheet.processRecipe(recipeConfig, recipeProps);
+              sheet.processRecipe(recipeName, recipeConfig, recipeProps);
             });
           }).otherwise(() => {
             recipe.data.forEach((data) => {
-              sheet.processRecipe(recipeConfig, data);
+              sheet.processRecipe(recipeName, recipeConfig, data);
             });
           });
         }
@@ -3179,9 +3198,9 @@ var generateParserCss = (ctx) => (result) => pipe(
     result2.pattern.forEach((patternSet, name) => {
       try {
         for (const pattern of patternSet) {
-          match6(pattern).with({ type: "jsx-pattern", name: P.string }, ({ name: name2 }) => {
+          match6(pattern).with({ type: "jsx-pattern", name: P.string }, ({ name: jsxName }) => {
             pattern.data.forEach((data) => {
-              const fnName = patterns.getFnName(name2);
+              const fnName = patterns.getFnName(jsxName);
               const styleProps = patterns.transform(fnName, data);
               sheet.processStyleProps(styleProps);
             });
@@ -3336,53 +3355,52 @@ var getPathEngine = ({ cwd, emitPackage, outdir }) => {
 };
 
 // src/engines/pattern.ts
-import { capitalize as capitalize3, dashCase, mapObject as mapObject2, uncapitalize } from "@pandacss/shared";
-import { Obj, pipe as pipe2 } from "lil-fp";
+import { capitalize as capitalize3, dashCase, mapObject as mapObject2, memo as memo2, uncapitalize } from "@pandacss/shared";
 var helpers2 = { map: mapObject2 };
+var createRegex = (item) => {
+  const regex = item.map((item2) => typeof item2 === "string" ? item2 : item2.source).join("|");
+  return new RegExp(`^${regex}$`);
+};
 var getPatternEngine = (config) => {
-  return pipe2(
-    { patterns: config.patterns ?? {} },
-    Obj.bind("getConfig", ({ patterns }) => {
-      return (name) => patterns[name];
-    }),
-    Obj.bind("transform", ({ getConfig }) => {
-      return (name, data) => {
-        return getConfig(name)?.transform?.(data, helpers2) ?? {};
-      };
-    }),
-    Obj.bind("getNames", ({ getConfig }) => (name) => {
-      const upperName = capitalize3(name);
-      return {
-        name,
-        upperName,
-        dashName: dashCase(name),
-        styleFnName: `get${upperName}Style`,
-        jsxName: getConfig(name)?.jsx ?? upperName
-      };
-    }),
-    Obj.bind("details", ({ getNames, patterns }) => {
-      return Object.entries(patterns).map(([name, pattern]) => ({
-        ...getNames(name),
-        props: Object.keys(pattern?.properties ?? {}),
-        blocklistType: pattern?.blocklist ? `| '${pattern.blocklist.join("' | '")}'` : "",
-        config: pattern
-      }));
-    }),
-    Obj.bind("nodes", ({ patterns }) => {
-      return Object.entries(patterns).map(([name, pattern]) => ({
-        type: "pattern",
-        name: pattern.jsx ?? capitalize3(name),
-        props: Object.keys(pattern?.properties ?? {}),
-        baseName: name
-      }));
+  const patterns = config.patterns ?? {};
+  const getNames = (name) => {
+    const upperName = capitalize3(name);
+    return {
+      upperName,
+      baseName: name,
+      dashName: dashCase(name),
+      styleFnName: `get${upperName}Style`,
+      jsxName: patterns[name]?.jsxName ?? upperName
+    };
+  };
+  const details = Object.entries(patterns).map(([name, pattern]) => {
+    const names = getNames(name);
+    const jsx = (pattern.jsx ?? []).concat([names.jsxName]);
+    return {
+      ...names,
+      props: Object.keys(pattern?.properties ?? {}),
+      blocklistType: pattern?.blocklist ? `| '${pattern.blocklist.join("' | '")}'` : "",
+      config: pattern,
+      type: "pattern",
+      match: createRegex(jsx),
+      jsx
+    };
+  });
+  return {
+    getConfig: (name) => patterns[name],
+    transform: (name, data) => {
+      return patterns[name]?.transform?.(data, helpers2) ?? {};
+    },
+    getNames,
+    details,
+    getFnName: memo2((jsxName) => {
+      return details.find((node) => node.jsxName === jsxName)?.baseName ?? uncapitalize(jsxName);
     }),
-    Obj.bind("getFnName", ({ nodes }) => (jsx) => {
-      return nodes.find((node) => node.name === jsx)?.baseName ?? uncapitalize(jsx);
+    filter: memo2((jsxName) => {
+      return details.filter((node) => node.match.test(jsxName));
     }),
-    Obj.bind("isEmpty", ({ patterns }) => {
-      return () => Object.keys(patterns).length === 0;
-    })
-  );
+    isEmpty: () => Object.keys(patterns).length === 0
+  };
 };
 
 // src/engines/index.ts
@@ -3417,10 +3435,10 @@ var defaults = (conf) => ({
   }
 });
 var getImportMap = (outdir) => ({
-  css: `${outdir}/css`,
-  recipe: `${outdir}/recipes`,
-  pattern: `${outdir}/patterns`,
-  jsx: `${outdir}/jsx`
+  css: [outdir, "css"],
+  recipe: [outdir, "recipes"],
+  pattern: [outdir, "patterns"],
+  jsx: [outdir, "jsx"]
 });
 var createGenerator = (conf) => {
   const ctx = getEngine(defaults(conf));
@@ -3428,7 +3446,7 @@ var createGenerator = (conf) => {
   const compilerOptions = conf.tsconfig?.compilerOptions ?? {};
   const baseUrl = compilerOptions.baseUrl ?? "";
   const cwd = conf.config.cwd;
-  const relativeBaseUrl = baseUrl ? baseUrl.replace(cwd, "").slice(1) + "/" : cwd;
+  const relativeBaseUrl = baseUrl !== cwd ? baseUrl.replace(cwd, "").slice(1) : cwd;
   return {
     ...ctx,
     getArtifacts: generateArtifacts(ctx),
@@ -3440,9 +3458,12 @@ var createGenerator = (conf) => {
       jsx: {
         factory: jsx.factoryName,
         isStyleProp: isValidProperty,
-        nodes: [...patterns.nodes, ...recipes.nodes]
+        nodes: [...patterns.details, ...recipes.details]
       },
-      getRecipesByJsxName: recipes.filter
+      getRecipesByJsxName: recipes.filter,
+      getPatternsByJsxName: patterns.filter,
+      compilerOptions,
+      tsOptions: conf.tsOptions
     }
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/generator",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "The css generator for css panda",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -19,18 +19,18 @@
     "outdent": " ^0.8.0",
     "pluralize": "8.0.0",
     "postcss": "8.4.25",
-    "ts-pattern": "5.0.1",
-    "@pandacss/core": "0.7.0",
-    "@pandacss/is-valid-prop": "0.7.0",
-    "@pandacss/logger": "0.7.0",
-    "@pandacss/shared": "0.7.0",
-    "@pandacss/token-dictionary": "0.7.0",
-    "@pandacss/types": "0.7.0"
+    "ts-pattern": "5.0.4",
+    "@pandacss/core": "0.9.0",
+    "@pandacss/is-valid-prop": "0.9.0",
+    "@pandacss/logger": "0.9.0",
+    "@pandacss/shared": "0.9.0",
+    "@pandacss/token-dictionary": "0.9.0",
+    "@pandacss/types": "0.9.0"
   },
   "devDependencies": {
     "@types/pluralize": "0.0.30",
     "hookable": "5.5.3",
-    "@pandacss/fixture": "0.7.0"
+    "@pandacss/fixture": "0.9.0"
   },
   "scripts": {
     "prebuild": "tsx scripts/prebuild.ts",