{
    "component": "question-list",
    "fixtures": [
        {
            "name": "default",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with hint",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "hint": "This is a hint for the question"
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"example-hint\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n      <div id=\"example-hint\" class=\"govuk-hint\">\n  This is a hint for the question\n</div>\n\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with question advice",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "question_advice": "Here is the question advice"
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"example-hint\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n      <div id=\"example-hint\" class=\"govuk-hint\">\n  <div class=\"govuk-body\">\n        Here is the question advice\n      </div>\n</div>\n\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with question advice and hint",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "question_advice": "<p class=\"govuk-body-l\">Here is the question advice</p>\n",
                    "hint": "<div class=\"hint-in-html\">This is a hint for the question</div>\n"
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"example-hint\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n      <div id=\"example-hint\" class=\"govuk-hint\">\n  <div class=\"govuk-body\">\n        <p class=\"govuk-body-l\">Here is the question advice</p>\n  \n      </div>\n      <div class=\"hint-in-html\">This is a hint for the question</div>\n</div>\n\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with optional",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "optional": true
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question (optional)\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with optional text",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "optional": true,
                    "optional_text": "if applicable"
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question (if applicable)\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with hidden",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "hidden": true
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with data",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "data": {
                    "example": [
                        "Here is the first list item",
                        "Here is the second list item",
                        "Here is the third list item"
                    ]
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\" value=\"Here is the first list item\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\" value=\"Here is the second list item\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\" value=\"Here is the third list item\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with data and one item",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "data": {
                    "example": [
                        "Here is the only list item"
                    ]
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\" value=\"Here is the only list item\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with data and ten items",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "data": {
                    "example": [
                        "Here is item 1",
                        "Here is item 2",
                        "Here is item 3",
                        "Here is item 4",
                        "Here is item 5",
                        "Here is item 6",
                        "Here is item 7",
                        "Here is item 8",
                        "Here is item 9",
                        "Here is item 10"
                    ]
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\" value=\"Here is item 1\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\" value=\"Here is item 2\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\" value=\"Here is item 3\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\" value=\"Here is item 4\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\" value=\"Here is item 5\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\" value=\"Here is item 6\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\" value=\"Here is item 7\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\" value=\"Here is item 8\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\" value=\"Here is item 9\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\" value=\"Here is item 10\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with data but items missing",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "data": {
                    "example": [
                        "",
                        "Here is item 2"
                    ]
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\" value=\"\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\" value=\"Here is item 2\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with data but multiple items missing",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "data": {
                    "example": [
                        "",
                        "",
                        "Here is item 3",
                        "",
                        "Here is item 5",
                        ""
                    ]
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\" value=\"\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\" value=\"\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\" value=\"Here is item 3\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\" value=\"\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\" value=\"Here is item 5\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\" value=\"\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with number of items",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "number_of_items": 5
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"5\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with number of items default shown",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "number_of_items_shown_as_default": 1
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"1\" aria-describedby=\"\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with error message",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question"
                },
                "errors": {
                    "example": {
                        "message": "You must select at least one option"
                    }
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"input-example\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n\n      <p id=\"input-example\" class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> You must select at least one option\n</p>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        },
        {
            "name": "with hint and error message",
            "options": {
                "question": {
                    "id": "example",
                    "question": "Here is the service question",
                    "hint": "This is a hint for the question"
                },
                "errors": {
                    "example": {
                        "message": "You must select at least one option"
                    }
                }
            },
            "hidden": false,
            "description": "",
            "previewLayoutModifiers": [],
            "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset dm-list\" data-module=\"dm-question-list\" data-max-number-of-items=\"10\" data-number-of-items-shown-as-default=\"2\" aria-describedby=\"example-hint input-example\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n    Here is the service question\n  </legend>\n      <div id=\"example-hint\" class=\"govuk-hint\">\n  This is a hint for the question\n</div>\n\n\n      <p id=\"input-example\" class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> You must select at least one option\n</p>\n\n\n    <div class=\"dm-list__items\">\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-0\">\n    Entry number <span class=\"dm-list__item-label-counter\">1</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">1.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-0\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">1</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-1\">\n    Entry number <span class=\"dm-list__item-label-counter\">2</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">2.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-1\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">2</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-2\">\n    Entry number <span class=\"dm-list__item-label-counter\">3</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">3.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-2\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">3</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-3\">\n    Entry number <span class=\"dm-list__item-label-counter\">4</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">4.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-3\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">4</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-4\">\n    Entry number <span class=\"dm-list__item-label-counter\">5</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">5.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-4\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">5</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-5\">\n    Entry number <span class=\"dm-list__item-label-counter\">6</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">6.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-5\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">6</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-6\">\n    Entry number <span class=\"dm-list__item-label-counter\">7</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">7.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-6\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">7</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-7\">\n    Entry number <span class=\"dm-list__item-label-counter\">8</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">8.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-7\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">8</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-8\">\n    Entry number <span class=\"dm-list__item-label-counter\">9</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">9.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-8\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">9</span></span>\n</button>\n          </div>\n        </div>\n        <div class=\"govuk-grid-row dm-list__item\">\n          <div class=\"dm-list__item-input-column\">\n            <div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-visually-hidden\" for=\"input-example-9\">\n    Entry number <span class=\"dm-list__item-label-counter\">10</span>\n  </label>\n  <div class=\"govuk-input__wrapper\">\n    <div class=\"govuk-input__prefix\" aria-hidden=\"true\">10.</div>\n    <input class=\"govuk-input dm-list__item-input\" id=\"input-example-9\" name=\"example\" type=\"text\">\n  </div>\n</div>\n\n          </div>\n          <div class=\"dm-list__item-remove-column\">\n            <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-remove govuk-visually-hidden\" data-module=\"govuk-button\">\n  Remove <span class=\"govuk-visually-hidden\">entry number <span class=\"dm-list__item-remove-counter\">10</span></span>\n</button>\n          </div>\n        </div>\n    </div>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-full\">\n        <button type=\"button\" class=\"govuk-button govuk-button--secondary dm-list__item-add govuk-visually-hidden\" data-module=\"govuk-button\">\n  Add another (<span class=\"dm-list__item-add-counter\">0</span> remaining)\n</button>\n      </div>\n    </div>\n\n</fieldset>\n</div>"
        }
    ]
}
