govuk_publishing_components 32.1.0 → 33.0.0

data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js

@@ -501,8 +501,247 @@ if (detect) return
 })
 .call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {});
 
-function NotificationBanner ($module) {
+/**
+ * Common helpers which do not require polyfill.
+ *
+ * IMPORTANT: If a helper require a polyfill, please isolate it in its own module
+ * so that the polyfill can be properly tree-shaken and does not burden
+ * the components that do not need that helper
+ *
+ * @module common/index
+ */
+
+/**
+ * Config flattening function
+ *
+ * Takes any number of objects, flattens them into namespaced key-value pairs,
+ * (e.g. {'i18n.showSection': 'Show section'}) and combines them together, with
+ * greatest priority on the LAST item passed in.
+ *
+ * @returns {object} A flattened object of key-value pairs.
+ */
+function mergeConfigs (/* configObject1, configObject2, ...configObjects */) {
+  /**
+   * Function to take nested objects and flatten them to a dot-separated keyed
+   * object. Doing this means we don't need to do any deep/recursive merging of
+   * each of our objects, nor transform our dataset from a flat list into a
+   * nested object.
+   *
+   * @param {object} configObject - Deeply nested object
+   * @returns {object} Flattened object with dot-separated keys
+   */
+  var flattenObject = function (configObject) {
+    // Prepare an empty return object
+    var flattenedObject = {};
+
+    // Our flattening function, this is called recursively for each level of
+    // depth in the object. At each level we prepend the previous level names to
+    // the key using `prefix`.
+    var flattenLoop = function (obj, prefix) {
+      // Loop through keys...
+      for (var key in obj) {
+        // Check to see if this is a prototypical key/value,
+        // if it is, skip it.
+        if (!Object.prototype.hasOwnProperty.call(obj, key)) {
+          continue
+        }
+        var value = obj[key];
+        var prefixedKey = prefix ? prefix + '.' + key : key;
+        if (typeof value === 'object') {
+          // If the value is a nested object, recurse over that too
+          flattenLoop(value, prefixedKey);
+        } else {
+          // Otherwise, add this value to our return object
+          flattenedObject[prefixedKey] = value;
+        }
+      }
+    };
+
+    // Kick off the recursive loop
+    flattenLoop(configObject);
+    return flattenedObject
+  };
+
+  // Start with an empty object as our base
+  var formattedConfigObject = {};
+
+  // Loop through each of the remaining passed objects and push their keys
+  // one-by-one into configObject. Any duplicate keys will override the existing
+  // key with the new value.
+  for (var i = 0; i < arguments.length; i++) {
+    var obj = flattenObject(arguments[i]);
+    for (var key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key)) {
+        formattedConfigObject[key] = obj[key];
+      }
+    }
+  }
+
+  return formattedConfigObject
+}
+
+/**
+ * @callback nodeListIterator
+ * @param {Element} value - The current node being iterated on
+ * @param {number} index - The current index in the iteration
+ * @param {NodeListOf<Element>} nodes - NodeList from querySelectorAll()
+ * @returns {undefined}
+ */
+
+(function(undefined) {
+
+  // Detection from https://raw.githubusercontent.com/Financial-Times/polyfill-library/13cf7c340974d128d557580b5e2dafcd1b1192d1/polyfills/Element/prototype/dataset/detect.js
+  var detect = (function(){
+    if (!document.documentElement.dataset) {
+      return false;
+    }
+    var el = document.createElement('div');
+    el.setAttribute("data-a-b", "c");
+    return el.dataset && el.dataset.aB == "c";
+  }());
+
+  if (detect) return
+
+  // Polyfill derived from  https://raw.githubusercontent.com/Financial-Times/polyfill-library/13cf7c340974d128d557580b5e2dafcd1b1192d1/polyfills/Element/prototype/dataset/polyfill.js
+  Object.defineProperty(Element.prototype, 'dataset', {
+    get: function() {
+      var element = this;
+      var attributes = this.attributes;
+      var map = {};
+  
+      for (var i = 0; i < attributes.length; i++) {
+        var attribute = attributes[i];
+  
+        // This regex has been edited from the original polyfill, to add
+        // support for period (.) separators in data-* attribute names. These
+        // are allowed in the HTML spec, but were not covered by the original
+        // polyfill's regex. We use periods in our i18n implementation.
+        if (attribute && attribute.name && (/^data-\w[.\w-]*$/).test(attribute.name)) {
+          var name = attribute.name;
+          var value = attribute.value;
+  
+          var propName = name.substr(5).replace(/-./g, function (prop) {
+            return prop.charAt(1).toUpperCase();
+          });
+          
+          // If this browser supports __defineGetter__ and __defineSetter__,
+          // continue using defineProperty. If not (like IE 8 and below), we use
+          // a hacky fallback which at least gives an object in the right format
+          if ('__defineGetter__' in Object.prototype && '__defineSetter__' in Object.prototype) {
+            Object.defineProperty(map, propName, {
+              enumerable: true,
+              get: function() {
+                return this.value;
+              }.bind({value: value || ''}),
+              set: function setter(name, value) {
+                if (typeof value !== 'undefined') {
+                  this.setAttribute(name, value);
+                } else {
+                  this.removeAttribute(name);
+                }
+              }.bind(element, name)
+            });
+          } else {
+            map[propName] = value;
+          }
+
+        }
+      }
+  
+      return map;
+    }
+  });
+
+}).call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {});
+
+(function(undefined) {
+
+    // Detection from https://github.com/mdn/content/blob/cf607d68522cd35ee7670782d3ee3a361eaef2e4/files/en-us/web/javascript/reference/global_objects/string/trim/index.md#polyfill
+    var detect = ('trim' in String.prototype);
+    
+    if (detect) return
+
+    // Polyfill from https://github.com/mdn/content/blob/cf607d68522cd35ee7670782d3ee3a361eaef2e4/files/en-us/web/javascript/reference/global_objects/string/trim/index.md#polyfill
+    String.prototype.trim = function () {
+        return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
+    };
+
+}).call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {});
+
+/**
+ * Normalise string
+ *
+ * 'If it looks like a duck, and it quacks like a duck…' 🦆
+ *
+ * If the passed value looks like a boolean or a number, convert it to a boolean
+ * or number.
+ *
+ * Designed to be used to convert config passed via data attributes (which are
+ * always strings) into something sensible.
+ *
+ * @param {string} value - The value to normalise
+ * @returns {string | boolean | number | undefined} Normalised data
+ */
+function normaliseString (value) {
+  if (typeof value !== 'string') {
+    return value
+  }
+
+  var trimmedValue = value.trim();
+
+  if (trimmedValue === 'true') {
+    return true
+  }
+
+  if (trimmedValue === 'false') {
+    return false
+  }
+
+  // Empty / whitespace-only strings are considered finite so we need to check
+  // the length of the trimmed string as well
+  if (trimmedValue.length > 0 && isFinite(trimmedValue)) {
+    return Number(trimmedValue)
+  }
+
+  return value
+}
+
+/**
+ * Normalise dataset
+ *
+ * Loop over an object and normalise each value using normaliseData function
+ *
+ * @param {DOMStringMap} dataset - HTML element dataset
+ * @returns {Object<string, string | boolean | number | undefined>} Normalised dataset
+ */
+function normaliseDataset (dataset) {
+  var out = {};
+
+  for (var key in dataset) {
+    out[key] = normaliseString(dataset[key]);
+  }
+
+  return out
+}
+
+/**
+ * Notification Banner component
+ *
+ * @class
+ * @param {HTMLElement} $module - HTML element to use for notification banner
+ * @param {NotificationBannerConfig} config - Notification banner config
+ */
+function NotificationBanner ($module, config) {
   this.$module = $module;
+
+  var defaultConfig = {
+    disableAutoFocus: false
+  };
+  this.config = mergeConfigs(
+    defaultConfig,
+    config || {},
+    normaliseDataset($module.dataset)
+  );
 }
 
 /**
@@ -531,7 +770,7 @@ NotificationBanner.prototype.init = function () {
 NotificationBanner.prototype.setFocus = function () {
   var $module = this.$module;
 
-  if ($module.getAttribute('data-disable-auto-focus') === 'true') {
+  if (this.config.disableAutoFocus) {
     return
   }
 
@@ -553,6 +792,17 @@ NotificationBanner.prototype.setFocus = function () {
   $module.focus();
 };
 
+/**
+ * Notification banner config
+ *
+ * @typedef {object} NotificationBannerConfig
+ * @property {boolean} [disableAutoFocus = false] -
+ *   If set to `true` the notification banner will not be focussed when the page
+ *   loads. This only applies if the component has a `role` of `alert` – in
+ *   other cases the component will not be focused on page load, regardless of
+ *   this option.
+ */
+
 return NotificationBanner;
 
 })));

data/node_modules/govuk-frontend/govuk/components/notification-banner/template.njk

@@ -29,7 +29,7 @@
 <div class="govuk-notification-banner{% if typeClass %} {{ typeClass }}{% endif %}{% if params.classes %} {{ params.classes }}{% endif %}" role="{{ role }}"
   aria-labelledby="{{ params.titleId | default('govuk-notification-banner-title')}}"
   data-module="govuk-notification-banner"
-  {%- if params.disableAutoFocus %} data-disable-auto-focus="true"{% endif %}
+  {%- if params.disableAutoFocus !== undefined %} data-disable-auto-focus="{{ params.disableAutoFocus }}"{% endif %}
   {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
   <div class="govuk-notification-banner__header">
     <h{{ params.titleHeadingLevel | default(2) }} class="govuk-notification-banner__title" id="{{ params.titleId | default('govuk-notification-banner-title') }}" >

data/node_modules/govuk-frontend/govuk/components/pagination/_index.scss

@@ -114,13 +114,16 @@
     display: block;
     min-width: govuk-spacing(3);
 
-    &:after {
-      content: "";
-      position: absolute;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
+    // Increase the touch area for the link to the parent element.
+    @media screen {
+      &:after {
+        content: "";
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+      }
     }
 
     // Add link hover decoration to prev/next text if no label present on prev/next only mode

data/node_modules/govuk-frontend/govuk/components/pagination/fixtures.json

@@ -17,6 +17,7 @@
                     },
                     {
                         "number": 2,
+                        "href": "/page/2",
                         "current": true
                     },
                     {
@@ -25,8 +26,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page 2\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "with custom navigation landmark",
@@ -45,6 +46,7 @@
                     },
                     {
                         "number": 2,
+                        "href": "/page/2",
                         "current": true
                     },
                     {
@@ -53,8 +55,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"search\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page 2\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"search\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "with custom link and item text",
@@ -74,6 +76,7 @@
                     },
                     {
                         "number": "two",
+                        "href": "/page/2",
                         "current": true
                     },
                     {
@@ -82,8 +85,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page one\">\n              one\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page two\" aria-current=\"page\">\n              two\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page three\">\n              three\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next page</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page one\">\n              one\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page two\" aria-current=\"page\">\n              two\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page three\">\n              three\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next page</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "with custom accessible labels on item links",
@@ -102,6 +105,7 @@
                     },
                     {
                         "number": 2,
+                        "href": "/page/2",
                         "current": true,
                         "visuallyHiddenText": "2nd page (you are currently on this page)"
                     },
@@ -112,8 +116,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"1st page\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"2nd page (you are currently on this page)\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"3rd page\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"1st page\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"2nd page (you are currently on this page)\" aria-current=\"page\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"3rd page\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "with many pages",
@@ -142,6 +146,7 @@
                     },
                     {
                         "number": 10,
+                        "href": "/page/10",
                         "current": true
                     },
                     {
@@ -161,8 +166,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--ellipses\">&ctdot;</li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/8\" aria-label=\"Page 8\">\n              8\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/9\" aria-label=\"Page 9\">\n              9\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page 10\" aria-current=\"page\">\n              10\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/11\" aria-label=\"Page 11\">\n              11\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/12\" aria-label=\"Page 12\">\n              12\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--ellipses\">&ctdot;</li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/40\" aria-label=\"Page 40\">\n              40\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--ellipses\">&ctdot;</li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/8\" aria-label=\"Page 8\">\n              8\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/9\" aria-label=\"Page 9\">\n              9\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/10\" aria-label=\"Page 10\" aria-current=\"page\">\n              10\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/11\" aria-label=\"Page 11\">\n              11\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/12\" aria-label=\"Page 12\">\n              12\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--ellipses\">&ctdot;</li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/40\" aria-label=\"Page 40\">\n              40\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "first page",
@@ -173,6 +178,7 @@
                 "items": [
                     {
                         "number": 1,
+                        "href": "/page/1",
                         "current": true
                     },
                     {
@@ -185,8 +191,8 @@
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page 1\" aria-current=\"page\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\" aria-current=\"page\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\">\n              3\n            </a>\n          </li></ul><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n        <span class=\"govuk-pagination__link-title\">Next</span>\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg></a>\n    </div></nav>"
         },
         {
             "name": "last page",
@@ -205,12 +211,13 @@
                     },
                     {
                         "number": 3,
+                        "href": "/page/3",
                         "current": true
                     }
                 ]
             },
-            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"\" aria-label=\"Page 3\" aria-current=\"page\">\n              3\n            </a>\n          </li></ul></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous</span></a>\n    </div>\n  <ul class=\"govuk-pagination__list\"><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/1\" aria-label=\"Page 1\">\n              1\n            </a>\n          </li><li class=\"govuk-pagination__item\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/2\" aria-label=\"Page 2\">\n              2\n            </a>\n          </li><li class=\"govuk-pagination__item govuk-pagination__item--current\">\n            <a class=\"govuk-link govuk-pagination__link\" href=\"/page/3\" aria-label=\"Page 3\" aria-current=\"page\">\n              3\n            </a>\n          </li></ul></nav>"
         },
         {
             "name": "with prev and next only",
@@ -222,8 +229,8 @@
                     "href": "/next"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Previous</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Next</span></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Previous</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Next</span></a>\n    </div></nav>"
         },
         {
             "name": "with prev and next only and labels",
@@ -239,8 +246,8 @@
                     "href": "/next"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">1 of 3</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title\">Next page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">3 of 3</span></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">1 of 3</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title\">Next page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">3 of 3</span></a>\n    </div></nav>"
         },
         {
             "name": "with prev and next only and very long labels",
@@ -256,8 +263,8 @@
                     "href": "/next"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title\">Next page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title\">Previous page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title\">Next page</span><span class=\"govuk-visually-hidden\">:</span>\n          <span class=\"govuk-pagination__link-label\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span></a>\n    </div></nav>"
         },
         {
             "name": "with prev and next only in a different language",
@@ -273,8 +280,8 @@
                     "visuallyHiddenText": "Page suivante"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">précédente</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">suivante</span></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">précédente</span></a>\n    </div>\n  <div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">suivante</span></a>\n    </div></nav>"
         },
         {
             "name": "with previous only",
@@ -283,8 +290,8 @@
                     "href": "/previous"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Previous</span></a>\n    </div>\n  </nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__prev\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/previous\" rel=\"prev\">\n        <svg class=\"govuk-pagination__icon govuk-pagination__icon--prev\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n          <path d=\"m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z\"></path>\n        </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Previous</span></a>\n    </div>\n  </nav>"
         },
         {
             "name": "with next only",
@@ -293,8 +300,8 @@
                     "href": "/next"
                 }
             },
-            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Next</span></a>\n    </div></nav>",
-            "hidden": false
+            "hidden": false,
+            "html": "<nav class=\"govuk-pagination govuk-pagination--block\" role=\"navigation\" aria-label=\"results\"><div class=\"govuk-pagination__next\">\n      <a class=\"govuk-link govuk-pagination__link\" href=\"/next\" rel=\"next\">\n      <svg class=\"govuk-pagination__icon govuk-pagination__icon--next\" xmlns=\"http://www.w3.org/2000/svg\" height=\"13\" width=\"15\" aria-hidden=\"true\" focusable=\"false\" viewBox=\"0 0 15 13\">\n        <path d=\"m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z\"></path>\n      </svg>\n        <span class=\"govuk-pagination__link-title govuk-pagination__link-title--decorated\">Next</span></a>\n    </div></nav>"
         }
     ]
 }