govuk_publishing_components 70.0.0 → 70.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 26a6e82416b5041f7d941625ee6c9fa4416ee57859ab124efdeaa55b21ba7e68
-  data.tar.gz: d1ad65841b1e9e4354b5fdb1cfbda0ad15332cf853c746762672baa0d7439502
+  metadata.gz: d8ba839c9e37ab74e7b66ba8b6b32e81b9c99f1ad3b31ad8425a0c2e91e7df7f
+  data.tar.gz: 635783cf55c655079398c02c541a4aa09a7ecb67c8a8b8b1802e06f4e327806a
 SHA512:
-  metadata.gz: d7b0a49fc66cab25c6aaa6cd45ac6228989b8baa4052035a2419e014f6979e257e2db3a6cf4dc5c1a186eb959c1ab7f5e0660a181ae74fa5bca34c43ce281fe7
-  data.tar.gz: a4b68eccc46b2b0bbed51b27c1f1c7e3da9af808786aeed7e3fa8794b1619d5f96af23e01ef6b5f8e3b9c4dc6de01142e9069c5ae74282a2ad95198c9af458b1
+  metadata.gz: aae0a87278ac959798cbfa23c6c5884c1e2edc33918d963acb45cdf8b7a3656233912a4d67b605bc0cef5e567f9471bcab96d78d6970877f8f75a03f4721a85a
+  data.tar.gz: 96f01ce33679f119d9d9d77462d762f3a9bba38413bd640b5ef46b72f70d5d274fc3435e3f586f71fa5804e7d556020d5948ae91279e535ca3caa20c9f2840a8

data/app/assets/javascripts/govuk_publishing_components/lib/toggle.js

@@ -108,29 +108,40 @@
   GemToggle.prototype.toggleOnClick = function () {
     var that = this
 
+    this.$module.toggleTrigger.addEventListener('keydown', function (event) {
+      if (event.key === ' ') {
+        event.preventDefault()
+        that.toggle(this)
+      }
+    })
+
     this.$module.toggleTrigger.addEventListener('click', function (event) {
       event.preventDefault()
-      var expanded = this.getAttribute('aria-expanded') === 'true'
-
-      if (expanded) {
-        this.setAttribute('aria-expanded', false)
-        for (var i = 0; i < that.$module.targets.length; i++) {
-          that.$module.targets[i].classList.add(that.$module.toggleClass)
-        }
-      } else {
-        this.setAttribute('aria-expanded', true)
-        for (var j = 0; j < that.$module.targets.length; j++) {
-          that.$module.targets[j].classList.remove(that.$module.toggleClass)
-        }
-      }
+      that.toggle(this)
+    })
+  }
 
-      var toggledText = this.getAttribute('data-toggled-text')
+  GemToggle.prototype.toggle = function ($trigger) {
+    var expanded = $trigger.getAttribute('aria-expanded') === 'true'
 
-      if (typeof toggledText === 'string') {
-        this.setAttribute('data-toggled-text', this.innerHTML)
-        this.innerHTML = toggledText
+    if (expanded) {
+      $trigger.setAttribute('aria-expanded', false)
+      for (var i = 0; i < this.$module.targets.length; i++) {
+        this.$module.targets[i].classList.add(this.$module.toggleClass)
       }
-    })
+    } else {
+      $trigger.setAttribute('aria-expanded', true)
+      for (var j = 0; j < this.$module.targets.length; j++) {
+        this.$module.targets[j].classList.remove(this.$module.toggleClass)
+      }
+    }
+
+    var toggledText = $trigger.getAttribute('data-toggled-text')
+
+    if (typeof toggledText === 'string') {
+      $trigger.setAttribute('data-toggled-text', $trigger.innerHTML)
+      $trigger.innerHTML = toggledText
+    }
   }
 
   Modules.GemToggle = GemToggle

data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-reporter.js

@@ -298,7 +298,7 @@
     return sendBeaconImpl(url, data);
   }
 
-  var version = "4.5.0";
+  var version = "4.5.2";
   var pkg = {
     version: version};
 
@@ -1377,10 +1377,8 @@
       observe("element", processAndLogEntry);
       observe("paint", processAndLogEntry);
       if (observe("largest-contentful-paint", function (entry) {
-        // Process the LCP entry for the legacy beacon
-        processAndLogEntry(entry);
-        // Process the LCP entry for the new beacon
         processEntry(entry);
+        logEntry(entry);
       })) {
         beaconCollectors[push]([BeaconMetricKey.LCP, getData$2]);
       }
@@ -2129,7 +2127,6 @@
         var navEntry_1 = getNavigationEntry();
         var startRender = getStartRender();
         var fcp = getFcp();
-        var lcp = getLcp();
         var prefixNTValue = function (key, prefix, ignoreZero) {
           if (typeof navEntry_1[key] === "number") {
             var value = navEntry_1[key];
@@ -2178,7 +2175,6 @@
           loadEventEndStr,
           typeof startRender !== "undefined" ? "sr" + startRender : "",
           typeof fcp !== "undefined" ? "fc" + fcp : "",
-          typeof lcp !== "undefined" ? "lc" + lcp : "",
         ].join("");
       }
       else if (endMark) {
@@ -2210,19 +2206,6 @@
       }
       return undefined;
     }
-    // Return Largest Contentful Paint or undefined if not supported.
-    function getLcp() {
-      var lcpEntries = getEntries("largest-contentful-paint");
-      if (lcpEntries[length]) {
-        var lastEntry = lcpEntries[lcpEntries[length] - 1];
-        var value = processTimeMetric(lastEntry[startTime$1]);
-        if (shouldReportValue(value)) {
-          logger.logEvent(43 /* LogEvent.PerformanceEntryProcessed */, [lastEntry]);
-          return value;
-        }
-      }
-      return undefined;
-    }
     // Return best guess at Start Render time (in ms).
     // Mostly works on just Chrome and IE.
     // Return undefined if not supported.
@@ -2247,33 +2230,6 @@
       logger.logEvent(72 /* LogEvent.PaintTimingNotSupported */);
       return undefined;
     }
-    function getINPDetails() {
-      if (!("PerformanceEventTiming" in self)) {
-        return undefined;
-      }
-      return getHighPercentileInteraction();
-    }
-    /**
-    * Build the query string for the INP parameters:
-    *
-    * - INP: The duration of the P98 interaction
-    * - INPs: The selector of the P98 interaction element
-    * - INPt: The timestamp of the P98 interaction start time
-    * - INPi: The input delay subpart of the P98 interaction
-    * - INPp: The processing time subpart of the P98 interaction
-    * - INPd: The presentation delay subpart of the P98 interaction
-    */
-    function getINPString(details) {
-      return [
-        "&INP=" + details[duration],
-        details[selector] ? "&INPs=" + encodeURIComponent(details[selector]) : "",
-        "&INPt=" + floor(details[startTime$1]),
-        "&INPi=" + clamp(floor(details[processingStart] - details[startTime$1])),
-        "&INPp=" + clamp(floor(details[processingTime])),
-        "&INPd=" +
-        clamp(floor(details[startTime$1] + details[duration] - details[processingEnd])),
-      ].join("");
-    }
     function getCustomerId() {
       return String(_thisCustomerId);
     }
@@ -2493,20 +2449,13 @@
         addCustomDataValue("_" + key, trackingParams[key]);
       }
       var sIx = "";
-      var INP = getINPDetails();
       // If we haven't already sent an interaction beacon, check for interaction metrics and include
       // them in the main beacon.
       if (!gbIxSent) {
         sIx = ixValues();
-        if (sIx === "") {
-          // If there are no interaction metrics, we wait to send INP with the IX beacon to increase
-          // the chance that we capture a valid INP.
-          INP = undefined;
-        }
       }
       var sET = elementTimingValues(); // Element Timing data
       var sCPU = cpuTimes();
-      var clsData = getData$5(globalConfig);
       var sLuxjs = selfLoading();
       if (!isVisible()) {
         gFlags = addFlag(gFlags, 8 /* Flags.VisibilityStateNotVisible */);
@@ -2585,10 +2534,7 @@
       (sIx ? "&IX=" + sIx : "") +
       (typeof gFirstInputDelay !== "undefined" ? "&FID=" + gFirstInputDelay : "") +
       (sCPU ? "&CPU=" + sCPU : "") +
-      (sET ? "&ET=" + sET : "") + // element timing
-      (clsData ? "&CLS=" + clsData.value.toFixed(6) : "") +
-      // INP and sub-parts
-      (INP ? getINPString(INP) : "");
+      (sET ? "&ET=" + sET : ""); // element timing
       // We add the user timing entries last so that we can split them to reduce the URL size if necessary.
       var utValues = userTimingValues();
       var _b = fitUserTimingEntries(utValues, globalConfig, baseUrl + metricsQueryString), beaconUtValues = _b[0], remainingUtValues = _b[1];
@@ -2627,13 +2573,11 @@
         return;
       }
       var sIx = ixValues(); // Interaction Metrics
-      var INP = getINPDetails();
       if (sIx) {
         var beaconUrl = _getBeaconUrl(getUpdatedCustomData()) +
         "&IX=" +
         sIx +
-        (typeof gFirstInputDelay !== "undefined" ? "&FID=" + gFirstInputDelay : "") +
-        (typeof INP !== "undefined" ? getINPString(INP) : "");
+        (typeof gFirstInputDelay !== "undefined" ? "&FID=" + gFirstInputDelay : "");
         logger.logEvent(25 /* LogEvent.InteractionBeaconSent */, [beaconUrl]);
         _sendBeacon(beaconUrl);
         gbIxSent = 1;

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

@@ -80,6 +80,14 @@
     padding-left: govuk-spacing(4);
   }
 
+  .govuk-details__summary::before {
+    @include govuk-shape-arrow($direction: right, $base: 12px);
+  }
+
+  &[open] .govuk-details__summary::before {
+    @include govuk-shape-arrow($direction: down, $base: 12px);
+  }
+
   .govuk-details__summary-text,
   .govuk-details__text {
     @include govuk-font(16);

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

@@ -109,6 +109,10 @@
   }
 }
 
+.gem-c-metadata__details-wrapper {
+  padding-top: govuk-spacing(1);
+}
+
 .gem-c-metadata__change-history {
   margin: 0;
   padding: 0;

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

@@ -56,13 +56,13 @@
       <% if from.any? %>
         <dt class="gem-c-metadata__term"><%= t("components.metadata.from") %>:</dt>
         <dd class="gem-c-metadata__definition">
-          <%= render "govuk_publishing_components/components/metadata/sentence", items: from, toggle_id: "from-#{SecureRandom.hex(4)}" %>
+          <%= render "govuk_publishing_components/components/metadata/sentence", items: from, toggle_id: "from-#{SecureRandom.hex(4)}", inverse: inverse %>
         </dd>
       <% end %>
       <% if part_of.any? %>
         <dt class="gem-c-metadata__term"><%= t("components.metadata.part_of") %>:</dt>
         <dd class="gem-c-metadata__definition">
-          <%= render "govuk_publishing_components/components/metadata/sentence", items: part_of, toggle_id: "part-of-#{SecureRandom.hex(4)}" %>
+          <%= render "govuk_publishing_components/components/metadata/sentence", items: part_of, toggle_id: "part-of-#{SecureRandom.hex(4)}", inverse: inverse %>
         </dd>
       <% end %>
       <% if local_assigns.include?(:history) %>
@@ -84,19 +84,22 @@
             </a>
           <% end %>
           <% if page_history.any? %>
-            <%= render "govuk_publishing_components/components/details", {
-              title: t("components.metadata.show_all_updates", locale: :en),
-              small: true,
-            } do %>
-              <ol class="gem-c-metadata__change-history">
-                <% page_history.each do |change| %>
-                  <li class="gem-c-metadata__change-history-item">
-                    <time class="gem-c-metadata__change-date" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
-                    <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
-                  </li>
-                <% end %>
-              </ol>
-            <% end %>
+            <div class="gem-c-metadata__details-wrapper">
+              <%= render "govuk_publishing_components/components/details", {
+                title: t("components.metadata.show_all_updates", locale: :en),
+                small: true,
+                inverse: inverse,
+              } do %>
+                <ol class="gem-c-metadata__change-history">
+                  <% page_history.each do |change| %>
+                    <li class="gem-c-metadata__change-history-item">
+                      <time class="gem-c-metadata__change-date" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
+                      <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
+                    </li>
+                  <% end %>
+                </ol>
+              <% end %>
+            </div>
           <% end %>
         </dd>
       <% end %>
@@ -113,7 +116,7 @@
                 data-module="ga4-link-tracker"
                 data-ga4-link="<%= ga4_object %>"
               <% end %>>
-              <%= render "govuk_publishing_components/components/metadata/sentence", items: definition, toggle_id: "#{index}-#{SecureRandom.hex(4)}" %>
+              <%= render "govuk_publishing_components/components/metadata/sentence", items: definition, toggle_id: "#{index}-#{SecureRandom.hex(4)}", inverse: inverse %>
             </dd>
           <% end %>
         <% end %>

data/app/views/govuk_publishing_components/components/docs/cookie_banner.yml

@@ -10,8 +10,6 @@ accessibility_criteria: |
   Text in the cookie banner must be clear and unambiguous and should provide a way to dismiss the message.
 shared_accessibility_criteria:
   - link
-accessibility_excluded_rules:
-  - 'duplicate-id' # a banner should have a unique id for a given page. However, this page contains multiple examples of the banner with the same id.
 examples:
   default:
     data: {}

data/app/views/govuk_publishing_components/components/docs/cross_service_header.yml

@@ -25,7 +25,6 @@ accessibility_criteria:
 govuk_frontend_components:
   - service-navigation
 accessibility_excluded_rules:
-  - duplicate-id-aria
   - landmark-no-duplicate-banner
   - landmark-unique
 examples:

data/app/views/govuk_publishing_components/components/docs/emergency_banner.yml

@@ -9,7 +9,6 @@ uses_component_wrapper_helper: true
 shared_accessibility_criteria:
   - link
 accessibility_excluded_rules:
-  - duplicate-id-aria # IDs will be duplicated in component examples list
   - landmark-unique # aria-label attributes will be duplicated in component examples list
 examples:
   default:

data/app/views/govuk_publishing_components/components/docs/layout_header.yml

@@ -9,8 +9,6 @@ uses_component_wrapper_helper: true
 capture_full_width_screenshot: true
 accessibility_excluded_rules:
   - landmark-banner-is-top-level # The header element can not be top level in the examples
-  - duplicate-id # IDs will be duplicated in component examples list
-  - duplicate-id-aria # IDs will be duplicated in component examples list
   - form-field-multiple-labels # Form labels will be ambiguous in component examples list
   - landmark-no-duplicate-banner # banners will be duplicated in component examples list
   - landmark-unique # aria-label attributes will be duplicated in component examples list

data/app/views/govuk_publishing_components/components/docs/layout_super_navigation_header.yml

@@ -19,8 +19,6 @@ accessibility_criteria: |
   * sit within the primary header element (<header>) provided by the page layout
 accessibility_excluded_rules:
   # Banners will be duplicated in component examples list.
-  - duplicate-id
-  - duplicate-id-active
   - duplicate-id-aria
   - landmark-no-duplicate-banner
   - landmark-unique

data/app/views/govuk_publishing_components/components/docs/related_navigation.yml

@@ -6,8 +6,6 @@ accessibility_criteria: |
 uses_component_wrapper_helper: true
 shared_accessibility_criteria:
   - link
-accessibility_excluded_rules:
-  - duplicate-id
 examples:
   default:
     data:

data/app/views/govuk_publishing_components/components/docs/service_navigation.yml

@@ -5,7 +5,6 @@ accessibility_criteria: |
   - text should have a text contrast ratio higher than 4.5:1 against the background colour to meet WCAG AA
   - the icon must not be focusable or shown to screenreaders
 accessibility_excluded_rules:
-  - duplicate-id-aria
   - landmark-unique
 uses_component_wrapper_helper: true
 capture_full_width_screenshot: true

data/app/views/govuk_publishing_components/components/metadata/_sentence.html.erb

@@ -9,10 +9,13 @@
 %>
 <%= items.to_sentence(two_words_connector: connector, last_word_connector: connector).html_safe %>
 <% if remaining.any? %>
-  <%= render "govuk_publishing_components/components/details", {
-    title: t("common.toggle_more", show: t("common.show"), number: remaining.length),
-    small: true,
-  } do %>
-    <%= remaining.to_sentence.html_safe %>
-  <% end %>
+  <div class="gem-c-metadata__details-wrapper">
+    <%= render "govuk_publishing_components/components/details", {
+      title: t("common.toggle_more", show: t("common.show"), number: remaining.length),
+      small: true,
+      inverse: inverse,
+    } do %>
+      <%= remaining.to_sentence.html_safe %>
+    <% end %>
+  </div>
 <% end %>

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "70.0.0".freeze
+  VERSION = "70.0.1".freeze
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 70.0.0
+  version: 70.0.1
 platform: ruby
 authors:
 - GOV.UK Dev