govuk_publishing_components 35.19.0 → 35.20.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b6d8b36d61c9301cb5d969679a14c93b6b43914a3a734d05e4ae5702b0fb0f79
-  data.tar.gz: 49e458e28c81c1368445b4e9948aa31614ec2a506f9f989083780a0ce6de885d
+  metadata.gz: d1878b4cfefb05ba090334ac9990ead5cd73b519b0dd5086fa15d48715f7fc13
+  data.tar.gz: 3916e46d02628289d1667218a570c67b7b809c584da24064412cc948be37fd23
 SHA512:
-  metadata.gz: 107aa5aee8b2c2c8268342683df0405cc071ada39032d723fd21299a0af1abc6bec4bb5fb7d89879775780bccc32d27b1ac9eb375e28cda218d0016b8cb843d1
-  data.tar.gz: 994233cc78dcaa2ce4a604f3cb2d3be54582bfcfa40b6df323929a808d8d7d56e30e6c1403422a71968d399e27dc6141534f49af06f5713198db721b91d461a1
+  metadata.gz: 764549f50e7ea206131c5cbbbe6ac12e693ed6a8e08c4e27ab2575eac6adf0788a725cda4790b388d58bb3f81884f98e6ff7902b57b906730db6b550cd60acee
+  data.tar.gz: 1d3a83a6d8fb0e602e5b3fdcb54713f79d83e7266b4aa1fe873c41f941489fcac11edac78e03d7ebf655d35aee37c5c4a7cd0c9fe690ec0305b5f4a68567138b

data/app/assets/images/govuk_publishing_components/icon-close.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none"><path fill="#0B0C0C" d="M2 15.435 15.435 2l2.121 2.121L4.121 17.556z"/><path fill="#0B0C0C" d="M15.436 17.557 2 4.122l2.12-2.121 13.436 13.435z"/></svg>

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

@@ -325,6 +325,7 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
           var target = data.event.target
           ecommerceSchema.search_results.ecommerce.items.push({
             item_id: target.getAttribute('data-ga4-ecommerce-path'),
+            item_content_id: target.getAttribute('data-ga4-ecommerce-content-id') || undefined,
             item_name: target.textContent,
             item_list_name: listTitle,
             index: window.GOVUK.analyticsGa4.core.ecommerceHelperFunctions.getIndex(target, startPosition)
@@ -351,6 +352,7 @@ window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {};
 
             ecommerceSchema.search_results.ecommerce.items.push({
               item_id: path,
+              item_content_id: item.getAttribute('data-ga4-ecommerce-content-id') || undefined,
               item_list_name: listTitle,
               index: window.GOVUK.analyticsGa4.core.ecommerceHelperFunctions.getIndex(item, startPosition)
             })

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

@@ -95,6 +95,14 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       data.external = trackFunctions.isExternalLink(data.url) ? 'true' : 'false'
       data.index = this.setIndex(data.index, event.target)
 
+      // flatten the attributes in index into the main data
+      if (data.index) {
+        for (var prop in data.index) {
+          data[prop] = data.index[prop]
+        }
+        delete data.index
+      }
+
       if (data.type === 'smart answer' && data.action === 'change response') {
         data.section = this.PIIRemover.stripPIIWithOverride(data.section, true, true)
       }
@@ -117,7 +125,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     if (target.getAttribute('data-ga4-index')) {
       try {
         var indexLink = JSON.parse(target.getAttribute('data-ga4-index'))
-
         // Check whether the index object already exists on a parent element, as is the case with tracking accordion links.
         // If true, combine data-ga4-index with the index object. Otherwise, just return indexLink
         index = index ? window.GOVUK.extendObject(index, indexLink) : indexLink
@@ -126,7 +133,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         return
       }
     }
-
     return index
   }
 

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

@@ -0,0 +1,24 @@
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.analyticsGa4 = window.GOVUK.analyticsGa4 || {}
+window.GOVUK.analyticsGa4.analyticsModules = window.GOVUK.analyticsGa4.analyticsModules || {};
+
+(function (analyticsModules) {
+  'use strict'
+
+  var Ga4PrintIntentTracker = {
+    init: function () {
+      window.addEventListener('beforeprint', function () {
+        var data = {
+          event_name: 'print_page',
+          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)
+      })
+    }
+  }
+
+  analyticsModules.Ga4PrintIntentTracker = Ga4PrintIntentTracker
+})(window.GOVUK.analyticsGa4.analyticsModules)

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

@@ -118,7 +118,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
         // following will be undefined if tracking percentages
         data.text = node.eventData.text
         data.section = node.eventData.text
-        data.index = node.eventData.index
+        data.index_section = node.eventData.index_section
+        data.index_section_count = node.eventData.index_section_count
         // following will be undefined if tracking headings
         data.percent_scrolled = node.eventData.percent_scrolled
 
@@ -165,10 +166,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
           eventData: {
             type: type,
             text: heading.textContent.replace(/\s+/g, ' ').trim(),
-            index: {
-              index_section: i + 1,
-              index_section_count: totalHeadings
-            }
+            index_section: i + 1,
+            index_section_count: totalHeadings
           }
         })
       }

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

@@ -3,6 +3,7 @@
 //= require ./analytics-ga4/ga4-schemas
 //= require ./analytics-ga4/pii-remover
 //= require ./analytics-ga4/ga4-page-views
+//= require ./analytics-ga4/ga4-print-intent-tracker
 //= require ./analytics-ga4/ga4-specialist-link-tracker
 //= require ./analytics-ga4/ga4-link-tracker
 //= require ./analytics-ga4/ga4-event-tracker

data/app/assets/javascripts/govuk_publishing_components/components/accordion.js

@@ -62,7 +62,7 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
     var isGa4Enabled = dataModule ? dataModule.indexOf('ga4-event-tracker') !== -1 : false
     if (isGa4Enabled) {
       var indexTotal = this.$module.querySelectorAll('.govuk-accordion__section').length
-      var showAllAttributesGa4 = { event_name: 'select_content', type: 'accordion', index: { index_section: 0, index_section_count: indexTotal } }
+      var showAllAttributesGa4 = { event_name: 'select_content', type: 'accordion', index_section: 0, index_section_count: indexTotal }
       showAll = this.$module.querySelector(this.showAllControls)
       showAll.setAttribute('data-ga4-event', JSON.stringify(showAllAttributesGa4))
     }

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

@@ -84,7 +84,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
     // if GA4 is enabled, set attributes on 'show all sections' for tracking using ga4-event-tracker
     if (this.$module.isGa4Enabled) {
-      var showAllAttributesGa4 = { event_name: 'select_content', type: 'step by step', index: { index_section: 0, index_section_count: this.$module.totalSteps } }
+      var showAllAttributesGa4 = { event_name: 'select_content', type: 'step by step', index_section: 0, index_section_count: this.$module.totalSteps }
       this.$module.showOrHideAllButton.setAttribute('data-ga4-event', JSON.stringify(showAllAttributesGa4))
     }
   }
@@ -196,10 +196,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
           event_name: 'select_content',
           type: 'step by step',
           text: titleText.trim(),
-          index: {
-            index_section: i + 1,
-            index_section_count: this.$module.totalSteps
-          },
+          index_section: i + 1,
+          index_section_count: this.$module.totalSteps,
           index_total: thisel.querySelectorAll('a').length
         }
 

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

@@ -366,11 +366,9 @@
     if (!entry.hadRecentInput) {
       var firstEntry = sessionEntries[0];
       var latestEntry = sessionEntries[sessionEntries.length - 1];
-      if (sessionEntries.length &&
-        (entry.startTime - latestEntry.startTime >= 1000 ||
-          entry.startTime - firstEntry.startTime >= 5000)) {
-          sessionValue = entry.value;
-          sessionEntries = [entry];
+      if (sessionEntries.length && (entry.startTime - latestEntry.startTime >= 1000 || entry.startTime - firstEntry.startTime >= 5000)) {
+        sessionValue = entry.value;
+        sessionEntries = [entry];
       }
       else {
         sessionValue += entry.value;
@@ -445,7 +443,8 @@
 
   var ALL_ENTRIES = [];
   function observe(type, callback, options) {
-    if (typeof PerformanceObserver === "function" && PerformanceObserver.supportedEntryTypes.includes(type)) {
+    if (typeof PerformanceObserver === "function" &&
+    PerformanceObserver.supportedEntryTypes.includes(type)) {
       var po = new PerformanceObserver(function (list) {
         list.getEntries().forEach(function (entry) { return callback(entry); });
       });
@@ -547,7 +546,7 @@
     // -------------------------------------------------------------------------
     /// End
     // -------------------------------------------------------------------------
-    var SCRIPT_VERSION = "311";
+    var SCRIPT_VERSION = "312";
     var logger = new Logger();
     var globalConfig = fromObject(LUX);
     logger.logEvent(LogEvent.EvaluationStart, [SCRIPT_VERSION]);
@@ -695,7 +694,7 @@
     // Record the FIRST input delay.
     function recordDelay(delay) {
       if (!gFirstInputDelay) {
-        gFirstInputDelay = delay;
+        gFirstInputDelay = floor(delay);
         // remove event listeners
         gaEventTypes.forEach(function (eventType) {
           removeEventListener(eventType, onInput, ghListenerOptions);
@@ -1265,10 +1264,7 @@
       var num = 0;
       for (var i = 0, len = aElems.length; i < len; i++) {
         var e = aElems[i];
-        if (e.src &&
-          !e.async &&
-          !e.defer &&
-          0 !== (e.compareDocumentPosition(lastViewportElem) & 4)) {
+        if (e.src && !e.async && !e.defer && 0 !== (e.compareDocumentPosition(lastViewportElem) & 4)) {
           // If the script has a SRC and async is false and it occurs BEFORE the last viewport element,
           // then increment the counter.
           num++;
@@ -1498,8 +1494,6 @@
       }
       return getHighPercentileINP();
     }
-    // function simplified for our use, original would get the customerid from the script src URL
-    // but we set it inside the code in this file, so this function just returns that
     function getCustomerId() {
       return LUX.customerid || "";
     }
@@ -1609,12 +1603,7 @@
       var vw = document.documentElement.clientWidth;
       // Return true if the top-left corner is in the viewport and it has width & height.
       var lt = findPos(e);
-      return (lt[0] >= 0 &&
-        lt[1] >= 0 &&
-        lt[0] < vw &&
-        lt[1] < vh &&
-        e.offsetWidth > 0 &&
-        e.offsetHeight > 0);
+      return (lt[0] >= 0 && lt[1] >= 0 && lt[0] < vw && lt[1] < vh && e.offsetWidth > 0 && e.offsetHeight > 0);
     }
     // Return an array containing the top & left coordinates of the element.
     // from http://www.quirksmode.org/js/findpos.html
@@ -1838,7 +1827,7 @@
         !gSyncId ||
         !_sample() || // OUTSIDE the sampled range
         !gbLuxSent // LUX has NOT been sent yet, so wait to include it there
-        ) {
+      ) {
         return;
       }
       var sCustomerData = valuesToString(getUpdatedCustomData());
@@ -2083,6 +2072,14 @@
     // Set "LUX.auto=false" to disable send results automatically and
     // instead you must call LUX.send() explicitly.
     if (globalConfig.auto) {
+      var sendBeaconWhenVisible_1 = function () {
+        if (globalConfig.trackHiddenPages) {
+          _sendLux();
+        }
+        else {
+          onVisible(_sendLux);
+        }
+      };
       var sendBeaconAfterMinimumMeasureTime_1 = function () {
         var elapsedTime = _now();
         var timeRemaining = globalConfig.minMeasureTime - elapsedTime;
@@ -2093,12 +2090,12 @@
           ]);
           if (document.readyState === "complete") {
             // If onload has already passed, send the beacon now.
-            _sendLux();
+            sendBeaconWhenVisible_1();
           }
           else {
             // Ow, send the beacon slightly after window.onload.
             addListener("load", function () {
-              setTimeout(_sendLux, 200);
+              setTimeout(sendBeaconWhenVisible_1, 200);
             });
           }
         }
@@ -2107,14 +2104,7 @@
           setTimeout(sendBeaconAfterMinimumMeasureTime_1, timeRemaining);
         }
       };
-      if (globalConfig.trackHiddenPages) {
-        // The trackHiddenPages config forces the beacon to be sent even when the page is not visible.
-        sendBeaconAfterMinimumMeasureTime_1();
-      }
-      else {
-        // Otherwise we only send the beacon when the page is visible.
-        onVisible(sendBeaconAfterMinimumMeasureTime_1);
-      }
+      sendBeaconAfterMinimumMeasureTime_1();
     }
     // When newBeaconOnPageShow = true, we initiate a new page view whenever a page is restored from
     // bfcache. Since we have no "onload" event to hook into after a bfcache restore, we rely on the

data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss

@@ -41,13 +41,6 @@
   }
 }
 
-@include govuk-media-query($from: tablet) {
-  .gem-c-image-card.gem-c-image-card--two-thirds {
-    margin: 0 (- govuk-spacing(3)) govuk-spacing(6) (- govuk-spacing(3));
-    display: block;
-  }
-}
-
 @include govuk-media-query($from: mobile, $until: tablet) {
   .gem-c-image-card {
     margin: 0 (- govuk-spacing(3)) govuk-spacing(6) (- govuk-spacing(3));
@@ -77,7 +70,6 @@
 
   .gem-c-image-card__text-wrapper.gem-c-image-card__text-wrapper--two-thirds {
     @include govuk-grid-column($width: two-thirds, $float: right, $at: tablet);
-    padding-left: 0;
   }
 }
 
@@ -91,6 +83,37 @@
   border-bottom: none;
 }
 
+.gem-c-image-card.gem-c-image-card--two-thirds {
+  // Change default flex-direction from column-reverse
+  // so that the image and text appear in the same row,
+  // with the image to the left
+  flex-direction: row-reverse;
+  -ms-flex-direction: row-reverse;
+  // Wrap flex items onto a new line and ensure
+  // that items are aligned correctly
+  flex-wrap: wrap-reverse;
+  -ms-flex-wrap: wrap-reverse;
+  justify-content: flex-end;
+  align-items: flex-end;
+}
+
+.gem-c-image-card__image-wrapper.gem-c-image-card__image-wrapper--one-third {
+  // The first two values set flex-grow and flex-basis to 0
+  // This ensures that the flex item does not grow or shrink
+  // The the last value, sets flex-basis to 95px
+  // padding-left is set to 15px and the image used is 80px wide
+  flex: 0 0 95px;
+  padding-right: 0;
+}
+
+.gem-c-image-card__text-wrapper.gem-c-image-card__text-wrapper--two-thirds {
+  // The first two values set flex-grow and flex-basis to 1
+  // This allows the flex item contain the image card text to grow or shrink
+  // The last value, sets flex-basis to 70%
+  // If the width of the flex-item shrinks below 70%, it will wrap onto a new line
+  flex: 1 1 70%;
+}
+
 .gem-c-image-card__title {
   margin: 0;
 }

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

@@ -91,6 +91,19 @@ $large-input-size: 50px;
   &:focus {
     @include gem-c-search-input-focus;
   }
+
+  // Note: this is a non-standard CSS feature and will not do anything in Firefox. https://bugzilla.mozilla.org/show_bug.cgi?id=1417753
+  &::-webkit-search-cancel-button {
+    -webkit-appearance: none;
+    background-image: image-url("govuk_publishing_components/icon-close.svg");
+    background-position: center;
+    background-repeat: no-repeat;
+    cursor: pointer;
+    height: 20px;
+    margin-left: 0;
+    margin-right: 0;
+    width: 20px;
+  }
 }
 
 @mixin icon-positioning($container-size) {

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

@@ -46,14 +46,12 @@
             event_name: "select_content",
             type: "accordion",
             text: heading_text,
-            index: {
-              index_section: index,
-              index_section_count: items.length,
-            },
+            index_section: index,
+            index_section_count: items.length,
           }.to_json
 
-          # These attributes have been created separately from the item[:data_attributes] 
-          # object in order to keep them from colliding with GA4 event tracking and UA 
+          # These attributes have been created separately from the item[:data_attributes]
+          # object in order to keep them from colliding with GA4 event tracking and UA
           # tracking attributes
           ga4_link_data_attributes = {}
           ga4_link_data_attributes[:module] = "ga4-link-tracker"
@@ -63,10 +61,8 @@
             event_name: "navigation",
             type: "accordion",
             section: heading_text,
-            index: {
-              index_section: index,
-              index_section_count: (items.length),
-            }
+            index_section: index,
+            index_section_count: (items.length),
           }.to_json
         end
 
@@ -94,9 +90,9 @@
           <%= tag.div(item[:summary][:text], id: "#{id}-summary-#{index}", class: summary_classes) if item[:summary].present? %>
         <% end %>
         <%= tag.div(
-          item[:content][:html], 
-          id: "#{id}-content-#{index}", 
-          class: "govuk-accordion__section-content", 
+          item[:content][:html],
+          id: "#{id}-content-#{index}",
+          class: "govuk-accordion__section-content",
           'aria-labelledby': "#{id}-heading-#{index}",
           data: ga4_link_data_attributes
         ) %>

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

@@ -44,9 +44,7 @@
           <% link_text = format_numbers ? cl_helper.wrap_numbers_with_spans(contents_item[:text]) : contents_item[:text]
             if ga4_tracking
               ga4_data[:event_name] = cl_helper.get_ga4_event_name(contents_item[:href]) if contents_item[:href]
-              ga4_data[:index] = {
-                "index_link": index_link,
-              }
+              ga4_data[:index_link] = index_link
             end
           %>
           <%= link_to_if !contents_item[:active], link_text, contents_item[:href],
@@ -69,9 +67,7 @@
                   <%
                     if ga4_tracking
                       ga4_data[:event_name] = cl_helper.get_ga4_event_name(nested_contents_item[:href]) if nested_contents_item[:href]
-                      ga4_data[:index] = {
-                        "index_link": index_link,
-                      }
+                      ga4_data[:index_link] = index_link
                     end
                   %>
                   <%= link_to_if !nested_contents_item[:active], nested_contents_item[:text], nested_contents_item[:href],

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

@@ -34,7 +34,7 @@
 
   ga4_tracking ||= false
   suggestion_data_attributes[:module] = "#{suggestion_data_attributes[:module]} ga4-link-tracker".strip if ga4_tracking
-  suggestion_data_attributes[:ga4_link] = { event_name: "navigation", type: "intervention", section: suggestion_text, index: 1, index_total: 1 }.to_json if ga4_tracking
+  suggestion_data_attributes[:ga4_link] = { event_name: "navigation", type: "intervention", section: suggestion_text, index_link: 1, index_total: 1 }.to_json if ga4_tracking
   data_attributes[:ga4_intervention_banner] = "" if ga4_tracking # Added to the parent element for the GA4 pageview object to use
 
   suggestion_tag_options = {

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

@@ -107,11 +107,9 @@
           data-ga4-link="<%= {
             "event_name": "navigation",
             "section": "Licence",
-            "index": {
-              "index_section": layout_footer_helper.ga4_ogl_link_index_section.to_s,
-              "index_link": "1",
-              "index_section_count": layout_footer_helper.ga4_index_section_count.to_s,
-            },
+            "index_section": layout_footer_helper.ga4_ogl_link_index_section.to_s,
+            "index_link": "1",
+            "index_section_count": layout_footer_helper.ga4_index_section_count.to_s,
             "text": "Open Government Licence v3.0",
             "index_total": "1",
             "type": "footer",
@@ -132,11 +130,9 @@
         data-ga4-link="<%= {
           "event_name": "navigation",
           "section": "Copyright",
-          "index": {
-            "index_section": layout_footer_helper.ga4_copyright_link_index_section.to_s,
-            "index_link": "1",
-            "index_section_count": layout_footer_helper.ga4_index_section_count.to_s,
-          },
+          "index_section": layout_footer_helper.ga4_copyright_link_index_section.to_s,
+          "index_link": "1",
+          "index_section_count": layout_footer_helper.ga4_index_section_count.to_s,
           "text": "© Crown copyright",
           "index_total": "1",
           "type": "footer",

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

@@ -96,11 +96,9 @@
               "external": "false",
               "text": "GOV.UK",
               "section": "Logo",
-              "index": {
-                "index_link": 1,
-                "index_section": 0,
-                "index_section_count": 2,
-              },
+              "index_link": 1,
+              "index_section": 0,
+              "index_section_count": 2,
               "index_total": 1
             }.to_json
           },
@@ -117,7 +115,7 @@
               },
               class: logotype_classes,
               height: "30",
-              width: "36",    
+              width: "36",
               focusable: "false",
               viewBox: "0 0 132 97",
               xmlns: "http://www.w3.org/2000/svg",
@@ -198,10 +196,8 @@
                   event_name: "select_content",
                   type: "header menu bar",
                   text: link[:label],
-                  index: {
-                    index_section: 1,
-                    index_section_count: 2,
-                  },
+                  index_section: 1,
+                  index_section_count: 2,
                   section: link[:label]
                 }
               },
@@ -232,10 +228,8 @@
                   "event_name": "select_content",
                   "type": "header menu bar",
                   "text": "Search",
-                  "index": {
-                    "index_section": 2,
-                    "index_section_count": 2,
-                  },
+                  "index_section": 2,
+                  "index_section_count": 2,
                   "section": "Search"
                   }.to_json
                 }"
@@ -320,11 +314,9 @@
                             ga4_link: {
                               "event_name": "navigation",
                               "type": "header menu bar",
-                              "index": {
-                                "index_section": column_index + 1,
-                                "index_link": index + 1,
-                                "index_section_count": 4,
-                              },
+                              "index_section": column_index + 1,
+                              "index_link": index + 1,
+                              "index_section_count": 4,
                               "index_total": index_total,
                               "section": column[:label],
                             }
@@ -395,11 +387,9 @@
                         ga4_link: {
                           "event_name": "navigation",
                           "type": "header menu bar",
-                          "index": {
-                            "index_section": 4,
-                            "index_link": index + 1,
-                            "index_section_count": 4,
-                          },
+                          "index_section": 4,
+                          "index_link": index + 1,
+                          "index_section_count": 4,
                           "index_total": index_total,
                           "section": popular_links_heading,
                         }

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

@@ -54,9 +54,7 @@
               ga4_link_data = {
                 'event_name': 'navigation',
                 'type': 'share page',
-                'index': {
-                  'index_link': index + 1,
-                },
+                'index_link': index + 1,
                 'index_total': links.length,
                 'text': link[:icon],
               }
@@ -65,9 +63,7 @@
               ga4_link_data = {
                 'event_name': 'navigation',
                 'type': 'follow us',
-                'index': {
-                  'index_link': index + 1,
-                },
+                'index_link': index + 1,
                 'index_total': links.length
               }
             end

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

@@ -84,10 +84,8 @@
                 "ga4-link": {
                   "event_name": "navigation",
                   "type": "step by step",
-                  "index": {
-                    "index_section": step_index + 1,
-                    "index_section_count": steps.length
-                  },
+                  "index_section": step_index + 1,
+                  "index_section_count": steps.length,
                   "section": step[:title]
                 }.to_json
               }

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

@@ -26,6 +26,15 @@
     tracking_options ||= ({ dimension96: tracking_id }).to_json
   end
 
+  if ga4_tracking
+    ga4_data = {
+      event_name: "navigation",
+      type: "super breadcrumb",
+      index_link: "1",
+      index_total: "1",
+    }.to_json
+  end
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   classes = %w[gem-c-step-nav-header]
   classes << shared_helper.get_margin_bottom if local_assigns[:margin_bottom]
@@ -44,7 +53,7 @@
         data-track-action="<%= tracking_action %>"
         data-track-label="<%= tracking_label %>"
         <% if ga4_tracking %>
-          data-ga4-link='{"event_name":"navigation", "type":"super breadcrumb", "index":{"index_link": "1"}, "index_total":"1"}'
+          data-ga4-link='<%= ga4_data %>'
         <% end %>
         <% if tracking_dimension_enabled %>
           data-track-dimension="<%= tracking_dimension %>"

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

@@ -23,13 +23,11 @@
             data-track-dimension="<%= links[0][:text] %>"
             data-track-dimension-index="29"
             data-track-options='{"dimension96" : "<%= links[0][:tracking_id] %>" }'
-            <% if ga4_tracking 
+            <% if ga4_tracking
               ga4_attributes = {
                 event_name: "navigation",
                 type: "part of",
-                index:{
-                  "index_link": "1"
-                },
+                "index_link": "1",
                 index_total: "1",
                 section: pretitle,
               }.to_json
@@ -53,13 +51,11 @@
                 data-track-dimension="<%= link[:text] %>"
                 data-track-dimension-index="29"
                 data-track-options='{"dimension96" : "<%= link[:tracking_id] %>" }'
-                <% if ga4_tracking 
+                <% if ga4_tracking
                   ga4_attributes = {
                     event_name: "navigation",
                     type: "part of",
-                    index:{
-                      "index_link": (index + 1).to_s
-                    },
+                    index_link: (index + 1).to_s,
                     index_total: (links.length).to_s,
                     section: pretitle,
                   }.to_json

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

@@ -34,10 +34,8 @@
               event_name: "select_content",
               type: "tabs",
               text: tab[:label],
-              index: {
-                index_section: index + 1,
-                index_section_count: tabs.length,
-              },
+              index_section: index + 1,
+              index_section_count: tabs.length,
             }
             ga4_attributes[:event_name] = "navigation" if as_links
             tab[:tab_data_attributes][:ga4_link] = ga4_attributes if as_links

data/app/views/govuk_publishing_components/components/contextual_sidebar/_ukraine_cta.html.erb

@@ -1,4 +1,4 @@
-<% 
+<%
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   title = t("components.related_navigation.ukraine.title")
   lang = shared_helper.t_locale("components.related_navigation.ukraine.title")
@@ -15,11 +15,9 @@
           ga4_attributes = {
             event_name: "navigation",
             type: "related content",
-            index: {
-              index_section: "#{ga4_tracking_counts.index_section_count}",
-              index_link: "#{index + 1}",
-              index_section_count: "#{ga4_tracking_counts.index_section_count}",
-            },
+            index_section: "#{ga4_tracking_counts.index_section_count}",
+            index_link: "#{index + 1}",
+            index_section_count: "#{ga4_tracking_counts.index_section_count}",
             index_total: "#{index_total}",
             section: title,
           } if ga4_tracking

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

@@ -205,8 +205,8 @@ examples:
       <div class="govuk-!-width-full">
         <%= component %>
       </div>
-  two_thirds_column:
-    description: This variant is used for the featured section on the homepage, the aspect ratio used is 1:1
+  two_thirds:
+    description: This variant is used for the featured section on the homepage. The aspect ratio used is 1:1 and the width of the image is constrained to 80px wide.
     data:
       two_thirds: true
       href: "/still-not-a-page"

data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb

@@ -24,7 +24,7 @@
   <% end %>
 
   <ul class="gem-c-related-navigation__link-list">
-    <% 
+    <%
       constructed_link_array = []
       section_link_limit = related_nav_helper.calculate_section_link_limit(links)
       index_total = links.length
@@ -35,11 +35,9 @@
         ga4_attributes = {
           event_name: "navigation",
           type: ga4_type,
-          index: {
-            index_section: "#{section_index}",
-            index_link: "#{index}",
-            index_section_count: "#{section_count}",
-          },
+          index_section: "#{section_index}",
+          index_link: "#{index}",
+          index_section_count: "#{section_count}",
           index_total: "#{index_total}",
           section: ga4_heading_text,
         } if ga4_tracking
@@ -70,7 +68,7 @@
 
     <% if links.length > section_link_limit %>
       <%
-        classes = "gem-c-related-navigation__link toggle-wrap"      
+        classes = "gem-c-related-navigation__link toggle-wrap"
         data_attributes_li = { module: "ga4-event-tracker" } if ga4_tracking
         data_attributes_link = {
           controls: "toggle_#{section_title}",
@@ -83,7 +81,7 @@
         <%= link_to("#", class: "gem-c-related-navigation__toggle", data: data_attributes_link) do %>
           <%= t("common.toggle_more",
             show: t('common.show'),
-            number: related_nav_helper.remaining_link_count(links)) %>        
+            number: related_nav_helper.remaining_link_count(links)) %>
         <% end %>
       <% end %>
 

data/lib/govuk_publishing_components/presenters/breadcrumbs_helper.rb

@@ -61,9 +61,7 @@ module GovukPublishingComponents
           ga4_link: {
             event_name: "navigation",
             type: "breadcrumb",
-            index: {
-              index_link: index.to_s,
-            },
+            index_link: index.to_s,
             index_total: breadcrumbs_length.to_s,
           },
         }

data/lib/govuk_publishing_components/presenters/layout_footer_helper.rb

@@ -23,11 +23,9 @@ module GovukPublishingComponents
         {
           "event_name": "navigation",
           "type": "footer",
-          "index": {
-            "index_link": (index_link + 1).to_s,
-            "index_section": (index_section + 1).to_s,
-            "index_section_count": @ga4_index_section_count.to_s,
-          },
+          "index_link": (index_link + 1).to_s,
+          "index_section": (index_section + 1).to_s,
+          "index_section_count": @ga4_index_section_count.to_s,
           "index_total": index_total.to_s,
           "section": section,
         }

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "35.19.0".freeze
+  VERSION = "35.20.0".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 35.19.0
+  version: 35.20.0
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-10-18 00:00:00.000000000 Z
+date: 2023-10-23 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govuk_app_config
@@ -418,6 +418,7 @@ files:
 - app/assets/images/govuk_publishing_components/govuk-schema-placeholder-16x9.png
 - app/assets/images/govuk_publishing_components/govuk-schema-placeholder-1x1.png
 - app/assets/images/govuk_publishing_components/govuk-schema-placeholder-4x3.png
+- app/assets/images/govuk_publishing_components/icon-close.svg
 - app/assets/images/govuk_publishing_components/icon-file-download.svg
 - app/assets/images/govuk_publishing_components/icon-important.svg
 - app/assets/images/govuk_publishing_components/icon-print-2x.png
@@ -450,6 +451,7 @@ files:
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-form-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js
+- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-print-intent-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-schemas.js
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-scroll-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-smart-answer-results-tracker.js