digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
1,459 lines • 237 kB
JSON
{
"component": "option-tree",
"fixtures": [
{
"name": "default",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need"
},
"items": [
{
"text": "Option set 1",
"items": [
{
"text": "Option set 1 option 1",
"value": 11
},
{
"text": "Option set 1 option 2",
"value": 12
},
{
"text": "Option set 1 option 3",
"value": 13
},
{
"text": "Option set 1 option 4",
"value": 14
},
{
"text": "Option set 1 option 5",
"value": 15
}
]
},
{
"text": "Option set 2",
"items": [
{
"text": "Option set 2 option 1",
"value": 21
},
{
"text": "Option set 2 option 2",
"value": 22
},
{
"text": "Option set 2 option 3",
"value": 23
},
{
"text": "Option set 2 option 4",
"value": 24
},
{
"text": "Option set 2 option 5",
"value": 25
}
]
},
{
"text": "Option set 3",
"items": [
{
"text": "Option set 3 option 1",
"value": 31
},
{
"text": "Option set 3 option 2",
"value": 32
},
{
"text": "Option set 3 option 3",
"value": 33
},
{
"text": "Option set 3 option 4",
"value": 34
},
{
"text": "Option set 3 option 5",
"value": 35
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"\" data-item-name-singular=\"item\" data-item-name-plural=\"items\" data-tier-restriction=\"0\" data-independent-selection=\"false\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-summary\">\n Option set 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1\" name=\"example\" type=\"checkbox\" value=\"11\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1\">\n Option set 1 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2\" name=\"example\" type=\"checkbox\" value=\"12\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2\">\n Option set 1 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3\" name=\"example\" type=\"checkbox\" value=\"13\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3\">\n Option set 1 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4\" name=\"example\" type=\"checkbox\" value=\"14\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4\">\n Option set 1 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-5\" name=\"example\" type=\"checkbox\" value=\"15\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-5\">\n Option set 1 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-summary\">\n Option set 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2\" name=\"example\" type=\"checkbox\" value=\"21\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2\">\n Option set 2 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2\" name=\"example\" type=\"checkbox\" value=\"22\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2\">\n Option set 2 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3\" name=\"example\" type=\"checkbox\" value=\"23\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3\">\n Option set 2 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4\" name=\"example\" type=\"checkbox\" value=\"24\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4\">\n Option set 2 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-5\" name=\"example\" type=\"checkbox\" value=\"25\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-5\">\n Option set 2 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-summary\">\n Option set 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3\" name=\"example\" type=\"checkbox\" value=\"31\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3\">\n Option set 3 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-2\" name=\"example\" type=\"checkbox\" value=\"32\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-2\">\n Option set 3 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-3\" name=\"example\" type=\"checkbox\" value=\"33\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-3\">\n Option set 3 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-4\" name=\"example\" type=\"checkbox\" value=\"34\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-4\">\n Option set 3 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-5\" name=\"example\" type=\"checkbox\" value=\"35\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-5\">\n Option set 3 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
},
{
"name": "with multiple item tiers",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need",
"hint": "Selecting an option includes all its sub-options",
"item_name": {
"singular": "option",
"plural": "options"
},
"tier_restriction": 2
},
"items": [
{
"text": "Option set 1",
"items": [
{
"text": "Option set 1 1",
"items": [
{
"text": "Option set 1 1 1",
"items": [
{
"text": "Option set 1 1 1 1",
"value": 1111
},
{
"text": "Option set 1 1 1 2",
"value": 1112
}
]
},
{
"text": "Option set 1 1 2",
"items": [
{
"text": "Option set 1 1 2 1",
"value": 1121
},
{
"text": "Option set 1 1 2 2",
"value": 1122
}
]
},
{
"text": "Option set 1 1 3",
"items": [
{
"text": "Option set 1 1 3 1",
"value": 1131
},
{
"text": "Option set 1 1 3 2",
"value": 1132
}
]
}
]
},
{
"text": "Option set 1 2",
"items": [
{
"text": "Option set 1 2 1",
"items": [
{
"text": "Option set 1 2 1 1",
"value": 1211
},
{
"text": "Option set 1 2 1 2",
"value": 1212
}
]
},
{
"text": "Option set 1 2 2",
"items": [
{
"text": "Option set 1 2 2 1",
"value": 1221
},
{
"text": "Option set 1 2 2 2",
"value": 1222
}
]
},
{
"text": "Option set 1 2 3",
"items": [
{
"text": "Option set 1 2 3 1",
"value": 1231
},
{
"text": "Option set 1 2 3 2",
"value": 1232
}
]
}
]
},
{
"text": "Option set 1 3",
"items": [
{
"text": "Option set 1 3 1",
"items": [
{
"text": "Option set 1 3 1 1",
"value": 1311
},
{
"text": "Option set 1 3 1 2",
"value": 1312
}
]
},
{
"text": "Option set 1 3 2",
"items": [
{
"text": "Option set 1 3 2 1",
"value": 1321
},
{
"text": "Option set 1 3 2 2",
"value": 1322
}
]
},
{
"text": "Option set 1 3 3",
"items": [
{
"text": "Option set 1 3 3 1",
"value": 1331
},
{
"text": "Option set 1 3 3 2",
"value": 1332
}
]
}
]
},
{
"text": "Option set 1 4",
"items": [
{
"text": "Option set 1 4 1",
"items": [
{
"text": "Option set 1 4 1 1",
"value": 1411
},
{
"text": "Option set 1 4 1 2",
"value": 1412
}
]
},
{
"text": "Option set 1 4 2",
"items": [
{
"text": "Option set 1 4 2 1",
"value": 1421
},
{
"text": "Option set 1 4 2 2",
"value": 1422
}
]
},
{
"text": "Option set 1 4 3",
"items": [
{
"text": "Option set 1 4 3 1",
"value": 1431
},
{
"text": "Option set 1 4 3 2",
"value": 1432
}
]
}
]
}
]
},
{
"text": "Option set 2",
"items": [
{
"text": "Option set 2 1",
"items": [
{
"text": "Option set 2 1 1",
"items": [
{
"text": "Option set 2 1 1 1",
"value": 2111
},
{
"text": "Option set 2 1 1 2",
"value": 2112
}
]
},
{
"text": "Option set 2 1 2",
"items": [
{
"text": "Option set 2 1 2 1",
"value": 2121
},
{
"text": "Option set 2 1 2 2",
"value": 2122
}
]
},
{
"text": "Option set 2 1 3",
"items": [
{
"text": "Option set 2 1 3 1",
"value": 2131
},
{
"text": "Option set 2 1 3 2",
"value": 2132
}
]
}
]
},
{
"text": "Option set 2 2",
"items": [
{
"text": "Option set 2 2 1",
"items": [
{
"text": "Option set 2 2 1 1",
"value": 2211
},
{
"text": "Option set 2 2 1 2",
"value": 2212
}
]
},
{
"text": "Option set 2 2 2",
"items": [
{
"text": "Option set 2 2 2 1",
"value": 2221
},
{
"text": "Option set 2 2 2 2",
"value": 2222
}
]
},
{
"text": "Option set 2 2 3",
"items": [
{
"text": "Option set 2 2 3 1",
"value": 2231
},
{
"text": "Option set 2 2 3 2",
"value": 2232
}
]
}
]
},
{
"text": "Option set 2 3",
"items": [
{
"text": "Option set 2 3 1",
"items": [
{
"text": "Option set 2 3 1 1",
"value": 2311
},
{
"text": "Option set 2 3 1 2",
"value": 2312
}
]
},
{
"text": "Option set 2 3 2",
"items": [
{
"text": "Option set 2 3 2 1",
"value": 2321
},
{
"text": "Option set 2 3 2 2",
"value": 2322
}
]
},
{
"text": "Option set 2 3 3",
"items": [
{
"text": "Option set 2 3 3 1",
"value": 2331
},
{
"text": "Option set 2 3 3 2",
"value": 2332
}
]
}
]
},
{
"text": "Option set 2 4",
"items": [
{
"text": "Option set 2 4 1",
"items": [
{
"text": "Option set 2 4 1 1",
"value": 2411
},
{
"text": "Option set 2 4 1 2",
"value": 2412
}
]
},
{
"text": "Option set 2 4 2",
"items": [
{
"text": "Option set 2 4 2 1",
"value": 2421
},
{
"text": "Option set 2 4 2 2",
"value": 2422
}
]
},
{
"text": "Option set 2 4 3",
"items": [
{
"text": "Option set 2 4 3 1",
"value": 2431
},
{
"text": "Option set 2 4 3 2",
"value": 2432
}
]
}
]
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"input-example-hint\" data-item-name-singular=\"option\" data-item-name-plural=\"options\" data-tier-restriction=\"2\" data-independent-selection=\"false\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n Selecting an option includes all its sub-options\n</div>\n\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 1\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-summary\">\n Option set 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-summary\">\n Option set 1 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1\" name=\"example\" type=\"checkbox\" value=\"1111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1\">\n Option set 1 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-2\">\n Option set 1 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-summary\">\n Option set 1 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1121\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2\">\n Option set 1 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1122\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-2\">\n Option set 1 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-summary\">\n Option set 1 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3\" name=\"example\" type=\"checkbox\" value=\"1131\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3\">\n Option set 1 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1132\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-2\">\n Option set 1 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-summary\">\n Option set 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-summary\">\n Option set 1 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1\" name=\"example\" type=\"checkbox\" value=\"1211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1\">\n Option set 1 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-2\" name=\"example\" type=\"checkbox\" value=\"1212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-2\">\n Option set 1 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-summary\">\n Option set 1 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2\">\n Option set 1 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-2\" name=\"example\" type=\"checkbox\" value=\"1222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-2\">\n Option set 1 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-summary\">\n Option set 1 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3\" name=\"example\" type=\"checkbox\" value=\"1231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3\">\n Option set 1 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-2\" name=\"example\" type=\"checkbox\" value=\"1232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-2\">\n Option set 1 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-summary\">\n Option set 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-summary\">\n Option set 1 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1\" name=\"example\" type=\"checkbox\" value=\"1311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1\">\n Option set 1 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-2\" name=\"example\" type=\"checkbox\" value=\"1312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-2\">\n Option set 1 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-summary\">\n Option set 1 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2\">\n Option set 1 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-2\" name=\"example\" type=\"checkbox\" value=\"1322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-2\">\n Option set 1 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-summary\">\n Option set 1 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3\" name=\"example\" type=\"checkbox\" value=\"1331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3\">\n Option set 1 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-2\" name=\"example\" type=\"checkbox\" value=\"1332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-2\">\n Option set 1 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-summary\">\n Option set 1 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-summary\">\n Option set 1 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1\" name=\"example\" type=\"checkbox\" value=\"1411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1\">\n Option set 1 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-2\" name=\"example\" type=\"checkbox\" value=\"1412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-2\">\n Option set 1 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-summary\">\n Option set 1 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2\" name=\"example\" type=\"checkbox\" value=\"1421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2\">\n Option set 1 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-2\" name=\"example\" type=\"checkbox\" value=\"1422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-2\">\n Option set 1 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-summary\">\n Option set 1 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3\" name=\"example\" type=\"checkbox\" value=\"1431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3\">\n Option set 1 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-2\" name=\"example\" type=\"checkbox\" value=\"1432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-2\">\n Option set 1 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 2\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-summary\">\n Option set 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-summary\">\n Option set 2 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1\" name=\"example\" type=\"checkbox\" value=\"2111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1\">\n Option set 2 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-2\" name=\"example\" type=\"checkbox\" value=\"2112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-2\">\n Option set 2 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-summary\">\n Option set 2 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2121\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2\">\n Option set 2 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-2\" name=\"example\" type=\"checkbox\" value=\"2122\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-2\">\n Option set 2 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-summary\">\n Option set 2 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3\" name=\"example\" type=\"checkbox\" value=\"2131\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3\">\n Option set 2 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-2\" name=\"example\" type=\"checkbox\" value=\"2132\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-2\">\n Option set 2 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-summary\">\n Option set 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-summary\">\n Option set 2 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1\" name=\"example\" type=\"checkbox\" value=\"2211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1\">\n Option set 2 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-2\">\n Option set 2 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-summary\">\n Option set 2 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2\">\n Option set 2 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-2\">\n Option set 2 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-summary\">\n Option set 2 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3\" name=\"example\" type=\"checkbox\" value=\"2231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3\">\n Option set 2 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-2\">\n Option set 2 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-summary\">\n Option set 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-summary\">\n Option set 2 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1\" name=\"example\" type=\"checkbox\" value=\"2311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1\">\n Option set 2 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-2\" name=\"example\" type=\"checkbox\" value=\"2312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-2\">\n Option set 2 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-summary\">\n Option set 2 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2\">\n Option set 2 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-2\" name=\"example\" type=\"checkbox\" value=\"2322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-2\">\n Option set 2 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-summary\">\n Option set 2 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3\" name=\"example\" type=\"checkbox\" value=\"2331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3\">\n Option set 2 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-2\" name=\"example\" type=\"checkbox\" value=\"2332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-2\">\n Option set 2 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-summary\">\n Option set 2 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-summary\">\n Option set 2 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1\" name=\"example\" type=\"checkbox\" value=\"2411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1\">\n Option set 2 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-2\" name=\"example\" type=\"checkbox\" value=\"2412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-2\">\n Option set 2 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-summary\">\n Option set 2 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2\" name=\"example\" type=\"checkbox\" value=\"2421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2\">\n Option set 2 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-2\" name=\"example\" type=\"checkbox\" value=\"2422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-2\">\n Option set 2 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-summary\">\n Option set 2 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3\" name=\"example\" type=\"checkbox\" value=\"2431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3\">\n Option set 2 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-2\" name=\"example\" type=\"checkbox\" value=\"2432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-2\">\n Option set 2 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
},
{
"name": "with values checked",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need"
},
"items": [
{
"text": "Option set 1",
"items": [
{
"text": "Option set 1 option 1",
"value": 11,
"checked": true
},
{
"text": "Option set 1 option 2",
"value": 12
},
{
"text": "Option set 1 option 3",
"value": 13
},
{
"text": "Option set 1 option 4",
"value": 14,
"checked": true
},
{
"text": "Option set 1 option 5",
"value": 15
}
]
},
{
"text": "Option set 2",
"items": [
{
"text": "Option set 2 option 1",
"value": 21
},
{
"text": "Option set 2 option 2",
"value": 22
},
{
"text": "Option set 2 option 3",
"value": 23
},
{
"text": "Option set 2 option 4",
"value": 24
},
{
"text": "Option set 2 option 5",
"value": 25
}
]
},
{
"text": "Option set 3",
"items": [
{
"text": "Option set 3 option 1",
"value": 31
},
{
"text": "Option set 3 option 2",
"value": 32,
"checked": true
},
{
"text": "Option set 3 option 3",
"value": 33,
"checked": true
},
{
"text": "Option set 3 option 4",
"value": 34,
"checked": true
},
{
"text": "Option set 3 option 5",
"value": 35
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"\" data-item-name-singular=\"item\" data-item-name-plural=\"items\" data-tier-restriction=\"0\" data-independent-selection=\"false\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-summary\">\n Option set 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1\" name=\"example\" type=\"checkbox\" value=\"11\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1\">\n Option set 1 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2\" name=\"example\" type=\"checkbox\" value=\"12\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2\">\n Option set 1 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3\" name=\"example\" type=\"checkbox\" value=\"13\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3\">\n Option set 1 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4\" name=\"example\" type=\"checkbox\" value=\"14\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4\">\n Option set 1 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-5\" name=\"example\" type=\"checkbox\" value=\"15\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-5\">\n Option set 1 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-summary\">\n Option set 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2\" name=\"example\" type=\"checkbox\" value=\"21\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2\">\n Option set 2 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2\" name=\"example\" type=\"checkbox\" value=\"22\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2\">\n Option set 2 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3\" name=\"example\" type=\"checkbox\" value=\"23\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3\">\n Option set 2 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4\" name=\"example\" type=\"checkbox\" value=\"24\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4\">\n Option set 2 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-5\" name=\"example\" type=\"checkbox\" value=\"25\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-5\">\n Option set 2 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-summary\">\n Option set 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3\" name=\"example\" type=\"checkbox\" value=\"31\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3\">\n Option set 3 option 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-2\" name=\"example\" type=\"checkbox\" value=\"32\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-2\">\n Option set 3 option 2\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-3\" name=\"example\" type=\"checkbox\" value=\"33\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-3\">\n Option set 3 option 3\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-4\" name=\"example\" type=\"checkbox\" value=\"34\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-4\">\n Option set 3 option 4\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-3-5\" name=\"example\" type=\"checkbox\" value=\"35\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-3-5\">\n Option set 3 option 5\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
},
{
"name": "with independent selection",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need",
"hint": "Selecting an option searches across all its sub-options",
"item_name": {
"singular": "option",
"plural": "options"
},
"tier_restriction": 2,
"independent_selection": true
},
"items": [
{
"text": "Option set 1",
"value": "option set 1",
"items": [
{
"text": "Option set 1 1",
"value": "option set 1 1",
"checked": true,
"items": [
{
"text": "Option set 1 1 1",
"value": "option set 1 1 1",
"items": [
{
"text": "Option set 1 1 1 1",
"value": 1111
},
{
"text": "Option set 1 1 1 2",
"value": 1112
}
]
},
{
"text": "Option set 1 1 2",
"value": "option set 1 1 2",
"items": [
{
"text": "Option set 1 1 2 1",
"value": 1121
},
{
"text": "Option set 1 1 2 2",
"value": 1122
}
]
}
]
},
{
"text": "Option set 1 2",
"value": "option set 1 2",
"items": [
{
"text": "Option set 1 2 1",
"value": "option set 1 2 1",
"items": [
{
"text": "Option set 1 2 1 1",
"value": 1211
},
{
"text": "Option set 1 2 1 2",
"value": 1212
}
]
}
]
}
]
},
{
"text": "Option set 2",
"value": "option set 2",
"items": [
{
"text": "Option set 2 1",
"value": "option set 2 1",
"items": [
{
"text": "Option set 2 1 1",
"value": "option set 2 1 1",
"items": [
{
"text": "Option set 2 1 1 1",
"value": 2111
},
{
"text": "Option set 2 1 1 2",
"value": 2112
}
]
}
]
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"input-example-hint\" data-item-name-singular=\"option\" data-item-name-plural=\"options\" data-tier-restriction=\"2\" data-independent-selection=\"true\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n Selecting an option searches across all its sub-options\n</div>\n\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 1\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-summary\" type=\"checkbox\" name=\"example\" value=\"option set 1 1\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-summary\">\n Option set 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-summary\" type=\"checkbox\" name=\"example\" value=\"option set 1 1 1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-summary\">\n Option set 1 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1\" name=\"example\" type=\"checkbox\" value=\"1111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1\">\n Option set 1 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-2\">\n Option set 1 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-summary\" type=\"checkbox\" name=\"example\" value=\"option set 1 1 2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-summary\">\n Option set 1 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1121\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2\">\n Option set 1 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1122\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-2\">\n Option set 1 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-summary\" type=\"checkbox\" name=\"example\" value=\"option set 1 2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-summary\">\n Option set 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-summary\" type=\"checkbox\" name=\"example\" value=\"option set 1 2 1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-summary\">\n Option set 1 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1\" name=\"example\" type=\"checkbox\" value=\"1211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1\">\n Option set 1 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-2\" name=\"example\" type=\"checkbox\" value=\"1212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-2\">\n Option set 1 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 2\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-summary\" type=\"checkbox\" name=\"example\" value=\"option set 2 1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-summary\">\n Option set 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-summary\" type=\"checkbox\" name=\"example\" value=\"option set 2 1 1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-summary\">\n Option set 2 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1\" name=\"example\" type=\"checkbox\" value=\"2111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1\">\n Option set 2 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-2\" name=\"example\" type=\"checkbox\" value=\"2112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-2\">\n Option set 2 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
},
{
"name": "with multiple item tiers with values checked",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need",
"hint": "Selecting an option includes all its sub-options",
"item_name": {
"singular": "option",
"plural": "options"
},
"tier_restriction": 2
},
"items": [
{
"text": "Option set 1",
"items": [
{
"text": "Option set 1 1",
"items": [
{
"text": "Option set 1 1 1",
"items": [
{
"text": "Option set 1 1 1 1",
"value": 1111,
"checked": true
},
{
"text": "Option set 1 1 1 2",
"value": 1112
}
]
},
{
"text": "Option set 1 1 2",
"items": [
{
"text": "Option set 1 1 2 1",
"value": 1121,
"checked": true
},
{
"text": "Option set 1 1 2 2",
"value": 1122,
"checked": true
}
]
},
{
"text": "Option set 1 1 3",
"items": [
{
"text": "Option set 1 1 3 1",
"value": 1131,
"checked": true
},
{
"text": "Option set 1 1 3 2",
"value": 1132
}
]
}
]
},
{
"text": "Option set 1 2",
"items": [
{
"text": "Option set 1 2 1",
"items": [
{
"text": "Option set 1 2 1 1",
"value": 1211
},
{
"text": "Option set 1 2 1 2",
"value": 1212
}
]
},
{
"text": "Option set 1 2 2",
"items": [
{
"text": "Option set 1 2 2 1",
"value": 1221
},
{
"text": "Option set 1 2 2 2",
"value": 1222
}
]
},
{
"text": "Option set 1 2 3",
"items": [
{
"text": "Option set 1 2 3 1",
"value": 1231
},
{
"text": "Option set 1 2 3 2",
"value": 1232
}
]
}
]
},
{
"text": "Option set 1 3",
"items": [
{
"text": "Option set 1 3 1",
"items": [
{
"text": "Option set 1 3 1 1",
"value": 1311
},
{
"text": "Option set 1 3 1 2",
"value": 1312
}
]
},
{
"text": "Option set 1 3 2",
"items": [
{
"text": "Option set 1 3 2 1",
"value": 1321
},
{
"text": "Option set 1 3 2 2",
"value": 1322
}
]
},
{
"text": "Option set 1 3 3",
"items": [
{
"text": "Option set 1 3 3 1",
"value": 1331
},
{
"text": "Option set 1 3 3 2",
"value": 1332
}
]
}
]
},
{
"text": "Option set 1 4",
"items": [
{
"text": "Option set 1 4 1",
"items": [
{
"text": "Option set 1 4 1 1",
"value": 1411
},
{
"text": "Option set 1 4 1 2",
"value": 1412
}
]
},
{
"text": "Option set 1 4 2",
"items": [
{
"text": "Option set 1 4 2 1",
"value": 1421
},
{
"text": "Option set 1 4 2 2",
"value": 1422
}
]
},
{
"text": "Option set 1 4 3",
"items": [
{
"text": "Option set 1 4 3 1",
"value": 1431
},
{
"text": "Option set 1 4 3 2",
"value": 1432
}
]
}
]
}
]
},
{
"text": "Option set 2",
"items": [
{
"text": "Option set 2 1",
"items": [
{
"text": "Option set 2 1 1",
"items": [
{
"text": "Option set 2 1 1 1",
"value": 2111
},
{
"text": "Option set 2 1 1 2",
"value": 2112
}
]
},
{
"text": "Option set 2 1 2",
"items": [
{
"text": "Option set 2 1 2 1",
"value": 2121
},
{
"text": "Option set 2 1 2 2",
"value": 2122
}
]
},
{
"text": "Option set 2 1 3",
"items": [
{
"text": "Option set 2 1 3 1",
"value": 2131
},
{
"text": "Option set 2 1 3 2",
"value": 2132
}
]
}
]
},
{
"text": "Option set 2 2",
"items": [
{
"text": "Option set 2 2 1",
"items": [
{
"text": "Option set 2 2 1 1",
"value": 2211
},
{
"text": "Option set 2 2 1 2",
"value": 2212
}
]
},
{
"text": "Option set 2 2 2",
"items": [
{
"text": "Option set 2 2 2 1",
"value": 2221
},
{
"text": "Option set 2 2 2 2",
"value": 2222
}
]
},
{
"text": "Option set 2 2 3",
"items": [
{
"text": "Option set 2 2 3 1",
"value": 2231
},
{
"text": "Option set 2 2 3 2",
"value": 2232
}
]
}
]
},
{
"text": "Option set 2 3",
"items": [
{
"text": "Option set 2 3 1",
"items": [
{
"text": "Option set 2 3 1 1",
"value": 2311
},
{
"text": "Option set 2 3 1 2",
"value": 2312
}
]
},
{
"text": "Option set 2 3 2",
"items": [
{
"text": "Option set 2 3 2 1",
"value": 2321
},
{
"text": "Option set 2 3 2 2",
"value": 2322
}
]
},
{
"text": "Option set 2 3 3",
"items": [
{
"text": "Option set 2 3 3 1",
"value": 2331
},
{
"text": "Option set 2 3 3 2",
"value": 2332
}
]
}
]
},
{
"text": "Option set 2 4",
"items": [
{
"text": "Option set 2 4 1",
"items": [
{
"text": "Option set 2 4 1 1",
"value": 2411
},
{
"text": "Option set 2 4 1 2",
"value": 2412
}
]
},
{
"text": "Option set 2 4 2",
"items": [
{
"text": "Option set 2 4 2 1",
"value": 2421
},
{
"text": "Option set 2 4 2 2",
"value": 2422
}
]
},
{
"text": "Option set 2 4 3",
"items": [
{
"text": "Option set 2 4 3 1",
"value": 2431
},
{
"text": "Option set 2 4 3 2",
"value": 2432
}
]
}
]
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"input-example-hint\" data-item-name-singular=\"option\" data-item-name-plural=\"options\" data-tier-restriction=\"2\" data-independent-selection=\"false\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n Selecting an option includes all its sub-options\n</div>\n\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 1\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-summary\">\n Option set 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-summary\">\n Option set 1 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1\" name=\"example\" type=\"checkbox\" value=\"1111\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1\">\n Option set 1 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-2\">\n Option set 1 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-summary\">\n Option set 1 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1121\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2\">\n Option set 1 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1122\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-2\">\n Option set 1 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-summary\">\n Option set 1 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3\" name=\"example\" type=\"checkbox\" value=\"1131\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3\">\n Option set 1 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1132\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-2\">\n Option set 1 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-summary\">\n Option set 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-summary\">\n Option set 1 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1\" name=\"example\" type=\"checkbox\" value=\"1211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1\">\n Option set 1 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-2\" name=\"example\" type=\"checkbox\" value=\"1212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-2\">\n Option set 1 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-summary\">\n Option set 1 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2\">\n Option set 1 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-2\" name=\"example\" type=\"checkbox\" value=\"1222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-2\">\n Option set 1 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-summary\">\n Option set 1 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3\" name=\"example\" type=\"checkbox\" value=\"1231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3\">\n Option set 1 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-2\" name=\"example\" type=\"checkbox\" value=\"1232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-2\">\n Option set 1 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-summary\">\n Option set 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-summary\">\n Option set 1 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1\" name=\"example\" type=\"checkbox\" value=\"1311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1\">\n Option set 1 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-2\" name=\"example\" type=\"checkbox\" value=\"1312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-2\">\n Option set 1 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-summary\">\n Option set 1 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2\">\n Option set 1 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-2\" name=\"example\" type=\"checkbox\" value=\"1322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-2\">\n Option set 1 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-summary\">\n Option set 1 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3\" name=\"example\" type=\"checkbox\" value=\"1331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3\">\n Option set 1 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-2\" name=\"example\" type=\"checkbox\" value=\"1332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-2\">\n Option set 1 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-summary\">\n Option set 1 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-summary\">\n Option set 1 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1\" name=\"example\" type=\"checkbox\" value=\"1411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1\">\n Option set 1 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-2\" name=\"example\" type=\"checkbox\" value=\"1412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-2\">\n Option set 1 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-summary\">\n Option set 1 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2\" name=\"example\" type=\"checkbox\" value=\"1421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2\">\n Option set 1 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-2\" name=\"example\" type=\"checkbox\" value=\"1422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-2\">\n Option set 1 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-summary\">\n Option set 1 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3\" name=\"example\" type=\"checkbox\" value=\"1431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3\">\n Option set 1 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-2\" name=\"example\" type=\"checkbox\" value=\"1432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-2\">\n Option set 1 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 2\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-summary\">\n Option set 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-summary\">\n Option set 2 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1\" name=\"example\" type=\"checkbox\" value=\"2111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1\">\n Option set 2 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-2\" name=\"example\" type=\"checkbox\" value=\"2112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-2\">\n Option set 2 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-summary\">\n Option set 2 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2121\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2\">\n Option set 2 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-2\" name=\"example\" type=\"checkbox\" value=\"2122\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-2\">\n Option set 2 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-summary\">\n Option set 2 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3\" name=\"example\" type=\"checkbox\" value=\"2131\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3\">\n Option set 2 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-2\" name=\"example\" type=\"checkbox\" value=\"2132\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-2\">\n Option set 2 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-summary\">\n Option set 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-summary\">\n Option set 2 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1\" name=\"example\" type=\"checkbox\" value=\"2211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1\">\n Option set 2 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-2\">\n Option set 2 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-summary\">\n Option set 2 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2\">\n Option set 2 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-2\">\n Option set 2 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-summary\">\n Option set 2 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3\" name=\"example\" type=\"checkbox\" value=\"2231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3\">\n Option set 2 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-2\">\n Option set 2 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-summary\">\n Option set 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-summary\">\n Option set 2 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1\" name=\"example\" type=\"checkbox\" value=\"2311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1\">\n Option set 2 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-2\" name=\"example\" type=\"checkbox\" value=\"2312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-2\">\n Option set 2 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-summary\">\n Option set 2 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2\">\n Option set 2 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-2\" name=\"example\" type=\"checkbox\" value=\"2322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-2\">\n Option set 2 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-summary\">\n Option set 2 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3\" name=\"example\" type=\"checkbox\" value=\"2331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3\">\n Option set 2 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-2\" name=\"example\" type=\"checkbox\" value=\"2332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-2\">\n Option set 2 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-summary\">\n Option set 2 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-summary\">\n Option set 2 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1\" name=\"example\" type=\"checkbox\" value=\"2411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1\">\n Option set 2 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-2\" name=\"example\" type=\"checkbox\" value=\"2412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-2\">\n Option set 2 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-summary\">\n Option set 2 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2\" name=\"example\" type=\"checkbox\" value=\"2421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2\">\n Option set 2 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-2\" name=\"example\" type=\"checkbox\" value=\"2422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-2\">\n Option set 2 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-summary\">\n Option set 2 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3\" name=\"example\" type=\"checkbox\" value=\"2431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3\">\n Option set 2 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-2\" name=\"example\" type=\"checkbox\" value=\"2432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-2\">\n Option set 2 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
},
{
"name": "with multiple item tiers with all values checked",
"options": {
"filter_settings": {
"name": "example",
"label": "Select the options you need",
"hint": "Selecting an option includes all its sub-options",
"item_name": {
"singular": "option",
"plural": "options"
},
"tier_restriction": 2
},
"items": [
{
"text": "Option set 1",
"items": [
{
"text": "Option set 1 1",
"items": [
{
"text": "Option set 1 1 1",
"items": [
{
"text": "Option set 1 1 1 1",
"value": 1111,
"checked": true
},
{
"text": "Option set 1 1 1 2",
"value": 1112,
"checked": true
}
]
},
{
"text": "Option set 1 1 2",
"items": [
{
"text": "Option set 1 1 2 1",
"value": 1121,
"checked": true
},
{
"text": "Option set 1 1 2 2",
"value": 1122,
"checked": true
}
]
},
{
"text": "Option set 1 1 3",
"items": [
{
"text": "Option set 1 1 3 1",
"value": 1131,
"checked": true
},
{
"text": "Option set 1 1 3 2",
"value": 1132,
"checked": true
}
]
}
]
},
{
"text": "Option set 1 2",
"items": [
{
"text": "Option set 1 2 1",
"items": [
{
"text": "Option set 1 2 1 1",
"value": 1211
},
{
"text": "Option set 1 2 1 2",
"value": 1212
}
]
},
{
"text": "Option set 1 2 2",
"items": [
{
"text": "Option set 1 2 2 1",
"value": 1221
},
{
"text": "Option set 1 2 2 2",
"value": 1222
}
]
},
{
"text": "Option set 1 2 3",
"items": [
{
"text": "Option set 1 2 3 1",
"value": 1231
},
{
"text": "Option set 1 2 3 2",
"value": 1232
}
]
}
]
},
{
"text": "Option set 1 3",
"items": [
{
"text": "Option set 1 3 1",
"items": [
{
"text": "Option set 1 3 1 1",
"value": 1311
},
{
"text": "Option set 1 3 1 2",
"value": 1312
}
]
},
{
"text": "Option set 1 3 2",
"items": [
{
"text": "Option set 1 3 2 1",
"value": 1321
},
{
"text": "Option set 1 3 2 2",
"value": 1322
}
]
},
{
"text": "Option set 1 3 3",
"items": [
{
"text": "Option set 1 3 3 1",
"value": 1331
},
{
"text": "Option set 1 3 3 2",
"value": 1332
}
]
}
]
},
{
"text": "Option set 1 4",
"items": [
{
"text": "Option set 1 4 1",
"items": [
{
"text": "Option set 1 4 1 1",
"value": 1411
},
{
"text": "Option set 1 4 1 2",
"value": 1412
}
]
},
{
"text": "Option set 1 4 2",
"items": [
{
"text": "Option set 1 4 2 1",
"value": 1421
},
{
"text": "Option set 1 4 2 2",
"value": 1422
}
]
},
{
"text": "Option set 1 4 3",
"items": [
{
"text": "Option set 1 4 3 1",
"value": 1431
},
{
"text": "Option set 1 4 3 2",
"value": 1432
}
]
}
]
}
]
},
{
"text": "Option set 2",
"items": [
{
"text": "Option set 2 1",
"items": [
{
"text": "Option set 2 1 1",
"items": [
{
"text": "Option set 2 1 1 1",
"value": 2111
},
{
"text": "Option set 2 1 1 2",
"value": 2112
}
]
},
{
"text": "Option set 2 1 2",
"items": [
{
"text": "Option set 2 1 2 1",
"value": 2121
},
{
"text": "Option set 2 1 2 2",
"value": 2122
}
]
},
{
"text": "Option set 2 1 3",
"items": [
{
"text": "Option set 2 1 3 1",
"value": 2131
},
{
"text": "Option set 2 1 3 2",
"value": 2132
}
]
}
]
},
{
"text": "Option set 2 2",
"items": [
{
"text": "Option set 2 2 1",
"items": [
{
"text": "Option set 2 2 1 1",
"value": 2211
},
{
"text": "Option set 2 2 1 2",
"value": 2212
}
]
},
{
"text": "Option set 2 2 2",
"items": [
{
"text": "Option set 2 2 2 1",
"value": 2221
},
{
"text": "Option set 2 2 2 2",
"value": 2222
}
]
},
{
"text": "Option set 2 2 3",
"items": [
{
"text": "Option set 2 2 3 1",
"value": 2231
},
{
"text": "Option set 2 2 3 2",
"value": 2232
}
]
}
]
},
{
"text": "Option set 2 3",
"items": [
{
"text": "Option set 2 3 1",
"items": [
{
"text": "Option set 2 3 1 1",
"value": 2311
},
{
"text": "Option set 2 3 1 2",
"value": 2312
}
]
},
{
"text": "Option set 2 3 2",
"items": [
{
"text": "Option set 2 3 2 1",
"value": 2321
},
{
"text": "Option set 2 3 2 2",
"value": 2322
}
]
},
{
"text": "Option set 2 3 3",
"items": [
{
"text": "Option set 2 3 3 1",
"value": 2331
},
{
"text": "Option set 2 3 3 2",
"value": 2332
}
]
}
]
},
{
"text": "Option set 2 4",
"items": [
{
"text": "Option set 2 4 1",
"items": [
{
"text": "Option set 2 4 1 1",
"value": 2411
},
{
"text": "Option set 2 4 1 2",
"value": 2412
}
]
},
{
"text": "Option set 2 4 2",
"items": [
{
"text": "Option set 2 4 2 1",
"value": 2421
},
{
"text": "Option set 2 4 2 2",
"value": 2422
}
]
},
{
"text": "Option set 2 4 3",
"items": [
{
"text": "Option set 2 4 3 1",
"value": 2431
},
{
"text": "Option set 2 4 3 2",
"value": 2432
}
]
}
]
}
]
}
]
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<fieldset class=\"govuk-fieldset dm-option-tree\" data-module=\"dm-option-tree\" aria-describedby=\"input-example-hint\" data-item-name-singular=\"option\" data-item-name-plural=\"options\" data-tier-restriction=\"2\" data-independent-selection=\"false\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n Select the options you need\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n Selecting an option includes all its sub-options\n</div>\n\n\n <div class=\"dm-option-tree__summary\">\n <p class=\"dm-option-tree__summary-total govuk-body\">\n <strong class=\"dm-option-tree__summary-total-selected\"></strong>\n <span class=\"dm-option-tree__summary-total-selected-text\"></span>\n </p>\n </div>\n\n <div id=\"example-options-tree\" class=\"dm-option-tree__options\">\n \n <details id=\"details-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 1\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-summary\">\n Option set 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-summary\">\n Option set 1 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1\" name=\"example\" type=\"checkbox\" value=\"1111\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1\">\n Option set 1 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1112\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-1-2\">\n Option set 1 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-summary\">\n Option set 1 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2\" name=\"example\" type=\"checkbox\" value=\"1121\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2\">\n Option set 1 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1122\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-2-2\">\n Option set 1 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-summary\">\n Option set 1 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3\" name=\"example\" type=\"checkbox\" value=\"1131\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3\">\n Option set 1 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1132\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-1-3-2\">\n Option set 1 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-summary\">\n Option set 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-summary\">\n Option set 1 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1\" name=\"example\" type=\"checkbox\" value=\"1211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1\">\n Option set 1 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-1-2\" name=\"example\" type=\"checkbox\" value=\"1212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-1-2\">\n Option set 1 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-summary\">\n Option set 1 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2\" name=\"example\" type=\"checkbox\" value=\"1221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2\">\n Option set 1 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-2-2\" name=\"example\" type=\"checkbox\" value=\"1222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-2-2\">\n Option set 1 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-summary\">\n Option set 1 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3\" name=\"example\" type=\"checkbox\" value=\"1231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3\">\n Option set 1 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-2-3-2\" name=\"example\" type=\"checkbox\" value=\"1232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-2-3-2\">\n Option set 1 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-summary\">\n Option set 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-summary\">\n Option set 1 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1\" name=\"example\" type=\"checkbox\" value=\"1311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1\">\n Option set 1 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-1-2\" name=\"example\" type=\"checkbox\" value=\"1312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-1-2\">\n Option set 1 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-summary\">\n Option set 1 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2\" name=\"example\" type=\"checkbox\" value=\"1321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2\">\n Option set 1 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-2-2\" name=\"example\" type=\"checkbox\" value=\"1322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-2-2\">\n Option set 1 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-summary\">\n Option set 1 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3\" name=\"example\" type=\"checkbox\" value=\"1331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3\">\n Option set 1 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-3-3-2\" name=\"example\" type=\"checkbox\" value=\"1332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-3-3-2\">\n Option set 1 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-1-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-summary\">\n Option set 1 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-1-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-summary\">\n Option set 1 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1\" name=\"example\" type=\"checkbox\" value=\"1411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1\">\n Option set 1 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-1-2\" name=\"example\" type=\"checkbox\" value=\"1412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-1-2\">\n Option set 1 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-summary\">\n Option set 1 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2\" name=\"example\" type=\"checkbox\" value=\"1421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2\">\n Option set 1 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-2-2\" name=\"example\" type=\"checkbox\" value=\"1422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-2-2\">\n Option set 1 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-1-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-summary\">\n Option set 1 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3\" name=\"example\" type=\"checkbox\" value=\"1431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3\">\n Option set 1 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-1-4-3-2\" name=\"example\" type=\"checkbox\" value=\"1432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-1-4-3-2\">\n Option set 1 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n Option set 2\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-summary\">\n Option set 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-1-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-summary\">\n Option set 2 1 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1\" name=\"example\" type=\"checkbox\" value=\"2111\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1\">\n Option set 2 1 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-1-2\" name=\"example\" type=\"checkbox\" value=\"2112\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-1-2\">\n Option set 2 1 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-summary\">\n Option set 2 1 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2121\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2\">\n Option set 2 1 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-2-2\" name=\"example\" type=\"checkbox\" value=\"2122\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-2-2\">\n Option set 2 1 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-1-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-summary\">\n Option set 2 1 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3\" name=\"example\" type=\"checkbox\" value=\"2131\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3\">\n Option set 2 1 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-1-3-2\" name=\"example\" type=\"checkbox\" value=\"2132\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-1-3-2\">\n Option set 2 1 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-summary\">\n Option set 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-2-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-summary\">\n Option set 2 2 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1\" name=\"example\" type=\"checkbox\" value=\"2211\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1\">\n Option set 2 2 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-1-2\" name=\"example\" type=\"checkbox\" value=\"2212\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-1-2\">\n Option set 2 2 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-summary\">\n Option set 2 2 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2221\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2\">\n Option set 2 2 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-2-2\" name=\"example\" type=\"checkbox\" value=\"2222\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-2-2\">\n Option set 2 2 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-summary\">\n Option set 2 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3\" name=\"example\" type=\"checkbox\" value=\"2231\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3\">\n Option set 2 2 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2232\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-2-3-2\">\n Option set 2 2 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-summary\">\n Option set 2 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-3-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-summary\">\n Option set 2 3 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1\" name=\"example\" type=\"checkbox\" value=\"2311\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1\">\n Option set 2 3 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-1-2\" name=\"example\" type=\"checkbox\" value=\"2312\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-1-2\">\n Option set 2 3 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-summary\">\n Option set 2 3 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2\" name=\"example\" type=\"checkbox\" value=\"2321\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2\">\n Option set 2 3 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-2-2\" name=\"example\" type=\"checkbox\" value=\"2322\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-2-2\">\n Option set 2 3 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-3-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-summary\">\n Option set 2 3 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3\" name=\"example\" type=\"checkbox\" value=\"2331\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3\">\n Option set 2 3 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-3-3-2\" name=\"example\" type=\"checkbox\" value=\"2332\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-3-3-2\">\n Option set 2 3 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n \n <details id=\"details-2-4\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-summary\">\n Option set 2 4\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n \n <details id=\"details-2-4-1\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-summary\">\n Option set 2 4 1\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1\" name=\"example\" type=\"checkbox\" value=\"2411\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1\">\n Option set 2 4 1 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-1-2\" name=\"example\" type=\"checkbox\" value=\"2412\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-1-2\">\n Option set 2 4 1 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-2\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-summary\">\n Option set 2 4 2\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2\" name=\"example\" type=\"checkbox\" value=\"2421\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2\">\n Option set 2 4 2 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-2-2\" name=\"example\" type=\"checkbox\" value=\"2422\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-2-2\">\n Option set 2 4 2 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n \n <details id=\"details-2-4-3\" class=\"dm-option-tree-details\">\n <summary class=\"dm-option-tree-details__summary dm-option-tree-details__summary-checkbox\">\n <div class=\"dm-option-tree-details__summary-text\">\n <div class=\"dm-option-tree-details__summary-text-label\">\n <div class=\"govuk-checkboxes__item govuk-checkboxes--small\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-summary\" type=\"checkbox\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-summary\">\n Option set 2 4 3\n </label>\n </div>\n </div>\n </div>\n </summary>\n <div class=\"dm-option-tree-details__text\">\n <div class=\"govuk-form-group\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3\" name=\"example\" type=\"checkbox\" value=\"2431\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3\">\n Option set 2 4 3 1\n </label>\n </div>\n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"input-example-2-4-3-2\" name=\"example\" type=\"checkbox\" value=\"2432\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"input-example-2-4-3-2\">\n Option set 2 4 3 2\n </label>\n </div>\n </div>\n</div>\n\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n </details>\n\n </div>\n\n</fieldset>"
}
]
}