govuk_publishing_components 16.7.0 → 16.8.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 05db8bb85d36f1e4dee27a17188474dc6b62ee9bb0bd9de8136bae957bab969a
-  data.tar.gz: 92bdbba459fdbde8eab6e6a0dcdfeca551d41986e7054165cd9f72da78f954d0
+  metadata.gz: 1b81e308990c82671b9449aa6b5631f6a1b6b6ed8b7b7e9cd2d44480f47d9d3b
+  data.tar.gz: 3c5707c0af3c161cd38273c81c8c10e1903e77a6c892c4f6bb6b8d0e4d9ad459
 SHA512:
-  metadata.gz: b5fcf822378d70648ed342954d5eb023c1eeefe62d6f1a8900579e29adb501eadb2897e16c8eaa72d2a151bcda1346fa0776639fe38d33eb16b83c89100fe476
-  data.tar.gz: 0a23caa4a7a4610548df7251dde6182c590221b2094d666f4b606a5d94f56c6afe8d85fbd7e9433d3cc099db494a5e758ce67931a52fa6d1c11973787baac6db
+  metadata.gz: 8a393e4807db795ad0c9afe3c6d726e928d351a296a5918f92234393d0c5114d94432da3eac59a722ef80b2813b5a070bcd0ece4952260b543337ecf57c7e045
+  data.tar.gz: 86bf57bf0feb0cf2eae7630be1d23da91c6aa37307d0d4bd4bf0f9fa8f293a258f0d33dfde08b6d64626f4435999460d876c7da6043e018885cd97f35bd14021

data/app/assets/javascripts/govuk_publishing_components/components/cookie-banner.js

@@ -0,0 +1,47 @@
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {};
+
+(function (Modules) {
+  function CookieBanner () { }
+
+  CookieBanner.prototype.start = function ($module) {
+    this.$module = $module[0]
+
+    this.$module.hideCookieMessage = this.hideCookieMessage.bind(this)
+    this.$hideLink = this.$module.querySelector('a[data-hide-cookie-banner]')
+    if (this.$hideLink) {
+      this.$hideLink.addEventListener('click', this.$module.hideCookieMessage)
+    }
+
+    this.showCookieMessage()
+  }
+
+  CookieBanner.prototype.showCookieMessage = function () {
+    var hasCookieMessage = (this.$module && window.GOVUK.cookie('seen_cookie_message') !== 'true')
+
+    if (hasCookieMessage) {
+      this.$module.style.display = 'block'
+      document.addEventListener('DOMContentLoaded', function (event) {
+        if (window.GOVUK.analytics && typeof window.GOVUK.analytics.trackEvent === 'function') {
+          window.GOVUK.analytics.trackEvent('cookieBanner', 'Cookie banner shown', {
+            value: 1,
+            nonInteraction: true
+          })
+        }
+      })
+    }
+  }
+
+  CookieBanner.prototype.hideCookieMessage = function (event) {
+    if (this.$module) {
+      this.$module.style.display = 'none'
+      window.GOVUK.cookie('seen_cookie_message', 'true', { days: 365 })
+    }
+
+    if (event.target) {
+      event.preventDefault()
+    }
+  }
+
+  Modules.CookieBanner = CookieBanner
+})(window.GOVUK.Modules)

data/app/assets/javascripts/govuk_publishing_components/lib/cookie-functions.js

@@ -0,0 +1,65 @@
+// used by the cookie banner component
+
+(function () {
+  'use strict'
+  var root = this
+  if (typeof root.GOVUK === 'undefined') { root.GOVUK = {} }
+
+  /*
+    Cookie methods
+    ==============
+
+    Usage:
+
+      Setting a cookie:
+      GOVUK.cookie('hobnob', 'tasty', { days: 30 });
+
+      Reading a cookie:
+      GOVUK.cookie('hobnob');
+
+      Deleting a cookie:
+      GOVUK.cookie('hobnob', null);
+  */
+  window.GOVUK.cookie = function (name, value, options) {
+    if (typeof value !== 'undefined') {
+      if (value === false || value === null) {
+        return window.GOVUK.setCookie(name, '', { days: -1 })
+      } else {
+        return window.GOVUK.setCookie(name, value, options)
+      }
+    } else {
+      return window.GOVUK.getCookie(name)
+    }
+  }
+
+  window.GOVUK.setCookie = function (name, value, options) {
+    if (typeof options === 'undefined') {
+      options = {}
+    }
+    var cookieString = name + '=' + value + '; path=/'
+    if (options.days) {
+      var date = new Date()
+      date.setTime(date.getTime() + (options.days * 24 * 60 * 60 * 1000))
+      cookieString = cookieString + '; expires=' + date.toGMTString()
+    }
+    if (document.location.protocol === 'https:') {
+      cookieString = cookieString + '; Secure'
+    }
+    document.cookie = cookieString
+  }
+
+  window.GOVUK.getCookie = function (name) {
+    var nameEQ = name + '='
+    var cookies = document.cookie.split(';')
+    for (var i = 0, len = cookies.length; i < len; i++) {
+      var cookie = cookies[i]
+      while (cookie.charAt(0) === ' ') {
+        cookie = cookie.substring(1, cookie.length)
+      }
+      if (cookie.indexOf(nameEQ) === 0) {
+        return decodeURIComponent(cookie.substring(nameEQ.length))
+      }
+    }
+    return null
+  }
+}).call(this)

data/app/assets/javascripts/govuk_publishing_components/lib/header-navigation.js

@@ -0,0 +1,32 @@
+// used by the header navigation from govuk_template
+
+(function () {
+  'use strict'
+
+  if (document.querySelectorAll && document.addEventListener) {
+    var els = document.querySelectorAll('.js-header-toggle')
+    var i
+    var _i
+    for (i = 0, _i = els.length; i < _i; i++) {
+      els[i].addEventListener('click', function (e) {
+        e.preventDefault()
+        var target = document.getElementById(this.getAttribute('href').substr(1))
+        var targetClass = target.getAttribute('class') || ''
+        var sourceClass = this.getAttribute('class') || ''
+
+        if (targetClass.indexOf('js-visible') !== -1) {
+          target.setAttribute('class', targetClass.replace(/(^|\s)js-visible(\s|$)/, ''))
+        } else {
+          target.setAttribute('class', targetClass + ' js-visible')
+        }
+        if (sourceClass.indexOf('js-visible') !== -1) {
+          this.setAttribute('class', sourceClass.replace(/(^|\s)js-visible(\s|$)/, ''))
+        } else {
+          this.setAttribute('class', sourceClass + ' js-visible')
+        }
+        this.setAttribute('aria-expanded', this.getAttribute('aria-expanded') !== 'true')
+        target.setAttribute('aria-hidden', target.getAttribute('aria-hidden') === 'false')
+      })
+    }
+  }
+}).call(this)

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

@@ -268,7 +268,7 @@ html {
 // scss-lint:disable IdSelector
 #user-satisfaction-survey-container,
 #global-cookie-message {
-  display: none !important;
+  display: none;
 }
 // scss-lint:enable IdSelector
 

data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss

@@ -30,7 +30,9 @@
 @import "components/character-count";
 @import "components/checkboxes";
 @import "components/contents-list";
+@import "components/cookie-banner";
 @import "components/copy-to-clipboard";
+@import "components/date-input";
 @import "components/details";
 @import "components/document-list";
 @import "components/error-alert";

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

@@ -0,0 +1,18 @@
+$govuk-cookie-banner-background: #d5e8f3;
+
+.js-enabled {
+  .gem-c-cookie-banner {
+    display: none; // shown with JS, always on for non-JS
+  }
+}
+
+.gem-c-cookie-banner {
+  @include govuk-font($size: 16);
+  padding: 10px 0;
+  background-color: $govuk-cookie-banner-background;
+}
+
+.gem-c-cookie-banner__message {
+  margin-top: 0;
+  margin-bottom: 0;
+}

data/app/assets/stylesheets/govuk_publishing_components/components/_date-input.scss

@@ -0,0 +1,15 @@
+@import "govuk-frontend/components/date-input/date-input";
+
+// Add spacing between input items on narrow containers when they collapse under each other
+.govuk-date-input {
+  margin-top: - govuk-spacing(2);
+}
+
+.govuk-date-input__item {
+  margin-top: govuk-spacing(2);
+}
+
+// Remove spacing for the last input item to make the most of space when in narrow containers
+.govuk-date-input__item:last-child {
+  margin-right: 0;
+}

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

@@ -0,0 +1,9 @@
+<%
+  id ||= 'global-cookie-message'
+  message ||= capture do %>
+  GOV.UK uses cookies to make the site simpler. <a class="govuk-link" href="https://www.gov.uk/help/cookies" data-module="track-click" data-track-category="cookieBanner" data-track-action="Cookie banner clicked">Find out more about cookies</a> or <a class="govuk-link" href="#" data-hide-cookie-banner="true" data-module="track-click" data-track-category="cookieBanner" data-track-action="Cookie banner hidden">hide this message</a>
+<% end %>
+
+<div id="<%= id %>" class="gem-c-cookie-banner" data-module="cookie-banner">
+  <p class="gem-c-cookie-banner__message govuk-width-container"><%= message %></p>
+</div>

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

@@ -0,0 +1,82 @@
+<%
+  id ||= "input-#{SecureRandom.hex(4)}"
+  name ||= nil
+  items ||= [
+    { :name => "day", :width => 2 },
+    { :name => "month", :width => 2 },
+    { :name => "year", :width => 4 }
+  ]
+
+  legend_text ||= nil
+  hint ||= nil
+  error_message ||= nil
+  describedby ||= nil
+
+  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 error_message
+
+  hint_id = "hint-#{SecureRandom.hex(4)}"
+  error_id = "error-#{SecureRandom.hex(4)}"
+
+  aria_described_by ||= nil
+  if hint || error_message || describedby
+    aria_described_by = []
+    aria_described_by << hint_id if hint
+    aria_described_by << error_id if error_message
+    aria_described_by << describedby if describedby
+    aria_described_by = aria_described_by.join(" ")
+  end
+
+%>
+
+<%= content_tag :div, class: form_group_css_classes do %>
+  <% fieldset_content = capture do %>
+    <% if hint %>
+      <%= render "govuk_publishing_components/components/hint", {
+        id: hint_id,
+        text: hint,
+        margin_bottom: 2
+      } %>
+    <% end %>
+
+    <% if error_message %>
+      <%= render "govuk_publishing_components/components/error_message", {
+        id:  error_id,
+        text: error_message
+      } %>
+    <% end %>
+
+    <%= tag.div class: css_classes, id: id do %>
+      <% items.each do |item| %>
+        <%= tag.div class: "govuk-date-input__item" do %>
+          <%= render "govuk_publishing_components/components/input", {
+            label: {
+              text: item[:label] || item[:name].capitalize
+            },
+            grouped: true,
+            has_error: error_message,
+            name: name ? (name + "[" + item[:name] + "]") : item[:name],
+            value: item[:value],
+            width: item[:width],
+            id: item[:id],
+            type: "number",
+            data: item[:data],
+            autocomplete: item[:autocomplete]
+          } %>
+        <% end %>
+      <% end %>
+    <% end %>
+  <% end %>
+
+  <% if legend_text %>
+    <%= render "govuk_publishing_components/components/fieldset", {
+      describedby: aria_described_by,
+      legend_text: legend_text,
+      text: fieldset_content,
+      role: "group"
+    } %>
+  <% else %>
+    <%= fieldset_content %>
+  <% end %>
+<% end %>

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

@@ -1,7 +1,9 @@
 <% text = text || yield %>
-<fieldset class="gem-c-fieldset govuk-fieldset">
-  <legend class="govuk-fieldset__legend">
+<% describedby ||= nil %>
+<% role ||= nil %>
+<%= tag.fieldset class: "gem-c-fieldset govuk-fieldset", aria: { describedby: describedby }, role: role do %>
+  <%= tag.legend class: "govuk-fieldset__legend" do %>
     <%= legend_text %>
-  </legend>
+  <% end %>
   <%= text %>
-</fieldset>
+<% end %>

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

@@ -11,12 +11,13 @@
   hint ||= nil
   error_message ||= nil
   error_items ||= nil
+  grouped ||= nil
   autofocus ||= nil
   tabindex ||= nil
   readonly ||= nil
   maxlength ||= nil
   width ||= nil
-  has_error = error_message || error_items&.any?
+  has_error ||= error_message || error_items&.any?
   hint_id = "hint-#{SecureRandom.hex(4)}"
   error_id = "error-#{SecureRandom.hex(4)}"
 
@@ -24,13 +25,13 @@
   css_classes << "govuk-input--error" if has_error
   css_classes << "govuk-input--width-#{width}" if [2, 3, 4, 5, 10, 20, 30].include?(width)
   form_group_css_classes = %w(govuk-form-group)
-  form_group_css_classes << "govuk-form-group--error" if has_error
+  form_group_css_classes << "govuk-form-group--error" if has_error && !grouped
 
   aria_described_by ||= nil
   if hint || has_error || describedby
     aria_described_by = []
     aria_described_by << hint_id if hint
-    aria_described_by << error_id if has_error
+    aria_described_by << error_id if has_error && !grouped
     aria_described_by << describedby if describedby
     aria_described_by = aria_described_by.join(" ")
   end

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

@@ -0,0 +1,19 @@
+name: Cookie banner
+description: Help users manage their personal data by telling them when you store cookies on their device.
+body: |
+  Setting `data-hide-cookie-banner="true"` on any link inside the banner will overwrite the default action and when clicked will dismiss the cookie banner for a period of 365 days (approx. 1 year).
+accessibility_criteria: |
+  Text in the cookie banner must be clear and unambiguous and should provide a way to dismiss the message.
+
+  Links in the component must:
+
+  - accept focus
+  - be focusable with a keyboard
+  - indicate when they have focus
+examples:
+  default:
+    data: {}
+  custom_message:
+    data:
+      id: custom-message
+      message: GOV.UK uses cookies to make the site simpler. <a class="govuk-link" href="https://www.gov.uk/help/cookies">Find out more about cookies</a>

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

@@ -0,0 +1,57 @@
+name: Form date input
+description: Use the date input component to help users enter a memorable date or one they can easily look up.
+accessibility_criteria: |
+  Inputs in the component must:
+
+  * accept focus
+  * be focusable with a keyboard
+  * be usable with a keyboard
+  * be usable with touch
+  * indicate when they have focus
+  * be recognisable as form input elements
+  * have correctly associated labels
+  * be of the appropriate type for their use, in this case 'number'
+
+  Labels use the [label component](/component-guide/label).
+
+  Avoid using autofocus and tabindex unless you have user research to support this behaviour.
+govuk_frontend_components:
+  - date-input
+examples:
+  default:
+    data: {}
+  with_name:
+    description: |
+      Settting a name at the component level helps generating the name for each individual input within the
+      component as follows: `custom-name[day]`, `custom-name[month]`, `custom-name[year]`
+    data:
+      name: "dob"
+  with_legend:
+    data:
+      legend_text: "What is your date of birth?"
+  with_hint:
+    data:
+      legend_text: "What is your date of birth?"
+      hint: "For example, 31 3 1980"
+  with_error:
+    data:
+      legend_text: "What is your date of birth?"
+      hint: "For example, 31 3 1980"
+      error_message: "Error message goes here"
+  with_custom_items:
+    data:
+      legend_text: "Beth yw eich dyddiad geni?"
+      hint: "Er enghraifft, 31 3 1980"
+      items:
+        - label: Dydd
+          name: dob-dydd
+          width: 2
+          value: 31
+        - label: Mis
+          name: dob-mis
+          width: 2
+          value: 3
+        - label: Blwyddyn
+          name: dob-blwyddyn
+          width: 4
+          value: 1980

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = '16.7.0'.freeze
+  VERSION = '16.8.0'.freeze
 end

data/node_modules/accessible-autocomplete/package.json

@@ -49,7 +49,7 @@
     "/"
   ],
   "_resolved": "git://github.com/alphagov/accessible-autocomplete.git#0c518b4fa79b9a95b544410858486ed9e6403c84",
-  "_shasum": "1e3e4aa764d72e003e7263cfc22b42af5e05507f",
+  "_shasum": "5a4193d96fc09bcd97b5641b903aa0f0ec6340d0",
   "_shrinkwrap": null,
   "_spec": "accessible-autocomplete@git://github.com/alphagov/accessible-autocomplete.git#add-multiselect-support",
   "_where": "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ",

data/node_modules/axe-core/package.json

@@ -2,18 +2,18 @@
   "_args": [
     [
       {
-        "raw": "axe-core@^3.1.2",
+        "raw": "axe-core@^3.2.2",
         "scope": null,
         "escapedName": "axe-core",
         "name": "axe-core",
-        "rawSpec": "^3.1.2",
-        "spec": ">=3.1.2 <4.0.0",
+        "rawSpec": "^3.2.2",
+        "spec": ">=3.2.2 <4.0.0",
         "type": "range"
       },
       "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ"
     ]
   ],
-  "_from": "axe-core@>=3.1.2 <4.0.0",
+  "_from": "axe-core@>=3.2.2 <4.0.0",
   "_hasShrinkwrap": false,
   "_id": "axe-core@3.2.2",
   "_inCache": true,
@@ -30,12 +30,12 @@
   "_npmVersion": "6.4.1",
   "_phantomChildren": {},
   "_requested": {
-    "raw": "axe-core@^3.1.2",
+    "raw": "axe-core@^3.2.2",
     "scope": null,
     "escapedName": "axe-core",
     "name": "axe-core",
-    "rawSpec": "^3.1.2",
-    "spec": ">=3.1.2 <4.0.0",
+    "rawSpec": "^3.2.2",
+    "spec": ">=3.2.2 <4.0.0",
     "type": "range"
   },
   "_requiredBy": [
@@ -44,7 +44,7 @@
   "_resolved": "https://registry.npmjs.org/axe-core/-/axe-core-3.2.2.tgz",
   "_shasum": "b06d6e9ae4636d706068843272bfaeed3fe97362",
   "_shrinkwrap": null,
-  "_spec": "axe-core@^3.1.2",
+  "_spec": "axe-core@^3.2.2",
   "_where": "/var/lib/jenkins/workspace/ublishing_components_master-N4FWJIUY4CIFHKGZOAAEVVXODRY3YBORQOPIBBXWX72VUPSGJRRQ",
   "bugs": {
     "url": "https://github.com/dequelabs/axe-core/issues"

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 16.7.0
+  version: 16.8.0
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-03-22 00:00:00.000000000 Z
+date: 2019-03-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govspeak
@@ -313,6 +313,7 @@ files:
 - app/assets/javascripts/govuk_publishing_components/components/accordion.js
 - app/assets/javascripts/govuk_publishing_components/components/character-count.js
 - app/assets/javascripts/govuk_publishing_components/components/checkboxes.js
+- app/assets/javascripts/govuk_publishing_components/components/cookie-banner.js
 - app/assets/javascripts/govuk_publishing_components/components/copy-to-clipboard.js
 - app/assets/javascripts/govuk_publishing_components/components/error-summary.js
 - app/assets/javascripts/govuk_publishing_components/components/feedback.js
@@ -322,9 +323,11 @@ files:
 - app/assets/javascripts/govuk_publishing_components/components/radio.js
 - app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js
 - app/assets/javascripts/govuk_publishing_components/dependencies.js
+- app/assets/javascripts/govuk_publishing_components/lib/cookie-functions.js
 - app/assets/javascripts/govuk_publishing_components/lib/current-location.js
 - app/assets/javascripts/govuk_publishing_components/lib/govspeak/barchart-enhancement.js
 - app/assets/javascripts/govuk_publishing_components/lib/govspeak/youtube-link-enhancement.js
+- app/assets/javascripts/govuk_publishing_components/lib/header-navigation.js
 - app/assets/javascripts/govuk_publishing_components/lib/select.js
 - app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js
 - app/assets/javascripts/govuk_publishing_components/lib/toggle.js
@@ -343,7 +346,9 @@ files:
 - app/assets/stylesheets/govuk_publishing_components/components/_character-count.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_contents-list.scss
+- app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_copy-to-clipboard.scss
+- app/assets/stylesheets/govuk_publishing_components/components/_date-input.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_details.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_document-list.scss
 - app/assets/stylesheets/govuk_publishing_components/components/_error-alert.scss
@@ -459,7 +464,9 @@ files:
 - app/views/govuk_publishing_components/components/_contextual_breadcrumbs.html.erb
 - app/views/govuk_publishing_components/components/_contextual_footer.html.erb
 - app/views/govuk_publishing_components/components/_contextual_sidebar.html.erb
+- app/views/govuk_publishing_components/components/_cookie_banner.html.erb
 - app/views/govuk_publishing_components/components/_copy_to_clipboard.html.erb
+- app/views/govuk_publishing_components/components/_date_input.html.erb
 - app/views/govuk_publishing_components/components/_details.html.erb
 - app/views/govuk_publishing_components/components/_document_list.html.erb
 - app/views/govuk_publishing_components/components/_error_alert.html.erb
@@ -523,7 +530,9 @@ files:
 - app/views/govuk_publishing_components/components/docs/contextual_breadcrumbs.yml
 - app/views/govuk_publishing_components/components/docs/contextual_footer.yml
 - app/views/govuk_publishing_components/components/docs/contextual_sidebar.yml
+- app/views/govuk_publishing_components/components/docs/cookie_banner.yml
 - app/views/govuk_publishing_components/components/docs/copy_to_clipboard.yml
+- app/views/govuk_publishing_components/components/docs/date_input.yml
 - app/views/govuk_publishing_components/components/docs/details.yml
 - app/views/govuk_publishing_components/components/docs/document_list.yml
 - app/views/govuk_publishing_components/components/docs/error_alert.yml