govuk_publishing_components 21.67.2 → 23.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: dff3c8adb46566625a54c58136bffb72bbaec93fa9d803f04d6372c09065766a
-  data.tar.gz: 48b13db7e001c01cbf4f230195f42248a3378e8f263e7abcb9dae8e88a4e382d
+  metadata.gz: 20fcbde55a95f5ca3e7ac5744c94f69b573b563e9c5df919681864c6662dff16
+  data.tar.gz: 9d65b762cc90d4e8bfa3ba37b2c811778af94f55a3d88d0e45ca0ed7f0d0161a
 SHA512:
-  metadata.gz: be93ed1a460324911d7e4626a028f5352b7d4a5cbe0838ec67516f1ed03ca6373559f45c60faa572acc112d56d52c035700d4e205dc01f60c057e6355a473dfe
-  data.tar.gz: a46214b1b651dffebaf202c8c1a003c9b2275abd042f458dc8fab883e97a9aeacba0e9d1dbb76070e14f76b87c9d353a63a6a332bad3b291d1ed4d032f744293
+  metadata.gz: 10d6c20ed45850b0bc92826e009dd10d8cbc5a6e09368ad9822e33d97a7bf6b8b59b43c50b18cf630e109455df35e4b993b6c1e497d0eeb94adc2081b128da41
+  data.tar.gz: b3fdb29493b563ef3893f1c2d33f21feb2f9817d38952cff97091e6b318bd0d11c2ddd3c85ba08f0baf80560a30150651ed283fbaf06700b4045d161cb187740

data/README.md

@@ -1,4 +1,4 @@
-GOV.UK Publishing Components 
+GOV.UK Publishing Components
 [![status](https://badgen.net/github/status/alphagov/govuk_publishing_components/master)](https://ci.integration.publishing.service.gov.uk/job/govuk_publishing_components/job/master/)
 [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
 [![Stylelint Style Guide](https://img.shields.io/badge/code_style-stylelint-brightgreen.svg)](https://github.com/alphagov/stylelint-config-gds/)
@@ -59,6 +59,10 @@ bundle install
 yarn install
 ```
 
+### Running a local app with a local gem
+
+The GDS Developer Docs has a [guide on local frontend development](https://docs.publishing.service.gov.uk/manual/local-frontend-development.html) that covers setting up a local app to use the local version of the components gem in Docker and using the `./startup.sh` script.
+
 ### Running tests
 
 The default rake task runs all the linting and test tasks:

data/app/assets/images/govuk_publishing_components/action-link-arrow--simple-light.svg

@@ -0,0 +1,4 @@
+<svg width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.9429 11.7949L10.4402 7.29222L11.7327 5.99967L17.528 11.7949L11.7327 17.5902L10.4402 16.2976L14.9429 11.7949Z" fill="#ffffff"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.95631 10.881L15.4414 10.881L15.4414 12.709L3.95631 12.709L3.95631 10.881Z" fill="#ffffff"/>
+</svg>

data/app/assets/javascripts/govuk_publishing_components/analytics.js

@@ -0,0 +1,16 @@
+//= require govuk_publishing_components/lib/cookie-functions
+//= require ./analytics/pii
+//= require ./analytics/google-analytics-universal-tracker
+//= require ./analytics/analytics
+//= require ./analytics/print-intent
+//= require ./analytics/error-tracking
+//= require ./analytics/mailto-link-tracker
+//= require ./analytics/external-link-tracker
+//= require ./analytics/download-link-tracker
+//= require ./analytics/auto-track-event
+//= require ./analytics/page-content
+//= require ./analytics/custom-dimensions
+//= require ./analytics/static-analytics
+//= require ./analytics/ecommerce
+//= require ./analytics/init
+//= require ./analytics/scroll-tracker

data/app/assets/javascripts/govuk_publishing_components/analytics/analytics.js

@@ -0,0 +1,85 @@
+;(function (global) {
+  'use strict'
+
+  var GOVUK = global.GOVUK || {}
+  // For usage and initialisation see:
+  // https://github.com/alphagov/govuk_frontend_toolkit/blob/master/docs/analytics.md#create-an-analytics-tracker
+
+  var Analytics = function (config) {
+    this.pii = new GOVUK.Pii()
+    this.trackers = []
+    if (typeof config.universalId !== 'undefined') {
+      var universalId = config.universalId
+      delete config.universalId
+      this.trackers.push(new GOVUK.GoogleAnalyticsUniversalTracker(universalId, config))
+    }
+  }
+
+  var PIISafe = function (value) {
+    this.value = value
+  }
+  Analytics.PIISafe = PIISafe
+
+  Analytics.prototype.sendToTrackers = function (method, args) {
+    for (var i = 0, l = this.trackers.length; i < l; i++) {
+      var tracker = this.trackers[i]
+      var fn = tracker[method]
+
+      if (typeof fn === 'function') {
+        fn.apply(tracker, args)
+      }
+    }
+  }
+
+  Analytics.load = function () {
+    GOVUK.GoogleAnalyticsUniversalTracker.load()
+  }
+
+  Analytics.prototype.defaultPathForTrackPageview = function (location) {
+    // Get the page path including querystring, but ignoring the anchor
+    // as per default behaviour of GA (see: https://developers.google.com/analytics/devguides/collection/analyticsjs/pages#overview)
+    // we ignore the possibility of there being campaign variables in the
+    // anchor because we wouldn't know how to detect and parse them if they
+    // were present
+    return this.pii.stripPIIFromString(location.href.substring(location.origin.length).split('#')[0])
+  }
+
+  Analytics.prototype.trackPageview = function (path, title, options) {
+    arguments[0] = arguments[0] || this.defaultPathForTrackPageview(window.location)
+    if (arguments.length === 0) { arguments.length = 1 }
+    this.sendToTrackers('trackPageview', this.pii.stripPII(arguments))
+  }
+
+  /*
+    https://developers.google.com/analytics/devguides/collection/analyticsjs/events
+    options.label – Useful for categorizing events (eg nav buttons)
+    options.value – Values must be non-negative. Useful to pass counts
+    options.nonInteraction – Prevent event from impacting bounce rate
+  */
+  Analytics.prototype.trackEvent = function (category, action, options) {
+    this.sendToTrackers('trackEvent', this.pii.stripPII(arguments))
+  }
+
+  Analytics.prototype.trackShare = function (network, options) {
+    this.sendToTrackers('trackSocial', this.pii.stripPII([network, 'share', global.location.pathname, options]))
+  }
+
+  /*
+    The custom dimension index must be configured within the
+    Universal Analytics profile
+   */
+  Analytics.prototype.setDimension = function (index, value) {
+    this.sendToTrackers('setDimension', this.pii.stripPII(arguments))
+  }
+
+  /*
+   Add a beacon to track a page in another GA account on another domain.
+   */
+  Analytics.prototype.addLinkedTrackerDomain = function (trackerId, name, domain) {
+    this.sendToTrackers('addLinkedTrackerDomain', arguments)
+  }
+
+  GOVUK.Analytics = Analytics
+
+  global.GOVUK = GOVUK
+})(window)

data/app/assets/javascripts/govuk_publishing_components/analytics/auto-track-event.js

@@ -0,0 +1,30 @@
+;(function (global) {
+  'use strict'
+
+  var GOVUK = global.GOVUK || {}
+  GOVUK.Modules = GOVUK.Modules || {}
+
+  GOVUK.Modules.AutoTrackEvent = function () {
+    this.start = function (element) {
+      var options = { nonInteraction: 1 } // automatic events shouldn't affect bounce rate
+      var category = element.data('track-category')
+      var action = element.data('track-action')
+      var label = element.data('track-label')
+      var value = element.data('track-value')
+
+      if (typeof label === 'string') {
+        options.label = label
+      }
+
+      if (value || value === 0) {
+        options.value = value
+      }
+
+      if (GOVUK.analytics && GOVUK.analytics.trackEvent) {
+        GOVUK.analytics.trackEvent(category, action, options)
+      }
+    }
+  }
+
+  global.GOVUK = GOVUK
+})(window)

data/app/assets/javascripts/govuk_publishing_components/analytics/custom-dimensions.js

@@ -0,0 +1,120 @@
+/* global GOVUK, $ */
+
+(function () {
+  'use strict'
+  window.GOVUK = window.GOVUK || {}
+  var CustomDimensions = function () { }
+
+  CustomDimensions.getAndExtendDefaultTrackingOptions = function (extraOptions) {
+    var trackingOptions = this.customDimensions()
+    return $.extend(trackingOptions, extraOptions)
+  }
+
+  CustomDimensions.customDimensions = function () {
+    var dimensions = $.extend(
+      {},
+      customDimensionsFromBrowser(),
+      customDimensionsFromMetaTags(),
+      customDimensionsFromDom(),
+      abTestCustomDimensions()
+    )
+
+    return $.each(dimensions, function (key, value) {
+      dimensions[key] = new GOVUK.Analytics.PIISafe(String(value))
+    })
+  }
+
+  function customDimensionsFromBrowser () {
+    var customDimensions = {
+      dimension15: window.httpStatusCode || 200,
+      dimension16: GOVUK.cookie('TLSversion') || 'unknown',
+      dimension95: GOVUK.analytics.gaClientId
+    }
+
+    if (window.devicePixelRatio) {
+      customDimensions.dimension11 = window.devicePixelRatio
+    }
+
+    return customDimensions
+  }
+
+  function customDimensionsFromMetaTags () {
+    var dimensionMappings = {
+      section: { dimension: 1 },
+      format: { dimension: 2 },
+      themes: { dimension: 3, defaultValue: 'other' },
+      'content-id': { dimension: 4, defaultValue: '00000000-0000-0000-0000-000000000000' },
+      'search-result-count': { dimension: 5 },
+      'publishing-government': { dimension: 6 },
+      'political-status': { dimension: 7 },
+      'analytics:organisations': { dimension: 9 },
+      'analytics:world-locations': { dimension: 10 },
+      withdrawn: { dimension: 12, defaultValue: 'not withdrawn' },
+      'schema-name': { dimension: 17 },
+      'rendering-application': { dimension: 20 },
+      'search-autocomplete-status': { dimension: 21 },
+      'navigation-legacy': { dimension: 30, defaultValue: 'none' },
+      'navigation-page-type': { dimension: 32, defaultValue: 'none' },
+      'taxon-slug': { dimension: 56, defaultValue: 'other' },
+      'taxon-id': { dimension: 57, defaultValue: 'other' },
+      'taxon-slugs': { dimension: 58, defaultValue: 'other' },
+      'taxon-ids': { dimension: 59, defaultValue: 'other' },
+      'content-has-history': { dimension: 39, defaultValue: 'false' },
+      'publishing-application': { dimension: 89 },
+      stepnavs: { dimension: 96 },
+      'relevant-result-shown': { dimension: 83 },
+      'spelling-suggestion': { dimension: 81 }
+    }
+
+    var $metas = $('meta[name^="govuk:"]')
+    var customDimensions = {}
+    var tags = {}
+
+    $metas.each(function () {
+      var $meta = $(this)
+      var key = $meta.attr('name').split('govuk:')[1]
+
+      var dimension = dimensionMappings[key]
+      if (dimension) {
+        tags[key] = $meta.attr('content')
+      }
+    })
+
+    $.each(dimensionMappings, function (key, dimension) {
+      var value = tags[key] || dimension.defaultValue
+      if (typeof value !== 'undefined') {
+        customDimensions['dimension' + dimension.dimension] = value
+      }
+    })
+
+    return customDimensions
+  }
+
+  function customDimensionsFromDom () {
+    return {
+      dimension26: GOVUK.PageContent.getNumberOfSections(),
+      dimension27: GOVUK.PageContent.getNumberOfLinks(),
+      dimension23: $('main[id="content"]').attr('lang') || 'unknown',
+      dimension38: $('[data-module="global-bar"]').is(':visible') && 'Global Banner viewed'
+    }
+  }
+
+  function abTestCustomDimensions () {
+    var $abMetas = $('meta[name^="govuk:ab-test"]')
+    var customDimensions = {}
+
+    $abMetas.each(function () {
+      var $meta = $(this)
+      var dimension = parseInt($meta.data('analytics-dimension'))
+      var testNameAndBucket = $meta.attr('content')
+
+      if (dimension) {
+        customDimensions['dimension' + dimension] = testNameAndBucket
+      }
+    })
+
+    return customDimensions
+  }
+
+  GOVUK.CustomDimensions = CustomDimensions
+})()

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

@@ -0,0 +1,41 @@
+;(function (global) {
+  'use strict'
+
+  var $ = global.jQuery
+  var GOVUK = global.GOVUK || {}
+
+  GOVUK.analyticsPlugins = GOVUK.analyticsPlugins || {}
+  GOVUK.analyticsPlugins.downloadLinkTracker = function (options) {
+    options = options || {}
+    var downloadLinkSelector = options.selector
+
+    if (downloadLinkSelector) {
+      $('body').on('click', downloadLinkSelector, trackDownload)
+    }
+
+    function trackDownload (evt) {
+      var $link = getLinkFromEvent(evt)
+      var href = $link.attr('href')
+      var evtOptions = { transport: 'beacon' }
+      var linkText = $.trim($link.text())
+
+      if (linkText) {
+        evtOptions.label = linkText
+      }
+
+      GOVUK.analytics.trackEvent('Download Link Clicked', href, evtOptions)
+    }
+
+    function getLinkFromEvent (evt) {
+      var $target = $(evt.target)
+
+      if (!$target.is('a')) {
+        $target = $target.parents('a')
+      }
+
+      return $target
+    }
+  }
+
+  global.GOVUK = GOVUK
+})(window)

data/app/assets/javascripts/govuk_publishing_components/analytics/ecommerce.js

@@ -0,0 +1,101 @@
+// https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce
+/* global GOVUK, $, ga */
+
+(function () {
+  'use strict'
+  window.GOVUK = window.GOVUK || {}
+
+  var DEFAULT_LIST_TITLE = 'Site search results'
+  var DEFAULT_TRACK_CLICK_LABEL = 'Results'
+
+  var Ecommerce = function (config) {
+    this.init = function (element) {
+      // Limiting to 100 characters to avoid noise from extra longs search queries
+      // and to stop the size of the payload going over 8k limit.
+      var searchQuery = GOVUK.analytics.stripPII(element.attr('data-search-query')).substring(0, 100).toLowerCase()
+      var ecommerceRows = element.find('[data-ecommerce-row]')
+      var startPosition = parseInt(element.data('ecommerce-start-index'), 10)
+      var listTitle = element.data('list-title') || DEFAULT_LIST_TITLE
+      var variant = element.data('ecommerce-variant')
+      var trackClickLabel = element.data('track-click-label') || DEFAULT_TRACK_CLICK_LABEL
+
+      ecommerceRows.each(function (index, ecommerceRow) {
+        var $ecommerceRow = $(ecommerceRow)
+        var listSubheading = $ecommerceRow.data('ecommerce-subheading') || undefined
+        var contentId = $ecommerceRow.attr('data-ecommerce-content-id')
+        var path = $ecommerceRow.attr('data-ecommerce-path')
+
+        var indexOverride = $ecommerceRow.attr('data-ecommerce-index')
+        index = indexOverride ? parseInt(indexOverride, 10) - 1 : index
+
+        addImpression(contentId, path, index + startPosition, searchQuery, listTitle, listSubheading, variant)
+        trackProductOnClick($ecommerceRow, contentId, path, index + startPosition, searchQuery, listTitle, listSubheading, variant, trackClickLabel)
+      })
+    }
+
+    function constructData (contentId, path, position, listTitle, listSubheading, searchQuery, variant) {
+      var data = {
+        position: position,
+        list: listTitle,
+        dimension71: searchQuery
+      }
+
+      if (listSubheading !== undefined) {
+        data.dimension94 = listSubheading
+      }
+
+      if (contentId !== undefined) {
+        data.id = contentId
+      }
+
+      if (path !== undefined) {
+        data.name = path
+      }
+
+      if (variant !== undefined) {
+        data.variant = variant
+      }
+
+      return data
+    }
+
+    function addImpression (contentId, path, position, searchQuery, listTitle, listSubheading, variant) {
+      if (contentId || path) {
+        var impressionData = constructData(contentId, path, position, listTitle, listSubheading, searchQuery, variant)
+        ga('ec:addImpression', impressionData)
+      }
+    }
+
+    function trackProductOnClick (row, contentId, path, position, searchQuery, listTitle, listSubheading, variant, trackClickLabel) {
+      row.click(function () {
+        if (contentId || path) {
+          var clickData = constructData(contentId, path, position, listTitle, listSubheading, searchQuery, variant)
+          ga('ec:addProduct', clickData)
+        }
+
+        ga('ec:setAction', 'click', { list: listTitle })
+        GOVUK.analytics.trackEvent('UX', 'click',
+          GOVUK.CustomDimensions.getAndExtendDefaultTrackingOptions({ label: trackClickLabel })
+        )
+      })
+    }
+  }
+
+  Ecommerce.ecLoaded = false
+  Ecommerce.start = function (element) {
+    if (!window.ga) { return }
+    element = element || $('[data-analytics-ecommerce]')
+    if (element.length > 0) {
+      if (!Ecommerce.ecLoaded) {
+        ga('require', 'ec')
+        Ecommerce.ecLoaded = true
+      }
+      element.each(function (index) {
+        var ecommerce = new Ecommerce()
+        ecommerce.init($(this))
+      })
+    }
+  }
+
+  GOVUK.Ecommerce = Ecommerce
+})()

data/app/assets/javascripts/govuk_publishing_components/analytics/error-tracking.js

@@ -0,0 +1,51 @@
+// Extension to track errors using google analytics as a data store.
+;(function (global) {
+  'use strict'
+
+  var GOVUK = global.GOVUK || {}
+
+  GOVUK.analyticsPlugins = GOVUK.analyticsPlugins || {}
+
+  GOVUK.analyticsPlugins.error = function (options) {
+    options = options || {}
+    var filenameMustMatch = options.filenameMustMatch
+
+    var trackJavaScriptError = function (e) {
+      var errorFilename = e.filename
+      var errorSource = errorFilename + ': ' + e.lineno
+
+      if (shouldTrackThisError(errorFilename)) {
+        GOVUK.analytics.trackEvent('JavaScript Error', e.message, {
+          label: errorSource,
+          value: 1,
+          nonInteraction: true
+        })
+      }
+    }
+
+    function shouldTrackThisError (errorFilename) {
+      // Errors in page should always be tracked
+      // If there's no filename filter, everything is tracked
+      if (!errorFilename || !filenameMustMatch) {
+        return true
+      }
+
+      // If there's a filter and the error matches it, track it
+      if (filenameMustMatch.test(errorFilename)) {
+        return true
+      }
+
+      return false
+    }
+
+    if (global.addEventListener) {
+      global.addEventListener('error', trackJavaScriptError, false)
+    } else if (global.attachEvent) {
+      global.attachEvent('onerror', trackJavaScriptError)
+    } else {
+      global.onerror = trackJavaScriptError
+    }
+  }
+
+  global.GOVUK = GOVUK
+})(window)