Correction describedby sur input (#115)

Signed-off-by: Alexis Boulerice <[email protected]>
VilledeMontreal · May 30, 2024 · 1b0269d · 1b0269d
1 parent 3b56841
commit 1b0269d
Show file tree

Hide file tree

Showing 9 changed files with 33 additions and 26 deletions.
diff --git a/source/_patterns/02-components/entree-de-donnees/01-inputs.json b/source/_patterns/02-components/entree-de-donnees/01-inputs.json
@@ -10,6 +10,7 @@
       "formGroupInputPlaceholder": {
         "text": "Placeholder"
       },
+      "formGroupInputDescribedBy": "input-text-help-text-id input-text-caracter-count",
       "formGroupInputHelpText": {
         "id": "input-text-help-text-id",
         "text": "Texte d'assistance"
@@ -31,12 +32,13 @@
       "formGroupInputPlaceholder": {
         "text": "Placeholder"
       },
+      "formGroupInputDescribedBy": "input-text-error-id",
       "formGroupInputHelpText": false,
       "formGroupInputError": {
         "id": "input-text-error-id",
-        "text": "Texte d'erreur",
-        "formAriaInputError": true
-      }
+        "text": "Texte d'erreur"
+      },
+      "formAriaInputError": true
     }
   ],
   "inputTextState": [
@@ -45,7 +47,8 @@
       "formGroupInputID": "form-control-input-text-disabled",
       "formGroupInputLabel": "Désactivé",
       "formGroupInputRequired": false,
-      "formGroupInputPlaceholder": "désactivé",
+      "formGroupInputPlaceholder": false,
+      "formGroupInputDescribedBy": false,
       "formGroupInputHelpText": false,
       "formGroupInputState": "disabled",
       "formGroupBtnClear": false
@@ -56,7 +59,8 @@
       "formGroupInputLabel": "Read-only",
       "formGroupInputClass": false,
       "formGroupInputRequired": false,
-      "formGroupInputPlaceholder": "read-only",
+      "formGroupInputPlaceholder": false,
+      "formGroupInputDescribedBy": false,
       "formGroupInputHelpText": false,
       "formGroupInputState": "readonly",
       "formGroupBtnClear": false

diff --git a/source/_patterns/02-components/entree-de-donnees/02-inputs-number.json b/source/_patterns/02-components/entree-de-donnees/02-inputs-number.json
@@ -9,11 +9,13 @@
       "formGroupInputPlaceholder": {
         "text": "XX"
       },
+      "formGroupInputDescribedBy": "input-number-help-text-id",
       "formGroupInputHelpText": {
         "id": "input-number-help-text-id",
         "text": "Texte d'assistance"
       },
       "formGroupInputCounter": false
+
     },
     {
       "formGroupClass": "required",
@@ -24,6 +26,7 @@
       "formGroupInputPlaceholder": {
         "text": "XX"
       },
+      "formGroupInputDescribedBy": "input-number-help-text-id input-number-caracter-count",
       "formGroupInputValue": "40",
       "formGroupInputHelpText": {
         "id": "input-number-help-text-id",
@@ -48,6 +51,7 @@
       "formGroupInputRequired": true,
       "formGroupInputLabel": "En erreur input vide",
       "formGroupInputPlaceholder": false,
+      "formGroupInputDescribedBy": "input-text-error-id",
       "formGroupInputHelpText": false,
       "formGroupInputError": {
         "id": "input-text-error-id",
@@ -76,7 +80,7 @@
       "formGroupInputLabel": "Read-only",
       "formGroupInputClass": false,
       "formGroupInputRequired": false,
-      "formGroupInputPlaceholder": "read-only",
+      "formGroupInputPlaceholder": false,
       "formGroupInputHelpText": false,
       "formGroupInputState": "readonly",
       "formGroupInputValue": "40"

diff --git a/source/_patterns/02-components/entree-de-donnees/03-textareas.json b/source/_patterns/02-components/entree-de-donnees/03-textareas.json
@@ -7,6 +7,7 @@
       "formGroupInputPlaceholder": {
         "text": "Placeholder"
       },
+      "formGroupInputDescribedBy": "form-group-textearea-help-text textarea-caracter-count",
       "formGroupInputHelpText": {
         "id": "form-group-textearea-help-text",
         "text": "Texte d'assistance."
@@ -29,16 +30,17 @@
       "formGroupInputPlaceholder": {
         "text": "Placeholder"
       },
+      "formGroupInputDescribedBy": "form-group-textearea-help-text form-group-textarea-error-text",
       "formGroupInputHelpText": {
-        "id": "form-group-textearea-error-help-text",
+        "id": "form-group-textearea-help-text",
         "text": "Texte d'assistance."
       },
       "formGroupTextareaRows": "5",
       "formGroupInputError": {
         "id": "form-group-textarea-error-text",
-        "text": "Texte d'erreur",
-        "formAriaInputError": true
-      }
+        "text": "Texte d'erreur"
+      },
+      "formAriaInputError": true
     }
   ],
   "textareaState": [
@@ -51,16 +53,13 @@
       "formGroupInputPlaceholder": {
         "text": "Placeholder"
       },
+      "formGroupInputDescribedBy": "form-group-textearea-disabled-help-text ",
       "formGroupInputHelpText": {
         "id": "form-group-textearea-disabled-help-text",
         "text": "Texte d'assistance"
       },
       "formGroupTextareaRows": "5",
-      "formGroupInputState": "disabled",
-      "formGroupInputError": {
-        "id": "form-group-textarea-disabled-error-text",
-        "text": "texte d'erreur"
-      }
+      "formGroupInputState": "disabled"
     }
   ]
 }
diff --git a/source/_patterns/02-components/entree-de-donnees/06-fichier~apercu-off.json b/source/_patterns/02-components/entree-de-donnees/06-fichier~apercu-off.json
@@ -1,9 +1,9 @@
 {
   "formGroupClass": false,
-  "formGroupInputID": "form-control-input-file-v2",
+  "formGroupInputID": "form-control-input-file-v2-2",
   "formGroupInputLabel": "Libellé",
-  "formGroupFileID": "file-droparea-v2",
-  "formGroupFileDropID": "form-group-file-upload",
+  "formGroupFileID": "file-droparea-v2-2",
+  "formGroupFileDropID": "form-group-file-upload-2",
   "formGroupFileDropLabel": "Parcourir",
   "formGroupFileDropHelpText": "ou déposer votre fichier ici",
   "dropdownMenu": {

diff --git a/source/_patterns/02-components/entree-de-donnees/06-fichier~apercu-on.json b/source/_patterns/02-components/entree-de-donnees/06-fichier~apercu-on.json
@@ -1,9 +1,9 @@
 {
   "formGroupClass": false,
-  "formGroupInputID": "form-control-input-file-v2",
+  "formGroupInputID": "form-control-input-file-v2-3",
   "formGroupInputLabel": "Libellé",
-  "formGroupFileID": "file-droparea-v2",
-  "formGroupFileDropID": "form-group-file-upload",
+  "formGroupFileID": "file-droparea-v2-3",
+  "formGroupFileDropID": "form-group-file-upload-3",
   "formGroupFileDropLabel": "Parcourir",
   "formGroupFileDropHelpText": "ou déposer votre fichier ici",
   "dropdownMenu": {

diff --git a/source/_patterns/02-components/entree-de-donnees/_input-file-item-v2.mustache b/source/_patterns/02-components/entree-de-donnees/_input-file-item-v2.mustache
@@ -1,13 +1,13 @@
 <div class="form-group {{ formGroupClass }}">
   {{^ formGroupNoLabel}}
-  <label for="{{formGroupInputID}}">{{ formGroupInputLabel}}</label>
+  <label for="{{formGroupFileDropID}}">{{ formGroupInputLabel}}</label>
   {{/ formGroupNoLabel}}
   {{# formGroupInputHelpText}}
   <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputHelpText}}
   <div class="file-drop-container-v2 {{formGroupFileClass}}" id="{{formGroupFileID}}">
     <div class="file-selector-button">
-      <input type="file" id="{{ formGroupFileDropID}}" class="sr-only {{formGroupFileClass}}"{{^formGroupInputError}}{{# formGroupInputHelpText}} aria-describedby="{{id}}"{{/ formGroupInputHelpText}}{{/formGroupInputError}}{{#formGroupInputError}} aria-describedby="{{id}}"{{/formGroupInputError}}{{# formGroupFileState}} {{formGroupFileState}}{{/ formGroupFileState}}>
+      <input type="file" id="{{formGroupFileDropID}}" class="sr-only {{formGroupFileClass}}"{{^formGroupInputError}}{{# formGroupInputHelpText}} aria-describedby="{{id}}"{{/ formGroupInputHelpText}}{{/ formGroupInputError}}{{#formGroupInputError}} aria-describedby="{{id}}"{{/ formGroupInputError}}{{# formGroupFileState}} {{formGroupFileState}}{{/ formGroupFileState}}>
       <label class="btn btn-secondary btn-squared" for="{{ formGroupFileDropID}}">{{ formGroupFileDropLabel }}</label>
     </div>
     <span class="help-text">{{ formGroupFileDropHelpText }}</span>

diff --git a/source/_patterns/02-components/entree-de-donnees/_input-number.mustache b/source/_patterns/02-components/entree-de-donnees/_input-number.mustache
@@ -6,7 +6,7 @@
   {{# formGroupInputHelpText}}
     <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputHelpText}}
-  <input type="number" class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputValue}}value="{{ formGroupInputValue}}"{{/ formGroupInputValue}}{{# formGroupInputPlaceholder}} placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupInputHelpText}} aria-describedby="{{id}}"{{/ formGroupInputHelpText}}{{#formGroupInputError}} aria-describedby="{{id}}" {{#formAriaInputError}} aria-invalid="true" {{/formAriaInputError}}{{/formGroupInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}{{# boundary}}{{#min}} min="{{min}}"{{/min}}{{#max}} max="{{max}}"{{/max}}{{#step}} step="{{step}}"{{/step}}{{/boundary}}>
+  <input type="number" class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputValue}}value="{{ formGroupInputValue}}"{{/ formGroupInputValue}}{{# formGroupInputPlaceholder}} placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupInputDescribedBy}} aria-describedby="{{formGroupInputDescribedBy}}"{{/ formGroupInputDescribedBy}}{{#formGroupInputError}} aria-describedby="{{id}}" {{#formAriaInputError}} aria-invalid="true" {{/formAriaInputError}}{{/formGroupInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}{{# boundary}}{{#min}} min="{{min}}"{{/min}}{{#max}} max="{{max}}"{{/max}}{{#step}} step="{{step}}"{{/step}}{{/boundary}}>
   {{# formGroupInputCounter}}
     <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputCounter}}

diff --git a/source/_patterns/02-components/entree-de-donnees/_input-text.mustache b/source/_patterns/02-components/entree-de-donnees/_input-text.mustache
@@ -10,7 +10,7 @@
     <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputHelpText}}
   {{# formGroupBtnClear}}<div class="input-group-icon">{{/ formGroupBtnClear}}
-    <input type="{{formGroupInputType}}" class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputPlaceholder}}placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupInputHelpText}} aria-describedby="{{id}}"{{/ formGroupInputHelpText}}{{#formGroupInputError}} aria-describedby="{{id}}" {{#formAriaInputError}} aria-invalid="true" {{/formAriaInputError}}{{/formGroupInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}>
+    <input type="{{formGroupInputType}}" class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputPlaceholder}}placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupInputDescribedBy}} aria-describedby="{{formGroupInputDescribedBy}}"{{/ formGroupInputDescribedBy}}{{#formAriaInputError}} aria-invalid="true" {{/ formAriaInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}>
     {{# formGroupBtnClear}}
       <button class="btn-clear">
         <span class="icon icon-x-circle icon-md" aria-hidden="true">

diff --git a/source/_patterns/02-components/entree-de-donnees/_textarea.mustache b/source/_patterns/02-components/entree-de-donnees/_textarea.mustache
@@ -7,7 +7,7 @@
   {{# formGroupInputHelpText}}
   <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputHelpText}}
-  <textarea class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputPlaceholder}}placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupTextareaRows}} rows="{{formGroupTextareaRows}}"{{/ formGroupTextareaRows}}{{^formGroupInputError}}{{# formGroupInputHelpText}} aria-describedby="{{id}}"{{/ formGroupInputHelpText}}{{/formGroupInputError}}{{#formGroupInputError}} aria-describedby="{{id}}" {{#formAriaInputError}} aria-invalid="true" {{/formAriaInputError}} {{/formGroupInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}></textarea>
+  <textarea class="form-control {{formGroupInputClass}}" id="{{ formGroupInputID }}" {{# formGroupInputPlaceholder}}placeholder="{{ formGroupInputPlaceholder.text}}"{{/ formGroupInputPlaceholder}}{{# formGroupTextareaRows}} rows="{{formGroupTextareaRows}}"{{/ formGroupTextareaRows}}{{# formGroupInputDescribedBy}} aria-describedby="{{formGroupInputDescribedBy}}"{{/ formGroupInputDescribedBy}}{{#formAriaInputError}} aria-invalid="true"{{/ formAriaInputError}}{{# formGroupInputState}} {{ formGroupInputState}}{{/ formGroupInputState}}{{# formGroupInputRequired}} required{{/ formGroupInputRequired}}></textarea>
   {{# formGroupInputCounter}}
   <span id="{{id}}" class="form-text">{{ text }}</span>
   {{/ formGroupInputCounter}}