Merge pull request #1992 from alphagov/update-to-v4.0.0

Update to GOV.UK Frontend v4.0.0

package.json

@@ -34,7 +34,7 @@
     "clipboard": "^2.0.4",
     "connect": "^3.6.6",
     "eslint": "^5.16.0",
-    "govuk-frontend": "^3.14.0",
+    "govuk-frontend": "^4.0.0",
     "gray-matter": "^4.0.2",
     "highlight.js": "^10.4.1",
     "html5shiv": "^3.7.3",

src/components/character-count/threshold/index.njk

@@ -6,8 +6,8 @@ layout: layout-example.njk
 {% from "govuk/components/character-count/macro.njk" import govukCharacterCount %}
 
 {{ govukCharacterCount({
-  name: "word-count",
-  id: "word-count",
+  name: "threshold",
+  id: "threshold",
   maxlength: 112,
   threshold: 75,
   value: "Type another letter into this field after this message to see the threshold feature",

src/components/footer/full/index.njk

@@ -9,6 +9,7 @@ layout: layout-example.njk
   navigation: [
     {
       title: "Services and information",
+      width: "two-thirds",
       columns: 2,
       items: [
         {
@@ -79,6 +80,7 @@ layout: layout-example.njk
     },
     {
       title: "Departments and policy",
+      width: "one-third",
       items: [
         {
           href: "#",

src/components/footer/with-navigation/index.njk

@@ -9,6 +9,7 @@ layout: layout-example.njk
   navigation: [
     {
       title: "Two column list",
+      width: "two-thirds",
       columns: 2,
       items: [
         {
@@ -39,6 +40,7 @@ layout: layout-example.njk
     },
     {
       title: "Single column list",
+      width: "one-third",
       items: [
         {
           href: "#1",

src/javascripts/govuk-frontend.js

@@ -9,6 +9,7 @@ import NotificationBanner from 'govuk-frontend/govuk/components/notification-ban
 import Radios from 'govuk-frontend/govuk/components/radios/radios'
 import Header from 'govuk-frontend/govuk/components/header/header'
 import Tabs from 'govuk-frontend/govuk/components/tabs/tabs'
+import SkipLink from 'govuk-frontend/govuk/components/skip-link/skip-link'
 
 var nodeListForEach = common.nodeListForEach
 
@@ -68,3 +69,7 @@ var $tabs = document.querySelectorAll('[data-module="govuk-tabs"]')
 nodeListForEach($tabs, function ($tab) {
   new Tabs($tab).init()
 })
+
+// Find first skip link module to enhance.
+var $skipLink = document.querySelector('[data-module="govuk-skip-link"]')
+new SkipLink($skipLink).init()