govuk_publishing_components 35.22.0 → 36.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b44a8215911c2a260e0b80134c14d3f974a4ee0bb91cdf7eb23dc081e61ee9d9
-  data.tar.gz: 4262f87d3ce863db103a0f24e3936b69e2219b0794ad83d142abb115bf7fe66a
+  metadata.gz: 773208000d7b04127bf634415ed17bbfd977ba73ab9a45e2eca5742f19eacbc6
+  data.tar.gz: c2b77952558ca4fd34c22e87088721dffe9d55346cc1cd9a5ac8ee3f64ff2087
 SHA512:
-  metadata.gz: 4deebaa45c7bb16f6acbbc0ae2b916222a6e8b3c9efb05581f3fefbf8e4b87b3ee772025b81399055e3bbedceb6162d1cd9df56b7e22f6ad1f6637523dea307c
-  data.tar.gz: 1fef3fd8a3ab99df0359cfd7d2787ba7d0d62ee50e12e455acb64fad1c51fbb47bc657b4f3ef784767c9c2fb95967678be14d168efb9db789ce28b618118e2bc
+  metadata.gz: 5d2efbb677bc763e54375000098c7419ccec70d70d4ad49093e6fda016788ec22ef989d8c7a480e5e9fa00d4dba4c6ac10672bb683baa67d129a3a49da80e460
+  data.tar.gz: 5e34040e64f3863838db6c24a5d8e2c0f0d423d62f24f6841adb204e0071899699796c07740130b6ec06205a87cffdcfed80814a177f7eb6aa93cd7112e55e1a

data/app/assets/config/govuk_publishing_components_manifest.js

@@ -30,6 +30,7 @@
 //= link govuk_publishing_components/components/_contextual-sidebar.css
 //= link govuk_publishing_components/components/_cookie-banner.css
 //= link govuk_publishing_components/components/_copy-to-clipboard.css
+//= link govuk_publishing_components/components/_cross-service-header.css
 //= link govuk_publishing_components/components/_date-input.css
 //= link govuk_publishing_components/components/_details.css
 //= link govuk_publishing_components/components/_devolved-nations.css

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-auto-tracker.js

@@ -35,12 +35,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         console.error('GA4 configuration error: ' + e.message, window.location)
         return
       }
-
       data.text = this.PIIRemover.stripPIIWithOverride(data.text, true, true)
-      var schemas = new window.GOVUK.analyticsGa4.Schemas()
-      var schema = schemas.mergeProperties(data, 'event_data')
-
-      window.GOVUK.analyticsGa4.core.sendData(schema)
+      window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
     }
   }
 

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js

@@ -35,20 +35,35 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
     },
 
     sendData: function (data) {
-      // Prevent any GA4 data being sent during Smokey tests
-      if (this.getUserAgent() === 'Smokey Test / Ruby') {
-        return
-      }
-
       data.govuk_gem_version = this.getGemVersion()
       // set this in the console as a debugging aid
       if (window.GOVUK.analyticsGa4.showDebug) {
-        data.event_data = this.sortEventData(data.event_data)
+        if (data.event_data) {
+          data.event_data = this.sortEventData(data.event_data)
+        } else if (data.page_view) {
+          data.page_view = this.sortEventData(data.page_view)
+        } else if (data.search_results) {
+          data.search_results = this.sortEventData(data.search_results)
+        }
         console.info(JSON.stringify(data, null, ' '))
       }
+
+      // Send GA4 data to a fake dataLayer if smokey_cachebust or disable_ga4 is in the query string. Used to prevent Smokey/other tests from spamming our analytics.
+      if (this.trackFunctions.getSearch().match(/[?&](disable_ga4|smokey_cachebust){1}/)) {
+        window.fakeDataLayer = window.fakeDataLayer || []
+        window.fakeDataLayer.push(data)
+        return
+      }
+
       window.dataLayer.push(data)
     },
 
+    applySchemaAndSendData: function (data, name) {
+      var schemas = new window.GOVUK.analyticsGa4.Schemas()
+      var schema = schemas.mergeProperties(data, name)
+      this.sendData(schema)
+    },
+
     getGemVersion: function () {
       return window.GOVUK.analyticsGa4.vars.gem_version || 'not found'
     },
@@ -74,6 +89,10 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
         return /^(http:||https:)?(\/\/)([^\/]*)/ // eslint-disable-line no-useless-escape
       },
 
+      getSearch: function () {
+        return window.location.search
+      },
+
       findTrackingAttributes: function (clicked, trackingTrigger) {
         if (clicked.hasAttribute('[' + trackingTrigger + ']')) {
           return clicked
@@ -82,39 +101,6 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
         }
       },
 
-      // create an object to split up long URLs and get around the 100 character limit on GTM data
-      // this gets reassembled in GA4
-      populateLinkPathParts: function (href) {
-        var path = ''
-        if (this.hrefIsRelative(href) || this.isMailToLink(href)) {
-          path = href
-        } else {
-          // This regex matches a protocol and domain name at the start of a string such as https://www.gov.uk, http://gov.uk, //gov.uk
-          path = href.replace(/^(http:||https:)?(\/\/)([^\/]*)/, '') // eslint-disable-line no-useless-escape
-        }
-
-        if (path === '/' || path.length === 0) {
-          return
-        }
-
-        return this.splitStringIntoParts(path)
-      },
-
-      splitStringIntoParts: function (string) {
-        /*
-        This will create an object with 5 keys that are indexes ("1", "2", etc.)
-        The values will be each part of the string split every 100 characters, or undefined.
-        For example: {"1": "/hello/world/etc...", "2": "/more/path/text...", "3": undefined, "4": undefined, "5": undefined}
-        Undefined values are needed to override the persistent object in GTM so that any values from old pushes are overwritten.
-        */
-        var parts = string.match(/.{1,100}/g)
-        var obj = {}
-        for (var i = 0; i < 5; i++) {
-          obj[(i + 1).toString()] = parts[i]
-        }
-        return obj
-      },
-
       hrefIsRelative: function (href) {
         // Checks that a href is relative by the lack of http:, https:// or // at the start of the href.
         var domain = this.getDomainRegex().exec(href)
@@ -135,6 +121,8 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
               return 'command/win click'
             } else if (event.shiftKey) {
               return 'shift click'
+            } else if (event.altKey) {
+              return 'alt/option click'
             } else {
               return 'primary click'
             }
@@ -259,8 +247,8 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
         var totalLinks = 0
         for (var i = 0; i < links.length; i++) {
           var link = links[i]
-          // Only index links that are not search results or do not have a data-ga4-do-not-index attribute
-          if (link.getAttribute('data-ga4-ecommerce-path') || link.getAttribute('data-ga4-do-not-index') !== null) {
+          // Ignore links that don't have a href, have a data-ga4-do-not-index attribute on them, or are search result links.
+          if (!link.getAttribute('href') || link.getAttribute('data-ga4-ecommerce-path') || link.getAttribute('data-ga4-do-not-index') !== null) {
             continue
           }
           totalLinks++

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-event-tracker.js

@@ -43,9 +43,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       var text = data.text || event.target.textContent
       data.text = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(text)
 
-      var schemas = new window.GOVUK.analyticsGa4.Schemas()
-      var schema = schemas.mergeProperties(data, 'event_data')
-
       /* Ensure it only tracks aria-expanded in an element with data-ga4-expandable on it. */
       if (target.closest('[data-ga4-expandable]')) {
         var ariaExpanded = this.getClosestAttribute(target, 'aria-expanded')
@@ -59,12 +56,12 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       var detailsElement = target.closest('details')
 
       if (ariaExpanded) {
-        schema.event_data.text = data.text || target.innerText
-        schema.event_data.action = (ariaExpanded === 'false') ? 'opened' : 'closed'
+        data.text = data.text || target.innerText
+        data.action = (ariaExpanded === 'false') ? 'opened' : 'closed'
       } else if (detailsElement) {
-        schema.event_data.text = data.text || detailsElement.textContent
+        data.text = data.text || detailsElement.textContent
         var openAttribute = detailsElement.getAttribute('open')
-        schema.event_data.action = (openAttribute == null) ? 'opened' : 'closed'
+        data.action = (openAttribute == null) ? 'opened' : 'closed'
       }
 
       /* If a tab was clicked, grab the href of the clicked tab (usually an anchor # link) */
@@ -74,12 +71,11 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         if (aTag) {
           var href = aTag.getAttribute('href')
           if (href) {
-            schema.event_data.url = window.GOVUK.analyticsGa4.core.trackFunctions.appendPathToAnchorLinks(href)
+            data.url = window.GOVUK.analyticsGa4.core.trackFunctions.appendPathToAnchorLinks(href)
           }
         }
       }
-
-      window.GOVUK.analyticsGa4.core.sendData(schema)
+      window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
     }
   }
 

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-form-tracker.js

@@ -50,10 +50,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         data.text = data.text.toLowerCase()
         data.text = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(data.text)
       }
-
-      var schemas = new window.GOVUK.analyticsGa4.Schemas()
-      var schema = schemas.mergeProperties(data, 'event_data')
-      window.GOVUK.analyticsGa4.core.sendData(schema)
+      window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
     }
   }
 

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js

@@ -90,7 +90,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       data.url = trackFunctions.applyRedactionIfRequired(this.PIIRemover, element, data.url)
       data.url = trackFunctions.appendPathToAnchorLinks(data.url)
       data.link_domain = trackFunctions.populateLinkDomain(data.url)
-      data.link_path_parts = trackFunctions.populateLinkPathParts(data.url)
       data.method = trackFunctions.getClickType(event)
       data.external = trackFunctions.isExternalLink(data.url) ? 'true' : 'false'
       data.index = this.setIndex(data.index, event.target)
@@ -106,10 +105,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       if (data.type === 'smart answer' && data.action === 'change response') {
         data.section = this.PIIRemover.stripPIIWithOverride(data.section, true, true)
       }
-
-      var schemas = new window.GOVUK.analyticsGa4.Schemas()
-      var schema = schemas.mergeProperties(data, 'event_data')
-      window.GOVUK.analyticsGa4.core.sendData(schema)
+      window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
     }
   }
 

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js

@@ -36,8 +36,8 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
             taxonomy_level1: this.getMetaContent('themes'),
             taxonomy_main: this.getMetaContent('taxon-slug'),
             taxonomy_main_id: this.getMetaContent('taxon-id'),
-            taxonomy_all: this.splitLongMetaContent('taxon-slugs'),
-            taxonomy_all_ids: this.splitLongMetaContent('taxon-ids'),
+            taxonomy_all: this.getMetaContent('taxon-slugs'),
+            taxonomy_all_ids: this.getMetaContent('taxon-ids'),
 
             language: this.getLanguage(),
             history: this.getHistory(),
@@ -45,8 +45,8 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
             first_published_at: this.stripTimeFrom(this.getMetaContent('first-published-at')),
             updated_at: this.stripTimeFrom(this.getMetaContent('updated-at')),
             public_updated_at: this.stripTimeFrom(this.getMetaContent('public-updated-at')),
-            publishing_government: this.getMetaContent('publishing-government'),
-            political_status: this.getMetaContent('political-status'),
+            publishing_government: this.getMetaContent('publishing-government') || this.getMetaContent('ga4-publishing-government'),
+            political_status: this.getMetaContent('political-status') || this.getMetaContent('ga4-political-status'),
             primary_publishing_organisation: this.getMetaContent('primary-publishing-organisation'),
             organisations: this.getMetaContent('analytics:organisations'),
             world_locations: this.getMetaContent('analytics:world-locations'),
@@ -73,12 +73,8 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
       return this.PIIRemover.stripPIIWithOverride(this.stripGaParam(document.location.href), true, true)
     },
 
-    getSearch: function () {
-      return window.location.search
-    },
-
     getSearchTerm: function () {
-      var queryString = this.getSearch()
+      var queryString = window.GOVUK.analyticsGa4.core.trackFunctions.getSearch()
 
       if (!queryString) {
         return undefined
@@ -97,7 +93,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
     },
 
     getQueryString: function () {
-      var queryString = this.getSearch()
+      var queryString = window.GOVUK.analyticsGa4.core.trackFunctions.getSearch()
       if (queryString) {
         queryString = this.stripGaParam(queryString)
         queryString = this.PIIRemover.stripPIIWithOverride(queryString, true, true)
@@ -200,13 +196,6 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
       return undefined
     },
 
-    splitLongMetaContent: function (metatag) {
-      var tag = this.getMetaContent(metatag)
-      if (tag) {
-        return window.GOVUK.analyticsGa4.core.trackFunctions.splitStringIntoParts(tag)
-      }
-    },
-
     // return only the date from given timestamps of the form
     // 2022-03-28T19:11:00.000+00:00
     stripTimeFrom: function (value) {

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-print-intent-tracker.js

@@ -13,9 +13,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
           type: 'print page',
           method: 'browser print'
         }
-        var schema = new window.GOVUK.analyticsGa4.Schemas()
-        schema = schema.mergeProperties(data, 'event_data')
-        window.GOVUK.analyticsGa4.core.sendData(schema)
+        window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
       })
     }
   }

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-schemas.js

@@ -27,7 +27,6 @@
         external: this.undefined,
         method: this.undefined,
         link_domain: this.undefined,
-        link_path_parts: this.undefined,
         tool_name: this.undefined,
         percent_scrolled: this.undefined,
         video_current_time: this.undefined,
@@ -53,48 +52,33 @@
     }
   }
 
-  // merge data attributes data into the event schema
-  // only allow it if it already exists in the schema
+  // merge allowed data attributes into the event schema
   Schemas.prototype.mergeProperties = function (data, eventAttribute) {
     var schema = this.eventSchema()
     schema.event = eventAttribute
-    // exceptions should be inserted without checking for sub parameters
-    // exceptions should only come from code, not directly from data attributes
-    // e.g. link_path_parts is generated by JS and contains potentially non-unique
-    // sub parameter names i.e. '1', '2'
-    var exceptions = ['link_path_parts']
 
     for (var property in data) {
       // some passed data might be undefined, don't want it to overwrite e.g. the index sub parameters
       if (data[property] !== undefined) {
-        if (exceptions.indexOf(property) >= 0 || !this.isAnObject(data[property])) {
-          schema.event_data = this.addToObject(schema.event_data, property, data[property])
-        } else {
-          // we check for one level of nesting in the data attributes data
-          // this check can be removed once nesting is removed from all data attributes
-          for (var subproperty in data[property]) {
-            schema.event_data = this.addToObject(schema.event_data, subproperty, data[property][subproperty])
-          }
-        }
+        schema.event_data = this.addToObject(schema.event_data, property, data[property])
       }
     }
     return schema
   }
 
-  // might be easier to check if it's not a string or a number?
   Schemas.prototype.isAnObject = function (item) {
     if (typeof item === 'object' && !Array.isArray(item) && item !== null) {
       return true
     }
   }
 
-  // given an object and a key, insert a value into that object for that key
-  // we check for one level of nesting in the object
+  // given an object and a key, insert a value into object[key] if it exists
   Schemas.prototype.addToObject = function (obj, key, value) {
     if (key in obj) {
       obj[key] = value
       return obj
     } else {
+      // check for one level of nesting in the object
       for (var property in obj) {
         if (this.isAnObject(obj[property])) {
           if (key in obj[property]) {

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-scroll-tracker.js

@@ -123,9 +123,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         // following will be undefined if tracking headings
         data.percent_scrolled = node.eventData.percent_scrolled
 
-        var schemas = new window.GOVUK.analyticsGa4.Schemas()
-        var schema = schemas.mergeProperties(data, 'event_data')
-        window.GOVUK.analyticsGa4.core.sendData(schema)
+        window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
       }
     }
   }

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js

@@ -72,7 +72,6 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
         if (data.url) {
           data.url = window.GOVUK.analyticsGa4.core.trackFunctions.removeCrossDomainParams(data.url)
           data.link_domain = window.GOVUK.analyticsGa4.core.trackFunctions.populateLinkDomain(data.url)
-          data.link_path_parts = window.GOVUK.analyticsGa4.core.trackFunctions.populateLinkPathParts(data.url)
         }
 
         data.text = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(element.textContent)
@@ -81,10 +80,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
           data.text = 'image'
         }
         data.method = window.GOVUK.analyticsGa4.core.trackFunctions.getClickType(event)
-
-        var schemas = new window.GOVUK.analyticsGa4.Schemas()
-        var schema = schemas.mergeProperties(data, 'event_data')
-        window.GOVUK.analyticsGa4.core.sendData(schema)
+        window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
       }
     },
 

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-video-tracker.js

@@ -81,10 +81,7 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
       data.video_duration = this.handlers['video-' + player.id + '-duration']
       data.video_percent = position
 
-      var schemas = new window.GOVUK.analyticsGa4.Schemas()
-      var schema = schemas.mergeProperties(data, 'event_data')
-
-      window.GOVUK.analyticsGa4.core.sendData(schema)
+      window.GOVUK.analyticsGa4.core.applySchemaAndSendData(data, 'event_data')
     },
 
     cleanVideoUrl: function (url) {

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/pii-remover.js

@@ -4,8 +4,22 @@
   var GOVUK = global.GOVUK || {}
   var EMAIL_PATTERN = /[^\s=/?&#+]+(?:@|%40)[^\s=/?&+]+/g
   var POSTCODE_PATTERN = /\b[A-PR-UWYZ][A-HJ-Z]?[0-9][0-9A-HJKMNPR-Y]?(?:[\s+]|%20)*[0-9](?!refund)[ABD-HJLNPQ-Z]{2,3}\b/gi
-  var DATE_PATTERN_NUMERIC = /\d{4}(-?)\d{2}(-?)\d{2}/g
-  var DATE_PATTERN_STRING = /\d{1,2}\s(January|February|March|April|May|June|July|August|September|October|November|December)\s\d{4}/g
+
+  // e.g. 01/01/1990 or 01-01-1990 or 1-1-1990 or 1/1/1990 or 01\01\1990 or 1\1\1990
+  var DATE_PATTERN_NUMERIC_1 = /\d{1,2}([-\/\\])\d{1,2}([-\/\\])\d{4}/g // eslint-disable-line no-useless-escape
+
+  // e.g. 1990/01/01 or 1990-01-01 or 1990-1-1 or 1990/1/1 or 1990\1\1 or 1990\01\01
+  var DATE_PATTERN_NUMERIC_2 = /\d{4}([-\/\\])\d{1,2}([-\/\\])\d{1,2}/g // eslint-disable-line no-useless-escape
+
+  // e.g. 12345678 (This originated from the UA PII Remover)
+  var DATE_PATTERN_NUMERIC_3 = /[0-9]{8}/g
+
+  // e.g. 1(st) (of) Jan(uary) 1990 (or 90 or '90) - where the bracketed characters are optional parts that can be matched
+  var DATE_PATTERN_STRING_1 = /\d{1,2}(?:st|nd|rd|th)?\s(?:of\s)?(Jan(?:uary)?|Feb(?:ruary)?|Mar(?:ch)?|Apr(?:il)?|May|Jun(?:e)?|Jul(?:y)?|Aug(?:ust)?|Sep(?:t)?(?:ember)?|Oct(?:ober)?|Nov(?:ember)?|Dec(?:ember)?)\s(?:')?(\d{4}|\d{2})/gi
+
+  // e.g. Jan(uary) 1(st) 1990 (or 90 or '90) - where the bracketed characters are optional parts that can be matched
+  var DATE_PATTERN_STRING_2 = /(Jan(?:uary)?|Feb(?:ruary)?|Mar(?:ch)?|Apr(?:il)?|May|Jun(?:e)?|Jul(?:y)?|Aug(?:ust)?|Sep(?:t)?(?:ember)?|Oct(?:ober)?|Nov(?:ember)?|Dec(?:ember)?)\s\d{1,2}?(?:st|nd|rd|th)?\s(?:')?(\d{4}|\d{2})/gi
+
   var ESCAPE_REGEX_PATTERN = /[|\\{}()[\]^$+*?.]/g
 
   // specific URL parameters to be redacted from accounts URLs
@@ -86,8 +100,12 @@
     stripped = this.stripQueryStringParameters(stripped)
 
     if (this.stripDatePII === true) {
-      stripped = stripped.replace(DATE_PATTERN_NUMERIC, '[date]')
-      stripped = stripped.replace(DATE_PATTERN_STRING, '[date]')
+      var DATE_REDACTION_STRING = '[date]'
+      stripped = stripped.replace(DATE_PATTERN_NUMERIC_1, DATE_REDACTION_STRING)
+      stripped = stripped.replace(DATE_PATTERN_NUMERIC_2, DATE_REDACTION_STRING)
+      stripped = stripped.replace(DATE_PATTERN_NUMERIC_3, DATE_REDACTION_STRING)
+      stripped = stripped.replace(DATE_PATTERN_STRING_1, DATE_REDACTION_STRING)
+      stripped = stripped.replace(DATE_PATTERN_STRING_2, DATE_REDACTION_STRING)
     }
     if (this.stripPostcodePII === true) {
       stripped = stripped.replace(POSTCODE_PATTERN, '[postcode]')

data/app/assets/javascripts/govuk_publishing_components/components/cross-service-header.js

@@ -0,0 +1,78 @@
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {};
+
+(function (Modules) {
+  /**
+  * A modified adaptation of the Design System header script
+  * To initialise the One Login header, run:
+  * new window.CrossServiceHeader(document.querySelector("[data-module='one-login-header']")).init();
+  */
+  function CrossServiceHeader ($module) {
+    this.$header = $module
+    this.$navigation = $module && $module.querySelectorAll('[data-one-login-header-nav]')
+    this.$numberOfNavs = this.$navigation && this.$navigation.length
+    if (this.$header) {
+      this.$header.classList.add('js-enabled')
+    }
+  }
+  /**
+  * Initialise header
+  *
+  * Check for the presence of the header, menu and menu button – if any are
+  * missing then there's nothing to do so return early.
+  */
+  CrossServiceHeader.prototype.init = function () {
+    if (!this.$header && !this.$numberOfNavs) {
+      return
+    }
+    /**
+    * The header can render with one or two navigation elements which collapse
+    * into dropdowns on the mobile variation. This initialises the dropdown
+    * functionality for all navs that have a menu button which has:
+    * 1. a class of .js-x-header-toggle
+    * 2. an aria-controls attribute which can be mapped to the ID of the element
+    * that should be hidden on mobile
+    */
+    for (var i = 0; i < this.$numberOfNavs; i++) {
+      var $nav = this.$navigation[i]
+      $nav.$menuButton = $nav.querySelector('.js-x-header-toggle')
+
+      $nav.$menu = $nav.$menuButton && $nav.querySelector(
+        '#' + $nav.$menuButton.getAttribute('aria-controls')
+      )
+      if (!$nav.$menuButton || !$nav.$menu) {
+        return
+      }
+      $nav.$menuOpenClass = $nav.$menu && $nav.$menu.dataset.openClass
+      $nav.$menuButtonOpenClass = $nav.$menuButton && $nav.$menuButton.dataset.openClass
+      $nav.$menuButtonOpenLabel = $nav.$menuButton && $nav.$menuButton.dataset.labelForShow
+      $nav.$menuButtonCloseLabel = $nav.$menuButton && $nav.$menuButton.dataset.labelForHide
+      $nav.$menuButtonOpenText = $nav.$menuButton && $nav.$menuButton.dataset.textForShow
+      $nav.$menuButtonCloseText = $nav.$menuButton && $nav.$menuButton.dataset.textForHide
+      $nav.isOpen = false
+
+      $nav.$menuButton.addEventListener('click', this.handleMenuButtonClick.bind($nav))
+    }
+  }
+
+  /**
+  * Handle menu button click
+  *
+  * When the menu button is clicked, change the visibility of the menu and then
+  * sync the accessibility state and menu button state
+  */
+  CrossServiceHeader.prototype.handleMenuButtonClick = function () {
+    this.isOpen = !this.isOpen
+    this.$menuOpenClass && this.$menu.classList.toggle(this.$menuOpenClass, this.isOpen)
+    this.$menuButtonOpenClass && this.$menuButton.classList.toggle(this.$menuButtonOpenClass, this.isOpen)
+    this.$menuButton.setAttribute('aria-expanded', this.isOpen)
+    if (this.$menuButtonCloseLabel && this.$menuButtonOpenLabel) {
+      this.$menuButton.setAttribute('aria-label', (this.isOpen ? this.$menuButtonCloseLabel : this.$menuButtonOpenLabel))
+    }
+    if (this.$menuButtonCloseText && this.$menuButtonOpenText) {
+      this.$menuButton.innerHTML = this.isOpen ? this.$menuButtonCloseText : this.$menuButtonOpenText
+    }
+  }
+
+  Modules.CrossServiceHeader = CrossServiceHeader
+})(window.GOVUK.Modules)

data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss

@@ -27,6 +27,7 @@ $govuk-new-link-styles: true;
 @import "components/contextual-sidebar";
 @import "components/cookie-banner";
 @import "components/copy-to-clipboard";
+@import "components/cross-service-header";
 @import "components/date-input";
 @import "components/details";
 @import "components/devolved-nations";

data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss

@@ -94,31 +94,6 @@
   }
 }
 
-.gem-c-action-link--white-arrow {
-  &::before {
-    background-image: image-url("govuk_publishing_components/action-link-arrow--white.png");
-    background-image: image-url("govuk_publishing_components/action-link-arrow--white.svg"), linear-gradient(transparent, transparent);
-  }
-}
-
-.gem-c-action-link--blue-arrow {
-  &::before {
-    width: 36px;
-    height: 28px;
-    background: image-url("govuk_publishing_components/action-link-arrow--blue.png");
-    background: image-url("govuk_publishing_components/action-link-arrow--blue.svg"), linear-gradient(transparent, transparent);
-    background-repeat: no-repeat;
-    background-size: 28px auto;
-    background-position: 0 0;
-
-    @include govuk-media-query($from: tablet) {
-      width: 45px;
-      height: 35px;
-      background-size: 35px auto;
-    }
-  }
-}
-
 .gem-c-action-link--simple {
   &::before {
     width: 30px;
@@ -143,13 +118,6 @@
   }
 }
 
-.gem-c-action-link--dark-icon {
-  &::before {
-    background: image-url("govuk_publishing_components/action-link-arrow--dark.png");
-    background: image-url("govuk_publishing_components/action-link-arrow--dark.svg"), linear-gradient(transparent, transparent);
-  }
-}
-
 .gem-c-action-link--dark-large-icon {
   &::before {
     background: image-url("govuk_publishing_components/action-link-arrow--dark.png");
@@ -184,8 +152,7 @@
   }
 }
 
-.gem-c-action-link--dark-icon,
-.gem-c-action-link--small-icon {
+.gem-c-action-link--dark-icon {
   max-width: none;
 
   @include govuk-media-query($until: tablet) {
@@ -195,57 +162,14 @@
   &::before {
     height: 30px;
     width: 35px;
+    background: image-url("govuk_publishing_components/action-link-arrow--dark.png");
+    background: image-url("govuk_publishing_components/action-link-arrow--dark.svg"), linear-gradient(transparent, transparent);
     background-repeat: no-repeat;
     background-size: 25px auto;
     background-position: 0 2px;
   }
 }
 
-.gem-c-action-link--transparent-icon {
-  &::before {
-    background-image: image-url("govuk_publishing_components/action-link-arrow--transparent.svg");
-  }
-}
-
-.gem-c-action-link--brexit {
-  max-width: none;
-
-  &::before {
-    height: 30px;
-    width: 30px;
-    background-image: image-url("govuk_publishing_components/action-link-arrow--brexit.svg");
-    background-repeat: no-repeat;
-    background-size: 18px auto;
-    background-position: 0 2px;
-  }
-
-  @include govuk-media-query($until: tablet) {
-    margin-bottom: govuk-spacing(2);
-  }
-
-  @include govuk-media-query($from: tablet) {
-    margin-bottom: govuk-spacing(2);
-
-    &::before {
-      width: 35px;
-      background-position: 0 4px;
-      background-size: 25px auto;
-    }
-  }
-}
-
-.gem-c-action-link--nhs {
-  &::before {
-    width: 80px;
-    height: 70px;
-    background: image-url("govuk_publishing_components/action-link--nhs.png");
-    background: image-url("govuk_publishing_components/action-link--nhs.svg"), linear-gradient(transparent, transparent);
-    background-repeat: no-repeat;
-    background-size: 85% auto;
-    background-position: 0 50%;
-  }
-}
-
 .gem-c-action-link--light-text {
   color: govuk-colour("white");