feat(select) : tags SelectCheckbox restylés + props maxTags et color (MUI-49)
- Style des tags : fond m-bg, sans bordure, texte 18px/500 - Fix du rognage des jambages (g) sans agrandir le tag - Prop maxTags : limite le nombre de tags affichés + badge "+N" - Champ color par option : couleur de fond du tag (sinon m-bg) - Tests, COMPONENTS.md et CHANGELOG.md mis à jour Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
+4
-1
@@ -427,8 +427,9 @@ Liste déroulante multi-sélection avec checkboxes.
|
||||
| Prop | Type | Défaut | Description |
|
||||
|------|------|--------|-------------|
|
||||
| `modelValue` | `(string \| number)[]` | `[]` | Valeurs sélectionnées (v-model) |
|
||||
| `options` | `{ value: string \| number, text: string }[]` | `[]` | Options |
|
||||
| `options` | `{ value: string \| number, label: string, color?: string }[]` | `[]` | Options. `color` optionnel = couleur de fond du tag (sinon `m-bg`). |
|
||||
| `displayTag` | `boolean` | `false` | Afficher les tags sélectionnés |
|
||||
| `maxTags` | `number` | `0` | Nombre max de tags affichés ; au-delà un tag `+N` résume le surplus. `0` = tous les tags. |
|
||||
| `displaySelectAll` | `boolean` | `false` | Afficher "Tout sélectionner" |
|
||||
| `selectAllLabel` | `string` | `'Tout sélectionner'` | Texte du sélecteur global |
|
||||
| `label` | `string` | `''` | Label |
|
||||
@@ -445,6 +446,8 @@ Liste déroulante multi-sélection avec checkboxes.
|
||||
```vue
|
||||
<MalioSelectCheckbox v-model="competences" label="Compétences" :options="skills" :display-tag="true" />
|
||||
<MalioSelectCheckbox v-model="sites" label="Sites" :options="sitesList" :display-select-all="true" />
|
||||
<!-- maxTags : 3 tags max + badge "+N" ; color par option pour le fond du tag -->
|
||||
<MalioSelectCheckbox v-model="pays" label="Pays" :options="paysColorés" :display-tag="true" :max-tags="3" />
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
Reference in New Issue
Block a user