govuk_publishing_components 27.9.0 → 27.10.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 716757ceb3c2638a8c67e577bd15a1b62f9b65127ba98252084695f65ae961e9
-  data.tar.gz: 50c813732192c2f8a95a65f29cee6ad2ee9fceaa43f766f46d27c5b132db2fbc
+  metadata.gz: 5dee5bb8329667345e4d430b7a49b863b5e68ebfb9398388ee7920b6beb4a3aa
+  data.tar.gz: 2cec1ec99cea9a101a6066f3744d0b2faf37b2e21b3a560ef823f5fb0ee75398
 SHA512:
-  metadata.gz: 1c7293c79a3baf87072f3994cb5b8eaee52838bf94b539681bc8cf3719e4e2df1a0fe22c3683c1da9df0d0abb88cad4c57a7aa75e267274db3f2bad90b3606a3
-  data.tar.gz: 4bcca70d40ad1f482bcc1b1bc7497ec43e1561262125f9009f6d5b119104c1684fe47f527a67ee56f49452e0861c60a6a8db083f8ad66333dde9f5b57c2d4847
+  metadata.gz: 776095b867336f69a760f40f8e0a3f05de2f85e2c7f8dd078ad9cf1a45d5f1962c32d69dff75963e61c1b1481c0f9a7a010668ce7e73ca63e981bb9053b3f17b
+  data.tar.gz: 8b49fa796edac5d3fe46fc76db93687baacb45074af825c94d6f81fdf70ead9273116dce5630ccbac424e8619b6c878dc82512d32ebd24392f796dcf79c592c1

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

@@ -124,25 +124,11 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
     this.hiddenButtons = this.$module.querySelectorAll('button[hidden]')
 
-    this.lastWindowSize = undefined
+    this.lastWindowSize = null
   }
 
   SuperNavigationMegaMenu.prototype.windowSize = windowSize
 
-  // Resizes the space needed for the dropdown menu so that it doesn't overlap
-  // with the page content. As this is an event that needs to be added and
-  // removed it can't be be bound to `this` because that changes the fingerprint
-  // of the function, and makes it unable to be removed with
-  // `removeEventListener`.
-  SuperNavigationMegaMenu.prototype.resizeHandler = function () {
-    var $module = document.querySelector('[data-module="super-navigation-mega-menu"]')
-    var $openButton = $module.querySelector('[aria-expanded="true"][data-toggle-desktop-group="top"]')
-    var $openMenu = $openButton ? $module.querySelector('#' + $openButton.getAttribute('aria-controls')) : null
-    var margin = $openMenu && windowSize() === 'desktop' ? $openMenu.offsetHeight : 0
-
-    $module.style.marginBottom = margin + 'px'
-  }
-
   SuperNavigationMegaMenu.prototype.updateStates = function () {
     if (this.windowSize() === 'mobile' && this.lastWindowSize !== 'mobile') {
       this.$navigationToggle.removeAttribute('hidden')
@@ -161,8 +147,21 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     if (this.windowSize() === 'desktop' && this.lastWindowSize !== 'desktop') {
       this.$navigationToggle.setAttribute('hidden', 'hidden')
       this.$navigationMenu.removeAttribute('hidden')
+    }
 
-      this.resizeHandler()
+    // 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()
@@ -231,30 +230,11 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
     this.lastWindowSize = this.windowSize()
 
-    // The menu needs to be updated when the window is resized - specifically,
-    // the top level navigation toggle needs to be shown or hidden.
-    //     Using `matchMedia` to listen for both resize events means that this
-    // will only fire when the media query is matched so is more efficient. The
-    // fallback is the `window.resize` event with a check to make sure that it
-    // only does things when moving from mobile to desktop view.
-    var setupResizeListener = function () {
-      window.addEventListener('resize', this.updateStates.bind(this), { passive: true })
-    }.bind(this)
-
-    if (typeof window.matchMedia === 'function') {
-      // Internet Explorer 11 supports `matchMedia`, but doesn't support
-      // the `change` event[1] - so we try it, and then fail back to using
-      // `window.resize`.
-      // [1]: https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/onchange
-      try {
-        window.matchMedia('screen and (min-width:' + SETTINGS.breakpoint.desktop + 'px)')
-          .addEventListener('change', this.updateStates.bind(this))
-      } catch (error) {
-        setupResizeListener()
-      }
-    } else {
-      setupResizeListener()
-    }
+    // 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 })
+
+    this.$module.classList.add('js-module-initialised')
   }
 
   Modules.SuperNavigationMegaMenu = SuperNavigationMegaMenu

data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss

@@ -314,7 +314,7 @@ $search-icon-size: 20px;
 }
 
 .gem-c-layout-super-navigation-header__navigation-items {
-  .js-enabled & {
+  .js-module-initialised & {
     padding: 0 0 govuk-spacing(9) 0;
 
     @include govuk-media-query($from: "desktop") {
@@ -385,7 +385,7 @@ $search-icon-size: 20px;
     color: $govuk-focus-text-colour;
   }
 
-  .js-enabled & {
+  .js-module-initialised & {
     @include govuk-media-query($until: "desktop") {
       padding: govuk-spacing(6) govuk-spacing(3) govuk-spacing(6) govuk-spacing(9);
     }
@@ -443,7 +443,7 @@ $search-icon-size: 20px;
   padding-bottom: govuk-spacing(4);
   padding-top: govuk-spacing(4);
 
-  .js-enabled & {
+  .js-module-initialised & {
     display: block;
   }
 }
@@ -787,7 +787,7 @@ $search-icon-size: 20px;
   @include govuk-media-query($from: "desktop") {
     margin: 0;
 
-    .js-enabled & {
+    .js-module-initialised & {
       left: 0;
       position: absolute;
       right: 0;

data/app/views/govuk_publishing_components/components/_layout_for_public.html.erb

@@ -8,6 +8,7 @@
   navigation_items ||= []
   omit_feedback_form ||= false
   omit_footer_navigation ||= false
+  omit_footer_border ||= false
   omit_header ||= false
   product_name ||= nil
   show_explore_header ||= false
@@ -143,7 +144,7 @@
 
     <% unless local_assigns[:hide_footer_links] %>
       <%= render "govuk_publishing_components/components/layout_footer", {
-        with_border: true,
+        with_border: !omit_footer_border,
         navigation: omit_footer_navigation ? nil : layout_helper.footer_navigation,
         meta: layout_helper.footer_meta,
       } %>

data/app/views/govuk_publishing_components/components/layout_for_public/_account-layout.html.erb

@@ -1,15 +1,7 @@
 <div class="govuk-width-container">
-  <% message = capture do %>
-    <%= t("components.layout_for_public.account_layout.feedback.banners.phase_intro") %>
-    <a class="govuk-link" href=<%= GovukPersonalisation::Urls.feedback %>>
-      <%= t("components.layout_for_public.account_layout.feedback.banners.phase_link") %>
-    </a>
-    <%= t("components.layout_for_public.account_layout.feedback.banners.phase_outro") %>
-  <% end %>
-
   <%= render "govuk_publishing_components/components/phase_banner", {
     phase: "beta",
-    message: message
+    message: sanitize(t("components.layout_for_public.account_layout.feedback.banners.phase_banner_html"))
   } unless omit_account_phase_banner %>
 
   <div class="govuk-grid-row govuk-main-wrapper">

data/config/locales/en.yml

@@ -94,9 +94,7 @@ en:
       account_layout:
         feedback:
           banners:
-            phase_intro: We’re trialling GOV.UK accounts - your
-            phase_link: feedback
-            phase_outro: will help us improve them.
+            phase_banner_html: This is a new service – your <a class="govuk-link" href="https://signin.account.gov.uk/contact-us?supportType=PUBLIC">feedback</a> will help us to improve it.
         navigation:
           destroy_user_session: Sign out
           menu_bar:

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "27.9.0".freeze
+  VERSION = "27.10.1".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 27.9.0
+  version: 27.10.1
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-10-27 00:00:00.000000000 Z
+date: 2021-11-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govuk_app_config