govuk_publishing_components 34.10.0 → 34.11.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-core.js +123 -10
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-ecommerce-tracker.js +17 -92
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js +12 -0
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-schemas.js +16 -0
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-smart-answer-results-tracker.js +57 -0
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js +2 -2
- data/app/assets/javascripts/govuk_publishing_components/analytics-ga4.js +1 -0
- data/app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js +0 -22
- data/app/assets/javascripts/govuk_publishing_components/lib/trigger-event.js +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +42 -94
- data/app/assets/stylesheets/govuk_publishing_components/govuk_frontend_support.scss +0 -9
- data/app/views/govuk_publishing_components/components/_breadcrumbs.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +207 -221
- data/app/views/govuk_publishing_components/components/docs/breadcrumbs.yml +1 -1
- data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb +8 -4
- data/lib/govuk_publishing_components/presenters/breadcrumbs.rb +6 -0
- data/lib/govuk_publishing_components/presenters/related_navigation_helper.rb +14 -9
- data/lib/govuk_publishing_components/version.rb +1 -1
- metadata +4 -3
data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb
CHANGED
|
@@ -22,55 +22,57 @@
|
|
|
22
22
|
navigation_links_length = navigation_links_length + popular_links.length
|
|
23
23
|
%>
|
|
24
24
|
<header role="banner" class="gem-c-layout-super-navigation-header" data-module="gem-track-click ga4-event-tracker ga4-link-tracker" data-track-links-only data-ga4-expandable>
|
|
25
|
-
<div class="gem-c-layout-super-navigation-header__container govuk-
|
|
26
|
-
<div class="
|
|
27
|
-
<
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
"
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
<path
|
|
59
|
-
d="M25 30.2c3.5 1.5 7.7-.2 9.1-3.7 1.5-3.6-.2-7.8-3.9-9.2-3.6-1.4-7.6.3-9.1 3.9-1.4 3.5.3 7.5 3.9 9zM9 39.5c3.6 1.5 7.8-.2 9.2-3.7 1.5-3.6-.2-7.8-3.9-9.1-3.6-1.5-7.6.2-9.1 3.8-1.4 3.5.3 7.5 3.8 9zM4.4 57.2c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.5-1.5-7.6.3-9.1 3.8-1.4 3.5.3 7.6 3.9 9.1zm38.3-21.4c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.6-1.5-7.6.3-9.1 3.8-1.3 3.6.4 7.7 3.9 9.1zm64.4-5.6c-3.6 1.5-7.8-.2-9.1-3.7-1.5-3.6.2-7.8 3.8-9.2 3.6-1.4 7.7.3 9.2 3.9 1.3 3.5-.4 7.5-3.9 9zm15.9 9.3c-3.6 1.5-7.7-.2-9.1-3.7-1.5-3.6.2-7.8 3.7-9.1 3.6-1.5 7.7.2 9.2 3.8 1.5 3.5-.3 7.5-3.8 9zm4.7 17.7c-3.6 1.5-7.8-.2-9.2-3.8-1.5-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.3 3.5-.4 7.6-3.9 9.1zM89.3 35.8c-3.6 1.5-7.8-.2-9.2-3.8-1.4-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.4 3.6-.3 7.7-3.9 9.1zM69.7 17.7l8.9 4.7V9.3l-8.9 2.8c-.2-.3-.5-.6-.9-.9L72.4 0H59.6l3.5 11.2c-.3.3-.6.5-.9.9l-8.8-2.8v13.1l8.8-4.7c.3.3.6.7.9.9l-5 15.4v.1c-.2.8-.4 1.6-.4 2.4 0 4.1 3.1 7.5 7 8.1h.2c.3 0 .7.1 1 .1.4 0 .7 0 1-.1h.2c4-.6 7.1-4.1 7.1-8.1 0-.8-.1-1.7-.4-2.4V34l-5.1-15.4c.4-.2.7-.6 1-.9zM66 92.8c16.9 0 32.8 1.1 47.1 3.2 4-16.9 8.9-26.7 14-33.5l-9.6-3.4c1 4.9 1.1 7.2 0 10.2-1.5-1.4-3-4.3-4.2-8.7L108.6 76c2.8-2 5-3.2 7.5-3.3-4.4 9.4-10 11.9-13.6 11.2-4.3-.8-6.3-4.6-5.6-7.9 1-4.7 5.7-5.9 8-.5 4.3-8.7-3-11.4-7.6-8.8 7.1-7.2 7.9-13.5 2.1-21.1-8 6.1-8.1 12.3-4.5 20.8-4.7-5.4-12.1-2.5-9.5 6.2 3.4-5.2 7.9-2 7.2 3.1-.6 4.3-6.4 7.8-13.5 7.2-10.3-.9-10.9-8-11.2-13.8 2.5-.5 7.1 1.8 11 7.3L80.2 60c-4.1 4.4-8 5.3-12.3 5.4 1.4-4.4 8-11.6 8-11.6H55.5s6.4 7.2 7.9 11.6c-4.2-.1-8-1-12.3-5.4l1.4 16.4c3.9-5.5 8.5-7.7 10.9-7.3-.3 5.8-.9 12.8-11.1 13.8-7.2.6-12.9-2.9-13.5-7.2-.7-5 3.8-8.3 7.1-3.1 2.7-8.7-4.6-11.6-9.4-6.2 3.7-8.5 3.6-14.7-4.6-20.8-5.8 7.6-5 13.9 2.2 21.1-4.7-2.6-11.9.1-7.7 8.8 2.3-5.5 7.1-4.2 8.1.5.7 3.3-1.3 7.1-5.7 7.9-3.5.7-9-1.8-13.5-11.2 2.5.1 4.7 1.3 7.5 3.3l-4.7-15.4c-1.2 4.4-2.7 7.2-4.3 8.7-1.1-3-.9-5.3 0-10.2l-9.5 3.4c5 6.9 9.9 16.7 14 33.5 14.8-2.1 30.8-3.2 47.7-3.2z"
|
|
60
|
-
fill="currentColor"
|
|
61
|
-
fill-rule="evenodd"
|
|
25
|
+
<div class="gem-c-layout-super-navigation-header__container govuk-clearfix">
|
|
26
|
+
<div class="govuk-width-container">
|
|
27
|
+
<div class="gem-c-layout-super-navigation-header__header-logo">
|
|
28
|
+
<a
|
|
29
|
+
class="govuk-header__link govuk-header__link--homepage"
|
|
30
|
+
data-track-action="logoLink"
|
|
31
|
+
data-track-category="headerClicked"
|
|
32
|
+
data-track-label="<%= logo_link %>"
|
|
33
|
+
data-track-dimension="<%= logo_text %>"
|
|
34
|
+
data-track-dimension-index="29"
|
|
35
|
+
href="<%= logo_link %>"
|
|
36
|
+
id="logo"
|
|
37
|
+
title="<%= logo_link_title %>"
|
|
38
|
+
data-ga4-link="<%= {
|
|
39
|
+
"event_name": "navigation",
|
|
40
|
+
"type": "header menu bar",
|
|
41
|
+
"external": "false",
|
|
42
|
+
"text": "GOV.UK",
|
|
43
|
+
"section": "Logo",
|
|
44
|
+
"index": 0,
|
|
45
|
+
"index_total": navigation_links_length
|
|
46
|
+
}.to_json %>"
|
|
47
|
+
>
|
|
48
|
+
<span class="govuk-header__logotype">
|
|
49
|
+
<!--[if gt IE 8]><!-->
|
|
50
|
+
<svg
|
|
51
|
+
aria-hidden="true"
|
|
52
|
+
class="govuk-header__logotype-crown gem-c-layout-super-navigation-header__logotype-crown"
|
|
53
|
+
focusable="false"
|
|
54
|
+
height="30"
|
|
55
|
+
viewBox="0 0 132 97"
|
|
56
|
+
width="36"
|
|
57
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
62
58
|
>
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
59
|
+
<path
|
|
60
|
+
d="M25 30.2c3.5 1.5 7.7-.2 9.1-3.7 1.5-3.6-.2-7.8-3.9-9.2-3.6-1.4-7.6.3-9.1 3.9-1.4 3.5.3 7.5 3.9 9zM9 39.5c3.6 1.5 7.8-.2 9.2-3.7 1.5-3.6-.2-7.8-3.9-9.1-3.6-1.5-7.6.2-9.1 3.8-1.4 3.5.3 7.5 3.8 9zM4.4 57.2c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.5-1.5-7.6.3-9.1 3.8-1.4 3.5.3 7.6 3.9 9.1zm38.3-21.4c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.6-1.5-7.6.3-9.1 3.8-1.3 3.6.4 7.7 3.9 9.1zm64.4-5.6c-3.6 1.5-7.8-.2-9.1-3.7-1.5-3.6.2-7.8 3.8-9.2 3.6-1.4 7.7.3 9.2 3.9 1.3 3.5-.4 7.5-3.9 9zm15.9 9.3c-3.6 1.5-7.7-.2-9.1-3.7-1.5-3.6.2-7.8 3.7-9.1 3.6-1.5 7.7.2 9.2 3.8 1.5 3.5-.3 7.5-3.8 9zm4.7 17.7c-3.6 1.5-7.8-.2-9.2-3.8-1.5-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.3 3.5-.4 7.6-3.9 9.1zM89.3 35.8c-3.6 1.5-7.8-.2-9.2-3.8-1.4-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.4 3.6-.3 7.7-3.9 9.1zM69.7 17.7l8.9 4.7V9.3l-8.9 2.8c-.2-.3-.5-.6-.9-.9L72.4 0H59.6l3.5 11.2c-.3.3-.6.5-.9.9l-8.8-2.8v13.1l8.8-4.7c.3.3.6.7.9.9l-5 15.4v.1c-.2.8-.4 1.6-.4 2.4 0 4.1 3.1 7.5 7 8.1h.2c.3 0 .7.1 1 .1.4 0 .7 0 1-.1h.2c4-.6 7.1-4.1 7.1-8.1 0-.8-.1-1.7-.4-2.4V34l-5.1-15.4c.4-.2.7-.6 1-.9zM66 92.8c16.9 0 32.8 1.1 47.1 3.2 4-16.9 8.9-26.7 14-33.5l-9.6-3.4c1 4.9 1.1 7.2 0 10.2-1.5-1.4-3-4.3-4.2-8.7L108.6 76c2.8-2 5-3.2 7.5-3.3-4.4 9.4-10 11.9-13.6 11.2-4.3-.8-6.3-4.6-5.6-7.9 1-4.7 5.7-5.9 8-.5 4.3-8.7-3-11.4-7.6-8.8 7.1-7.2 7.9-13.5 2.1-21.1-8 6.1-8.1 12.3-4.5 20.8-4.7-5.4-12.1-2.5-9.5 6.2 3.4-5.2 7.9-2 7.2 3.1-.6 4.3-6.4 7.8-13.5 7.2-10.3-.9-10.9-8-11.2-13.8 2.5-.5 7.1 1.8 11 7.3L80.2 60c-4.1 4.4-8 5.3-12.3 5.4 1.4-4.4 8-11.6 8-11.6H55.5s6.4 7.2 7.9 11.6c-4.2-.1-8-1-12.3-5.4l1.4 16.4c3.9-5.5 8.5-7.7 10.9-7.3-.3 5.8-.9 12.8-11.1 13.8-7.2.6-12.9-2.9-13.5-7.2-.7-5 3.8-8.3 7.1-3.1 2.7-8.7-4.6-11.6-9.4-6.2 3.7-8.5 3.6-14.7-4.6-20.8-5.8 7.6-5 13.9 2.2 21.1-4.7-2.6-11.9.1-7.7 8.8 2.3-5.5 7.1-4.2 8.1.5.7 3.3-1.3 7.1-5.7 7.9-3.5.7-9-1.8-13.5-11.2 2.5.1 4.7 1.3 7.5 3.3l-4.7-15.4c-1.2 4.4-2.7 7.2-4.3 8.7-1.1-3-.9-5.3 0-10.2l-9.5 3.4c5 6.9 9.9 16.7 14 33.5 14.8-2.1 30.8-3.2 47.7-3.2z"
|
|
61
|
+
fill="currentColor"
|
|
62
|
+
fill-rule="evenodd"
|
|
63
|
+
>
|
|
64
|
+
</path>
|
|
65
|
+
</svg>
|
|
66
|
+
<!--<![endif]-->
|
|
67
|
+
<!--[if IE 8]>
|
|
68
|
+
<img src="<%= asset_path('govuk-logotype-crown.png') %>" alt="" class="govuk-header__logotype-crown-fallback-image" width="36" height="32">
|
|
69
|
+
<![endif]-->
|
|
70
|
+
<span class="govuk-header__logotype-text">
|
|
71
|
+
<%= logo_text %>
|
|
72
|
+
</span>
|
|
71
73
|
</span>
|
|
72
|
-
</
|
|
73
|
-
</
|
|
74
|
+
</a>
|
|
75
|
+
</div>
|
|
74
76
|
</div>
|
|
75
77
|
<nav
|
|
76
78
|
aria-labelledby="super-navigation-menu-heading"
|
|
@@ -89,188 +91,172 @@
|
|
|
89
91
|
tracking_label = link[:label].downcase.gsub(/\s+/, "")
|
|
90
92
|
%>
|
|
91
93
|
|
|
92
|
-
|
|
93
|
-
class
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
94
|
+
<div class="govuk-width-container gem-c-layout-super-navigation-header__button-width-container">
|
|
95
|
+
<div class="gem-c-layout-super-navigation-header__button-container">
|
|
96
|
+
<div class="gem-c-layout-super-navigation-header__navigation-item">
|
|
97
|
+
<%= link_to link[:href], {
|
|
98
|
+
class: "gem-c-layout-super-navigation-header__navigation-item-link",
|
|
99
|
+
data: {
|
|
100
|
+
track_action: "#{tracking_label}Link",
|
|
101
|
+
track_category: "headerClicked",
|
|
102
|
+
track_label: link[:href],
|
|
103
|
+
track_dimension: link[:label],
|
|
104
|
+
track_dimension_index: "29",
|
|
105
|
+
}
|
|
106
|
+
} do %>
|
|
107
|
+
<span class="gem-c-layout-super-navigation-header__navigation-item-link-inner">
|
|
108
|
+
<%= link[:label] %>
|
|
109
|
+
</span>
|
|
110
|
+
<% end %>
|
|
106
111
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
<div
|
|
137
|
-
id="super-navigation-menu-<%= unique_id %>" hidden
|
|
138
|
-
class="gem-c-layout-super-navigation-header__navigation-dropdown-menu"
|
|
139
|
-
>
|
|
140
|
-
<div class="gem-c-layout-super-navigation-header__width-container">
|
|
141
|
-
<div class="govuk-grid-row">
|
|
112
|
+
<%= content_tag(:button, {
|
|
113
|
+
aria: {
|
|
114
|
+
controls: "super-navigation-menu-#{unique_id}",
|
|
115
|
+
expanded: false,
|
|
116
|
+
label: show_menu_text,
|
|
117
|
+
},
|
|
118
|
+
class: "gem-c-layout-super-navigation-header__navigation-top-toggle-button",
|
|
119
|
+
data: {
|
|
120
|
+
text_for_hide: hide_menu_text,
|
|
121
|
+
text_for_show: show_menu_text,
|
|
122
|
+
toggle_desktop_group: "top",
|
|
123
|
+
toggle_mobile_group: "top",
|
|
124
|
+
tracking_key: tracking_label,
|
|
125
|
+
ga4_event: {
|
|
126
|
+
event_name: "select_content",
|
|
127
|
+
type: "header menu bar",
|
|
128
|
+
text: link[:label],
|
|
129
|
+
index: 1,
|
|
130
|
+
index_total: 2,
|
|
131
|
+
section: link[:label]
|
|
132
|
+
}
|
|
133
|
+
},
|
|
134
|
+
hidden: true,
|
|
135
|
+
id: "super-navigation-menu-#{unique_id}-toggle",
|
|
136
|
+
type: "button",
|
|
137
|
+
}) do %>
|
|
138
|
+
<%= tag.span link[:label], class: "gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner" %>
|
|
139
|
+
<% end %>
|
|
140
|
+
</div>
|
|
142
141
|
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
142
|
+
<div class="gem-c-layout-super-navigation-header__search-item">
|
|
143
|
+
<button
|
|
144
|
+
aria-controls="super-search-menu"
|
|
145
|
+
aria-expanded="true"
|
|
146
|
+
aria-label="<%= hide_search_menu_text %>"
|
|
147
|
+
class="gem-c-layout-super-navigation-header__search-toggle-button"
|
|
148
|
+
data-text-for-hide="<%= hide_search_menu_text %>"
|
|
149
|
+
data-text-for-show="<%= show_search_menu_text %>"
|
|
150
|
+
data-toggle-mobile-group="top"
|
|
151
|
+
data-toggle-desktop-group="top"
|
|
152
|
+
data-tracking-key="search"
|
|
153
|
+
hidden
|
|
154
|
+
id="super-search-menu-toggle"
|
|
155
|
+
type="button"
|
|
156
|
+
data-ga4-event="<%= {
|
|
157
|
+
"event_name": "select_content",
|
|
158
|
+
"type": "header menu bar",
|
|
159
|
+
"text": "Search",
|
|
160
|
+
"index": 2,
|
|
161
|
+
"index_total": 2,
|
|
162
|
+
"section": "Search"
|
|
163
|
+
}.to_json %>"
|
|
164
|
+
>
|
|
165
|
+
<span class="govuk-visually-hidden">
|
|
166
|
+
<%= search_text %>
|
|
167
|
+
</span>
|
|
168
|
+
<%=
|
|
169
|
+
render "govuk_publishing_components/components/search/search_icon", {
|
|
170
|
+
classes: %w[gem-c-layout-super-navigation-header__search-toggle-button-link-icon],
|
|
171
|
+
}
|
|
172
|
+
%>
|
|
173
|
+
<span
|
|
174
|
+
aria-hidden="true"
|
|
175
|
+
class="gem-c-layout-super-navigation-header__navigation-top-toggle-close-icon"
|
|
176
|
+
focusable="false"
|
|
177
|
+
>
|
|
178
|
+
×
|
|
179
|
+
</span>
|
|
180
|
+
</button>
|
|
154
181
|
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
<%= link_to item[:label], item[:href], {
|
|
169
|
-
class: link_classes,
|
|
170
|
-
data: {
|
|
171
|
-
track_action: "#{tracking_label}Link",
|
|
172
|
-
track_category: "headerClicked",
|
|
173
|
-
track_label: item[:href],
|
|
174
|
-
track_dimension: item[:label],
|
|
175
|
-
track_dimension_index: "29",
|
|
176
|
-
ga4_link: {
|
|
177
|
-
"event_name": "navigation",
|
|
178
|
-
"type": "header menu bar",
|
|
179
|
-
"index": "1.#{column_index + 1}.#{index + 1}",
|
|
180
|
-
"index_total": navigation_links_length,
|
|
181
|
-
"section": column[:label],
|
|
182
|
-
}
|
|
183
|
-
}
|
|
184
|
-
} %>
|
|
185
|
-
<%= tag.p item[:description], class: "gem-c-layout-super-navigation-header__navigation-second-item-description" if has_description %>
|
|
186
|
-
</li>
|
|
187
|
-
<% end %>
|
|
188
|
-
</ul>
|
|
189
|
-
</div>
|
|
190
|
-
<% end %>
|
|
191
|
-
</div>
|
|
192
|
-
</div>
|
|
193
|
-
</div>
|
|
194
|
-
<% end %>
|
|
182
|
+
<a class="gem-c-layout-super-navigation-header__search-item-link" href="/search">
|
|
183
|
+
<span class="govuk-visually-hidden">
|
|
184
|
+
<%= search_text %>
|
|
185
|
+
</span>
|
|
186
|
+
<%=
|
|
187
|
+
render "govuk_publishing_components/components/search/search_icon", {
|
|
188
|
+
classes: %w[gem-c-layout-super-navigation-header__search-item-link-icon],
|
|
189
|
+
}
|
|
190
|
+
%>
|
|
191
|
+
</a>
|
|
192
|
+
</div>
|
|
193
|
+
</div>
|
|
194
|
+
</div>
|
|
195
195
|
|
|
196
|
-
<
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
aria-label="<%= hide_search_menu_text %>"
|
|
200
|
-
class="gem-c-layout-super-navigation-header__search-toggle-button"
|
|
201
|
-
data-text-for-hide="<%= hide_search_menu_text %>"
|
|
202
|
-
data-text-for-show="<%= show_search_menu_text %>"
|
|
203
|
-
data-toggle-mobile-group="top"
|
|
204
|
-
data-toggle-desktop-group="top"
|
|
205
|
-
data-tracking-key="search"
|
|
206
|
-
hidden
|
|
207
|
-
id="super-search-menu-toggle"
|
|
208
|
-
type="button"
|
|
209
|
-
data-ga4-event="<%= {
|
|
210
|
-
"event_name": "select_content",
|
|
211
|
-
"type": "header menu bar",
|
|
212
|
-
"text": "Search",
|
|
213
|
-
"index": 2,
|
|
214
|
-
"index_total": 2,
|
|
215
|
-
"section": "Search"
|
|
216
|
-
}.to_json %>"
|
|
196
|
+
<div
|
|
197
|
+
id="super-navigation-menu-<%= unique_id %>" hidden
|
|
198
|
+
class="gem-c-layout-super-navigation-header__navigation-dropdown-menu"
|
|
217
199
|
>
|
|
218
|
-
<
|
|
219
|
-
|
|
220
|
-
</span>
|
|
221
|
-
<%=
|
|
222
|
-
render "govuk_publishing_components/components/search/search_icon", {
|
|
223
|
-
classes: %w[gem-c-layout-super-navigation-header__search-toggle-button-link-icon],
|
|
224
|
-
}
|
|
225
|
-
%>
|
|
226
|
-
<span
|
|
227
|
-
aria-hidden="true"
|
|
228
|
-
class="gem-c-layout-super-navigation-header__navigation-top-toggle-close-icon"
|
|
229
|
-
focusable="false"
|
|
230
|
-
>
|
|
231
|
-
×
|
|
232
|
-
</span>
|
|
233
|
-
</button>
|
|
200
|
+
<div class="govuk-width-container">
|
|
201
|
+
<div class="govuk-grid-row gem-c-layout-super-navigation-header__navigation-items">
|
|
234
202
|
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
203
|
+
<% navigation_links_columns.each_with_index do | column, column_index | %>
|
|
204
|
+
<%
|
|
205
|
+
case column[:size]
|
|
206
|
+
when 2
|
|
207
|
+
width_class = "govuk-grid-column-two-thirds-from-desktop"
|
|
208
|
+
when 3
|
|
209
|
+
width_class = "govuk-grid-column-full-from-desktop"
|
|
210
|
+
else
|
|
211
|
+
width_class = "govuk-grid-column-one-third-from-desktop"
|
|
212
|
+
end
|
|
213
|
+
%>
|
|
214
|
+
|
|
215
|
+
<div class="<%= width_class %> gem-c-layout-super-navigation-header__column--<%= column[:label].downcase.sub(" ", "-") %>">
|
|
216
|
+
<h3 class="govuk-heading-m gem-c-layout-super-navigation-header__column-header">
|
|
217
|
+
<%= column[:label] %>
|
|
218
|
+
</h3>
|
|
219
|
+
<ul class="gem-c-layout-super-navigation-header__navigation-second-items gem-c-layout-super-navigation-header__navigation-second-items--<%= column[:label].downcase.sub(" ", "-") %>">
|
|
220
|
+
<% column[:menu_contents].each_with_index do | item, index | %>
|
|
221
|
+
<%
|
|
222
|
+
has_description = item[:description].present?
|
|
223
|
+
link_classes = %w[govuk-link gem-c-layout-super-navigation-header__navigation-second-item-link]
|
|
224
|
+
link_classes << "gem-c-layout-super-navigation-header__navigation-second-item-link--with-description" if has_description
|
|
225
|
+
tracking_label = column[:label].downcase.gsub(/\s+/, "")
|
|
226
|
+
%>
|
|
227
|
+
<li class="gem-c-layout-super-navigation-header__dropdown-list-item">
|
|
228
|
+
<%= link_to item[:label], item[:href], {
|
|
229
|
+
class: link_classes,
|
|
230
|
+
data: {
|
|
231
|
+
track_action: "#{tracking_label}Link",
|
|
232
|
+
track_category: "headerClicked",
|
|
233
|
+
track_label: item[:href],
|
|
234
|
+
track_dimension: item[:label],
|
|
235
|
+
track_dimension_index: "29",
|
|
236
|
+
ga4_link: {
|
|
237
|
+
"event_name": "navigation",
|
|
238
|
+
"type": "header menu bar",
|
|
239
|
+
"index": "1.#{column_index + 1}.#{index + 1}",
|
|
240
|
+
"index_total": navigation_links_length,
|
|
241
|
+
"section": column[:label],
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
} %>
|
|
245
|
+
<%= tag.p item[:description], class: "gem-c-layout-super-navigation-header__navigation-second-item-description" if has_description %>
|
|
246
|
+
</li>
|
|
247
|
+
<% end %>
|
|
248
|
+
</ul>
|
|
249
|
+
</div>
|
|
250
|
+
<% end %>
|
|
251
|
+
</div>
|
|
271
252
|
</div>
|
|
253
|
+
</div>
|
|
272
254
|
|
|
273
|
-
|
|
255
|
+
<div id="super-search-menu" hidden class="gem-c-layout-super-navigation-header__navigation-dropdown-menu">
|
|
256
|
+
<div class="govuk-width-container gem-c-layout-super-navigation-header__search-container gem-c-layout-super-navigation-header__search-items">
|
|
257
|
+
<h3 class="govuk-visually-hidden">
|
|
258
|
+
<%= navigation_search_subheading %>
|
|
259
|
+
</h3>
|
|
274
260
|
<div class="govuk-grid-row">
|
|
275
261
|
<div class="govuk-grid-column-full">
|
|
276
262
|
<form
|
|
@@ -2,7 +2,7 @@ name: "Breadcrumbs"
|
|
|
2
2
|
description: "Navigational breadcrumbs, showing page hierarchy"
|
|
3
3
|
body: |
|
|
4
4
|
Accepts an array of breadcrumb objects. Each crumb must have a title and a URL.
|
|
5
|
-
Links
|
|
5
|
+
Links are tracked, but in Universal Analytics, links to the homepage (any link with a url of `/`) will be tracked separately as `homeLinkClicked`.
|
|
6
6
|
|
|
7
7
|
We recommend that if using the breadcrumbs for navigation purposes, you set `collapse_on_mobile` to `true` to make things more readable for mobile users. However, you can specify `collapse_on_mobile:``false` or remove the flag completely to stop this behaviour.
|
|
8
8
|
shared_accessibility_criteria:
|
|
@@ -4,14 +4,18 @@
|
|
|
4
4
|
data-module="gem-toggle">
|
|
5
5
|
|
|
6
6
|
<% if section_title === "related_items" %>
|
|
7
|
-
<%
|
|
7
|
+
<%
|
|
8
|
+
heading_text = related_nav_helper.construct_section_text("related_content", true)
|
|
9
|
+
ga4_heading_text = related_nav_helper.construct_ga4_section_text("related_content")
|
|
10
|
+
%>
|
|
8
11
|
<% else %>
|
|
9
12
|
<%=
|
|
10
13
|
heading_class = related_nav_helper.section_css_class("gem-c-related-navigation__sub-heading", section_title)
|
|
11
14
|
heading_data = { 'track-count' => related_nav_helper.section_data_track_count(:related_item_section) }
|
|
12
15
|
heading_id = "related-nav-#{section_title}-#{random}"
|
|
13
16
|
heading_level = related_nav_helper.section_heading_level
|
|
14
|
-
heading_text = related_nav_helper.
|
|
17
|
+
heading_text = related_nav_helper.construct_section_text(section_title, true)
|
|
18
|
+
ga4_heading_text = related_nav_helper.construct_ga4_section_text(section_title)
|
|
15
19
|
|
|
16
20
|
content_tag(heading_level, id: heading_id, class: heading_class, data: heading_data) do
|
|
17
21
|
heading_text
|
|
@@ -31,7 +35,7 @@
|
|
|
31
35
|
event_name: "navigation",
|
|
32
36
|
type: "related content",
|
|
33
37
|
index: "#{section_index}.#{index}",
|
|
34
|
-
section:
|
|
38
|
+
section: ga4_heading_text,
|
|
35
39
|
} if ga4_tracking
|
|
36
40
|
link_element = link_to(
|
|
37
41
|
link[:text],
|
|
@@ -41,7 +45,7 @@
|
|
|
41
45
|
lang: shared_helper.t_locale_check(link[:locale]),
|
|
42
46
|
data: {
|
|
43
47
|
track_category: 'relatedLinkClicked',
|
|
44
|
-
track_action: "#{section_index}.#{index} #{related_nav_helper.
|
|
48
|
+
track_action: "#{section_index}.#{index} #{related_nav_helper.construct_section_text(section_title, true) || t('components.related_navigation.related_content')}",
|
|
45
49
|
track_label: link[:path],
|
|
46
50
|
track_options: {
|
|
47
51
|
dimension28: links.length.to_s,
|
|
@@ -58,6 +58,12 @@ module GovukPublishingComponents
|
|
|
58
58
|
dimension28: breadcrumbs_length.to_s,
|
|
59
59
|
dimension29: crumb[:title],
|
|
60
60
|
},
|
|
61
|
+
ga4_link: {
|
|
62
|
+
event_name: "navigation",
|
|
63
|
+
type: "breadcrumbs",
|
|
64
|
+
index: index.to_s,
|
|
65
|
+
index_total: breadcrumbs_length.to_s,
|
|
66
|
+
},
|
|
61
67
|
}
|
|
62
68
|
|
|
63
69
|
is_homepage = crumb[:url] == "/"
|
|
@@ -53,20 +53,25 @@ module GovukPublishingComponents
|
|
|
53
53
|
end
|
|
54
54
|
end
|
|
55
55
|
|
|
56
|
-
def
|
|
57
|
-
unless
|
|
56
|
+
def construct_section_text(section, underscores_to_spaces)
|
|
57
|
+
unless section == "related_items"
|
|
58
|
+
defaults = [I18n.t("components.related_navigation.#{section}")]
|
|
59
|
+
defaults << section.tr("_", " ") if underscores_to_spaces
|
|
60
|
+
|
|
58
61
|
I18n.t(
|
|
59
|
-
"components.related_#{@context}_navigation
|
|
60
|
-
default:
|
|
61
|
-
I18n.t("components.related_navigation.#{section_title}"),
|
|
62
|
-
section_title.tr("_", " "),
|
|
63
|
-
],
|
|
62
|
+
"components.related_#{@context}_navigation.#{section}",
|
|
63
|
+
default: defaults,
|
|
64
64
|
)
|
|
65
65
|
end
|
|
66
66
|
end
|
|
67
67
|
|
|
68
|
-
def
|
|
69
|
-
|
|
68
|
+
def construct_ga4_section_text(section)
|
|
69
|
+
# Force English so we can still understand what is being tracked if translated.
|
|
70
|
+
underscores_to_spaces = true
|
|
71
|
+
underscores_to_spaces = false if section == "related_content"
|
|
72
|
+
I18n.with_locale("en") do
|
|
73
|
+
construct_section_text(section, underscores_to_spaces)
|
|
74
|
+
end
|
|
70
75
|
end
|
|
71
76
|
|
|
72
77
|
def section_css_class(css_class, section_title, link: {}, link_is_inline: false)
|
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: 34.
|
|
4
|
+
version: 34.11.0
|
|
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: 2023-02-
|
|
11
|
+
date: 2023-02-21 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: govuk_app_config
|
|
@@ -447,6 +447,7 @@ files:
|
|
|
447
447
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js
|
|
448
448
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-page-views.js
|
|
449
449
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-schemas.js
|
|
450
|
+
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-smart-answer-results-tracker.js
|
|
450
451
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-specialist-link-tracker.js
|
|
451
452
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/init-ga4.js
|
|
452
453
|
- app/assets/javascripts/govuk_publishing_components/analytics-ga4/pii-remover.js
|
|
@@ -1410,7 +1411,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
1410
1411
|
- !ruby/object:Gem::Version
|
|
1411
1412
|
version: '0'
|
|
1412
1413
|
requirements: []
|
|
1413
|
-
rubygems_version: 3.4.
|
|
1414
|
+
rubygems_version: 3.4.7
|
|
1414
1415
|
signing_key:
|
|
1415
1416
|
specification_version: 4
|
|
1416
1417
|
summary: A gem to document components in GOV.UK frontend applications
|