search

shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
https://ui.shadcn.com
MIT License
64.21k stars 3.64k forks source link

Can it be used with Astro? #155

Closed moisreis closed 2 days ago

moisreis commented 1 year ago

Can it be used with Astro and Tailwind?

shadcn commented 1 year ago

Yes. It works with Astro. I'll see if I can find an example for you.

Kaeson commented 1 year ago

+1

talves commented 1 year ago

I was playing with getting a very minimal example up just to get it to build. Hope this will get you started.

https://github.com/talves/astro-shadcn-ui-template/tree/main

Note: Understand that it has to be a static build using vite.ssr.noExternal for radix-ui. The astro.config.mjs config reflects this setup.

krankos commented 1 year ago

It works on astro through the react integration. So it actually works on react under astro but I don't think that it works on plain astro because the components require react. @shadcn what do you think? Do you plan on releasing a core version?

talves commented 1 year ago

This is a solution based on Radix UI which has a dependency on React. It's not meant to be used without React.

trevortylerlee commented 1 year ago

Let me know if this is the wrong place to ask this. I'm having trouble with the Tooltip component. It works fine in development, but when I deploy to Vercel, the build fails.

I'm using Astro 2.3.1 and I've had no issues with the Dropdown, Command Bar, and Dialog components so far. Does anyone know if the problem is on my end or if it's an issue with Astro or the Tooltip component? Any help would be much appreciated!

Code

Screenshot 2023-04-26 at 12 09 51 AM

ziin commented 1 year ago

Let me know if this is the wrong place to ask this. I'm having trouble with the Tooltip component. It works fine in development, but when I deploy to Vercel, the build fails.

I'm using Astro 2.3.1 and I've had no issues with the Dropdown, Command Bar, and Dialog components so far. Does anyone know if the problem is on my end or if it's an issue with Astro or the Tooltip component? Any help would be much appreciated!

Code

Screenshot 2023-04-26 at 12 09 51 AM

I am getting these same displayName undefined errors on build.

claughinghouse commented 1 year ago

@shadcn with the new CLI, do these steps still apply to Astro sites?

claughinghouse commented 1 year ago

I was playing with getting a very minimal example up just to get it to build. Hope this will get you started.

https://github.com/talves/astro-shadcn-ui-template/tree/main

Note: Understand that it has to be a static build using vite.ssr.noExternal for radix-ui. The astro.config.mjs config reflects this setup.

How do you use the buttonVariants?

shadcn commented 2 days ago

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.