diff --git a/src/components/DsfrCard/DsfrCard.md b/src/components/DsfrCard/DsfrCard.md index f0dd1901..f6b1f242 100644 --- a/src/components/DsfrCard/DsfrCard.md +++ b/src/components/DsfrCard/DsfrCard.md @@ -39,6 +39,7 @@ Autres props : | `description` | *`string`* | | ✅ | Description de la carte | | `altImg` | *`string`* | `''` | | Contenu de l’attribut `alt` de l’image de la carte | | `buttons` | [*`DsfrButtonProps[]`*](/types#dsfrbutton-et-dsfrbuttongroup) | `[]` | | Tableau de props à donner à DsfrButton | +| `badges` | [*`DsfrBadgeProps[]`*](/types#dsfrbadge) | `[]` | | Tableau de props à donner à DsfrBadge | | `detail` | *`string`* | `''` | | Texte à mettre dans la première zone de détail | | `detailIcon` | *`string`* | `''` | | Icône à mettre dans la première zone de détail ([nom d’une icône `oh-vue-icon` ou `DSFR`](/guide/icones)) | | `endDetail` | *`string`* | `''` | | Texte à mettre dans la deuxième zone de détail | diff --git a/src/components/DsfrRadioButton/DsfrRadioButton.types.ts b/src/components/DsfrRadioButton/DsfrRadioButton.types.ts index c63dd980..d292d541 100644 --- a/src/components/DsfrRadioButton/DsfrRadioButton.types.ts +++ b/src/components/DsfrRadioButton/DsfrRadioButton.types.ts @@ -25,6 +25,7 @@ export type DsfrRadioButtonSetProps = { errorMessage?: string validMessage?: string legend?: string + hint?: string modelValue?: string | number | boolean | undefined options?: Omit[] ariaInvalid?: boolean | 'grammar' | 'spelling' diff --git a/src/components/DsfrRadioButton/DsfrRadioButtonSet.md b/src/components/DsfrRadioButton/DsfrRadioButtonSet.md index ee8cc660..0dedb0bf 100644 --- a/src/components/DsfrRadioButton/DsfrRadioButtonSet.md +++ b/src/components/DsfrRadioButton/DsfrRadioButtonSet.md @@ -15,6 +15,7 @@ Le composant `DsfrRadioButtonSet` est composé des éléments suivants : - Un élément `
` englobant l'ensemble du groupe de radio. - Un élément `
` contenant les boutons radio et les messages associés. - Une légende (`legend`) définie par la prop `legend` et personnalisable avec le slot `legend`. +- Un hint (`hint`) définie par la prop `hint` et personnalisable avec le slot `hint`. - Un groupe de boutons radio individuels rendus par le composant `DsfrRadioButton`. - Un message d'information, d'erreur ou de validation, affiché en dessous du groupe de boutons radio (facultatif). @@ -31,6 +32,7 @@ Le composant `DsfrRadioButtonSet` est composé des éléments suivants : | `errorMessage` | *`string`* | Message d'erreur global à afficher | Non | | `validMessage` | *`string`* | Message de validation global à afficher | Non | | `legend` | *`string`* | Texte de la légende | Non | +| `hint` | *`string`* | Texte du hint | Non | | `modelValue` | *`string`* ou *`number`* ou *`boolean`* | Valeur courante du composant (sélection courante) | Non | | `options` | *`Omit[]`* | Tableau d'options définissant les boutons radio individuels | Oui | @@ -204,6 +206,7 @@ const options = [ `DsfrRadioButtonSet` fournit les slots suivants pour la personnalisation : - `legend` : Permet de personnaliser le contenu de la légende. +- `hint` : Permet de personnaliser le contenu d'un hint. - `required-tip` : Permet d'ajouter un astérisque indiquant que le champ est obligatoire (fonctionne uniquement si l'attribut `required` est défini sur le composant). ## 🪆 Relation avec `DsfrRadioButton` diff --git a/src/components/DsfrRadioButton/DsfrRadioButtonSet.vue b/src/components/DsfrRadioButton/DsfrRadioButtonSet.vue index 77c1cc3c..51f1715a 100644 --- a/src/components/DsfrRadioButton/DsfrRadioButtonSet.vue +++ b/src/components/DsfrRadioButton/DsfrRadioButtonSet.vue @@ -13,6 +13,7 @@ const props = withDefaults(defineProps(), { errorMessage: '', validMessage: '', legend: '', + hint: '', options: () => [], }) @@ -45,13 +46,21 @@ const ariaLabelledby = computed(() => message.value ? `${props.titleId} messages :role="(errorMessage || validMessage) ? 'group' : undefined" > {{ legend }} + + + {{ hint }} + + Object.fromEntries(