{% macro digitalmarketplaceListInput(params) %} {%- from "govuk_frontend_jinja/components/error-message/macro.html" import govukErrorMessage -%} {%- from "govuk_frontend_jinja/components/fieldset/macro.html" import govukFieldset -%} {%- from "govuk_frontend_jinja/components/button/macro.html" import govukButton -%} {%- from "govuk_frontend_jinja/components/hint/macro.html" import govukHint -%} {%- from "govuk_frontend_jinja/components/label/macro.html" import govukLabel -%} {%- from "govuk_frontend_jinja/components/input/macro.html" import govukInput -%} {#- We need this for error messages and hints as well -#} {%- set id = params.id -%} {%- if params.hint %} {%- set hintId = id + '-hint' -%} {% endif -%} {%- if params.errorMessage %} {%- set listErrorId = id + '-error' -%} {% endif -%}
{% call govukFieldset({ "describedBy": params.fieldset.describedBy if params.fieldset.describedBy else ((hintId if hintId else '') + ' ' + (listErrorId if listErrorId else '')), "classes": params.fieldset.classes, "legend": { "html": params.fieldset.legend.text + ' (Optional)' if params.optional else params.fieldset.legend.text, "classes": params.fieldset.legend.classes if params.fieldset.legend.classes else 'dm-list-input__legend', "isPageHeading": params.fieldset.legend.isPageHeading } if params.fieldset.legend, "attributes": { 'data-module': 'dm-list-input' } }) %} {%- if params.hint %} {{ govukHint({ "id": hintId, "classes": 'dm-list-input__hint ' + (params.hint.classes if params.hint.classes else ""), "attributes": params.hint.attributes, "html": params.hint.html, "text": params.hint.text }) | indent(2) | trim() }} {% endif -%} {% if params.errorMessage %} {{ govukErrorMessage({ "id": listErrorId, "classes": 'dm-list-input-error-message' + params.errorMessage.classes if params.errorMessage.classes else "", "attributes": params.errorMessage.attributes, "html": params.errorMessage.html, "text": params.errorMessage.text, "visuallyHiddenText": params.errorMessage.visuallyHiddenText }) | indent(2) | trim }} {% endif %} {% if params.question_advice %} {{ params.question_advice }} {% endif %}
{% for i in range(0, params.maxItems) -%} {%- set item = params['items'][i] if params['items'][i] else {} -%} {%- if loop.first -%} {%- set entryItemId = params.id -%} {% else %} {%- set entryItemId = params.id ~ '-' ~ loop.index -%} {%- endif -%} {# Classes #} {%- set itemClassesBase = 'govuk-input dm-list-input__item-input' -%} {%- set itemClassesLarge = ' dm-list-input__item-input--large' if i > 99 else '' -%} {%- set itemClassesExternal = (' ' + item.classes) if item.classes else '' -%} {%- if item.errorMessage %} {% set errorId = entryItemId + '-error' %} {% endif -%} {%- set itemLabelText = params.itemLabelPrefix if params.itemLabelPrefix else (params.fieldset.legend.text if params.fieldset.legend.text else params.name) -%}
{#- Add label and input field -#}
{{ govukInput ({ "attributes": item.attributes, "autocomplete": item.autocomplete, "classes": itemClassesBase + itemClassesLarge + itemClassesExternal, "describedBy": (item.describedBy if item.describedBy else describedBy), "errorMessage": { "id": errorId, "classes": 'dm-list-input-error-message ' + (item.errorMessage.classes if item.errorMessage.classes else ""), "attributes": item.errorMessage.attributes, "html": item.errorMessage.html, "text": item.errorMessage.text, "visuallyHiddenText": item.errorMessage.visuallyHiddenText } if item.errorMessage, "formGroup": { "classes": 'dm-list-input__form-group' }, "id": entryItemId, "inputmode": item.inputmode, "label": { "classes": 'dm-list-input__item-label ' + (item.label.classes if item.label and item.label.classes else ""), "html": '' + (itemLabelText if itemLabelText else params.name) + '. Number ' ~ loop.index + '.', "for": entryItemId }, "name": params.name, "pattern": item.pattern, "type": item.type | default('text'), "value": item.value }) | indent(2) | trim }} {{ govukButton({ "html": 'Remove entry number ' ~ loop.index + '', "classes": 'govuk-button--secondary dm-list-input__item-remove dm-list-input__item-remove--hidden', "type": 'button' })}}
{% endfor %}
{{ govukButton({ "html": 'Add another ' + params.addButtonName + ' (0 remaining)', "classes": 'govuk-button--secondary dm-list-input__item-add dm-list-input__item-add--hidden', "type": 'button' })}} {% endcall %}
{% endmacro %}