govuk_publishing_components 35.3.3 → 35.3.5

Sign up to get free protection for your applications and to get access to all the features.
Files changed (272) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js +4 -0
  3. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/init-ga4.js +1 -1
  4. data/app/assets/stylesheets/component_guide/application.scss +37 -1
  5. data/app/assets/stylesheets/govuk_publishing_components/components/_metadata.scss +10 -6
  6. data/app/assets/stylesheets/govuk_publishing_components/components/_organisation-logo.scss +2 -2
  7. data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_brand-colours.scss +0 -24
  8. data/app/views/govuk_publishing_components/component_guide/example.html.erb +1 -1
  9. data/app/views/govuk_publishing_components/component_guide/preview.html.erb +1 -1
  10. data/app/views/govuk_publishing_components/component_guide/show.html.erb +1 -1
  11. data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +2 -2
  12. data/app/views/govuk_publishing_components/components/_metadata.html.erb +1 -1
  13. data/app/views/govuk_publishing_components/components/_related_navigation.html.erb +3 -1
  14. data/app/views/govuk_publishing_components/components/_share_links.html.erb +6 -2
  15. data/app/views/govuk_publishing_components/components/_step_by_step_nav_related.html.erb +1 -1
  16. data/app/views/govuk_publishing_components/components/docs/metadata.yml +1 -3
  17. data/app/views/govuk_publishing_components/components/docs/organisation_logo.yml +5 -5
  18. data/app/views/govuk_publishing_components/components/docs/step_by_step_nav_related.yml +1 -0
  19. data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb +1 -1
  20. data/app/views/layouts/govuk_publishing_components/application.html.erb +1 -0
  21. data/config/locales/en.yml +2 -2
  22. data/lib/govuk_publishing_components/app_helpers/asset_helper.rb +4 -0
  23. data/lib/govuk_publishing_components/presenters/breadcrumbs_helper.rb +1 -1
  24. data/lib/govuk_publishing_components/version.rb +1 -1
  25. data/node_modules/axe-core/axe.d.ts +77 -6
  26. data/node_modules/axe-core/axe.js +955 -600
  27. data/node_modules/axe-core/axe.min.js +2 -2
  28. data/node_modules/axe-core/locales/_template.json +6 -6
  29. data/node_modules/axe-core/locales/ja.json +91 -11
  30. data/node_modules/axe-core/package.json +5 -5
  31. data/node_modules/axe-core/sri-history.json +4 -0
  32. data/node_modules/govuk-frontend/README.md +4 -5
  33. data/node_modules/govuk-frontend/govuk/all-ie8.scss +8 -0
  34. data/node_modules/govuk-frontend/govuk/all.js +738 -258
  35. data/node_modules/govuk-frontend/govuk/all.js.map +1 -1
  36. data/node_modules/govuk-frontend/govuk/common/closest-attribute-value.js +11 -7
  37. data/node_modules/govuk-frontend/govuk/common/closest-attribute-value.js.map +1 -1
  38. data/node_modules/govuk-frontend/govuk/common/govuk-frontend-version.js +17 -0
  39. data/node_modules/govuk-frontend/govuk/common/govuk-frontend-version.js.map +1 -0
  40. data/node_modules/govuk-frontend/govuk/common/index.js +16 -4
  41. data/node_modules/govuk-frontend/govuk/common/index.js.map +1 -1
  42. data/node_modules/govuk-frontend/govuk/common/normalise-dataset.js +20 -10
  43. data/node_modules/govuk-frontend/govuk/common/normalise-dataset.js.map +1 -1
  44. data/node_modules/govuk-frontend/govuk/common.js +16 -4
  45. data/node_modules/govuk-frontend/govuk/common.js.map +1 -1
  46. data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +3 -3
  47. data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js +234 -86
  48. data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js.map +1 -1
  49. data/node_modules/govuk-frontend/govuk/components/accordion/fixtures.json +32 -13
  50. data/node_modules/govuk-frontend/govuk/components/accordion/macro-options.json +8 -2
  51. data/node_modules/govuk-frontend/govuk/components/accordion/template.njk +1 -0
  52. data/node_modules/govuk-frontend/govuk/components/back-link/_index.scss +1 -1
  53. data/node_modules/govuk-frontend/govuk/components/back-link/fixtures.json +1 -1
  54. data/node_modules/govuk-frontend/govuk/components/back-link/macro-options.json +1 -1
  55. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/_index.scss +1 -1
  56. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/fixtures.json +12 -12
  57. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/macro-options.json +1 -1
  58. data/node_modules/govuk-frontend/govuk/components/button/_index.scss +8 -6
  59. data/node_modules/govuk-frontend/govuk/components/button/button.js +54 -19
  60. data/node_modules/govuk-frontend/govuk/components/button/button.js.map +1 -1
  61. data/node_modules/govuk-frontend/govuk/components/button/fixtures.json +11 -1
  62. data/node_modules/govuk-frontend/govuk/components/button/macro-options.json +7 -1
  63. data/node_modules/govuk-frontend/govuk/components/button/template.njk +1 -1
  64. data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js +170 -76
  65. data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js.map +1 -1
  66. data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +24 -24
  67. data/node_modules/govuk-frontend/govuk/components/character-count/macro-options.json +3 -3
  68. data/node_modules/govuk-frontend/govuk/components/checkboxes/_index.scss +6 -6
  69. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js +75 -24
  70. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js.map +1 -1
  71. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +47 -47
  72. data/node_modules/govuk-frontend/govuk/components/checkboxes/macro-options.json +1 -1
  73. data/node_modules/govuk-frontend/govuk/components/checkboxes/template.njk +3 -3
  74. data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +24 -24
  75. data/node_modules/govuk-frontend/govuk/components/cookie-banner/macro-options.json +1 -1
  76. data/node_modules/govuk-frontend/govuk/components/date-input/fixtures.json +26 -26
  77. data/node_modules/govuk-frontend/govuk/components/date-input/macro-options.json +1 -1
  78. data/node_modules/govuk-frontend/govuk/components/date-input/template.njk +1 -1
  79. data/node_modules/govuk-frontend/govuk/components/details/details.js +39 -13
  80. data/node_modules/govuk-frontend/govuk/components/details/details.js.map +1 -1
  81. data/node_modules/govuk-frontend/govuk/components/details/fixtures.json +1 -1
  82. data/node_modules/govuk-frontend/govuk/components/details/macro-options.json +1 -1
  83. data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json +10 -10
  84. data/node_modules/govuk-frontend/govuk/components/error-message/macro-options.json +1 -1
  85. data/node_modules/govuk-frontend/govuk/components/error-summary/error-summary.js +67 -27
  86. data/node_modules/govuk-frontend/govuk/components/error-summary/error-summary.js.map +1 -1
  87. data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json +19 -19
  88. data/node_modules/govuk-frontend/govuk/components/error-summary/macro-options.json +1 -1
  89. data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json +19 -19
  90. data/node_modules/govuk-frontend/govuk/components/fieldset/macro-options.json +1 -1
  91. data/node_modules/govuk-frontend/govuk/components/file-upload/_index.scss +6 -1
  92. data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +14 -14
  93. data/node_modules/govuk-frontend/govuk/components/file-upload/macro-options.json +7 -1
  94. data/node_modules/govuk-frontend/govuk/components/file-upload/template.njk +2 -1
  95. data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +0 -7
  96. data/node_modules/govuk-frontend/govuk/components/footer/fixtures.json +24 -24
  97. data/node_modules/govuk-frontend/govuk/components/footer/macro-options.json +1 -1
  98. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +22 -22
  99. data/node_modules/govuk-frontend/govuk/components/header/header.js +46 -14
  100. data/node_modules/govuk-frontend/govuk/components/header/header.js.map +1 -1
  101. data/node_modules/govuk-frontend/govuk/components/header/macro-options.json +1 -1
  102. data/node_modules/govuk-frontend/govuk/components/header/template.njk +1 -1
  103. data/node_modules/govuk-frontend/govuk/components/hint/fixtures.json +1 -1
  104. data/node_modules/govuk-frontend/govuk/components/hint/macro-options.json +1 -1
  105. data/node_modules/govuk-frontend/govuk/components/input/_index.scss +15 -3
  106. data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +54 -41
  107. data/node_modules/govuk-frontend/govuk/components/input/macro-options.json +7 -1
  108. data/node_modules/govuk-frontend/govuk/components/input/template.njk +2 -1
  109. data/node_modules/govuk-frontend/govuk/components/inset-text/fixtures.json +1 -1
  110. data/node_modules/govuk-frontend/govuk/components/inset-text/macro-options.json +1 -1
  111. data/node_modules/govuk-frontend/govuk/components/label/fixtures.json +6 -6
  112. data/node_modules/govuk-frontend/govuk/components/label/macro-options.json +1 -1
  113. data/node_modules/govuk-frontend/govuk/components/notification-banner/fixtures.json +1 -1
  114. data/node_modules/govuk-frontend/govuk/components/notification-banner/macro-options.json +1 -1
  115. data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js +49 -22
  116. data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js.map +1 -1
  117. data/node_modules/govuk-frontend/govuk/components/pagination/fixtures.json +16 -16
  118. data/node_modules/govuk-frontend/govuk/components/pagination/macro-options.json +1 -1
  119. data/node_modules/govuk-frontend/govuk/components/panel/fixtures.json +10 -10
  120. data/node_modules/govuk-frontend/govuk/components/panel/macro-options.json +1 -1
  121. data/node_modules/govuk-frontend/govuk/components/phase-banner/fixtures.json +1 -1
  122. data/node_modules/govuk-frontend/govuk/components/phase-banner/macro-options.json +1 -1
  123. data/node_modules/govuk-frontend/govuk/components/radios/_index.scss +5 -5
  124. data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +46 -46
  125. data/node_modules/govuk-frontend/govuk/components/radios/macro-options.json +1 -1
  126. data/node_modules/govuk-frontend/govuk/components/radios/radios.js +65 -22
  127. data/node_modules/govuk-frontend/govuk/components/radios/radios.js.map +1 -1
  128. data/node_modules/govuk-frontend/govuk/components/radios/template.njk +2 -2
  129. data/node_modules/govuk-frontend/govuk/components/select/_index.scss +7 -1
  130. data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +19 -20
  131. data/node_modules/govuk-frontend/govuk/components/select/macro-options.json +7 -1
  132. data/node_modules/govuk-frontend/govuk/components/select/template.njk +5 -2
  133. data/node_modules/govuk-frontend/govuk/components/skip-link/fixtures.json +1 -1
  134. data/node_modules/govuk-frontend/govuk/components/skip-link/macro-options.json +1 -1
  135. data/node_modules/govuk-frontend/govuk/components/skip-link/skip-link.js +41 -13
  136. data/node_modules/govuk-frontend/govuk/components/skip-link/skip-link.js.map +1 -1
  137. data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json +34 -34
  138. data/node_modules/govuk-frontend/govuk/components/summary-list/macro-options.json +1 -1
  139. data/node_modules/govuk-frontend/govuk/components/table/fixtures.json +21 -21
  140. data/node_modules/govuk-frontend/govuk/components/table/macro-options.json +1 -1
  141. data/node_modules/govuk-frontend/govuk/components/tabs/fixtures.json +15 -15
  142. data/node_modules/govuk-frontend/govuk/components/tabs/macro-options.json +1 -1
  143. data/node_modules/govuk-frontend/govuk/components/tabs/tabs.js +178 -60
  144. data/node_modules/govuk-frontend/govuk/components/tabs/tabs.js.map +1 -1
  145. data/node_modules/govuk-frontend/govuk/components/tabs/template.njk +1 -1
  146. data/node_modules/govuk-frontend/govuk/components/tag/_index.scss +18 -18
  147. data/node_modules/govuk-frontend/govuk/components/tag/fixtures.json +1 -1
  148. data/node_modules/govuk-frontend/govuk/components/tag/macro-options.json +1 -1
  149. data/node_modules/govuk-frontend/govuk/components/textarea/_index.scss +8 -1
  150. data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +18 -18
  151. data/node_modules/govuk-frontend/govuk/components/textarea/macro-options.json +7 -1
  152. data/node_modules/govuk-frontend/govuk/components/textarea/template.njk +2 -1
  153. data/node_modules/govuk-frontend/govuk/components/warning-text/fixtures.json +9 -5
  154. data/node_modules/govuk-frontend/govuk/components/warning-text/macro-options.json +3 -3
  155. data/node_modules/govuk-frontend/govuk/components/warning-text/template.njk +1 -1
  156. data/node_modules/govuk-frontend/govuk/core/_all.scss +1 -0
  157. data/node_modules/govuk-frontend/govuk/core/_govuk-frontend-version.scss +5 -0
  158. data/node_modules/govuk-frontend/govuk/helpers/_colour.scss +5 -2
  159. data/node_modules/govuk-frontend/govuk/helpers/_focused.scss +1 -1
  160. data/node_modules/govuk-frontend/govuk/helpers/_font-faces.scss +1 -1
  161. data/node_modules/govuk-frontend/govuk/i18n.js +38 -30
  162. data/node_modules/govuk-frontend/govuk/i18n.js.map +1 -1
  163. data/node_modules/govuk-frontend/govuk/macros/i18n.njk +12 -11
  164. data/node_modules/govuk-frontend/govuk/objects/_width-container.scss +1 -1
  165. data/node_modules/govuk-frontend/govuk/settings/_colours-organisations.scss +4 -0
  166. data/node_modules/govuk-frontend/govuk/settings/_ie8.scss +16 -0
  167. data/node_modules/govuk-frontend/govuk/settings/_links.scss +5 -1
  168. data/node_modules/govuk-frontend/govuk/tools/_ie8.scss +38 -2
  169. data/node_modules/govuk-frontend/govuk/vendor/polyfills/DOMTokenList.js +2 -1
  170. data/node_modules/govuk-frontend/govuk/vendor/polyfills/DOMTokenList.js.map +1 -1
  171. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Date/now.js +2 -1
  172. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Date/now.js.map +1 -1
  173. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Document.js +2 -1
  174. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Document.js.map +1 -1
  175. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/classList.js +10 -3
  176. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/classList.js.map +1 -1
  177. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/closest.js +4 -1
  178. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/closest.js.map +1 -1
  179. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/dataset.js +13 -7
  180. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/dataset.js.map +1 -1
  181. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/matches.js +2 -1
  182. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/matches.js.map +1 -1
  183. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/nextElementSibling.js +8 -2
  184. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/nextElementSibling.js.map +1 -1
  185. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/previousElementSibling.js +8 -2
  186. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/previousElementSibling.js.map +1 -1
  187. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element.js +4 -1
  188. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element.js.map +1 -1
  189. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Event.js +10 -3
  190. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Event.js.map +1 -1
  191. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Function/prototype/bind.js +4 -1
  192. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Function/prototype/bind.js.map +1 -1
  193. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Object/defineProperty.js +2 -1
  194. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Object/defineProperty.js.map +1 -1
  195. data/node_modules/govuk-frontend/govuk/vendor/polyfills/String/prototype/trim.js +3 -2
  196. data/node_modules/govuk-frontend/govuk/vendor/polyfills/String/prototype/trim.js.map +1 -1
  197. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Window.js +2 -1
  198. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Window.js.map +1 -1
  199. data/node_modules/govuk-frontend/govuk-esm/all.mjs +81 -60
  200. data/node_modules/govuk-frontend/govuk-esm/all.mjs.map +1 -0
  201. data/node_modules/govuk-frontend/govuk-esm/common/closest-attribute-value.mjs +12 -8
  202. data/node_modules/govuk-frontend/govuk-esm/common/closest-attribute-value.mjs.map +1 -0
  203. data/node_modules/govuk-frontend/govuk-esm/common/govuk-frontend-version.mjs +9 -0
  204. data/node_modules/govuk-frontend/govuk-esm/common/govuk-frontend-version.mjs.map +1 -0
  205. data/node_modules/govuk-frontend/govuk-esm/common/index.mjs +44 -29
  206. data/node_modules/govuk-frontend/govuk-esm/common/index.mjs.map +1 -0
  207. data/node_modules/govuk-frontend/govuk-esm/common/normalise-dataset.mjs +15 -9
  208. data/node_modules/govuk-frontend/govuk-esm/common/normalise-dataset.mjs.map +1 -0
  209. data/node_modules/govuk-frontend/govuk-esm/common.mjs +3 -5
  210. data/node_modules/govuk-frontend/govuk-esm/common.mjs.map +1 -0
  211. data/node_modules/govuk-frontend/govuk-esm/components/accordion/accordion.mjs +319 -211
  212. data/node_modules/govuk-frontend/govuk-esm/components/accordion/accordion.mjs.map +1 -0
  213. data/node_modules/govuk-frontend/govuk-esm/components/button/button.mjs +47 -30
  214. data/node_modules/govuk-frontend/govuk-esm/components/button/button.mjs.map +1 -0
  215. data/node_modules/govuk-frontend/govuk-esm/components/character-count/character-count.mjs +169 -115
  216. data/node_modules/govuk-frontend/govuk-esm/components/character-count/character-count.mjs.map +1 -0
  217. data/node_modules/govuk-frontend/govuk-esm/components/checkboxes/checkboxes.mjs +88 -51
  218. data/node_modules/govuk-frontend/govuk-esm/components/checkboxes/checkboxes.mjs.map +1 -0
  219. data/node_modules/govuk-frontend/govuk-esm/components/details/details.mjs +64 -54
  220. data/node_modules/govuk-frontend/govuk-esm/components/details/details.mjs.map +1 -0
  221. data/node_modules/govuk-frontend/govuk-esm/components/error-summary/error-summary.mjs +69 -50
  222. data/node_modules/govuk-frontend/govuk-esm/components/error-summary/error-summary.mjs.map +1 -0
  223. data/node_modules/govuk-frontend/govuk-esm/components/header/header.mjs +59 -35
  224. data/node_modules/govuk-frontend/govuk-esm/components/header/header.mjs.map +1 -0
  225. data/node_modules/govuk-frontend/govuk-esm/components/notification-banner/notification-banner.mjs +36 -25
  226. data/node_modules/govuk-frontend/govuk-esm/components/notification-banner/notification-banner.mjs.map +1 -0
  227. data/node_modules/govuk-frontend/govuk-esm/components/radios/radios.mjs +67 -38
  228. data/node_modules/govuk-frontend/govuk-esm/components/radios/radios.mjs.map +1 -0
  229. data/node_modules/govuk-frontend/govuk-esm/components/skip-link/skip-link.mjs +49 -32
  230. data/node_modules/govuk-frontend/govuk-esm/components/skip-link/skip-link.mjs.map +1 -0
  231. data/node_modules/govuk-frontend/govuk-esm/components/tabs/tabs.mjs +263 -163
  232. data/node_modules/govuk-frontend/govuk-esm/components/tabs/tabs.mjs.map +1 -0
  233. data/node_modules/govuk-frontend/govuk-esm/i18n.mjs +68 -57
  234. data/node_modules/govuk-frontend/govuk-esm/i18n.mjs.map +1 -0
  235. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/DOMTokenList.mjs +5 -3
  236. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/DOMTokenList.mjs.map +1 -0
  237. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Date/now.mjs +4 -2
  238. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Date/now.mjs.map +1 -0
  239. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Document.mjs +4 -2
  240. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Document.mjs.map +1 -0
  241. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/classList.mjs +7 -4
  242. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/classList.mjs.map +1 -0
  243. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/closest.mjs +5 -2
  244. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/closest.mjs.map +1 -0
  245. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/dataset.mjs +13 -10
  246. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/dataset.mjs.map +1 -0
  247. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/matches.mjs +4 -2
  248. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/matches.mjs.map +1 -0
  249. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/nextElementSibling.mjs +6 -3
  250. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/nextElementSibling.mjs.map +1 -0
  251. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/previousElementSibling.mjs +6 -3
  252. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/previousElementSibling.mjs.map +1 -0
  253. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element.mjs +5 -2
  254. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element.mjs.map +1 -0
  255. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Event.mjs +7 -4
  256. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Event.mjs.map +1 -0
  257. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Function/prototype/bind.mjs +5 -2
  258. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Function/prototype/bind.mjs.map +1 -0
  259. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Object/defineProperty.mjs +4 -2
  260. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Object/defineProperty.mjs.map +1 -0
  261. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/String/prototype/trim.mjs +5 -3
  262. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/String/prototype/trim.mjs.map +1 -0
  263. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Window.mjs +4 -2
  264. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Window.mjs.map +1 -0
  265. data/node_modules/govuk-frontend/govuk-prototype-kit/init.js +1 -0
  266. data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +2 -1
  267. data/node_modules/govuk-frontend/package.json +3 -2
  268. metadata +44 -7
  269. /data/app/assets/images/govuk_publishing_components/crests/{dit_crest_13px.png → dbt_crest_13px.png} +0 -0
  270. /data/app/assets/images/govuk_publishing_components/crests/{dit_crest_13px_x2.png → dbt_crest_13px_x2.png} +0 -0
  271. /data/app/assets/images/govuk_publishing_components/crests/{dit_crest_18px.png → dbt_crest_18px.png} +0 -0
  272. /data/app/assets/images/govuk_publishing_components/crests/{dit_crest_18px_x2.png → dbt_crest_18px_x2.png} +0 -0
@@ -20,7 +20,7 @@
20
20
  ]
21
21
  },
22
22
  "hidden": false,
23
- "html": "<div class=\"govuk-form-group\">\n\n <div id=\"example-default-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
23
+ "html": "<div class=\"govuk-form-group\">\n <div id=\"example-default-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n </div>\n </div>\n</div>"
24
24
  },
25
25
  {
26
26
  "name": "inline",
@@ -49,7 +49,7 @@
49
49
  ]
50
50
  },
51
51
  "hidden": false,
52
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios govuk-radios--inline\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
52
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
53
53
  },
54
54
  {
55
55
  "name": "with disabled",
@@ -84,7 +84,7 @@
84
84
  ]
85
85
  },
86
86
  "hidden": false,
87
- "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 How do you want to sign in?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n \n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" disabled aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n \n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’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>"
87
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’ve registered for Self Assessment or filed a tax return online before.\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" disabled aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n </div>\n </div>\n\n</fieldset>\n</div>"
88
88
  },
89
89
  {
90
90
  "name": "with legend as page heading",
@@ -113,7 +113,7 @@
113
113
  ]
114
114
  },
115
115
  "hidden": false,
116
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n Which part of the Housing Act was your licence issued under?\n </h1>\n \n </legend>\n \n\n <div id=\"housing-act-hint\" class=\"govuk-hint\">\n Select one of the options below.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act\" name=\"housing-act\" type=\"radio\" value=\"part-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 2 of the Housing Act 2004</span> For properties that are 3 or more stories high and occupied by 5 or more people\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act-2\" name=\"housing-act\" type=\"radio\" value=\"part-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act-2\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 3 of the Housing Act 2004</span> For properties that are within a geographical area defined by a local council\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
116
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n Which part of the Housing Act was your licence issued under?\n </h1>\n </legend>\n <div id=\"housing-act-hint\" class=\"govuk-hint\">\n Select one of the options below.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act\" name=\"housing-act\" type=\"radio\" value=\"part-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 2 of the Housing Act 2004</span> For properties that are 3 or more stories high and occupied by 5 or more people\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act-2\" name=\"housing-act\" type=\"radio\" value=\"part-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act-2\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 3 of the Housing Act 2004</span> For properties that are within a geographical area defined by a local council\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
117
117
  },
118
118
  {
119
119
  "name": "with a medium legend",
@@ -141,7 +141,7 @@
141
141
  ]
142
142
  },
143
143
  "hidden": false,
144
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n Which part of the Housing Act was your licence issued under?\n \n </legend>\n \n\n <div id=\"housing-act-hint\" class=\"govuk-hint\">\n Select one of the options below.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act\" name=\"housing-act\" type=\"radio\" value=\"part-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 2 of the Housing Act 2004</span> For properties that are 3 or more stories high and occupied by 5 or more people\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act-2\" name=\"housing-act\" type=\"radio\" value=\"part-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act-2\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 3 of the Housing Act 2004</span> For properties that are within a geographical area defined by a local council\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
144
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Which part of the Housing Act was your licence issued under?\n </legend>\n <div id=\"housing-act-hint\" class=\"govuk-hint\">\n Select one of the options below.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act\" name=\"housing-act\" type=\"radio\" value=\"part-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 2 of the Housing Act 2004</span> For properties that are 3 or more stories high and occupied by 5 or more people\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act-2\" name=\"housing-act\" type=\"radio\" value=\"part-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act-2\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 3 of the Housing Act 2004</span> For properties that are within a geographical area defined by a local council\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
145
145
  },
146
146
  {
147
147
  "name": "with a divider",
@@ -172,7 +172,7 @@
172
172
  ]
173
173
  },
174
174
  "hidden": false,
175
- "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 sign in?\n \n </legend>\n \n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider\" name=\"example\" type=\"radio\" value=\"governement-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider\">\n Use Government Gateway\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-2\">\n Use GOV.UK Verify\n </label>\n \n </div>\n \n \n \n \n \n <div class=\"govuk-radios__divider\">or</div>\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-4\">\n Create an account\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
175
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to sign in?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider\" name=\"example\" type=\"radio\" value=\"governement-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider\">\n Use Government Gateway\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-2\">\n Use GOV.UK Verify\n </label>\n </div>\n <div class=\"govuk-radios__divider\">or</div> <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-4\">\n Create an account\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
176
176
  },
177
177
  {
178
178
  "name": "with hints on items",
@@ -206,7 +206,7 @@
206
206
  ]
207
207
  },
208
208
  "hidden": false,
209
- "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 How do you want to sign in?\n </h1>\n \n </legend>\n \n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n \n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n \n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’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>"
209
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’ve registered for Self Assessment or filed a tax return online before.\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n </div>\n </div>\n\n</fieldset>\n</div>"
210
210
  },
211
211
  {
212
212
  "name": "without fieldset",
@@ -228,7 +228,7 @@
228
228
  ]
229
229
  },
230
230
  "hidden": false,
231
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours\" name=\"colours\" type=\"radio\" value=\"red\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours-2\" name=\"colours\" type=\"radio\" value=\"green\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours-3\" name=\"colours\" type=\"radio\" value=\"blue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours-3\">\n Blue\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
231
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours\" name=\"colours\" type=\"radio\" value=\"red\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours\">\n Red\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours-2\" name=\"colours\" type=\"radio\" value=\"green\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours-2\">\n Green\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colours-3\" name=\"colours\" type=\"radio\" value=\"blue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colours-3\">\n Blue\n </label>\n </div>\n </div>\n</div>"
232
232
  },
233
233
  {
234
234
  "name": "with fieldset and error message",
@@ -256,7 +256,7 @@
256
256
  ]
257
257
  },
258
258
  "hidden": false,
259
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
259
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
260
260
  },
261
261
  {
262
262
  "name": "with very long option text",
@@ -289,7 +289,7 @@
289
289
  ]
290
290
  },
291
291
  "hidden": false,
292
- "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 <p id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste\" name=\"waste\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-2\" name=\"waste\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-3\" name=\"waste\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__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>"
292
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n <legend class=\"govuk-fieldset__legend\">\n Maecenas faucibus mollis interdum?\n </legend>\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n <p id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste\" name=\"waste\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__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 </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-2\" name=\"waste\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__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 </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-3\" name=\"waste\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__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 </div>\n </div>\n\n</fieldset>\n</div>"
293
293
  },
294
294
  {
295
295
  "name": "with conditional items",
@@ -326,7 +326,7 @@
326
326
  ]
327
327
  },
328
328
  "hidden": false,
329
- "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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted\" name=\"how-contacted\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-3\" name=\"how-contacted\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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>"
329
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted\" name=\"how-contacted\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-3\" name=\"how-contacted\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 </div>\n\n</fieldset>\n</div>"
330
330
  },
331
331
  {
332
332
  "name": "with conditional items with special characters",
@@ -363,7 +363,7 @@
363
363
  ]
364
364
  },
365
365
  "hidden": false,
366
- "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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]\" name=\"contact-prefs\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-user.profile[contact-prefs]\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-2\" name=\"contact-prefs\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-user.profile[contact-prefs]-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-3\" name=\"contact-prefs\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-user.profile[contact-prefs]-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-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>"
366
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]\" name=\"contact-prefs\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-user.profile[contact-prefs]\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-2\" name=\"contact-prefs\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-user.profile[contact-prefs]-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-3\" name=\"contact-prefs\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-user.profile[contact-prefs]-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-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 </div>\n\n</fieldset>\n</div>"
367
367
  },
368
368
  {
369
369
  "name": "with conditional item checked",
@@ -401,7 +401,7 @@
401
401
  ]
402
402
  },
403
403
  "hidden": false,
404
- "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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" checked data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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>"
404
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" checked data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 </div>\n\n</fieldset>\n</div>"
405
405
  },
406
406
  {
407
407
  "name": "prechecked",
@@ -423,7 +423,7 @@
423
423
  ]
424
424
  },
425
425
  "hidden": false,
426
- "html": "<div class=\"govuk-form-group\">\n\n <div id=\"example-default-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
426
+ "html": "<div class=\"govuk-form-group\">\n <div id=\"example-default-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n </div>\n </div>\n</div>"
427
427
  },
428
428
  {
429
429
  "name": "prechecked using value",
@@ -442,7 +442,7 @@
442
442
  "value": "no"
443
443
  },
444
444
  "hidden": false,
445
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
445
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n </div>\n </div>\n</div>"
446
446
  },
447
447
  {
448
448
  "name": "with conditional items and pre-checked value",
@@ -480,7 +480,7 @@
480
480
  "value": "text"
481
481
  },
482
482
  "hidden": false,
483
- "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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" checked data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional\" 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>"
483
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" checked data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" 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 </div>\n\n</fieldset>\n</div>"
484
484
  },
485
485
  {
486
486
  "name": "with optional form-group classes showing group error",
@@ -521,7 +521,7 @@
521
521
  ]
522
522
  },
523
523
  "hidden": false,
524
- "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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\" checked data-aria-controls=\"conditional-how-contacted-2-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-2-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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-2-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2-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>"
524
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\" checked data-aria-controls=\"conditional-how-contacted-2-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-2-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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-2-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2-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 </div>\n\n</fieldset>\n</div>"
525
525
  },
526
526
  {
527
527
  "name": "small",
@@ -552,7 +552,7 @@
552
552
  ]
553
553
  },
554
554
  "hidden": false,
555
- "html": "<div class=\"govuk-form-group govuk-radios--small\">\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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
555
+ "html": "<div class=\"govuk-form-group govuk-radios--small\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
556
556
  },
557
557
  {
558
558
  "name": "small with long text",
@@ -581,7 +581,7 @@
581
581
  ]
582
582
  },
583
583
  "hidden": false,
584
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Venenatis Condimentum\n \n </legend>\n \n\n <div class=\"govuk-radios govuk-radios--small\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo\" name=\"foo\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-2\" name=\"foo\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-3\" name=\"foo\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-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>"
584
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Venenatis Condimentum\n </legend>\n <div class=\"govuk-radios govuk-radios--small\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo\" name=\"foo\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo\">\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 </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-2\" name=\"foo\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-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 </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-3\" name=\"foo\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-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 </div>\n </div>\n\n</fieldset>\n</div>"
585
585
  },
586
586
  {
587
587
  "name": "small with error",
@@ -615,7 +615,7 @@
615
615
  ]
616
616
  },
617
617
  "hidden": false,
618
- "html": "<div class=\"govuk-form-group govuk-form-group--error govuk-radios--small\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-2-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n How do you want to be contacted?\n \n </legend>\n \n\n <p id=\"how-contacted-2-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select a thing\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
618
+ "html": "<div class=\"govuk-form-group govuk-form-group--error govuk-radios--small\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-2-error\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <p id=\"how-contacted-2-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select a thing\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
619
619
  },
620
620
  {
621
621
  "name": "small with hint",
@@ -649,7 +649,7 @@
649
649
  ]
650
650
  },
651
651
  "hidden": false,
652
- "html": "<div class=\"govuk-form-group govuk-radios--small\">\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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" aria-describedby=\"how-contacted-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n <div id=\"how-contacted-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for email address\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
652
+ "html": "<div class=\"govuk-form-group govuk-radios--small\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" aria-describedby=\"how-contacted-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n <div id=\"how-contacted-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for email address\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
653
653
  },
654
654
  {
655
655
  "name": "small with disabled",
@@ -681,7 +681,7 @@
681
681
  ]
682
682
  },
683
683
  "hidden": false,
684
- "html": "<div class=\"govuk-form-group govuk-radios--small\">\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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\" disabled>\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
684
+ "html": "<div class=\"govuk-form-group govuk-radios--small\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\" disabled>\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
685
685
  },
686
686
  {
687
687
  "name": "small with conditional reveal",
@@ -715,7 +715,7 @@
715
715
  ]
716
716
  },
717
717
  "hidden": false,
718
- "html": "<div class=\"govuk-form-group govuk-radios--small\">\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-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n \n </div>\n \n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
718
+ "html": "<div class=\"govuk-form-group govuk-radios--small\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\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 <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
719
719
  },
720
720
  {
721
721
  "name": "small inline",
@@ -744,7 +744,7 @@
744
744
  ]
745
745
  },
746
746
  "hidden": false,
747
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Sort by\n \n </legend>\n \n\n <div class=\"govuk-radios govuk-radios--small govuk-radios--inline\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort\" name=\"example\" type=\"radio\" value=\"relevance\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort\">\n relevance\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-2\" name=\"example\" type=\"radio\" value=\"title\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-2\">\n title\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-3\" name=\"example\" type=\"radio\" value=\"created\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-3\">\n created\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
747
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Sort by\n </legend>\n <div class=\"govuk-radios govuk-radios--small govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort\" name=\"example\" type=\"radio\" value=\"relevance\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort\">\n relevance\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-2\" name=\"example\" type=\"radio\" value=\"title\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-2\">\n title\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-3\" name=\"example\" type=\"radio\" value=\"created\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-3\">\n created\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
748
748
  },
749
749
  {
750
750
  "name": "small inline extreme",
@@ -801,7 +801,7 @@
801
801
  ]
802
802
  },
803
803
  "hidden": false,
804
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Sort by\n \n </legend>\n \n\n <div class=\"govuk-radios govuk-radios--small govuk-radios--inline\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort\" name=\"example\" type=\"radio\" value=\"relevance\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort\">\n relevance\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-2\" name=\"example\" type=\"radio\" value=\"title\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-2\">\n title\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-3\" name=\"example\" type=\"radio\" value=\"created\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-3\">\n created\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-4\" name=\"example\" type=\"radio\" value=\"modified\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-4\">\n modified\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-5\" name=\"example\" type=\"radio\" value=\"category\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-5\">\n category\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-6\" name=\"example\" type=\"radio\" value=\"votes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-6\">\n votes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-7\" name=\"example\" type=\"radio\" value=\"flavour\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-7\">\n flavour\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-8\" name=\"example\" type=\"radio\" value=\"hue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-8\">\n hue\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-9\" name=\"example\" type=\"radio\" value=\"happiness\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-9\">\n happiness\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-10\" name=\"example\" type=\"radio\" value=\"funkiness\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-10\">\n funkiness\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
804
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Sort by\n </legend>\n <div class=\"govuk-radios govuk-radios--small govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort\" name=\"example\" type=\"radio\" value=\"relevance\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort\">\n relevance\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-2\" name=\"example\" type=\"radio\" value=\"title\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-2\">\n title\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-3\" name=\"example\" type=\"radio\" value=\"created\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-3\">\n created\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-4\" name=\"example\" type=\"radio\" value=\"modified\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-4\">\n modified\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-5\" name=\"example\" type=\"radio\" value=\"category\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-5\">\n category\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-6\" name=\"example\" type=\"radio\" value=\"votes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-6\">\n votes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-7\" name=\"example\" type=\"radio\" value=\"flavour\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-7\">\n flavour\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-8\" name=\"example\" type=\"radio\" value=\"hue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-8\">\n hue\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-9\" name=\"example\" type=\"radio\" value=\"happiness\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-9\">\n happiness\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-10\" name=\"example\" type=\"radio\" value=\"funkiness\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-10\">\n funkiness\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
805
805
  },
806
806
  {
807
807
  "name": "small with a divider",
@@ -833,7 +833,7 @@
833
833
  ]
834
834
  },
835
835
  "hidden": false,
836
- "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 sign in?\n \n </legend>\n \n\n <div class=\"govuk-radios govuk-radios--small\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider\" name=\"example\" type=\"radio\" value=\"governement-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider\">\n Use Government Gateway\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-2\">\n Use GOV.UK Verify\n </label>\n \n </div>\n \n \n \n \n \n <div class=\"govuk-radios__divider\">or</div>\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-4\">\n Create an account\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
836
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to sign in?\n </legend>\n <div class=\"govuk-radios govuk-radios--small\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider\" name=\"example\" type=\"radio\" value=\"governement-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider\">\n Use Government Gateway\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-2\">\n Use GOV.UK Verify\n </label>\n </div>\n <div class=\"govuk-radios__divider\">or</div> <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-4\">\n Create an account\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
837
837
  },
838
838
  {
839
839
  "name": "with idPrefix",
@@ -852,7 +852,7 @@
852
852
  ]
853
853
  },
854
854
  "hidden": false,
855
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-id-prefix\" name=\"example-radio\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-id-prefix\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-id-prefix-2\" name=\"example-radio\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-id-prefix-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
855
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-id-prefix\" name=\"example-radio\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-id-prefix\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-id-prefix-2\" name=\"example-radio\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-id-prefix-2\">\n No\n </label>\n </div>\n </div>\n</div>"
856
856
  },
857
857
  {
858
858
  "name": "minimal items and name",
@@ -870,7 +870,7 @@
870
870
  ]
871
871
  },
872
872
  "hidden": true,
873
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
873
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n </div>\n </div>\n</div>"
874
874
  },
875
875
  {
876
876
  "name": "with falsey items",
@@ -890,7 +890,7 @@
890
890
  ]
891
891
  },
892
892
  "hidden": true,
893
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-4\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-4\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
893
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-4\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-4\">\n No\n </label>\n </div>\n </div>\n</div>"
894
894
  },
895
895
  {
896
896
  "name": "fieldset with describedBy",
@@ -914,7 +914,7 @@
914
914
  ]
915
915
  },
916
916
  "hidden": true,
917
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which option?\n \n </legend>\n \n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
917
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id\">\n <legend class=\"govuk-fieldset__legend\">\n Which option?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
918
918
  },
919
919
  {
920
920
  "name": "attributes",
@@ -936,7 +936,7 @@
936
936
  ]
937
937
  },
938
938
  "hidden": true,
939
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\" data-attribute=\"value\" data-second-attribute=\"second-value\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
939
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-attribute=\"value\" data-second-attribute=\"second-value\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n </div>\n </div>\n</div>"
940
940
  },
941
941
  {
942
942
  "name": "items with attributes",
@@ -962,7 +962,7 @@
962
962
  ]
963
963
  },
964
964
  "hidden": true,
965
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\" data-attribute=\"ABC\" data-second-attribute=\"DEF\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\" data-attribute=\"GHI\" data-second-attribute=\"JKL\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
965
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\" data-attribute=\"ABC\" data-second-attribute=\"DEF\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\" data-attribute=\"GHI\" data-second-attribute=\"JKL\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n </div>\n </div>\n</div>"
966
966
  },
967
967
  {
968
968
  "name": "with empty conditional",
@@ -983,7 +983,7 @@
983
983
  ]
984
984
  },
985
985
  "hidden": true,
986
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-conditional\" name=\"example-conditional\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-conditional\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-conditional-2\" name=\"example-conditional\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-conditional-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
986
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-conditional\" name=\"example-conditional\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-conditional\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-conditional-2\" name=\"example-conditional\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-conditional-2\">\n No\n </label>\n </div>\n </div>\n</div>"
987
987
  },
988
988
  {
989
989
  "name": "label with classes",
@@ -1000,7 +1000,7 @@
1000
1000
  ]
1001
1001
  },
1002
1002
  "hidden": true,
1003
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-label-classes\" name=\"example-label-classes\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label bold\" for=\"example-label-classes\">\n Yes\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
1003
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-label-classes\" name=\"example-label-classes\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label bold\" for=\"example-label-classes\">\n Yes\n </label>\n </div>\n </div>\n</div>"
1004
1004
  },
1005
1005
  {
1006
1006
  "name": "with hints on parent and items",
@@ -1032,7 +1032,7 @@
1032
1032
  ]
1033
1033
  },
1034
1034
  "hidden": true,
1035
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-multiple-hints-hint\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-multiple-hints-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints\" name=\"example-multiple-hints\" type=\"radio\" value=\"yes\" aria-describedby=\"example-multiple-hints-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints\">\n Yes\n </label>\n \n <div id=\"example-multiple-hints-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for yes option here\n </div>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints-2\" name=\"example-multiple-hints\" type=\"radio\" value=\"no\" aria-describedby=\"example-multiple-hints-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints-2\">\n No\n </label>\n \n <div id=\"example-multiple-hints-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for no option here\n </div>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1035
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"example-multiple-hints-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-multiple-hints-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints\" name=\"example-multiple-hints\" type=\"radio\" value=\"yes\" aria-describedby=\"example-multiple-hints-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints\">\n Yes\n </label>\n <div id=\"example-multiple-hints-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for yes option here\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints-2\" name=\"example-multiple-hints\" type=\"radio\" value=\"no\" aria-describedby=\"example-multiple-hints-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints-2\">\n No\n </label>\n <div id=\"example-multiple-hints-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for no option here\n </div>\n </div>\n </div>\n\n</fieldset>\n</div>"
1036
1036
  },
1037
1037
  {
1038
1038
  "name": "with describedBy and hint",
@@ -1059,7 +1059,7 @@
1059
1059
  ]
1060
1060
  },
1061
1061
  "hidden": true,
1062
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-hint-describedby-hint\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-hint-describedby-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby\" name=\"example-hint-describedby\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby-2\" name=\"example-hint-describedby\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1062
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-hint-describedby-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-hint-describedby-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby\" name=\"example-hint-describedby\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby-2\" name=\"example-hint-describedby\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1063
1063
  },
1064
1064
  {
1065
1065
  "name": "with error message",
@@ -1080,7 +1080,7 @@
1080
1080
  ]
1081
1081
  },
1082
1082
  "hidden": true,
1083
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <p id=\"example-error-message-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message\" name=\"example-error-message\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-2\" name=\"example-error-message\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
1083
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <p id=\"example-error-message-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message\" name=\"example-error-message\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-2\" name=\"example-error-message\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-2\">\n No\n </label>\n </div>\n </div>\n</div>"
1084
1084
  },
1085
1085
  {
1086
1086
  "name": "with error message and idPrefix",
@@ -1102,7 +1102,7 @@
1102
1102
  ]
1103
1103
  },
1104
1104
  "hidden": true,
1105
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <p id=\"id-prefix-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"id-prefix\" name=\"example-error-message\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"id-prefix\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"id-prefix-2\" name=\"example-error-message\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"id-prefix-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
1105
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <p id=\"id-prefix-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"id-prefix\" name=\"example-error-message\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"id-prefix\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"id-prefix-2\" name=\"example-error-message\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"id-prefix-2\">\n No\n </label>\n </div>\n </div>\n</div>"
1106
1106
  },
1107
1107
  {
1108
1108
  "name": "with hint and error message",
@@ -1131,7 +1131,7 @@
1131
1131
  ]
1132
1132
  },
1133
1133
  "hidden": true,
1134
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error-message-hint-hint example-error-message-hint-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n \n \n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1134
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error-message-hint-hint example-error-message-hint-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1135
1135
  },
1136
1136
  {
1137
1137
  "name": "with hint, error message and describedBy",
@@ -1161,7 +1161,7 @@
1161
1161
  ]
1162
1162
  },
1163
1163
  "hidden": true,
1164
- "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-error-message-hint-hint example-error-message-hint-error\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n \n \n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1164
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-error-message-hint-hint example-error-message-hint-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1165
1165
  },
1166
1166
  {
1167
1167
  "name": "label with attributes",
@@ -1181,7 +1181,7 @@
1181
1181
  ]
1182
1182
  },
1183
1183
  "hidden": true,
1184
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-label-attributes\" name=\"with-label-attributes\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" data-attribute=\"value\" data-second-attribute=\"second-value\" for=\"with-label-attributes\">\n Yes\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
1184
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-label-attributes\" name=\"with-label-attributes\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" data-attribute=\"value\" data-second-attribute=\"second-value\" for=\"with-label-attributes\">\n Yes\n </label>\n </div>\n </div>\n</div>"
1185
1185
  },
1186
1186
  {
1187
1187
  "name": "fieldset params",
@@ -1212,7 +1212,7 @@
1212
1212
  ]
1213
1213
  },
1214
1214
  "hidden": true,
1215
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-fieldset-params-hint\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have you changed your name?\n \n </legend>\n \n\n <div id=\"example-fieldset-params-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params\" name=\"example-fieldset-params\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params-2\" name=\"example-fieldset-params\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1215
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-fieldset-params-hint\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-fieldset-params-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params\" name=\"example-fieldset-params\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params-2\" name=\"example-fieldset-params\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1216
1216
  },
1217
1217
  {
1218
1218
  "name": "fieldset with html",
@@ -1235,7 +1235,7 @@
1235
1235
  ]
1236
1236
  },
1237
1237
  "hidden": true,
1238
- "html": "<div class=\"govuk-form-group\">\n\n <fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Have <b>you</b> changed your name?\n \n </legend>\n \n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html\" name=\"with-fieldset-html\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html-2\" name=\"with-fieldset-html\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1238
+ "html": "<div class=\"govuk-form-group\">\n<fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Have <b>you</b> changed your name?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html\" name=\"with-fieldset-html\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html-2\" name=\"with-fieldset-html\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1239
1239
  },
1240
1240
  {
1241
1241
  "name": "with fieldset, error message and describedBy",
@@ -1264,7 +1264,7 @@
1264
1264
  ]
1265
1265
  },
1266
1266
  "hidden": true,
1267
- "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 Have you changed your name?\n \n </legend>\n \n\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n \n </div>\n \n \n \n \n </div>\n \n\n</fieldset>\n\n\n</div>"
1267
+ "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id example-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n\n</fieldset>\n</div>"
1268
1268
  },
1269
1269
  {
1270
1270
  "name": "item checked overrides value",
@@ -1288,7 +1288,7 @@
1288
1288
  "value": "green"
1289
1289
  },
1290
1290
  "hidden": true,
1291
- "html": "<div class=\"govuk-form-group\">\n\n <div class=\"govuk-radios\"\n data-module=\"govuk-radios\">\n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors\" name=\"colors\" type=\"radio\" value=\"red\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors\">\n Red\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors-2\" name=\"colors\" type=\"radio\" value=\"green\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors-2\">\n Green\n </label>\n \n </div>\n \n \n \n \n \n \n \n \n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors-3\" name=\"colors\" type=\"radio\" value=\"blue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors-3\">\n Blue\n </label>\n \n </div>\n \n \n \n \n </div>\n\n</div>"
1291
+ "html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors\" name=\"colors\" type=\"radio\" value=\"red\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors\">\n Red\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors-2\" name=\"colors\" type=\"radio\" value=\"green\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors-2\">\n Green\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"colors-3\" name=\"colors\" type=\"radio\" value=\"blue\">\n <label class=\"govuk-label govuk-radios__label\" for=\"colors-3\">\n Blue\n </label>\n </div>\n </div>\n</div>"
1292
1292
  }
1293
1293
  ]
1294
- }
1294
+ }