Implement unstyled mode from PrimeVue

[eboileau]

Aims/objectives.

Implement unstyled mode from PrimeVue. Currently, we use primevue@3.28.0, but regular updates are available.

npm update primevue
npm update --save primevue 

A clear and concise description of todo items.

I started to test the pass through option on selected components, but we need important: true in the tailwind.config.js file (or do not import theme?).

As soon as this feature is fully available/supported, revisit all UI components, and implement our own styling with Tailwind.

[eboileau]

Set-up unstyle mode

1. Tailwind CSS: @layer configuration, see https://primevue.org/tailwind/#csslayer
2. Setup see https://primevue.org/tailwind/#setup, in particular make tailwind.config.js aware of PrimeVue, set unstyle mode globally, but use Tailwind (and remove important: true):

   import Tailwind from 'primevue/passthrough/tailwind';
   app.use(PrimeVue, { unstyled: true, pt: Tailwind, ptOptions: { mergeProps: true } });

3. Component styles are provided via a pass through configuration that utilizes Tailwind CSS, check also https://primevue.org/unstyled/#theme for global pt configuration. Still a particular component can override a global configuration since the pt props of a component and the global setting is merged with component having higher precedence, we'll need to test that in styling individual components.

[eboileau]

Next step: shared pass through properties per component type (defined globally) or UsePassThrough.

[eboileau]

Theming didn't work exactly as I thought... with UsePassthrough, see also here, adding a component pt didn't always worked (Tailwind theme was completely overriden).

Adding ptOptions to app.use(PrimeVue, ...) seems to resolve the issue, although behavior of merging was already defined in 3rd option of usePassThrough. Maybe I didn't understand exactly how this works...

But things may change again, see e.g. https://github.com/primefaces/primevue/issues/4707, so we need to be careful when updating PrimeVue.

[eboileau]

WIP as new components are added. Closing this issue.