diff --git a/CHANGELOG.md b/CHANGELOG.md index 9a115ce..a42eb8c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -57,6 +57,7 @@ Liste des évolutions de la librairie Malio layer UI * [#MUI-44] MalioDate / MalioDateTime : event `update:rawValue` (string) exposant la saisie brute sur un canal séparé pour la validation back-autoritative — saisie invalide (non parsable ou hors `min`/`max`) → texte trimmé tel que tapé, saisie valide/vide + clear + sélection au calendrier → `''`. `modelValue` reste `string` ISO `| null` (la saisie invalide n'y transite jamais) ; le parent construit son payload via `valid ? modelValue : rawValue`. * [#MUI-45] MalioDate : prop `markedDates` (`Record<"YYYY-MM-DD", 'success' | 'danger'>`) appliquant un fond tokenisé par jour dans la grille (générique, fourni par le consommateur ; précédence sélection/`today` > variante marquée > défaut) + event `month-change` (`{ month: 0-11, year }`) émis à l'ouverture du popover et à chaque navigation de mois. Sert l'écran *Heures* de SIRH (jours validés en vert, chargement du mois visible à la volée). * Calendrier (Date/DateRange/DateTime/DateWeek) : sélecteur d'année (3ᵉ niveau de navigation — jours → mois → années) et grisage des mois et années hors `min`/`max`. +* [#MUI-radio-group] Création d'un composant radio group (message unique, alignement select) ### Changed * Cohérence du mode **`disabled`** sur toute la famille formulaire (calqué sur InputText : texte + label grisés, `cursor-not-allowed`, aucune affordance interactive). Concrètement, quand `disabled` : le **bouton « + »** d'ajout disparaît (InputPhone, InputEmail), l'**œil** de révélation disparaît (InputPassword), le **chevron** disparaît (Select, SelectCheckbox, InputAutocomplete), la **croix d'effacement** reste masquée (date, upload, time), le **label** passe en `text-m-muted` (Select, SelectCheckbox, famille Date via CalendarField, TimePicker), et les **tags** du SelectCheckbox + la valeur du Select passent en gris. (InputText, InputAmount, InputNumber, InputTextArea, InputRichText, Checkbox, RadioButton, InputUpload étaient déjà conformes.) diff --git a/COMPONENTS.md b/COMPONENTS.md index 1dbe850..7efa427 100644 --- a/COMPONENTS.md +++ b/COMPONENTS.md @@ -499,6 +499,44 @@ Bouton radio (à utiliser en groupe avec le même `name`). --- +## MalioRadioGroup + +Groupe de boutons radio : possède la valeur, le `name` partagé et **un seul** message (erreur/succès/aide) avec espace réservé comme les autres champs — un groupe en ligne s'aligne donc avec un `MalioSelect` voisin. Les options sont déclarées via `:options` ou via le slot par défaut (``). + +| Prop | Type | Défaut | Description | +|------|------|--------|-------------| +| `modelValue` | `string \| number \| boolean \| null` | `undefined` | Valeur sélectionnée (v-model) | +| `options` | `{label, value, disabled?}[]` | `[]` | Options déclaratives | +| `label` | `string` | `''` | Label de groupe (legend, lié par `aria-labelledby`) | +| `name` | `string` | auto | Nom natif partagé des radios | +| `inline` | `boolean` | `false` | Disposition horizontale | +| `disabled` | `boolean` | `false` | Désactive tout le groupe | +| `readonly` | `boolean` | `false` | Lecture seule | +| `required` | `boolean` | `false` | Champ requis (astérisque dans la legend) | +| `hint` / `error` / `success` | `string` | `''` | Message unique du groupe | +| `reserveMessageSpace` | `boolean` | `true` | Réserve la ligne de message (alignement) | +| `groupClass` / `inputClass` / `labelClass` | `string` | `''` | Overrides `twMerge` | + +**Events :** `update:modelValue(value: string | number | boolean | null)` + +**Accessibilité :** conteneur `role="radiogroup"`, `aria-labelledby` (si `label`), `aria-invalid` et `aria-describedby` sur le message unique. Les radios enfants héritent de l'état d'erreur/désactivé du groupe. + +```vue + + + + + + +``` + +--- + ## MalioDate Sélecteur de date unique avec popover (grille de calendrier + vue mois/année).