govuk_publishing_components 32.1.0 → 33.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (139) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js +175 -0
  3. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-ecommerce-tracker.js +1 -1
  4. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-event-tracker.js +5 -13
  5. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js +80 -309
  6. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js +2 -2
  7. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js +140 -0
  8. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/init-ga4.js +3 -0
  9. data/app/assets/javascripts/govuk_publishing_components/analytics-ga4.js +1 -0
  10. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +12 -1
  11. data/app/assets/javascripts/govuk_publishing_components/components/single-page-notification-button.js +24 -8
  12. data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-reporter.js +83 -86
  13. data/app/assets/stylesheets/govuk_publishing_components/components/_big-number.scss +2 -5
  14. data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +1 -5
  15. data/app/assets/stylesheets/govuk_publishing_components/components/_input.scss +3 -5
  16. data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +10 -30
  17. data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +0 -7
  18. data/app/views/govuk_publishing_components/components/_accordion.html.erb +14 -1
  19. data/app/views/govuk_publishing_components/components/_error_summary.html.erb +27 -26
  20. data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +2 -2
  21. data/app/views/govuk_publishing_components/components/_phase_banner.html.erb +1 -1
  22. data/app/views/govuk_publishing_components/components/_share_links.html.erb +11 -13
  23. data/app/views/govuk_publishing_components/components/_single_page_notification_button.html.erb +1 -1
  24. data/app/views/govuk_publishing_components/components/docs/accordion.yml +15 -3
  25. data/app/views/govuk_publishing_components/components/docs/button.yml +10 -0
  26. data/app/views/govuk_publishing_components/components/docs/share_links.yml +59 -30
  27. data/app/views/govuk_publishing_components/components/docs/single_page_notification_button.yml +10 -1
  28. data/app/views/govuk_publishing_components/components/feedback/_yes_no_banner.html.erb +3 -3
  29. data/lib/govuk_publishing_components/presenters/button_helper.rb +7 -1
  30. data/lib/govuk_publishing_components/presenters/single_page_notification_button_helper.rb +25 -1
  31. data/lib/govuk_publishing_components/version.rb +1 -1
  32. data/node_modules/axe-core/axe.js +4559 -4673
  33. data/node_modules/axe-core/axe.min.js +2 -2
  34. data/node_modules/axe-core/package.json +2 -2
  35. data/node_modules/axe-core/sri-history.json +4 -0
  36. data/node_modules/govuk-frontend/README.md +1 -2
  37. data/node_modules/govuk-frontend/govuk/all.js +1398 -273
  38. data/node_modules/govuk-frontend/govuk/common/closest-attribute-value.js +70 -0
  39. data/node_modules/govuk-frontend/govuk/common/index.js +172 -0
  40. data/node_modules/govuk-frontend/govuk/common/normalise-dataset.js +373 -0
  41. data/node_modules/govuk-frontend/govuk/common.js +138 -3
  42. data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js +753 -25
  43. data/node_modules/govuk-frontend/govuk/components/accordion/fixtures.json +54 -22
  44. data/node_modules/govuk-frontend/govuk/components/accordion/macro-options.json +36 -0
  45. data/node_modules/govuk-frontend/govuk/components/accordion/template.njk +7 -1
  46. data/node_modules/govuk-frontend/govuk/components/back-link/fixtures.json +12 -12
  47. data/node_modules/govuk-frontend/govuk/components/breadcrumbs/fixtures.json +22 -22
  48. data/node_modules/govuk-frontend/govuk/components/button/_index.scss +23 -5
  49. data/node_modules/govuk-frontend/govuk/components/button/button.js +365 -107
  50. data/node_modules/govuk-frontend/govuk/components/button/fixtures.json +85 -66
  51. data/node_modules/govuk-frontend/govuk/components/button/template.njk +1 -1
  52. data/node_modules/govuk-frontend/govuk/components/character-count/_index.scss +9 -0
  53. data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js +1033 -121
  54. data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +112 -36
  55. data/node_modules/govuk-frontend/govuk/components/character-count/macro-options.json +42 -0
  56. data/node_modules/govuk-frontend/govuk/components/character-count/template.njk +27 -3
  57. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js +30 -2
  58. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +96 -93
  59. data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +46 -46
  60. data/node_modules/govuk-frontend/govuk/components/date-input/fixtures.json +50 -50
  61. data/node_modules/govuk-frontend/govuk/components/details/details.js +43 -13
  62. data/node_modules/govuk-frontend/govuk/components/details/fixtures.json +20 -20
  63. data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json +20 -20
  64. data/node_modules/govuk-frontend/govuk/components/error-summary/error-summary.js +268 -6
  65. data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json +44 -35
  66. data/node_modules/govuk-frontend/govuk/components/error-summary/template.njk +25 -21
  67. data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json +51 -39
  68. data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +26 -26
  69. data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +1 -1
  70. data/node_modules/govuk-frontend/govuk/components/footer/fixtures.json +46 -46
  71. data/node_modules/govuk-frontend/govuk/components/footer/macro-options.json +2 -2
  72. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +93 -38
  73. data/node_modules/govuk-frontend/govuk/components/header/header.js +6 -0
  74. data/node_modules/govuk-frontend/govuk/components/header/macro-options.json +8 -2
  75. data/node_modules/govuk-frontend/govuk/components/header/template.njk +4 -2
  76. data/node_modules/govuk-frontend/govuk/components/hint/fixtures.json +12 -12
  77. data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +80 -80
  78. data/node_modules/govuk-frontend/govuk/components/inset-text/fixtures.json +12 -12
  79. data/node_modules/govuk-frontend/govuk/components/label/fixtures.json +34 -34
  80. data/node_modules/govuk-frontend/govuk/components/notification-banner/fixtures.json +56 -46
  81. data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js +252 -2
  82. data/node_modules/govuk-frontend/govuk/components/notification-banner/template.njk +1 -1
  83. data/node_modules/govuk-frontend/govuk/components/pagination/_index.scss +10 -7
  84. data/node_modules/govuk-frontend/govuk/components/pagination/fixtures.json +33 -26
  85. data/node_modules/govuk-frontend/govuk/components/panel/fixtures.json +18 -18
  86. data/node_modules/govuk-frontend/govuk/components/phase-banner/fixtures.json +14 -14
  87. data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +94 -91
  88. data/node_modules/govuk-frontend/govuk/components/radios/radios.js +30 -2
  89. data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +32 -32
  90. data/node_modules/govuk-frontend/govuk/components/skip-link/fixtures.json +22 -20
  91. data/node_modules/govuk-frontend/govuk/components/skip-link/skip-link.js +10 -4
  92. data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json +50 -50
  93. data/node_modules/govuk-frontend/govuk/components/table/_index.scss +1 -1
  94. data/node_modules/govuk-frontend/govuk/components/table/fixtures.json +40 -40
  95. data/node_modules/govuk-frontend/govuk/components/tabs/fixtures.json +29 -29
  96. data/node_modules/govuk-frontend/govuk/components/tabs/tabs.js +28 -0
  97. data/node_modules/govuk-frontend/govuk/components/tag/fixtures.json +28 -28
  98. data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +34 -34
  99. data/node_modules/govuk-frontend/govuk/components/warning-text/fixtures.json +14 -14
  100. data/node_modules/govuk-frontend/govuk/core/_section-break.scss +1 -1
  101. data/node_modules/govuk-frontend/govuk/helpers/_colour.scss +2 -2
  102. data/node_modules/govuk-frontend/govuk/helpers/_links.scss +6 -6
  103. data/node_modules/govuk-frontend/govuk/i18n.js +390 -0
  104. data/node_modules/govuk-frontend/govuk/macros/i18n.njk +15 -0
  105. data/node_modules/govuk-frontend/govuk/settings/_all.scss +1 -0
  106. data/node_modules/govuk-frontend/govuk/settings/_colours-palette.scss +12 -0
  107. data/node_modules/govuk-frontend/govuk/settings/_compatibility.scss +26 -0
  108. data/node_modules/govuk-frontend/govuk/settings/_typography-font.scss +23 -0
  109. data/node_modules/govuk-frontend/govuk/settings/_typography-responsive.scss +12 -0
  110. data/node_modules/govuk-frontend/govuk/settings/_warnings.scss +53 -0
  111. data/node_modules/govuk-frontend/govuk/tools/_compatibility.scss +20 -6
  112. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Date/now.js +21 -0
  113. data/node_modules/govuk-frontend/govuk/vendor/polyfills/Element/prototype/dataset.js +300 -0
  114. data/node_modules/govuk-frontend/govuk/vendor/polyfills/String/prototype/trim.js +21 -0
  115. data/node_modules/govuk-frontend/govuk-esm/all.mjs +50 -27
  116. data/node_modules/govuk-frontend/govuk-esm/common/closest-attribute-value.mjs +15 -0
  117. data/node_modules/govuk-frontend/govuk-esm/common/index.mjs +159 -0
  118. data/node_modules/govuk-frontend/govuk-esm/common/normalise-dataset.mjs +58 -0
  119. data/node_modules/govuk-frontend/govuk-esm/common.mjs +6 -28
  120. data/node_modules/govuk-frontend/govuk-esm/components/accordion/accordion.mjs +113 -43
  121. data/node_modules/govuk-frontend/govuk-esm/components/button/button.mjs +67 -30
  122. data/node_modules/govuk-frontend/govuk-esm/components/character-count/character-count.mjs +325 -123
  123. data/node_modules/govuk-frontend/govuk-esm/components/checkboxes/checkboxes.mjs +9 -3
  124. data/node_modules/govuk-frontend/govuk-esm/components/details/details.mjs +22 -8
  125. data/node_modules/govuk-frontend/govuk-esm/components/error-summary/error-summary.mjs +48 -6
  126. data/node_modules/govuk-frontend/govuk-esm/components/header/header.mjs +6 -0
  127. data/node_modules/govuk-frontend/govuk-esm/components/notification-banner/notification-banner.mjs +32 -2
  128. data/node_modules/govuk-frontend/govuk-esm/components/radios/radios.mjs +9 -3
  129. data/node_modules/govuk-frontend/govuk-esm/components/skip-link/skip-link.mjs +10 -4
  130. data/node_modules/govuk-frontend/govuk-esm/components/tabs/tabs.mjs +8 -2
  131. data/node_modules/govuk-frontend/govuk-esm/i18n.mjs +380 -0
  132. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Date/now.mjs +13 -0
  133. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/Element/prototype/dataset.mjs +68 -0
  134. data/node_modules/govuk-frontend/govuk-esm/vendor/polyfills/String/prototype/trim.mjs +13 -0
  135. data/node_modules/govuk-frontend/govuk-prototype-kit/init.js +7 -0
  136. data/node_modules/govuk-frontend/govuk-prototype-kit/init.scss +12 -0
  137. data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +138 -7
  138. data/node_modules/govuk-frontend/package.json +1 -1
  139. metadata +22 -3
@@ -16,8 +16,8 @@
16
16
  }
17
17
  ]
18
18
  },
19
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#example-error-1\">The date your passport was issued must be in the past</a>\n \n </li>\n \n <li>\n \n <a href=\"#example-error-2\">Enter a postcode, like AA1 1AA</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
20
- "hidden": false
19
+ "hidden": false,
20
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#example-error-1\">The date your passport was issued must be in the past</a>\n \n </li>\n \n <li>\n \n <a href=\"#example-error-2\">Enter a postcode, like AA1 1AA</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
21
21
  },
22
22
  {
23
23
  "name": "without links",
@@ -29,8 +29,8 @@
29
29
  }
30
30
  ]
31
31
  },
32
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
33
- "hidden": false
32
+ "hidden": false,
33
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
34
34
  },
35
35
  {
36
36
  "name": "mixed with and without links",
@@ -46,8 +46,8 @@
46
46
  }
47
47
  ]
48
48
  },
49
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n <li>\n \n <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
50
- "hidden": false
49
+ "hidden": false,
50
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n <li>\n \n <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
51
51
  },
52
52
  {
53
53
  "name": "with everything",
@@ -64,8 +64,8 @@
64
64
  }
65
65
  ]
66
66
  },
67
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n Please fix the errors below.\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n <li>\n \n <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
68
- "hidden": false
67
+ "hidden": false,
68
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n Please fix the errors below.\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n <li>\n \n <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
69
69
  },
70
70
  {
71
71
  "name": "html as titleText",
@@ -77,8 +77,8 @@
77
77
  }
78
78
  ]
79
79
  },
80
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n Alert, &lt;em&gt;alert&lt;/em&gt;\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
81
- "hidden": true
80
+ "hidden": true,
81
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n Alert, &lt;em&gt;alert&lt;/em&gt;\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
82
82
  },
83
83
  {
84
84
  "name": "title html",
@@ -90,8 +90,8 @@
90
90
  }
91
91
  ]
92
92
  },
93
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n Alert, <em>alert</em>\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
94
- "hidden": true
93
+ "hidden": true,
94
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n Alert, <em>alert</em>\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
95
95
  },
96
96
  {
97
97
  "name": "description",
@@ -104,22 +104,22 @@
104
104
  }
105
105
  ]
106
106
  },
107
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n Lorem ipsum\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
108
- "hidden": true
107
+ "hidden": true,
108
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n Lorem ipsum\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
109
109
  },
110
110
  {
111
111
  "name": "html as descriptionText",
112
112
  "options": {
113
113
  "titleText": "There is a problem",
114
- "descriptionText": "See errors below ()",
114
+ "descriptionText": "See errors below (>)",
115
115
  "errorList": [
116
116
  {
117
117
  "text": "Invalid username or password"
118
118
  }
119
119
  ]
120
120
  },
121
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n See errors below (▼)\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
122
- "hidden": true
121
+ "hidden": true,
122
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n See errors below (&gt;)\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
123
123
  },
124
124
  {
125
125
  "name": "description html",
@@ -132,8 +132,8 @@
132
132
  }
133
133
  ]
134
134
  },
135
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n See <span>errors</span> below\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
136
- "hidden": true
135
+ "hidden": true,
136
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <p>\n See <span>errors</span> below\n </p>\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
137
137
  },
138
138
  {
139
139
  "name": "classes",
@@ -146,8 +146,8 @@
146
146
  }
147
147
  ]
148
148
  },
149
- "html": "<div class=\"govuk-error-summary extra-class one-more-class\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
150
- "hidden": true
149
+ "hidden": true,
150
+ "html": "<div class=\"govuk-error-summary extra-class one-more-class\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
151
151
  },
152
152
  {
153
153
  "name": "attributes",
@@ -163,8 +163,8 @@
163
163
  }
164
164
  ]
165
165
  },
166
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" first-attribute=\"foo\" second-attribute=\"bar\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n</div>",
167
- "hidden": true
166
+ "hidden": true,
167
+ "html": "<div class=\"govuk-error-summary\" first-attribute=\"foo\" second-attribute=\"bar\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Invalid username or password\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
168
168
  },
169
169
  {
170
170
  "name": "error list with attributes",
@@ -181,8 +181,8 @@
181
181
  }
182
182
  ]
183
183
  },
184
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#item\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">Error-1</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
185
- "hidden": true
184
+ "hidden": true,
185
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#item\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">Error-1</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
186
186
  },
187
187
  {
188
188
  "name": "error list with html as text",
@@ -194,8 +194,8 @@
194
194
  }
195
195
  ]
196
196
  },
197
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error\n \n </li>\n \n </ul>\n </div>\n</div>",
198
- "hidden": true
197
+ "hidden": true,
198
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
199
199
  },
200
200
  {
201
201
  "name": "error list with html",
@@ -207,8 +207,8 @@
207
207
  }
208
208
  ]
209
209
  },
210
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n The date your passport was issued <b>must</b> be in the past\n \n </li>\n \n </ul>\n </div>\n</div>",
211
- "hidden": true
210
+ "hidden": true,
211
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n The date your passport was issued <b>must</b> be in the past\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
212
212
  },
213
213
  {
214
214
  "name": "error list with html link",
@@ -221,8 +221,8 @@
221
221
  }
222
222
  ]
223
223
  },
224
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#error-1\">Descriptive link to the <b>question</b> with an error</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
225
- "hidden": true
224
+ "hidden": true,
225
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#error-1\">Descriptive link to the <b>question</b> with an error</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
226
226
  },
227
227
  {
228
228
  "name": "error list with html as text link",
@@ -235,8 +235,8 @@
235
235
  }
236
236
  ]
237
237
  },
238
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#error-1\">Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error</a>\n \n </li>\n \n </ul>\n </div>\n</div>",
239
- "hidden": true
238
+ "hidden": true,
239
+ "html": "<div class=\"govuk-error-summary\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n <li>\n \n <a href=\"#error-1\">Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error</a>\n \n </li>\n \n </ul>\n </div>\n </div>\n</div>"
240
240
  },
241
241
  {
242
242
  "name": "autofocus disabled",
@@ -244,8 +244,17 @@
244
244
  "titleText": "There is a problem",
245
245
  "disableAutoFocus": true
246
246
  },
247
- "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" data-disable-auto-focus=\"true\" data-module=\"govuk-error-summary\">\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n </ul>\n </div>\n</div>",
248
- "hidden": true
247
+ "hidden": true,
248
+ "html": "<div class=\"govuk-error-summary\" data-disable-auto-focus=\"true\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n </ul>\n </div>\n </div>\n</div>"
249
+ },
250
+ {
251
+ "name": "autofocus explicitly enabled",
252
+ "options": {
253
+ "titleText": "There is a problem",
254
+ "disableAutoFocus": false
255
+ },
256
+ "hidden": true,
257
+ "html": "<div class=\"govuk-error-summary\" data-disable-auto-focus=\"false\" data-module=\"govuk-error-summary\">\n \n <div role=\"alert\">\n <h2 class=\"govuk-error-summary__title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n \n <ul class=\"govuk-list govuk-error-summary__list\">\n \n </ul>\n </div>\n </div>\n</div>"
249
258
  }
250
259
  ]
251
260
  }
@@ -1,26 +1,30 @@
1
1
  <div class="govuk-error-summary
2
- {%- if params.classes %} {{ params.classes }}{% endif %}" aria-labelledby="error-summary-title" role="alert"
3
- {%- if params.disableAutoFocus %} data-disable-auto-focus="true"{% endif %}
2
+ {%- if params.classes %} {{ params.classes }}{% endif %}"
3
+ {%- if params.disableAutoFocus !== undefined %} data-disable-auto-focus="{{ params.disableAutoFocus }}"{% endif %}
4
4
  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} data-module="govuk-error-summary">
5
- <h2 class="govuk-error-summary__title" id="error-summary-title">
6
- {{ params.titleHtml | safe if params.titleHtml else params.titleText }}
7
- </h2>
8
- <div class="govuk-error-summary__body">
9
- {% if caller or params.descriptionHtml or params.descriptionText %}
10
- <p>
11
- {{ caller() if caller else (params.descriptionHtml | safe if params.descriptionHtml else params.descriptionText) }}
12
- </p>
13
- {% endif %}
14
- <ul class="govuk-list govuk-error-summary__list">
15
- {% for item in params.errorList %}
16
- <li>
17
- {% if item.href %}
18
- <a href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
19
- {% else %}
20
- {{ item.html | safe if item.html else item.text }}
5
+ {# Keep the role="alert" in a seperate child container to prevent a race condition between
6
+ the focusing js at the alert, resulting in information getting missed in screen reader announcements #}
7
+ <div role="alert">
8
+ <h2 class="govuk-error-summary__title">
9
+ {{ params.titleHtml | safe if params.titleHtml else params.titleText }}
10
+ </h2>
11
+ <div class="govuk-error-summary__body">
12
+ {% if caller or params.descriptionHtml or params.descriptionText %}
13
+ <p>
14
+ {{ caller() if caller else (params.descriptionHtml | safe if params.descriptionHtml else params.descriptionText) }}
15
+ </p>
21
16
  {% endif %}
22
- </li>
23
- {% endfor %}
24
- </ul>
17
+ <ul class="govuk-list govuk-error-summary__list">
18
+ {% for item in params.errorList %}
19
+ <li>
20
+ {% if item.href %}
21
+ <a href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
22
+ {% else %}
23
+ {{ item.html | safe if item.html else item.text }}
24
+ {% endif %}
25
+ </li>
26
+ {% endfor %}
27
+ </ul>
28
+ </div>
25
29
  </div>
26
30
  </div>
@@ -8,8 +8,8 @@
8
8
  "text": "What is your address?"
9
9
  }
10
10
  },
11
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
12
- "hidden": false
11
+ "hidden": false,
12
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
13
13
  },
14
14
  {
15
15
  "name": "styled as xl text",
@@ -19,8 +19,8 @@
19
19
  "classes": "govuk-fieldset__legend--xl"
20
20
  }
21
21
  },
22
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--xl\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
23
- "hidden": false
22
+ "hidden": false,
23
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--xl\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
24
24
  },
25
25
  {
26
26
  "name": "styled as large text",
@@ -30,8 +30,8 @@
30
30
  "classes": "govuk-fieldset__legend--l"
31
31
  }
32
32
  },
33
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
34
- "hidden": false
33
+ "hidden": false,
34
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
35
35
  },
36
36
  {
37
37
  "name": "styled as medium text",
@@ -41,8 +41,8 @@
41
41
  "classes": "govuk-fieldset__legend--m"
42
42
  }
43
43
  },
44
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
45
- "hidden": false
44
+ "hidden": false,
45
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
46
46
  },
47
47
  {
48
48
  "name": "styled as small text",
@@ -52,8 +52,8 @@
52
52
  "classes": "govuk-fieldset__legend--s"
53
53
  }
54
54
  },
55
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
56
- "hidden": false
55
+ "hidden": false,
56
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
57
57
  },
58
58
  {
59
59
  "name": "as page heading xl",
@@ -64,8 +64,8 @@
64
64
  "isPageHeading": true
65
65
  }
66
66
  },
67
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--xl\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>",
68
- "hidden": false
67
+ "hidden": false,
68
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--xl\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>"
69
69
  },
70
70
  {
71
71
  "name": "as page heading l",
@@ -76,8 +76,8 @@
76
76
  "isPageHeading": true
77
77
  }
78
78
  },
79
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>",
80
- "hidden": false
79
+ "hidden": false,
80
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>"
81
81
  },
82
82
  {
83
83
  "name": "as page heading m",
@@ -88,8 +88,8 @@
88
88
  "isPageHeading": true
89
89
  }
90
90
  },
91
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>",
92
- "hidden": false
91
+ "hidden": false,
92
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>"
93
93
  },
94
94
  {
95
95
  "name": "as page heading s",
@@ -100,8 +100,8 @@
100
100
  "isPageHeading": true
101
101
  }
102
102
  },
103
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>",
104
- "hidden": false
103
+ "hidden": false,
104
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--s\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>"
105
105
  },
106
106
  {
107
107
  "name": "as page heading without class",
@@ -111,8 +111,8 @@
111
111
  "isPageHeading": true
112
112
  }
113
113
  },
114
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>",
115
- "hidden": false
114
+ "hidden": false,
115
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n <h1 class=\"govuk-fieldset__heading\">\n What is your address?\n </h1>\n \n </legend>\n \n\n</fieldset>"
116
116
  },
117
117
  {
118
118
  "name": "html fieldset content",
@@ -122,16 +122,19 @@
122
122
  },
123
123
  "html": "<div class=\"my-content\">\n <p>This is some content to put inside the fieldset</p>\n</div>\n"
124
124
  },
125
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your address?\n \n </legend>\n \n\n <div class=\"my-content\">\n <p>This is some content to put inside the fieldset</p>\n</div>\n\n\n</fieldset>",
126
- "hidden": true
125
+ "hidden": true,
126
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is your address?\n \n </legend>\n \n\n <div class=\"my-content\">\n <p>This is some content to put inside the fieldset</p>\n</div>\n\n\n</fieldset>"
127
127
  },
128
128
  {
129
129
  "name": "with describedBy",
130
130
  "options": {
131
- "describedBy": "some-id"
131
+ "describedBy": "some-id",
132
+ "legend": {
133
+ "text": "Which option?"
134
+ }
132
135
  },
133
- "html": "<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id\">\n \n\n</fieldset>",
134
- "hidden": true
136
+ "hidden": true,
137
+ "html": "<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</fieldset>"
135
138
  },
136
139
  {
137
140
  "name": "html as text",
@@ -140,8 +143,8 @@
140
143
  "text": "What is <b>your</b> address?"
141
144
  }
142
145
  },
143
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is &lt;b&gt;your&lt;/b&gt; address?\n \n </legend>\n \n\n</fieldset>",
144
- "hidden": true
146
+ "hidden": true,
147
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is &lt;b&gt;your&lt;/b&gt; address?\n \n </legend>\n \n\n</fieldset>"
145
148
  },
146
149
  {
147
150
  "name": "html",
@@ -150,8 +153,8 @@
150
153
  "html": "What is <b>your</b> address?"
151
154
  }
152
155
  },
153
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is <b>your</b> address?\n \n </legend>\n \n\n</fieldset>",
154
- "hidden": true
156
+ "hidden": true,
157
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n What is <b>your</b> address?\n \n </legend>\n \n\n</fieldset>"
155
158
  },
156
159
  {
157
160
  "name": "legend classes",
@@ -161,34 +164,43 @@
161
164
  "classes": "my-custom-class"
162
165
  }
163
166
  },
164
- "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend my-custom-class\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>",
165
- "hidden": true
167
+ "hidden": true,
168
+ "html": "<fieldset class=\"govuk-fieldset\">\n \n <legend class=\"govuk-fieldset__legend my-custom-class\">\n \n What is your address?\n \n </legend>\n \n\n</fieldset>"
166
169
  },
167
170
  {
168
171
  "name": "classes",
169
172
  "options": {
170
- "classes": "app-fieldset--custom-modifier"
173
+ "classes": "app-fieldset--custom-modifier",
174
+ "legend": {
175
+ "text": "Which option?"
176
+ }
171
177
  },
172
- "html": "<fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\">\n \n\n</fieldset>",
173
- "hidden": true
178
+ "hidden": true,
179
+ "html": "<fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which option?\n \n </legend>\n \n\n</fieldset>"
174
180
  },
175
181
  {
176
182
  "name": "role",
177
183
  "options": {
178
- "role": "group"
184
+ "role": "group",
185
+ "legend": {
186
+ "text": "Which option?"
187
+ }
179
188
  },
180
- "html": "<fieldset class=\"govuk-fieldset\" role=\"group\">\n \n\n</fieldset>",
181
- "hidden": true
189
+ "hidden": true,
190
+ "html": "<fieldset class=\"govuk-fieldset\" role=\"group\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which option?\n \n </legend>\n \n\n</fieldset>"
182
191
  },
183
192
  {
184
193
  "name": "attributes",
185
194
  "options": {
186
195
  "attributes": {
187
196
  "data-attribute": "value"
197
+ },
198
+ "legend": {
199
+ "text": "Which option?"
188
200
  }
189
201
  },
190
- "html": "<fieldset class=\"govuk-fieldset\" data-attribute=\"value\">\n \n\n</fieldset>",
191
- "hidden": true
202
+ "hidden": true,
203
+ "html": "<fieldset class=\"govuk-fieldset\" data-attribute=\"value\">\n \n <legend class=\"govuk-fieldset__legend\">\n \n Which option?\n \n </legend>\n \n\n</fieldset>"
192
204
  }
193
205
  ]
194
206
  }