govuk_publishing_components 25.4.0 → 25.5.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (27) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav-header.scss +2 -4
  3. data/app/views/govuk_publishing_components/components/_image_card.html.erb +0 -1
  4. data/app/views/govuk_publishing_components/components/_layout_for_public.html.erb +5 -2
  5. data/lib/govuk_publishing_components/version.rb +1 -1
  6. data/node_modules/govuk-frontend/govuk/all.js +61 -3
  7. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/_index.scss +1 -0
  8. data/node_modules/govuk-frontend/govuk/components/button/_index.scss +10 -4
  9. data/node_modules/govuk-frontend/govuk/components/checkboxes/_index.scss +49 -34
  10. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js +61 -3
  11. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +122 -41
  12. data/node_modules/govuk-frontend/govuk/components/checkboxes/macro-options.json +12 -0
  13. data/node_modules/govuk-frontend/govuk/components/checkboxes/template.njk +37 -39
  14. data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +22 -10
  15. data/node_modules/govuk-frontend/govuk/components/header/_index.scss +11 -7
  16. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +18 -18
  17. data/node_modules/govuk-frontend/govuk/components/header/template.njk +5 -11
  18. data/node_modules/govuk-frontend/govuk/components/input/_index.scss +4 -0
  19. data/node_modules/govuk-frontend/govuk/components/skip-link/_index.scss +2 -0
  20. data/node_modules/govuk-frontend/govuk/components/warning-text/_index.scss +0 -1
  21. data/node_modules/govuk-frontend/govuk/core/_template.scss +0 -1
  22. data/node_modules/govuk-frontend/govuk/helpers/_links.scss +6 -0
  23. data/node_modules/govuk-frontend/govuk/objects/_button-group.scss +9 -2
  24. data/node_modules/govuk-frontend/govuk/objects/_width-container.scss +4 -0
  25. data/node_modules/govuk-frontend/govuk/template.njk +1 -1
  26. data/node_modules/govuk-frontend/package.json +1 -1
  27. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: d8c8ce0242fc9e1dac0d594933ea4f0edc235315a3fbc1e021d38e000ba28326
4
- data.tar.gz: 36e25da868ef4303c553bf2bbca204a0b765ac87e4b84921984dd2c0da4217e1
3
+ metadata.gz: 75bbe4fa0f6a066c890631953c88c20877539ad38d4d3c5bd643d58fb67448e4
4
+ data.tar.gz: 14d822a1adb2e3f6ad935f922e7175a4fd2f6cfd01f3c9e1a96df442924e8f4e
5
5
  SHA512:
6
- metadata.gz: 100b3c1fc07b20fedb2acb1d4e2993b8f8bf38e8ab725b3af0d8f409ce71ba6d7c50953b76757852b59429e6b4cf5acaaea0827571279944b585cb3ecd76c3ea
7
- data.tar.gz: 21e3f30700778d5d1b021294a366c00b6c9a407232184201eac41145c415c052432ae05d35e9905721b1ee91e851761de6191ab5c56919177b31f49bc7c2de65
6
+ metadata.gz: ec49f4d9fbd7d37c802e1d7ac7e39559d4c7861483355225d9bde8d0df83b2656e77c07e3520ea52a09de678447eb3f1255dd3e3a96ddf33b07e46575058a7d5
7
+ data.tar.gz: 42721bc8eedaf12aee5c82a673201e4fb6bb4ef1d103a0a683a398b0a77e53d323ab0ba49ab21ef1dce9960b4148e10395c580f52652cd9315ab0762e1393b57
@@ -1,5 +1,7 @@
1
1
  .gem-c-step-nav-header {
2
+ @include govuk-font(24, $weight: bold);
2
3
  @include govuk-text-colour;
4
+
3
5
  position: relative;
4
6
  padding: 10px;
5
7
  background: govuk-colour("light-grey", $legacy: "grey-4");
@@ -15,7 +17,3 @@
15
17
  @include govuk-font(19, $weight: bold);
16
18
  display: block;
17
19
  }
18
-
19
- .gem-c-step-nav-header__title {
20
- @include govuk-font(24, $weight: bold, $line-height: 1);
21
- }
@@ -14,7 +14,6 @@
14
14
  heading_link_classes = %w[
15
15
  gem-c-image-card__title-link
16
16
  govuk-link
17
- govuk-link--no-underline
18
17
  ]
19
18
  heading_link_classes << brand_helper.color_class
20
19
  extra_link_classes = %w[
@@ -11,6 +11,7 @@
11
11
  omit_header ||= false
12
12
  product_name ||= nil
13
13
  show_explore_header ||= false
14
+ draft_watermark ||= false
14
15
  show_search = local_assigns.include?(:show_search) ? local_assigns[:show_search] : true
15
16
  title ||= "GOV.UK - The best place to find government services and information"
16
17
 
@@ -39,6 +40,8 @@
39
40
  # when a) there's content for the emergency or global banner *and* b) when using
40
41
  # the contrained width layout.
41
42
  blue_bar_dedupe = !full_width && global_bar.present?
43
+ body_css_classes = %w(gem-c-layout-for-public govuk-template__body)
44
+ body_css_classes << "draft" if draft_watermark
42
45
  -%>
43
46
  <!DOCTYPE html>
44
47
  <!--[if lt IE 9]><html class="lte-ie8" lang="<%= html_lang %>"><![endif]-->
@@ -72,7 +75,7 @@
72
75
 
73
76
  <%= yield :head %>
74
77
  </head>
75
- <body class="gem-c-layout-for-public govuk-template__body">
78
+ <%= tag.body class: body_css_classes do %>
76
79
  <script>
77
80
  document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
78
81
  </script>
@@ -147,5 +150,5 @@
147
150
  } %>
148
151
  <% end %>
149
152
  <%= javascript_include_tag 'application' %>
150
- </body>
153
+ <% end %>
151
154
  </html>
@@ -1,3 +1,3 @@
1
1
  module GovukPublishingComponents
2
- VERSION = "25.4.0".freeze
2
+ VERSION = "25.5.0".freeze
3
3
  end
@@ -1751,6 +1751,47 @@ Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
1751
1751
  }
1752
1752
  };
1753
1753
 
1754
+ /**
1755
+ * Uncheck other checkboxes
1756
+ *
1757
+ * Find any other checkbox inputs with the same name value, and uncheck them.
1758
+ * This is useful for when a “None of these" checkbox is checked.
1759
+ */
1760
+ Checkboxes.prototype.unCheckAllInputsExcept = function ($input) {
1761
+ var allInputsWithSameName = document.querySelectorAll('input[type="checkbox"][name="' + $input.name + '"]');
1762
+
1763
+ nodeListForEach(allInputsWithSameName, function ($inputWithSameName) {
1764
+ var hasSameFormOwner = ($input.form === $inputWithSameName.form);
1765
+ if (hasSameFormOwner && $inputWithSameName !== $input) {
1766
+ $inputWithSameName.checked = false;
1767
+ }
1768
+ });
1769
+
1770
+ this.syncAllConditionalReveals();
1771
+ };
1772
+
1773
+ /**
1774
+ * Uncheck exclusive inputs
1775
+ *
1776
+ * Find any checkbox inputs with the same name value and the 'exclusive' behaviour,
1777
+ * and uncheck them. This helps prevent someone checking both a regular checkbox and a
1778
+ * "None of these" checkbox in the same fieldset.
1779
+ */
1780
+ Checkboxes.prototype.unCheckExclusiveInputs = function ($input) {
1781
+ var allInputsWithSameNameAndExclusiveBehaviour = document.querySelectorAll(
1782
+ 'input[data-behaviour="exclusive"][type="checkbox"][name="' + $input.name + '"]'
1783
+ );
1784
+
1785
+ nodeListForEach(allInputsWithSameNameAndExclusiveBehaviour, function ($exclusiveInput) {
1786
+ var hasSameFormOwner = ($input.form === $exclusiveInput.form);
1787
+ if (hasSameFormOwner) {
1788
+ $exclusiveInput.checked = false;
1789
+ }
1790
+ });
1791
+
1792
+ this.syncAllConditionalReveals();
1793
+ };
1794
+
1754
1795
  /**
1755
1796
  * Click event handler
1756
1797
  *
@@ -1762,12 +1803,29 @@ Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
1762
1803
  Checkboxes.prototype.handleClick = function (event) {
1763
1804
  var $target = event.target;
1764
1805
 
1765
- // If a checkbox with aria-controls, handle click
1766
- var isCheckbox = $target.getAttribute('type') === 'checkbox';
1806
+ // Ignore clicks on things that aren't checkbox inputs
1807
+ if ($target.type !== 'checkbox') {
1808
+ return
1809
+ }
1810
+
1811
+ // If the checkbox conditionally-reveals some content, sync the state
1767
1812
  var hasAriaControls = $target.getAttribute('aria-controls');
1768
- if (isCheckbox && hasAriaControls) {
1813
+ if (hasAriaControls) {
1769
1814
  this.syncConditionalRevealWithInputState($target);
1770
1815
  }
1816
+
1817
+ // No further behaviour needed for unchecking
1818
+ if (!$target.checked) {
1819
+ return
1820
+ }
1821
+
1822
+ // Handle 'exclusive' checkbox behaviour (ie "None of these")
1823
+ var hasBehaviourExclusive = ($target.getAttribute('data-behaviour') === 'exclusive');
1824
+ if (hasBehaviourExclusive) {
1825
+ this.unCheckAllInputsExcept($target);
1826
+ } else {
1827
+ this.unCheckExclusiveInputs($target);
1828
+ }
1771
1829
  };
1772
1830
 
1773
1831
  (function(undefined) {
@@ -129,6 +129,7 @@
129
129
 
130
130
  .govuk-breadcrumbs__list {
131
131
  display: -webkit-box;
132
+ display: -webkit-flex;
132
133
  display: -ms-flexbox;
133
134
  display: flex;
134
135
  }
@@ -241,6 +241,8 @@
241
241
 
242
242
  display: -webkit-inline-box;
243
243
 
244
+ display: -webkit-inline-flex;
245
+
244
246
  display: -ms-inline-flexbox;
245
247
 
246
248
  display: inline-flex;
@@ -248,6 +250,8 @@
248
250
 
249
251
  -webkit-box-pack: center;
250
252
 
253
+ -webkit-justify-content: center;
254
+
251
255
  -ms-flex-pack: center;
252
256
 
253
257
  justify-content: center;
@@ -260,10 +264,12 @@
260
264
  margin-left: govuk-spacing(2);
261
265
  }
262
266
  vertical-align: middle;
263
- -ms-flex-negative: 0;
264
- flex-shrink: 0;
265
- -ms-flex-item-align: center;
266
- align-self: center;
267
+ -webkit-flex-shrink: 0;
268
+ -ms-flex-negative: 0;
269
+ flex-shrink: 0;
270
+ -webkit-align-self: center;
271
+ -ms-flex-item-align: center;
272
+ align-self: center;
267
273
  }
268
274
 
269
275
  @if $govuk-use-legacy-font {
@@ -73,47 +73,49 @@
73
73
  touch-action: manipulation;
74
74
  }
75
75
 
76
- // [ ] Check box
77
- .govuk-checkboxes__label:before {
78
- content: "";
79
- box-sizing: border-box;
80
- position: absolute;
81
- top: 0;
82
- left: 0;
83
- width: $govuk-checkboxes-size;
84
- height: $govuk-checkboxes-size;
85
- border: $govuk-border-width-form-element solid currentColor;
86
- background: transparent;
87
- }
76
+ @include govuk-not-ie8 {
77
+ // [ ] Check box
78
+ .govuk-checkboxes__label:before {
79
+ content: "";
80
+ box-sizing: border-box;
81
+ position: absolute;
82
+ top: 0;
83
+ left: 0;
84
+ width: $govuk-checkboxes-size;
85
+ height: $govuk-checkboxes-size;
86
+ border: $govuk-border-width-form-element solid currentColor;
87
+ background: transparent;
88
+ }
88
89
 
89
- // ✔ Check mark
90
- //
91
- // The check mark is a box with a border on the left and bottom side (└──),
92
- // rotated 45 degrees
93
- .govuk-checkboxes__label:after {
94
- content: "";
95
- box-sizing: border-box;
90
+ // ✔ Check mark
91
+ //
92
+ // The check mark is a box with a border on the left and bottom side (└──),
93
+ // rotated 45 degrees
94
+ .govuk-checkboxes__label:after {
95
+ content: "";
96
+ box-sizing: border-box;
96
97
 
97
- position: absolute;
98
- top: 11px;
99
- left: 9px;
100
- width: 23px;
101
- height: 12px;
98
+ position: absolute;
99
+ top: 11px;
100
+ left: 9px;
101
+ width: 23px;
102
+ height: 12px;
102
103
 
103
- -webkit-transform: rotate(-45deg);
104
+ -webkit-transform: rotate(-45deg);
104
105
 
105
- -ms-transform: rotate(-45deg);
106
+ -ms-transform: rotate(-45deg);
106
107
 
107
- transform: rotate(-45deg);
108
- border: solid;
109
- border-width: 0 0 5px 5px;
110
- // Fix bug in IE11 caused by transform rotate (-45deg).
111
- // See: alphagov/govuk_elements/issues/518
112
- border-top-color: transparent;
108
+ transform: rotate(-45deg);
109
+ border: solid;
110
+ border-width: 0 0 5px 5px;
111
+ // Fix bug in IE11 caused by transform rotate (-45deg).
112
+ // See: alphagov/govuk_elements/issues/518
113
+ border-top-color: transparent;
113
114
 
114
- opacity: 0;
115
+ opacity: 0;
115
116
 
116
- background: transparent;
117
+ background: transparent;
118
+ }
117
119
  }
118
120
 
119
121
  .govuk-checkboxes__hint {
@@ -143,6 +145,19 @@
143
145
  opacity: .5;
144
146
  }
145
147
 
148
+ // =========================================================
149
+ // Dividers ('or')
150
+ // =========================================================
151
+
152
+ .govuk-checkboxes__divider {
153
+ $govuk-divider-size: $govuk-checkboxes-size !default;
154
+ @include govuk-font($size: 19);
155
+ @include govuk-text-colour;
156
+ width: $govuk-divider-size;
157
+ margin-bottom: govuk-spacing(2);
158
+ text-align: center;
159
+ }
160
+
146
161
  // =========================================================
147
162
  // Conditional reveals
148
163
  // =========================================================
@@ -1110,6 +1110,47 @@ Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
1110
1110
  }
1111
1111
  };
1112
1112
 
1113
+ /**
1114
+ * Uncheck other checkboxes
1115
+ *
1116
+ * Find any other checkbox inputs with the same name value, and uncheck them.
1117
+ * This is useful for when a “None of these" checkbox is checked.
1118
+ */
1119
+ Checkboxes.prototype.unCheckAllInputsExcept = function ($input) {
1120
+ var allInputsWithSameName = document.querySelectorAll('input[type="checkbox"][name="' + $input.name + '"]');
1121
+
1122
+ nodeListForEach(allInputsWithSameName, function ($inputWithSameName) {
1123
+ var hasSameFormOwner = ($input.form === $inputWithSameName.form);
1124
+ if (hasSameFormOwner && $inputWithSameName !== $input) {
1125
+ $inputWithSameName.checked = false;
1126
+ }
1127
+ });
1128
+
1129
+ this.syncAllConditionalReveals();
1130
+ };
1131
+
1132
+ /**
1133
+ * Uncheck exclusive inputs
1134
+ *
1135
+ * Find any checkbox inputs with the same name value and the 'exclusive' behaviour,
1136
+ * and uncheck them. This helps prevent someone checking both a regular checkbox and a
1137
+ * "None of these" checkbox in the same fieldset.
1138
+ */
1139
+ Checkboxes.prototype.unCheckExclusiveInputs = function ($input) {
1140
+ var allInputsWithSameNameAndExclusiveBehaviour = document.querySelectorAll(
1141
+ 'input[data-behaviour="exclusive"][type="checkbox"][name="' + $input.name + '"]'
1142
+ );
1143
+
1144
+ nodeListForEach(allInputsWithSameNameAndExclusiveBehaviour, function ($exclusiveInput) {
1145
+ var hasSameFormOwner = ($input.form === $exclusiveInput.form);
1146
+ if (hasSameFormOwner) {
1147
+ $exclusiveInput.checked = false;
1148
+ }
1149
+ });
1150
+
1151
+ this.syncAllConditionalReveals();
1152
+ };
1153
+
1113
1154
  /**
1114
1155
  * Click event handler
1115
1156
  *
@@ -1121,12 +1162,29 @@ Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
1121
1162
  Checkboxes.prototype.handleClick = function (event) {
1122
1163
  var $target = event.target;
1123
1164
 
1124
- // If a checkbox with aria-controls, handle click
1125
- var isCheckbox = $target.getAttribute('type') === 'checkbox';
1165
+ // Ignore clicks on things that aren't checkbox inputs
1166
+ if ($target.type !== 'checkbox') {
1167
+ return
1168
+ }
1169
+
1170
+ // If the checkbox conditionally-reveals some content, sync the state
1126
1171
  var hasAriaControls = $target.getAttribute('aria-controls');
1127
- if (isCheckbox && hasAriaControls) {
1172
+ if (hasAriaControls) {
1128
1173
  this.syncConditionalRevealWithInputState($target);
1129
1174
  }
1175
+
1176
+ // No further behaviour needed for unchecking
1177
+ if (!$target.checked) {
1178
+ return
1179
+ }
1180
+
1181
+ // Handle 'exclusive' checkbox behaviour (ie "None of these")
1182
+ var hasBehaviourExclusive = ($target.getAttribute('data-behaviour') === 'exclusive');
1183
+ if (hasBehaviourExclusive) {
1184
+ this.unCheckAllInputsExcept($target);
1185
+ } else {
1186
+ this.unCheckExclusiveInputs($target);
1187
+ }
1130
1188
  };
1131
1189
 
1132
1190
  return Checkboxes;
@@ -20,7 +20,88 @@
20
20
  }
21
21
  ]
22
22
  },
23
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"other\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Citizen of another country\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
23
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"other\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Citizen of another country\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
24
+ "hidden": false
25
+ },
26
+ {
27
+ "name": "with divider and None",
28
+ "options": {
29
+ "name": "with-divider-and-none",
30
+ "fieldset": {
31
+ "legend": {
32
+ "text": "Which types of waste do you transport regularly?",
33
+ "classes": "govuk-fieldset__legend--l",
34
+ "isPageHeading": true
35
+ }
36
+ },
37
+ "items": [
38
+ {
39
+ "value": "animal",
40
+ "text": "Waste from animal carcasses"
41
+ },
42
+ {
43
+ "value": "mines",
44
+ "text": "Waste from mines or quarries"
45
+ },
46
+ {
47
+ "value": "farm",
48
+ "text": "Farm or agricultural waste"
49
+ },
50
+ {
51
+ "divider": "or"
52
+ },
53
+ {
54
+ "value": "none",
55
+ "text": "None of these",
56
+ "behaviour": "exclusive"
57
+ }
58
+ ]
59
+ },
60
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n Which types of waste do you transport regularly?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none\" name=\"with-divider-and-none\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-2\" name=\"with-divider-and-none\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-3\" name=\"with-divider-and-none\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n \n \n \n <div class=\"govuk-checkboxes__divider\">or</div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-5\" name=\"with-divider-and-none\" type=\"checkbox\" value=\"none\" data-behaviour=\"exclusive\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-5\">\n None of these\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
61
+ "hidden": false
62
+ },
63
+ {
64
+ "name": "with divider, None and conditional items",
65
+ "options": {
66
+ "name": "with-divider-and-none-and-conditional-items",
67
+ "fieldset": {
68
+ "legend": {
69
+ "text": "Do you have any access needs?",
70
+ "classes": "govuk-fieldset__legend--l",
71
+ "isPageHeading": true
72
+ }
73
+ },
74
+ "items": [
75
+ {
76
+ "value": "accessible-toilets",
77
+ "text": "Accessible toilets available"
78
+ },
79
+ {
80
+ "value": "braille",
81
+ "text": "Braille translation service available"
82
+ },
83
+ {
84
+ "value": "disabled-car-parking",
85
+ "text": "Disabled car parking available"
86
+ },
87
+ {
88
+ "value": "another-access-need",
89
+ "text": "Another access need",
90
+ "conditional": {
91
+ "html": "<label class=\"govuk-label\" for=\"other-access-needs\">Other access needs</label>\n<textarea class=\"govuk-textarea govuk-!-width-one-third\" name=\"other-access-needs\" id=\"other-access-needs\"></textarea>\n"
92
+ }
93
+ },
94
+ {
95
+ "divider": "or"
96
+ },
97
+ {
98
+ "value": "none",
99
+ "text": "None of these",
100
+ "behaviour": "exclusive"
101
+ }
102
+ ]
103
+ },
104
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n Do you have any access needs?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-and-conditional-items\" name=\"with-divider-and-none-and-conditional-items\" type=\"checkbox\" value=\"accessible-toilets\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-and-conditional-items\">\n Accessible toilets available\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-and-conditional-items-2\" name=\"with-divider-and-none-and-conditional-items\" type=\"checkbox\" value=\"braille\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-and-conditional-items-2\">\n Braille translation service available\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-and-conditional-items-3\" name=\"with-divider-and-none-and-conditional-items\" type=\"checkbox\" value=\"disabled-car-parking\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-and-conditional-items-3\">\n Disabled car parking available\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-and-conditional-items-4\" name=\"with-divider-and-none-and-conditional-items\" type=\"checkbox\" value=\"another-access-need\" data-aria-controls=\"conditional-with-divider-and-none-and-conditional-items-4\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-and-conditional-items-4\">\n Another access need\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-with-divider-and-none-and-conditional-items-4\">\n <label class=\"govuk-label\" for=\"other-access-needs\">Other access needs</label>\n<textarea class=\"govuk-textarea govuk-!-width-one-third\" name=\"other-access-needs\" id=\"other-access-needs\"></textarea>\n\n </div>\n \n \n \n \n \n \n <div class=\"govuk-checkboxes__divider\">or</div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-divider-and-none-and-conditional-items-6\" name=\"with-divider-and-none-and-conditional-items\" type=\"checkbox\" value=\"none\" data-behaviour=\"exclusive\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-divider-and-none-and-conditional-items-6\">\n None of these\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
24
105
  "hidden": false
25
106
  },
26
107
  {
@@ -55,7 +136,7 @@
55
136
  }
56
137
  ]
57
138
  },
58
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"with-id-and-name-hint\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"with-id-and-name-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"item_british\" name=\"british\" type=\"checkbox\" value=\"yes\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"item_british\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"item_irish\" name=\"irish\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"item_irish\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-id-and-name-3\" name=\"custom-name-scottish\" type=\"checkbox\" value=\"scottish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-id-and-name-3\">\n Scottish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
139
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"with-id-and-name-hint\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"with-id-and-name-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"item_british\" name=\"british\" type=\"checkbox\" value=\"yes\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"item_british\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"item_irish\" name=\"irish\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"item_irish\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"with-id-and-name-3\" name=\"custom-name-scottish\" type=\"checkbox\" value=\"scottish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"with-id-and-name-3\">\n Scottish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
59
140
  "hidden": false
60
141
  },
61
142
  {
@@ -89,7 +170,7 @@
89
170
  }
90
171
  ]
91
172
  },
92
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"government-gateway\" name=\"gateway\" type=\"checkbox\" value=\"gov-gateway\" aria-describedby=\"government-gateway-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"government-gateway\">\n Sign in with Government Gateway\n </label>\n \n <div id=\"government-gateway-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n You&#39;ll have a user ID if you&#39;ve registered for Self Assessment or filed a tax return online before.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"govuk-verify\" name=\"verify\" type=\"checkbox\" value=\"gov-verify\" aria-describedby=\"govuk-verify-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"govuk-verify\">\n Sign in with GOV.UK Verify\n </label>\n \n <div id=\"govuk-verify-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n You&#39;ll have an account if you&#39;ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
173
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"government-gateway\" name=\"gateway\" type=\"checkbox\" value=\"gov-gateway\" aria-describedby=\"government-gateway-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"government-gateway\">\n Sign in with Government Gateway\n </label>\n \n <div id=\"government-gateway-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n You&#39;ll have a user ID if you&#39;ve registered for Self Assessment or filed a tax return online before.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"govuk-verify\" name=\"verify\" type=\"checkbox\" value=\"gov-verify\" aria-describedby=\"govuk-verify-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"govuk-verify\">\n Sign in with GOV.UK Verify\n </label>\n \n <div id=\"govuk-verify-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n You&#39;ll have an account if you&#39;ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
93
174
  "hidden": false
94
175
  },
95
176
  {
@@ -112,7 +193,7 @@
112
193
  }
113
194
  ]
114
195
  },
115
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours\" name=\"colours\" type=\"checkbox\" value=\"red\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-2\" name=\"colours\" type=\"checkbox\" value=\"green\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-3\" name=\"colours\" type=\"checkbox\" value=\"blue\" disabled>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-3\">\n Blue\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
196
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours\" name=\"colours\" type=\"checkbox\" value=\"red\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-2\" name=\"colours\" type=\"checkbox\" value=\"green\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-3\" name=\"colours\" type=\"checkbox\" value=\"blue\" disabled>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-3\">\n Blue\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
116
197
  "hidden": false
117
198
  },
118
199
  {
@@ -144,7 +225,7 @@
144
225
  }
145
226
  ]
146
227
  },
147
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n Which types of waste do you transport regularly?\n </h1>\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Select all that apply\n </div>\n\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
228
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n Which types of waste do you transport regularly?\n </h1>\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Select all that apply\n </div>\n\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
148
229
  "hidden": false
149
230
  },
150
231
  {
@@ -178,7 +259,7 @@
178
259
  }
179
260
  ]
180
261
  },
181
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Select all that apply\n </div>\n\n\n \n \n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select which types of waste you transport regularly\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
262
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Select all that apply\n </div>\n\n\n \n \n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select which types of waste you transport regularly\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
182
263
  "hidden": false
183
264
  },
184
265
  {
@@ -200,7 +281,7 @@
200
281
  }
201
282
  ]
202
283
  },
203
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours\" name=\"colours\" type=\"checkbox\" value=\"red\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-2\" name=\"colours\" type=\"checkbox\" value=\"green\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-3\" name=\"colours\" type=\"checkbox\" value=\"blue\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-3\">\n Blue\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
284
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours\" name=\"colours\" type=\"checkbox\" value=\"red\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-2\" name=\"colours\" type=\"checkbox\" value=\"green\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"colours-3\" name=\"colours\" type=\"checkbox\" value=\"blue\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"colours-3\">\n Blue\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
204
285
  "hidden": false
205
286
  },
206
287
  {
@@ -217,7 +298,7 @@
217
298
  }
218
299
  ]
219
300
  },
220
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c\" name=\"t-and-c\" type=\"checkbox\" value=\"yes\" aria-describedby=\"t-and-c-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c\">\n I agree to the terms and conditions\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
301
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c\" name=\"t-and-c\" type=\"checkbox\" value=\"yes\" aria-describedby=\"t-and-c-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c\">\n I agree to the terms and conditions\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
221
302
  "hidden": false
222
303
  },
223
304
  {
@@ -237,7 +318,7 @@
237
318
  }
238
319
  ]
239
320
  },
240
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-with-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c-with-hint\" name=\"t-and-c-with-hint\" type=\"checkbox\" value=\"yes\" aria-describedby=\"t-and-c-with-hint-error t-and-c-with-hint-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c-with-hint\">\n I agree to the terms and conditions\n </label>\n \n <div id=\"t-and-c-with-hint-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Go on, you know you want to!\n </div>\n \n </div>\n \n \n \n </div>\n\n</div>",
321
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-with-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c-with-hint\" name=\"t-and-c-with-hint\" type=\"checkbox\" value=\"yes\" aria-describedby=\"t-and-c-with-hint-error t-and-c-with-hint-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c-with-hint\">\n I agree to the terms and conditions\n </label>\n \n <div id=\"t-and-c-with-hint-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Go on, you know you want to!\n </div>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
241
322
  "hidden": false
242
323
  },
243
324
  {
@@ -267,7 +348,7 @@
267
348
  }
268
349
  ]
269
350
  },
270
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"nationality-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"nationality-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"other\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Citizen of another country\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
351
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"nationality-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"nationality-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"other\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Citizen of another country\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
271
352
  "hidden": false
272
353
  },
273
354
  {
@@ -297,7 +378,7 @@
297
378
  }
298
379
  ]
299
380
  },
300
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
381
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
301
382
  "hidden": false
302
383
  },
303
384
  {
@@ -336,7 +417,7 @@
336
417
  }
337
418
  ]
338
419
  },
339
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\" aria-describedby=\"waste-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n <div id=\"waste-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\" aria-describedby=\"waste-2-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n <div id=\"waste-2-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\" aria-describedby=\"waste-3-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n <div id=\"waste-3-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
420
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which types of waste do you transport regularly?\n \n </legend>\n \n\n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"animal\" aria-describedby=\"waste-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Waste from animal carcasses\n </label>\n \n <div id=\"waste-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"mines\" aria-describedby=\"waste-2-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Waste from mines or quarries\n </label>\n \n <div id=\"waste-2-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"farm\" aria-describedby=\"waste-3-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Farm or agricultural waste\n </label>\n \n <div id=\"waste-3-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
340
421
  "hidden": false
341
422
  },
342
423
  {
@@ -369,7 +450,7 @@
369
450
  }
370
451
  ]
371
452
  },
372
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Maecenas faucibus mollis interdum?\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n\n\n \n \n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"nullam\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"aenean\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"fusce\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
453
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Maecenas faucibus mollis interdum?\n \n </legend>\n \n\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n\n\n \n \n <span id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste\" name=\"waste\" type=\"checkbox\" value=\"nullam\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-2\" name=\"waste\" type=\"checkbox\" value=\"aenean\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"waste-3\" name=\"waste\" type=\"checkbox\" value=\"fusce\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"waste-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
373
454
  "hidden": false
374
455
  },
375
456
  {
@@ -406,7 +487,7 @@
406
487
  }
407
488
  ]
408
489
  },
409
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\" data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted\" name=\"with-conditional-items\" type=\"checkbox\" value=\"email\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-2\" name=\"with-conditional-items\" type=\"checkbox\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-3\" name=\"with-conditional-items\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
490
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted\" name=\"with-conditional-items\" type=\"checkbox\" value=\"email\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-2\" name=\"with-conditional-items\" type=\"checkbox\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-3\" name=\"with-conditional-items\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
410
491
  "hidden": false
411
492
  },
412
493
  {
@@ -444,7 +525,7 @@
444
525
  }
445
526
  ]
446
527
  },
447
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\" data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"email\" checked data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
528
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"email\" checked data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
448
529
  "hidden": false
449
530
  },
450
531
  {
@@ -485,7 +566,7 @@
485
566
  }
486
567
  ]
487
568
  },
488
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\" data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"email\" data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"phone\" checked data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<span id=\"contact-phone-error\" class=\"govuk-error-message\">Problem with input</span>\n<input class=\"govuk-input govuk-input--error govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\" aria-describedby=\"contact-phone-error\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
569
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"email\" data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"phone\" checked data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<span id=\"contact-phone-error\" class=\"govuk-error-message\">Problem with input</span>\n<input class=\"govuk-input govuk-input--error govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\" aria-describedby=\"contact-phone-error\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"checkbox\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n\n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
489
570
  "hidden": false
490
571
  },
491
572
  {
@@ -514,7 +595,7 @@
514
595
  }
515
596
  ]
516
597
  },
517
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
598
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
518
599
  "hidden": false
519
600
  },
520
601
  {
@@ -543,7 +624,7 @@
543
624
  }
544
625
  ]
545
626
  },
546
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"nullam\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"aenean\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"fusce\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
627
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"nullam\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"aenean\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"fusce\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
547
628
  "hidden": false
548
629
  },
549
630
  {
@@ -575,7 +656,7 @@
575
656
  }
576
657
  ]
577
658
  },
578
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"nationality-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <span id=\"nationality-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select a thing\n </span>\n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
659
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"nationality-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <span id=\"nationality-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select a thing\n </span>\n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
579
660
  "hidden": false
580
661
  },
581
662
  {
@@ -607,7 +688,7 @@
607
688
  }
608
689
  ]
609
690
  },
610
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\" aria-describedby=\"nationality-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n <div id=\"nationality-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n hint for a thing\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
691
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\" aria-describedby=\"nationality-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n <div id=\"nationality-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n hint for a thing\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
611
692
  "hidden": false
612
693
  },
613
694
  {
@@ -637,7 +718,7 @@
637
718
  }
638
719
  ]
639
720
  },
640
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\" disabled>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
721
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Filter by\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"nationality\" type=\"checkbox\" value=\"a\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n a thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"nationality\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-3\" name=\"nationality\" type=\"checkbox\" value=\"c\" disabled>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-3\">\n this thing\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
641
722
  "hidden": false
642
723
  },
643
724
  {
@@ -665,7 +746,7 @@
665
746
  }
666
747
  ]
667
748
  },
668
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted\" name=\"how-contacted\" type=\"checkbox\" value=\"a\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted\">\n a thing\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted\">\n <label class=\"govuk-label\" for=\"context-email\">Foo</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-2\" name=\"how-contacted\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-2\">\n another thing\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
749
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes govuk-checkboxes--small\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted\" name=\"how-contacted\" type=\"checkbox\" value=\"a\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted\">\n a thing\n </label>\n \n </div>\n \n <div class=\"govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden\" id=\"conditional-how-contacted\">\n <label class=\"govuk-label\" for=\"context-email\">Foo</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"how-contacted-2\" name=\"how-contacted\" type=\"checkbox\" value=\"b\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"how-contacted-2\">\n another thing\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
669
750
  "hidden": false
670
751
  },
671
752
  {
@@ -684,7 +765,7 @@
684
765
  }
685
766
  ]
686
767
  },
687
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
768
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"nationality-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"nationality-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
688
769
  "hidden": true
689
770
  },
690
771
  {
@@ -705,7 +786,7 @@
705
786
  }
706
787
  ]
707
788
  },
708
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-5\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-5\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
789
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-5\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-5\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
709
790
  "hidden": true
710
791
  },
711
792
  {
@@ -724,7 +805,7 @@
724
805
  }
725
806
  ]
726
807
  },
727
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes app-checkboxes--custom-modifier\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
808
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes app-checkboxes--custom-modifier\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
728
809
  "hidden": true
729
810
  },
730
811
  {
@@ -748,7 +829,7 @@
748
829
  "text": "If you have dual nationality, select all options that are relevant to you."
749
830
  }
750
831
  },
751
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-name-hint\">\n \n\n <div id=\"example-name-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
832
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-name-hint\">\n \n\n <div id=\"example-name-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
752
833
  "hidden": true
753
834
  },
754
835
  {
@@ -770,7 +851,7 @@
770
851
  }
771
852
  ]
772
853
  },
773
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
854
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\" data-attribute=\"value\" data-second-attribute=\"second-value\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
774
855
  "hidden": true
775
856
  },
776
857
  {
@@ -794,7 +875,7 @@
794
875
  }
795
876
  ]
796
877
  },
797
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-3\" name=\"example-name\" type=\"checkbox\" value=\"3\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-3\">\n Option 3\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
878
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-3\" name=\"example-name\" type=\"checkbox\" value=\"3\" checked>\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-3\">\n Option 3\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
798
879
  "hidden": true
799
880
  },
800
881
  {
@@ -820,7 +901,7 @@
820
901
  }
821
902
  ]
822
903
  },
823
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\" data-attribute=\"ABC\" data-second-attribute=\"DEF\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\" data-attribute=\"GHI\" data-second-attribute=\"JKL\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
904
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\" data-attribute=\"ABC\" data-second-attribute=\"DEF\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n Option 1\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"2\" data-attribute=\"GHI\" data-second-attribute=\"JKL\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Option 2\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
824
905
  "hidden": true
825
906
  },
826
907
  {
@@ -837,7 +918,7 @@
837
918
  }
838
919
  ]
839
920
  },
840
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-conditional\" name=\"example-conditional\" type=\"checkbox\" value=\"foo\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-conditional\">\n Foo\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
921
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-conditional\" name=\"example-conditional\" type=\"checkbox\" value=\"foo\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-conditional\">\n Foo\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
841
922
  "hidden": true
842
923
  },
843
924
  {
@@ -854,7 +935,7 @@
854
935
  }
855
936
  ]
856
937
  },
857
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-label-classes\" name=\"example-label-classes\" type=\"checkbox\" value=\"yes\">\n <label class=\"govuk-label govuk-checkboxes__label bold\" for=\"example-label-classes\">\n Yes\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
938
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-label-classes\" name=\"example-label-classes\" type=\"checkbox\" value=\"yes\">\n <label class=\"govuk-label govuk-checkboxes__label bold\" for=\"example-label-classes\">\n Yes\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
858
939
  "hidden": true
859
940
  },
860
941
  {
@@ -884,7 +965,7 @@
884
965
  }
885
966
  ]
886
967
  },
887
- "html": "<div class=\"govuk-form-group\">\n\n <div id=\"example-multiple-hints-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"british\" aria-describedby=\"example-multiple-hints-hint example-multiple-hints-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-multiple-hints\">\n British\n </label>\n \n <div id=\"example-multiple-hints-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Hint for british option here\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints-2\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"irish\" aria-describedby=\"example-multiple-hints-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-multiple-hints-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints-3\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"other\" aria-describedby=\"example-multiple-hints-hint example-multiple-hints-3-item-hint\">\n \n \n <div id=\"example-multiple-hints-3-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Hint for other option here\n </div>\n \n </div>\n \n \n \n </div>\n\n</div>",
968
+ "html": "<div class=\"govuk-form-group\">\n\n <div id=\"example-multiple-hints-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"british\" aria-describedby=\"example-multiple-hints-hint example-multiple-hints-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-multiple-hints\">\n British\n </label>\n \n <div id=\"example-multiple-hints-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Hint for british option here\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints-2\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"irish\" aria-describedby=\"example-multiple-hints-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-multiple-hints-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-multiple-hints-3\" name=\"example-multiple-hints\" type=\"checkbox\" value=\"other\" aria-describedby=\"example-multiple-hints-hint example-multiple-hints-3-item-hint\">\n \n \n <div id=\"example-multiple-hints-3-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Hint for other option here\n </div>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
888
969
  "hidden": true
889
970
  },
890
971
  {
@@ -913,7 +994,7 @@
913
994
  "text": "If you have dual nationality, select all options that are relevant to you."
914
995
  }
915
996
  },
916
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"example-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n \n \n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
997
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"example-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n \n \n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
917
998
  "hidden": true
918
999
  },
919
1000
  {
@@ -943,7 +1024,7 @@
943
1024
  }
944
1025
  ]
945
1026
  },
946
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-hint example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"example-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n \n \n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1027
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-hint example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <div id=\"example-hint\" class=\"govuk-hint\">\n If you have dual nationality, select all options that are relevant to you.\n </div>\n\n\n \n \n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
947
1028
  "hidden": true
948
1029
  },
949
1030
  {
@@ -963,7 +1044,7 @@
963
1044
  }
964
1045
  ]
965
1046
  },
966
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" data-attribute=\"value\" data-second-attribute=\"second-value\" for=\"example-name\">\n <b>Option 1</b>\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
1047
+ "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"1\">\n <label class=\"govuk-label govuk-checkboxes__label\" data-attribute=\"value\" data-second-attribute=\"second-value\" for=\"example-name\">\n <b>Option 1</b>\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
967
1048
  "hidden": true
968
1049
  },
969
1050
  {
@@ -994,7 +1075,7 @@
994
1075
  }
995
1076
  ]
996
1077
  },
997
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-name-error\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"example-name-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Irish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1078
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-name-error\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"example-name-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
998
1079
  "hidden": true
999
1080
  },
1000
1081
  {
@@ -1017,7 +1098,7 @@
1017
1098
  }
1018
1099
  ]
1019
1100
  },
1020
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your <b>nationality</b>?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Irish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1101
+ "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your <b>nationality</b>?\n \n </legend>\n \n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name\" name=\"example-name\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-name-2\" name=\"example-name\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-name-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1021
1102
  "hidden": true
1022
1103
  },
1023
1104
  {
@@ -1035,7 +1116,7 @@
1035
1116
  }
1036
1117
  ]
1037
1118
  },
1038
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c\" name=\"t-and-c\" type=\"checkbox\" value=\"yes\" aria-describedby=\"some-id t-and-c-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c\">\n I agree to the terms and conditions\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
1119
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c\" name=\"t-and-c\" type=\"checkbox\" value=\"yes\" aria-describedby=\"some-id t-and-c-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c\">\n I agree to the terms and conditions\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
1039
1120
  "hidden": true
1040
1121
  },
1041
1122
  {
@@ -1056,7 +1137,7 @@
1056
1137
  }
1057
1138
  ]
1058
1139
  },
1059
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-with-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c-with-hint\" name=\"t-and-c-with-hint\" type=\"checkbox\" value=\"yes\" aria-describedby=\"some-id t-and-c-with-hint-error t-and-c-with-hint-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c-with-hint\">\n I agree to the terms and conditions\n </label>\n \n <div id=\"t-and-c-with-hint-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Go on, you know you want to!\n </div>\n \n </div>\n \n \n \n </div>\n\n</div>",
1140
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"t-and-c-with-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please accept the terms and conditions\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"t-and-c-with-hint\" name=\"t-and-c-with-hint\" type=\"checkbox\" value=\"yes\" aria-describedby=\"some-id t-and-c-with-hint-error t-and-c-with-hint-item-hint\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"t-and-c-with-hint\">\n I agree to the terms and conditions\n </label>\n \n <div id=\"t-and-c-with-hint-item-hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n Go on, you know you want to!\n </div>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
1060
1141
  "hidden": true
1061
1142
  },
1062
1143
  {
@@ -1074,7 +1155,7 @@
1074
1155
  }
1075
1156
  ]
1076
1157
  },
1077
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"id-prefix-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"id-prefix\" name=\"name-of-checkboxes\" type=\"checkbox\" value=\"animal\" aria-describedby=\"id-prefix-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"id-prefix\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n </div>\n\n</div>",
1158
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <span id=\"id-prefix-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"id-prefix\" name=\"name-of-checkboxes\" type=\"checkbox\" value=\"animal\" aria-describedby=\"id-prefix-error\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"id-prefix\">\n Waste from animal carcasses\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>",
1078
1159
  "hidden": true
1079
1160
  },
1080
1161
  {
@@ -1101,7 +1182,7 @@
1101
1182
  }
1102
1183
  ]
1103
1184
  },
1104
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1185
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your nationality?\n \n </legend>\n \n\n <span id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </span>\n\n <div class=\"govuk-checkboxes\"\n data-module=\"govuk-checkboxes\">\n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example\" name=\"example\" type=\"checkbox\" value=\"british\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example\">\n British\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-checkboxes__item\">\n <input class=\"govuk-checkboxes__input\" id=\"example-2\" name=\"example\" type=\"checkbox\" value=\"irish\">\n <label class=\"govuk-label govuk-checkboxes__label\" for=\"example-2\">\n Irish\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>",
1105
1186
  "hidden": true
1106
1187
  }
1107
1188
  ]