diff --git a/src/components/checkboxes/template.njk b/src/components/checkboxes/template.njk index 96e9d496e5..e61ffe3bc9 100644 --- a/src/components/checkboxes/template.njk +++ b/src/components/checkboxes/template.njk @@ -1,15 +1,21 @@ -{% from "../error-message/macro.njk" import govukErrorMessage -%} -{% from "../fieldset/macro.njk" import govukFieldset %} +{% from "../form-group/macro.njk" import govukFormGroup %} {% from "../hint/macro.njk" import govukHint %} {% from "../label/macro.njk" import govukLabel %} {#- If an id 'prefix' is not passed, fall back to using the name attribute instead. We need this for error messages and hints as well -#} -{% set idPrefix = params.idPrefix if params.idPrefix else params.name %} +{%- set idPrefix = params.idPrefix if params.idPrefix else params.name -%} {#- a record of other elements that we need to associate with the input using aria-describedby – for example hints or error messages -#} -{% set describedBy = "" %} +{%- set describedBy = params.fieldset.describedBy if params.fieldset.describedBy else "" -%} + +{%- if params.hint -%} + {%- set describedBy = (describedBy + ' ' + idPrefix + "-hint") | trim -%} +{%- endif -%} +{%- if params.errorMessage -%} + {%- set describedBy = (describedBy + ' ' + idPrefix + "-error") | trim -%} +{%- endif -%} {% set isConditional = false %} {% for item in params.items %} @@ -19,33 +25,16 @@ {% endfor %} {#- fieldset is false by default -#} -{% set hasFieldset = true if params.fieldset else false %} +{%- set hasFieldset = true if params.fieldset else false -%} -{#- Capture the HTML so we can optionally nest it in a fieldset -#} -{% set innerHtml %} -{% if params.hint %} - {% set hintId = idPrefix + '-hint' %} - {% set describedBy = describedBy + ' ' + hintId if describedBy else hintId %} - {{ govukHint({ - id: hintId, - classes: params.hint.classes, - attributes: params.hint.attributes, - html: params.hint.html, - text: params.hint.text - }) | indent(2) | trim }} -{% endif %} -{% if params.errorMessage %} - {% set errorId = idPrefix + '-error' %} - {% set describedBy = describedBy + ' ' + errorId if describedBy else errorId %} - {{ govukErrorMessage({ - id: errorId, - classes: params.errorMessage.classes, - attributes: params.errorMessage.attributes, - html: params.errorMessage.html, - text: params.errorMessage.text, - visuallyHiddenText: params.errorMessage.visuallyHiddenText - }) | indent(2) | trim }} -{% endif %} +{% call govukFormGroup({ + id: idPrefix, + fieldset: params.fieldset, + hint: params.hint, + label: params.label, + errorMessage: params.errorMessage, + formGroup: params.formGroup +}) %}
@@ -71,7 +60,7 @@ attributes: item.label.attributes, for: id }) | indent(6) | trim }} - {%- if hasHint %} + {% if hasHint %} {{ govukHint({ id: itemHintId, classes: 'govuk-checkboxes__hint', @@ -88,19 +77,4 @@ {% endif %} {% endfor %}
-{% endset -%} - -
-{% if params.fieldset %} - {% call govukFieldset({ - describedBy: describedBy, - classes: params.fieldset.classes, - attributes: params.fieldset.attributes, - legend: params.fieldset.legend - }) %} - {{ innerHtml | trim | safe }} - {% endcall %} -{% else %} - {{ innerHtml | trim | safe }} -{% endif %} -
+{% endcall %}