Issue when using Config Recipe via alias when styled-system is not in root

[Hecatron]

Description

I think I've discovered a small bug when trying to use a config recipe via an alias.

• If the styled-system directory is placed within a sub dir such as assets/styled-system
• and a config recipe is used via an alias such as ~styled-system/recipes/recipe2

It's finding the class names but it's having trouble generating the css
If the styled-system directory is located in the root as it is by default then the alias works fine
also the css / cva functions seem to work fine with alias's regardless of the location of the styled-system directory

Link to Reproduction

https://github.com/Hecatron-Forks/panda/tree/alias-example/sandbox/nuxt

Steps to reproduce

I've placed an example above
It's a nuxt example although it's not nuxt specific this also happens under vite / vue project
For now it looks like I'll just need to keep the styled-system directory in the root of the project the same as the default

JS Framework

Vue / Vite / Nuxt

Panda CSS Version

Latest commit ef1dd67

Browser

Firefox

Operating System

• macOS
• Windows
• Linux

Additional Information

No response

[Hecatron]

I was noticing that outdir: "./styled-system" didn't work but the default outdir: "styled-system" was fine
I think it's the way the path is calculated from outdir

I tried using path.resolve for passing an absolute path to outdir but that seemed to just double up the path that it was using
My guess is it's resolving the path in different ways in the code, but without being able to pass in an absolute path I can't check

// Works fine
outdir: "styled-system",

// Breaks
outdir: "./styled-system",
outdir: "./assets/styled-system",
outdir: "assets/styled-system",

[Hecatron]

I'm supprised this was moved to a discussion
I'd figure there's currently a bug with the way outdir is evaulated.

[agenordebriat]

Can confirm, same thing's happening to me in a Nuxt project. Patterns also don't work.

[astahmer]

hey, I tried to reproduce your example but nuxt kept crashing, when using the panda CLI it seemed fine with this PR
#1039

if that PR doesn't solve your issue please ping me so I can try looking at it again

[trangcongthanh]

@astahmer Here the link to reproduce this issue with @pandacss/[email protected]: https://stackblitz.com/edit/vitejs-vite-7zeagt?file=src%2FApp.tsx. Change the config to outdir: 'styled-system', then the text recipe will render a text with bold style and color red.

It happened to me with both nextjs and vitejs playground.

[Pinpickle]

I just ran into this exact issue in @pandacss/[email protected] with Next.js. Changing outdir to anything other than styled-system breaks patterns for me.