Fix Nunjucks HTML indentation: Notification banner

[colinrotherham]

Notification banner changes, split out from #4448 to partially resolve #3211

[github-actions]

📋 Stats

File sizes

File	Size
dist/govuk-frontend-development.min.css	112.45 KiB
dist/govuk-frontend-development.min.js	38.58 KiB
packages/govuk-frontend/dist/govuk/all.bundle.js	78.74 KiB
packages/govuk-frontend/dist/govuk/all.bundle.mjs	73.99 KiB
packages/govuk-frontend/dist/govuk/all.mjs	3.86 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend-component.mjs	359 B
packages/govuk-frontend/dist/govuk/govuk-frontend.min.css	112.44 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend.min.js	38.57 KiB
packages/govuk-frontend/dist/govuk/i18n.mjs	5.38 KiB

Modules

File	Size
all.mjs	70.32 KiB
components/accordion/accordion.mjs	21.67 KiB
components/button/button.mjs	4.7 KiB
components/character-count/character-count.mjs	21.24 KiB
components/checkboxes/checkboxes.mjs	5.83 KiB
components/error-summary/error-summary.mjs	6.57 KiB
components/exit-this-page/exit-this-page.mjs	16.08 KiB
components/header/header.mjs	4.46 KiB
components/notification-banner/notification-banner.mjs	4.93 KiB
components/radios/radios.mjs	4.83 KiB
components/skip-link/skip-link.mjs	4.39 KiB
components/tabs/tabs.mjs	10.16 KiB

View stats and visualisations on the review app

---

Action run for 554bfd0

[github-actions]

Rendered HTML changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-disabled-with-type-as-success.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-disabled-with-type-as-success.html
index c8e141b31..2a42c1195 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-disabled-with-type-as-success.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-disabled-with-type-as-success.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">Email sent to [email protected]</p></div>
+    <p class="govuk-notification-banner__heading">
+      Email sent to [email protected]
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-explicitly-enabled-with-type-as-success.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-explicitly-enabled-with-type-as-success.html
index da0381f89..aa1c57027 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-explicitly-enabled-with-type-as-success.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-auto-focus-explicitly-enabled-with-type-as-success.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">Email sent to [email protected]</p></div>
+    <p class="govuk-notification-banner__heading">
+      Email sent to [email protected]
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-custom-tabindex.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-custom-tabindex.html
index 6cddfb4f9..85eb2b1ed 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-custom-tabindex.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-custom-tabindex.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">Email sent to [email protected]</p></div>
+    <p class="govuk-notification-banner__heading">
+      Email sent to [email protected]
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-default.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-default.html
index 831d6e518..6021cbb1b 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-default.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-default.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">This publication was withdrawn on 7 March 2014.</p></div>
+    <p class="govuk-notification-banner__heading">
+      This publication was withdrawn on 7 March 2014.
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-paragraph-as-html-heading.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-paragraph-as-html-heading.html
index e28513432..06a66f885 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-paragraph-as-html-heading.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-paragraph-as-html-heading.html
@@ -4,6 +4,7 @@
       Important
     </h2>
   </div>
-  <div class="govuk-notification-banner__content"><p class="govuk-notification-banner__heading">You have 9 days to send a response.</p>
-</div>
+  <div class="govuk-notification-banner__content">
+    <p class="govuk-notification-banner__heading">You have 9 days to send a response.</p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-rolealert-overridden-to-roleregion-with-type-as-success.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-rolealert-overridden-to-roleregion-with-type-as-success.html
index 7e2c93850..c7db2d237 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-rolealert-overridden-to-roleregion-with-type-as-success.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-rolealert-overridden-to-roleregion-with-type-as-success.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">Email sent to [email protected]</p></div>
+    <p class="govuk-notification-banner__heading">
+      Email sent to [email protected]
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-success-with-custom-html.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-success-with-custom-html.html
index 884ce2258..06419a90a 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-success-with-custom-html.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-success-with-custom-html.html
@@ -4,12 +4,13 @@
       Success
     </h2>
   </div>
-  <div class="govuk-notification-banner__content"><h3 class="govuk-notification-banner__heading">
-  4 files uploaded
-</h3>
-<ul class="govuk-!-margin-0 govuk-list">
-  <li><a href="link-1" class="govuk-notification-banner__link">government-strategy.pdf</a></li>
-  <li><a href="link-2" class="govuk-notification-banner__link">government-strategy-v1.pdf</a></li>
-</ul>
-</div>
+  <div class="govuk-notification-banner__content">
+    <h3 class="govuk-notification-banner__heading">
+      4 files uploaded
+    </h3>
+    <ul class="govuk-!-margin-0 govuk-list">
+      <li><a href="link-1" class="govuk-notification-banner__link">government-strategy.pdf</a></li>
+      <li><a href="link-2" class="govuk-notification-banner__link">government-strategy-v1.pdf</a></li>
+    </ul>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-a-list.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-a-list.html
index f6a7e9ed7..ca3c3c8d3 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-a-list.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-a-list.html
@@ -4,12 +4,13 @@
       Important
     </h2>
   </div>
-  <div class="govuk-notification-banner__content"><h3 class="govuk-notification-banner__heading">4 files uploaded</h3>
-<ul class="govuk-list govuk-list--bullet govuk-!-margin-bottom-0">
-  <li><a href="#" class="govuk-notification-banner__link">government-strategy.pdf</a></li>
-  <li><a href="#" class="govuk-notification-banner__link">government-strategy-v2.pdf</a></li>
-  <li><a href="#" class="govuk-notification-banner__link">government-strategy-v3-FINAL.pdf</a></li>
-  <li><a href="#" class="govuk-notification-banner__link">government-strategy-v4-FINAL-v2.pdf</a></li>
-</ul>
-</div>
+  <div class="govuk-notification-banner__content">
+    <h3 class="govuk-notification-banner__heading">4 files uploaded</h3>
+    <ul class="govuk-list govuk-list--bullet govuk-!-margin-bottom-0">
+      <li><a href="#" class="govuk-notification-banner__link">government-strategy.pdf</a></li>
+      <li><a href="#" class="govuk-notification-banner__link">government-strategy-v2.pdf</a></li>
+      <li><a href="#" class="govuk-notification-banner__link">government-strategy-v3-FINAL.pdf</a></li>
+      <li><a href="#" class="govuk-notification-banner__link">government-strategy-v4-FINAL-v2.pdf</a></li>
+    </ul>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-long-heading.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-long-heading.html
index 93ae6a3a5..4d526463a 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-long-heading.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-long-heading.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">This publication was withdrawn on 7 March 2014, before being sent in, sent back, queried, lost, found, subjected to public inquiry, lost again, and finally buried in soft peat for three months and recycled as firelighters.</p></div>
+    <p class="govuk-notification-banner__heading">
+      This publication was withdrawn on 7 March 2014, before being sent in, sent back, queried, lost, found, subjected to public inquiry, lost again, and finally buried in soft peat for three months and recycled as firelighters.
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-lots-of-content.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-lots-of-content.html
index 2cf3494c4..100b4d406 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-lots-of-content.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-lots-of-content.html
@@ -4,13 +4,16 @@
       Important
     </h2>
   </div>
-  <div class="govuk-notification-banner__content"><h3 class="govuk-notification-banner__heading">
-  Check if you need to apply the reverse charge to this application
-</h3>
-<p class="govuk-body">You will have to apply the <a href="#" class="govuk-notification-banner__link">reverse charge</a> if the applicant supplies any of these services:</p>
-<ul class="govuk-list govuk-list--bullet govuk-list--spaced">
-  <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>
-  <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>
-</ul>
-</div>
+  <div class="govuk-notification-banner__content">
+    <h3 class="govuk-notification-banner__heading">
+      Check if you need to apply the reverse charge to this application
+    </h3>
+    <p class="govuk-body">
+      You will have to apply the <a href="#" class="govuk-notification-banner__link">reverse charge</a> if the applicant supplies any of these services:
+    </p>
+    <ul class="govuk-list govuk-list--bullet govuk-list--spaced">
+      <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>
+      <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>
+    </ul>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-text-as-html.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-text-as-html.html
index 87d4ed65f..93210fc66 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-text-as-html.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-text-as-html.html
@@ -4,9 +4,12 @@
       Important
     </h2>
   </div>
-  <div class="govuk-notification-banner__content"><h3 class="govuk-notification-banner__heading">
-  This publication was withdrawn on 7 March 2014
-</h3>
-<p class="govuk-body">Archived and replaced by the <a href="#" class="govuk-notification-banner__link">new planning guidance</a> launched 6 March 2014 on an external website</p>
-</div>
+  <div class="govuk-notification-banner__content">
+    <h3 class="govuk-notification-banner__heading">
+      This publication was withdrawn on 7 March 2014
+    </h3>
+    <p class="govuk-body">
+      Archived and replaced by the <a href="#" class="govuk-notification-banner__link">new planning guidance</a> launched 6 March 2014 on an external website
+    </p>
+  </div>
 </div>
diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-type-as-success.html b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-type-as-success.html
index ac6939f61..7dd7a894d 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-type-as-success.html
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/template-with-type-as-success.html
@@ -5,5 +5,8 @@
     </h2>
   </div>
   <div class="govuk-notification-banner__content">
-      <p class="govuk-notification-banner__heading">Email sent to [email protected]</p></div>
+    <p class="govuk-notification-banner__heading">
+      Email sent to [email protected]
+    </p>
+  </div>
 </div>

---

Action run for 554bfd0

[github-actions]

Other changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/components/notification-banner/fixtures.json b/packages/govuk-frontend/dist/govuk/components/notification-banner/fixtures.json
index 182863e81..46305e7ba 100644
--- a/packages/govuk-frontend/dist/govuk/components/notification-banner/fixtures.json
+++ b/packages/govuk-frontend/dist/govuk/components/notification-banner/fixtures.json
@@ -9,7 +9,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "paragraph as html heading",
@@ -19,17 +19,17 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\"><p class=\"govuk-notification-banner__heading\">You have 9 days to send a response.</p>\n</div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">You have 9 days to send a response.</p>\n  </div>\n</div>"
         },
         {
             "name": "with text as html",
             "options": {
-                "html": "<h3 class=\"govuk-notification-banner__heading\">\n  This publication was withdrawn on 7 March 2014\n</h3>\n<p class=\"govuk-body\">Archived and replaced by the <a href=\"#\" class=\"govuk-notification-banner__link\">new planning guidance</a> launched 6 March 2014 on an external website</p>\n"
+                "html": "<h3 class=\"govuk-notification-banner__heading\">\n  This publication was withdrawn on 7 March 2014\n</h3>\n<p class=\"govuk-body\">\n  Archived and replaced by the <a href=\"#\" class=\"govuk-notification-banner__link\">new planning guidance</a> launched 6 March 2014 on an external website\n</p>\n"
             },
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\"><h3 class=\"govuk-notification-banner__heading\">\n  This publication was withdrawn on 7 March 2014\n</h3>\n<p class=\"govuk-body\">Archived and replaced by the <a href=\"#\" class=\"govuk-notification-banner__link\">new planning guidance</a> launched 6 March 2014 on an external website</p>\n</div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <h3 class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014\n    </h3>\n    <p class=\"govuk-body\">\n      Archived and replaced by the <a href=\"#\" class=\"govuk-notification-banner__link\">new planning guidance</a> launched 6 March 2014 on an external website\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "with type as success",
@@ -40,7 +40,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "success with custom html",
@@ -51,7 +51,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\"><h3 class=\"govuk-notification-banner__heading\">\n  4 files uploaded\n</h3>\n<ul class=\"govuk-!-margin-0 govuk-list\">\n  <li><a href=\"link-1\" class=\"govuk-notification-banner__link\">government-strategy.pdf</a></li>\n  <li><a href=\"link-2\" class=\"govuk-notification-banner__link\">government-strategy-v1.pdf</a></li>\n</ul>\n</div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <h3 class=\"govuk-notification-banner__heading\">\n      4 files uploaded\n    </h3>\n    <ul class=\"govuk-!-margin-0 govuk-list\">\n      <li><a href=\"link-1\" class=\"govuk-notification-banner__link\">government-strategy.pdf</a></li>\n      <li><a href=\"link-2\" class=\"govuk-notification-banner__link\">government-strategy-v1.pdf</a></li>\n    </ul>\n  </div>\n</div>"
         },
         {
             "name": "with a list",
@@ -61,7 +61,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\"><h3 class=\"govuk-notification-banner__heading\">4 files uploaded</h3>\n<ul class=\"govuk-list govuk-list--bullet govuk-!-margin-bottom-0\">\n  <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy.pdf</a></li>\n  <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v2.pdf</a></li>\n  <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v3-FINAL.pdf</a></li>\n  <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v4-FINAL-v2.pdf</a></li>\n</ul>\n</div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <h3 class=\"govuk-notification-banner__heading\">4 files uploaded</h3>\n    <ul class=\"govuk-list govuk-list--bullet govuk-!-margin-bottom-0\">\n      <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy.pdf</a></li>\n      <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v2.pdf</a></li>\n      <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v3-FINAL.pdf</a></li>\n      <li><a href=\"#\" class=\"govuk-notification-banner__link\">government-strategy-v4-FINAL-v2.pdf</a></li>\n    </ul>\n  </div>\n</div>"
         },
         {
             "name": "with long heading",
@@ -71,17 +71,17 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014, before being sent in, sent back, queried, lost, found, subjected to public inquiry, lost again, and finally buried in soft peat for three months and recycled as firelighters.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014, before being sent in, sent back, queried, lost, found, subjected to public inquiry, lost again, and finally buried in soft peat for three months and recycled as firelighters.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "with lots of content",
             "options": {
-                "html": "<h3 class=\"govuk-notification-banner__heading\">\n  Check if you need to apply the reverse charge to this application\n</h3>\n<p class=\"govuk-body\">You will have to apply the <a href=\"#\" class=\"govuk-notification-banner__link\">reverse charge</a> if the applicant supplies any of these services:</p>\n<ul class=\"govuk-list govuk-list--bullet govuk-list--spaced\">\n  <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>\n  <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>\n</ul>\n"
+                "html": "<h3 class=\"govuk-notification-banner__heading\">\n  Check if you need to apply the reverse charge to this application\n</h3>\n<p class=\"govuk-body\">\n  You will have to apply the <a href=\"#\" class=\"govuk-notification-banner__link\">reverse charge</a> if the applicant supplies any of these services:\n</p>\n<ul class=\"govuk-list govuk-list--bullet govuk-list--spaced\">\n  <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>\n  <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>\n</ul>\n"
             },
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\"><h3 class=\"govuk-notification-banner__heading\">\n  Check if you need to apply the reverse charge to this application\n</h3>\n<p class=\"govuk-body\">You will have to apply the <a href=\"#\" class=\"govuk-notification-banner__link\">reverse charge</a> if the applicant supplies any of these services:</p>\n<ul class=\"govuk-list govuk-list--bullet govuk-list--spaced\">\n  <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>\n  <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>\n</ul>\n</div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <h3 class=\"govuk-notification-banner__heading\">\n      Check if you need to apply the reverse charge to this application\n    </h3>\n    <p class=\"govuk-body\">\n      You will have to apply the <a href=\"#\" class=\"govuk-notification-banner__link\">reverse charge</a> if the applicant supplies any of these services:\n    </p>\n    <ul class=\"govuk-list govuk-list--bullet govuk-list--spaced\">\n      <li>constructing, altering, repairing, extending, demolishing or dismantling buildings or structures (whether permanent or not), including offshore installation services</li>\n      <li>constructing, altering, repairing, extending, demolishing of any works forming, or planned to form, part of the land, including (in particular) walls, roadworks, power lines, electronic communications equipment, aircraft runways, railways, inland waterways, docks and harbours</li>\n    </ul>\n  </div>\n</div>"
         },
         {
             "name": "auto-focus disabled, with type as success",
@@ -93,7 +93,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" data-disable-auto-focus=\"true\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" data-disable-auto-focus=\"true\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "auto-focus explicitly enabled, with type as success",
@@ -105,7 +105,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" data-disable-auto-focus=\"false\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" data-disable-auto-focus=\"false\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "role=alert overridden to role=region, with type as success",
@@ -117,7 +117,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom tabindex",
@@ -131,7 +131,7 @@
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" tabindex=\"2\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" tabindex=\"2\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom title",
@@ -142,7 +142,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important information\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important information\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "title as html",
@@ -153,7 +153,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      <span>Important information</span>\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      <span>Important information</span>\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "title html as text",
@@ -164,7 +164,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      &lt;span&gt;Important information&lt;/span&gt;\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      &lt;span&gt;Important information&lt;/span&gt;\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom title heading level",
@@ -175,7 +175,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h3 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h3>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h3 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h3>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom title id",
@@ -186,7 +186,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"my-id\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"my-id\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"my-id\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"my-id\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom title id with type as success",
@@ -198,7 +198,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"my-id\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"my-id\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">Email sent to [email protected]</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner govuk-notification-banner--success\" role=\"alert\" aria-labelledby=\"my-id\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"my-id\">\n      Success\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      Email sent to [email protected]\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom text",
@@ -208,7 +208,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "html as text",
@@ -218,7 +218,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">&lt;span&gt;This publication was withdrawn on 7 March 2014.&lt;/span&gt;</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      &lt;span&gt;This publication was withdrawn on 7 March 2014.&lt;/span&gt;\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "custom role",
@@ -229,7 +229,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"banner\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"banner\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "classes",
@@ -240,7 +240,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner app-my-class\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner app-my-class\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "attributes",
@@ -253,7 +253,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" my-attribute=\"value\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\" my-attribute=\"value\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         },
         {
             "name": "with invalid type",
@@ -264,7 +264,7 @@
             "hidden": true,
             "description": "",
             "previewLayoutModifiers": [],
-            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n      <p class=\"govuk-notification-banner__heading\">This publication was withdrawn on 7 March 2014.</p></div>\n</div>"
+            "html": "<div class=\"govuk-notification-banner\" role=\"region\" aria-labelledby=\"govuk-notification-banner-title\" data-module=\"govuk-notification-banner\">\n  <div class=\"govuk-notification-banner__header\">\n    <h2 class=\"govuk-notification-banner__title\" id=\"govuk-notification-banner-title\">\n      Important\n    </h2>\n  </div>\n  <div class=\"govuk-notification-banner__content\">\n    <p class=\"govuk-notification-banner__heading\">\n      This publication was withdrawn on 7 March 2014.\n    </p>\n  </div>\n</div>"
         }
     ]
 }

---

Action run for 554bfd0