Use Character count formGroup as module wrapper

This removes the wrapping data-module `<div>` and puts all attributes on the Textarea `formGroup` instead
alphagov · Feb 16, 2024 · 3c0b968 · 3c0b968
1 parent cfc0a4a
commit 3c0b968
Showing 1 changed file with 28 additions and 30 deletions.
diff --git a/packages/govuk-frontend/src/govuk/components/character-count/template.njk b/packages/govuk-frontend/src/govuk/components/character-count/template.njk
@@ -90,33 +90,31 @@
   {% set attributesHtml = attributesHtml + " " + name | escape + '="' + value | escape + '"' %}
 {% endfor -%}
 
-<div class="govuk-character-count">
-  {{ govukTextarea({
-    id: params.id,
-    name: params.name,
-    describedBy: params.id + '-info',
-    rows: params.rows,
-    spellcheck: params.spellcheck,
-    value: params.value,
-    formGroup: {
-      classes: params.formGroup.classes,
-      attributes: attributesHtml,
-      beforeInput: params.formGroup.beforeInput,
-      afterInput: {
-        html: countMessageHtml
-      }
-    },
-    classes: 'govuk-js-character-count' + (' ' + params.classes if params.classes),
-    label: {
-      html: params.label.html,
-      text: params.label.text,
-      classes: params.label.classes,
-      isPageHeading: params.label.isPageHeading,
-      attributes: params.label.attributes,
-      for: params.id
-    },
-    hint: params.hint,
-    errorMessage: params.errorMessage,
-    attributes: params.attributes
-  }) | trim }}
-</div>
+{{ govukTextarea({
+  id: params.id,
+  name: params.name,
+  describedBy: params.id + '-info',
+  rows: params.rows,
+  spellcheck: params.spellcheck,
+  value: params.value,
+  formGroup: {
+    classes: 'govuk-character-count' + (' ' + params.formGroup.classes if params.formGroup.classes),
+    attributes: attributesHtml,
+    beforeInput: params.formGroup.beforeInput,
+    afterInput: {
+      html: countMessageHtml
+    }
+  },
+  classes: 'govuk-js-character-count' + (' ' + params.classes if params.classes),
+  label: {
+    html: params.label.html,
+    text: params.label.text,
+    classes: params.label.classes,
+    isPageHeading: params.label.isPageHeading,
+    attributes: params.label.attributes,
+    for: params.id
+  },
+  hint: params.hint,
+  errorMessage: params.errorMessage,
+  attributes: params.attributes
+}) | trim }}