govuk_publishing_components 24.2.0 → 24.5.0

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

@@ -5,6 +5,7 @@
   id ||= "default-id-#{SecureRandom.hex(4)}"
   items ||= []
   condensed ||= false
+  anchor_navigation ||= false
 
   accordion_classes = %w(gem-c-accordion)
   accordion_classes << 'gem-c-accordion--condensed' if condensed
@@ -12,6 +13,7 @@
 
   data_attributes ||= {}
   data_attributes[:module] = 'gem-accordion'
+  data_attributes[:anchor_navigation] = anchor_navigation
 %>
 <% if items.any? %>
   <%= tag.div(class: accordion_classes, id: id, data: data_attributes) do %>
@@ -19,8 +21,6 @@
       <%
         index = i + 1
 
-        item[:data_attributes] ||= nil
-
         section_classes = %w(gem-c-accordion__section)
         section_classes << 'gem-c-accordion__section--expanded' if item[:expanded]
 
@@ -29,7 +29,7 @@
 
       <%= tag.section(class: section_classes) do %>
         <div class="gem-c-accordion__section-header">
-          <%= content_tag(shared_helper.get_heading_level, class: 'gem-c-accordion__section-heading') do %>
+          <%= content_tag(shared_helper.get_heading_level, class: 'gem-c-accordion__section-heading', id: item[:heading][:id]) do %>
             <%= tag.span(item[:heading][:text], id: "#{id}-heading-#{index}", data: item[:data_attributes], class: 'gem-c-accordion__section-button') %>
           <% end %>
           <%= tag.div(item[:summary][:text], id: "#{id}-summary-#{index}", class: summary_classes) if item[:summary].present? %>

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

@@ -1,19 +1,22 @@
 <%
+  border ||= false
   breadcrumbs ||= []
-  inverse ||= false
   collapse_on_mobile ||= false
+  inverse ||= false
+
   breadcrumb_presenter = GovukPublishingComponents::Presenters::Breadcrumbs.new(breadcrumbs)
 
-  classes = "gem-c-breadcrumbs govuk-breadcrumbs"
-  classes << " govuk-breadcrumbs--collapse-on-mobile" if collapse_on_mobile
-  classes << " gem-c-breadcrumbs--inverse" if inverse
+  classes = %w[gem-c-breadcrumbs govuk-breadcrumbs]
+  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"
 %>
 
 <script type="application/ld+json">
   <%= raw JSON.pretty_generate(breadcrumb_presenter.structured_data) %>
 </script>
 
-<div class="<%= classes %>" data-module="track-click">
+<div class="<%= classes.join(" ") %>" data-module="gem-track-click">
   <ol class="govuk-breadcrumbs__list">
     <% breadcrumbs.each_with_index do |crumb, index| %>
       <% breadcrumb = GovukPublishingComponents::Presenters::Breadcrumb.new(crumb, index) %>

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

@@ -15,7 +15,7 @@
     "aria-label": aria_label,
     role: "navigation",
     data: {
-      module: "track-click"
+      module: "gem-track-click"
     }
   ) do %>
     <%= content_tag(

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

@@ -14,7 +14,7 @@
   text = raw(text)
 
   cookie_preferences_href ||= "/help/cookies"
-  confirmation_message ||= raw("You can <a class='govuk-link' href='#{cookie_preferences_href}' data-module='track-click' data-track-category='cookieBanner' data-track-action='Cookie banner settings clicked from confirmation'>change your cookie settings</a> at any time.")
+  confirmation_message ||= raw("You can <a class='govuk-link' href='#{cookie_preferences_href}' data-module='gem-track-click' data-track-category='cookieBanner' data-track-action='Cookie banner settings clicked from confirmation'>change your cookie settings</a> at any time.")
   services_cookies ||= nil
   css_classes = %w(gem-c-cookie-banner govuk-clearfix)
   css_classes << "gem-c-cookie-banner--services" if services_cookies
@@ -35,12 +35,12 @@
             <%= render "govuk_publishing_components/components/button", {
               name: "cookies",
               text: services_cookies.dig(:yes, :text) || "Yes",
-              data_attributes: { module: "track-click", "accept-cookies": "true", }.merge(services_cookies.dig(:yes, :data_attributes) || {})
+              data_attributes: { module: "gem-track-click", "accept-cookies": "true", }.merge(services_cookies.dig(:yes, :data_attributes) || {})
             } %>
             <%= render "govuk_publishing_components/components/button", {
               name: "cookies",
               text: services_cookies.dig(:no, :text) || "No",
-              data_attributes: { module: "track-click", "reject-cookies": "true", }.merge(services_cookies.dig(:no, :data_attributes) || {})
+              data_attributes: { module: "gem-track-click", "reject-cookies": "true", }.merge(services_cookies.dig(:no, :data_attributes) || {})
             } %>
             <% if services_cookies[:cookie_preferences] %>
               <%= link_to services_cookies.dig(:cookie_preferences, :text), services_cookies.dig(:cookie_preferences, :href), class: "govuk-link" %>
@@ -52,7 +52,7 @@
                 name: "cookies",
                 text: "Accept additional cookies",
                 data_attributes: {
-                  module: "track-click",
+                  module: "gem-track-click",
                   "accept-cookies": "true",
                   "track-category": "cookieBanner",
                   "track-action": "Cookie banner accepted",
@@ -63,7 +63,7 @@
                 name: "cookies",
                 text: "Reject additional cookies",
                 data_attributes: {
-                  module: "track-click",
+                  module: "gem-track-click",
                   "reject-cookies": "true",
                   "track-category": "cookieBanner",
                   "track-action": "Cookie banner rejected",
@@ -77,7 +77,7 @@
   <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>
     <div class="govuk-button-group">
-      <button class="gem-c-cookie-banner__hide-button govuk-button" data-hide-cookie-banner="true" data-module="track-click" data-track-category="cookieBanner" data-track-action="Hide cookie banner">Hide this message</button>
+      <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">Hide this message</button>
     </div>
   </div>
 </div>

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

@@ -9,7 +9,7 @@
 %>
 <% if items.any? %>
   <% unless within_multitype_list %>
-    <ol class="gem-c-highlight-boxes" <%= "data-module=track-click" if highlight_boxes_helper.data_tracking? %>>
+    <ol class="gem-c-highlight-boxes" <%= "data-module=gem-track-click" if highlight_boxes_helper.data_tracking? %>>
   <% end %>
     <% items.each do |content_item| %>
       <li class="gem-c-highlight-boxes__item-wrapper <%= half_width_class %>">

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

@@ -9,7 +9,7 @@
 %>
 <% if card_helper.href || card_helper.extra_links.any? %>
   <div class="<%= classes %> <%= brand_helper.brand_class %>"
-    <%= "data-module=track-click" if card_helper.is_tracking? %>
+    <%= "data-module=gem-track-click" if card_helper.is_tracking? %>
     <%= "lang=#{card_helper.lang}" if card_helper.lang %>>
     <div class="gem-c-image-card__text-wrapper">
       <div class="gem-c-image-card__header-and-context-wrapper">

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

@@ -1,12 +1,12 @@
 <%
-  id ||= nil
+  aria_label ||= nil
   extra_spacing ||= nil
+  id ||= nil
+  items ||= []
   list_type ||= "unordered"
   visible_counters ||= nil
-  items ||= []
-  aria_label ||= nil
 
-  classes = %w(gem-c-list govuk-list)
+  classes = %w[gem-c-list govuk-list]
   classes << "govuk-list--bullet" if visible_counters && list_type === "unordered"
   classes << "govuk-list--number" if visible_counters && list_type === "number"
   classes << "govuk-list--spaced" if extra_spacing
@@ -20,7 +20,7 @@
 <% if items.any? %>
   <%= content_tag list_tag, class: classes, id: id, "aria-label": aria_label do %>
     <% items.each do |item| %>
-      <li><%= sanitize(item) %></li>
+      <li><%= raw(item) %></li>
     <% end %>
   <% end %>
 <% end %>

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

@@ -16,7 +16,7 @@
   classes << "gem-c-metadata--inverse" if inverse
 %>
 <%= content_tag :div, class: classes, data: { module: "gem-toggle" } do %>
-  <dl data-module="track-click">
+  <dl data-module="gem-track-click">
     <% if from.any? %>
       <dt class="gem-c-metadata__term"><%= t("govuk_component.metadata.from", default: "From") %>:</dt>
       <dd class="gem-c-metadata__definition">

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

@@ -26,7 +26,7 @@
 %>
 <<%= wrapping_element %>
   class="<%= wrapper_classes.join(" ") %>"
-  <%= "data-module=track-click" if organisation[:data_attributes] %>
+  <%= "data-module=gem-track-click" if organisation[:data_attributes] %>
 >
   <% if organisation[:url] %>
     <%= link_to organisation[:url],

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

@@ -4,7 +4,7 @@
   role="navigation"
   aria-label="<%= t("govuk_component.previous_and_next_navigation.pagination", default: "Pagination") %>"
 >
-  <ul class="gem-c-pagination__list" data-module="track-click">
+  <ul class="gem-c-pagination__list" data-module="gem-track-click">
     <% if local_assigns.include?(:previous_page) %>
       <li class="gem-c-pagination__item gem-c-pagination__item--previous">
         <a href="<%= previous_page[:url] %>"

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

@@ -1,4 +1,5 @@
 <%
+  shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   id ||= nil
   id_prefix ||= "radio-#{SecureRandom.hex(4)}"
   items ||= []
@@ -54,7 +55,7 @@
         <% end %>
       <% else %>
         <%= tag.legend class: legend_classes do %>
-          <%= tag.h2 heading, class: "govuk-fieldset__heading" %>
+          <%= content_tag(shared_helper.get_heading_level, heading, class: "govuk-fieldset__heading") %>
         <% end %>
       <% end %>
     <% end %>

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

@@ -0,0 +1,45 @@
+<%
+  items ||= []
+  input_name ||= "ordering"
+  data_attributes ||= {}
+  data_attributes[:module] = "reorderable-list"
+%>
+
+<%= tag.ol class: "gem-c-reorderable-list", data: data_attributes do %>
+  <% items.each_with_index do |item, index| %>
+    <%= tag.li class: "gem-c-reorderable-list__item" do %>
+      <%= tag.div class: "gem-c-reorderable-list__wrapper" do %>
+        <%= tag.div class: "gem-c-reorderable-list__content" do %>
+          <%= tag.p item[:title], class: "gem-c-reorderable-list__title" %>
+          <%= tag.p(item[:description], class: "gem-c-reorderable-list__description") if item[:description].present? %>
+        <% end %>
+        <%= tag.div class: "gem-c-reorderable-list__actions" do %>
+          <% label_text = capture do %>
+            Position<span class='govuk-visually-hidden'> for <%= item[:title] %></span>
+          <% end %>
+          <%= render "govuk_publishing_components/components/input", {
+            label: { text: label_text },
+            name: "#{input_name}[#{item[:id]}]",
+            type: "number",
+            value: index + 1,
+            width: 2
+          } %>
+          <%= render "govuk_publishing_components/components/button", {
+            text: "Up",
+            type: "button",
+            aria_label: "Move \"#{item[:title]}\" up",
+            classes: "js-reorderable-list-up",
+            secondary_solid: true
+          } %>
+          <%= render "govuk_publishing_components/components/button", {
+            text: "Down",
+            type: "button",
+            aria_label: "Move \"#{item[:title]}\" down",
+            classes: "js-reorderable-list-down",
+            secondary_solid: true
+          } %>
+        <% end %>
+      <% end %>
+    <% end %>
+  <% end %>
+<% end %>

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

@@ -1,11 +1,19 @@
 <%
-  size ||= ""
-  no_border ||= false
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
-  classes = %w(gem-c-search)
+
+  aria_controls ||= nil
+  button_text ||= t("components.search_box.search_button")
+  id ||= "search-main-" + SecureRandom.hex(4)
+  label_text ||= t("components.search_box.label")
+  name ||= "q"
+  no_border ||= false
+  size ||= ""
+  value ||= ""
+
+  classes = %w[gem-c-search]
   classes << (shared_helper.get_margin_top)
   classes << (shared_helper.get_margin_bottom) if local_assigns[:margin_bottom]
-  classes << "gem-c-search--large" if size == 'large'
+  classes << "gem-c-search--large" if size == "large"
   classes << "gem-c-search--no-border" if no_border
   if local_assigns[:on_govuk_blue].eql?(true)
     classes << "gem-c-search--on-govuk-blue"
@@ -13,25 +21,28 @@
     classes << "gem-c-search--on-white"
   end
   classes << "gem-c-search--separate-label" if local_assigns.include?(:inline_label)
-
-  value ||= ""
-  id ||= "search-main-" + SecureRandom.hex(4)
-  label_text ||= "Search on GOV.UK"
-  name ||= 'q'
-  aria_controls ||= nil
 %>
 
-<div class="<%= classes.join(' ') %>" data-module="gem-toggle-input-class-on-focus">
+<div class="<%= classes.join(" ") %>" data-module="gem-toggle-input-class-on-focus">
   <label for="<%= id %>" class="gem-c-search__label">
     <%= label_text %>
   </label>
   <div class="gem-c-search__item-wrapper">
-    <input type="search" value="<%= value %>"
-      id="<%= id %>" name="<%= name %>" title="Search"
-      aria-controls="<%= aria_controls %>"
-      class="gem-c-search__item gem-c-search__input js-class-toggle">
+    <%= tag.input(
+      aria: {
+        controls: aria_controls,
+      },
+      class: "gem-c-search__item gem-c-search__input js-class-toggle",
+      id: id,
+      name: name,
+      title: t("components.search_box.input_title"),
+      type: "search",
+      value: value,
+    ) %>
     <div class="gem-c-search__item gem-c-search__submit-wrapper">
-      <button type="submit" class="gem-c-search__submit">Search</button>
+      <button class="gem-c-search__submit" type="submit">
+        <%= button_text %>
+      </button>
     </div>
   </div>
 </div>

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

@@ -14,7 +14,7 @@
   classes << brand_helper.brand_class
 
   data_attributes ||= {}
-  data_attributes[:module] = 'track-click'
+  data_attributes[:module] = 'gem-track-click'
 %>
 <% if links.any? %>
   <%= tag.div(class: classes, data: data_attributes) do %>

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

@@ -19,10 +19,12 @@
     data: {
       module: "show-password",
       disable_form_submit_check: disable_form_submit_check,
-      show: t('components.input.show'),
-      hide: t('components.input.hide'),
-      announce_show: t('components.input.announce_show'),
-      announce_hide: t('components.input.announce_hide')
+      show_text: t('components.show_password.show'),
+      hide_text: t('components.show_password.hide'),
+      show_full_text: t('components.show_password.show_password'),
+      hide_full_text: t('components.show_password.hide_password'),
+      announce_show: t('components.show_password.announce_show'),
+      announce_hide: t('components.show_password.announce_hide')
     } do %>
       <%= render "govuk_publishing_components/components/input", {
         label: label,

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

@@ -28,7 +28,7 @@
     <%= raw JSON.pretty_generate(breadcrumb_presenter.structured_data) %>
   </script>
 
-  <h2 class="<%= classes %>" data-module="track-click">
+  <h2 class="<%= classes %>" data-module="gem-track-click">
     <span class="gem-c-step-nav-header__part-of">Part of</span>
     <% if path %>
       <a href="<%= path %>"

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

@@ -6,7 +6,7 @@
 <% if links.any? %>
   <div 
     class="gem-c-step-nav-related <%= "gem-c-step-nav-related--singular" if links.length == 1 %>" 
-    data-module="track-click">
+    data-module="gem-track-click">
     <h2 class="gem-c-step-nav-related__heading">
       <span class="gem-c-step-nav-related__pretitle"><%= pretitle %></span>
       <% if links.length == 1 && !always_display_as_list %>

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

@@ -27,7 +27,7 @@
     <% end %>
     <ul
       class="gem-c-subscription-links__list<%= ' gem-c-subscription-links__list--small' if local_assigns[:small_form] == true %>"
-      <%= "data-module=track-click" if sl_helper.tracking_is_present? %>
+      <%= "data-module=gem-track-click" if sl_helper.tracking_is_present? %>
     >
       <% if sl_helper.email_signup_link.present? %>
         <li class="gem-c-subscription-links__list-item<%= ' gem-c-subscription-links__list-item--small' if local_assigns[:small_form] == true %>" >

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

@@ -15,32 +15,51 @@
   <%= tag.div class: "gem-c-summary-list #{"govuk-summary-list--no-border" if borderless}", id: id do %>
     <% if title %>
       <%= content_tag(shared_helper.get_heading_level, title, class: "govuk-heading-#{heading_size} gem-c-summary-list__group-title") %>
-      <% if edit.any? || delete.any? %>
+
+      <% if edit.any? %>
+        <% edit_main_link = capture do %>
+          <% edit_section_link_text = edit[:link_text] || t("components.summary_list.edit") %>
+          <%= link_to edit.fetch(:href),
+                    class: "govuk-link",
+                    title: "#{edit_section_link_text} #{title}",
+                    data: edit.fetch(:data_attributes, {}) do %>
+            <%= edit_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if delete.any? %>
+        <% delete_main_link = capture do %>
+          <% delete_section_link_text = delete[:link_text] || t("components.summary_list.delete") %>
+          <%= link_to delete.fetch(:href),
+                    class: "govuk-link gem-link--destructive",
+                    title: "#{delete_section_link_text} #{title}",
+                    data: delete.fetch(:data_attributes, {}) do %>
+            <%= delete_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if edit_main_link && delete_main_link %>
         <%= tag.ul class: "govuk-summary-list__actions-list gem-c-summary-list__group-actions-list" do %>
           <%- if edit.any? %>
-            <% edit_section_link_text = edit[:link_text] || t("components.summary_list.edit") %>
             <%= tag.li class: "govuk-summary-list__actions-list-item" do -%>
-              <%= link_to edit.fetch(:href),
-                        class: "govuk-link",
-                        title: "#{edit_section_link_text} #{title}",
-                        data: edit.fetch(:data_attributes, {}) do %>
-                <%= edit_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
-              <% end %>
+              <%= edit_main_link %>
             <% end %>
           <% end %>
           <% if delete.any? %>
-            <% delete_section_link_text = delete[:link_text] || t("components.summary_list.delete") %>
             <%= tag.li class: "govuk-summary-list__actions-list-item" do -%>
-              <%= link_to delete.fetch(:href),
-                        class: "govuk-link gem-link--destructive",
-                        title: "#{delete_section_link_text} #{title}",
-                        data: delete.fetch(:data_attributes, {}) do %>
-                <%= delete_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
-              <% end %>
+              <%= delete_main_link %>
             <% end %>
           <% end %>
         <% end %>
+      <% else %>
+        <%= tag.div class: "govuk-summary-list__actions-list gem-c-summary-list__group-actions-list" do %>
+          <%= edit_main_link %>
+          <%= delete_main_link %>
+        <% end %>
       <% end %>
+
     <% end %>
 
     <% if items.any? %>
@@ -51,34 +70,52 @@
             <%= tag.dt item[:field], class: "govuk-summary-list__key" %>
             <%= tag.dd item[:value], class: "govuk-summary-list__value" %>
 
-            <% if item.fetch(:edit, {}).any? || item.fetch(:delete, {}).any? %>
+            <% if item.fetch(:edit, {}).any? %>
+              <% edit_link = capture do %>
+                <% edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit") %>
+                <%= link_to item[:edit].fetch(:href),
+                            class: "govuk-link",
+                            title: "#{edit_link_text} #{item[:field]}",
+                            data: item[:edit].fetch(:data_attributes, {}) do %>
+                  <%= edit_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if item.fetch(:delete, {}).any? %>
+              <% delete_link = capture do %>
+                <% delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete") %>
+                <%= link_to item[:delete].fetch(:href),
+                            class: "govuk-link gem-link--destructive",
+                            title: "#{delete_link_text} #{item[:field]}",
+                            data: item[:delete].fetch(:data_attributes, {}) do %>
+                  <%= delete_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if edit_link && delete_link %>
               <%= tag.dd class: "govuk-summary-list__actions" do %>
                 <%= tag.ul class: "govuk-summary-list__actions-list" do %>
                   <% if item.fetch(:edit, {}).any? %>
                     <%= tag.li class: "govuk-summary-list__actions-list-item" do %>
-                      <% edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit") %>
-                      <%= link_to item[:edit].fetch(:href),
-                                  class: "govuk-link",
-                                  title: "#{edit_link_text} #{item[:field]}",
-                                  data: item[:edit].fetch(:data_attributes, {}) do %>
-                        <%= edit_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
-                      <% end %>
+                      <%= edit_link %>
                     <% end %>
                   <% end %>
                   <% if item.fetch(:delete, {}).any? %>
                     <%= tag.li class: "govuk-summary-list__actions-list-item" do %>
-                      <% delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete") %>
-                      <%= link_to item[:delete].fetch(:href),
-                                  class: "govuk-link gem-link--destructive",
-                                  title: "#{delete_link_text} #{item[:field]}",
-                                  data: item[:delete].fetch(:data_attributes, {}) do %>
-                        <%= delete_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
-                      <% end %>
+                      <%= delete_link %>
                     <% end %>
                   <% end %>
                 <% end %>
               <% end %>
+            <% else %>
+              <%= tag.dd class: "govuk-summary-list__actions" do %>
+                <%= edit_link %>
+                <%= delete_link %>
+              <% end %>
             <% end %>
+
           <% end %>
         <% end %>
       <% end %>