govuk_publishing_components 32.0.0 → 33.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (206) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/component_guide/accessibility-test.js +0 -1
  3. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js +175 -0
  4. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-ecommerce-tracker.js +1 -1
  5. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-event-tracker.js +5 -13
  6. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js +80 -309
  7. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js +2 -2
  8. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js +140 -0
  9. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/init-ga4.js +3 -0
  10. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4.js +1 -0
  11. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +12 -1
  12. data/app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js +13 -4
  13. data/app/assets/javascripts/govuk_publishing_components/components/single-page-notification-button.js +24 -8
  14. data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-reporter.js +83 -86
  15. data/app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss +2 -5
  16. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +1 -5
  17. data/app/assets/stylesheets/govuk_publishing_components/components/_input.scss +3 -5
  18. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +10 -30
  19. data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +0 -7
  20. data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss +0 -6
  21. data/app/views/govuk_publishing_components/components/_accordion.html.erb +14 -1
  22. data/app/views/govuk_publishing_components/components/_error_summary.html.erb +27 -26
  23. data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +2 -2
  24. data/app/views/govuk_publishing_components/components/_phase_banner.html.erb +1 -1
  25. data/app/views/govuk_publishing_components/components/_share_links.html.erb +18 -15
  26. data/app/views/govuk_publishing_components/components/_single_page_notification_button.html.erb +1 -1
  27. data/app/views/govuk_publishing_components/components/docs/accordion.yml +15 -3
  28. data/app/views/govuk_publishing_components/components/docs/button.yml +10 -0
  29. data/app/views/govuk_publishing_components/components/docs/share_links.yml +59 -30
  30. data/app/views/govuk_publishing_components/components/docs/single_page_notification_button.yml +10 -1
  31. data/app/views/govuk_publishing_components/components/feedback/_yes_no_banner.html.erb +3 -3
  32. data/config/locales/ar.yml +4 -1
  33. data/config/locales/az.yml +4 -1
  34. data/config/locales/be.yml +4 -1
  35. data/config/locales/bg.yml +4 -1
  36. data/config/locales/bn.yml +4 -1
  37. data/config/locales/cs.yml +4 -1
  38. data/config/locales/cy.yml +4 -1
  39. data/config/locales/da.yml +4 -1
  40. data/config/locales/de.yml +4 -1
  41. data/config/locales/dr.yml +4 -1
  42. data/config/locales/el.yml +4 -1
  43. data/config/locales/en.yml +20 -17
  44. data/config/locales/es-419.yml +4 -1
  45. data/config/locales/es.yml +4 -1
  46. data/config/locales/et.yml +4 -1
  47. data/config/locales/fa.yml +4 -1
  48. data/config/locales/fi.yml +4 -1
  49. data/config/locales/fr.yml +4 -1
  50. data/config/locales/gd.yml +4 -1
  51. data/config/locales/gu.yml +4 -1
  52. data/config/locales/he.yml +4 -1
  53. data/config/locales/hi.yml +4 -1
  54. data/config/locales/hr.yml +4 -1
  55. data/config/locales/hu.yml +4 -1
  56. data/config/locales/hy.yml +4 -1
  57. data/config/locales/id.yml +4 -1
  58. data/config/locales/is.yml +4 -1
  59. data/config/locales/it.yml +4 -1
  60. data/config/locales/ja.yml +4 -1
  61. data/config/locales/ka.yml +4 -1
  62. data/config/locales/kk.yml +4 -1
  63. data/config/locales/ko.yml +4 -1
  64. data/config/locales/lt.yml +4 -1
  65. data/config/locales/lv.yml +4 -1
  66. data/config/locales/ms.yml +4 -1
  67. data/config/locales/mt.yml +4 -1
  68. data/config/locales/nl.yml +4 -1
  69. data/config/locales/no.yml +4 -1
  70. data/config/locales/pa-pk.yml +4 -1
  71. data/config/locales/pa.yml +4 -1
  72. data/config/locales/pl.yml +4 -1
  73. data/config/locales/ps.yml +4 -1
  74. data/config/locales/pt.yml +4 -1
  75. data/config/locales/ro.yml +4 -1
  76. data/config/locales/ru.yml +4 -1
  77. data/config/locales/si.yml +4 -1
  78. data/config/locales/sk.yml +4 -1
  79. data/config/locales/sl.yml +4 -1
  80. data/config/locales/so.yml +4 -1
  81. data/config/locales/sq.yml +4 -1
  82. data/config/locales/sr.yml +4 -1
  83. data/config/locales/sv.yml +4 -1
  84. data/config/locales/sw.yml +4 -1
  85. data/config/locales/ta.yml +4 -1
  86. data/config/locales/th.yml +4 -1
  87. data/config/locales/tk.yml +4 -1
  88. data/config/locales/tr.yml +4 -1
  89. data/config/locales/uk.yml +4 -1
  90. data/config/locales/ur.yml +4 -1
  91. data/config/locales/uz.yml +4 -1
  92. data/config/locales/vi.yml +4 -1
  93. data/config/locales/zh-hk.yml +4 -1
  94. data/config/locales/zh-tw.yml +4 -1
  95. data/config/locales/zh.yml +4 -1
  96. data/lib/govuk_publishing_components/presenters/button_helper.rb +7 -1
  97. data/lib/govuk_publishing_components/presenters/single_page_notification_button_helper.rb +25 -1
  98. data/lib/govuk_publishing_components/version.rb +1 -1
  99. data/node_modules/axe-core/axe.js +4567 -4678
  100. data/node_modules/axe-core/axe.min.js +2 -2
  101. data/node_modules/axe-core/package.json +2 -2
  102. data/node_modules/axe-core/sri-history.json +8 -0
  103. data/node_modules/govuk-frontend/README.md +1 -2
  104. data/node_modules/govuk-frontend/govuk/all.js +1398 -273
  105. data/node_modules/govuk-frontend/govuk/common/closest-attribute-value.js +70 -0
  106. data/node_modules/govuk-frontend/govuk/common/index.js +172 -0
  107. data/node_modules/govuk-frontend/govuk/common/normalise-dataset.js +373 -0
  108. data/node_modules/govuk-frontend/govuk/common.js +138 -3
  109. data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js +753 -25
  110. data/node_modules/govuk-frontend/govuk/components/accordion/fixtures.json +54 -22
  111. data/node_modules/govuk-frontend/govuk/components/accordion/macro-options.json +36 -0
  112. data/node_modules/govuk-frontend/govuk/components/accordion/template.njk +7 -1
  113. data/node_modules/govuk-frontend/govuk/components/back-link/fixtures.json +12 -12
  114. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/fixtures.json +22 -22
  115. data/node_modules/govuk-frontend/govuk/components/button/_index.scss +23 -5
  116. data/node_modules/govuk-frontend/govuk/components/button/button.js +365 -107
  117. data/node_modules/govuk-frontend/govuk/components/button/fixtures.json +85 -66
  118. data/node_modules/govuk-frontend/govuk/components/button/template.njk +1 -1
  119. data/node_modules/govuk-frontend/govuk/components/character-count/_index.scss +9 -0
  120. data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js +1033 -121
  121. data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +112 -36
  122. data/node_modules/govuk-frontend/govuk/components/character-count/macro-options.json +42 -0
  123. data/node_modules/govuk-frontend/govuk/components/character-count/template.njk +27 -3
  124. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js +30 -2
  125. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +96 -93
  126. data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +46 -46
  127. data/node_modules/govuk-frontend/govuk/components/date-input/fixtures.json +50 -50
  128. data/node_modules/govuk-frontend/govuk/components/details/details.js +43 -13
  129. data/node_modules/govuk-frontend/govuk/components/details/fixtures.json +20 -20
  130. data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json +20 -20
  131. data/node_modules/govuk-frontend/govuk/components/error-summary/error-summary.js +268 -6
  132. data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json +44 -35
  133. data/node_modules/govuk-frontend/govuk/components/error-summary/template.njk +25 -21
  134. data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json +51 -39
  135. data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +26 -26
  136. data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +1 -1
  137. data/node_modules/govuk-frontend/govuk/components/footer/fixtures.json +46 -46
  138. data/node_modules/govuk-frontend/govuk/components/footer/macro-options.json +2 -2
  139. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +93 -38
  140. data/node_modules/govuk-frontend/govuk/components/header/header.js +6 -0
  141. data/node_modules/govuk-frontend/govuk/components/header/macro-options.json +8 -2
  142. data/node_modules/govuk-frontend/govuk/components/header/template.njk +4 -2
  143. data/node_modules/govuk-frontend/govuk/components/hint/fixtures.json +12 -12
  144. data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +80 -80
  145. data/node_modules/govuk-frontend/govuk/components/inset-text/fixtures.json +12 -12
  146. data/node_modules/govuk-frontend/govuk/components/label/fixtures.json +34 -34
  147. data/node_modules/govuk-frontend/govuk/components/notification-banner/fixtures.json +56 -46
  148. data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js +252 -2
  149. data/node_modules/govuk-frontend/govuk/components/notification-banner/template.njk +1 -1
  150. data/node_modules/govuk-frontend/govuk/components/pagination/_index.scss +10 -7
  151. data/node_modules/govuk-frontend/govuk/components/pagination/fixtures.json +33 -26
  152. data/node_modules/govuk-frontend/govuk/components/panel/fixtures.json +18 -18
  153. data/node_modules/govuk-frontend/govuk/components/phase-banner/fixtures.json +14 -14
  154. data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +94 -91
  155. data/node_modules/govuk-frontend/govuk/components/radios/radios.js +30 -2
  156. data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +32 -32
  157. data/node_modules/govuk-frontend/govuk/components/skip-link/fixtures.json +22 -20
  158. data/node_modules/govuk-frontend/govuk/components/skip-link/skip-link.js +10 -4
  159. data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json +50 -50
  160. data/node_modules/govuk-frontend/govuk/components/table/_index.scss +1 -1
  161. data/node_modules/govuk-frontend/govuk/components/table/fixtures.json +40 -40
  162. data/node_modules/govuk-frontend/govuk/components/tabs/fixtures.json +29 -29
  163. data/node_modules/govuk-frontend/govuk/components/tabs/tabs.js +28 -0
  164. data/node_modules/govuk-frontend/govuk/components/tag/fixtures.json +28 -28
  165. data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +34 -34
  166. data/node_modules/govuk-frontend/govuk/components/warning-text/fixtures.json +14 -14
  167. data/node_modules/govuk-frontend/govuk/core/_section-break.scss +1 -1
  168. data/node_modules/govuk-frontend/govuk/helpers/_colour.scss +2 -2
  169. data/node_modules/govuk-frontend/govuk/helpers/_links.scss +6 -6
  170. data/node_modules/govuk-frontend/govuk/i18n.js +390 -0
  171. data/node_modules/govuk-frontend/govuk/macros/i18n.njk +15 -0
  172. data/node_modules/govuk-frontend/govuk/settings/_all.scss +1 -0
  173. data/node_modules/govuk-frontend/govuk/settings/_colours-palette.scss +12 -0
  174. data/node_modules/govuk-frontend/govuk/settings/_compatibility.scss +26 -0
  175. data/node_modules/govuk-frontend/govuk/settings/_typography-font.scss +23 -0
  176. data/node_modules/govuk-frontend/govuk/settings/_typography-responsive.scss +12 -0
  177. data/node_modules/govuk-frontend/govuk/settings/_warnings.scss +53 -0
  178. data/node_modules/govuk-frontend/govuk/tools/_compatibility.scss +20 -6
  179. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Date/now.js +21 -0
  180. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/dataset.js +300 -0
  181. data/node_modules/govuk-frontend/govuk/vendor/polyfills/String/prototype/trim.js +21 -0
  182. data/node_modules/govuk-frontend/govuk-esm/all.mjs +50 -27
  183. data/node_modules/govuk-frontend/govuk-esm/common/closest-attribute-value.mjs +15 -0
  184. data/node_modules/govuk-frontend/govuk-esm/common/index.mjs +159 -0
  185. data/node_modules/govuk-frontend/govuk-esm/common/normalise-dataset.mjs +58 -0
  186. data/node_modules/govuk-frontend/govuk-esm/common.mjs +6 -28
  187. data/node_modules/govuk-frontend/govuk-esm/components/accordion/accordion.mjs +113 -43
  188. data/node_modules/govuk-frontend/govuk-esm/components/button/button.mjs +67 -30
  189. data/node_modules/govuk-frontend/govuk-esm/components/character-count/character-count.mjs +325 -123
  190. data/node_modules/govuk-frontend/govuk-esm/components/checkboxes/checkboxes.mjs +9 -3
  191. data/node_modules/govuk-frontend/govuk-esm/components/details/details.mjs +22 -8
  192. data/node_modules/govuk-frontend/govuk-esm/components/error-summary/error-summary.mjs +48 -6
  193. data/node_modules/govuk-frontend/govuk-esm/components/header/header.mjs +6 -0
  194. data/node_modules/govuk-frontend/govuk-esm/components/notification-banner/notification-banner.mjs +32 -2
  195. data/node_modules/govuk-frontend/govuk-esm/components/radios/radios.mjs +9 -3
  196. data/node_modules/govuk-frontend/govuk-esm/components/skip-link/skip-link.mjs +10 -4
  197. data/node_modules/govuk-frontend/govuk-esm/components/tabs/tabs.mjs +8 -2
  198. data/node_modules/govuk-frontend/govuk-esm/i18n.mjs +380 -0
  199. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Date/now.mjs +13 -0
  200. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/dataset.mjs +68 -0
  201. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/String/prototype/trim.mjs +13 -0
  202. data/node_modules/govuk-frontend/govuk-prototype-kit/init.js +7 -0
  203. data/node_modules/govuk-frontend/govuk-prototype-kit/init.scss +12 -0
  204. data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +138 -7
  205. data/node_modules/govuk-frontend/package.json +1 -1
  206. metadata +22 -3
@@ -46,8 +46,8 @@
46
46
  ]
47
47
  ]
48
48
  },
49
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >January</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >February</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >March</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
50
- "hidden": false
49
+ "hidden": false,
50
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >January</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >February</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >March</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
51
51
  },
52
52
  {
53
53
  "name": "table with head",
@@ -107,8 +107,8 @@
107
107
  ]
108
108
  ]
109
109
  },
110
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Month you apply</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for bicycles</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for vehicles</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >January</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >February</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >March</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
111
- "hidden": false
110
+ "hidden": false,
111
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Month you apply</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for bicycles</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for vehicles</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >January</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >February</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >March</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
112
112
  },
113
113
  {
114
114
  "name": "table with head and caption",
@@ -171,8 +171,8 @@
171
171
  ]
172
172
  ]
173
173
  },
174
- "html": "<table class=\"govuk-table\">\n \n <caption class=\"govuk-table__caption govuk-heading-m\">Caption 1: Months and rates</caption>\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Month you apply</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for bicycles</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for vehicles</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >January</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >February</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >March</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
175
- "hidden": false
174
+ "hidden": false,
175
+ "html": "<table class=\"govuk-table\">\n \n <caption class=\"govuk-table__caption govuk-heading-m\">Caption 1: Months and rates</caption>\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Month you apply</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for bicycles</th>\n \n <th scope=\"col\" class=\"govuk-table__header govuk-table__header--numeric\">Rate for vehicles</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >January</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >February</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >March</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
176
176
  },
177
177
  {
178
178
  "name": "classes",
@@ -189,8 +189,8 @@
189
189
  ]
190
190
  ]
191
191
  },
192
- "html": "<table class=\"govuk-table custom-class-goes-here\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
193
- "hidden": true
192
+ "hidden": true,
193
+ "html": "<table class=\"govuk-table custom-class-goes-here\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
194
194
  },
195
195
  {
196
196
  "name": "attributes",
@@ -209,8 +209,8 @@
209
209
  ]
210
210
  ]
211
211
  },
212
- "html": "<table class=\"govuk-table\" data-foo=\"bar\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
213
- "hidden": true
212
+ "hidden": true,
213
+ "html": "<table class=\"govuk-table\" data-foo=\"bar\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
214
214
  },
215
215
  {
216
216
  "name": "html as text",
@@ -228,8 +228,8 @@
228
228
  ]
229
229
  ]
230
230
  },
231
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
232
- "hidden": true
231
+ "hidden": true,
232
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
233
233
  },
234
234
  {
235
235
  "name": "html",
@@ -247,8 +247,8 @@
247
247
  ]
248
248
  ]
249
249
  },
250
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Foo <span>bar</span></th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Foo <span>bar</span></td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
251
- "hidden": true
250
+ "hidden": true,
251
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\">Foo <span>bar</span></th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Foo <span>bar</span></td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
252
252
  },
253
253
  {
254
254
  "name": "head with classes",
@@ -270,8 +270,8 @@
270
270
  ]
271
271
  ]
272
272
  },
273
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header my-custom-class\">Foo</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
274
- "hidden": true
273
+ "hidden": true,
274
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header my-custom-class\">Foo</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
275
275
  },
276
276
  {
277
277
  "name": "head with rowspan and colspan",
@@ -294,8 +294,8 @@
294
294
  ]
295
295
  ]
296
296
  },
297
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\" colspan=\"2\" rowspan=\"2\">Foo</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
298
- "hidden": true
297
+ "hidden": true,
298
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\" colspan=\"2\" rowspan=\"2\">Foo</th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
299
299
  },
300
300
  {
301
301
  "name": "head with attributes",
@@ -318,8 +318,8 @@
318
318
  ]
319
319
  ]
320
320
  },
321
- "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\" data-fizz=\"buzz\"></th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
322
- "hidden": true
321
+ "hidden": true,
322
+ "html": "<table class=\"govuk-table\">\n \n \n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n \n <th scope=\"col\" class=\"govuk-table__header\" data-fizz=\"buzz\"></th>\n \n </tr>\n </thead>\n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >Jan</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >Feb</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
323
323
  },
324
324
  {
325
325
  "name": "with firstCellIsHeader true",
@@ -367,8 +367,8 @@
367
367
  ]
368
368
  ]
369
369
  },
370
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >January</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >February</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >March</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
371
- "hidden": true
370
+ "hidden": true,
371
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >January</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£85</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£95</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >February</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£75</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£55</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >March</th>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£165</td>\n \n \n \n \n <td class=\"govuk-table__cell govuk-table__cell--numeric\"\n >£125</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
372
372
  },
373
373
  {
374
374
  "name": "firstCellIsHeader with classes",
@@ -383,8 +383,8 @@
383
383
  ]
384
384
  ]
385
385
  },
386
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header my-custom-class\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>",
387
- "hidden": true
386
+ "hidden": true,
387
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header my-custom-class\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>"
388
388
  },
389
389
  {
390
390
  "name": "firstCellIsHeader with html",
@@ -398,8 +398,8 @@
398
398
  ]
399
399
  ]
400
400
  },
401
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >Foo <span>bar</span></th>\n \n \n </tr>\n \n \n </tbody>\n</table>",
402
- "hidden": true
401
+ "hidden": true,
402
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >Foo <span>bar</span></th>\n \n \n </tr>\n \n \n </tbody>\n</table>"
403
403
  },
404
404
  {
405
405
  "name": "firstCellIsHeader with html as text",
@@ -413,8 +413,8 @@
413
413
  ]
414
414
  ]
415
415
  },
416
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</th>\n \n \n </tr>\n \n \n </tbody>\n</table>",
417
- "hidden": true
416
+ "hidden": true,
417
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\"\n >Foo &lt;script&gt;hacking.do(1337)&lt;/script&gt;</th>\n \n \n </tr>\n \n \n </tbody>\n</table>"
418
418
  },
419
419
  {
420
420
  "name": "firstCellIsHeader with rowspan and colspan",
@@ -430,8 +430,8 @@
430
430
  ]
431
431
  ]
432
432
  },
433
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\" colspan=\"2\" rowspan=\"2\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>",
434
- "hidden": true
433
+ "hidden": true,
434
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\" colspan=\"2\" rowspan=\"2\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>"
435
435
  },
436
436
  {
437
437
  "name": "firstCellIsHeader with attributes",
@@ -448,8 +448,8 @@
448
448
  ]
449
449
  ]
450
450
  },
451
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\" data-fizz=\"buzz\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>",
452
- "hidden": true
451
+ "hidden": true,
452
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <th scope=\"row\" class=\"govuk-table__header\" data-fizz=\"buzz\"\n >Foo</th>\n \n \n </tr>\n \n \n </tbody>\n</table>"
453
453
  },
454
454
  {
455
455
  "name": "with falsey items",
@@ -483,8 +483,8 @@
483
483
  ]
484
484
  ]
485
485
  },
486
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >A</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >1</td>\n \n \n </tr>\n \n \n \n \n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >B</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >2</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >C</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >3</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
487
- "hidden": true
486
+ "hidden": true,
487
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >A</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >1</td>\n \n \n </tr>\n \n \n \n \n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >B</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >2</td>\n \n \n </tr>\n \n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\"\n >C</td>\n \n \n \n \n <td class=\"govuk-table__cell\"\n >3</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
488
488
  },
489
489
  {
490
490
  "name": "rows with classes",
@@ -498,8 +498,8 @@
498
498
  ]
499
499
  ]
500
500
  },
501
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell my-custom-class\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
502
- "hidden": true
501
+ "hidden": true,
502
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell my-custom-class\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
503
503
  },
504
504
  {
505
505
  "name": "rows with rowspan and colspan",
@@ -514,8 +514,8 @@
514
514
  ]
515
515
  ]
516
516
  },
517
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\" colspan=\"2\" rowspan=\"2\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
518
- "hidden": true
517
+ "hidden": true,
518
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\" colspan=\"2\" rowspan=\"2\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
519
519
  },
520
520
  {
521
521
  "name": "rows with attributes",
@@ -531,8 +531,8 @@
531
531
  ]
532
532
  ]
533
533
  },
534
- "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\" data-fizz=\"buzz\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>",
535
- "hidden": true
534
+ "hidden": true,
535
+ "html": "<table class=\"govuk-table\">\n \n \n <tbody class=\"govuk-table__body\">\n \n \n <tr class=\"govuk-table__row\">\n \n \n \n <td class=\"govuk-table__cell\" data-fizz=\"buzz\"\n >Foo</td>\n \n \n </tr>\n \n \n </tbody>\n</table>"
536
536
  }
537
537
  ]
538
538
  }
@@ -35,8 +35,8 @@
35
35
  }
36
36
  ]
37
37
  },
38
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#past-day\">\n Past day\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-week\">\n Past week\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-month\">\n Past month\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-year\">\n Past year\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"past-day\">\n \n <h2 class=\"govuk-heading-l\">Past day</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">3</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">1</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">2</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-week\">\n \n <h2 class=\"govuk-heading-l\">Past week</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">24</td>\n <td class=\"govuk-table__cell\">18</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">16</td>\n <td class=\"govuk-table__cell\">20</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">24</td>\n <td class=\"govuk-table__cell\">27</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-month\">\n \n <h2 class=\"govuk-heading-l\">Past month</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">98</td>\n <td class=\"govuk-table__cell\">95</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">122</td>\n <td class=\"govuk-table__cell\">131</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">126</td>\n <td class=\"govuk-table__cell\">142</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-year\">\n \n <p class=\"govuk-body\">There is no data for this year yet, check back later</p>\n \n </div>\n \n \n</div>",
39
- "hidden": false
38
+ "hidden": false,
39
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#past-day\">\n Past day\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-week\">\n Past week\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-month\">\n Past month\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#past-year\">\n Past year\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"past-day\">\n \n <h2 class=\"govuk-heading-l\">Past day</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">3</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">1</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">2</td>\n <td class=\"govuk-table__cell\">0</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-week\">\n \n <h2 class=\"govuk-heading-l\">Past week</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">24</td>\n <td class=\"govuk-table__cell\">18</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">16</td>\n <td class=\"govuk-table__cell\">20</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">24</td>\n <td class=\"govuk-table__cell\">27</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-month\">\n \n <h2 class=\"govuk-heading-l\">Past month</h2>\n<table class=\"govuk-table\">\n <thead class=\"govuk-table__head\">\n <tr class=\"govuk-table__row\">\n <th class=\"govuk-table__header\" scope=\"col\">Case manager</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases opened</th>\n <th class=\"govuk-table__header\" scope=\"col\">Cases closed</th>\n </tr>\n </thead>\n <tbody class=\"govuk-table__body\">\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">David Francis</td>\n <td class=\"govuk-table__cell\">98</td>\n <td class=\"govuk-table__cell\">95</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Paul Farmer</td>\n <td class=\"govuk-table__cell\">122</td>\n <td class=\"govuk-table__cell\">131</td>\n </tr>\n <tr class=\"govuk-table__row\">\n <td class=\"govuk-table__cell\">Rita Patel</td>\n <td class=\"govuk-table__cell\">126</td>\n <td class=\"govuk-table__cell\">142</td>\n </tr>\n </tbody>\n</table>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"past-year\">\n \n <p class=\"govuk-body\">There is no data for this year yet, check back later</p>\n \n </div>\n \n \n</div>"
40
40
  },
41
41
  {
42
42
  "name": "tabs-with-anchor-in-panel",
@@ -46,7 +46,7 @@
46
46
  "label": "Tab 1",
47
47
  "id": "tab-1",
48
48
  "panel": {
49
- "html": "<h2 class=\"govuk-heading-l\">Tab 1</h2>\n<p class=\"govuk-body\">Testing that when you click the anchor it moves to the anchor point successfully</p>\n<p class=\"govuk-body\"><a class=\"govuk-link\" href=\"#anchor\">Anchor</a></p>\n<p class=\"govuk-body\"><a id=\"anchor\" tabIndex=\"0\">Anchor Point</a></p>\n"
49
+ "html": "<h2 class=\"govuk-heading-l\">Tab 1</h2>\n<p class=\"govuk-body\">Testing that when you click the anchor it moves to the anchor point successfully</p>\n<p class=\"govuk-body\"><a class=\"govuk-link\" href=\"#anchor\">Anchor</a></p>\n<p class=\"govuk-body\"><a id=\"anchor\" tabindex=\"0\">Anchor Point</a></p>\n"
50
50
  }
51
51
  },
52
52
  {
@@ -58,8 +58,8 @@
58
58
  }
59
59
  ]
60
60
  },
61
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <h2 class=\"govuk-heading-l\">Tab 1</h2>\n<p class=\"govuk-body\">Testing that when you click the anchor it moves to the anchor point successfully</p>\n<p class=\"govuk-body\"><a class=\"govuk-link\" href=\"#anchor\">Anchor</a></p>\n<p class=\"govuk-body\"><a id=\"anchor\" tabIndex=\"0\">Anchor Point</a></p>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <h2 class=\"govuk-heading-l\">Tab 2</h2>\n\n \n </div>\n \n \n</div>",
62
- "hidden": false
61
+ "hidden": false,
62
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <h2 class=\"govuk-heading-l\">Tab 1</h2>\n<p class=\"govuk-body\">Testing that when you click the anchor it moves to the anchor point successfully</p>\n<p class=\"govuk-body\"><a class=\"govuk-link\" href=\"#anchor\">Anchor</a></p>\n<p class=\"govuk-body\"><a id=\"anchor\" tabindex=\"0\">Anchor Point</a></p>\n\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <h2 class=\"govuk-heading-l\">Tab 2</h2>\n\n \n </div>\n \n \n</div>"
63
63
  },
64
64
  {
65
65
  "name": "classes",
@@ -75,8 +75,8 @@
75
75
  }
76
76
  ]
77
77
  },
78
- "html": "<div class=\"govuk-tabs app-tabs--custom-modifier\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>",
79
- "hidden": true
78
+ "hidden": true,
79
+ "html": "<div class=\"govuk-tabs app-tabs--custom-modifier\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>"
80
80
  },
81
81
  {
82
82
  "name": "id",
@@ -92,8 +92,8 @@
92
92
  }
93
93
  ]
94
94
  },
95
- "html": "<div id=\"my-tabs\" class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>",
96
- "hidden": true
95
+ "hidden": true,
96
+ "html": "<div id=\"my-tabs\" class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>"
97
97
  },
98
98
  {
99
99
  "name": "title",
@@ -109,8 +109,8 @@
109
109
  }
110
110
  ]
111
111
  },
112
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Custom title for Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>",
113
- "hidden": true
112
+ "hidden": true,
113
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Custom title for Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>"
114
114
  },
115
115
  {
116
116
  "name": "attributes",
@@ -128,8 +128,8 @@
128
128
  }
129
129
  ]
130
130
  },
131
- "html": "<div class=\"govuk-tabs\" data-attribute=\"my data value\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>",
132
- "hidden": true
131
+ "hidden": true,
132
+ "html": "<div class=\"govuk-tabs\" data-attribute=\"my data value\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>"
133
133
  },
134
134
  {
135
135
  "name": "item with attributes",
@@ -148,8 +148,8 @@
148
148
  }
149
149
  ]
150
150
  },
151
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>",
152
- "hidden": true
151
+ "hidden": true,
152
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Information about tabs</p>\n \n </div>\n \n \n</div>"
153
153
  },
154
154
  {
155
155
  "name": "panel with attributes",
@@ -168,8 +168,8 @@
168
168
  }
169
169
  ]
170
170
  },
171
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">\n \n <p class=\"govuk-body\">Panel text</p>\n \n </div>\n \n \n</div>",
172
- "hidden": true
171
+ "hidden": true,
172
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">\n \n <p class=\"govuk-body\">Panel text</p>\n \n </div>\n \n \n</div>"
173
173
  },
174
174
  {
175
175
  "name": "no item list",
@@ -177,16 +177,16 @@
177
177
  "id": "my-tabs",
178
178
  "classes": "app-tabs--custom-modifier"
179
179
  },
180
- "html": "<div id=\"my-tabs\" class=\"govuk-tabs app-tabs--custom-modifier\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n \n</div>",
181
- "hidden": true
180
+ "hidden": true,
181
+ "html": "<div id=\"my-tabs\" class=\"govuk-tabs app-tabs--custom-modifier\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n \n</div>"
182
182
  },
183
183
  {
184
184
  "name": "empty item list",
185
185
  "options": {
186
186
  "items": []
187
187
  },
188
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n \n</div>",
189
- "hidden": true
188
+ "hidden": true,
189
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n \n</div>"
190
190
  },
191
191
  {
192
192
  "name": "with falsey values",
@@ -211,8 +211,8 @@
211
211
  }
212
212
  ]
213
213
  },
214
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n \n \n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Panel 1 content</p>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p class=\"govuk-body\">Panel 2 content</p>\n \n </div>\n \n \n</div>",
215
- "hidden": true
214
+ "hidden": true,
215
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n \n \n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">Panel 1 content</p>\n \n </div>\n \n \n \n \n \n \n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p class=\"govuk-body\">Panel 2 content</p>\n \n </div>\n \n \n</div>"
216
216
  },
217
217
  {
218
218
  "name": "idPrefix",
@@ -233,8 +233,8 @@
233
233
  }
234
234
  ]
235
235
  },
236
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#custom-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#custom-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"custom-1\">\n \n <p class=\"govuk-body\">Panel 1 content</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"custom-2\">\n \n <p class=\"govuk-body\">Panel 2 content</p>\n \n </div>\n \n \n</div>",
237
- "hidden": true
236
+ "hidden": true,
237
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#custom-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#custom-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"custom-1\">\n \n <p class=\"govuk-body\">Panel 1 content</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"custom-2\">\n \n <p class=\"govuk-body\">Panel 2 content</p>\n \n </div>\n \n \n</div>"
238
238
  },
239
239
  {
240
240
  "name": "html as text",
@@ -256,8 +256,8 @@
256
256
  }
257
257
  ]
258
258
  },
259
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">&lt;p&gt;Panel 1 content&lt;/p&gt;</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p class=\"govuk-body\">&lt;p&gt;Panel 2 content&lt;/p&gt;</p>\n \n </div>\n \n \n</div>",
260
- "hidden": true
259
+ "hidden": true,
260
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p class=\"govuk-body\">&lt;p&gt;Panel 1 content&lt;/p&gt;</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p class=\"govuk-body\">&lt;p&gt;Panel 2 content&lt;/p&gt;</p>\n \n </div>\n \n \n</div>"
261
261
  },
262
262
  {
263
263
  "name": "html",
@@ -279,8 +279,8 @@
279
279
  }
280
280
  ]
281
281
  },
282
- "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p>Panel 1 content</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p>Panel 2 content</p>\n \n </div>\n \n \n</div>",
283
- "hidden": true
282
+ "hidden": true,
283
+ "html": "<div class=\"govuk-tabs\" data-module=\"govuk-tabs\">\n <h2 class=\"govuk-tabs__title\">\n Contents\n </h2>\n \n <ul class=\"govuk-tabs__list\">\n \n \n \n <li class=\"govuk-tabs__list-item govuk-tabs__list-item--selected\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-1\">\n Tab 1\n </a>\n </li>\n \n \n \n \n <li class=\"govuk-tabs__list-item\">\n <a class=\"govuk-tabs__tab\" href=\"#tab-2\">\n Tab 2\n </a>\n </li>\n \n \n </ul>\n \n \n \n \n <div class=\"govuk-tabs__panel\" id=\"tab-1\">\n \n <p>Panel 1 content</p>\n \n </div>\n \n \n \n \n <div class=\"govuk-tabs__panel govuk-tabs__panel--hidden\" id=\"tab-2\">\n \n <p>Panel 2 content</p>\n \n </div>\n \n \n</div>"
284
284
  }
285
285
  ]
286
286
  }
@@ -1054,10 +1054,24 @@ if (detect) return
1054
1054
  })
1055
1055
  .call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {});
1056
1056
 
1057
+ /**
1058
+ * Common helpers which do not require polyfill.
1059
+ *
1060
+ * IMPORTANT: If a helper require a polyfill, please isolate it in its own module
1061
+ * so that the polyfill can be properly tree-shaken and does not burden
1062
+ * the components that do not need that helper
1063
+ *
1064
+ * @module common/index
1065
+ */
1066
+
1057
1067
  /**
1058
1068
  * TODO: Ideally this would be a NodeList.prototype.forEach polyfill
1059
1069
  * This seems to fail in IE8, requires more investigation.
1060
1070
  * See: https://github.com/imagitama/nodelist-foreach-polyfill
1071
+ *
1072
+ * @param {NodeListOf<Element>} nodes - NodeList from querySelectorAll()
1073
+ * @param {nodeListIterator} callback - Callback function to run for each node
1074
+ * @returns {undefined}
1061
1075
  */
1062
1076
  function nodeListForEach (nodes, callback) {
1063
1077
  if (window.NodeList.prototype.forEach) {
@@ -1068,6 +1082,20 @@ function nodeListForEach (nodes, callback) {
1068
1082
  }
1069
1083
  }
1070
1084
 
1085
+ /**
1086
+ * @callback nodeListIterator
1087
+ * @param {Element} value - The current node being iterated on
1088
+ * @param {number} index - The current index in the iteration
1089
+ * @param {NodeListOf<Element>} nodes - NodeList from querySelectorAll()
1090
+ * @returns {undefined}
1091
+ */
1092
+
1093
+ /**
1094
+ * Tabs component
1095
+ *
1096
+ * @class
1097
+ * @param {HTMLElement} $module - HTML element to use for tabs
1098
+ */
1071
1099
  function Tabs ($module) {
1072
1100
  this.$module = $module;
1073
1101
  this.$tabs = $module.querySelectorAll('.govuk-tabs__tab');