govuk_publishing_components 28.5.0 → 28.6.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (118) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/govuk_publishing_components/analytics/track-select-change.js +4 -3
  3. data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +21 -291
  4. data/app/assets/javascripts/govuk_publishing_components/components/button.js +1 -1
  5. data/app/assets/javascripts/govuk_publishing_components/components/character-count.js +1 -1
  6. data/app/assets/javascripts/govuk_publishing_components/components/checkboxes.js +1 -1
  7. data/app/assets/javascripts/govuk_publishing_components/components/details.js +1 -1
  8. data/app/assets/javascripts/govuk_publishing_components/components/error-summary.js +1 -1
  9. data/app/assets/javascripts/govuk_publishing_components/components/layout-header.js +1 -1
  10. data/app/assets/javascripts/govuk_publishing_components/components/radio.js +1 -1
  11. data/app/assets/javascripts/govuk_publishing_components/components/skip-link.js +5 -0
  12. data/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js +40 -37
  13. data/app/assets/javascripts/govuk_publishing_components/components/tabs.js +1 -1
  14. data/app/assets/javascripts/govuk_publishing_components/lib/govspeak/barchart-enhancement.js +2 -1
  15. data/app/assets/javascripts/govuk_publishing_components/lib/govspeak/magna-charta.js +8 -10
  16. data/app/assets/javascripts/govuk_publishing_components/lib/initial-focus.js +4 -3
  17. data/app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js +4 -3
  18. data/app/assets/javascripts/govuk_publishing_components/lib/toggle.js +4 -3
  19. data/app/assets/stylesheets/govuk_publishing_components/components/_accordion.scss +1 -329
  20. data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss +1 -1
  21. data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss +95 -56
  22. data/app/assets/stylesheets/govuk_publishing_components/components/print/_accordion.scss +6 -17
  23. data/app/assets/stylesheets/govuk_publishing_components/govuk_frontend_support.scss +0 -9
  24. data/app/views/govuk_publishing_components/components/_accordion.html.erb +31 -16
  25. data/app/views/govuk_publishing_components/components/_button.html.erb +1 -1
  26. data/app/views/govuk_publishing_components/components/_character_count.html.erb +2 -2
  27. data/app/views/govuk_publishing_components/components/_checkboxes.html.erb +2 -2
  28. data/app/views/govuk_publishing_components/components/_error_message.html.erb +1 -1
  29. data/app/views/govuk_publishing_components/components/_error_summary.html.erb +0 -1
  30. data/app/views/govuk_publishing_components/components/_inset_text.html.erb +12 -1
  31. data/app/views/govuk_publishing_components/components/_layout_footer.html.erb +1 -1
  32. data/app/views/govuk_publishing_components/components/_modal_dialogue.html.erb +1 -1
  33. data/app/views/govuk_publishing_components/components/_radio.html.erb +1 -1
  34. data/app/views/govuk_publishing_components/components/_skip_link.html.erb +1 -1
  35. data/app/views/govuk_publishing_components/components/docs/accordion.yml +2 -97
  36. data/app/views/govuk_publishing_components/components/docs/govspeak.yml +1 -1
  37. data/app/views/govuk_publishing_components/components/docs/inset_text.yml +6 -0
  38. data/app/views/govuk_publishing_components/components/docs/share_links.yml +1 -1
  39. data/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml +13 -13
  40. data/app/views/govuk_publishing_components/components/docs/tabs.yml +1 -1
  41. data/app/views/govuk_publishing_components/components/docs/textarea.yml +1 -1
  42. data/app/views/govuk_publishing_components/components/layout_header/_navigation_items.html.erb +11 -11
  43. data/lib/govuk_publishing_components/version.rb +1 -1
  44. data/node_modules/govuk-frontend/govuk/all.js +294 -76
  45. data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +274 -99
  46. data/node_modules/govuk-frontend/govuk/components/accordion/accordion.js +169 -65
  47. data/node_modules/govuk-frontend/govuk/components/accordion/fixtures.json +37 -5
  48. data/node_modules/govuk-frontend/govuk/components/accordion/macro-options.json +4 -4
  49. data/node_modules/govuk-frontend/govuk/components/button/button.js +2 -2
  50. data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js +3 -3
  51. data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +15 -2
  52. data/node_modules/govuk-frontend/govuk/components/checkboxes/checkboxes.js +8 -10
  53. data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +52 -15
  54. data/node_modules/govuk-frontend/govuk/components/cookie-banner/_index.scss +0 -2
  55. data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +31 -0
  56. data/node_modules/govuk-frontend/govuk/components/date-input/fixtures.json +25 -25
  57. data/node_modules/govuk-frontend/govuk/components/details/details.js +2 -2
  58. data/node_modules/govuk-frontend/govuk/components/error-message/_index.scss +1 -0
  59. data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json +8 -8
  60. data/node_modules/govuk-frontend/govuk/components/error-message/template.njk +2 -2
  61. data/node_modules/govuk-frontend/govuk/components/error-summary/error-summary.js +24 -3
  62. data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json +25 -16
  63. data/node_modules/govuk-frontend/govuk/components/error-summary/macro-options.json +6 -0
  64. data/node_modules/govuk-frontend/govuk/components/error-summary/template.njk +2 -1
  65. data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +4 -4
  66. data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +3 -37
  67. data/node_modules/govuk-frontend/govuk/components/footer/fixtures.json +119 -15
  68. data/node_modules/govuk-frontend/govuk/components/footer/macro-options.json +6 -0
  69. data/node_modules/govuk-frontend/govuk/components/footer/template.njk +1 -1
  70. data/node_modules/govuk-frontend/govuk/components/header/_index.scss +10 -4
  71. data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +11 -11
  72. data/node_modules/govuk-frontend/govuk/components/header/header.js +4 -4
  73. data/node_modules/govuk-frontend/govuk/components/header/template.njk +4 -3
  74. data/node_modules/govuk-frontend/govuk/components/hint/_index.scss +1 -3
  75. data/node_modules/govuk-frontend/govuk/components/input/_index.scss +1 -1
  76. data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +40 -40
  77. data/node_modules/govuk-frontend/govuk/components/input/template.njk +4 -3
  78. data/node_modules/govuk-frontend/govuk/components/notification-banner/notification-banner.js +499 -2
  79. data/node_modules/govuk-frontend/govuk/components/phase-banner/fixtures.json +2 -2
  80. data/node_modules/govuk-frontend/govuk/components/radios/_index.scss +0 -8
  81. data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +44 -45
  82. data/node_modules/govuk-frontend/govuk/components/radios/radios.js +4 -4
  83. data/node_modules/govuk-frontend/govuk/components/radios/template.njk +2 -9
  84. data/node_modules/govuk-frontend/govuk/components/select/_index.scss +6 -1
  85. data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +3 -3
  86. data/node_modules/govuk-frontend/govuk/components/skip-link/_index.scss +13 -0
  87. data/node_modules/govuk-frontend/govuk/components/skip-link/fixtures.json +9 -9
  88. data/node_modules/govuk-frontend/govuk/components/skip-link/skip-link.js +1108 -0
  89. data/node_modules/govuk-frontend/govuk/components/skip-link/template.njk +1 -1
  90. data/node_modules/govuk-frontend/govuk/components/summary-list/_index.scss +20 -23
  91. data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json +86 -1
  92. data/node_modules/govuk-frontend/govuk/components/summary-list/template.njk +1 -4
  93. data/node_modules/govuk-frontend/govuk/components/tabs/_index.scss +2 -2
  94. data/node_modules/govuk-frontend/govuk/components/tabs/tabs.js +2 -2
  95. data/node_modules/govuk-frontend/govuk/components/tag/_index.scss +0 -5
  96. data/node_modules/govuk-frontend/govuk/components/tag/fixtures.json +2 -2
  97. data/node_modules/govuk-frontend/govuk/components/textarea/_index.scss +1 -1
  98. data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +4 -4
  99. data/node_modules/govuk-frontend/govuk/core/_all.scss +0 -1
  100. data/node_modules/govuk-frontend/govuk/core/_global-styles.scss +0 -6
  101. data/node_modules/govuk-frontend/govuk/core/_links.scss +0 -6
  102. data/node_modules/govuk-frontend/govuk/core/_lists.scss +0 -6
  103. data/node_modules/govuk-frontend/govuk/core/_section-break.scss +0 -6
  104. data/node_modules/govuk-frontend/govuk/core/_typography.scss +0 -6
  105. data/node_modules/govuk-frontend/govuk/objects/_all.scss +1 -0
  106. data/node_modules/govuk-frontend/govuk/objects/_main-wrapper.scss +15 -30
  107. data/node_modules/govuk-frontend/govuk/{core → objects}/_template.scss +1 -5
  108. data/node_modules/govuk-frontend/govuk/overrides/_display.scss +0 -6
  109. data/node_modules/govuk-frontend/govuk/overrides/_spacing.scss +0 -6
  110. data/node_modules/govuk-frontend/govuk/overrides/_text-align.scss +0 -6
  111. data/node_modules/govuk-frontend/govuk/overrides/_typography.scss +0 -6
  112. data/node_modules/govuk-frontend/govuk/overrides/_width.scss +0 -6
  113. data/node_modules/govuk-frontend/govuk/settings/_colours-organisations.scss +3 -0
  114. data/node_modules/govuk-frontend/govuk/settings/_measurements.scss +0 -10
  115. data/node_modules/govuk-frontend/govuk/tools/_all.scss +0 -1
  116. data/node_modules/govuk-frontend/package.json +1 -1
  117. metadata +8 -7
  118. data/node_modules/govuk-frontend/govuk/tools/_iff.scss +0 -17
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 371db87e529f0df4c14d1dd53c23ebc9c5d7f7df9574359ed8d64da6c7302953
4
- data.tar.gz: dc72630351ee918647581cfc58b7ca7c19282c50990c16bd72eec14222fbd375
3
+ metadata.gz: 85985bab4532c5cbccfa05369e032e61cedfda7468ab5654d10ce0eb937155b8
4
+ data.tar.gz: fd00b4c1e0784b1951f0103412dc7dd2eaf619d2ad72456c77b892903fc1cd9a
5
5
  SHA512:
6
- metadata.gz: ca824e190545a628771d2ef3e632aa57b5144bec484a4538b0e9a53caee73421e13f67c6d50ff114720b3b810f6435892be1491afff41825cbc989970f1e73ed
7
- data.tar.gz: ed1b7d8547fd264afc779a55adc347ff22ccf170cb1b003da362bc8ca9bbbf59964522387cba9059b0eb8038dc9487b0c5262a5e1e54e8e5245e23d5845edd6f
6
+ metadata.gz: fd73aa7768ba4224e03065bb8b04becf3e4c227c50422eb5255ab52fe82a075a8e5968d143ecb80bbc3f3481432783ab1ef7dad55515801f2905c2449676989d
7
+ data.tar.gz: 6b0541c15147aedcbbd890cb222d280ba02f492fb84d5a280580b5fa6d64a58f6e5a80ae2277bd9667e3e9c7a9c28b22ba2ef590400b5b047230cb3e0036f41b
@@ -2,10 +2,11 @@ window.GOVUK = window.GOVUK || {}
2
2
  window.GOVUK.Modules = window.GOVUK.Modules || {};
3
3
 
4
4
  (function (Modules) {
5
- function TrackSelectChange () { }
5
+ function TrackSelectChange ($module) {
6
+ this.$module = $module
7
+ }
6
8
 
7
- TrackSelectChange.prototype.start = function ($module) {
8
- this.$module = $module[0]
9
+ TrackSelectChange.prototype.init = function ($module) {
9
10
  this.$module.trackChange = this.trackChange.bind(this)
10
11
  this.$module.fireTrackingChange = this.fireTrackingChange.bind(this)
11
12
  this.$module.addEventListener('change', this.trackChange)
@@ -1,32 +1,18 @@
1
1
  /* global nodeListForEach */
2
- // = require ../vendor/polyfills/closest.js
3
- // = require ../vendor/polyfills/indexOf.js
4
2
  // = require ../vendor/polyfills/common.js
5
-
3
+ // This component relies on JavaScript from GOV.UK Frontend
4
+ // = require govuk/components/accordion/accordion.js
6
5
  window.GOVUK = window.GOVUK || {}
7
- window.GOVUK.Modules = window.GOVUK.Modules || {};
6
+ window.GOVUK.Modules = window.GOVUK.Modules || {}
7
+ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
8
8
 
9
9
  (function (Modules) {
10
10
  function GemAccordion ($module) {
11
11
  this.$module = $module
12
- this.sectionClass = 'gem-c-accordion__section'
13
- this.moduleId = this.$module.getAttribute('id')
14
- this.sections = this.$module.querySelectorAll('.' + this.sectionClass)
15
- this.openAllButton = ''
16
- this.controlsClass = 'gem-c-accordion__controls'
17
- this.openAllClass = 'gem-c-accordion__open-all'
18
- this.openAllTextClass = 'gem-c-accordion__open-all-text'
19
- this.sectionHeaderClass = 'gem-c-accordion__section-header'
20
- this.sectionHeadingClass = 'gem-c-accordion__section-heading'
21
- this.sectionSummaryClass = 'gem-c-accordion__section-summary'
22
- this.sectionButtonClass = 'gem-c-accordion__section-button'
23
- this.sectionExpandedClass = 'gem-c-accordion__section--expanded'
24
- this.sectionInnerContent = 'gem-c-accordion__section-content'
25
- this.toggleLinkClass = 'js-toggle-link'
26
- this.sectionShowHideIconClass = 'gem-c-accordion__toggle-link'
27
- this.sectionShowHideTextClass = 'gem-c-accordion__toggle-text'
28
- this.upChevonIconClass = 'gem-c-accordion-nav__chevron'
29
- this.downChevonIconClass = 'gem-c-accordion-nav__chevron--down'
12
+ this.sectionClass = 'govuk-accordion__section'
13
+ this.sectionClassExpanded = 'govuk-accordion__section--expanded'
14
+ this.sectionHeaderClass = 'govuk-accordion__section-header'
15
+ this.sectionInnerContent = 'govuk-accordion__section-content'
30
16
 
31
17
  // Translated component content and language attribute pulled from data attributes
32
18
  this.$module.actions = {}
@@ -39,279 +25,14 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
39
25
  }
40
26
 
41
27
  GemAccordion.prototype.init = function () {
42
- this.browserSupportsSessionStorage = helper.checkForSessionStorage()
43
-
44
28
  // Indicate that JavaScript has worked
45
29
  this.$module.classList.add('gem-c-accordion--active')
46
30
 
47
- this.initControls()
48
- this.initSectionHeaders()
49
-
50
31
  // Feature flag for anchor tag navigation used on manuals
51
32
  if (this.$module.getAttribute('data-anchor-navigation') === 'true') {
52
33
  this.openByAnchorOnLoad()
53
34
  this.addEventListenersForAnchors()
54
35
  }
55
-
56
- // See if "Show all sections" button text should be updated
57
- var areAllSectionsOpen = this.checkIfAllSectionsOpen()
58
- this.updateOpenAllButton(areAllSectionsOpen)
59
- }
60
-
61
- // Initialise controls and set attributes
62
- GemAccordion.prototype.initControls = function () {
63
- // Create "Show all" button and set attributes
64
- this.openAllButton = document.createElement('button')
65
- this.openAllButton.setAttribute('class', this.openAllClass)
66
- this.openAllButton.setAttribute('aria-expanded', 'false')
67
-
68
- // Create icon, add to element
69
- var icon = document.createElement('span')
70
- icon.classList.add(this.upChevonIconClass)
71
- this.openAllButton.appendChild(icon)
72
-
73
- // Create control wrapper and add controls to it
74
- var accordionControls = document.createElement('div')
75
- accordionControls.setAttribute('class', this.controlsClass)
76
- accordionControls.appendChild(this.openAllButton)
77
- this.$module.insertBefore(accordionControls, this.$module.firstChild)
78
-
79
- // Build additional wrapper for open all toggle text, place icon after wrapped text.
80
- var wrapperOpenAllText = document.createElement('span')
81
- wrapperOpenAllText.classList.add(this.openAllTextClass)
82
- this.openAllButton.insertBefore(wrapperOpenAllText, this.openAllButton.childNodes[0] || null)
83
-
84
- // Handle events for the controls
85
- this.openAllButton.addEventListener('click', this.onOpenOrCloseAllToggle.bind(this))
86
- }
87
-
88
- // Initialise section headers
89
- GemAccordion.prototype.initSectionHeaders = function () {
90
- // Loop through section headers
91
- nodeListForEach(this.sections, function (section, i) {
92
- // Set header attributes
93
- var header = section.querySelector('.' + this.sectionHeaderClass)
94
-
95
- this.initHeaderAttributes(header, i)
96
- this.setExpanded(this.isExpanded(section), section)
97
-
98
- // Handle events
99
- header.addEventListener('click', this.onSectionToggle.bind(this, section))
100
-
101
- // See if there is any state stored in sessionStorage and set the sections to
102
- // open or closed.
103
- this.setInitialState(section)
104
- }.bind(this))
105
- }
106
-
107
- // Set individual header attributes
108
- GemAccordion.prototype.initHeaderAttributes = function (headerWrapper, index) {
109
- var span = headerWrapper.querySelector('.' + this.sectionButtonClass)
110
- var heading = headerWrapper.querySelector('.' + this.sectionHeadingClass)
111
- var summary = headerWrapper.querySelector('.' + this.sectionSummaryClass)
112
-
113
- // Copy existing span element to an actual button element, for improved accessibility.
114
- var button = document.createElement('button')
115
- button.setAttribute('id', this.moduleId + '-heading-' + (index + 1))
116
- button.setAttribute('aria-controls', this.moduleId + '-content-' + (index + 1))
117
-
118
- // Create show / hide arrow icons with text.
119
- var showIcons = document.createElement('span')
120
- showIcons.classList.add(this.sectionShowHideIconClass, this.toggleLinkClass)
121
-
122
- // Add pause after heading for assistive technology.
123
- var srPause = document.createElement('span')
124
- srPause.classList.add('govuk-visually-hidden')
125
- srPause.innerHTML = ', '
126
-
127
- // Build additional copy for assistive technology
128
- var srAdditionalCopy = document.createElement('span')
129
- srAdditionalCopy.classList.add('govuk-visually-hidden')
130
- srAdditionalCopy.innerHTML = this.$module.actions.thisSectionVisuallyHidden
131
-
132
- if (this.$module.actions.locale) {
133
- srAdditionalCopy.lang = this.filterLocale('this_section_visually_hidden')
134
- }
135
-
136
- // Build additional wrapper for toggle text, place icon after wrapped text.
137
- var wrapperShowHideIcon = document.createElement('span')
138
- var icon = document.createElement('span')
139
- icon.classList.add(this.upChevonIconClass)
140
- showIcons.appendChild(icon)
141
- wrapperShowHideIcon.classList.add(this.sectionShowHideTextClass)
142
- showIcons.insertBefore(wrapperShowHideIcon, showIcons.childNodes[0] || null)
143
-
144
- // Copy all attributes (https://developer.mozilla.org/en-US/docs/Web/API/Element/attributes) from span to button
145
- for (var i = 0; i < span.attributes.length; i++) {
146
- var attr = span.attributes.item(i)
147
- button.setAttribute(attr.nodeName, attr.nodeValue)
148
- }
149
-
150
- // span could contain HTML elements (see https://www.w3.org/TR/2011/WD-html5-20110525/content-models.html#phrasing-content)
151
- button.innerHTML = span.innerHTML
152
- heading.removeChild(span)
153
- heading.appendChild(button)
154
- button.appendChild(srPause)
155
-
156
- // If summary content exists add to DOM in correct order
157
- if (typeof (summary) !== 'undefined' && summary !== null) {
158
- button.setAttribute('aria-describedby', this.moduleId + '-summary-' + (index + 1))
159
- button.appendChild(summary)
160
- }
161
-
162
- button.appendChild(showIcons)
163
- button.appendChild(srAdditionalCopy)
164
- }
165
-
166
- // When section toggled, set and store state
167
- GemAccordion.prototype.onSectionToggle = function (section) {
168
- var expanded = this.isExpanded(section)
169
- this.setExpanded(!expanded, section)
170
-
171
- // Store the state in sessionStorage when a change is triggered
172
- this.storeState(section)
173
- }
174
-
175
- // When Open/Close All toggled, set and store state
176
- GemAccordion.prototype.onOpenOrCloseAllToggle = function () {
177
- var module = this
178
- var sections = this.sections
179
- var nowExpanded = !this.checkIfAllSectionsOpen()
180
-
181
- nodeListForEach(sections, function (section) {
182
- module.setExpanded(nowExpanded, section)
183
- // Store the state in sessionStorage when a change is triggered
184
- module.storeState(section)
185
- })
186
-
187
- module.updateOpenAllButton(nowExpanded)
188
- }
189
-
190
- // Set section attributes when opened/closed
191
- GemAccordion.prototype.setExpanded = function (expanded, section) {
192
- var icon = section.querySelector('.' + this.upChevonIconClass)
193
- var showHideText = section.querySelector('.' + this.sectionShowHideTextClass)
194
- var button = section.querySelector('.' + this.sectionButtonClass)
195
- var newButtonText = expanded ? this.$module.actions.hideText : this.$module.actions.showText
196
-
197
- showHideText.innerHTML = newButtonText
198
- button.setAttribute('aria-expanded', expanded)
199
- button.classList.add(this.toggleLinkClass)
200
-
201
- if (this.$module.actions.locale) {
202
- showHideText.lang = this.filterLocale(expanded ? 'hide_text' : 'show_text')
203
- }
204
-
205
- // Swap icon, change class
206
- if (expanded) {
207
- section.classList.add(this.sectionExpandedClass)
208
- icon.classList.remove(this.downChevonIconClass)
209
- } else {
210
- section.classList.remove(this.sectionExpandedClass)
211
- icon.classList.add(this.downChevonIconClass)
212
- }
213
-
214
- // See if "Show all sections" button text should be updated
215
- var areAllSectionsOpen = this.checkIfAllSectionsOpen()
216
- this.updateOpenAllButton(areAllSectionsOpen)
217
- }
218
-
219
- // Get state of section
220
- GemAccordion.prototype.isExpanded = function (section) {
221
- return section.classList.contains(this.sectionExpandedClass)
222
- }
223
-
224
- // Check if all sections are open
225
- GemAccordion.prototype.checkIfAllSectionsOpen = function () {
226
- // Get a count of all the Accordion sections
227
- var sectionsCount = this.sections.length
228
- // Get a count of all Accordion sections that are expanded
229
- var expandedSectionCount = this.$module.querySelectorAll('.' + this.sectionExpandedClass).length
230
- var areAllSectionsOpen = sectionsCount === expandedSectionCount
231
-
232
- return areAllSectionsOpen
233
- }
234
-
235
- // Update "Show all sections" button
236
- GemAccordion.prototype.updateOpenAllButton = function (expanded) {
237
- var icon = this.openAllButton.querySelector('.' + this.upChevonIconClass)
238
- var openAllCopy = this.openAllButton.querySelector('.' + this.openAllTextClass)
239
- var newButtonText = expanded ? this.$module.actions.hideAllText : this.$module.actions.showAllText
240
-
241
- this.openAllButton.setAttribute('aria-expanded', expanded)
242
- openAllCopy.innerHTML = newButtonText
243
-
244
- if (this.$module.actions.locale) {
245
- openAllCopy.lang = this.filterLocale(expanded ? 'hide_all_text' : 'show_all_text')
246
- }
247
-
248
- // Swap icon, toggle class
249
- if (expanded) {
250
- icon.classList.remove(this.downChevonIconClass)
251
- } else {
252
- icon.classList.add(this.downChevonIconClass)
253
- }
254
- }
255
-
256
- var helper = {
257
- checkForSessionStorage: function () {
258
- var testString = 'this is the test string'
259
- var result
260
- try {
261
- window.sessionStorage.setItem(testString, testString)
262
- result = window.sessionStorage.getItem(testString) === testString.toString()
263
- window.sessionStorage.removeItem(testString)
264
- return result
265
- } catch (exception) {
266
- if ((typeof console === 'undefined' || typeof console.log === 'undefined')) {
267
- console.log('Notice: sessionStorage not available.')
268
- }
269
- }
270
- }
271
- }
272
-
273
- // Set the state of the accordions in sessionStorage
274
- GemAccordion.prototype.storeState = function (section) {
275
- if (this.browserSupportsSessionStorage) {
276
- // We need a unique way of identifying each content in the GemAccordion. Since
277
- // an `#id` should be unique and an `id` is required for `aria-` attributes
278
- // `id` can be safely used.
279
- var button = section.querySelector('.' + this.sectionButtonClass)
280
-
281
- if (button) {
282
- var contentId = button.getAttribute('aria-controls')
283
- var contentState = button.getAttribute('aria-expanded')
284
-
285
- if (typeof contentId === 'undefined' && (typeof console === 'undefined' || typeof console.log === 'undefined')) {
286
- console.error(new Error('No aria controls present in accordion section heading.'))
287
- }
288
-
289
- if (typeof contentState === 'undefined' && (typeof console === 'undefined' || typeof console.log === 'undefined')) {
290
- console.error(new Error('No aria expanded present in accordion section heading.'))
291
- }
292
-
293
- // Only set the state when both `contentId` and `contentState` are taken from the DOM.
294
- if (contentId && contentState) {
295
- window.sessionStorage.setItem(contentId, contentState)
296
- }
297
- }
298
- }
299
- }
300
-
301
- // Read the state of the accordions from sessionStorage
302
- GemAccordion.prototype.setInitialState = function (section) {
303
- if (this.browserSupportsSessionStorage) {
304
- var button = section.querySelector('.' + this.sectionButtonClass)
305
-
306
- if (button) {
307
- var contentId = button.getAttribute('aria-controls')
308
- var contentState = contentId ? window.sessionStorage.getItem(contentId) : null
309
-
310
- if (contentState !== null) {
311
- this.setExpanded(contentState === 'true', section)
312
- }
313
- }
314
- }
315
36
  }
316
37
 
317
38
  // Navigate to and open accordions with anchored content on page load if a hash is present
@@ -327,6 +48,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
327
48
  // Adding an event listener to all anchor link a tags in an accordion is risky but we circumvent this risk partially by only being a layer of accordion behaviour instead of any sort of change to link behaviour
328
49
  GemAccordion.prototype.addEventListenersForAnchors = function () {
329
50
  var links = this.$module.querySelectorAll('.' + this.sectionInnerContent + ' a[href*="#"]')
51
+
330
52
  nodeListForEach(links, function (link) {
331
53
  if (link.pathname === window.location.pathname) {
332
54
  link.addEventListener('click', this.openForAnchor.bind(this, link.hash.split('#')[1]))
@@ -337,9 +59,18 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
337
59
  // Find the parent accordion section for the given id and open it
338
60
  GemAccordion.prototype.openForAnchor = function (hash) {
339
61
  var target = document.getElementById(hash)
340
- var section = this.getContainingSection(target)
341
-
342
- this.setExpanded(true, section)
62
+ var $section = this.getContainingSection(target)
63
+ var $header = $section.querySelector('.' + this.sectionHeaderClass)
64
+ var $expanded = this.getContainingSection($section)
65
+ var $parent = $header.parentElement
66
+
67
+ // manuals-frontend features:
68
+ // Should the target anchor link be within the same page, open section - navigate normally
69
+ // Should the target anchor link be within a different, closed section, open this section
70
+ // Should the target anchor link be within a different page and different, closed section open this section
71
+ if ($expanded && (!$parent.classList.contains(this.sectionClassExpanded))) {
72
+ $header.click()
73
+ }
343
74
  }
344
75
 
345
76
  // Loop through the given id's ancestors until the parent section class is found
@@ -347,7 +78,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
347
78
  while (!target.classList.contains(this.sectionClass)) {
348
79
  target = target.parentElement
349
80
  }
350
-
351
81
  return target
352
82
  }
353
83
 
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/button/button.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukButton = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukButton = window.GOVUKFrontend.Button
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/character-count/character-count.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukCharacterCount = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukCharacterCount = window.GOVUKFrontend.CharacterCount
@@ -2,7 +2,7 @@
2
2
  // = require govuk/components/checkboxes/checkboxes.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukCheckboxes = window.GOVUKFrontend;
5
+ window.GOVUK.Modules.GovukCheckboxes = window.GOVUKFrontend.Checkboxes;
6
6
 
7
7
  (function (Modules) {
8
8
  function GemCheckboxes ($module) {
@@ -1,7 +1,7 @@
1
1
  // = require govuk/components/details/details.js
2
2
  window.GOVUK = window.GOVUK || {}
3
3
  window.GOVUK.Modules = window.GOVUK.Modules || {}
4
- window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend;
4
+ window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend.Details;
5
5
 
6
6
  (function (Modules) {
7
7
  function GemDetails ($module) {
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/error-summary/error-summary.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukErrorSummary = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukErrorSummary = window.GOVUKFrontend.ErrorSummary
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/header/header.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukHeader = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukHeader = window.GOVUKFrontend.Header
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/radios/radios.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukRadios = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukRadios = window.GOVUKFrontend.Radios
@@ -0,0 +1,5 @@
1
+ // This component relies on JavaScript from GOV.UK Frontend
2
+ // = require govuk/components/skip-link/skip-link.js
3
+ window.GOVUK = window.GOVUK || {}
4
+ window.GOVUK.Modules = window.GOVUK.Modules || {}
5
+ window.GOVUK.Modules.GovukSkipLink = window.GOVUKFrontend.SkipLink
@@ -40,15 +40,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
40
40
  this.$module.sessionStoreLink = this.$module.sessionStoreLink + '_' + this.$module.uniqueId
41
41
  }
42
42
 
43
- this.$module.upChevronSvg = '<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">' +
44
- '<path class="gem-c-step-nav__chevron-stroke" d="M19.5 10C19.5 15.2467 15.2467 19.5 10 19.5C4.75329 19.5 0.499997 15.2467 0.499998 10C0.499999 4.7533 4.7533 0.500001 10 0.500002C15.2467 0.500003 19.5 4.7533 19.5 10Z" stroke="#1D70B8"/>' +
45
- '<path class="gem-c-step-nav__chevron-stroke" d="M6.32617 12.3262L10 8.65234L13.6738 12.3262" stroke="#1D70B8" stroke-width="2"/>' +
46
- '</svg>'
47
- this.$module.downChevronSvg = '<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">' +
48
- '<path class="gem-c-step-nav__chevron-stroke" d="M0.499997 10C0.499998 4.75329 4.75329 0.499999 10 0.499999C15.2467 0.5 19.5 4.75329 19.5 10C19.5 15.2467 15.2467 19.5 10 19.5C4.75329 19.5 0.499997 15.2467 0.499997 10Z" stroke="#1D70B8"/>' +
49
- '<path class="gem-c-step-nav__chevron-stroke" d="M13.6738 8.67383L10 12.3477L6.32617 8.67383" stroke="#1D70B8" stroke-width="2"/>' +
50
- '</svg>'
51
-
52
43
  var stepNavTracker = new this.StepNavTracker(this.$module.uniqueId, this.$module.totalSteps, this.$module.totalLinks)
53
44
 
54
45
  this.getTextForInsertedElements()
@@ -73,16 +64,19 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
73
64
  }
74
65
 
75
66
  Gemstepnav.prototype.addShowHideAllButton = function () {
76
- var showall = document.createElement('div')
77
- showall.className = 'gem-c-step-nav__controls govuk-!-display-none-print'
78
- showall.innerHTML = '<button aria-expanded="false" class="gem-c-step-nav__button gem-c-step-nav__button--controls js-step-controls-button">' +
79
- '<span class="gem-c-step-nav__button-text gem-c-step-nav__button-text--all js-step-controls-button-text">' + this.$module.actions.showAllText + '</span>' +
80
- '<span class="gem-c-step-nav__chevron js-step-controls-button-icon">' + this.$module.downChevronSvg + '</span>' +
81
- '</button>'
82
-
67
+ var showAll = document.createElement('div')
83
68
  var steps = this.$module.querySelectorAll('.gem-c-step-nav__steps')[0]
84
- this.$module.insertBefore(showall, steps)
85
69
 
70
+ showAll.className = 'gem-c-step-nav__controls govuk-!-display-none-print'
71
+ showAll.innerHTML =
72
+ '<button aria-expanded="false" class="gem-c-step-nav__button gem-c-step-nav__button--controls js-step-controls-button">' +
73
+ '<span class="gem-c-step-nav__chevron gem-c-step-nav__chevron--down js-step-controls-button-icon"></span>' +
74
+ '<span class="gem-c-step-nav__button-text gem-c-step-nav__button-text--all js-step-controls-button-text">' +
75
+ this.$module.actions.showAllText +
76
+ '</span>' +
77
+ '</button>'
78
+
79
+ this.$module.insertBefore(showAll, steps)
86
80
  this.$module.showOrHideAllButton = this.$module.querySelectorAll('.js-step-controls-button')[0]
87
81
  }
88
82
 
@@ -91,30 +85,26 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
91
85
  var thisel = this.$module.stepHeaders[i]
92
86
 
93
87
  if (!thisel.querySelectorAll('.js-toggle-link').length) {
94
- var span = document.createElement('span')
95
88
  var showHideSpan = document.createElement('span')
96
89
  var showHideSpanText = document.createElement('span')
97
90
  var showHideSpanIcon = document.createElement('span')
98
- var commaSpan = document.createElement('span')
91
+ var showHideSpanFocus = document.createElement('span')
99
92
  var thisSectionSpan = document.createElement('span')
100
93
 
101
94
  showHideSpan.className = 'gem-c-step-nav__toggle-link js-toggle-link govuk-!-display-none-print'
102
95
  showHideSpanText.className = 'gem-c-step-nav__button-text js-toggle-link-text'
103
96
  showHideSpanIcon.className = 'gem-c-step-nav__chevron js-toggle-link-icon'
104
- commaSpan.className = 'govuk-visually-hidden'
97
+ showHideSpanFocus.className = 'gem-c-step-nav__toggle-link-focus'
105
98
  thisSectionSpan.className = 'govuk-visually-hidden'
106
99
 
107
- showHideSpan.appendChild(showHideSpanText)
108
- showHideSpan.appendChild(showHideSpanIcon)
100
+ showHideSpan.appendChild(showHideSpanFocus)
101
+ showHideSpanFocus.appendChild(showHideSpanIcon)
102
+ showHideSpanFocus.appendChild(showHideSpanText)
109
103
 
110
- commaSpan.innerHTML = ', '
111
104
  thisSectionSpan.innerHTML = ' this section'
105
+ showHideSpan.appendChild(thisSectionSpan)
112
106
 
113
- span.appendChild(commaSpan)
114
- span.appendChild(showHideSpan)
115
- span.appendChild(thisSectionSpan)
116
-
117
- thisel.querySelectorAll('.js-step-title-button')[0].appendChild(span)
107
+ thisel.querySelectorAll('.js-step-title-button')[0].appendChild(showHideSpan)
118
108
  }
119
109
  }
120
110
  }
@@ -125,6 +115,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
125
115
 
126
116
  Gemstepnav.prototype.addAriaControlsAttrForShowHideAllButton = function () {
127
117
  var ariaControlsValue = this.$module.querySelectorAll('.js-panel')[0].getAttribute('id')
118
+
128
119
  this.$module.showOrHideAllButton.setAttribute('aria-controls', ariaControlsValue)
129
120
  }
130
121
 
@@ -184,7 +175,10 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
184
175
  '<button ' +
185
176
  'class="gem-c-step-nav__button gem-c-step-nav__button--title js-step-title-button" ' +
186
177
  'aria-expanded="false" aria-controls="' + contentId + '">' +
187
- '<span class="gem-c-step-nav__title-text js-step-title-text">' + titleText + '</span>' +
178
+ '<span class="gem-c-step-nav____title-text-focus">' +
179
+ '<span class="gem-c-step-nav__title-text js-step-title-text">' + titleText + '</span>' +
180
+ '<span class="govuk-visually-hidden gem-c-step-nav__section-heading-divider">, </span>' +
181
+ '</span>' +
188
182
  '</button>' +
189
183
  '</span>'
190
184
  }
@@ -358,12 +352,18 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
358
352
 
359
353
  Gemstepnav.prototype.setShowHideAllText = function () {
360
354
  var shownSteps = this.$module.querySelectorAll('.step-is-shown').length
361
-
355
+ var showAllChevon = this.$module.showOrHideAllButton.querySelector('.js-step-controls-button-icon')
356
+ var showAllButtonText = this.$module.showOrHideAllButton.querySelector('.js-step-controls-button-text')
362
357
  // Find out if the number of is-opens == total number of steps
363
358
  var shownStepsIsTotalSteps = shownSteps === this.$module.totalSteps
364
359
 
365
- this.$module.showOrHideAllButton.querySelector('.js-step-controls-button-text').innerHTML = shownStepsIsTotalSteps ? this.$module.actions.hideAllText : this.$module.actions.showAllText
366
- this.$module.showOrHideAllButton.querySelector('.js-step-controls-button-icon').innerHTML = shownStepsIsTotalSteps ? this.$module.upChevronSvg : this.$module.downChevronSvg
360
+ if (shownStepsIsTotalSteps) {
361
+ showAllButtonText.innerHTML = this.$module.actions.hideAllText
362
+ showAllChevon.classList.remove('gem-c-step-nav__chevron--down')
363
+ } else {
364
+ showAllButtonText.innerHTML = this.$module.actions.showAllText
365
+ showAllChevon.classList.add('gem-c-step-nav__chevron--down')
366
+ }
367
367
  }
368
368
 
369
369
  Gemstepnav.prototype.StepView = function (stepElement, $module) {
@@ -391,19 +391,22 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
391
391
  }
392
392
 
393
393
  this.setIsShown = function (isShown) {
394
+ var toggleLink = this.stepElement.querySelectorAll('.js-toggle-link')[0]
395
+ var toggleLinkText = toggleLink.querySelector('.js-toggle-link-text')
396
+ var stepChevron = toggleLink.querySelector('.js-toggle-link-icon')
397
+
394
398
  if (isShown) {
395
399
  this.stepElement.classList.add('step-is-shown')
396
400
  this.stepContent.classList.remove('js-hidden')
401
+ toggleLinkText.innerHTML = this.hideText
402
+ stepChevron.classList.remove('gem-c-step-nav__chevron--down')
397
403
  } else {
398
404
  this.stepElement.classList.remove('step-is-shown')
399
405
  this.stepContent.classList.add('js-hidden')
406
+ toggleLinkText.innerHTML = this.showText
407
+ stepChevron.classList.add('gem-c-step-nav__chevron--down')
400
408
  }
401
-
402
409
  this.titleButton.setAttribute('aria-expanded', isShown)
403
- var showHideText = this.stepElement.querySelectorAll('.js-toggle-link')[0]
404
-
405
- showHideText.querySelector('.js-toggle-link-text').innerHTML = isShown ? this.hideText : this.showText
406
- showHideText.querySelector('.js-toggle-link-icon').innerHTML = isShown ? this.upChevronSvg : this.downChevronSvg
407
410
  }
408
411
 
409
412
  this.isShown = function () {
@@ -2,4 +2,4 @@
2
2
  // = require govuk/components/tabs/tabs.js
3
3
  window.GOVUK = window.GOVUK || {}
4
4
  window.GOVUK.Modules = window.GOVUK.Modules || {}
5
- window.GOVUK.Modules.GovukTabs = window.GOVUKFrontend
5
+ window.GOVUK.Modules.GovukTabs = window.GOVUKFrontend.Tabs
@@ -24,7 +24,8 @@ window.GOVUK = window.GOVUK || {};
24
24
 
25
25
  for (var i = 0; i < $barcharts.length; i++) {
26
26
  var $table = $barcharts[i]
27
- new GOVUK.Modules.MagnaCharta().start($table, { toggleText: 'Change between chart and table' })
27
+ var magna = new GOVUK.Modules.MagnaCharta($table, { toggleText: 'Change between chart and table' })
28
+ magna.init()
28
29
  $table.className = $table.className + ' js-barchart-table-init'
29
30
  }
30
31
  }