feat: uniqueId mixin

[i7slegend]

Half-duplicate of #5486

#5486 not SSR-friendly (hydration warnings), so i could not find best way for Nuxt. This MR implements uniqueId mixin (with UniqueComponentId under hood). This mixin uses mounted hook for SSR (like it was before my requests) but for not-SSR calculate unique id before mount that remove redudant re-render (bcz id changes after mount and this trigger re-render for component and his children in the dom tree).

New file: components/lib/utils/UniqueIdMixinFactory.js (placed in primevue/utils). Nuxt is detect by this condition: typeof window === 'undefined' || (typeof process !== 'undefined' && Boolean(process.client || process.server));

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

2 Ignored Deployments

Name	Status	Preview	Comments	Updated (UTC)
primevue	⬜️ Ignored (Inspect)	Visit Preview		Apr 11, 2024 0:27am
primevue-v4	⬜️ Ignored (Inspect)	Visit Preview		Apr 11, 2024 0:27am

[mertsincan]

Good job, @i7slegend! This is exactly what I wanted to do in v4. Currently, I'm working on v4.beta.2 release. I'll review this PR in more detail after beta.2.

[GhostvOne]

Many hydration issue in console. Thanks @i7slegend. Waiting for the merge :)

[i7slegend]

https://github.com/i7slegend/primevue/commit/2fc05735774f0ad1a08be791054dcd9cf1812af6

I rewrote from mixin to composable, i bet it's best way to line with vue3 recommendations. Under SSR i not found any hydration warnings. As Vue library (only client, without ssr) i will test soon time, i think no problems there.

Btw nuxt (since 3.10) have useId built-in composable (https://nuxt.com/docs/api/composables/use-id), maybe should to support it in the SSR environment? But one cons - useId seems doesn't support reactive-based property

[tugcekucukoglu]

Could you check the latest updates? If you think the problem still exists, please let us know. Closing due to conflicts.

Thanks for your contribution!