govuk_publishing_components 32.1.0 → 35.0.0

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

@@ -1,53 +1,34 @@
 <%
+  add_gem_component_stylesheet("accordion")
+
   local_assigns[:margin_bottom] ||= 6
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+  accordion_helper = GovukPublishingComponents::Presenters::AccordionHelper.new()
 
   id ||= "default-id-#{SecureRandom.hex(4)}"
   items ||= []
   anchor_navigation ||= false
   track_show_all_clicks ||= false
   track_sections ||= false
-
-  accordion_classes = %w(gem-c-accordion govuk-accordion)
-  accordion_classes << (shared_helper.get_margin_bottom)
-
-  translations = {
-    show_text: "components.accordion.show",
-    hide_text: "components.accordion.hide",
-    show_all_text: "components.accordion.show_all",
-    hide_all_text: "components.accordion.hide_all",
-    this_section_visually_hidden: "components.accordion.this_section_visually_hidden",
-  }
-
-  locales = {}
-
-  data_attributes ||= {}
-  ((data_attributes[:module] ||= "") << " " << "govuk-accordion gem-accordion").strip!
-  data_attributes[:anchor_navigation] = anchor_navigation
-  data_attributes[:track_show_all_clicks] = track_show_all_clicks
-  data_attributes[:track_sections] = track_sections
-
+  ga4_tracking ||= false
   data_attributes_show_all ||= nil
-  data_attributes[:show_all_attributes] = data_attributes_show_all if data_attributes_show_all
-
-  translations.each do |key, translation|
-    locales[key] = shared_helper.t_locale(translation)
-    data_attributes[key] = t(translation)
-  end
 
-  unique_locales = locales.values.uniq
-
-  if unique_locales.length > 1
-    data_attributes[:locale] = locales
-  else
-    if unique_locales[0] != I18n.locale
-      data_attributes[:locale] = unique_locales[0]
-    end
-  end
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.set_id(id)
+  component_helper.add_class("gem-c-accordion govuk-accordion")
+  component_helper.add_class(shared_helper.get_margin_bottom)
 
+  component_helper.add_data_attribute({ module: "govuk-accordion gem-accordion" })
+  component_helper.add_data_attribute({ module: "ga4-event-tracker" }) if ga4_tracking
+  component_helper.add_data_attribute({ ga4_expandable: "" }) if ga4_tracking
+  component_helper.add_data_attribute({ anchor_navigation: anchor_navigation }) if anchor_navigation
+  component_helper.add_data_attribute({ track_show_all_clicks: track_show_all_clicks }) if track_show_all_clicks
+  component_helper.add_data_attribute({ track_sections: track_sections }) if track_sections
+  component_helper.add_data_attribute({ show_all_attributes: data_attributes_show_all }) if data_attributes_show_all
+  component_helper.add_data_attribute(accordion_helper.apply_translations)
 %>
 <% if items.any? %>
-  <%= tag.div(class: accordion_classes, id: id, data: data_attributes) do %>
+  <%= tag.div(**component_helper.all_attributes) do %>
     <% items.each_with_index do |item, i| %>
       <%
         # The GOVUK Frontend JavaScript for this component
@@ -57,6 +38,19 @@
 
         item[:data_attributes] ||= nil
 
+        if ga4_tracking
+          item[:data_attributes] ||= {}
+          item[:data_attributes][:ga4_event] = {
+            event_name: "select_content",
+            type: "accordion",
+            text: item[:heading][:text],
+            index: {
+              index_section: index,
+              index_section_count: items.length,
+            },
+          }.to_json
+        end
+
         section_classes = %w(govuk-accordion__section)
         section_classes << 'govuk-accordion__section--expanded' if item[:expanded]
 

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("action-link")
+
   local_assigns[:margin_bottom] ||= 0
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
 
@@ -41,9 +43,12 @@
   link_classes << shared_helper.classes if classes
   link_classes << "govuk-link--inverse" if light_text
   link_classes << shared_helper.get_heading_size(font_size, 'm') if font_size
+
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class(css_classes.join(" "))
 %>
 <% if text.present? %>
-  <div class="<%= css_classes.join(' ') %>">
+  <%= tag.div(**component_helper.all_attributes) do %>
     <% contents = capture do %>
       <span class="gem-c-action-link__link-wrapper">
         <% main_text = capture do %>
@@ -78,5 +83,5 @@
     <% else %>
       <%= contents %>
     <% end %>
-  </div>
+  <% end %>
 <% end %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("attachment")
+
   attachment = GovukPublishingComponents::Presenters::AttachmentHelper.new(attachment)
   target ||= "_self"
   hide_opendocument_metadata ||= false

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("attachment-link")
+
   attachment = GovukPublishingComponents::Presenters::AttachmentHelper.new(attachment)
   target ||= nil
   data_attributes ||= {}

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("back-link")
+
   text ||= t('components.back_link.back')
   data_attributes ||= nil
 %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("big-number")
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   big_number_helper = GovukPublishingComponents::Presenters::BigNumberHelper.new(local_assigns)
 
@@ -34,7 +36,7 @@
       </span>
     <% end %>
   <% end %>
-  
+
   <%= tag.div class: classes, aria: aria do %>
     <% unless href.nil? %>
       <%= link_to big_number_value, href, class: "govuk-link gem-c-big-number__link", data: data_attributes %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("breadcrumbs")
+
   border ||= false
   breadcrumbs ||= []
   collapse_on_mobile ||= false
@@ -10,13 +12,17 @@
   classes << "govuk-breadcrumbs--collapse-on-mobile" if collapse_on_mobile
   classes << "gem-c-breadcrumbs--inverse" if inverse
   classes << "gem-c-breadcrumbs--border-bottom" if border == "bottom"
+
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class(classes.join(" "))
+  component_helper.add_data_attribute({ module: "gem-track-click ga4-link-tracker" })
 %>
 
 <script type="application/ld+json">
   <%= raw JSON.pretty_generate(breadcrumb_presenter.structured_data) %>
 </script>
 
-<div class="<%= classes.join(" ") %>" data-module="gem-track-click">
+<%= tag.div(**component_helper.all_attributes) do %>
   <ol class="govuk-breadcrumbs__list">
     <% breadcrumbs.each_with_index do |crumb, index| %>
       <% breadcrumb = GovukPublishingComponents::Presenters::Breadcrumb.new(crumb, index) %>
@@ -34,4 +40,4 @@
         </li>
     <% end %>
   </ol>
-</div>
+<% end %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("button")
+
   # button_helper.css_classes generates "gem-c-button"
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   local_assigns[:classes] = shared_helper.classes

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

@@ -1,18 +1,20 @@
 <%
+  add_gem_component_stylesheet("cards")
+
   heading ||= nil
   items ||= nil
   sub_heading_level ||= 3
   two_column_layout ||= false
-  local_assigns ||= nil
-  data_attributes ||= nil
 
   ul_classes = %w[gem-c-cards__list]
   ul_classes << 'gem-c-cards__list--two-column-desktop' if two_column_layout
 
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-cards")
 %>
 <% if items.present? %>
-  <div class="gem-c-cards">
+  <%= tag.div(**component_helper.all_attributes) do %>
     <% if heading %>
       <%= content_tag(shared_helper.get_heading_level, class: "gem-c-cards__heading govuk-heading-m") do %>
         <%= heading %>
@@ -47,5 +49,5 @@
         </li>
       <% end %>
     <% end %>
-  </div>
+  <% end %>
 <% end %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("character-count")
+
   id ||= "character-count-#{SecureRandom.hex(4)}"
   maxlength ||= nil
   maxwords ||= nil

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

@@ -1,10 +1,14 @@
 <%
-  # cb_helper.css_classes generates "gem-c-checkboxes"
+  add_gem_component_stylesheet("checkboxes")
   cb_helper = GovukPublishingComponents::Presenters::CheckboxesHelper.new(local_assigns)
   id = cb_helper.id
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.set_id(id)
+  component_helper.add_class(cb_helper.css_classes.join(" ")) # cb_helper.css_classes generates "gem-c-checkboxes"
+  component_helper.add_data_attribute({ module: "gem-checkboxes govuk-checkboxes" })
 %>
 
-<%= tag.div id: id, class: cb_helper.css_classes, data: { module: "gem-checkboxes govuk-checkboxes" } do %>
+<%= tag.div(**component_helper.all_attributes) do %>
   <% if cb_helper.should_have_fieldset %>
     <% if cb_helper.heading_markup %>
       <%= tag.fieldset class: "govuk-fieldset", "aria-describedby": cb_helper.fieldset_describedby do %>

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

@@ -1,30 +1,26 @@
 <%-
+  add_gem_component_stylesheet("contents-list")
+
   cl_helper = GovukPublishingComponents::Presenters::ContentsListHelper.new(local_assigns)
   underline_links ||= false
-  aria_label ||= t("components.contents_list.contents")
   format_numbers ||= false
   brand ||= false
   brand_helper = GovukPublishingComponents::AppHelpers::BrandHelper.new(brand)
   title_fallback = t("components.contents_list.contents", locale: I18n.locale, fallback: false, default: "en")
   classes = %w[gem-c-contents-list]
-  classes << brand_helper.brand_class
-  link_classes = %w[
-    gem-c-contents-list__link
-    govuk-link
-  ]
+  link_classes = %w[gem-c-contents-list__link govuk-link]
   link_classes << brand_helper.color_class
   link_classes << "govuk-link--no-underline" unless underline_links
+
+  local_assigns[:aria] ||= {}
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-contents-list #{brand_helper.brand_class}")
+  component_helper.add_data_attribute({ module: "gem-track-click" })
+  component_helper.add_aria_attribute({ label: t("components.contents_list.contents") }) unless local_assigns[:aria][:label]
+  component_helper.add_role("navigation")
 -%>
 <% if cl_helper.contents.any? %>
-  <%= content_tag(
-    :nav,
-    class: classes,
-    "aria-label": aria_label,
-    role: "navigation",
-    data: {
-      module: "gem-track-click"
-    }
-  ) do %>
+  <%= tag.nav(**component_helper.all_attributes) do %>
     <%= content_tag(
       :h2, {class: "gem-c-contents-list__title"}.merge(
         title_fallback == "en" ? {:lang => "en",} : {}

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

@@ -1,7 +1,10 @@
-<% prioritise_taxon_breadcrumbs ||= false %>
-<% breadcrumb_selector = GovukPublishingComponents::Presenters::BreadcrumbSelector.new(content_item, request, prioritise_taxon_breadcrumbs) %>
-<% inverse ||= false %>
-<% collapse_on_mobile ||= true unless local_assigns[:collapse_on_mobile].eql?(false) %>
+<% 
+  ga4_tracking ||= false
+  prioritise_taxon_breadcrumbs ||= false
+  breadcrumb_selector = GovukPublishingComponents::Presenters::BreadcrumbSelector.new(content_item, request, prioritise_taxon_breadcrumbs, ga4_tracking)
+  inverse ||= false
+  collapse_on_mobile ||= true unless local_assigns[:collapse_on_mobile].eql?(false) 
+%>
 
 <div class="gem-c-contextual-breadcrumbs">
   <% if breadcrumb_selector.step_by_step %>

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

@@ -1,10 +1,12 @@
 <% navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request) %>
+<% ga4_tracking ||= false %>
 
 <% unless navigation.content_tagged_to_current_step_by_step? %>
   <div class="gem-c-contextual-footer">
     <%# Rendering related navigation because no step by step list %>
     <%= render 'govuk_publishing_components/components/related_navigation',
                content_item: content_item,
+               ga4_tracking: ga4_tracking,
                context: :footer %>
   </div>
 <% end %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("contextual-guidance")
+
   id ||= nil
   title ||= nil
   content ||= nil

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

@@ -1,10 +1,16 @@
-<% navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request) %>
-<% shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns) %>
+<%
+  add_gem_component_stylesheet("contextual-sidebar")
+
+  ga4_tracking ||= false
+  request.query_parameters[:ga4_tracking] = ga4_tracking
+  navigation = GovukPublishingComponents::Presenters::ContextualNavigation.new(content_item, request)
+  shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+%>
 
 <div class="gem-c-contextual-sidebar">
   <% if navigation.content_tagged_to_a_reasonable_number_of_step_by_steps? %>
     <%# Rendering step by step related items because there are a few but not too many of them %>
-    <%= render 'govuk_publishing_components/components/step_by_step_nav_related', links: navigation.step_nav_helper.related_links %>
+    <%= render 'govuk_publishing_components/components/step_by_step_nav_related', links: navigation.step_nav_helper.related_links, ga4_tracking: ga4_tracking %>
   <% end %>
 
   <% if navigation.content_tagged_to_current_step_by_step? %>
@@ -12,7 +18,7 @@
     <%= render 'govuk_publishing_components/components/step_by_step_nav', navigation.step_nav_helper.sidebar %>
   <% else %>
     <%# Rendering related navigation sidebar because no step by step list %>
-    <%= render 'govuk_publishing_components/components/related_navigation', content_item: content_item, context: :sidebar %>
+    <%= render 'govuk_publishing_components/components/related_navigation', content_item: content_item, context: :sidebar, ga4_tracking: ga4_tracking %>
   <% end %>
 
   <% if navigation.content_tagged_to_other_step_by_steps? %>
@@ -20,11 +26,12 @@
     <%= render 'govuk_publishing_components/components/step_by_step_nav_related', {
       pretitle: t("components.contextual_sidebar.pretitle"),
       links: navigation.step_nav_helper.also_part_of_step_nav,
-      always_display_as_list: true
+      always_display_as_list: true,
+      ga4_tracking: ga4_tracking
     } %>
   <% end %>
 
   <% if navigation.show_ukraine_cta? %>
-    <%= render 'govuk_publishing_components/components/contextual_sidebar/ukraine_cta', content_item: content_item %>
+    <%= render 'govuk_publishing_components/components/contextual_sidebar/ukraine_cta', content_item: content_item, ga4_tracking: ga4_tracking %>
   <% end %>
 </div>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("cookie-banner")
+
   id ||= 'global-cookie-message'
   title ||= t("components.cookie_banner.title")
   text ||= t("components.cookie_banner.text")
@@ -14,9 +16,9 @@
   text = raw(text)
 
   cookie_preferences_href ||= "/help/cookies"
-  confirmation_message ||= raw(t("components.cookie_banner.confirmation_message_html",
+  confirmation_message ||= raw(t("components.cookie_banner.confirmation_message.html",
                                 link: link_to(
-                                  t("components.cookie_banner.confirmation_message_link"),
+                                  t("components.cookie_banner.confirmation_message.link"),
                                   cookie_preferences_href,
                                   class: "govuk-link",
                                   data: {
@@ -29,8 +31,8 @@
   css_classes = %w(gem-c-cookie-banner govuk-clearfix)
   css_classes << "gem-c-cookie-banner--services" if services_cookies
 %>
-<div id="<%= id %>" class="<%= css_classes.join(' ') %>" data-module="cookie-banner" role="region" aria-label="cookie banner" data-nosnippet>
-  <div class="govuk-cookie-banner js-banner-wrapper" role="region" aria-label="<%= title %>">
+<div id="<%= id %>" class="<%= css_classes.join(' ') %>" data-module="cookie-banner" data-nosnippet role="region" aria-label="<%= title %>">
+  <div class="govuk-cookie-banner js-banner-wrapper">
     <div class="gem-c-cookie-banner__message govuk-cookie-banner__message govuk-width-container">
       <div class="govuk-grid-row">
         <div class="govuk-grid-column-two-thirds">
@@ -79,13 +81,17 @@
                   "track-action": "Cookie banner rejected",
                 }
             } %>
-            <a class="govuk-link" href="<%= cookie_preferences_href %>">View cookies</a>
+            <a class="govuk-link" href="<%= cookie_preferences_href %>"><%= t("components.cookie_banner.buttons.view_cookies") %></a>
           </div>
         <% end %>
     </div>
   </div>
   <div class="gem-c-cookie-banner__confirmation govuk-width-container" tabindex="-1" hidden>
-    <p class="gem-c-cookie-banner__confirmation-message" role="alert"><%= confirmation_message %></p>
+    <p class="gem-c-cookie-banner__confirmation-message" role="alert">
+      <span class="gem-c-cookie-banner__confirmation-message__accepted" hidden><%= t("components.cookie_banner.confirmation_message.accepted") %>. </span>
+      <span class="gem-c-cookie-banner__confirmation-message__rejected" hidden><%= t("components.cookie_banner.confirmation_message.rejected") %>. </span>
+      <%= confirmation_message %>
+    </p>
     <div class="govuk-button-group">
       <button class="gem-c-cookie-banner__hide-button govuk-button" data-hide-cookie-banner="true" data-module="gem-track-click" data-track-category="cookieBanner" data-track-action="Hide cookie banner"><%= t("components.cookie_banner.hide") %></button>
     </div>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("date-input")
+
   id ||= "input-#{SecureRandom.hex(4)}"
   name ||= nil
   items ||= [

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("details")
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
 
   open ||= nil
@@ -11,9 +13,11 @@
 
   data_attributes ||= {}
   data_attributes[:details_track_click] = ''
+
+  summary_aria_attributes ||= {}
 %>
 <%= tag.details class: css_classes, data: details_data_attributes, open: open do %>
-  <%= tag.summary class: "govuk-details__summary", data: data_attributes do %>
+  <%= tag.summary class: "govuk-details__summary", data: data_attributes, aria: summary_aria_attributes do %>
     <span class="govuk-details__summary-text">
       <%= title %>
     </span>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("devolved-nations")
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   devolved_nations_helper = GovukPublishingComponents::Presenters::DevolvedNationsHelper.new(local_assigns)
 

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("document-list")
+
   items ||= []
 
   classes = "gem-c-document-list"
@@ -6,6 +8,7 @@
   classes << " gem-c-document-list--bottom-margin" if local_assigns[:margin_bottom]
   classes << " gem-c-document-list--no-underline" if local_assigns[:remove_underline]
   classes << " gem-c-document-list--no-top-border" if local_assigns[:remove_top_border]
+  classes << " gem-c-document-list--no-top-border-first-child" if local_assigns[:remove_top_border_from_first_child]
 
   within_multitype_list ||= false
   within_multitype_list_class = " gem-c-document-list__multi-list" if within_multitype_list

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("emergency-banner")
+
   heading ||= ""
   short_description ||= nil
   link ||= nil

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("error-alert")
+
   id ||= nil
   description ||= nil
   data_attributes ||= {}

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

@@ -1,15 +1,18 @@
 <%
+  add_gem_component_stylesheet("error-message")
+
   id ||= "error-message-#{SecureRandom.hex(4)}"
   classes ||= ''
   css_classes = %w( gem-c-error-message govuk-error-message )
   css_classes << classes if classes
   items ||= []
+  right_to_left ||= false
 
   if items.any?
     errors = items.map { |item| capture { item[:text] } }
     text = raw(errors.join("<br />"))
   end
 %>
-<%= tag.p id: id, class: css_classes do %>
+<%= tag.p id: id, class: css_classes, dir: right_to_left ? "rtl" : nil do %>
   <span class="govuk-visually-hidden">Error:</span> <%= text %>
 <% end %>

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

@@ -1,10 +1,11 @@
 <%
+  add_gem_component_stylesheet("error-summary")
+
   id ||= "error-summary-#{SecureRandom.hex(4)}"
   title ||= false
   description ||= false
   data_attributes ||= {}
   items ||= []
-  title_id ||= "error-summary-title-#{SecureRandom.hex(4)}"
   if items.empty? && !title
     raise ArgumentError, "The error_summary component needs at least one item or a title in order to render."
   end
@@ -12,33 +13,35 @@
 <%= tag.div(
   class: "gem-c-error-summary govuk-error-summary",
   data: { module: "govuk-error-summary" }.merge(data_attributes),
-  aria: { labelledby: title_id },
-  role: "alert",
   id: id,
 ) do %>
-  <% if title %>
-    <h2 class="govuk-error-summary__title" id="<%= title_id %>">
-      <%= title %>
-    </h2>
-  <% end %>
-  <div class="govuk-error-summary__body">
-    <% if description %>
-      <p><%= description %></p>
+  <%= tag.div(
+    role: "alert",
+  ) do %>
+    <% if title %>
+      <h2 class="govuk-error-summary__title">
+        <%= title %>
+      </h2>
     <% end %>
-    <% if items.present? %>
-      <ul class="govuk-list govuk-error-summary__list">
-        <% items.each_with_index do |item, index| %>
-          <li class="gem-c-error-summary__list-item">
-            <% if item[:href] %>
-              <%= link_to item[:text], item[:href], target: item[:target], data: item[:data_attributes] %>
-            <% else %>
-              <%= tag.span data: item[:data_attributes] do %>
-                <%= item[:text] %>
+    <div class="govuk-error-summary__body">
+      <% if description %>
+        <p><%= description %></p>
+      <% end %>
+      <% if items.present? %>
+        <ul class="govuk-list govuk-error-summary__list">
+          <% items.each_with_index do |item, index| %>
+            <li class="gem-c-error-summary__list-item">
+              <% if item[:href] %>
+                <%= link_to item[:text], item[:href], target: item[:target], data: item[:data_attributes] %>
+              <% else %>
+                <%= tag.span data: item[:data_attributes] do %>
+                  <%= item[:text] %>
+                <% end %>
               <% end %>
-            <% end %>
-          </li>
-        <% end %>
-      </ul>
-    <% end %>
-  </div>
+            </li>
+          <% end %>
+        </ul>
+      <% end %>
+    </div>
+  <% end %>
 <% end %>

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("feedback")
+
   def utf_encode(element)
     element.is_a?(String) ? element.encode : element
   end

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("fieldset")
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
 
   text = text || yield

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

@@ -1,4 +1,6 @@
 <%
+  add_gem_component_stylesheet("file-upload")
+
   id ||= "file-upload-#{SecureRandom.hex(4)}"
   value ||= nil
   accept ||= nil

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

@@ -7,7 +7,7 @@
     gtm_attributes << "gtm_preview=" + gtm_preview if gtm_preview
   gtm_attributes = gtm_attributes.join('&')
 %>
-<script>
+<%= javascript_tag nonce: true do -%>
 var doNotTrack = ( navigator.doNotTrack === '1' || navigator.doNotTrack === 'yes' || navigator.msDoNotTrack === '1' || window.doNotTrack === '1' )
 if (!doNotTrack) {
   (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
@@ -16,4 +16,4 @@ if (!doNotTrack) {
   'https://www.googletagmanager.com/gtm.js?id='+i+dl+'&<%= raw gtm_attributes %>';f.parentNode.insertBefore(j,f);
 })(window,document,'script','dataLayer','<%= gtm_id %>');
 }
-</script>
+<% end -%>

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

@@ -1,4 +1,5 @@
 <%
+  add_gem_component_stylesheet("govspeak")
   inverse ||= false
   direction_class = "direction-#{direction}" if local_assigns.include?(:direction)
   disable_youtube_expansions = local_assigns.fetch(:disable_youtube_expansions) if local_assigns.include?(:disable_youtube_expansions)