prefixed tailwindcss

[rch77]

Hi there,
I think it misses support for the prefixed version of tailwindcss or I can't find it in the documentation. All examples place classes in common global namespace which obviously doesn't work if you have a project with some older existing css to merge.
I understand I can add tw- prefixes manually but it's too time consuming and error-prone as it is not obvious which complex classes/selectors should have the prefix where exactly.

[juujisai]

Hi, our components are made with use some of the newest features of tailwind. Some of the components won't work on the older versions.

[rch77]

I mean the prefix option.
https://tailwindcss.com/docs/configuration#prefix

[juujisai]

Oh I see. I'll add this idea to our list and we will keep that in mind

[thehands79]

Hi, was support ever added for prefixing?

[juujisai]

Hello. I am researching the possibilities for that at this very moment but the chances for us to do something about it are slim. Lots of our components are using tailwind classes inside the js files. Since tailwind doesn't support creating dynamic classes (for example if we were to add ${prefix}bg-red-600) there is not much we can do.

I'm still going to research what we can do about this but unfortunately at this moment the only thing I can see is to use our class customization and add prefixes manually.

[thehands79]

Hi, thanks for the info. Do you have a bit more detail on how "to use our class customization and add prefixes manually"? Is this less manual than writing some script to add the prefix into tw-elements.css which is one option I had considered. However it sounds like this won't work for components that use the js files you mentioned.

[juujisai]

The class customization can be achieved via data attributes or via JS. Example can be found in this issue:
#2033

Our component pages contain API tabs where we included Classes subsection. You can find there elements that we add inside our JS files and classes that are used for them:
https://tw-elements.com/docs/standard/forms/datepicker/#docsTabsAPI