feat(site-selector) : [#MUI-27] Création du composant sélection de site

Composant MalioSiteSelector : bande horizontale pour choisir un site
(usine ou lieu) parmi une liste. Tuiles flex proportionnelles, couleur
du site sélectionné partagée par toutes les tuiles (opacité 1 / 0.4).
Expose update:modelValue (id) + change (objet site complet) pour
faciliter les appels API côté consommateur.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

COMPONENTS.md

@@ -450,3 +450,30 @@ Tableau de données presentational avec pagination, filtres par slots et lignes
   v-model:per-page="perPage"
 />
 ```
+
+---
+
+## MalioSiteSelector
+
+Sélecteur horizontal pour choisir un site (usine ou lieu) parmi une liste. Les tuiles occupent une largeur proportionnelle du conteneur. La couleur du site sélectionné est appliquée à toutes les tuiles ; la tuile active est opaque, les autres sont atténuées à 40 %.
+
+| Prop | Type | Défaut | Description |
+|------|------|--------|-------------|
+| `sites` | `{ id: string, name: string, color: string }[]` | **requis** | Liste des sites. `color` est un hex (ex : `'#0055ff'`) |
+| `modelValue` | `string` | `undefined` | `id` du site sélectionné (v-model). Sans v-model, le premier site est sélectionné |
+| `id` | `string` | auto | Identifiant HTML du conteneur |
+| `groupClass` | `string` | `''` | Classes CSS du conteneur (twMerge) |
+| `tileClass` | `string` | `''` | Classes CSS de chaque tuile (twMerge) |
+| `labelClass` | `string` | `''` | Classes CSS du libellé (twMerge) |
+
+**Events :**
+- `update:modelValue(value: string)` — id du site sélectionné (v-model)
+- `change(site: { id: string, name: string, color: string })` — objet site complet, émis au clic (pratique pour déclencher un appel API côté consommateur)
+
+```vue
+<MalioSiteSelector
+  v-model="siteActifId"
+  :sites="sites"
+  @change="(site) => refetch(site.id)"
+/>
+```