mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-23 01:19:27 -04:00
110 lines
4.4 KiB
Plaintext
110 lines
4.4 KiB
Plaintext
{% from "../error-message/macro.njk" import govukErrorMessage -%}
|
||
{% from "../fieldset/macro.njk" import govukFieldset %}
|
||
{% 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 %}
|
||
|
||
{#- 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 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 %}
|
||
{{ 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 %}
|
||
<div class="govuk-checkboxes {%- 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 %}
|
||
<div class="govuk-checkboxes__item">
|
||
<input class="govuk-checkboxes__input" id="{{ id }}" name="{{ name }}" type="checkbox" value="{{ item.value }}"
|
||
{{-" checked" if item.checked }}
|
||
{{-" disabled" if item.disabled }}
|
||
{%- if item.conditional %} data-aria-controls="{{ conditionalId }}"{% endif -%}
|
||
{%- if itemDescribedBy %} aria-describedby="{{ itemDescribedBy }}"{% endif -%}
|
||
{%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}>
|
||
{{ govukLabel({
|
||
html: item.html,
|
||
text: item.text,
|
||
classes: 'govuk-checkboxes__label' + (' ' + item.label.classes if item.label.classes),
|
||
attributes: item.label.attributes,
|
||
for: id
|
||
}) | indent(6) | trim }}
|
||
{%- if hasHint %}
|
||
{{ govukHint({
|
||
id: itemHintId,
|
||
classes: 'govuk-checkboxes__hint',
|
||
attributes: item.hint.attributes,
|
||
html: item.hint.html,
|
||
text: item.hint.text
|
||
}) | indent(6) | trim }}
|
||
{%- endif %}
|
||
</div>
|
||
{% if item.conditional %}
|
||
<div class="govuk-checkboxes__conditional{% if not item.checked %} govuk-checkboxes__conditional--hidden{% endif %}" id="{{ conditionalId }}">
|
||
{{ item.conditional.html | safe }}
|
||
</div>
|
||
{% endif %}
|
||
{% endfor %}
|
||
</div>
|
||
{% endset -%}
|
||
|
||
<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}">
|
||
{% 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 %}
|
||
</div>
|