govuk_publishing_components 33.1.0 → 34.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4e788fa8e962e9665a5c978857dd72563e92394a2b437020e143242e48eac153
-  data.tar.gz: 47ebd5cd998e31cf0899e6a4dfa83949466fa1f9e357edecfb5551ca6c4b7ee3
+  metadata.gz: 2070abba195716c8e72ea85dc7d7f207df27c52e497e808c8bc5d79c7b56b8af
+  data.tar.gz: f9978ff5d94c66b454978bc58346b8a76f7ff5408210695fd38372e4e5d29c20
 SHA512:
-  metadata.gz: 55773e69567c5797c93ce788fb226f8d8ca9dcc256b12b5c6dd6caca421c5419d20f98dda3db8a8dc3baa5606915b5a0975ee738ceea752cb174feec9ce2bc5e
-  data.tar.gz: '093545166981ef4a4c15dd7864bfe6a3017df0a7c5a61bad7c925e1834fcfaec3e2acc9be675ae184f63213882902e20b2190bc0393ab22327b5a6f16d344593'
+  metadata.gz: c587c35eadec57a5515587e2064f5d55154cc9767a823015e4fb103bab8599bf367e2cfdbd5f58e65fd2612d690ba85b7760dd6535899ff5b90ad479b19a4ef9
+  data.tar.gz: c888b0e1e6ef2f1fde331e163009bd6f84077bb8011fcc799612af5d00d72f52cec00935f7cd71e347dd2d357f6c9e98ccc91a0c277b0bc4763ca9cdf4123591

data/app/assets/config/govuk_publishing_components_manifest.js

@@ -12,4 +12,3 @@
 //= link govuk_publishing_components/vendor/lux/lux-reporter.js
 //= link govuk_publishing_components/vendor/lux/lux-measurer.js
 //= link component_guide/application.css
-//= link component_guide/print.css

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

@@ -11,34 +11,23 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
       var newScript = document.createElement('script')
       newScript.async = true
 
-      if (window.GOVUK.analyticsGa4.vars.gtag_id) {
-        // initialise gtag
-        window.dataLayer = window.dataLayer || []
-        var gtag = function () { window.dataLayer.push(arguments) }
-        gtag('js', new Date())
-        gtag('config', window.GOVUK.analyticsGa4.vars.gtag_id)
-
-        newScript.src = '//www.googletagmanager.com/gtag/js?id=' + window.GOVUK.analyticsGa4.vars.gtag_id
-        firstScript.parentNode.insertBefore(newScript, firstScript)
-      } else {
-        // initialise GTM
-        window.dataLayer = window.dataLayer || []
-        window.dataLayer.push({ 'gtm.blocklist': ['customPixels', 'customScripts', 'html', 'nonGoogleScripts'] })
-        window.dataLayer.push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' })
-
-        var auth = window.GOVUK.analyticsGa4.vars.auth || ''
-        var preview = window.GOVUK.analyticsGa4.vars.preview || ''
-        if (auth) {
-          auth = '&gtm_auth=' + auth
-        }
-        if (preview) {
-          preview = '&gtm_preview=' + preview + '&gtm_cookies_win=x'
-        }
-
-        this.googleSrc = 'https://www.googletagmanager.com/gtm.js?id=' + window.GOVUK.analyticsGa4.vars.id + auth + preview
-        newScript.src = this.googleSrc
-        firstScript.parentNode.insertBefore(newScript, firstScript)
+      // initialise GTM
+      window.dataLayer = window.dataLayer || []
+      window.dataLayer.push({ 'gtm.blocklist': ['customPixels', 'customScripts', 'html', 'nonGoogleScripts'] })
+      window.dataLayer.push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' })
+
+      var auth = window.GOVUK.analyticsGa4.vars.auth || ''
+      var preview = window.GOVUK.analyticsGa4.vars.preview || ''
+      if (auth) {
+        auth = '&gtm_auth=' + auth
       }
+      if (preview) {
+        preview = '&gtm_preview=' + preview + '&gtm_cookies_win=x'
+      }
+
+      this.googleSrc = 'https://www.googletagmanager.com/gtm.js?id=' + window.GOVUK.analyticsGa4.vars.id + auth + preview
+      newScript.src = this.googleSrc
+      firstScript.parentNode.insertBefore(newScript, firstScript)
     },
 
     sendData: function (data) {

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

@@ -42,6 +42,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         return
       }
 
+      var text = data.text || event.target.textContent
+      data.text = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(text)
       schema.event = 'event_data'
       // get attributes from the data attribute to send to GA
       // only allow it if it already exists in the schema

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

@@ -28,11 +28,11 @@ window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analytics
             content_id: this.getMetaContent('content-id'),
 
             browse_topic: this.getMetaContent('section'),
-            taxon_slug: this.getMetaContent('taxon-slug'),
-            taxon_id: this.getMetaContent('taxon-id'),
             taxonomy_level1: this.getMetaContent('themes'),
-            taxon_slugs: this.getMetaContent('taxon-slugs'),
-            taxon_ids: this.getMetaContent('taxon-ids'),
+            taxonomy_main: this.getMetaContent('taxon-slug'),
+            taxonomy_main_id: this.getMetaContent('taxon-id'),
+            taxonomy_all: this.getMetaContent('taxon-slugs'),
+            taxonomy_all_ids: this.getMetaContent('taxon-ids'),
 
             language: this.getLanguage(),
             history: this.getHistory(),

data/app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js

@@ -92,32 +92,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     return closestPrevious(previousElement, elementType)
   }
 
-  // When moving from one screen size to another (eg mobile to desktop) we need
-  // to find out whether a submenu is open so the parent menu can be kept open.
-  var hasSubMenusOpen = function ($menu) {
-    return $menu.querySelectorAll('button[aria-expanded="true"]').length > 0
-  }
-
-  // Detect the current viewport width. Return the string `desktop` or `mobile` so it can be interpolated to access the
-  // `data-toggle-{desktop|mobile}-group` attribute.
-  //
-  // Use `matchedia` which mitigates issues in modern browsers when scrollbars are forced in MacOS (using `document.documentElement.clientWidth`
-  // for viewport width detection has issues in Chrome and Firefox, and `window.innerWidth` has issues in Safari).
-  //
-  //  Fall back to `document.documentElement.clientWidth` for legacy browsers.
-  var windowSize = function () {
-    var viewport = false
-    if (typeof window.matchMedia === 'function') {
-      viewport = window.matchMedia('(min-width:' + SETTINGS.breakpoint.desktop + 'px)').matches
-    } else {
-      viewport = document.documentElement.clientWidth >= SETTINGS.breakpoint.desktop
-    }
-    return viewport ? 'desktop' : 'mobile'
-  }
   function SuperNavigationMegaMenu ($module) {
     this.$module = $module
-    this.$navigationToggle = this.$module.querySelector('#super-navigation-menu-toggle')
-    this.$navigationMenu = this.$module.querySelector('#super-navigation-menu')
     this.$searchToggle = this.$module.querySelector('#super-search-menu-toggle')
     this.$searchMenu = this.$module.querySelector('#super-search-menu')
 
@@ -132,55 +108,25 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     )
 
     this.hiddenButtons = this.$module.querySelectorAll('button[hidden]')
-
-    this.lastWindowSize = null
   }
 
-  SuperNavigationMegaMenu.prototype.windowSize = windowSize
-
   SuperNavigationMegaMenu.prototype.updateStates = function () {
-    if (this.windowSize() === 'mobile' && this.lastWindowSize !== 'mobile') {
-      this.$navigationToggle.removeAttribute('hidden')
-
-      // Hides navigation menu unless a submenu is open - this could be common
-      // as the desktop view has the navigation submenu as top level in the
-      // menu.
-      if (!hasSubMenusOpen(this.$navigationMenu)) {
-        hide(this.$navigationToggle, this.$navigationMenu)
-      }
-
-      this.$module.style.marginBottom = '0'
-    }
-
-    // Hide the navigation toggle button and show the navigation submenu:
-    if (this.windowSize() === 'desktop' && this.lastWindowSize !== 'desktop') {
-      this.$navigationToggle.setAttribute('hidden', 'hidden')
-      this.$navigationMenu.removeAttribute('hidden')
-    }
-
-    // The dropdown menu height is only needed when in desktop mode as this is
-    // when the dropdown menu is using `absolute` positioning. This requires
-    // JavaScript to work out the height and make space for the dropdown menu.
-    if (windowSize() === 'desktop') {
-      // Check whether any of the dropdown menus are open.
-      var $openButton = this.$module.querySelector('[aria-expanded="true"][data-toggle-desktop-group="top"]')
-      // Gets the open dropdown menu
-      var $openMenu = $openButton ? this.$module.querySelector('#' + $openButton.getAttribute('aria-controls')) : null
-      // If there is an open dropdown menu, get the height of the dropdown menu.
-      var margin = $openMenu ? $openMenu.offsetHeight : 0
-
-      // Make space for the dropdown menu.
-      this.$module.style.marginBottom = margin + 'px'
-    }
-
-    this.lastWindowSize = this.windowSize()
+    // Check whether any of the dropdown menus are open.
+    var $openButton = this.$module.querySelector('[aria-expanded="true"][data-toggle-desktop-group="top"]')
+    // Gets the open dropdown menu
+    var $openMenu = $openButton ? this.$module.querySelector('#' + $openButton.getAttribute('aria-controls')) : null
+    // If there is an open dropdown menu, get the height of the dropdown menu.
+    var margin = $openMenu ? $openMenu.offsetHeight : 0
+
+    // Make space for the dropdown menu.
+    this.$module.style.marginBottom = margin + 'px'
   }
 
   SuperNavigationMegaMenu.prototype.buttonHandler = function (event) {
     var $target = closestParentIncluding(event.target, 'button')
     var $targetMenu = this.$module.querySelector('#' + $target.getAttribute('aria-controls'))
 
-    var toggleGroupAttribute = 'data-toggle-' + this.windowSize() + '-group'
+    var toggleGroupAttribute = 'data-toggle-desktop-group'
     var toggleGroupName = $target.getAttribute(toggleGroupAttribute)
     var toggleGroupList = this.$module.querySelectorAll('[' + toggleGroupAttribute + '="' + toggleGroupName + '"]')
 
@@ -194,9 +140,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
     toggle($target, $targetMenu)
 
-    if (this.windowSize() === 'desktop') {
-      this.$module.style.marginBottom = $targetMenu.offsetHeight + 'px'
-    }
+    this.$module.style.marginBottom = $targetMenu.offsetHeight + 'px'
   }
 
   SuperNavigationMegaMenu.prototype.init = function () {
@@ -217,6 +161,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       $element.removeAttribute('hidden')
 
       var closestSiblingLink = closestPrevious($element, 'a')
+
       if (closestSiblingLink) {
         closestSiblingLink.setAttribute('hidden', 'hidden')
       }
@@ -237,8 +182,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     hide(this.$searchToggle, this.$searchMenu)
     this.updateStates()
 
-    this.lastWindowSize = this.windowSize()
-
     // The menu needs to be updated when the window is resized to make sure that
     // the space needed for the dropdown menu is correct.
     window.addEventListener('resize', this.updateStates.bind(this), { passive: true })

data/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js

@@ -178,30 +178,31 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       var title = thisel.querySelectorAll('.js-step-title')[0]
       var contentId = thisel.querySelectorAll('.js-panel')[0].getAttribute('id')
       var titleText = title.textContent || title.innerText // IE8 fallback
-      var ga4Data = ''
-
-      if (this.$module.isGa4Enabled) {
-        var ga4JSON = {
-          event_name: 'select_content',
-          type: 'step by step',
-          text: titleText.trim(),
-          index: i + 1,
-          index_total: this.$module.totalSteps
-        }
-        ga4Data = "data-ga4-event='" + JSON.stringify(ga4JSON) + "'" // Construct GA4 data-attributes for ga4-event-tracker.
-      }
 
       title.outerHTML =
         '<span class="js-step-title">' +
           '<button ' +
             'class="gem-c-step-nav__button gem-c-step-nav__button--title js-step-title-button" ' +
-            'aria-expanded="false" aria-controls="' + contentId + '" ' + ga4Data + '>' +
+            'aria-expanded="false" aria-controls="' + contentId + '"' + '>' +
               '<span class="gem-c-step-nav____title-text-focus">' +
                   '<span class="gem-c-step-nav__title-text js-step-title-text">' + titleText + '</span>' +
                   '<span class="govuk-visually-hidden gem-c-step-nav__section-heading-divider">, </span>' +
               '</span>' +
           '</button>' +
         '</span>'
+
+      if (this.$module.isGa4Enabled) {
+        var ga4JSON = {
+          event_name: 'select_content',
+          type: 'step by step',
+          text: titleText.trim(),
+          index: i + 1,
+          index_total: this.$module.totalSteps
+        }
+
+        var button = thisel.querySelector('.js-step-title-button')
+        button.setAttribute('data-ga4-event', JSON.stringify(ga4JSON))
+      }
     }
   }
 

data/app/assets/stylesheets/govuk_publishing_components/components/_accordion.scss

@@ -5,3 +5,31 @@
 .gem-c-accordion__show-all > * {
   pointer-events: none;
 }
+
+// This is in place until a proper fix comes through from GOV.UK Frontend.
+//
+// TODO: Replace with the print styles that will come from GOV.UK Frontend.
+
+@include govuk-media-query($media-type: print) {
+  // Open all of the accordion sections.
+  .govuk-accordion__section-content {
+    display: block !important; // stylelint-disable-line declaration-no-important
+  }
+
+  // Change the colour from the blue link colour to black.
+  .govuk-accordion__section-button {
+    color: govuk-colour("black") !important; // stylelint-disable-line declaration-no-important
+  }
+
+  // Change the summary subheading size.
+  .govuk-accordion__section-summary {
+    @include govuk-typography-common;
+    @include govuk-typography-responsive($size: 16, $important: true);
+  }
+
+  // Hide the unusable "Show all" and "Show" sections.
+  .govuk-accordion__show-all,
+  .govuk-accordion__section-toggle {
+    display: none !important; // stylelint-disable-line declaration-no-important
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_button.scss

@@ -100,3 +100,14 @@
     content: none;
   }
 }
+
+@include govuk-media-query($media-type: print) {
+  .gem-c-button {
+    @include govuk-font(14);
+    display: inline-block;
+    padding: govuk-spacing(1);
+    border: solid 1px govuk-colour("black");
+    color: $govuk-text-colour;
+    text-decoration: none;
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_cards.scss

@@ -107,3 +107,22 @@
 .gem-c-cards__description {
   margin: 0 govuk-spacing(-6) 0 0;
 }
+
+@include govuk-media-query($media-type: print) {
+  .gem-c-cards__list {
+    display: block;
+  }
+
+  .gem-c-cards__list-item {
+    padding-bottom: 0;
+  }
+
+  .gem-c-cards__sub-heading {
+    margin-top: govuk-spacing(4);
+    margin-bottom: govuk-spacing(1);
+  }
+
+  .gem-c-cards__link:before {
+    display: none;
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_contents-list.scss

@@ -74,3 +74,23 @@
     vertical-align: top;
   }
 }
+
+@include govuk-media-query($media-type: print) {
+  // Override default browser indentation
+  .gem-c-contents-list__list,
+  .gem-c-contents-list__nested-list {
+    padding-left: 0;
+    margin-left: 0;
+  }
+
+  // Put indentation back where we use list style types
+  .gem-c-contents-list__list-item--dashed {
+    margin-left: govuk-spacing(3);
+    list-style-type: disc;
+  }
+
+  .gem-c-contents-list__list-item--numbered,
+  .gem-c-contents-list__list-item--parent {
+    list-style-type: none;
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss

@@ -77,3 +77,9 @@ $govuk-cookie-banner-background: govuk-colour("light-grey", "grey-4");
     margin-bottom: - govuk-spacing(2);
   }
 }
+
+@include govuk-media-query($media-type: print) {
+  .gem-c-cookie-banner {
+    display: none !important; // stylelint-disable-line declaration-no-important
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_emergency-banner.scss

@@ -74,3 +74,9 @@
   // the contrast was too low with white text
   background-color: #00847d;
 }
+
+@include govuk-media-query($media-type: print) {
+  .gem-c-emergency-banner {
+    display: none;
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_govspeak-html-publication.scss

@@ -137,3 +137,11 @@
     // stylelint-enable selector-no-qualifying-type
   }
 }
+
+@include govuk-media-query($media-type: print) {
+  .gem-c-govspeak-html-publication {
+    .govuk-sticky-element {
+      display: none;
+    }
+  }
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_govspeak.scss

@@ -27,3 +27,86 @@
     text-align: start;
   }
 }
+
+@include govuk-media-query($media-type: print) {
+  // stylelint-disable max-nesting-depth
+
+  .gem-c-govspeak {
+    .media-player {
+      display: none;
+    }
+
+    .info-notice,
+    .help-notice,
+    .call-to-action {
+      margin: govuk-spacing(3) 0;
+    }
+
+    .call-to-action {
+      background: none;
+      border: 1pt solid $govuk-border-colour;
+      padding: govuk-spacing(3);
+    }
+
+    .help-notice p {
+      font-weight: 700;
+    }
+
+    .fraction {
+      img {
+        display: inline-block;
+        margin-bottom: -7px;
+      }
+    }
+
+    .attachment {
+      margin: govuk-spacing(6) 0;
+
+      &:first-child {
+        margin-top: 0;
+      }
+
+      .attachment-thumb {
+        display: none;
+      }
+
+      .attachment-details {
+        .download {
+          display: block;
+        }
+      }
+
+      .accessibility-warning {
+        h2 {
+          @include govuk-font(14);
+        }
+
+        .toggler {
+          display: none;
+        }
+      }
+    }
+
+    .footnotes {
+      border-top: 1px solid $govuk-text-colour;
+
+      a[role="doc-backlink"] {
+        display: none;
+      }
+    }
+
+    .legislative-list {
+      padding-left: 0;
+
+      &,
+      ol {
+        list-style: none;
+      }
+    }
+
+    .mc-toggle-button,
+    .mc-chart-container {
+      display: none;
+    }
+  }
+}