ColorPickerRoot

ColorPickerRoot est une primitive headless de sélecteur de couleur basé sur un popover.

Elle fournit :

• un slot déclencheur avec le style de fond de l'échantillon
• un déclencheur par défaut de secours
• un slot de contenu avec color et update()

Props

Prop	Default	Type
color* Valeur de couleur courante.	—	Color
contentClass Classe optionnelle pour le contenu du popover.	—	string | undefined
swatchClass Classe optionnelle pour le bouton déclencheur par défaut.	—	string | undefined

Événements

Event	Payload	Description
update	color: Color	Émis quand la couleur change.

Slots

Slot	Props	Description
trigger	{ style: Record<string, string> }	Déclencheur personnalisé avec le style de fond de l'échantillon.
default	{ color: Color, update: (color: Color) => void }	Contenu principal de l'éditeur de couleur.

Exemple

<ColorPickerRoot :color="color" @update="color = $event">
  <template #trigger="{ style }">
    <button class="size-6 rounded border" :style="style" />
  </template>

  <template #default="{ color, update }">
    <MyColorEditor :color="color" @change="update" />
  </template>
</ColorPickerRoot>

API associées

• ColorInputRoot