defra_ruby_template 3.13.0

data/node_modules/govuk-frontend/govuk/components/checkboxes/macro-options.json

@@ -0,0 +1,161 @@
+[
+    {
+        "name": "describedBy",
+        "type": "string",
+        "required": false,
+        "description": "One or more element IDs to add to the input `aria-describedby` attribute without a fieldset, used to provide additional descriptive information for screenreader users."
+    },
+    {
+        "name": "fieldset",
+        "type": "object",
+        "required": false,
+        "description": "Options for the fieldset component (for example legend).",
+        "isComponent": true
+    },
+    {
+        "name": "hint",
+        "type": "object",
+        "required": false,
+        "description": "Options for the hint component (for example text).",
+        "isComponent": true
+    },
+    {
+        "name": "errorMessage",
+        "type": "object",
+        "required": false,
+        "description": "Options for the error message component. The error message component will not display if you use a falsy value for `errorMessage`, for example `false` or `null`.",
+        "isComponent": true
+    },
+    {
+        "name": "formGroup",
+        "type": "object",
+        "required": false,
+        "description": "Options for the form-group wrapper",
+        "params": [
+            {
+                "name": "classes",
+                "type": "string",
+                "required": false,
+                "description": "Classes to add to the form group (for example to show error state for the whole group)"
+            }
+        ]
+    },
+    {
+        "name": "idPrefix",
+        "type": "string",
+        "required": false,
+        "description": "String to prefix id for each checkbox item if no id is specified on each item. If not passed, fall back to using the name option instead."
+    },
+    {
+        "name": "name",
+        "type": "string",
+        "required": true,
+        "description": "Name attribute for all checkbox items."
+    },
+    {
+        "name": "items",
+        "type": "array",
+        "required": true,
+        "description": "Array of checkbox items objects.",
+        "params": [
+            {
+                "name": "text",
+                "type": "string",
+                "required": true,
+                "description": "If `html` is set, this is not required. Text to use within each checkbox item label. If `html` is provided, the `text` argument will be ignored."
+            },
+            {
+                "name": "html",
+                "type": "string",
+                "required": true,
+                "description": "If `text` is set, this is not required. HTML to use within each checkbox item label. If `html` is provided, the `text` argument will be ignored."
+            },
+            {
+                "name": "id",
+                "type": "string",
+                "required": false,
+                "description": "Specific id attribute for the checkbox item. If omitted, then component global `idPrefix` option will be applied."
+            },
+            {
+                "name": "name",
+                "type": "string",
+                "required": false,
+                "description": "Specific name for the checkbox item. If omitted, then component global `name` string will be applied."
+            },
+            {
+                "name": "value",
+                "type": "string",
+                "required": true,
+                "description": "Value for the checkbox input."
+            },
+            {
+                "name": "label",
+                "type": "object",
+                "required": false,
+                "description": "Provide attributes and classes to each checkbox item label.",
+                "isComponent": true
+            },
+            {
+                "name": "hint",
+                "type": "object",
+                "required": false,
+                "description": "Provide hint to each checkbox item.",
+                "isComponent": true
+            },
+            {
+                "name": "divider",
+                "type": "string",
+                "required": false,
+                "description": "Divider text to separate checkbox items, for example the text \"or\"."
+            },
+            {
+                "name": "checked",
+                "type": "boolean",
+                "required": false,
+                "description": "If true, checkbox will be checked."
+            },
+            {
+                "name": "conditional",
+                "type": "boolean",
+                "required": false,
+                "description": "If true, content provided will be revealed when the item is checked."
+            },
+            {
+                "name": "conditional.html",
+                "type": "string",
+                "required": false,
+                "description": "Provide content for the conditional reveal."
+            },
+            {
+                "name": "behaviour",
+                "type": "string",
+                "required": false,
+                "description": "If set to `exclusive`, implements a \"None of these\" type behaviour via javascript when checkboxes are clicked"
+            },
+            {
+                "name": "disabled",
+                "type": "boolean",
+                "required": false,
+                "description": "If true, checkbox will be disabled."
+            },
+            {
+                "name": "attributes",
+                "type": "object",
+                "required": false,
+                "description": "HTML attributes (for example data attributes) to add to the checkbox input tag."
+            }
+        ]
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the checkboxes container."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the anchor tag."
+    }
+]

data/node_modules/govuk-frontend/govuk/components/checkboxes/macro.njk

@@ -0,0 +1,3 @@
+{% macro govukCheckboxes(params) %}
+  {%- include "./template.njk" -%}
+{% endmacro %}

data/node_modules/govuk-frontend/govuk/components/checkboxes/template.njk

@@ -0,0 +1,119 @@
+{% from "../error-message/macro.njk" import govukErrorMessage -%}
+{% from "../fieldset/macro.njk" import govukFieldset %}
+{% from "../hint/macro.njk" import govukHint %}
+{% from "../label/macro.njk" import govukLabel %}
+
+{#- If an id 'prefix' is not passed, fall back to using the name attribute
+   instead. We need this for error messages and hints as well -#}
+{% set idPrefix = params.idPrefix if params.idPrefix else params.name %}
+
+{#- a record of other elements that we need to associate with the input using
+   aria-describedby – for example hints or error messages -#}
+{% set describedBy = params.describedBy if params.describedBy else "" %}
+{% if params.fieldset.describedBy %}
+   {% set describedBy = params.fieldset.describedBy %}
+{% endif %}
+
+{#- fieldset is false by default -#}
+{% set hasFieldset = true if params.fieldset else false %}
+
+{#- Capture the HTML so we can optionally nest it in a fieldset -#}
+{% set innerHtml %}
+{% if params.hint %}
+  {% set hintId = idPrefix + '-hint' %}
+  {% set describedBy = describedBy + ' ' + hintId if describedBy else hintId %}
+  {{ govukHint({
+    id: hintId,
+    classes: params.hint.classes,
+    attributes: params.hint.attributes,
+    html: params.hint.html,
+    text: params.hint.text
+  }) | indent(2) | trim }}
+{% endif %}
+{% if params.errorMessage %}
+  {% set errorId = idPrefix + '-error' %}
+  {% set describedBy = describedBy + ' ' + errorId if describedBy else errorId %}
+  {{ govukErrorMessage({
+    id: errorId,
+    classes: params.errorMessage.classes,
+    attributes: params.errorMessage.attributes,
+    html: params.errorMessage.html,
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
+  }) | indent(2) | trim }}
+{% endif %}
+  <div class="govuk-checkboxes {%- if params.classes %} {{ params.classes }}{% endif %}"
+    {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}
+    data-module="govuk-checkboxes">
+    {% for item in params.items %}
+      {% if item %}
+        {#- If the user explicitly sets an id, use this instead of the regular idPrefix -#}
+        {%- if item.id -%}
+          {%- set id = item.id -%}
+        {%- else -%}
+          {#- The first id should not have a number suffix so it's easy to link to from the error summary component -#}
+          {%- if loop.first -%}
+            {%- set id = idPrefix %}
+          {% else %}
+            {%- set id = idPrefix + "-" + loop.index -%}
+          {%- endif -%}
+        {%- endif -%}
+        {% set name = item.name if item.name else params.name %}
+        {% set conditionalId = "conditional-" + id %}
+        {%- if item.divider %}
+          <div class="govuk-checkboxes__divider">{{ item.divider }}</div>
+        {%- else %}
+          {% set hasHint = true if item.hint.text or item.hint.html %}
+          {% set itemHintId = id + "-item-hint" if hasHint else "" %}
+          {% set itemDescribedBy = describedBy if not hasFieldset else "" %}
+          {% set itemDescribedBy = (itemDescribedBy + " " + itemHintId) | trim %}
+          <div class="govuk-checkboxes__item">
+            <input class="govuk-checkboxes__input" id="{{ id }}" name="{{ name }}" type="checkbox" value="{{ item.value }}"
+            {{-" checked" if item.checked }}
+            {{-" disabled" if item.disabled }}
+            {%- if item.conditional.html %} data-aria-controls="{{ conditionalId }}"{% endif -%}
+            {%- if item.behaviour %} data-behaviour="{{ item.behaviour }}"{% endif -%}
+            {%- if itemDescribedBy %} aria-describedby="{{ itemDescribedBy }}"{% endif -%}
+            {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}>
+            {{ govukLabel({
+              html: item.html,
+              text: item.text,
+              classes: 'govuk-checkboxes__label' + (' ' + item.label.classes if item.label.classes),
+              attributes: item.label.attributes,
+              for: id
+            }) | indent(6) | trim }}
+            {% if hasHint %}
+            {{ govukHint({
+              id: itemHintId,
+              classes: 'govuk-checkboxes__hint' + (' ' + item.hint.classes if item.hint.classes),
+              attributes: item.hint.attributes,
+              html: item.hint.html,
+              text: item.hint.text
+            }) | indent(6) | trim }}
+            {% endif %}
+          </div>
+          {% if item.conditional.html %}
+            <div class="govuk-checkboxes__conditional{% if not item.checked %} govuk-checkboxes__conditional--hidden{% endif %}" id="{{ conditionalId }}">
+              {{ item.conditional.html | safe }}
+            </div>
+          {% endif %}
+        {% endif %}
+      {% endif %}
+    {% endfor %}
+  </div>
+{% endset -%}
+
+<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}">
+{% if params.fieldset %}
+  {% call govukFieldset({
+    describedBy: describedBy,
+    classes: params.fieldset.classes,
+    attributes: params.fieldset.attributes,
+    legend: params.fieldset.legend
+  }) %}
+  {{ innerHtml | trim | safe }}
+  {% endcall %}
+{% else %}
+  {{ innerHtml | trim | safe }}
+{% endif %}
+</div>

data/node_modules/govuk-frontend/govuk/components/cookie-banner/README.md

@@ -0,0 +1,15 @@
+# Cookie banner
+
+## Installation
+
+See the [main README quick start guide](https://github.com/alphagov/govuk-frontend#quick-start) for how to install this component.
+
+## Guidance and Examples
+
+Find out when to use the cookie banner component in your service in the [GOV.UK Design System](https://design-system.service.gov.uk/components/cookie-banner).
+
+## Component options
+
+Use options to customise the appearance, content and behaviour of a component when using a macro, for example, changing the text.
+
+See [options table](https://design-system.service.gov.uk/components/cookie-banner/#options-default-cookie-banner-example) for details.

data/node_modules/govuk-frontend/govuk/components/cookie-banner/_cookie-banner.scss

@@ -0,0 +1,2 @@
+@import "../../base";
+@import "./index";

data/node_modules/govuk-frontend/govuk/components/cookie-banner/_index.scss

@@ -0,0 +1,51 @@
+@include govuk-exports("govuk/component/cookie-banner") {
+
+  // This needs to be kept in sync with the header component's styles
+  $border-bottom-width: govuk-spacing(2);
+
+  .govuk-cookie-banner {
+    @include govuk-font($size: 19);
+
+    padding-top: govuk-spacing(4);
+    // The component does not set bottom spacing.
+    // The bottom spacing should be created by the items inside the component.
+
+    // Visually separate the cookie banner from content underneath
+    // when user changes colours in their browser.
+    border-bottom: $border-bottom-width solid transparent;
+
+    background-color: govuk-colour("light-grey", $legacy: "grey-3");
+  }
+
+  // Support older browsers which don't hide elements with the `hidden` attribute
+  // when user hides the whole cookie banner with a 'Hide' button.
+  .govuk-cookie-banner[hidden] {
+    display: none;
+  }
+
+  .govuk-cookie-banner__message {
+    // Remove the extra height added by the separator border.
+    margin-bottom: -$border-bottom-width;
+
+    &[hidden] {
+      // Support older browsers which don't hide elements with the `hidden` attribute
+      // when the visibility of cookie and replacement messages is toggled.
+      display: none;
+    }
+
+    &:focus {
+      // Remove the native visible focus indicator when the element is programmatically focused.
+      //
+      // The focused cookie banner is the first element on the page and the last thing the user
+      // interacted with prior to it gaining focus.
+      // We therefore assume that moving focus to it is not going to surprise users, and that giving
+      // it a visible focus indicator could be more confusing than helpful, especially as the
+      // element is not normally keyboard operable.
+      //
+      // We have flagged this in the research section of the guidance as something to monitor.
+      //
+      // A related discussion: https://github.com/w3c/wcag/issues/1001
+      outline: none;
+    }
+  }
+}

data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json

@@ -0,0 +1,443 @@
+{
+    "component": "cookie-banner",
+    "fixtures": [
+        {
+            "name": "default",
+            "options": {
+                "messages": [
+                    {
+                        "headingText": "Cookies on this government service",
+                        "text": "We use analytics cookies to help understand how users use our service.",
+                        "actions": [
+                            {
+                                "text": "Accept analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "accept"
+                            },
+                            {
+                                "text": "Reject analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "reject"
+                            },
+                            {
+                                "text": "View cookie preferences",
+                                "href": "/cookie-preferences"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this government service</h2>\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use analytics cookies to help understand how users use our service.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Accept analytics cookies\n            </button>\n          \n        \n          \n            <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Reject analytics cookies\n            </button>\n          \n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": false
+        },
+        {
+            "name": "accepted confirmation banner",
+            "options": {
+                "messages": [
+                    {
+                        "text": "Your cookie preferences have been saved. You have accepted cookies.",
+                        "role": "alert",
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": false
+        },
+        {
+            "name": "rejected confirmation banner",
+            "options": {
+                "messages": [
+                    {
+                        "text": "Your cookie preferences have been saved. You have rejected cookies.",
+                        "role": "alert",
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": false
+        },
+        {
+            "name": "client-side implementation",
+            "options": {
+                "messages": [
+                    {
+                        "headingText": "Cookies on this service",
+                        "text": "We use cookies to help understand how users use our service.",
+                        "actions": [
+                            {
+                                "text": "Accept analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "accept"
+                            },
+                            {
+                                "text": "Reject analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "reject"
+                            },
+                            {
+                                "text": "View cookie preferences",
+                                "href": "/cookie-preferences"
+                            }
+                        ]
+                    },
+                    {
+                        "text": "Your cookie preferences have been saved. You have accepted cookies.",
+                        "role": "alert",
+                        "hidden": true,
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    },
+                    {
+                        "text": "Your cookie preferences have been saved. You have rejected cookies.",
+                        "role": "alert",
+                        "hidden": true,
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Accept analytics cookies\n            </button>\n          \n        \n          \n            <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Reject analytics cookies\n            </button>\n          \n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n     hidden>\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n     hidden>\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": false
+        },
+        {
+            "name": "heading html",
+            "options": {
+                "messages": [
+                    {
+                        "headingHtml": "Cookies on <span>my service</span>"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on <span>my service</span></h2>\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "heading html as text",
+            "options": {
+                "messages": [
+                    {
+                        "headingText": "Cookies on <span>my service</span>"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on &lt;span&gt;my service&lt;/span&gt;</h2>\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "html",
+            "options": {
+                "messages": [
+                    {
+                        "html": "<p class=\"govuk-body\">We use cookies in <span>our service</span>.</p>"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies in <span>our service</span>.</p></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "classes",
+            "options": {
+                "messages": [
+                    {
+                        "classes": "app-my-class"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n      \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container app-my-class\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "attributes",
+            "options": {
+                "messages": [
+                    {
+                        "attributes": {
+                            "data-attribute": "my-value"
+                        }
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" data-attribute=\"my-value\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "custom aria label",
+            "options": {
+                "ariaLabel": "Cookies on GOV.UK",
+                "messages": [
+                    {
+                        "text": "We use cookies on GOV.UK"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookies on GOV.UK\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies on GOV.UK</p></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "hidden",
+            "options": {
+                "messages": [
+                    {
+                        "hidden": true
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n     hidden>\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "hidden false",
+            "options": {
+                "messages": [
+                    {
+                        "hidden": false
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "default action",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "This is a button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button class=\"govuk-button\" data-module=\"govuk-button\">\n              This is a button\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "link",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "This is a link",
+                                "href": "/link"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "link with false button options",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "This is a link",
+                                "href": "/link",
+                                "value": "cookies",
+                                "name": "link"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "link as a button",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "This is a link",
+                                "href": "/link",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            \n              <a href=\"/link\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\">\n              This is a link\n            </a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "type",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "Button",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Button\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "button classes",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "Button with custom classes",
+                                "classes": "my-button-class app-button-class"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button class=\"govuk-button my-button-class app-button-class\" data-module=\"govuk-button\">\n              Button with custom classes\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "button attributes",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "Button with attributes",
+                                "attributes": {
+                                    "data-button-attribute": "my-value"
+                                }
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button class=\"govuk-button\" data-module=\"govuk-button\" data-button-attribute=\"my-value\">\n              Button with attributes\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "link classes",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "Link with custom classes",
+                                "href": "/my-link",
+                                "classes": "my-link-class app-link-class"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            \n              \n              \n                \n              \n              <a class=\"govuk-link my-link-class app-link-class\" href=\"/my-link\">Link with custom classes</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "link attributes",
+            "options": {
+                "messages": [
+                    {
+                        "actions": [
+                            {
+                                "text": "Link with attributes",
+                                "href": "/link",
+                                "attributes": {
+                                    "data-link-attribute": "my-value"
+                                }
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/link\" data-link-attribute=\"my-value\">Link with attributes</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        },
+        {
+            "name": "full banner hidden",
+            "options": {
+                "hidden": true,
+                "classes": "hide-cookie-banner",
+                "attributes": {
+                    "data-hide-cookie-banner": "true"
+                },
+                "messages": [
+                    {
+                        "headingText": "Cookies on this service",
+                        "text": "We use cookies to help understand how users use our service.",
+                        "actions": [
+                            {
+                                "text": "Accept analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "accept"
+                            },
+                            {
+                                "text": "Reject analytics cookies",
+                                "type": "submit",
+                                "name": "cookies",
+                                "value": "reject"
+                            },
+                            {
+                                "text": "View cookie preferences",
+                                "href": "/cookie-preferences"
+                            }
+                        ]
+                    },
+                    {
+                        "text": "Your cookie preferences have been saved. You have accepted cookies.",
+                        "role": "alert",
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    },
+                    {
+                        "text": "Your cookie preferences have been saved. You have rejected cookies.",
+                        "role": "alert",
+                        "actions": [
+                            {
+                                "text": "Hide this message",
+                                "type": "button"
+                            }
+                        ]
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-cookie-banner hide-cookie-banner\" data-nosnippet role=\"region\" aria-label=\"Cookie banner\" hidden data-hide-cookie-banner=\"true\">\n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Accept analytics cookies\n            </button>\n          \n        \n          \n            <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Reject analytics cookies\n            </button>\n          \n        \n          \n            \n              \n              \n              <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n            \n          \n        \n      </div>\n      \n    </div>\n  \n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n    \n    \n\n    <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n    >\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        \n\n        <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n      </div>\n    </div>\n\n      \n      <div class=\"govuk-button-group\">\n        \n          \n            <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n              Hide this message\n            </button>\n          \n        \n      </div>\n      \n    </div>\n  \n</div>",
+            "hidden": true
+        }
+    ]
+}