govuk_publishing_components 29.10.0 → 29.12.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +16 -5
- data/app/assets/javascripts/govuk_publishing_components/analytics/custom-dimensions.js +1 -1
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/gtm-click-tracking.js +51 -24
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/gtm-page-views.js +98 -0
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4.js +3 -0
- data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +28 -1
- data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-measurer.js +2 -2
- data/app/assets/stylesheets/govuk_publishing_components/_all_components_print.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_organisation-logo.scss +4 -0
- data/app/controllers/govuk_publishing_components/audit_controller.rb +0 -1
- data/app/models/govuk_publishing_components/audit_comparer.rb +0 -1
- data/app/views/govuk_publishing_components/components/_accordion.html.erb +7 -5
- data/app/views/govuk_publishing_components/components/_attachment.html.erb +1 -3
- data/app/views/govuk_publishing_components/components/_character_count.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_date_input.html.erb +2 -3
- data/app/views/govuk_publishing_components/components/_error_alert.html.erb +6 -3
- data/app/views/govuk_publishing_components/components/_input.html.erb +0 -2
- data/app/views/govuk_publishing_components/components/_layout_footer.html.erb +3 -3
- data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +3 -8
- data/app/views/govuk_publishing_components/components/docs/accordion.yml +22 -13
- data/app/views/govuk_publishing_components/components/docs/attachment.yml +0 -11
- data/app/views/govuk_publishing_components/components/docs/date_input.yml +7 -0
- data/app/views/govuk_publishing_components/components/docs/error_alert.yml +4 -0
- data/lib/govuk_publishing_components/presenters/attachment_helper.rb +0 -20
- data/lib/govuk_publishing_components/presenters/meta_tags.rb +10 -1
- data/lib/govuk_publishing_components/presenters/public_layout_helper.rb +1 -1
- data/lib/govuk_publishing_components/version.rb +1 -1
- metadata +4 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 4334fdd441cbca8d9fac8dfa8fd49478fd01cd847eb29707872abf0dd8c523d1
|
|
4
|
+
data.tar.gz: fe3f84de2e16d964fb9e7567ce52e8509258f833cc291fee28f54be4c4b8bd8c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: e6776dd162047045dbad8f70cda8d7eae8cc8e66321d607f614daf49c410d29b40c8cf718c6c04c27756bfa05382a58fe70b94633a49cbce7e4bbd5934006c7f
|
|
7
|
+
data.tar.gz: d9411dfa23e431152880d95f455d42d6ac326cae14eddb0f905dcdef5a68e1b19b9affb3407e9c6052ed5f813131ec5cf68a8398d0899bcd150bb35bf0ad85aa
|
data/README.md
CHANGED
|
@@ -35,19 +35,30 @@ yarn run jasmine:browser
|
|
|
35
35
|
yarn run jasmine:ci
|
|
36
36
|
```
|
|
37
37
|
|
|
38
|
-
###
|
|
38
|
+
### Using the gem
|
|
39
39
|
|
|
40
40
|
- [Install and use this gem](docs/install-and-use.md)
|
|
41
41
|
- [Use a component in your application](docs/use-components.md)
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
42
|
+
|
|
43
|
+
### Managing the gem
|
|
44
|
+
|
|
45
45
|
- [Publish/release a new version of the gem](docs/publishing-to-rubygems.md)
|
|
46
46
|
- [Keep this gem in sync with the Design System](docs/upgrade-govuk-frontend.md)
|
|
47
|
-
- [
|
|
47
|
+
- [Move a component from an application to the gem](docs/moving-components-upstream-into-this-gem.md)
|
|
48
|
+
|
|
49
|
+
### Making components
|
|
50
|
+
|
|
51
|
+
- [Generate a new component](docs/generate-a-new-component.md)
|
|
48
52
|
- [Component conventions](docs/component_conventions.md)
|
|
49
53
|
- [Component principles](docs/component_principles.md)
|
|
54
|
+
|
|
55
|
+
### Further documentation
|
|
56
|
+
|
|
57
|
+
- [Testing a component](docs/testing-components.md)
|
|
50
58
|
- [Component auditing](docs/auditing.md)
|
|
59
|
+
- [Code documentation on rubydoc.info](http://www.rubydoc.info/gems/govuk_publishing_components)
|
|
60
|
+
|
|
61
|
+
More documentation can be found in the [docs directory](docs/).
|
|
51
62
|
|
|
52
63
|
## Licence
|
|
53
64
|
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
'taxon-slugs': { dimension: 58, defaultValue: 'other' },
|
|
65
65
|
'taxon-ids': { dimension: 59, defaultValue: 'other' },
|
|
66
66
|
'content-has-history': { dimension: 39, defaultValue: 'false' },
|
|
67
|
-
'publishing-
|
|
67
|
+
'publishing-app': { dimension: 89 },
|
|
68
68
|
'brexit-audience': { dimension: 112 },
|
|
69
69
|
'brexit-superbreadcrumb': { dimension: 111 },
|
|
70
70
|
stepnavs: { dimension: 96 },
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
// = require govuk/vendor/polyfills/Element/prototype/closest.js
|
|
1
2
|
window.GOVUK = window.GOVUK || {}
|
|
2
3
|
window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
3
4
|
|
|
@@ -10,38 +11,64 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
|
10
11
|
}
|
|
11
12
|
|
|
12
13
|
GtmClickTracking.prototype.init = function () {
|
|
13
|
-
|
|
14
|
-
if (!this.module.getAttribute(this.trackingTrigger)) {
|
|
15
|
-
trackClicksOn = this.module.querySelectorAll('[' + this.trackingTrigger + ']')
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
for (var i = 0; i < trackClicksOn.length; i++) {
|
|
19
|
-
trackClicksOn[i].addEventListener('click', this.trackClick.bind(this))
|
|
20
|
-
}
|
|
14
|
+
this.module.addEventListener('click', this.trackClick.bind(this), true) // useCapture must be true
|
|
21
15
|
}
|
|
22
16
|
|
|
23
17
|
GtmClickTracking.prototype.trackClick = function (event) {
|
|
24
18
|
if (window.dataLayer) {
|
|
25
|
-
var target = event.
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
19
|
+
var target = this.findTrackingAttributes(event.target)
|
|
20
|
+
if (target) {
|
|
21
|
+
var data = {
|
|
22
|
+
event: 'analytics',
|
|
23
|
+
event_name: target.getAttribute('data-gtm-event-name'),
|
|
24
|
+
// get entire URL apart from domain
|
|
25
|
+
link_url: window.location.href.substring(window.location.origin.length),
|
|
26
|
+
ui: JSON.parse(target.getAttribute('data-gtm-attributes')) || {}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Ensure it only tracks aria-expanded in an accordion element, instead of in any child of the clicked element
|
|
30
|
+
if (target.closest('.gem-c-accordion')) {
|
|
31
|
+
var ariaExpanded = this.getClosestAttribute(target, 'aria-expanded')
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
/*
|
|
35
|
+
the details component uses an 'open' attribute instead of aria-expanded, so we need to check if we're on a details component.
|
|
36
|
+
since details deletes the 'open' attribute when closed, we need this boolean, otherwise every element which
|
|
37
|
+
doesn't contain an 'open' attr would be pushed to gtm as a closed element.
|
|
38
|
+
*/
|
|
39
|
+
var detailsElement = target.closest('details')
|
|
40
|
+
|
|
41
|
+
if (ariaExpanded) {
|
|
42
|
+
data.ui.text = data.ui.text || target.innerText
|
|
43
|
+
data.ui.action = (ariaExpanded === 'false') ? 'opened' : 'closed'
|
|
44
|
+
} else if (detailsElement) {
|
|
45
|
+
data.ui.text = data.ui.text || detailsElement.textContent
|
|
46
|
+
var openAttribute = detailsElement.getAttribute('open')
|
|
47
|
+
data.ui.action = (openAttribute == null) ? 'opened' : 'closed'
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
window.dataLayer.push(data)
|
|
36
51
|
}
|
|
37
|
-
window.dataLayer.push(data)
|
|
38
52
|
}
|
|
39
53
|
}
|
|
40
54
|
|
|
41
|
-
GtmClickTracking.prototype.
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
55
|
+
GtmClickTracking.prototype.findTrackingAttributes = function (clicked) {
|
|
56
|
+
if (clicked.hasAttribute('[' + this.trackingTrigger + ']')) {
|
|
57
|
+
return clicked
|
|
58
|
+
} else {
|
|
59
|
+
return clicked.closest('[' + this.trackingTrigger + ']')
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// check if an attribute exists or contains the attribute
|
|
64
|
+
GtmClickTracking.prototype.getClosestAttribute = function (clicked, attribute) {
|
|
65
|
+
var isAttributeOnElement = clicked.getAttribute(attribute)
|
|
66
|
+
var containsAttribute = clicked.querySelector('[' + attribute + ']')
|
|
67
|
+
|
|
68
|
+
if (isAttributeOnElement || isAttributeOnElement === '') { // checks for "" as some attribute names can contain no value making them falsy
|
|
69
|
+
return isAttributeOnElement
|
|
70
|
+
} else if (containsAttribute) {
|
|
71
|
+
return containsAttribute.getAttribute(attribute)
|
|
45
72
|
}
|
|
46
73
|
}
|
|
47
74
|
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
;(function (global) {
|
|
2
|
+
'use strict'
|
|
3
|
+
|
|
4
|
+
var GOVUK = global.GOVUK || {}
|
|
5
|
+
|
|
6
|
+
GOVUK.Gtm = {
|
|
7
|
+
sendPageView: function () {
|
|
8
|
+
if (window.dataLayer) {
|
|
9
|
+
var data = {
|
|
10
|
+
event: 'config_ready',
|
|
11
|
+
page: {
|
|
12
|
+
location: this.getLocation(),
|
|
13
|
+
referrer: this.getReferrer(),
|
|
14
|
+
title: this.getTitle(),
|
|
15
|
+
status_code: this.getStatusCode()
|
|
16
|
+
},
|
|
17
|
+
publishing: {
|
|
18
|
+
document_type: this.getMetaContent('format'),
|
|
19
|
+
publishing_app: this.getMetaContent('publishing-app'),
|
|
20
|
+
rendering_app: this.getMetaContent('rendering-app'),
|
|
21
|
+
schema_name: this.getMetaContent('schema-name'),
|
|
22
|
+
content_id: this.getMetaContent('content-id')
|
|
23
|
+
},
|
|
24
|
+
taxonomy: {
|
|
25
|
+
section: this.getMetaContent('section'),
|
|
26
|
+
taxon_slug: this.getMetaContent('taxon-slug'),
|
|
27
|
+
taxon_id: this.getMetaContent('taxon-id'),
|
|
28
|
+
themes: this.getMetaContent('themes'),
|
|
29
|
+
taxon_slugs: this.getMetaContent('taxon-slugs'),
|
|
30
|
+
taxon_ids: this.getMetaContent('taxon-ids')
|
|
31
|
+
},
|
|
32
|
+
content: {
|
|
33
|
+
language: this.getLanguage(),
|
|
34
|
+
history: this.getHistory(),
|
|
35
|
+
withdrawn: this.getWithDrawn(),
|
|
36
|
+
first_published_at: this.getMetaContent('first-published-at'),
|
|
37
|
+
updated_at: this.getMetaContent('updated-at'),
|
|
38
|
+
public_updated_at: this.getMetaContent('public-updated-at'),
|
|
39
|
+
publishing_government: this.getMetaContent('publishing-government'),
|
|
40
|
+
political_status: this.getMetaContent('political-status'),
|
|
41
|
+
primary_publishing_organisation: this.getMetaContent('primary-publishing-organisation'),
|
|
42
|
+
organisations: this.getMetaContent('analytics:organisations'),
|
|
43
|
+
world_locations: this.getMetaContent('analytics:world-locations')
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
window.dataLayer.push(data)
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
|
|
50
|
+
getLocation: function () {
|
|
51
|
+
return document.location.href
|
|
52
|
+
},
|
|
53
|
+
|
|
54
|
+
getReferrer: function () {
|
|
55
|
+
return document.referrer
|
|
56
|
+
},
|
|
57
|
+
|
|
58
|
+
getTitle: function () {
|
|
59
|
+
return document.title
|
|
60
|
+
},
|
|
61
|
+
|
|
62
|
+
// window.httpStatusCode is set in the source of the error page in static
|
|
63
|
+
// https://github.com/alphagov/static/blob/main/app/views/root/_error_page.html.erb#L32
|
|
64
|
+
getStatusCode: function () {
|
|
65
|
+
if (window.httpStatusCode) {
|
|
66
|
+
return window.httpStatusCode
|
|
67
|
+
} else {
|
|
68
|
+
return 200
|
|
69
|
+
}
|
|
70
|
+
},
|
|
71
|
+
|
|
72
|
+
getMetaContent: function (name) {
|
|
73
|
+
var tag = document.querySelector('meta[name="govuk:' + name + '"]')
|
|
74
|
+
if (tag) {
|
|
75
|
+
return tag.getAttribute('content')
|
|
76
|
+
} else {
|
|
77
|
+
return 'n/a'
|
|
78
|
+
}
|
|
79
|
+
},
|
|
80
|
+
|
|
81
|
+
getLanguage: function () {
|
|
82
|
+
var html = document.querySelector('html')
|
|
83
|
+
return html.getAttribute('lang') || 'n/a'
|
|
84
|
+
},
|
|
85
|
+
|
|
86
|
+
getHistory: function () {
|
|
87
|
+
var history = this.getMetaContent('content-has-history')
|
|
88
|
+
return (history === 'true') ? 'true' : 'false'
|
|
89
|
+
},
|
|
90
|
+
|
|
91
|
+
getWithDrawn: function () {
|
|
92
|
+
var withdrawn = this.getMetaContent('withdrawn')
|
|
93
|
+
return (withdrawn === 'withdrawn') ? 'true' : 'false'
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
global.GOVUK = GOVUK
|
|
98
|
+
})(window)
|
|
@@ -45,6 +45,21 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
|
|
|
45
45
|
if (this.$module.getAttribute('data-track-sections') === 'true') {
|
|
46
46
|
this.addEventListenerSections()
|
|
47
47
|
}
|
|
48
|
+
|
|
49
|
+
// look for data attributes to put onto the 'show/hide all' link
|
|
50
|
+
var showAllAttributes = this.$module.getAttribute('data-show-all-attributes')
|
|
51
|
+
if (showAllAttributes) {
|
|
52
|
+
try {
|
|
53
|
+
var showAll = this.$module.querySelector('.' + this.showAllControls)
|
|
54
|
+
var values = JSON.parse(showAllAttributes)
|
|
55
|
+
var keys = Object.keys(values)
|
|
56
|
+
for (var i = 0; i < keys.length; i++) {
|
|
57
|
+
showAll.setAttribute('data-' + keys[i], values[keys[i]])
|
|
58
|
+
}
|
|
59
|
+
} catch (e) {
|
|
60
|
+
console.error('Could not read accordion data attributes error: ' + e.message, window.location)
|
|
61
|
+
}
|
|
62
|
+
}
|
|
48
63
|
}
|
|
49
64
|
|
|
50
65
|
// Navigate to and open accordions with anchored content on page load if a hash is present
|
|
@@ -76,7 +91,7 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
|
|
|
76
91
|
var $expanded = this.getContainingSection($section)
|
|
77
92
|
var $parent = $header.parentElement
|
|
78
93
|
|
|
79
|
-
//
|
|
94
|
+
// government-frontend features (inherited from manuals-frontend):
|
|
80
95
|
// Should the target anchor link be within the same page, open section - navigate normally
|
|
81
96
|
// Should the target anchor link be within a different, closed section, open this section
|
|
82
97
|
// Should the target anchor link be within a different page and different, closed section open this section
|
|
@@ -129,6 +144,18 @@ window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
|
|
|
129
144
|
var action = expanded ? 'accordionOpened' : 'accordionClosed'
|
|
130
145
|
var options = { transport: 'beacon', label: label }
|
|
131
146
|
|
|
147
|
+
// optional parameters are added to the parent
|
|
148
|
+
// heading not the button that is clicked
|
|
149
|
+
var extraOptions = section.parentElement && section.parentElement.getAttribute('data-track-options')
|
|
150
|
+
|
|
151
|
+
// this uses the same logic as track-click.js handleClick
|
|
152
|
+
// means we can add a custom dimensions on click
|
|
153
|
+
// (such as the index of the accordion on the page)
|
|
154
|
+
if (extraOptions) {
|
|
155
|
+
extraOptions = JSON.parse(extraOptions)
|
|
156
|
+
for (var k in extraOptions) options[k] = extraOptions[k]
|
|
157
|
+
}
|
|
158
|
+
|
|
132
159
|
if (window.GOVUK.analytics && window.GOVUK.analytics.trackEvent) {
|
|
133
160
|
window.GOVUK.analytics.trackEvent('pageElementInteraction', action, options)
|
|
134
161
|
}
|
|
@@ -175,8 +175,8 @@ if (
|
|
|
175
175
|
var measureHTTPProtocol = function () {
|
|
176
176
|
var getEntriesByType = performance.getEntriesByType('navigation')
|
|
177
177
|
|
|
178
|
-
if (getEntriesByType.length > 0) {
|
|
179
|
-
var httpProtocol =
|
|
178
|
+
if (typeof getEntriesByType !== 'undefined' && getEntriesByType.length > 0) {
|
|
179
|
+
var httpProtocol = getEntriesByType[0].nextHopProtocol
|
|
180
180
|
LUX.addData("http-protocol", httpProtocol)
|
|
181
181
|
}
|
|
182
182
|
}
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
@import "components/print/govspeak-html-publication";
|
|
11
11
|
@import "components/print/govspeak";
|
|
12
12
|
@import "components/print/layout-super-navigation-header";
|
|
13
|
+
@import "components/print/organisation-logo";
|
|
13
14
|
@import "components/print/step-by-step-nav-header";
|
|
14
15
|
@import "components/print/step-by-step-nav";
|
|
15
16
|
@import "components/print/textarea";
|
|
@@ -27,6 +27,9 @@
|
|
|
27
27
|
data_attributes[:track_show_all_clicks] = track_show_all_clicks
|
|
28
28
|
data_attributes[:track_sections] = track_sections
|
|
29
29
|
|
|
30
|
+
data_attributes_show_all ||= nil
|
|
31
|
+
data_attributes[:show_all_attributes] = data_attributes_show_all if data_attributes_show_all
|
|
32
|
+
|
|
30
33
|
translations.each do |key, translation|
|
|
31
34
|
locales[key] = shared_helper.t_locale(translation)
|
|
32
35
|
data_attributes[key] = t(translation)
|
|
@@ -47,8 +50,8 @@
|
|
|
47
50
|
<%= tag.div(class: accordion_classes, id: id, data: data_attributes) do %>
|
|
48
51
|
<% items.each_with_index do |item, i| %>
|
|
49
52
|
<%
|
|
50
|
-
# The GOVUK Frontend JavaScript for this component
|
|
51
|
-
# uses a loop starting at 1 for accessing heading ID values,
|
|
53
|
+
# The GOVUK Frontend JavaScript for this component
|
|
54
|
+
# uses a loop starting at 1 for accessing heading ID values,
|
|
52
55
|
# hence the increment below
|
|
53
56
|
index = i + 1
|
|
54
57
|
|
|
@@ -65,11 +68,10 @@
|
|
|
65
68
|
content_tag(
|
|
66
69
|
shared_helper.get_heading_level,
|
|
67
70
|
content_tag(
|
|
68
|
-
'span',
|
|
69
|
-
item[:heading][:text],
|
|
71
|
+
'span',
|
|
72
|
+
item[:heading][:text],
|
|
70
73
|
class: "govuk-accordion__section-button",
|
|
71
74
|
id: "#{id}-heading-#{index}"
|
|
72
|
-
|
|
73
75
|
),
|
|
74
76
|
class: "govuk-accordion__section-heading",
|
|
75
77
|
id: item[:heading][:id],
|
|
@@ -83,9 +83,7 @@
|
|
|
83
83
|
<% end %>
|
|
84
84
|
<% end %>
|
|
85
85
|
|
|
86
|
-
<% if attachment.
|
|
87
|
-
<%= link_to "Request an accessible format of this document", "/contact/govuk/request-accessible-format?content_id=#{attachment.owning_document_content_id}&attachment_id=#{attachment.attachment_id}", class: "govuk-link" %>
|
|
88
|
-
<% elsif attachment.alternative_format_contact_email %>
|
|
86
|
+
<% if attachment.alternative_format_contact_email %>
|
|
89
87
|
<%= tag.p t("components.attachment.request_format_text"), class: "gem-c-attachment__metadata" %>
|
|
90
88
|
<%= render "govuk_publishing_components/components/details", {
|
|
91
89
|
title: t("components.attachment.request_format_cta")
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
|
|
18
18
|
<%= render "govuk_publishing_components/components/textarea", { id: id, character_count: true }.merge(textarea.symbolize_keys) %>
|
|
19
19
|
|
|
20
|
-
<div id="<%= id %>-info" class="govuk-hint govuk-character-count__message"
|
|
20
|
+
<div id="<%= id %>-info" class="govuk-hint govuk-character-count__message">
|
|
21
21
|
<%= t("components.character_count.body", number: maxlength || maxwords, type: maxwords ? t("components.character_count.type.words") : t("components.character_count.type.characters")) %>
|
|
22
22
|
</div>
|
|
23
23
|
<% end %>
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
{ :name => "month", :width => 2 },
|
|
7
7
|
{ :name => "year", :width => 4 }
|
|
8
8
|
]
|
|
9
|
-
|
|
9
|
+
autocomplete_date_of_birth ||= nil
|
|
10
10
|
legend_text ||= nil
|
|
11
11
|
hint ||= nil
|
|
12
12
|
error_message ||= nil
|
|
@@ -29,7 +29,6 @@
|
|
|
29
29
|
aria_described_by << describedby if describedby
|
|
30
30
|
aria_described_by = aria_described_by.join(" ")
|
|
31
31
|
end
|
|
32
|
-
|
|
33
32
|
%>
|
|
34
33
|
|
|
35
34
|
<%= content_tag :div, class: form_group_css_classes do %>
|
|
@@ -65,7 +64,7 @@
|
|
|
65
64
|
id: item[:id],
|
|
66
65
|
type: "number",
|
|
67
66
|
data: item[:data],
|
|
68
|
-
autocomplete: item[:
|
|
67
|
+
autocomplete: autocomplete_date_of_birth ? "bday-#{item[:name]}" : nil
|
|
69
68
|
} %>
|
|
70
69
|
<% end %>
|
|
71
70
|
<% end %>
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
<%
|
|
2
|
-
|
|
1
|
+
<%
|
|
2
|
+
id ||= nil
|
|
3
|
+
description ||= nil
|
|
4
|
+
data_attributes ||= {}
|
|
5
|
+
%>
|
|
3
6
|
|
|
4
|
-
<%= tag.div class: "gem-c-error-alert", data: { module: "initial-focus" }.merge(data_attributes), role: "alert", tabindex: "-1" do %>
|
|
7
|
+
<%= tag.div id: id, class: "gem-c-error-alert", data: { module: "initial-focus" }.merge(data_attributes), role: "alert", tabindex: "-1" do %>
|
|
5
8
|
<% if description.present? %>
|
|
6
9
|
<%= tag.h2 message, class: "gem-c-error-summary__title" %>
|
|
7
10
|
<%= tag.div description, class: "gem-c-error-summary__body" %>
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
classes << "gem-c-layout-footer--border" if with_border
|
|
7
7
|
%>
|
|
8
8
|
<%= tag.footer class: classes, role: "contentinfo" do %>
|
|
9
|
-
<div class="govuk-width-container"
|
|
9
|
+
<div class="govuk-width-container">
|
|
10
10
|
<% if navigation.any? %>
|
|
11
|
-
<div class="govuk-footer__navigation">
|
|
11
|
+
<div class="govuk-footer__navigation" data-module="gem-track-click" data-track-links-only>
|
|
12
12
|
<% navigation.each do |item| %>
|
|
13
13
|
<% if item[:items] %>
|
|
14
14
|
<%
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
<div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
|
|
61
61
|
<% if meta.any? %>
|
|
62
62
|
<h2 class="govuk-visually-hidden"><%= t("components.layout_footer.support_links") %></h2>
|
|
63
|
-
<ul class="govuk-footer__inline-list govuk-!-display-none-print">
|
|
63
|
+
<ul class="govuk-footer__inline-list govuk-!-display-none-print" data-module="gem-track-click" data-track-links-only>
|
|
64
64
|
<% meta[:items].each do |item| %>
|
|
65
65
|
<li class="govuk-footer__inline-list-item">
|
|
66
66
|
<%
|
data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb
CHANGED
|
@@ -15,12 +15,11 @@
|
|
|
15
15
|
hide_navigation_menu_text = t("components.layout_super_navigation_header.menu_toggle_label.hide", :label => "navigation")
|
|
16
16
|
show_navigation_menu_text = t("components.layout_super_navigation_header.menu_toggle_label.show", :label => "navigation")
|
|
17
17
|
%>
|
|
18
|
-
<header role="banner" class="gem-c-layout-super-navigation-header">
|
|
18
|
+
<header role="banner" class="gem-c-layout-super-navigation-header" data-module="gem-track-click" data-track-links-only>
|
|
19
19
|
<div class="gem-c-layout-super-navigation-header__container govuk-width-container govuk-clearfix">
|
|
20
20
|
<div class="gem-c-layout-super-navigation-header__header-logo">
|
|
21
21
|
<a
|
|
22
22
|
class="govuk-header__link govuk-header__link--homepage"
|
|
23
|
-
data-module="gem-track-click"
|
|
24
23
|
data-track-action="logoLink"
|
|
25
24
|
data-track-category="headerClicked"
|
|
26
25
|
data-track-label="<%= logo_link %>"
|
|
@@ -100,7 +99,6 @@
|
|
|
100
99
|
<%= link_to link[:label], link[:href], {
|
|
101
100
|
class: "gem-c-layout-super-navigation-header__navigation-item-link",
|
|
102
101
|
data: {
|
|
103
|
-
module: "gem-track-click",
|
|
104
102
|
track_action: "#{tracking_label}Link",
|
|
105
103
|
track_category: "headerClicked",
|
|
106
104
|
track_label: link[:href],
|
|
@@ -141,9 +139,9 @@
|
|
|
141
139
|
<div class="govuk-grid-row">
|
|
142
140
|
<div class="govuk-grid-column-one-third-from-desktop">
|
|
143
141
|
<% if link[:description].present? %>
|
|
144
|
-
<
|
|
142
|
+
<h3 class="govuk-body-l gem-c-layout-super-navigation-header__menu-description">
|
|
145
143
|
<%= link[:description] %>
|
|
146
|
-
</
|
|
144
|
+
</h3>
|
|
147
145
|
<% end %>
|
|
148
146
|
</div>
|
|
149
147
|
<div class="govuk-grid-column-two-thirds-from-desktop">
|
|
@@ -159,7 +157,6 @@
|
|
|
159
157
|
<%= link_to item[:label], item[:href], {
|
|
160
158
|
class: link_classes,
|
|
161
159
|
data: {
|
|
162
|
-
module: "gem-track-click",
|
|
163
160
|
track_action: "#{tracking_label}Link",
|
|
164
161
|
track_category: "headerClicked",
|
|
165
162
|
track_label: item[:href],
|
|
@@ -183,7 +180,6 @@
|
|
|
183
180
|
"gem-c-layout-super-navigation-header__navigation-second-footer-link",
|
|
184
181
|
],
|
|
185
182
|
data: {
|
|
186
|
-
module: "gem-track-click",
|
|
187
183
|
track_action: "#{tracking_label}Link",
|
|
188
184
|
track_category: "headerClicked",
|
|
189
185
|
track_label: item[:href],
|
|
@@ -312,7 +308,6 @@
|
|
|
312
308
|
"gem-c-layout-super-navigation-header__popular-link",
|
|
313
309
|
],
|
|
314
310
|
data: {
|
|
315
|
-
module: "gem-track-click",
|
|
316
311
|
track_action: "popularLink",
|
|
317
312
|
track_category: "headerClicked",
|
|
318
313
|
track_label: popular_link[:href],
|
|
@@ -189,10 +189,14 @@ examples:
|
|
|
189
189
|
|
|
190
190
|
Each item can also have a `data_attributes` hash. These `data_attributes` are placed on the `button` that triggers the opening and closing - useful for differentiating between each section of the accordion.
|
|
191
191
|
|
|
192
|
+
Data attributes can also be added to the 'Show/hide all' link using the `data_attributes_show_all` option, primarily where custom tracking is required. These attributes are read from the accordion markup and then added to the link by JavaScript (which is how the link is created).
|
|
192
193
|
data:
|
|
193
194
|
data_attributes:
|
|
194
195
|
gtm: gtm-accordion
|
|
195
196
|
ga: ga-accordion
|
|
197
|
+
data_attributes_show_all:
|
|
198
|
+
gtm-event-name: example
|
|
199
|
+
gtm-attributes: "{ 'ui': { 'type': 'type value', 'section': 'section value' } }"
|
|
196
200
|
items:
|
|
197
201
|
- heading:
|
|
198
202
|
text: Writing well for the web
|
|
@@ -277,13 +281,13 @@ examples:
|
|
|
277
281
|
html: <p class="govuk-body">This is the content for How people read.</p>
|
|
278
282
|
with_the_anchor_link_navigation:
|
|
279
283
|
description: |
|
|
280
|
-
Some apps require custom `id`s per accordion section heading. Custom `id`s allow you to link section headings, sometimes across multiple pages.
|
|
281
|
-
|
|
284
|
+
Some apps require custom `id`s per accordion section heading. Custom `id`s allow you to link section headings, sometimes across multiple pages.
|
|
285
|
+
|
|
282
286
|
For example on [guidance pages for Content Designers, referred to as "manuals",](https://www.gov.uk/guidance/how-to-publish-on-gov-uk/creating-and-updating-pages#associations) each manual includes multiple sets of accordions and will reference between specific sections to easily access content.
|
|
283
287
|
|
|
284
|
-
Using the same rules, custom `id`s automatically open accordions when users click within another accordion that links to either
|
|
288
|
+
Using the same rules, custom `id`s automatically open accordions when users click within another accordion that links to either
|
|
285
289
|
|
|
286
|
-
* the `id` of an accordion section heading
|
|
290
|
+
* the `id` of an accordion section heading
|
|
287
291
|
* an `id` within the content of an accordion (this will also automatically navigate to and open accordions on page load)
|
|
288
292
|
|
|
289
293
|
This feature will only be used if the `anchor_navigation` flag is passed as `true`. This mitigates performance risk from event listeners on a large number of links.
|
|
@@ -294,13 +298,13 @@ examples:
|
|
|
294
298
|
items:
|
|
295
299
|
- heading:
|
|
296
300
|
text: Writing well for the web
|
|
297
|
-
id: writing-well-for-the-web
|
|
301
|
+
id: writing-well-for-the-web-1
|
|
298
302
|
content:
|
|
299
|
-
html: <p class="govuk-body">This is content for accordion 1 of 2</p><p class="govuk-body">This content contains a <a href="#anchor-nav-test" class="govuk-link">link</a></p>
|
|
303
|
+
html: <p class="govuk-body">This is content for accordion 1 of 2</p><p class="govuk-body">This content contains a <a href="#anchor-nav-test-1" class="govuk-link">link</a></p>
|
|
300
304
|
- heading:
|
|
301
305
|
text: Writing well for specialists
|
|
302
306
|
content:
|
|
303
|
-
html: <p class="govuk-body" id="anchor-nav-test">This is content for accordion 2 of 2</p>
|
|
307
|
+
html: <p class="govuk-body" id="anchor-nav-test-1">This is content for accordion 2 of 2</p>
|
|
304
308
|
- heading:
|
|
305
309
|
text: Know your audience
|
|
306
310
|
content:
|
|
@@ -312,33 +316,38 @@ examples:
|
|
|
312
316
|
with_track_show_all_clicks:
|
|
313
317
|
description: |
|
|
314
318
|
To switch on Google Analytics for the "Show all sections" button on click, pass `track_show_all_clicks: true` the values passed on open will be
|
|
315
|
-
`Event Action: accordionOpened` `Event Category: pageElementInteraction` `Event Label: Show all sections`
|
|
319
|
+
`Event Action: accordionOpened` `Event Category: pageElementInteraction` `Event Label: Show all sections`
|
|
316
320
|
data:
|
|
317
321
|
track_show_all_clicks: true
|
|
318
322
|
items:
|
|
319
323
|
- heading:
|
|
320
324
|
text: Writing well for the web
|
|
321
|
-
id: writing-well-for-the-web
|
|
325
|
+
id: writing-well-for-the-web-2
|
|
322
326
|
content:
|
|
323
|
-
html: <p class="govuk-body">This is content for accordion 1 of 2</p
|
|
327
|
+
html: <p class="govuk-body">This is content for accordion 1 of 2</p>
|
|
324
328
|
- heading:
|
|
325
329
|
text: Writing well for specialists
|
|
326
330
|
content:
|
|
327
|
-
html: <p class="govuk-body"
|
|
331
|
+
html: <p class="govuk-body">This is content for accordion 2 of 2</p>
|
|
328
332
|
with_track_sections:
|
|
329
333
|
description: |
|
|
330
334
|
To switch on Google Analytics for each section, on click, pass `track_sections: true` the values passed on open will be
|
|
331
335
|
`Event Action: accordionOpened` / `accordionClosed` `Event Category: pageElementInteraction` and the `Event Label` being the heading text.
|
|
332
|
-
|
|
336
|
+
|
|
337
|
+
If `track_options` in an item is set, then it is possible to pass a custom dimension when the section is clicked.
|
|
338
|
+
|
|
333
339
|
(`track_show_all_clicks: true` can be added to track the "Show all sections" button as well, if required)
|
|
334
340
|
data:
|
|
335
341
|
track_sections: true
|
|
336
342
|
items:
|
|
337
343
|
- heading:
|
|
338
344
|
text: Writing well for the web
|
|
339
|
-
id: writing-well-for-the-web
|
|
345
|
+
id: writing-well-for-the-web-3
|
|
340
346
|
content:
|
|
341
347
|
html: <p class="govuk-body">This is content for accordion 1 of 2</p><p class="govuk-body">This content contains a <a href="#anchor-nav-test" class="govuk-link">link</a></p>
|
|
348
|
+
data_attributes:
|
|
349
|
+
track_options:
|
|
350
|
+
dimension114: 1
|
|
342
351
|
- heading:
|
|
343
352
|
text: Writing well for specialists
|
|
344
353
|
content:
|
|
@@ -76,17 +76,6 @@ examples:
|
|
|
76
76
|
content_type: application/pdf
|
|
77
77
|
file_size: 20000
|
|
78
78
|
alternative_format_contact_email: defra.helpline@defra.gsi.gov.uk
|
|
79
|
-
with_link_to_request_accessible_format_form:
|
|
80
|
-
data:
|
|
81
|
-
attachment:
|
|
82
|
-
title: "Department for Transport information asset register"
|
|
83
|
-
url: https://assets.publishing.service.gov.uk/government/uploads/system/uploads/attachment_data/file/747661/department-for-transport-information-asset-register.csv
|
|
84
|
-
filename: department-for-transport-information-asset-register.csv
|
|
85
|
-
content_type: application/pdf
|
|
86
|
-
file_size: 20000
|
|
87
|
-
owning_document_content_id: 456_abc
|
|
88
|
-
attachment_id: 123
|
|
89
|
-
alternative_format_contact_email: govuk_publishing_components@example.com
|
|
90
79
|
with_data_attributes:
|
|
91
80
|
data:
|
|
92
81
|
attachment:
|
|
@@ -26,6 +26,13 @@ examples:
|
|
|
26
26
|
component as follows: `custom-name[day]`, `custom-name[month]`, `custom-name[year]`
|
|
27
27
|
data:
|
|
28
28
|
name: "dob"
|
|
29
|
+
with_autocomplete_for_date_of_birth_fields:
|
|
30
|
+
description: |
|
|
31
|
+
Use the `autocomplete_date_of_birth` option when you're asking for the user's date of birth. This supports browsers or tools that can autofill the information on a user's behalf if they've entered it previously.
|
|
32
|
+
|
|
33
|
+
Note that the option should only be passed to the component if the date of birth asked for is the date of birth of the person filling the form in and not asked for on behalf of someone else.
|
|
34
|
+
data:
|
|
35
|
+
autocomplete_date_of_birth: true
|
|
29
36
|
with_legend:
|
|
30
37
|
data:
|
|
31
38
|
legend_text: "What is your date of birth?"
|
|
@@ -1,13 +1,6 @@
|
|
|
1
1
|
module GovukPublishingComponents
|
|
2
2
|
module Presenters
|
|
3
3
|
class AttachmentHelper
|
|
4
|
-
# Various departments are taking part in a pilot to use a form
|
|
5
|
-
# rather than direct email for users to request accessible formats. When the pilot
|
|
6
|
-
# scheme is rolled out further this can be removed.
|
|
7
|
-
# Currently DfE, DWP and DVSA are participating in the pilot.
|
|
8
|
-
EMAILS_IN_ACCESSIBLE_FORMAT_REQUEST_PILOT = %w[govuk_publishing_components@example.com
|
|
9
|
-
alternative.formats@education.gov.uk].freeze
|
|
10
|
-
|
|
11
4
|
delegate :opendocument?, :document?, :spreadsheet?, to: :content_type
|
|
12
5
|
|
|
13
6
|
attr_reader :attachment_data
|
|
@@ -15,7 +8,6 @@ module GovukPublishingComponents
|
|
|
15
8
|
# Expects a hash of attachment data
|
|
16
9
|
# * title and url are required
|
|
17
10
|
# * content_type, filename, file_size, number of pages, alternative_format_contact_email can be provided
|
|
18
|
-
# * attachment_id and owning_document_content_id are required to use the accessible format request form
|
|
19
11
|
def initialize(attachment_data)
|
|
20
12
|
@attachment_data = attachment_data.with_indifferent_access
|
|
21
13
|
end
|
|
@@ -55,14 +47,6 @@ module GovukPublishingComponents
|
|
|
55
47
|
attachment_data[:alternative_format_contact_email]
|
|
56
48
|
end
|
|
57
49
|
|
|
58
|
-
def attachment_id
|
|
59
|
-
attachment_data[:attachment_id]
|
|
60
|
-
end
|
|
61
|
-
|
|
62
|
-
def owning_document_content_id
|
|
63
|
-
attachment_data[:owning_document_content_id]
|
|
64
|
-
end
|
|
65
|
-
|
|
66
50
|
def reference
|
|
67
51
|
reference = []
|
|
68
52
|
reference << "ISBN #{attachment_data[:isbn]}" if attachment_data[:isbn].present?
|
|
@@ -87,10 +71,6 @@ module GovukPublishingComponents
|
|
|
87
71
|
attachment_data[:command_paper_number].present? || attachment_data[:hoc_paper_number].present? || attachment_data[:unnumbered_command_paper].eql?(true) || attachment_data[:unnumbered_hoc_paper].eql?(true)
|
|
88
72
|
end
|
|
89
73
|
|
|
90
|
-
def display_accessible_format_request_form_link?
|
|
91
|
-
EMAILS_IN_ACCESSIBLE_FORMAT_REQUEST_PILOT.include?(alternative_format_contact_email) && owning_document_content_id.present? && attachment_id.present?
|
|
92
|
-
end
|
|
93
|
-
|
|
94
74
|
class SupportedContentType
|
|
95
75
|
attr_reader :content_type_data
|
|
96
76
|
|
|
@@ -27,9 +27,12 @@ module GovukPublishingComponents
|
|
|
27
27
|
|
|
28
28
|
private
|
|
29
29
|
|
|
30
|
+
# other meta tags are inserted by slimmer here:
|
|
31
|
+
# https://github.com/alphagov/slimmer/blob/82144be372aa4afc1f8ff30917c96c2ee3a47ed8/lib/slimmer/processors/metadata_inserter.rb#L15
|
|
30
32
|
def add_core_tags(meta_tags)
|
|
31
33
|
meta_tags["govuk:format"] = content_item[:document_type] if content_item[:document_type]
|
|
32
|
-
meta_tags["govuk:publishing-
|
|
34
|
+
meta_tags["govuk:publishing-app"] = content_item[:publishing_app] if content_item[:publishing_app]
|
|
35
|
+
meta_tags["govuk:rendering-app"] = content_item[:rendering_app] if content_item[:rendering_app]
|
|
33
36
|
meta_tags["govuk:schema-name"] = content_item[:schema_name] if content_item[:schema_name]
|
|
34
37
|
meta_tags["govuk:content-id"] = content_item[:content_id] if content_item[:content_id]
|
|
35
38
|
meta_tags["govuk:navigation-page-type"] = content_item[:navigation_page_type] if content_item[:navigation_page_type]
|
|
@@ -39,6 +42,12 @@ module GovukPublishingComponents
|
|
|
39
42
|
meta_tags["govuk:content-has-history"] = "true" if has_content_history?
|
|
40
43
|
meta_tags["govuk:static-analytics:strip-dates"] = "true" if should_strip_dates_pii?(content_item, local_assigns)
|
|
41
44
|
meta_tags["govuk:static-analytics:strip-postcodes"] = "true" if should_strip_postcode_pii?(content_item, local_assigns)
|
|
45
|
+
meta_tags["govuk:first-published-at"] = content_item[:first_published_at] if content_item[:first_published_at]
|
|
46
|
+
meta_tags["govuk:updated-at"] = content_item[:updated_at] if content_item[:updated_at]
|
|
47
|
+
meta_tags["govuk:public-updated-at"] = content_item[:public_updated_at] if content_item[:public_updated_at]
|
|
48
|
+
primary_publisher = content_item.dig(:links, :primary_publishing_organisation)
|
|
49
|
+
primary_publisher = primary_publisher.first[:title] unless primary_publisher.blank?
|
|
50
|
+
meta_tags["govuk:primary-publishing-organisation"] = primary_publisher unless primary_publisher.blank?
|
|
42
51
|
|
|
43
52
|
meta_tags
|
|
44
53
|
end
|
|
@@ -2,7 +2,7 @@ module GovukPublishingComponents
|
|
|
2
2
|
module Presenters
|
|
3
3
|
class PublicLayoutHelper
|
|
4
4
|
FOOTER_NAVIGATION_COLUMNS = [2, 1].freeze
|
|
5
|
-
FOOTER_TRACK_ACTIONS = %w[topicsLink
|
|
5
|
+
FOOTER_TRACK_ACTIONS = %w[topicsLink governmentactivityLink].freeze
|
|
6
6
|
FOOTER_META = {
|
|
7
7
|
items: [
|
|
8
8
|
{
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: govuk_publishing_components
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 29.
|
|
4
|
+
version: 29.12.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- GOV.UK Dev
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2022-
|
|
11
|
+
date: 2022-07-01 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: govuk_app_config
|
|
@@ -435,6 +435,7 @@ files:
|
|
|
435
435
|
- app/assets/javascripts/govuk_publishing_components/all_components.js
|
|
436
436
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4.js
|
|
437
437
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/gtm-click-tracking.js
|
|
438
|
+
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/gtm-page-views.js
|
|
438
439
|
- app/assets/javascripts/govuk_publishing_components/analytics.js
|
|
439
440
|
- app/assets/javascripts/govuk_publishing_components/analytics/analytics.js
|
|
440
441
|
- app/assets/javascripts/govuk_publishing_components/analytics/auto-scroll-tracker.js
|
|
@@ -1918,7 +1919,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
1918
1919
|
- !ruby/object:Gem::Version
|
|
1919
1920
|
version: '0'
|
|
1920
1921
|
requirements: []
|
|
1921
|
-
rubygems_version: 3.3.
|
|
1922
|
+
rubygems_version: 3.3.17
|
|
1922
1923
|
signing_key:
|
|
1923
1924
|
specification_version: 4
|
|
1924
1925
|
summary: A gem to document components in GOV.UK frontend applications
|