govuk_publishing_components 68.1.0 → 68.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4043c16d81a4d408586ba023e10b20c95351be88e3149f3068f768265eee4431
-  data.tar.gz: df3b994d054d385990f6cdb7fe23676d35f15ac398cb5c7c9ef7d840f15930ee
+  metadata.gz: 03455dfe8892b30b454209d8b8a490fd52abfbe5605d8f2823dbe9bd03d52979
+  data.tar.gz: c037b1fbba983e32b96b8abdc6e73cce0c7a2c448862982973f5d757ed324480
 SHA512:
-  metadata.gz: 908961ea90462179429522aefc6224a35786c5dd630de3a289e9ca952a216d5bd9556b65871ab4f81af074a037af660dc2760eb93558ca2a6a538ac8a1a633a6
-  data.tar.gz: 3c22900fb4473fcbc267f3ad9a8fe8aab5fe645c9ddb61b835eab2652f6d2492341a992371461f3066599c6a748f0f9c1a3914b19c3c8b281b7218823ddd46c6
+  metadata.gz: f3e2136388c8bbc98caf66c605efc335139e485f59e15a4e1bffcc72b5f2ea94d67dcbcefb9dbde13ba8dc779dd465301ed25c22c0f2a88f0022f3ab2704d634
+  data.tar.gz: 275c48bef08012285e2091aef239b78effce8f893c5ed191fec261f05f708c5ef77241cc17a0763d2407a30512a4d4d040105b3aef9178dccc3fc45520e1d8ea

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

@@ -11,6 +11,7 @@
     this.useSelectCount = this.module.hasAttribute('data-ga4-form-use-select-count')
     this.redacted = false
     this.useFallbackValue = this.module.hasAttribute('data-ga4-form-no-answer-undefined') ? undefined : 'No answer given'
+    this.piiRemover = new window.GOVUK.analyticsGa4.PIIRemover()
   }
 
   Ga4FormTracker.prototype.init = function () {
@@ -117,6 +118,8 @@
 
       var isDateField = elem.closest('.govuk-date-input')
 
+      var forceReportValue = elem.hasAttribute('data-ga4-force-report-value-in-form-tracker')
+
       if (conditionalCheckbox && !conditionalCheckboxChecked) {
         // don't include conditional field if condition not checked
         inputs.splice(i, 1)
@@ -146,25 +149,10 @@
           // if placeholder value in select, do not include as not filled in
           inputs.splice(i, 1)
         } else {
-          input.answer = this.useSelectCount && selectedOptions.length > 1 ? selectedOptions.length : selectedOptions.join(',')
+          input.answer = this.getInputAnswerFromSelect(selectedOptions, forceReportValue)
         }
       } else if (isTextField && elem.value) {
-        if (this.includeTextInputValues || elem.hasAttribute('data-ga4-form-include-input')) {
-          if (this.useTextCount && !isDateField) {
-            input.answer = elem.value.length
-          } else {
-            var PIIRemover = new window.GOVUK.analyticsGa4.PIIRemover()
-            input.answer = PIIRemover.stripPIIWithOverride(elem.value, true, true)
-          }
-        } else {
-          // if recording JSON and text input not allowed
-          // set the specific answer to '[REDACTED]'
-          if (this.recordJson) {
-            input.answer = '[REDACTED]'
-          } else {
-            this.redacted = true
-          }
-        }
+        input.answer = this.getInputAnswerFromText(elem, isDateField, forceReportValue)
       } else if (inputType === 'file') {
         input.answer = elem.files.length + ' files chosen'
       } else {
@@ -201,6 +189,45 @@
     return inputs
   }
 
+  Ga4FormTracker.prototype.getInputAnswerFromSelect = function (selectedOptions, forceReportValue) {
+    var joinedSelections = selectedOptions.join(',')
+
+    if (forceReportValue) {
+      return joinedSelections
+    }
+
+    if (this.useSelectCount && selectedOptions.length > 1) {
+      return selectedOptions.length
+    }
+
+    return joinedSelections
+  }
+
+  Ga4FormTracker.prototype.getInputAnswerFromText = function (inputElement, isDateField, forceReportValue) {
+    var willRecordInputValue = this.includeTextInputValues || inputElement.hasAttribute('data-ga4-form-include-input')
+    var willReplaceInputValueWithLength = this.useTextCount && !isDateField
+
+    if (forceReportValue) {
+      willReplaceInputValueWithLength = false
+    }
+
+    if (willRecordInputValue) {
+      if (willReplaceInputValueWithLength) {
+        return inputElement.value.length
+      }
+
+      return this.piiRemover.stripPIIWithOverride(inputElement.value, true, true)
+    }
+
+    // if recording JSON when recording text input not allowed
+    // set the specific answer to '[REDACTED]'
+    if (this.recordJson) {
+      return '[REDACTED]'
+    } else {
+      this.redacted = true
+    }
+  }
+
   Ga4FormTracker.prototype.combineGivenAnswers = function (data) {
     var answers = this.recordJson ? {} : []
 

data/app/assets/javascripts/govuk_publishing_components/components/option-select.js

@@ -1,15 +1,11 @@
 (function (Modules) {
-  /* This JavaScript provides two functional enhancements to option-select components:
-    1) A count that shows how many results have been checked in the option-container
-    2) Open/closing of the list of checkboxes
-  */
   function OptionSelect ($module) {
     this.$optionSelect = $module
     this.$options = this.$optionSelect.querySelectorAll("input[type='checkbox']")
     this.$optionsContainer = this.$optionSelect.querySelector('.js-options-container')
     this.$optionList = this.$optionsContainer.querySelector('.js-auto-height-inner')
     this.$allCheckboxes = this.$optionsContainer.querySelectorAll('.govuk-checkboxes__item')
-    this.hasFilter = this.$optionSelect.getAttribute('data-filter-element') || ''
+    this.filterAttributes = this.$optionSelect.getAttribute('data-filter-attributes')
 
     this.checkedCheckboxes = []
 
@@ -19,15 +15,9 @@
   }
 
   OptionSelect.prototype.init = function () {
-    if (this.hasFilter.length) {
-      var filterEl = document.createElement('div')
-      filterEl.innerHTML = this.hasFilter
-
-      var optionSelectFilter = document.createElement('div')
-      optionSelectFilter.classList.add('gem-c-option-select__filter')
-      optionSelectFilter.innerHTML = filterEl.childNodes[0].nodeValue
-
-      this.$optionsContainer.parentNode.insertBefore(optionSelectFilter, this.$optionsContainer)
+    if (this.filterAttributes) {
+      this.filterAttributes = JSON.parse(this.filterAttributes)
+      this.$optionsContainer.parentNode.insertBefore(this.createFilter(), this.$optionsContainer)
 
       this.$filter = this.$optionSelect.querySelector('input[name="option-select-filter"]')
       this.$filterCount = document.getElementById(this.$filter.getAttribute('aria-describedby'))
@@ -73,6 +63,26 @@
     }
   }
 
+  OptionSelect.prototype.createFilter = function () {
+    const filter = document.createElement('div')
+    filter.classList.add('gem-c-option-select__filter')
+
+    const label = document.createElement('label')
+    label.classList.add('govuk-label', 'govuk-visually-hidden')
+    label.setAttribute('for', this.filterAttributes.id)
+    label.textContent = this.filterAttributes.title
+
+    const input = document.createElement('input')
+    input.classList.add('gem-c-option-select__filter-input', 'govuk-input')
+    input.name = 'option-select-filter'
+    input.id = this.filterAttributes.id
+    input.setAttribute('aria-describedby', this.filterAttributes.describedby)
+    input.setAttribute('aria-controls', this.filterAttributes.controls)
+
+    filter.append(label, input)
+    return filter
+  }
+
   OptionSelect.prototype.toggleVisibility = function (isTabletOrLarger) {
     if (isTabletOrLarger) {
       if (this.isClosedOnLoad === 'true') {
@@ -142,8 +152,8 @@
 
     var lenChecked = obj.$optionsContainer.querySelectorAll('.govuk-checkboxes__input:checked').length
     var len = showCheckboxes.length + lenChecked
-    var html = len + (len === 1 ? obj.filterTextSingle : obj.filterTextMultiple) + ', ' + lenChecked + obj.filterTextSelected
-    obj.$filterCount.innerHTML = html
+    var hiddenText = len + (len === 1 ? obj.filterTextSingle : obj.filterTextMultiple) + ', ' + lenChecked + obj.filterTextSelected
+    obj.$filterCount.textContent = hiddenText
   }
 
   OptionSelect.prototype.replaceHeadingSpanWithButton = function replaceHeadingSpanWithButton () {

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

@@ -168,19 +168,20 @@
       var thisel = this.$module.steps[i]
       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 titleText = title.textContent
 
       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 + '"' + '>' +
-              '<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>'
+        `<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}">
+              <span class="gem-c-step-nav____title-text-focus">
+                <span class="gem-c-step-nav__title-text js-step-title-text"></span>
+                <span class="govuk-visually-hidden gem-c-step-nav__section-heading-divider">, </span>
+              </span>
+          </button>
+        </span>`
+
+      thisel.querySelector('.gem-c-step-nav__title-text').textContent = titleText
 
       if (this.$module.isGa4Enabled) {
         var ga4JSON = {

data/app/assets/stylesheets/component_guide/application.scss

@@ -68,7 +68,7 @@ $gem-guide-border-width: 1px;
 }
 
 .component-guide-preview {
-  padding: govuk-spacing(8) govuk-spacing(6) govuk-spacing(6) govuk-spacing(6);
+  padding: govuk-spacing(8) govuk-spacing(6) govuk-spacing(6);
   border: $gem-guide-border-width solid govuk-functional-colour(border);
   position: relative;
   margin-bottom: govuk-spacing(8);
@@ -475,7 +475,7 @@ $code-delete-bg: #fadddd;
 
 .gem-full-width__container {
   container-type: inline-size;
-  container-name: gem_page;
+  container-name: gem-page;
 }
 
 .full-width__table-wrapper {
@@ -500,7 +500,7 @@ $code-delete-bg: #fadddd;
   }
 }
 
-@container gem_page (width > 1040px) {
+@container gem-page (width > 1040px) {
   $w: 960px;
 
   .gem-full-width__element {
@@ -529,7 +529,7 @@ $code-delete-bg: #fadddd;
 .govuk-tabs {
   $w: 920px;
 
-  @container gem_page (width > 1040px) {
+  @container gem-page (width > 1040px) {
     .full-width__table-wrapper {
       margin-left: calc(((-100cqw + $w) / 2) - 1px);
       margin-right: calc(((-100cqw + $w) / 2) - 1px);

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

@@ -44,8 +44,8 @@ $thumbnail-border-width: 5px;
 
   .gem-c-details {
     margin-top: govuk-spacing(3);
-    word-break: break-word;
-    word-wrap: break-word;
+    word-break: break-word; // stylelint-disable-line declaration-property-value-keyword-no-deprecated
+    overflow-wrap: break-word;
   }
 }
 
@@ -68,12 +68,12 @@ $thumbnail-border-width: 5px;
 .govspeak,
 .gem-c-govspeak {
   .gem-c-attachment__title {
-    margin: 0 0 govuk-spacing(3) 0;
+    margin: 0 0 govuk-spacing(3);
     @include govuk-font($size: 27, $weight: regular);
   }
 
   .gem-c-attachment__metadata {
-    margin: 0 0 govuk-spacing(3) 0;
+    margin: 0 0 govuk-spacing(3);
   }
 }
 
@@ -101,7 +101,7 @@ $thumbnail-border-width: 5px;
   }
 
   .gem-c-attachment__link.govuk-link {
-    word-break: break-word;
+    word-break: break-word;  // stylelint-disable-line declaration-property-value-keyword-no-deprecated
 
     &::after {
       font-size: 12pt;

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

@@ -7,6 +7,7 @@
   padding: 0;
   margin: 0;
   display: grid;
+  // stylelint-disable-next-line property-no-deprecated
   grid-column-gap: govuk-spacing(6); // Use deprecated grid-column-gap for Grade C browser support
   column-gap: govuk-spacing(6);
 
@@ -48,15 +49,15 @@
 
 .gem-c-cards__list--two-column-desktop {
   @include govuk-media-query($from: "tablet") {
-    grid-auto-rows: fractions(1); // Set all rows to same fractional height of the complete grid
-    grid-template-columns: fractions(2); // Note that browsers that don't support CSS grid display the component as one column on all breakpoints
+    grid-auto-rows: 1fr;
+    grid-template-columns: repeat(2, 1fr);
   }
 }
 
 .gem-c-cards__list--three-column-desktop {
   @include govuk-media-query($from: "desktop") {
-    grid-auto-rows: fractions(1); // Set all rows to same fractional height of the complete grid
-    grid-template-columns: fractions(3); // Note that browsers that don't support CSS grid display the component as one column on all breakpoints
+    grid-auto-rows: 1fr;
+    grid-template-columns: repeat(3, 1fr);
   }
 }
 
@@ -145,7 +146,7 @@
 
 .gem-c-cards__list-item {
   border-top: 1px solid govuk-functional-colour(border);
-  padding: govuk-spacing(1) 0 govuk-spacing(4) 0;
+  padding: govuk-spacing(1) 0 govuk-spacing(4);
 }
 
 .gem-c-cards__list-item-wrapper {
@@ -158,10 +159,11 @@
 
 .gem-c-cards__sub-heading {
   margin: 0 govuk-spacing(6) govuk-spacing(2) 0;
+  text-wrap: pretty;
 
   // Ensure card content width is constrained to two thirds on desktop
   @include govuk-media-query($from: "desktop") {
-    max-width: 66.6667%;
+    max-width: 640px;
   }
 }
 
@@ -208,10 +210,11 @@
 
 .gem-c-cards__description {
   margin: 0 govuk-spacing(6) 0 0;
+  text-wrap: pretty;
 
   // Ensure card content width is constrained to two thirds on desktop
   @include govuk-media-query($from: "desktop") {
-    max-width: 66.6667%;
+    max-width: 640px;
   }
 }
 

data/app/assets/stylesheets/govuk_publishing_components/components/_cross-service-header.scss

@@ -305,6 +305,7 @@ $toggle-border-height: 3px;
     &-visible {
       @include toggle-button-focus;
 
+      // stylelint-disable-next-line selector-no-qualifying-type
       &.gem-c-rebranded-cross-service-header__toggle--open {
         @include toggle-button-focus;
       }

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

@@ -82,7 +82,7 @@
   @include govuk-text-colour;
   @include govuk-font(16);
 
-  & { // stylelint-disable-line no-duplicate-selectors
+  & { // stylelint-disable-line no-duplicate-selectors, block-no-redundant-nested-style-rules
     // overriding govuk-text-colour mixin
     color: govuk-functional-colour(secondary-text);
   }
@@ -104,7 +104,7 @@
 }
 
 .gem-c-document-list__highlight-text {
-  margin: 0 0 govuk-spacing(3) 0;
+  margin: 0 0 govuk-spacing(3);
   @include govuk-font(16, bold);
 }
 

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

@@ -175,13 +175,13 @@ $feedback-prompt-border-top-colour: $govuk-blue-tint-50;
 
   // this comes from the backend so we can't put a class on it
   h2 {
-    margin: 0 0 govuk-spacing(3) 0;
+    margin: 0 0 govuk-spacing(3);
     @include govuk-text-colour;
     @include govuk-font($size: 24, $weight: bold);
   }
 
   p {
-    margin: 0 0 govuk-spacing(3) 0;
+    margin: 0 0 govuk-spacing(3);
     @include govuk-text-colour;
     @include govuk-font($size: 19);
   }
@@ -210,13 +210,13 @@ $feedback-prompt-border-top-colour: $govuk-blue-tint-50;
 }
 
 .gem-c-feedback__form-heading {
-  margin: 0 0 govuk-spacing(3) 0;
+  margin: 0 0 govuk-spacing(3);
   @include govuk-text-colour;
   @include govuk-font(24, $weight: bold);
 }
 
 .gem-c-feedback__form-paragraph {
-  margin: 0 0 govuk-spacing(6) 0;
+  margin: 0 0 govuk-spacing(6);
   @include govuk-text-colour;
   @include govuk-font(19);
 }

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

@@ -20,7 +20,7 @@ $gap: govuk-spacing(1);
 }
 
 .gem-c-figure__figcaption-text {
-  margin: govuk-spacing(2) 0 0 0;
+  margin: govuk-spacing(2) 0 0;
   color: govuk-functional-colour(secondary-text);
   @include govuk-font(19);
 }

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

@@ -11,7 +11,6 @@
   @include govuk-text-colour;
 
   @include govuk-media-query($until: tablet) {
-    flex-direction: column-reverse;
     gap: govuk-spacing(3);
   }
 }
@@ -36,7 +35,7 @@
   height: auto;
   width: 100%;
   border: 0;
-  border-top: 1px solid govuk-functional-colour(border);
+  border-top: 1px solid govuk-functional-colour("border");
 }
 
 .gem-c-image-card__title {
@@ -73,7 +72,7 @@
 .gem-c-image-card__context,
 .gem-c-image-card__metadata {
   font-size: govuk-px-to-rem(16px);
-  margin: 0 0 calc(govuk-spacing(3) / 2);
+  margin: 0 0 govuk-spacing(2);
   color: govuk-functional-colour("secondary-text");
   @include govuk-font($size: false);
 
@@ -83,15 +82,15 @@
 }
 
 .gem-c-image-card__description {
-  padding-top: calc(govuk-spacing(3) / 2);
-  word-wrap: break-word;
+  padding-top: govuk-spacing(2);
+  overflow-wrap: break-word;
   @include govuk-font($size: 19);
 }
 
 .gem-c-image-card__list {
   position: relative;
   z-index: 2;
-  padding: calc(govuk-spacing(3) / 2) 0 0 0;
+  padding: govuk-spacing(2) 0 0;
   margin: 0;
   list-style: none;
   @include govuk-font($size: 19);

data/app/assets/stylesheets/govuk_publishing_components/components/_inverse-header.scss

@@ -2,7 +2,7 @@
   width: 100%;
   background-color: $govuk-blue-tint-80;
   margin-bottom: govuk-spacing(6);
-  padding: govuk-spacing(3) govuk-spacing(6) govuk-spacing(6) govuk-spacing(6);
+  padding: govuk-spacing(3) govuk-spacing(6) govuk-spacing(6);
   box-sizing: border-box;
 
   @include govuk-media-query($until: desktop) {

data/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-public.scss

@@ -10,7 +10,7 @@
 }
 
 .gem-c-layout-for-public-account-menu {
-  margin: 0 0 govuk-spacing(6) 0;
+  margin: 0 0 govuk-spacing(6);
   padding: 0;
 
   @include govuk-media-query($from: desktop) {

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

@@ -81,6 +81,7 @@ $search-icon-height: 20px;
 // Undoes the :focus styles *only* for browsers that support :focus-visible.
 // See https://www.tpgi.com/focus-visible-and-backwards-compatibility/
 @mixin focus-not-focus-visible {
+  // stylelint-disable-next-line block-no-redundant-nested-style-rules
   & {
     @content;
   }
@@ -571,12 +572,12 @@ $search-icon-height: 20px;
 // JS available - styles the links in the dropdown menu
 .gem-c-layout-super-navigation-header__dropdown-list-item {
   box-sizing: border-box;
-  padding: 0 0 govuk-spacing(3) 0;
+  padding: 0 0 govuk-spacing(3);
   position: relative;
-  margin: 0 0 govuk-spacing(2) 0;
+  margin: 0 0 govuk-spacing(2);
   @include govuk-media-query($from: "desktop") {
-    padding: 0 0 govuk-spacing(3) 0;
-    margin: 0 govuk-spacing(3) govuk-spacing(1) govuk-spacing(3);
+    padding: 0 0 govuk-spacing(3);
+    margin: 0 govuk-spacing(3) govuk-spacing(1);
   }
 }
 
@@ -588,7 +589,7 @@ $search-icon-height: 20px;
 
   @include govuk-media-query($from: "desktop") {
     margin: 0 (0 - govuk-spacing(3)) govuk-spacing(9);
-    padding: govuk-spacing(2) 0 0 0;
+    padding: govuk-spacing(2) 0 0;
   }
 }
 
@@ -642,7 +643,7 @@ $search-icon-height: 20px;
 .gem-c-layout-super-navigation-header__navigation-second-item-description {
   font-size: govuk-px-to-rem(16px);
   font-weight: normal;
-  margin: govuk-spacing(1) 0 0 0;
+  margin: govuk-spacing(1) 0 0;
   @include govuk-typography-common;
 }
 

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

@@ -90,7 +90,7 @@
   display: none;
 }
 
-.gem-c-metadata--history {
+.gem-c-metadata--border-top {
   padding-top: govuk-spacing(2);
   border-top: 1px solid $govuk-border-colour;
 }
@@ -110,22 +110,30 @@
 }
 
 .gem-c-metadata__change-history {
-  margin: govuk-spacing(4) 0 0 0;
+  margin: 0;
   padding: 0;
   list-style: none;
 }
 
+.gem-c-metadata__change-history-item {
+  margin-bottom: govuk-spacing(4);
+
+  &:last-child {
+    margin: 0;
+  }
+
+  .gem-c-metadata__change-note {
+    margin: 0;
+    white-space: pre-line;
+  }
+}
+
 .gem-c-metadata__change-date {
   display: block;
-  margin: govuk-spacing(3) 0;
+  margin: 0 0 govuk-spacing(3);
   @include govuk-font(16, $weight: bold);
 }
 
-.gem-c-metadata__change-note {
-  margin: 0;
-  white-space: pre-line;
-}
-
 // stylelint-disable declaration-no-important
 @include govuk-media-query($media-type: print) {
   .gem-c-metadata {

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

@@ -21,5 +21,5 @@
 }
 
 .gem-c-notice__description {
-  word-wrap: break-word;
+  overflow-wrap: break-word;
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_option-select.scss

@@ -15,8 +15,8 @@
     ::-webkit-scrollbar-thumb {
       border-radius: 4px;
 
-      background-color: rgba(0, 0, 0, .5);
-      -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .87);
+      background-color: rgb(0, 0, 0, .5);
+      -webkit-box-shadow: 0 0 1px rgb(255, 255, 255, .87);
     }
   }
 
@@ -104,7 +104,7 @@
 .gem-c-option-select__filter {
   position: relative;
   background: govuk-colour("white");
-  padding: 13px 13px govuk-spacing(2) 13px;
+  padding: 13px 13px govuk-spacing(2);
 }
 
 .gem-c-option-select__filter-input {

data/app/assets/stylesheets/govuk_publishing_components/components/_organisation-logo.scss

@@ -6,12 +6,6 @@
   margin: 0;
   @include govuk-typography-common;
   @include govuk-font-size(19);
-
-  @include govuk-media-query($until: tablet) {
-    // only override line-height on small screens otherwise use govuk-font-size
-    // line-height
-    line-height: 1.35;
-  }
 }
 
 .gem-c-organisation-logo__container {
@@ -59,7 +53,7 @@
   @include govuk-link-common;
   @include govuk-link-style-text;
 
-  & { // stylelint-disable-line no-duplicate-selectors
+  & { // stylelint-disable-line no-duplicate-selectors, block-no-redundant-nested-style-rules
     // overriding the govuk-link font
     font-family: HelveticaNeue, "Helvetica Neue", Arial, Helvetica, sans-serif;
   }

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

@@ -1,5 +1,5 @@
 @import "govuk/components/radios/radios";
 
 .gem-c-radio__heading-text {
-  margin: 0 0 govuk-spacing(4) 0;
+  margin: 0 0 govuk-spacing(4);
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_search-with-autocomplete.scss

@@ -60,7 +60,7 @@ $large-input-size: 50px;
   // for everyone. This span is added dynamically only on iOS and not given a class, so we need to
   // target it in a roundabout way and make it invisible to non-screenreader users.
   & > span {
-    clip: rect(0 0 0 0);
+    clip: rect(0 0 0 0); // stylelint-disable-line property-no-deprecated
     clip-path: inset(50%);
     height: 1px;
     overflow: hidden;

data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav-header.scss

@@ -19,7 +19,7 @@
 
 @include govuk-media-query($media-type: print) {
   .gem-c-step-nav-header {
-    padding: 0 0 govuk-spacing(4) 0;
+    padding: 0 0 govuk-spacing(4);
     background: none;
     border-color: govuk-functional-colour(print-text);
   }

data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss

@@ -185,7 +185,7 @@ $top-border: solid 1px govuk-functional-colour("border");
   position: relative;
   z-index: 1; // this and relative position stops focus outline underlap with border of accordion
   margin: .5em 0 14px;
-  padding: govuk-spacing(1) 0 govuk-spacing(1);
+  padding: govuk-spacing(1) 0;
   @include step-nav-font(15);
 
   .gem-c-step-nav--large & {

data/app/assets/stylesheets/govuk_publishing_components/components/_sub-navigation-menu.scss

@@ -20,7 +20,7 @@
   padding-left: govuk-spacing(3);
   padding-right: govuk-spacing(3);
   // Invisible border so the width of the collapsed button is the same as the expanded one.
-  border-left: 1px solid rgba(0, 0, 0, 0);
+  border-left: 1px solid rgb(0, 0, 0, 0);
   border-right: 1px solid govuk-colour("black", $variant: "tint-95");
   cursor: pointer;
   position: relative;

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

@@ -17,7 +17,7 @@
 }
 
 .gem-c-summary-banner__title {
-  margin: 0 0 govuk-spacing(6) 0;
+  margin: 0 0 govuk-spacing(6);
   color: govuk-colour("white");
   @include govuk-font(27, $weight: bold);
 }

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_attachment.scss

@@ -14,7 +14,7 @@
 
   .attachment {
     position: relative;
-    margin: 0 0 govuk-spacing(6) 0;
+    margin: 0 0 govuk-spacing(6);
     padding: 0 0 0 ($thumbnail-width + govuk-spacing(6));
     @include govuk-clearfix;
 
@@ -56,12 +56,12 @@
 
     .attachment-details {
       h2 {
-        margin: 0 0 govuk-spacing(2) 0;
+        margin: 0 0 govuk-spacing(2);
         @include govuk-font($size: 27);
       }
 
       p {
-        margin: 0 0 govuk-spacing(2) 0;
+        margin: 0 0 govuk-spacing(2);
       }
 
       .metadata {
@@ -69,8 +69,8 @@
       }
 
       .url {
-        word-break: break-word;
-        word-wrap: break-word;
+        word-break: break-word; // stylelint-disable-line declaration-property-value-keyword-no-deprecated
+        overflow-wrap: break-word;
       }
 
       .changed,
@@ -103,8 +103,8 @@
       }
 
       .accessibility-warning {
-        word-break: break-word;
-        word-wrap: break-word;
+        word-break: break-word; // stylelint-disable-line declaration-property-value-keyword-no-deprecated
+        overflow-wrap: break-word;
 
         h2 {
           margin: 0;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_call-to-action.scss

@@ -9,7 +9,7 @@
 .govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
 .gem-c-govspeak {
   .call-to-action {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     background-color: govuk-colour("black", $variant: "tint-95");
     padding: govuk-spacing(6);
     padding-bottom: govuk-spacing(2);

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_contact.scss

@@ -14,7 +14,7 @@
   .contact {
     border-left: 1px solid govuk-functional-colour("border");
     padding-left: govuk-spacing(3);
-    margin: 0 0 govuk-spacing(6) 0;
+    margin: 0 0 govuk-spacing(6);
   }
 
   .address {
@@ -38,7 +38,7 @@
 
     .email-url-number {
       .email {
-        word-wrap: break-word;
+        overflow-wrap: break-word;
       }
 
       span {

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_example.scss

@@ -10,7 +10,7 @@
   .example {
     border-left: 10px solid govuk-functional-colour("border");
     padding: govuk-spacing(4) 0 0.1234px govuk-spacing(4); // non-zero padding on bottom keeps margin of last element inside parent, simulating padding
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
 
     strong {
       display: block;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_footnotes.scss

@@ -15,7 +15,7 @@
 .gem-c-govspeak {
   .footnotes {
     border-top: 1px solid govuk-functional-colour("border");
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     padding-top: govuk-spacing(4);
     overflow-wrap: break-word;
 

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_form-download.scss

@@ -1,7 +1,7 @@
 .govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
 .gem-c-govspeak {
   .form-download {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
 
     p {
       padding-right: 3em;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_images.scss

@@ -13,7 +13,7 @@
   }
 
   figure {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     display: table;
 
     &:has(img[src*=".svg"]) {
@@ -31,7 +31,7 @@
     }
 
     figcaption p {
-      margin: govuk-spacing(2) 0 0 0;
+      margin: govuk-spacing(2) 0 0;
       color: govuk-functional-colour(secondary-text);
       @include govuk-font(19);
     }

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_information-callout.scss

@@ -11,7 +11,7 @@
   .info-notice {
     border-left: 10px solid govuk-functional-colour("border");
     padding: govuk-spacing(4) 0 0.1234px govuk-spacing(4); // non-zero padding on bottom keeps margin of last element inside parent, simulating padding
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
 
     @include govuk-media-query($media-type: print) {
       margin: govuk-spacing(3) 0;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_legislative-list.scss

@@ -9,7 +9,7 @@
 .gem-c-govspeak {
   .legislative-list {
     list-style: none;
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
 
     ol {
       margin: govuk-spacing(2) 0 govuk-spacing(2) govuk-spacing(6);

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_media-player.scss

@@ -9,7 +9,7 @@
   position: relative;
   height: 0;
   overflow: hidden;
-  margin: 0 0 govuk-spacing(4) 0;
+  margin: 0 0 govuk-spacing(4);
   padding-top: 0;
   padding-left: 0;
   padding-right: 0;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_place.scss

@@ -2,7 +2,7 @@
 .govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
 .gem-c-govspeak {
   .place {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     border-bottom: solid 1px govuk-functional-colour("border");
     padding-bottom: 1.5em;
 

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss

@@ -8,7 +8,7 @@
 .govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
 .gem-c-govspeak {
   .stat-headline {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
 
     p {
       margin: 0;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss

@@ -11,7 +11,7 @@
     border-collapse: collapse;
     border-spacing: 0;
     display: block;
-    margin: 0 0 govuk-spacing(6) 0;
+    margin: 0 0 govuk-spacing(6);
     overflow-x: auto;
     width: 100%;
     @include govuk-font($size: 19);
@@ -28,7 +28,7 @@
       border-bottom: 1px solid govuk-functional-colour("border");
 
       &:last-child {
-        padding: govuk-spacing(2) 0 govuk-spacing(2) 0;
+        padding: govuk-spacing(2) 0;
       }
     }
 

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss

@@ -34,7 +34,7 @@
 
   blockquote {
     padding: 0 0 0 govuk-spacing(6);
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     border: 0;
 
     p {
@@ -80,7 +80,7 @@
     a[href^="/"]:after,a[href^="http://"]:after,a[href^="https://"]:after {
       content: " (" attr(href) ")";
       font-size: 90%;
-      word-wrap: break-word;
+      overflow-wrap: break-word;
     }
   }
 }
@@ -88,6 +88,7 @@
 .gem-c-govspeak--inverse {
   color: govuk-colour("white");
 
+  // stylelint-disable-next-line selector-no-qualifying-type
   a:not(.govuk-button) {
     @include govuk-link-common;
     @include govuk-link-style-inverse;

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss

@@ -16,7 +16,7 @@
     $icon-spacing: 10px;
 
     padding: govuk-spacing(3) 0 0 calc($icon-size + $icon-spacing);
-    margin: 0 0 govuk-spacing(6) 0;
+    margin: 0 0 govuk-spacing(6);
     position: relative;
 
     &::before {

data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_markdown-typography.scss

@@ -5,7 +5,7 @@
   ol,
   ul,
   p {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     @include govuk-font($size: 19);
   }
 
@@ -30,13 +30,13 @@
   }
 
   h2 {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     @include govuk-font($size: 24, $weight: bold);
     @include govuk-text-break-word;
   }
 
   h3 {
-    margin: 0 0 govuk-spacing(4) 0;
+    margin: 0 0 govuk-spacing(4);
     @include govuk-font($size: 19, $weight: bold);
     @include govuk-text-break-word;
   }
@@ -53,6 +53,7 @@
 
   // Links
 
+  // stylelint-disable-next-line selector-no-qualifying-type
   a:not(.govuk-button) {
     @include govuk-link-common;
     @include govuk-link-style-default;

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

@@ -13,12 +13,12 @@
   other ||= nil
   inverse ||= false
   inverse_compress ||= false
+  border_top ||= false
 
   component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
   component_helper.add_class("gem-c-metadata")
   component_helper.add_class("direction-#{direction}") if local_assigns.include?(:direction)
-
-  component_helper.add_class("gem-c-metadata--history") if page_history.any?
+  component_helper.add_class("gem-c-metadata--border-top") if border_top
   component_helper.set_id("full-publication-update-history") if page_history.any?
 
   if inverse
@@ -49,13 +49,13 @@
   <dl class="gem-c-metadata__list">
     <% if from.any? %>
       <dt class="gem-c-metadata__term"><%= t("components.metadata.from") %>:</dt>
-      <dd class="gem-c-metadata__definition" data-module="gem-toggle">
+      <dd class="gem-c-metadata__definition">
         <%= render "govuk_publishing_components/components/metadata/sentence", items: from, toggle_id: "from-#{SecureRandom.hex(4)}" %>
       </dd>
     <% end %>
     <% if part_of.any? %>
       <dt class="gem-c-metadata__term"><%= t("components.metadata.part_of") %>:</dt>
-      <dd class="gem-c-metadata__definition" data-module="gem-toggle">
+      <dd class="gem-c-metadata__definition">
         <%= render "govuk_publishing_components/components/metadata/sentence", items: part_of, toggle_id: "part-of-#{SecureRandom.hex(4)}" %>
       </dd>
     <% end %>
@@ -69,7 +69,7 @@
     <% end %>
     <% if local_assigns.include?(:last_updated) && last_updated %>
       <dt class="gem-c-metadata__term"><%= t("components.metadata.last_updated") %>:</dt>
-      <dd class="gem-c-metadata__definition" data-module="gem-toggle">
+      <dd class="gem-c-metadata__definition">
         <%= last_updated %>
         <% if local_assigns.include?(:see_updates_link) %>
           &#8212; <a href="#full-publication-update-history"
@@ -78,27 +78,19 @@
           </a>
         <% end %>
         <% if page_history.any? %>
-          <span aria-hidden="true">&#8212; </span>
-          <% page_history_toggle_id = "page-history-#{SecureRandom.hex(4)}" %>
-          <a
-            href="#full-history"
-            class="gem-c-metadata__toggle govuk-link"
-            data-controls="<%= page_history_toggle_id %>"
-            data-expanded="false"
-            data-toggled-text='<%= t("components.metadata.hide_all_updates", locale: :en) %>'
-            data-module="ga4-event-tracker"
-            data-ga4-event='<%= { event_name: "select_content", type: "content history", section: "Footer" }.to_json %>'
-            data-ga4-expandable>
-            <%= t("components.metadata.show_all_updates", locale: :en) %>
-          </a>
-          <ol class="gem-c-metadata__change-history js-hidden" id="<%= page_history_toggle_id %>">
-            <% page_history.each do |change| %>
-              <li>
-                <time class="gem-c-metadata__change-date timestamp" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
-                <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
-              </li>
-            <% end %>
-          </ol>
+          <%= 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 %>
         <% end %>
       </dd>
     <% end %>
@@ -111,10 +103,8 @@
         <% if definition.any? %>
           <dt class="gem-c-metadata__term"><%= title %>:</dt>
           <dd class="gem-c-metadata__definition"
-            <% if disable_ga4 %>
-              data-module="gem-toggle"
-            <% else %>
-              data-module="gem-toggle ga4-link-tracker"
+            <% unless disable_ga4 %>
+              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)}" %>

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

@@ -4,35 +4,24 @@
   checkboxes_count_id = checkboxes_id + "-count"
   show_filter ||= false
   large ||= false
-%>
-
-<% if show_filter %>
-  <% filter_id ||= "input-#{SecureRandom.hex(4)}" %>
-  <% filter = capture do %>
-    <%= tag.label for: filter_id, class: "govuk-label govuk-visually-hidden" do %>
-      Filter <%= title %>
-    <% end %>
 
-    <%= tag.input name: "option-select-filter",
+  if show_filter
+    filter_id ||= "input-#{SecureRandom.hex(4)}"
+    filter_attributes = {
       id: filter_id,
-      class: "gem-c-option-select__filter-input govuk-input",
-      type: "text",
-      aria: {
-        describedby: checkboxes_count_id,
-        controls: checkboxes_id,
-      } %>
-  <% end %>
-  <% filter_element = CGI::escapeHTML(filter) %>
-<% end %>
+      title: "Filter #{title}",
+      describedby: checkboxes_count_id,
+      controls: checkboxes_id,
+    }
+  end
 
-<%
   helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
   helper.add_class("gem-c-option-select")
   helper.add_data_attribute({ module: "option-select" })
   helper.add_data_attribute({ "closed-on-load": true }) if local_assigns.include?(:closed_on_load) && closed_on_load
   helper.add_data_attribute({ "closed-on-load-mobile": "true" }) if local_assigns.include?(:closed_on_load_mobile) && closed_on_load_mobile
   helper.add_data_attribute({ "input-aria-controls": aria_controls_id }) if local_assigns.include?(:aria_controls_id)
-  helper.add_data_attribute({ "filter-element": filter_element }) if show_filter
+  helper.add_data_attribute({ "filter-attributes": filter_attributes }) if filter_attributes
   helper.add_data_attribute({ "button-data-attributes": button_data_attributes }) if local_assigns.include?(:button_data_attributes)
 
   options_container_classes = %w[gem-c-option-select__container js-options-container]

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

@@ -22,6 +22,10 @@ examples:
   history_only:
     data:
       history: Updated 2 weeks ago
+  with_border_top:
+    data:
+      border_top: true
+      from: <a href='/government/organisations/ministry-of-defence'>Ministry of Defence</a>
   published_and_updated:
     data:
       first_published: 14 June 2014
@@ -33,6 +37,37 @@ examples:
     data:
       last_updated: 10 September 2015
       see_updates_link: true
+  display_page_history:
+    description: |
+      This will set up an expandable section on the page, with a top border, to let users toggle the display of the page history. It also includes a hidden H2 heading of 'Updates to this page'. This heading will not be included if one is passed to the component using the `title` option.
+
+      This example includes an expandable 'part of' section to show both toggling elements working together in one component instance.
+    data:
+      border_top: true
+      part_of:
+        - <a href="/government/world/afghanistan">Afghanistan</a>
+        - <a href="/government/world/albania">Albania</a>
+        - <a href="/government/world/algeria">Algeria</a>
+        - <a href="/government/world/angola">Angola</a>
+        - <a href="/government/world/anguilla">Anguilla</a>
+        - <a href="/government/world/argentina">Argentina</a>
+        - <a href="/government/world/armenia">Armenia</a>
+        - <a href="/government/world/australia">Australia</a>
+        - <a href="/government/world/austria">Austria</a>
+        - <a href="/government/world/azerbaijan">Azerbaijan</a>
+        - <a href="/government/world/bahrain">Bahrain</a>
+      first_published: 1st January 1990
+      last_updated: 20th October 2016
+      page_history:
+      - display_time: 1st January 1990
+        note: First published
+        timestamp: 1990-01-01T15:42:37.000+00:00
+      - display_time: 20th July 1995
+        note: Updated to include information for 1994
+        timestamp: 1995-07-20T15:42:37.000+00:00
+      - display_time: 14th October 2000
+        note: Updated information on pupil premium reviews and what information schools need to publish on their websites.
+        timestamp: 2000-10-14T15:42:37.000+00:00
   extensive:
     data:
       from:
@@ -348,36 +383,6 @@ examples:
       first_published: 14 June 2014
       other:
         Applies to: England, Scotland, and Wales (see detailed guidance for <a href="http://www.dardni.gov.uk/news-dard-pa022-a-13-new-procedure-for" rel="external">Northern Ireland</a>)
-  display_page_history:
-    description: |
-      This will set up an expandable section on the page, with a top border, to let users toggle the display of the page history. It also includes a hidden H2 heading of 'Updates to this page'. This heading will not be included if one is passed to the component using the `title` option.
-
-      This example includes an expandable 'part of' section to show both toggling elements working together in one component instance.
-    data:
-      part_of:
-        - <a href="/government/world/afghanistan">Afghanistan</a>
-        - <a href="/government/world/albania">Albania</a>
-        - <a href="/government/world/algeria">Algeria</a>
-        - <a href="/government/world/angola">Angola</a>
-        - <a href="/government/world/anguilla">Anguilla</a>
-        - <a href="/government/world/argentina">Argentina</a>
-        - <a href="/government/world/armenia">Armenia</a>
-        - <a href="/government/world/australia">Australia</a>
-        - <a href="/government/world/austria">Austria</a>
-        - <a href="/government/world/azerbaijan">Azerbaijan</a>
-        - <a href="/government/world/bahrain">Bahrain</a>
-      first_published: 1st January 1990
-      last_updated: 20th October 2016
-      page_history:
-      - display_time: 1st January 1990
-        note: First published
-        timestamp: 1990-01-01T15:42:37.000+00:00
-      - display_time: 20th July 1995
-        note: Updated to include information for 1994
-        timestamp: 1995-07-20T15:42:37.000+00:00
-      - display_time: 14th October 2000
-        note: Updated information on pupil premium reviews and what information schools need to publish on their websites.
-        timestamp: 2000-10-14T15:42:37.000+00:00
   with_title:
     data:
       last_updated: 10 September 2015

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

@@ -9,16 +9,10 @@
 %>
 <%= items.to_sentence(two_words_connector: connector, last_word_connector: connector).html_safe %>
 <% if remaining.any? %>
-  <div class="gem-c-metadata__toggle-wrap govuk-!-display-none-print">
-    <a href="#"
-       class="gem-c-metadata__definition-link govuk-!-display-none-print"
-       data-controls="toggle-<%= toggle_id %>"
-       data-expanded="false"
-       data-toggled-text="<%= t("common.toggle_less") %>">
-        <%= t("common.toggle_more",
-          show: t("common.show"),
-          number: remaining.length) %>
-    </a>
-  </div>
-  <span id="toggle-<%= toggle_id %>" class="gem-c-metadata__toggle-items js-hidden"><%= remaining.to_sentence.html_safe %></span>
+  <%= 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 %>
 <% end %>

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "68.1.0".freeze
+  VERSION = "68.3.0".freeze
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 68.1.0
+  version: 68.3.0
 platform: ruby
 authors:
 - GOV.UK Dev
@@ -2118,7 +2118,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 4.0.18
+rubygems_version: 4.0.19
 specification_version: 4
 summary: A gem to document components in GOV.UK frontend applications
 test_files: []