windmill-react-ui
windmill-react-ui copied to clipboard
I want tailwind v3 compatibility for windmill react ui.
Is your feature request related to a problem? Please describe. I would like @windmill/react-ui package to be supported in applications that are using tailwindcss v3 or above.
Describe the solution you'd like With the current configuration, I see how windmill wrapper for config uses purge and not content. In order to use it with tailwindcss v3, I guess some changes will be required.
Describe alternatives you've considered Not really at the moment.
Additional context
can't wait to have this great UI kit upgraded with tailwind v3, I forked it here: https://github.com/ngduc/windmill-react-ui-kit upgraded and fixed a few things for storybook also.
I am using Next.js, Tailwind 3, Windmill, and Storybook. mine borked on what I assume are new color classes that came with Tailwind 3. Other Tailwind classes worked, so guessing it was the version mismatch. tried the fork, and it didn't break, but also didn't fix my issue.
this is what worked for me:
const windmill = require('@windmill/react-ui/config')
const config = {
content: ['./src/app/**/*.{js,ts,jsx,tsx}'],
theme: {
extend: {},
},
plugins: [],
}
module.exports = {
...windmill(config),
...config,
}
Basically, I let Windmill's Tailwind 2 config read my Tailwind 3 config without eating it, by using spread operators. I'm going to roll with it. Figure it's a decent workaround for now, In case it helps anyone 🤷
I tried the solution above, but some class names are not applied
https://stackblitz.com/edit/vitejs-vite-qtez3g
@jblossomweb I tried your solution and it worked, thank you.
Is your feature request related to a problem? Please describe. I would like @windmill/react-ui package to be supported in applications that are using tailwindcss v3 or above.
Describe the solution you'd like With the current configuration, I see how windmill wrapper for config uses purge and not content. In order to use it with tailwindcss v3, I guess some changes will be required.
Describe alternatives you've considered Not really at the moment.
Additional context
Tailwind V3 https://github.com/narimanb/wreactui
- renamed the 'purge' to 'content'
- removed 'variants' configuration
- updated new tailwind syntax for 'opacity'
- storybook v7, react testing library, tailwindcss V3, tailwindcss/forms 0.5.3 ...,