Editor: toolbar buttons break when updating v-model value

[FeBe95]

Describe the bug

Now that the broken compatibility of PrimeVue 4.x and Quill 2.0 was resolved (see #5606), another issue is very prominent: When updating the v-model value, some of the toolbar buttons are displayed incorrectly and are left unusable:

• Before updating v-model:
  
  

• After updating v-model:
  
  

This is likely being caused by the changes that were made in commit af50c82, back in December 2022.
By looking at the code I suspect the following is happening:

• Vue is forced to re-render the buttons whenever v-model is updated (by incrementing reRenderColorKey).
• Quill is not re-initializing the buttons.

This results in the two select elements to be shown, instead of the actual Quill buttons.

Bisect

• Last working version: PrimeVue 3.21.0
  https://stackblitz.com/edit/primevue-3-vite-issue-template-l5tk8k9d?file=src%2FApp.vue
• First broken version: PrimeVue 3.22.0
  https://stackblitz.com/edit/primevue-3-vite-issue-template-qc2ce4wd?file=src%2FApp.vue

Reproducer

https://stackblitz.com/edit/primevue-4-vite-issue-template-zqth8o5q?file=src%2FApp.vue

PrimeVue version

4.2.5

Vue version

4.x

Language

ALL

Build / Runtime

Vite

Browser(s)

No response

Steps to reproduce the behavior

1. Update v-model of Editor
2. Try to use "text color" or "background color" buttons in Editor toolbar

Expected behavior

Buttons are rendered properly and are working as intended.

[github-actions]

Due to PrimeVue team's busy roadmap, this issue is available for anyone to work on. Make sure to reference this issue in your pull request. ✨ Thank you for your contribution! ✨