PrimeVue Component (Button) CSS not injected when component is removed during initial render

[Petri-Oosthuizen]

Describe the bug

When a PrimeVue styled-mode component is rendered inside <RouterView> under a v-if, and a watcher temporarily unmounts it, the component's styles are permanently missing from the DOM.

With the v-if:

Without the v-if:

Possible cause: Theme.setLoadedStyleName() is called synchronously in beforeMount before styles reach the DOM — the actual injection is deferred to onMounted. If a pre-flush watcher unmounts the component in that window, onMounted never fires. On remount, Theme.isStyleNameLoaded() returns true and injection is skipped.

Pull Request Link

No response

Reason for not contributing a PR

• Lack of time
• Unsure how to implement the fix/feature
• Difficulty understanding the codebase
• Other

Other Reason

No response

Reproducer

https://stackblitz.com/edit/vitejs-vite-ktan6nnw

Environment

PrimeVue 4.5.4 styled mode (Aura)
Vue 3.5.28
Vue Router 5.0.2
Vite 7.3.1
Node 22.21.0

Vue version

3.5.28

PrimeVue version

4.5.4

Node version

22.21.0

Browser(s)

No response

Steps to reproduce the behavior

1. npm install && npm run dev, open /
2. Observe: button has no styling

3. Run in console:

   Array.from(document.querySelectorAll('style[data-primevue-style-id]')).map(s => s.dataset.primevueStyleId)

4. Observe: button-variables and button-style are absent
5. Remove if from button
6. Observe: button has styling

7. Run previous command and observe styles are present

The reproducer may look contrived, but the bug was first encountered in a real-world scenario using TanStack Query where a query was enabled by a reactive variable, and the query's isLoading state was used in a v-if. The minimal example replicates the same scheduler timing without the TanStack Query dependency.

Expected behavior

Component styles should be injected regardless of unmount/remount cycles.