{% from "components/components/error-message/macro.njk" import usaErrorMessage -%} {% from "components/components/fieldset/macro.njk" import govukFieldset %} {% from "components/components/hint/macro.njk" import usaHint %} {% from "components/components/radio-label/macro.njk" import usaRadioLabel %} {#- Copied from https://github.com/alphagov/govuk-frontend/blob/v2.13.0/src/components/checkboxes/template.njk Changes: - `formGroup` option to control whether or not the checkboxes are wrapped with a `usa-form-group` class - `classes` option added to `item` allow custom classes on the `.govuk-checkboxes__item` element - `classes` option added to `item.hint` allow custom classes on the `.usa-hint` element (added to GOVUK Frontend in v3.5.0 - remove when we update) - `asList` option added the root `params` object to allow setting of the `.govuk-checkboxes` and `.govuk-checkboxes__item` element types - `children` option added to `item` allowing the sending in of prerendered child checkboxes (allowing the creation of tree structures through recursion) -#} {#- 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 %} {% if 'formGroup' not in params %} {% set formGroup = True %} {% else %} {% set formGroup = params.formGroup %} {% endif %} {#- a record of other elements that we need to associate with the input using aria-describedby – for example hints or error messages -#} {% set describedBy = params.describedBy if params.describedBy else "" %} {% if params.fieldset.describedBy %} {% set describedBy = params.fieldset.describedBy %} {% endif %} {#- set the types of element used for the checkboxes and their group based on whether asList is set -#} {% if params.asList %} {% set groupElement = 'ul' %} {% set groupItemElement = 'li' %} {% else %} {% set groupElement = 'div' %} {% set groupItemElement = 'div' %} {% endif %} {% set isConditional = false %} {% for item in params.items %} {% if item.conditional %} {% set isConditional = true %} {% endif %} {% endfor %} {#- fieldset is false by default -#} {% 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 %} {{ usaHint({ 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 %} {{ usaErrorMessage({ 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 %} <{{ groupElement }} class="{%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} {%- if isConditional %} data-module="checkboxes"{% endif -%}> {% for item in params.items %} {% set id = item.id if item.id else idPrefix + "-" + loop.index %} {% set name = item.name if item.name else params.name %} {% set conditionalId = "conditional-" + id %} {% set hasHint = true if item.hint.text or item.hint.html %} {% set itemHintId = id + "-item-hint" if hasHint else "" %} {% set itemDescribedBy = describedBy if not hasFieldset else "" %} {% set itemDescribedBy = (itemDescribedBy + " " + itemHintId) | trim %} <{{ groupItemElement }} class="usa-checkbox {%- if item.classes %} {{ item.classes }}{% endif %}"> {%- if item.before %}{{ item.before }}{% endif -%} {{ usaRadioLabel({ html: item.html, text: item.text, classes: (' ' + item.label.classes if item.label.classes), attributes: item.label.attributes, for: id }) | indent(6) | trim }} {%- if hasHint %} {{ usaHint({ id: itemHintId, classes: 'govuk-checkboxes__hint' + (' ' + item.hint.classes if item.hint.classes), attributes: item.hint.attributes, html: item.hint.html, text: item.hint.text }) | indent(6) | trim }} {%- endif %} {%- if item.children %} {{ item.children | safe }} {%- endif %} {% if params.asList and item.conditional %}
{{ item.conditional.html | safe }}
{% endif %} {%- if item.after %}{{ item.after }}{% endif -%} {% if not params.asList and item.conditional %}
{{ item.conditional.html | safe }}
{% 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 %}