RubyGems - govuk_publishing_components - Versions diffs - 68.2.0 → 69.0.0 - Mend

govuk_publishing_components 68.2.0 → 69.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (357) hide show

data/app/assets/stylesheets/govuk_publishing_components/components/_related-navigation.scss CHANGED Viewed

@@ -1,7 +1,7 @@
 .gem-c-related-navigation {
   border-top: 2px solid govuk-colour("blue");
   margin-bottom: govuk-spacing(9);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
 }
 .gem-c-related-navigation__main-heading {

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

@@ -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/_select-with-search.scss CHANGED Viewed

@@ -14,7 +14,7 @@ $choices-border-radius-item: 0 !default;
 $choices-z-index: 2 !default;
 $choices-button-dimension: 12px !default;
-@import "govuk/components/label/label";
+@import "govuk/components/label";
 @import "choices.js/src/styles/choices";
 .gem-c-select-with-search {

data/app/assets/stylesheets/govuk_publishing_components/components/_select.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/select/select";
+@import "govuk/components/select";
 // Increase height of selects that have a `multiple`
 // attribute otherwise they are too small to be useful.

data/app/assets/stylesheets/govuk_publishing_components/components/_service-navigation.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/service-navigation/service-navigation";
+@import "govuk/components/service-navigation";
 .gem-c-service-navigation--full-width {
   padding-left: govuk-spacing(3);

data/app/assets/stylesheets/govuk_publishing_components/components/_skip-link.scss CHANGED Viewed

	@@ -1 +1 @@
1	- @import "govuk/components/skip-link~~/skip-link~~";
1	+ @import "govuk/components/skip-link";

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

@@ -5,7 +5,7 @@
   border-bottom: solid 1px govuk-colour("blue");
   margin-top: govuk-spacing(3);
   @include govuk-font(24, $weight: bold);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   @include govuk-media-query($from: tablet) {
     padding: govuk-spacing(5);
@@ -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-related.scss CHANGED Viewed

@@ -1,7 +1,7 @@
 .gem-c-step-nav-related {
   border-top: 2px solid govuk-colour("blue");
   margin-bottom: govuk-spacing(6);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
 }
 .gem-c-step-nav-related__heading {

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

@@ -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 & {
@@ -395,7 +395,7 @@ $top-border: solid 1px govuk-functional-colour("border");
 .gem-c-step-nav__title {
   margin: 0;
   @include step-nav-font(19, $weight: bold, $line-height: 1.4);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   .gem-c-step-nav--large & {
     @include step-nav-font(19, $tablet-size: 24, $weight: bold, $line-height: 1.4);
@@ -417,7 +417,7 @@ $top-border: solid 1px govuk-functional-colour("border");
 .gem-c-step-nav__panel {
   padding-bottom: govuk-spacing(5);
   @include step-nav-font(16);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   .gem-c-step-nav--large & {
     @include step-nav-font(16, $tablet-size: 19);

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

@@ -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/_subscription-links.scss CHANGED Viewed

@@ -1,5 +1,5 @@
 .gem-c-subscription-links {
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   @include govuk-font(19, $weight: bold);
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_success-alert.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/notification-banner/notification-banner";
+@import "govuk/components/notification-banner";
 // stylelint-disable declaration-no-important
 @include govuk-media-query($media-type: print) {

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

@@ -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/_summary-card.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/summary-list/summary-list";
+@import "govuk/components/summary-list";
 .gem-c-summary-card {
   .govuk-summary-list__key {

data/app/assets/stylesheets/govuk_publishing_components/components/_summary-list.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/summary-list/summary-list";
+@import "govuk/components/summary-list";
 .gem-c-summary-list {
   margin-bottom: govuk-spacing(6);

data/app/assets/stylesheets/govuk_publishing_components/components/_table.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/table/table";
+@import "govuk/components/table";
 $table-border-width: 1px;
 $table-border-colour: govuk-functional-colour("border");

data/app/assets/stylesheets/govuk_publishing_components/components/_tabs.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/tabs/tabs";
+@import "govuk/components/tabs";
 .govuk-frontend-supported {
   .gem-c-tabs__panel--no-border {

data/app/assets/stylesheets/govuk_publishing_components/components/_tag.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/tag/tag";
+@import "govuk/components/tag";
 .gem-c-tag {
   max-width: none;

data/app/assets/stylesheets/govuk_publishing_components/components/_textarea.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/textarea/textarea";
+@import "govuk/components/textarea";
 .gem-c-textarea {
   .govuk-textarea {

data/app/assets/stylesheets/govuk_publishing_components/components/_translation-nav.scss CHANGED Viewed

@@ -1,7 +1,7 @@
 .gem-c-translation-nav {
   margin-bottom: govuk-spacing(6);
   border-bottom: 1px solid govuk-functional-colour(border);
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   @include govuk-font(16);
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_warning-text.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/warning-text/warning-text";
+@import "govuk/components/warning-text";
 .gem-c-warning-text .govuk-warning-text__text {
   margin: 0;

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

@@ -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/_button.scss CHANGED Viewed

@@ -1,4 +1,4 @@
-@import "govuk/components/button/button";
+@import "govuk/components/button";
 .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 {

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

@@ -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/_charts.scss CHANGED Viewed

@@ -24,24 +24,23 @@
   $bar-spacing: 5px; // The spacing around the bars
   $stack-spacing: 1px; // For stacked bars, the spacing between each stack in a bar
   $caption-side: top; // Caption alignment. Top or bottom.
-  $key-width: 160px; // Only used by IE. Other browsers get smallest width that fits content
   // The following accessible colour palette has been developed to meet the colour contrast requirements for adjacent colours (as set out in WCAG 2.1)
   // For charts, the palette should be used instead of the GOV.UK colour palette - https://design-system.service.gov.uk/styles/colour/
   // https://gss.civilservice.gov.uk/policy-store/data-visualisation-colours-in-charts/#section-5
-  $gss-colour-dark-blue: #12436d;
-  $gss-colour-turquoise: #1bbbaf;
-  $gss-colour-dark-pink: #801650;
-  $gss-colour-orange: #f46a25;
-  $gss-colour-dark-grey: #3d3d3d;
-  $gss-colour-plum: #a285d1;
+  $chart-blue-shade-50: govuk-colour("blue", $variant: "shade-50");
+  $chart-teal-tint-25: govuk-colour("teal", $variant: "tint-25");
+  $chart-magenta-shade-25: govuk-colour("magenta", $variant: "shade-25");
+  $chart-primary-orange: govuk-colour("orange");
+  $chart-green-shade-50: govuk-colour("green", $variant: "shade-50");
+  $chart-accent-purple: #ba4aff; // There is currently no equivalent colour in the GOV.UK palette, but this can be updated in future if one is added.
   // CHART COLOUR SCHEME
   $chart-border: govuk-colour("white"); // Chart border colour
   $key-border: govuk-colour("white"); // Key border colour
-  $bar-colours: $gss-colour-dark-blue, $gss-colour-turquoise, $gss-colour-dark-pink, $gss-colour-orange, $gss-colour-dark-grey, $gss-colour-plum;
+  $bar-colours: $chart-blue-shade-50, $chart-teal-tint-25, $chart-magenta-shade-25, $chart-primary-orange, $chart-green-shade-50, $chart-accent-purple;
   $bar-text-colours: govuk-colour("white"), govuk-colour("black"), govuk-colour("white"), govuk-colour("black"), govuk-colour("white"), govuk-colour("black");
   $bar-cell-colour: govuk-colour("black");
   $bar-outdented-colour: govuk-colour("black");
@@ -148,6 +147,7 @@
           margin-bottom: 1px;
           color: govuk-colour("white");
           text-indent: $bar-padding;
+          font-weight: $govuk-font-weight-bold;
         }
         // Bar colours
@@ -175,6 +175,7 @@
           text-align: $label-align;
           display: table-cell;
           vertical-align: middle;
+          font-weight: $govuk-font-weight-bold;
         }
       }
     }

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

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -6,7 +6,7 @@
 // - alphagov/whitehall: ✔︎
 // - alphagov/govspeak: ✔︎
-@import "govuk/components/warning-text/warning-text";
+@import "govuk/components/warning-text";
 // stylelint-disable max-nesting-depth
 .govspeak, // Legacy class name that's still used in some content items - needs to be kept until `.govspeak` is removed from the content items.
@@ -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 CHANGED Viewed

@@ -1,11 +1,11 @@
 @mixin markdown-typography {
-  @include govuk-text-colour;
+  color: govuk-functional-colour(text);
   @include govuk-font($size: 16);
   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/assets/stylesheets/govuk_publishing_components/components/mixins/_index.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@import "grid-helper";
 @import "high-contrast-outline";
 @import "margins";
 @import "prefixed-transform";

data/app/views/govuk_publishing_components/components/_date_input.html.erb CHANGED Viewed

@@ -8,30 +8,34 @@
   ]
   autocomplete_date_of_birth ||= nil
   legend_text ||= nil
+  legend_heading_level ||= nil
+  legend_size ||= nil
   hint ||= nil
   error_message ||= nil
   error_items ||= []
-  describedby ||= nil
-  has_error ||= error_message || error_items.any?
+  error_id ||= nil
+  has_error ||= error_message || error_items.any? || error_id
   css_classes = %w(gem-c-date-input govuk-date-input)
   form_group_css_classes = %w(govuk-form-group)
   form_group_css_classes << "govuk-form-group--error" if has_error
   hint_id = "hint-#{SecureRandom.hex(4)}"
-  error_id = "error-#{SecureRandom.hex(4)}"
+  error_id = error_id || "error-#{SecureRandom.hex(4)}"
-  aria_described_by ||= nil
-  if hint || has_error || describedby
+  aria_described_by = nil
+  if hint || has_error
     aria_described_by = []
-    aria_described_by << hint_id if hint
+    aria_described_by << hint_id if hint && !has_error
     aria_described_by << error_id if has_error
-    aria_described_by << describedby if describedby
     aria_described_by = aria_described_by.join(" ")
   end
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class(form_group_css_classes.join(" "))
 %>
-<%= content_tag :div, class: form_group_css_classes do %>
+<%= tag.div(**component_helper.all_attributes) do %>
   <% fieldset_content = capture do %>
     <% if hint %>
       <%= render "govuk_publishing_components/components/hint", {
@@ -41,7 +45,7 @@
       } %>
     <% end %>
-    <% if has_error %>
+    <% if error_message || error_items.any? %>
       <%= render "govuk_publishing_components/components/error_message", {
         id:  error_id,
         text: error_message,
@@ -62,6 +66,7 @@
             value: item[:value],
             width: item[:width],
             id: item[:id],
+            describedby: aria_described_by,
             type: "number",
             data: item[:data],
             autocomplete: autocomplete_date_of_birth ? "bday-#{item[:name]}" : nil,
@@ -73,8 +78,9 @@
   <% if legend_text %>
     <%= render "govuk_publishing_components/components/fieldset", {
-      describedby: aria_described_by,
       legend_text: legend_text,
+      heading_level: legend_heading_level,
+      heading_size: legend_size,
       text: fieldset_content,
       role: "group",
     } %>