govuk_publishing_components 28.9.1 → 28.9.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6c3bd6215882051b9c863a3b252cdb8163820babf43ddbc6a8fa833c0da5f5b1
-  data.tar.gz: 552d3420a3ccf2264bfd6a9a8304c6d24d8eb2a24306daab0b1b2d3998df7309
+  metadata.gz: c6a4c2646d8ee1669ae9211306d03382e424c905c6de355bb5f81b5251da6e10
+  data.tar.gz: 13453d8a1226005ff9535eb9dce3927f450ce1a6ec6acf6daf8170ad9ffeb2e0
 SHA512:
-  metadata.gz: 2979878f87bb5ad5dd9daf50a81aa7fe4baeab0569d2b4d686281fd1f87aa3bea056c247784449b12a557fde3e2cf03eea7568445d4522601111a2a1b9528566
-  data.tar.gz: 24ee9afa94eee26d28896e9dc4d4dff843020ad9f1756b449404a35ae71ff2a881c666933e4e10b2a8c0ca32faa14dfddc2880605f672c5c60526e4df03e4588
+  metadata.gz: 8fcda8c161715befc29844b659249668e5d2ba375f3d398f994e1e3c2348a78635516704e655f95df96aa21a9438d1079cfdb9977944020a3cfe9e7c96611a05
+  data.tar.gz: 7d838cc5bd1295ba3faeab424a0a6d10a5af087601e90d859eaee2a0ecc0222ee41330672800739308d34f7bb662a341f470cb8f74915cc7eb6a328555360a0a

data/app/assets/javascripts/govuk_publishing_components/analytics/cross-domain-tracking.js

@@ -0,0 +1,55 @@
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {};
+
+(function (Modules) {
+  function CrossDomainTracking ($module) {
+    this.$module = $module
+    Modules.crossDomainLinkedTrackers = Modules.crossDomainLinkedTrackers || []
+  }
+
+  CrossDomainTracking.prototype.init = function () {
+    if (this.isTrackable(this.$module)) {
+      this.addLinkedTrackerDomain(this.$module)
+    } else {
+      this.findTrackableElements()
+    }
+  }
+
+  CrossDomainTracking.prototype.isTrackable = function (element) {
+    if (element.getAttribute('href') && element.getAttribute('data-tracking-code') && element.getAttribute('data-tracking-name')) {
+      return true
+    }
+  }
+
+  CrossDomainTracking.prototype.findTrackableElements = function () {
+    var links = this.$module.querySelectorAll('a')
+    for (var i = 0; i < links.length; i++) {
+      if (this.isTrackable(links[i])) {
+        this.addLinkedTrackerDomain(links[i])
+      }
+    }
+  }
+
+  CrossDomainTracking.prototype.addLinkedTrackerDomain = function (element) {
+    var name = element.getAttribute('data-tracking-name')
+    var code = element.getAttribute('data-tracking-code')
+    var trackEvent = (element.getAttribute('data-tracking-track-event') === 'true')
+
+    if (window.GOVUK.analytics !== 'undefined') {
+      if (Modules.crossDomainLinkedTrackers.indexOf(name) === -1) {
+        var hostname = element.hostname
+        window.GOVUK.analytics.addLinkedTrackerDomain(code, name, hostname)
+        Modules.crossDomainLinkedTrackers.push(name)
+      }
+
+      if (trackEvent) {
+        element.addEventListener('click', function (e) {
+          var target = e.target
+          window.GOVUK.analytics.trackEvent('External Link Clicked', target.textContent, { trackerName: name })
+        })
+      }
+    }
+  }
+
+  Modules.CrossDomainTracking = CrossDomainTracking
+})(window.GOVUK.Modules)

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

@@ -1,3 +1,5 @@
+// these scripts are specifically ordered
+
 //= require govuk_publishing_components/lib/cookie-functions
 //= require govuk_publishing_components/lib/extend-object
 //= require ./analytics/pii
@@ -18,3 +20,4 @@
 //= require ./analytics/explicit-cross-domain-links
 //= require ./analytics/track-click
 //= require ./analytics/track-select-change
+//= require ./analytics/cross-domain-tracking

data/app/assets/stylesheets/govuk_publishing_components/components/_previous-and-next-navigation.scss

@@ -9,7 +9,7 @@
 }
 
 .gem-c-pagination__item {
-  @include govuk-font($size: 16, $line-height: (20 / 16));
+  @include govuk-font($size: 19);
   list-style: none;
 
   &:first-child {

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.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 {
   .help-notice {
-    $icon-size: 34px;
+    $icon-size: 35px;
     $line-height-mobile: 20px;
     $line-height-tablet: 25px;
 

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

@@ -4,6 +4,7 @@
   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
@@ -16,8 +17,9 @@
       <%= content_tag(shared_helper.get_heading_level, class: "gem-c-cards__heading govuk-heading-m") do %>
         <%= heading %>
       <% end %>
-    <% end %>
-    <%= content_tag 'ul', class: ul_classes do %>
+    <% end %>    
+
+    <%= content_tag('ul', class: ul_classes) do %>
       <%
         items.each do |item|
         link = item[:link]
@@ -25,33 +27,15 @@
         if !link[:path].present?
           raise ArgumentError, "The cards component requires a href for all the links"
         end
-
-        data_attributes = nil
-        attributes = link[:tracking_attributes].presence
-
-        if attributes && attributes[:track_category] && attributes[:track_action]
-          data_attributes = {
-            track_action: attributes[:track_action],
-            track_category: attributes[:track_category],
-            track_dimension_index: attributes[:track_dimension_index],
-            track_dimension: link[:text],
-            track_label: link[:path],
-          }
-        end
-
-        link = capture do
-           link_to(link[:text], link[:path], {
-             class: "govuk-link gem-c-cards__link",
-             data: data_attributes,
-           })
-        end
       %>
-
         <li class="gem-c-cards__list-item">
           <%= content_tag("h#{sub_heading_level}", class: "gem-c-cards__sub-heading govuk-heading-s") do %>
-            <%= link %>
+            <%= 
+              link_to link[:text], link[:path], 
+              class: "govuk-link gem-c-cards__link", 
+              data: link[:data_attributes] 
+            %>
           <% end %>
-
           <% if item[:description] %>
             <p class="govuk-body gem-c-cards__description"><%= item[:description] %></p>
           <% end %>

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

@@ -7,6 +7,7 @@
   describedby ||= nil
   enterkeyhint ||= nil
   id ||= "input-#{SecureRandom.hex(4)}"
+  spellcheck ||= "false"
   type ||= "text"
   value ||= nil
   inputmode ||= nil
@@ -63,6 +64,7 @@
     inputmode = "numeric"
     pattern = "[0-9]*"
   end
+
 %>
 
 <%= content_tag :div, class: form_group_css_classes do %>
@@ -114,6 +116,7 @@
     name: name,
     pattern: pattern,
     readonly: readonly,
+    spellcheck: spellcheck,
     tabindex: tabindex,
     type: type,
     value: value

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

@@ -9,7 +9,6 @@
   classes << "gem-c-lead-paragraph--inverse" if inverse
   classes << custom_margin_bottom_class if local_assigns[:margin_bottom]
 %>
-
 <% if text.present? %>
   <%= content_tag :p, text, class: classes %>
 <% end %>

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

@@ -32,12 +32,10 @@
 
       <% if delete.any? %>
         <% delete_main_link = capture do %>
-          <%
-            delete_section_link_text = delete[:link_text] || t("components.summary_list.delete")
-          %>
+          <% delete_section_link_text = delete[:link_text] || t("components.summary_list.delete") %>
           <%= link_to delete.fetch(:href),
-                    class: "govuk-link gem-link--destructive",
-                    data: delete.fetch(:data_attributes, {}) do %>
+                class: "govuk-link gem-link--destructive",
+                data: delete.fetch(:data_attributes, {}) do %>
             <%= delete_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" unless delete[:link_text_no_enhance] -%>
           <% end %>
         <% end %>
@@ -62,39 +60,46 @@
           <%= delete_main_link %>
         <% end %>
       <% end %>
-
     <% end %>
 
+    <% any_body_actions = items.detect { |item| item.has_key?("edit") || item.has_key?("delete") } %>
     <% if items.any? %>
       <%= tag.dl class: "govuk-summary-list" do %>
         <% items.each do |item| %>
-          <%= tag.div class: "govuk-summary-list__row" do %>
+          <%
+            item_body_actions = (item.fetch(:edit, {}).any? || item.fetch(:delete, {}).any?)
+
+            if any_body_actions.present? && !item_body_actions.present?
+              classes = "govuk-summary-list__row govuk-summary-list__row--no-actions"
+            else
+              classes = "govuk-summary-list__row"
+            end
+          %>
+          <%= tag.div class: classes do %>
 
             <%= tag.dt item[:field], class: "govuk-summary-list__key" %>
             <%= tag.dd item[:value], class: "govuk-summary-list__value" %>
 
             <% if item.fetch(:edit, {}).any? %>
               <% edit_link = capture do %>
-                <%
-                  edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit")
-                %>
+                <% edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit") %>
                 <%= link_to item[:edit].fetch(:href),
-                            class: "govuk-link",
-                            data: item[:edit].fetch(:data_attributes, {}) do %>
-                  <%= edit_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" unless item[:edit][:link_text_no_enhance] -%>
+                  class: "govuk-link",
+                  data: item[:edit].fetch(:data_attributes, {}) do %>
+                  <%= edit_link_text %>
+                  <%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" unless item[:edit][:link_text_no_enhance] -%>
                 <% end %>
               <% end %>
             <% end %>
 
             <% if item.fetch(:delete, {}).any? %>
               <% delete_link = capture do %>
-                <%
-                  delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete")
-                %>
+                <% delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete") %>
                 <%= link_to item[:delete].fetch(:href),
-                            class: "govuk-link gem-link--destructive",
-                            data: item[:delete].fetch(:data_attributes, {}) do %>
-                  <%= delete_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" unless item[:delete][:link_text_no_enhance] -%>
+                      class: "govuk-link gem-link--destructive",
+                      data: item[:delete].fetch(:data_attributes, {}) do %>
+                  <%= delete_link_text %>
+                  <%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" unless item[:delete][:link_text_no_enhance] -%>
                 <% end %>
               <% end %>
             <% end %>
@@ -115,17 +120,17 @@
                 <% end %>
               <% end %>
             <% else %>
+            <% if edit_link || delete_link %>
               <%= tag.dd class: "govuk-summary-list__actions" do %>
                 <%= edit_link %>
                 <%= delete_link %>
               <% end %>
             <% end %>
-
           <% end %>
         <% end %>
       <% end %>
     <% end %>
-
-    <%= tag.div block, class: "gem-c-summary__block" if block %>
   <% end %>
+    <%= tag.div block, class: "gem-c-summary__block" if block %>
+    <% end %>
 <% end %>

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

@@ -86,7 +86,7 @@ examples:
         file_size: 20000
         owning_document_content_id: 456_abc
         attachment_id: 123
-        alternative_format_contact_email: alternative.formats@education.gov.uk
+        alternative_format_contact_email: govuk_publishing_components@example.com
   with_data_attributes:
     data:
       attachment:

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

@@ -116,24 +116,30 @@ examples:
             text: Benefits
             path: http://www.gov.uk
           description: Includes eligibility, appeals, tax credits and Universal Credit
-  with_tracking_attributes:
+  with_data_attributes:
     description: |
-      Tracking can be enabled on the cards component by passing a minimum of data_track_category and data_track_action. Other tracking attributes are optional. Note: tracking events do not currently fire within the component guide.
+      Data attributes can be passed to individual links within the component as shown.
     data:
       items:
         - link:
             text: Benefits
             path: http://www.gov.uk
-            tracking_attributes:
-              track_action: track_action
+            data_attributes:
               track_category: homepageClicked
+              track_action: track-action
+              track_label: track-label
+              track_dimension: track-dimension
               track_dimension_index: 29
+              track_value: 9
           description: Includes eligibility, appeals, tax credits and Universal Credit
         - link:
             text: Births, deaths, marriages and care
             path: http://www.gov.uk
-            tracking_attributes:
-              track_action: track_action
+            data_attributes:
               track_category: homepageClicked
+              track_action: track-action
+              track_label: track-label
+              track_dimension: track-dimension
               track_dimension_index: 29
+              track_value: 9
           description: Parenting, civil partnerships, divorce and Lasting Power of Attorney

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

@@ -24,12 +24,19 @@ examples:
         text: "What is your name?"
       name: "name"
   specific_input_type:
-    description: By default the input will be type="text". This parameter accepts an alternative, e.g. "search" or "email". No validation is done on this input.
+    description: By default the input will be `type="text"`. This parameter accepts an alternative, e.g. `search` or `email`. `spellcheck="false"` is the default this can be changed by passing a `true` value. Consider adding `autocomplete`. No validation is done on this input.
     data:
       label:
         text: "What is your email address?"
       name: "address"
       type: "email"
+  with_autocomplete:
+    data:
+      label:
+        text: "Automatically complete the field with a user's email address (in supporting browsers)"
+      name: "name"
+      type: "email"
+      autocomplete: "email"
   numeric_input:
     description: If input is set to `type="number"` we set the component up as described in the [GOV.UK Design System guidance](https://design-system.service.gov.uk/components/text-input/#numbers) adding `inputmode` and `pattern`. These values can be overridden if necessary.
     data:
@@ -46,11 +53,11 @@ examples:
       id: "hasid"
   with_aria_attributes:
     description: |
-      The component accepts two possible aria attributes: aria-describedby and aria-controls.
+      The component accepts two possible aria attributes: `aria-describedby` and `aria-controls`.
 
-      [aria-describedby](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute) is used to indicate the ID of the element that describes the input. This will be overridden in the event of an error, where the error will be used for the describedby attribute value. This example uses the ID of the main container for demonstration purposes as there aren't any useful elements with IDs in the component guide. In real use this would be passed the ID of an element that correctly described the input.
+      [`aria-describedby`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute) is used to indicate the `ID` of the element that describes the input. This will be overridden in the event of an error, where the error will be used for the `describedby` attribute value. This example uses the `ID` of the main container for demonstration purposes as there aren't any useful elements with `IDs` in the component guide. In real use this would be passed the `ID` of an element that correctly described the input.
 
-      aria-controls allows the addition of an aria-controls attribute, for use in places like the finders where the page is updated dynamically after value changes to the input.
+      `aria-controls` allows the addition of an `aria-controls` attribute, for use in places like the finders where the page is updated dynamically after value changes to the input.
     data:
       label:
         text: "This is an example only and may not work with a screen reader"
@@ -104,13 +111,6 @@ examples:
       name: "name"
       value: "You can't type more"
       maxlength: 10
-  with_autocomplete:
-    data:
-      label:
-        text: "Automatically complete the field with a user's email address (in supporting browsers)"
-      name: "name"
-      type: "email"
-      autocomplete: "email"
   with_custom_width:
     data:
       label:
@@ -119,17 +119,20 @@ examples:
       name: "name"
       width: 10
   with_search_icon:
+    description: |
+        Adds a search icon, [spellcheck](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck) can also be added to indicate that the element should be, if possible, checked for spelling errors.
     data:
       label:
         text: "Search the internet"
       name: "search-box"
       type: "search"
       search_icon: true
+      spellcheck: true
   with_label_as_heading:
     description: |
-      Wraps the label in a heading tag. Valid options are 1 to 6. To adjust the size of the label/heading, use the `heading_size` option. Valid options are 's', 'm', 'l' and 'xl'.
+      Wraps the label in a heading tag. Valid options are `1` to `6`. To adjust the size of the label/heading, use the `heading_size` option. Valid options are `s`, `m`, `l` and `xl`.
 
-      Based on the [heading/label pattern](https://design-system.service.gov.uk/patterns/question-pages/) in the Design System.
+      Based on the [heading/label pattern](https://design-system.service.gov.uk/patterns/question-pages/) in the GOV.UK Design System.
     data:
       label:
         text: "This is a heading 1 and a label"

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

@@ -66,7 +66,7 @@ examples:
     description: |
       Sets the margin on the bottom of the list element.
 
-      The component accepts a number for margin bottom from 0 to 9 (0px to 60px) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a 20px margin.
+      The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a `20px` margin.
     data:
       margin_bottom: 9
       <<: *default-example-data

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

@@ -1,6 +1,6 @@
 name: Summary list
 description: Use the summary list to summarise information, for example, a user’s responses at the end of a form.
-body:  This component extends the [Summary list component in the Design System](https://design-system.service.gov.uk/components/summary-list/) allowing the rendering of multiple groups of lists, and actions at the group level.
+body:  This component extends the [Summary list component in the GOV.UK Design System](https://design-system.service.gov.uk/components/summary-list/) allowing the rendering of multiple groups of lists, and actions at the group level.
 accessibility_criteria: |
   Action links in the component must:
 
@@ -102,18 +102,13 @@ examples:
       heading_level: 2
       heading_size: l
 
-  with_edit_on_individual_items:
+  with_edit_on_some_individual_items:
     description: For all links shown in the component, see the <a href="/component-guide/summary_list/with_customised_links">with customised links example</a> for guidance.
     data:
       title: "Title, summary and body"
       items:
       - field: "Title"
         value: "Ethical standards for public service providers"
-        edit:
-          href: "edit-title"
-          text: "Edit"
-          data_attributes:
-            gtm: "edit-title"
       - field: "Summary"
         value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
         edit:

data/lib/govuk_publishing_components/presenters/attachment.rb

@@ -1,15 +1,11 @@
 module GovukPublishingComponents
   module Presenters
     class Attachment
-      # DfE, DWP, DHSC, HMRC, DVSA and PHE are taking part in a pilot to use a form
+      # Various departments are taking part in a pilot to use a form
       # rather than direct email for users to request accessible formats. When the pilot
       # scheme is rolled out further this can be removed.
-      EMAILS_IN_ACCESSIBLE_FORMAT_REQUEST_PILOT = %w[alternative.formats@education.gov.uk
-                                                     accessible.formats@dwp.gov.uk
-                                                     publications@dhsc.gov.uk
-                                                     different.format@hmrc.gov.uk
-                                                     gov.uk.publishing@dvsa.gov.uk
-                                                     publications@phe.gov.uk].freeze
+      # Currently the pilot is paused so there are no participants.
+      EMAILS_IN_ACCESSIBLE_FORMAT_REQUEST_PILOT = %w[govuk_publishing_components@example.com].freeze
 
       delegate :opendocument?, :document?, :spreadsheet?, to: :content_type
 

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "28.9.1".freeze
+  VERSION = "28.9.2".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 28.9.1
+  version: 28.9.2
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2022-03-07 00:00:00.000000000 Z
+date: 2022-03-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govuk_app_config
@@ -170,14 +170,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '2'
+        version: '3'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '2'
+        version: '3'
 - !ruby/object:Gem::Dependency
   name: i18n-coverage
   requirement: !ruby/object:Gem::Requirement
@@ -437,6 +437,7 @@ files:
 - app/assets/javascripts/govuk_publishing_components/analytics/analytics.js
 - app/assets/javascripts/govuk_publishing_components/analytics/auto-scroll-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics/auto-track-event.js
+- app/assets/javascripts/govuk_publishing_components/analytics/cross-domain-tracking.js
 - app/assets/javascripts/govuk_publishing_components/analytics/custom-dimensions.js
 - app/assets/javascripts/govuk_publishing_components/analytics/download-link-tracker.js
 - app/assets/javascripts/govuk_publishing_components/analytics/ecommerce.js
@@ -1998,7 +1999,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.3.8
+rubygems_version: 3.3.9
 signing_key: 
 specification_version: 4
 summary: A gem to document components in GOV.UK frontend applications