govuk_publishing_components 16.3.0 → 16.4.0

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

@@ -22,6 +22,11 @@
                 "type": "string",
                 "required": false,
                 "description": "Link for the breadcrumbs item. If not specified, breadcrumbs item is a normal list item."
+            },
+            {
+                "name": "attributes",
+                "type": "object",
+                "description": "HTML attributes (for example data attributes) to add to the individual crumb."
             }
         ]
     },

data/node_modules/govuk-frontend/components/button/button.js

@@ -513,13 +513,14 @@ if (detect) return
  */
 
 var KEY_SPACE = 32;
+var DEBOUNCE_TIMEOUT_IN_SECONDS = 1;
+var debounceFormSubmitTimer = null;
 
 function Button ($module) {
   this.$module = $module;
 }
 
 /**
-* Add event handler for KeyDown
 * if the event target element has a role='button' and the event is key space pressed
 * then it prevents the default event and triggers a click event
 * @param {object} event event
@@ -535,12 +536,36 @@ Button.prototype.handleKeyDown = function (event) {
   }
 };
 
+/**
+* If the click quickly succeeds a previous click then nothing will happen.
+* This stops people accidentally causing multiple form submissions by
+* double clicking buttons.
+*/
+Button.prototype.debounce = function (event) {
+  var target = event.target;
+  // Check the button that is clicked on has the preventDoubleClick feature enabled
+  if (target.getAttribute('data-prevent-double-click') !== 'true') {
+    return
+  }
+
+  // If the timer is still running then we want to prevent the click from submitting the form
+  if (debounceFormSubmitTimer) {
+    event.preventDefault();
+    return false
+  }
+
+  debounceFormSubmitTimer = setTimeout(function () {
+    debounceFormSubmitTimer = null;
+  }, DEBOUNCE_TIMEOUT_IN_SECONDS * 1000);
+};
+
 /**
 * Initialise an event listener for keydown at document level
 * this will help listening for later inserted elements with a role="button"
 */
 Button.prototype.init = function () {
   this.$module.addEventListener('keydown', this.handleKeyDown);
+  this.$module.addEventListener('click', this.debounce);
 };
 
 return Button;

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

@@ -58,5 +58,11 @@
         "type": "object",
         "required": false,
         "description": "HTML attributes (for example data attributes) to add to the button component."
+    },
+    {
+        "name": "preventDoubleClick",
+        "type": "boolean",
+        "required": false,
+        "description": "Prevent accidental double clicks on submit buttons from submitting forms multiple times"
     }
 ]

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

@@ -16,7 +16,7 @@
 
 {#- Define common attributes we can use for both button and input types #}
 
-{%- set buttonAttributes %}{% if params.name %} name="{{ params.name }}"{% endif %} type="{{ params.type if params.type else 'submit' }}"{% if params.disabled %} disabled="disabled" aria-disabled="true"{% endif %}{% endset %}
+{%- set buttonAttributes %}{% if params.name %} name="{{ params.name }}"{% endif %} type="{{ params.type if params.type else 'submit' }}"{% if params.disabled %} disabled="disabled" aria-disabled="true"{% endif %}{% if params.preventDoubleClick %} data-prevent-double-click="true"{% endif %}{% endset %}
 
 {#- Actually create a button... or a link! #}
 

data/node_modules/govuk-frontend/components/character-count/macro-options.json

@@ -5,12 +5,6 @@
         "required": true,
         "description": "The id of the textarea."
     },
-    {
-        "name": "describedBy",
-        "type": "string",
-        "required": false,
-        "description": "Text or element id to add to the `aria-describedby` attribute to provide description for screenreader users."
-    },
     {
         "name": "name",
         "type": "string",

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

@@ -30,7 +30,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },

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

@@ -42,7 +42,8 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <div class="govuk-checkboxes {%- if params.classes %} {{ params.classes }}{% endif %}"

data/node_modules/govuk-frontend/components/date-input/macro-options.json

@@ -47,11 +47,23 @@
                 "required": false,
                 "description": "Attribute to [identify input purpose](https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html), for instance \"postal-code\" or \"username\". See [autofill](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill) for full list of attributes that can be used."
             },
+            {
+                "name": "pattern",
+                "type": "string",
+                "required": false,
+                "description": "Attribute to [provide a regular expression pattern](https://www.w3.org/TR/html51/sec-forms.html#the-pattern-attribute), used to match allowed character combinations for the input value."
+            },
             {
                 "name": "classes",
                 "type": "string",
                 "required": false,
                 "description": "Classes to add to date input item."
+            },
+            {
+                "name": "attributes",
+                "type": "object",
+                "required": false,
+                "description": "HTML attributes (for example data attributes) to add to the date input tag."
             }
         ]
     },
@@ -79,7 +91,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },

data/node_modules/govuk-frontend/components/date-input/template.njk

@@ -47,7 +47,8 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <div class="govuk-date-input {%- if params.classes %} {{ params.classes }}{% endif %}"
@@ -66,9 +67,8 @@
         value: item.value,
         type: "number",
         autocomplete: item.autocomplete,
-        attributes: {
-          pattern: "[0-9]*"
-        }
+        pattern: item.pattern if item.pattern else "[0-9]*",
+        attributes: item.attributes
       }) | indent(6) | trim }}
     </div>
   {% endfor %}

data/node_modules/govuk-frontend/components/error-message/macro-options.json

@@ -28,5 +28,10 @@
         "type": "object",
         "required": false,
         "description": "HTML attributes (for example data attributes) to add to the error message span tag"
+    },
+    {
+        "name": "visuallyHiddenText",
+        "type": "string",
+        "description": "A visually hidden prefix used before the error message. Defaults to \"Error\"."
     }
 ]

data/node_modules/govuk-frontend/components/error-message/template.njk

@@ -1,3 +1,6 @@
+{% set visuallyHiddenText = params.visuallyHiddenText | default("Error") -%}
+
 <span {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-error-message{%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}>
+  {% if visuallyHiddenText %}<span class="govuk-visually-hidden">{{ visuallyHiddenText }}:</span> {% endif -%}
   {{ params.html | safe if params.html else params.text }}
 </span>

data/node_modules/govuk-frontend/components/file-upload/macro-options.json

@@ -48,7 +48,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },

data/node_modules/govuk-frontend/components/file-upload/template.njk

@@ -33,7 +33,8 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <input class="govuk-file-upload {%- if params.classes %} {{ params.classes }}{% endif %} {%- if params.errorMessage %} govuk-file-upload--error{% endif %}" id="{{ params.id }}" name="{{ params.name }}" type="file"

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

@@ -4,7 +4,17 @@
         "type": "object",
         "required": false,
         "description": "Object containing options for the meta navigation.",
-        "arguments": [
+        "params": [
+            {
+                "name": "html",
+                "type": "string",
+                "description": "HTML to add to the meta section of the footer, which will appear below any links specified using meta.items."
+            },
+            {
+                "name": "text",
+                "type": "string",
+                "description": "Text to add to the meta section of the footer, which will appear below any links specified using meta.items. If meta.html is specified, this option is ignored."
+            },
             {
                 "name": "items",
                 "type": "array",
@@ -38,7 +48,7 @@
         "type": "array",
         "required": false,
         "description": "Array of items for use in the navigation section of the footer.",
-        "arguments": [
+        "params": [
             {
                 "name": "title",
                 "type": "string",
@@ -56,7 +66,7 @@
                 "type": "array",
                 "required": false,
                 "description": "Array of items to display in the list in navigation section of the footer.",
-                "arguments": [
+                "params": [
                     {
                         "name": "text",
                         "type": "string",

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

@@ -3,17 +3,17 @@
   <div class="govuk-width-container {{ params.containerClasses if params.containerClasses }}">
     {% if params.navigation %}
       <div class="govuk-footer__navigation">
-        {% for item in params.navigation %}
+        {% for nav in params.navigation %}
           <div class="govuk-footer__section">
-            <h2 class="govuk-footer__heading govuk-heading-m">{{ item.title }}</h2>
-            {% if item.items %}
+            <h2 class="govuk-footer__heading govuk-heading-m">{{ nav.title }}</h2>
+            {% if nav.items %}
               {% set listClasses %}
-                {% if item.columns %}
-                  govuk-footer__list--columns-{{ item.columns }}
+                {% if nav.columns %}
+                  govuk-footer__list--columns-{{ nav.columns }}
                 {% endif %}
               {% endset %}
               <ul class="govuk-footer__list {{ listClasses | trim }}">
-                {% for item in item.items %}
+                {% for item in nav.items %}
                   {% if item.href and item.text %}
                     <li class="govuk-footer__list-item">
                       <a class="govuk-footer__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>

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

@@ -54,7 +54,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },
@@ -62,7 +62,7 @@
         "name": "classes",
         "type": "string",
         "required": false,
-        "description": "Classes to add to the anchor tag."
+        "description": "Classes to add to the input."
     },
     {
         "name": "autocomplete",
@@ -70,6 +70,12 @@
         "required": false,
         "description": "Attribute to [identify input purpose](https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html), for instance \"postal-code\" or \"username\". See [autofill](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill) for full list of attributes that can be used."
     },
+    {
+        "name": "pattern",
+        "type": "string",
+        "required": false,
+        "description": "Attribute to [provide a regular expression pattern](https://www.w3.org/TR/html51/sec-forms.html#the-pattern-attribute), used to match allowed character combinations for the input value."
+    },
     {
         "name": "attributes",
         "type": "object",

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

@@ -33,12 +33,14 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <input class="govuk-input {%- if params.classes %} {{ params.classes }}{% endif %} {%- if params.errorMessage %} govuk-input--error{% endif %}" id="{{ params.id }}" name="{{ params.name }}" type="{{ params.type | default('text') }}"
   {%- if params.value %} value="{{ params.value}}"{% endif %}
   {%- if describedBy %} aria-describedby="{{ describedBy }}"{% endif %}
   {%- if params.autocomplete %} autocomplete="{{ params.autocomplete}}"{% endif %}
+  {%- if params.pattern %} pattern="{{ params.pattern }}"{% endif %}
   {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}>
 </div>

data/node_modules/govuk-frontend/components/inset-text/_inset-text.scss

@@ -16,12 +16,12 @@
 
     border-left: $govuk-border-width-wide solid $govuk-border-colour;
 
-    :first-child {
+    > :first-child {
       margin-top: 0;
     }
 
-    :only-child,
-    :last-child {
+    > :only-child,
+    > :last-child {
       margin-bottom: 0;
     }
   }

data/node_modules/govuk-frontend/components/inset-text/macro-options.json

@@ -21,12 +21,12 @@
         "name": "classes",
         "type": "string",
         "required": false,
-        "description": "Classes to add to the anchor tag."
+        "description": "Classes to add to the inset text container."
     },
     {
         "name": "attributes",
         "type": "object",
         "required": false,
-        "description": "HTML attributes (for example data attributes) to add to the anchor tag."
+        "description": "HTML attributes (for example data attributes) to add to the inset text container."
     }
 ]

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

@@ -30,7 +30,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },
@@ -70,12 +70,6 @@
                 "required": false,
                 "description": "Specific id attribute for the radio item. If omitted, then `idPrefix` string will be applied."
             },
-            {
-                "name": "name",
-                "type": "string",
-                "required": true,
-                "description": "Specific name for the radio item. If omitted, then component global `name` string will be applied."
-            },
             {
                 "name": "value",
                 "type": "string",

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

@@ -39,7 +39,8 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <div class="govuk-radios {%- if params.classes %} {{ params.classes }}{% endif %}{%- if isConditional %} govuk-radios--conditional{% endif -%}"

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

@@ -40,6 +40,12 @@
                 "type": "boolean",
                 "required": false,
                 "description": "Sets the option item as disabled."
+            },
+            {
+                "name": "attributes",
+                "type": "object",
+                "required": false,
+                "description": "HTML attributes (for example data attributes) to add to the option."
             }
         ]
     },
@@ -74,7 +80,7 @@
                 "name": "classes",
                 "type": "string",
                 "required": false,
-                "description": "Optional classes to add to the form group (e.g. to show error state for the whole group)"
+                "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
             }
         ]
     },
@@ -82,12 +88,12 @@
         "name": "classes",
         "type": "string",
         "required": false,
-        "description": "Classes to add to the anchor tag."
+        "description": "Classes to add to the select."
     },
     {
         "name": "attributes",
         "type": "object",
         "required": false,
-        "description": "HTML attributes (for example data attributes) to add to the anchor tag."
+        "description": "HTML attributes (for example data attributes) to add to the select."
     }
 ]

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

@@ -33,7 +33,8 @@
     classes: params.errorMessage.classes,
     attributes: params.errorMessage.attributes,
     html: params.errorMessage.html,
-    text: params.errorMessage.text
+    text: params.errorMessage.text,
+    visuallyHiddenText: params.errorMessage.visuallyHiddenText
   }) | indent(2) | trim }}
 {% endif %}
   <select class="govuk-select