govuk_publishing_components 44.1.0 → 44.3.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/stylesheets/govuk_publishing_components/components/_share-links.scss +32 -0
- data/app/views/govuk_publishing_components/components/_share_links.html.erb +4 -1
- data/app/views/govuk_publishing_components/components/docs/share_links.yml +36 -0
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.js +336 -225
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.mjs +334 -226
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/all.mjs +3 -0
- data/node_modules/govuk-frontend/dist/govuk/all.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/assets/images/govuk-crest.svg +1 -0
- data/node_modules/govuk-frontend/dist/govuk/common/govuk-frontend-version.mjs +1 -1
- data/node_modules/govuk-frontend/dist/govuk/common/index.mjs +21 -1
- data/node_modules/govuk-frontend/dist/govuk/common/index.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/_index.scss +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.js +92 -26
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.mjs +92 -26
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.mjs +12 -21
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.bundle.js +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.bundle.mjs +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.mjs +6 -16
- data/node_modules/govuk-frontend/dist/govuk/components/button/button.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.js +89 -23
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.mjs +89 -23
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.mjs +10 -19
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.js +113 -47
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.mjs +113 -47
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.mjs +7 -16
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/details/_index.scss +7 -2
- data/node_modules/govuk-frontend/dist/govuk/components/details/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.bundle.js +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.bundle.mjs +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.mjs +6 -16
- data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.js +87 -21
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.mjs +87 -21
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.mjs +7 -16
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss +8 -10
- data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss +8 -0
- data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/fixtures.json +12 -0
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.js +87 -21
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.mjs +87 -21
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.mjs +7 -16
- data/node_modules/govuk-frontend/dist/govuk/components/header/header.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/template-with-full-width-border.html +24 -0
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.bundle.js +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.bundle.mjs +86 -20
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.mjs +6 -16
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.js +89 -23
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.mjs +89 -23
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.mjs +9 -18
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.bundle.js +113 -47
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.bundle.mjs +113 -47
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.mjs +7 -16
- data/node_modules/govuk-frontend/dist/govuk/components/radios/radios.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/README.md +15 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_index.scss +168 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_index.scss.map +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_service-navigation.scss +4 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_service-navigation.scss.map +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/fixtures.json +464 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/macro-options.json +138 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/macro.njk +3 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.bundle.js +249 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.bundle.js.map +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.bundle.mjs +241 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.bundle.mjs.map +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.mjs +85 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/service-navigation.mjs.map +1 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-default.html +57 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-html-navigation-items.html +49 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-large-navigation.html +153 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-long-service-name.html +20 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-navigation-with-a-current-item.html +58 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-navigation-with-an-active-item.html +58 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-non-link-navigation-items.html +49 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-service-link.html +20 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-service-name-and-navigation.html +63 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template-with-service-name.html +18 -0
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template.njk +102 -0
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.js +93 -26
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.mjs +93 -26
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.mjs +13 -21
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.bundle.js +93 -27
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.bundle.mjs +93 -27
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.mjs +13 -22
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/tabs.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/warning-text/_index.scss +4 -3
- data/node_modules/govuk-frontend/dist/govuk/components/warning-text/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/core/_govuk-frontend-properties.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/errors/index.mjs +16 -3
- data/node_modules/govuk-frontend/dist/govuk/errors/index.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend-component.mjs +49 -5
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend-component.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.css +2 -2
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.css.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.js +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/init.mjs +72 -10
- data/node_modules/govuk-frontend/dist/govuk/init.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/settings/_colours-organisations.scss +3 -0
- data/node_modules/govuk-frontend/dist/govuk/settings/_colours-organisations.scss.map +1 -1
- data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +5 -1
- data/node_modules/govuk-frontend/package.json +8 -8
- metadata +29 -4
- data/node_modules/govuk-frontend/dist/govuk/assets/images/govuk-crest-2x.png +0 -0
- data/node_modules/govuk-frontend/dist/govuk/assets/images/govuk-crest.png +0 -0
@@ -0,0 +1,102 @@
|
|
1
|
+
{% from "../../macros/attributes.njk" import govukAttributes %}
|
2
|
+
|
3
|
+
{%- set menuButtonText = params.menuButtonText | default("Menu", true) -%}
|
4
|
+
{%- set navigationId = params.navigationId | default("navigation", true) %}
|
5
|
+
|
6
|
+
{%- set commonAttributes %}
|
7
|
+
class="govuk-service-navigation {%- if params.classes %} {{ params.classes }}{% endif %}"
|
8
|
+
data-module="govuk-service-navigation"
|
9
|
+
{{- govukAttributes(params.attributes) }}
|
10
|
+
{% endset -%}
|
11
|
+
|
12
|
+
{%- set innerContent %}
|
13
|
+
<div class="govuk-width-container">
|
14
|
+
|
15
|
+
{# Slot: start #}
|
16
|
+
{%- if params.slots.start %}{{ params.slots.start | safe }}{% endif -%}
|
17
|
+
|
18
|
+
<div class="govuk-service-navigation__container">
|
19
|
+
{# Service name #}
|
20
|
+
{% if params.serviceName %}
|
21
|
+
<span class="govuk-service-navigation__service-name">
|
22
|
+
{% if params.serviceUrl %}
|
23
|
+
<a href="{{ params.serviceUrl }}" class="govuk-service-navigation__link">
|
24
|
+
{{ params.serviceName }}
|
25
|
+
</a>
|
26
|
+
{% else %}
|
27
|
+
<span class="govuk-service-navigation__text">
|
28
|
+
{{- params.serviceName -}}
|
29
|
+
</span>
|
30
|
+
{% endif %}
|
31
|
+
</span>
|
32
|
+
{% endif %}
|
33
|
+
|
34
|
+
{# Navigation #}
|
35
|
+
{% if params.navigation | length or params.slots.navigationStart or params.slots.navigationEnd %}
|
36
|
+
<nav aria-label="{{ params.navigationLabel | default(menuButtonText, true) }}" class="govuk-service-navigation__wrapper {%- if params.navigationClasses %} {{ params.navigationClasses }}{% endif %}">
|
37
|
+
<button type="button" class="govuk-service-navigation__toggle govuk-js-service-navigation-toggle" aria-controls="{{ navigationId }}" {%- if params.menuButtonLabel and params.menuButtonLabel != menuButtonText %} aria-label="{{ params.menuButtonLabel }}"{% endif %} hidden>
|
38
|
+
{{ menuButtonText }}
|
39
|
+
</button>
|
40
|
+
|
41
|
+
<ul class="govuk-service-navigation__list" id="{{ navigationId }}" >
|
42
|
+
|
43
|
+
{# Slot: navigationStart #}
|
44
|
+
{%- if params.slots.navigationStart %}{{ params.slots.navigationStart | safe }}{% endif -%}
|
45
|
+
|
46
|
+
{% for item in params.navigation %}
|
47
|
+
{% set linkInnerContent %}
|
48
|
+
{# We wrap active links in strong tags so that users who
|
49
|
+
override colours or styles will still have some indicator of
|
50
|
+
the current nav item. #}
|
51
|
+
{% if item.active or item.current %}
|
52
|
+
<strong class="govuk-service-navigation__active-fallback">{{- item.html | safe if item.html else item.text -}}</strong>
|
53
|
+
{% else %}
|
54
|
+
{{- item.html | safe if item.html else item.text -}}
|
55
|
+
{% endif %}
|
56
|
+
{% endset %}
|
57
|
+
|
58
|
+
{#
|
59
|
+
If item.current, add active style and set aria-current="page"
|
60
|
+
Elseif item.active, add active style and set aria-current="true"
|
61
|
+
#}
|
62
|
+
<li class="govuk-service-navigation__item {%- if item.active or item.current %} govuk-service-navigation__item--active{% endif %}">
|
63
|
+
{% if item.href %}
|
64
|
+
<a class="govuk-service-navigation__link" href="{{ item.href }}"
|
65
|
+
{%- if item.active or item.current %} aria-current="{{ 'page' if item.current else 'true' }}"{% endif %}
|
66
|
+
{{- govukAttributes(item.attributes) -}}>
|
67
|
+
{{ linkInnerContent | safe }}
|
68
|
+
</a>
|
69
|
+
{% elif item.html or item.text %}
|
70
|
+
<span class="govuk-service-navigation__text"
|
71
|
+
{%- if item.active or item.current %} aria-current="{{ 'page' if item.current else 'true' }}"{% endif %}>
|
72
|
+
{{ linkInnerContent | safe }}
|
73
|
+
</span>
|
74
|
+
{% endif %}
|
75
|
+
</li>
|
76
|
+
{% endfor %}
|
77
|
+
|
78
|
+
{# Slot: navigationEnd #}
|
79
|
+
{%- if params.slots.navigationEnd %}{{ params.slots.navigationEnd | safe }}{% endif -%}
|
80
|
+
</ul>
|
81
|
+
</nav>
|
82
|
+
{% endif %}
|
83
|
+
</div>
|
84
|
+
|
85
|
+
{# Slot: end #}
|
86
|
+
{%- if params.slots.end %}{{ params.slots.end | safe }}{% endif -%}
|
87
|
+
|
88
|
+
</div>
|
89
|
+
{% endset -%}
|
90
|
+
|
91
|
+
{# If a service name is included, we use a <section> element with an
|
92
|
+
aria-label to create a containing landmark region. Otherwise, the <nav> in
|
93
|
+
the innerContent can do the job just fine by itself. #}
|
94
|
+
{% if params.serviceName or params.slots.start or params.slots.end %}
|
95
|
+
<section aria-label="{{ params.ariaLabel | default("Service information") }}" {{ commonAttributes | safe }}>
|
96
|
+
{{ innerContent | safe }}
|
97
|
+
</section>
|
98
|
+
{% else %}
|
99
|
+
<div {{ commonAttributes | safe }}>
|
100
|
+
{{ innerContent | safe }}
|
101
|
+
</div>
|
102
|
+
{% endif %}
|
@@ -34,12 +34,28 @@
|
|
34
34
|
(_options$onBeforeFocu = options.onBeforeFocus) == null || _options$onBeforeFocu.call($element);
|
35
35
|
$element.focus();
|
36
36
|
}
|
37
|
+
function isInitialised($root, moduleName) {
|
38
|
+
return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);
|
39
|
+
}
|
40
|
+
|
41
|
+
/**
|
42
|
+
* Checks if GOV.UK Frontend is supported on this page
|
43
|
+
*
|
44
|
+
* Some browsers will load and run our JavaScript but GOV.UK Frontend
|
45
|
+
* won't be supported.
|
46
|
+
*
|
47
|
+
* @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support
|
48
|
+
* @returns {boolean} Whether GOV.UK Frontend is supported on this page
|
49
|
+
*/
|
37
50
|
function isSupported($scope = document.body) {
|
38
51
|
if (!$scope) {
|
39
52
|
return false;
|
40
53
|
}
|
41
54
|
return $scope.classList.contains('govuk-frontend-supported');
|
42
55
|
}
|
56
|
+
function formatErrorMessage(Component, message) {
|
57
|
+
return `${Component.moduleName}: ${message}`;
|
58
|
+
}
|
43
59
|
|
44
60
|
/**
|
45
61
|
* Schema for component config
|
@@ -63,6 +79,10 @@
|
|
63
79
|
* @property {string[]} required - List of required config fields
|
64
80
|
* @property {string} errorMessage - Error message when required config fields not provided
|
65
81
|
*/
|
82
|
+
/**
|
83
|
+
* @typedef ComponentWithModuleName
|
84
|
+
* @property {string} moduleName - Name of the component
|
85
|
+
*/
|
66
86
|
|
67
87
|
class GOVUKFrontendError extends Error {
|
68
88
|
constructor(...args) {
|
@@ -87,60 +107,106 @@
|
|
87
107
|
let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
|
88
108
|
if (typeof messageOrOptions === 'object') {
|
89
109
|
const {
|
90
|
-
|
110
|
+
component,
|
91
111
|
identifier,
|
92
112
|
element,
|
93
113
|
expectedType
|
94
114
|
} = messageOrOptions;
|
95
|
-
message =
|
115
|
+
message = identifier;
|
96
116
|
message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
|
117
|
+
message = formatErrorMessage(component, message);
|
97
118
|
}
|
98
119
|
super(message);
|
99
120
|
this.name = 'ElementError';
|
100
121
|
}
|
101
122
|
}
|
123
|
+
class InitError extends GOVUKFrontendError {
|
124
|
+
constructor(componentOrMessage) {
|
125
|
+
const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\`$root\`) already initialised`);
|
126
|
+
super(message);
|
127
|
+
this.name = 'InitError';
|
128
|
+
}
|
129
|
+
}
|
130
|
+
/**
|
131
|
+
* @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName
|
132
|
+
*/
|
102
133
|
|
103
134
|
class GOVUKFrontendComponent {
|
104
|
-
|
105
|
-
|
135
|
+
/**
|
136
|
+
* Returns the root element of the component
|
137
|
+
*
|
138
|
+
* @protected
|
139
|
+
* @returns {RootElementType} - the root element of component
|
140
|
+
*/
|
141
|
+
get $root() {
|
142
|
+
return this._$root;
|
106
143
|
}
|
107
|
-
|
144
|
+
constructor($root) {
|
145
|
+
this._$root = void 0;
|
146
|
+
const childConstructor = this.constructor;
|
147
|
+
if (typeof childConstructor.moduleName !== 'string') {
|
148
|
+
throw new InitError(`\`moduleName\` not defined in component`);
|
149
|
+
}
|
150
|
+
if (!($root instanceof childConstructor.elementType)) {
|
151
|
+
throw new ElementError({
|
152
|
+
element: $root,
|
153
|
+
component: childConstructor,
|
154
|
+
identifier: 'Root element (`$root`)',
|
155
|
+
expectedType: childConstructor.elementType.name
|
156
|
+
});
|
157
|
+
} else {
|
158
|
+
this._$root = $root;
|
159
|
+
}
|
160
|
+
childConstructor.checkSupport();
|
161
|
+
this.checkInitialised();
|
162
|
+
const moduleName = childConstructor.moduleName;
|
163
|
+
this.$root.setAttribute(`data-${moduleName}-init`, '');
|
164
|
+
}
|
165
|
+
checkInitialised() {
|
166
|
+
const constructor = this.constructor;
|
167
|
+
const moduleName = constructor.moduleName;
|
168
|
+
if (moduleName && isInitialised(this.$root, moduleName)) {
|
169
|
+
throw new InitError(constructor);
|
170
|
+
}
|
171
|
+
}
|
172
|
+
static checkSupport() {
|
108
173
|
if (!isSupported()) {
|
109
174
|
throw new SupportError();
|
110
175
|
}
|
111
176
|
}
|
112
177
|
}
|
113
178
|
|
179
|
+
/**
|
180
|
+
* @typedef ChildClass
|
181
|
+
* @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component
|
182
|
+
*/
|
183
|
+
|
184
|
+
/**
|
185
|
+
* @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor
|
186
|
+
*/
|
187
|
+
GOVUKFrontendComponent.elementType = HTMLElement;
|
188
|
+
|
114
189
|
/**
|
115
190
|
* Skip link component
|
116
191
|
*
|
117
192
|
* @preserve
|
193
|
+
* @augments GOVUKFrontendComponent<HTMLAnchorElement>
|
118
194
|
*/
|
119
195
|
class SkipLink extends GOVUKFrontendComponent {
|
120
196
|
/**
|
121
|
-
* @param {Element | null} $
|
122
|
-
* @throws {ElementError} when $
|
123
|
-
* @throws {ElementError} when $
|
197
|
+
* @param {Element | null} $root - HTML element to use for skip link
|
198
|
+
* @throws {ElementError} when $root is not set or the wrong type
|
199
|
+
* @throws {ElementError} when $root.hash does not contain a hash
|
124
200
|
* @throws {ElementError} when the linked element is missing or the wrong type
|
125
201
|
*/
|
126
|
-
constructor($
|
127
|
-
var _this$$
|
128
|
-
super();
|
129
|
-
|
130
|
-
|
131
|
-
throw new ElementError({
|
132
|
-
componentName: 'Skip link',
|
133
|
-
element: $module,
|
134
|
-
expectedType: 'HTMLAnchorElement',
|
135
|
-
identifier: 'Root element (`$module`)'
|
136
|
-
});
|
137
|
-
}
|
138
|
-
this.$module = $module;
|
139
|
-
const hash = this.$module.hash;
|
140
|
-
const href = (_this$$module$getAttr = this.$module.getAttribute('href')) != null ? _this$$module$getAttr : '';
|
202
|
+
constructor($root) {
|
203
|
+
var _this$$root$getAttrib;
|
204
|
+
super($root);
|
205
|
+
const hash = this.$root.hash;
|
206
|
+
const href = (_this$$root$getAttrib = this.$root.getAttribute('href')) != null ? _this$$root$getAttrib : '';
|
141
207
|
let url;
|
142
208
|
try {
|
143
|
-
url = new window.URL(this.$
|
209
|
+
url = new window.URL(this.$root.href);
|
144
210
|
} catch (error) {
|
145
211
|
throw new ElementError(`Skip link: Target link (\`href="${href}"\`) is invalid`);
|
146
212
|
}
|
@@ -154,12 +220,12 @@
|
|
154
220
|
const $linkedElement = document.getElementById(linkedElementId);
|
155
221
|
if (!$linkedElement) {
|
156
222
|
throw new ElementError({
|
157
|
-
|
223
|
+
component: SkipLink,
|
158
224
|
element: $linkedElement,
|
159
225
|
identifier: `Target content (\`id="${linkedElementId}"\`)`
|
160
226
|
});
|
161
227
|
}
|
162
|
-
this.$
|
228
|
+
this.$root.addEventListener('click', () => setFocus($linkedElement, {
|
163
229
|
onBeforeFocus() {
|
164
230
|
$linkedElement.classList.add('govuk-skip-link-focused-element');
|
165
231
|
},
|
@@ -169,6 +235,7 @@
|
|
169
235
|
}));
|
170
236
|
}
|
171
237
|
}
|
238
|
+
SkipLink.elementType = HTMLAnchorElement;
|
172
239
|
SkipLink.moduleName = 'govuk-skip-link';
|
173
240
|
|
174
241
|
exports.SkipLink = SkipLink;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"skip-link.bundle.js","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/skip-link/skip-link.mjs"],"sourcesContent":["import { normaliseString } from './normalise-string.mjs'\n\n/**\n * Common helpers which do not require polyfill.\n *\n * IMPORTANT: If a helper require a polyfill, please isolate it in its own module\n * so that the polyfill can be properly tree-shaken and does not burden\n * the components that do not need that helper\n */\n\n/**\n * Config merging function\n *\n * Takes any number of objects and combines them together, with\n * greatest priority on the LAST item passed in.\n *\n * @internal\n * @param {...{ [key: string]: unknown }} configObjects - Config objects to merge\n * @returns {{ [key: string]: unknown }} A merged config object\n */\nexport function mergeConfigs(...configObjects) {\n // Start with an empty object as our base\n /** @type {{ [key: string]: unknown }} */\n const formattedConfigObject = {}\n\n // Loop through each of the passed objects\n for (const configObject of configObjects) {\n for (const key of Object.keys(configObject)) {\n const option = formattedConfigObject[key]\n const override = configObject[key]\n\n // Push their keys one-by-one into formattedConfigObject. Any duplicate\n // keys with object values will be merged, otherwise the new value will\n // override the existing value.\n if (isObject(option) && isObject(override)) {\n // @ts-expect-error Index signature for type 'string' is missing\n formattedConfigObject[key] = mergeConfigs(option, override)\n } else {\n // Apply override\n formattedConfigObject[key] = override\n }\n }\n }\n\n return formattedConfigObject\n}\n\n/**\n * Extracts keys starting with a particular namespace from dataset ('data-*')\n * object, removing the namespace in the process, normalising all values\n *\n * @internal\n * @param {{ schema: Schema }} Component - Component class\n * @param {DOMStringMap} dataset - The object to extract key-value pairs from\n * @param {string} namespace - The namespace to filter keys with\n * @returns {ObjectNested | undefined} Nested object with dot-separated key namespace removed\n */\nexport function extractConfigByNamespace(Component, dataset, namespace) {\n const property = Component.schema.properties[namespace]\n\n // Only extract configs for object schema properties\n if (property?.type !== 'object') {\n return\n }\n\n // Add default empty config\n const newObject = {\n [namespace]: /** @type {ObjectNested} */ ({})\n }\n\n for (const [key, value] of Object.entries(dataset)) {\n /** @type {ObjectNested | ObjectNested[NestedKey]} */\n let current = newObject\n\n // Split the key into parts, using . as our namespace separator\n const keyParts = key.split('.')\n\n /**\n * Create new level per part\n *\n * e.g. 'i18n.textareaDescription.other' becomes\n * `{ i18n: { textareaDescription: { other } } }`\n */\n for (const [index, name] of keyParts.entries()) {\n if (typeof current === 'object') {\n // Drop down to nested object until the last part\n if (index < keyParts.length - 1) {\n // New nested object (optionally) replaces existing value\n if (!isObject(current[name])) {\n current[name] = {}\n }\n\n // Drop down into new or existing nested object\n current = current[name]\n } else if (key !== namespace) {\n // Normalised value (optionally) replaces existing value\n current[name] = normaliseString(value)\n }\n }\n }\n }\n\n return newObject[namespace]\n}\n\n/**\n * Get hash fragment from URL\n *\n * Extract the hash fragment (everything after the hash) from a URL,\n * but not including the hash symbol\n *\n * @private\n * @param {string} url - URL\n * @returns {string | undefined} Fragment from URL, without the hash\n */\nexport function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined\n }\n\n return url.split('#').pop()\n}\n\n/**\n * Get GOV.UK Frontend breakpoint value from CSS custom property\n *\n * @private\n * @param {string} name - Breakpoint name\n * @returns {{ property: string, value?: string }} Breakpoint object\n */\nexport function getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`\n\n // Get value from `<html>` with breakpoints on CSS :root\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(property)\n\n return {\n property,\n value: value || undefined\n }\n}\n\n/**\n * Move focus to element\n *\n * Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n *\n * @private\n * @template {HTMLElement} FocusElement\n * @param {FocusElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: FocusElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: FocusElement): void} [options.onBlur] - Callback on blur\n */\nexport function setFocus($element, options = {}) {\n const isFocusable = $element.getAttribute('tabindex')\n\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1')\n }\n\n /**\n * Handle element focus\n */\n function onFocus() {\n $element.addEventListener('blur', onBlur, { once: true })\n }\n\n /**\n * Handle element blur\n */\n function onBlur() {\n options.onBlur?.call($element)\n\n if (!isFocusable) {\n $element.removeAttribute('tabindex')\n }\n }\n\n // Add listener to reset element on blur, after focus\n $element.addEventListener('focus', onFocus, { once: true })\n\n // Focus element\n options.onBeforeFocus?.call($element)\n $element.focus()\n}\n\n/**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n *\n * @internal\n * @param {HTMLElement | null} [$scope] - HTML element `<body>` checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n */\nexport function isSupported($scope = document.body) {\n if (!$scope) {\n return false\n }\n\n return $scope.classList.contains('govuk-frontend-supported')\n}\n\n/**\n * Validate component config by schema\n *\n * Follows limited examples in JSON schema for wider support in future\n *\n * {@link https://ajv.js.org/json-schema.html#compound-keywords}\n * {@link https://ajv.js.org/packages/ajv-errors.html#single-message}\n *\n * @internal\n * @param {Schema} schema - Config schema\n * @param {{ [key: string]: unknown }} config - Component config\n * @returns {string[]} List of validation errors\n */\nexport function validateConfig(schema, config) {\n const validationErrors = []\n\n // Check errors for each schema\n for (const [name, conditions] of Object.entries(schema)) {\n const errors = []\n\n // Check errors for each schema condition\n if (Array.isArray(conditions)) {\n for (const { required, errorMessage } of conditions) {\n if (!required.every((key) => !!config[key])) {\n errors.push(errorMessage) // Missing config key value\n }\n }\n\n // Check one condition passes or add errors\n if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {\n validationErrors.push(...errors)\n }\n }\n }\n\n return validationErrors\n}\n\n/**\n * Check for an array\n *\n * @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an array\n */\nfunction isArray(option) {\n return Array.isArray(option)\n}\n\n/**\n * Check for an object\n *\n * @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an object\n */\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option)\n}\n\n/**\n * Schema for component config\n *\n * @typedef {object} Schema\n * @property {{ [field: string]: SchemaProperty | undefined }} properties - Schema properties\n * @property {SchemaCondition[]} [anyOf] - List of schema conditions\n */\n\n/**\n * Schema property for component config\n *\n * @typedef {object} SchemaProperty\n * @property {'string' | 'boolean' | 'number' | 'object'} type - Property type\n */\n\n/**\n * Schema condition for component config\n *\n * @typedef {object} SchemaCondition\n * @property {string[]} required - List of required config fields\n * @property {string} errorMessage - Error message when required config fields not provided\n */\n\n/**\n * @internal\n * @typedef {keyof ObjectNested} NestedKey\n * @typedef {{ [key: string]: string | boolean | number | ObjectNested | undefined }} ObjectNested\n */\n","/**\n * GOV.UK Frontend error\n *\n * A base class for `Error`s thrown by GOV.UK Frontend.\n *\n * It is meant to be extended into specific types of errors\n * to be thrown by our code.\n *\n * @example\n * ```js\n * class MissingRootError extends GOVUKFrontendError {\n * // Setting an explicit name is important as extending the class will not\n * // set a new `name` on the subclass. The `name` property is important\n * // to ensure intelligible error names even if the class name gets\n * // mangled by a minifier\n * name = \"MissingRootError\"\n * }\n * ```\n * @abstract\n */\nexport class GOVUKFrontendError extends Error {\n name = 'GOVUKFrontendError'\n}\n\n/**\n * Indicates that GOV.UK Frontend is not supported\n */\nexport class SupportError extends GOVUKFrontendError {\n name = 'SupportError'\n\n /**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * @param {HTMLElement | null} [$scope] - HTML element `<body>` checked for browser support\n */\n constructor($scope = document.body) {\n const supportMessage =\n 'noModule' in HTMLScriptElement.prototype\n ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet'\n : 'GOV.UK Frontend is not supported in this browser'\n\n super(\n $scope\n ? supportMessage\n : 'GOV.UK Frontend initialised without `<script type=\"module\">`'\n )\n }\n}\n\n/**\n * Indicates that a component has received an illegal configuration\n */\nexport class ConfigError extends GOVUKFrontendError {\n name = 'ConfigError'\n}\n\n/**\n * Indicates an issue with an element (possibly `null` or `undefined`)\n */\nexport class ElementError extends GOVUKFrontendError {\n name = 'ElementError'\n\n /**\n * @internal\n * @overload\n * @param {string} message - Element error message\n */\n\n /**\n * @internal\n * @overload\n * @param {ElementErrorOptions} options - Element error options\n */\n\n /**\n * @internal\n * @param {string | ElementErrorOptions} messageOrOptions - Element error message or options\n */\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : ''\n\n // Build message from options\n if (typeof messageOrOptions === 'object') {\n const { componentName, identifier, element, expectedType } =\n messageOrOptions\n\n // Add prefix and identifier\n message = `${componentName}: ${identifier}`\n\n // Append reason\n message += element\n ? ` is not of type ${expectedType ?? 'HTMLElement'}`\n : ' not found'\n }\n\n super(message)\n }\n}\n\n/**\n * Element error options\n *\n * @internal\n * @typedef {object} ElementErrorOptions\n * @property {string} componentName - The name of the component throwing the error\n * @property {string} identifier - An identifier that'll let the user understand which element has an error. This is whatever makes the most sense\n * @property {Element | null} [element] - The element in error\n * @property {string} [expectedType] - The type that was expected for the identifier\n */\n","import { isSupported } from './common/index.mjs'\nimport { SupportError } from './errors/index.mjs'\n\n/**\n * Base Component class\n *\n * Centralises the behaviours shared by our components\n *\n * @internal\n * @abstract\n */\nexport class GOVUKFrontendComponent {\n /**\n * Constructs a new component, validating that GOV.UK Frontend is supported\n *\n * @internal\n */\n constructor() {\n this.checkSupport()\n }\n\n /**\n * Validates whether GOV.UK Frontend is supported\n *\n * @private\n * @throws {SupportError} when GOV.UK Frontend is not supported\n */\n checkSupport() {\n if (!isSupported()) {\n throw new SupportError()\n }\n }\n}\n","import { getFragmentFromUrl, setFocus } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/**\n * Skip link component\n *\n * @preserve\n */\nexport class SkipLink extends GOVUKFrontendComponent {\n /** @private */\n $module\n\n /**\n * @param {Element | null} $module - HTML element to use for skip link\n * @throws {ElementError} when $module is not set or the wrong type\n * @throws {ElementError} when $module.hash does not contain a hash\n * @throws {ElementError} when the linked element is missing or the wrong type\n */\n constructor($module) {\n super()\n\n if (!($module instanceof HTMLAnchorElement)) {\n throw new ElementError({\n componentName: 'Skip link',\n element: $module,\n expectedType: 'HTMLAnchorElement',\n identifier: 'Root element (`$module`)'\n })\n }\n\n this.$module = $module\n\n const hash = this.$module.hash\n const href = this.$module.getAttribute('href') ?? ''\n\n /** @type {URL | undefined} */\n let url\n\n /**\n * Check for valid link URL\n *\n * {@link https://caniuse.com/url}\n * {@link https://url.spec.whatwg.org}\n *\n */\n try {\n url = new window.URL(this.$module.href)\n } catch (error) {\n throw new ElementError(\n `Skip link: Target link (\\`href=\"${href}\"\\`) is invalid`\n )\n }\n\n // Return early for external URLs or links to other pages\n if (\n url.origin !== window.location.origin ||\n url.pathname !== window.location.pathname\n ) {\n return\n }\n\n const linkedElementId = getFragmentFromUrl(hash)\n\n // Check link path matching current page\n if (!linkedElementId) {\n throw new ElementError(\n `Skip link: Target link (\\`href=\"${href}\"\\`) has no hash fragment`\n )\n }\n\n const $linkedElement = document.getElementById(linkedElementId)\n\n // Check for link target element\n if (!$linkedElement) {\n throw new ElementError({\n componentName: 'Skip link',\n element: $linkedElement,\n identifier: `Target content (\\`id=\"${linkedElementId}\"\\`)`\n })\n }\n\n /**\n * Focus the linked element on click\n *\n * Adds a helper CSS class to hide native focus styles,\n * but removes it on blur to restore native focus styles\n */\n this.$module.addEventListener('click', () =>\n setFocus($linkedElement, {\n onBeforeFocus() {\n $linkedElement.classList.add('govuk-skip-link-focused-element')\n },\n onBlur() {\n $linkedElement.classList.remove('govuk-skip-link-focused-element')\n }\n })\n )\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-skip-link'\n}\n"],"names":["getFragmentFromUrl","url","includes","undefined","split","pop","setFocus","$element","options","_options$onBeforeFocu","isFocusable","getAttribute","setAttribute","onFocus","addEventListener","onBlur","once","_options$onBlur","call","removeAttribute","onBeforeFocus","focus","isSupported","$scope","document","body","classList","contains","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","message","componentName","identifier","element","expectedType","GOVUKFrontendComponent","checkSupport","SkipLink","$module","_this$$module$getAttr","HTMLAnchorElement","hash","href","window","URL","error","origin","location","pathname","linkedElementId","$linkedElement","getElementById","add","remove","moduleName"],"mappings":";;;;;;EAmHO,SAASA,kBAAkBA,CAACC,GAAG,EAAE;EACtC,EAAA,IAAI,CAACA,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;EACtB,IAAA,OAAOC,SAAS,CAAA;EAClB,GAAA;IAEA,OAAOF,GAAG,CAACG,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,EAAE,CAAA;EAC7B,CAAA;EAoCO,SAASC,QAAQA,CAACC,QAAQ,EAAEC,OAAO,GAAG,EAAE,EAAE;EAAA,EAAA,IAAAC,qBAAA,CAAA;EAC/C,EAAA,MAAMC,WAAW,GAAGH,QAAQ,CAACI,YAAY,CAAC,UAAU,CAAC,CAAA;IAErD,IAAI,CAACD,WAAW,EAAE;EAChBH,IAAAA,QAAQ,CAACK,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAA;EACzC,GAAA;IAKA,SAASC,OAAOA,GAAG;EACjBN,IAAAA,QAAQ,CAACO,gBAAgB,CAAC,MAAM,EAAEC,MAAM,EAAE;EAAEC,MAAAA,IAAI,EAAE,IAAA;EAAK,KAAC,CAAC,CAAA;EAC3D,GAAA;IAKA,SAASD,MAAMA,GAAG;EAAA,IAAA,IAAAE,eAAA,CAAA;MAChB,CAAAA,eAAA,GAAAT,OAAO,CAACO,MAAM,KAAdE,IAAAA,IAAAA,eAAA,CAAgBC,IAAI,CAACX,QAAQ,CAAC,CAAA;MAE9B,IAAI,CAACG,WAAW,EAAE;EAChBH,MAAAA,QAAQ,CAACY,eAAe,CAAC,UAAU,CAAC,CAAA;EACtC,KAAA;EACF,GAAA;EAGAZ,EAAAA,QAAQ,CAACO,gBAAgB,CAAC,OAAO,EAAED,OAAO,EAAE;EAAEG,IAAAA,IAAI,EAAE,IAAA;EAAK,GAAC,CAAC,CAAA;IAG3D,CAAAP,qBAAA,GAAAD,OAAO,CAACY,aAAa,KAArBX,IAAAA,IAAAA,qBAAA,CAAuBS,IAAI,CAACX,QAAQ,CAAC,CAAA;IACrCA,QAAQ,CAACc,KAAK,EAAE,CAAA;EAClB,CAAA;EAYO,SAASC,WAAWA,CAACC,MAAM,GAAGC,QAAQ,CAACC,IAAI,EAAE;IAClD,IAAI,CAACF,MAAM,EAAE;EACX,IAAA,OAAO,KAAK,CAAA;EACd,GAAA;EAEA,EAAA,OAAOA,MAAM,CAACG,SAAS,CAACC,QAAQ,CAAC,0BAA0B,CAAC,CAAA;EAC9D,CAAA;;EA8DA;EACA;EACA;EACA;EACA;EACA;EACA;;EAEA;EACA;EACA;EACA;EACA;EACA;;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;EC7QO,MAAMC,kBAAkB,SAASC,KAAK,CAAC;EAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;EAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;MAAA,IAC5CC,CAAAA,IAAI,GAAG,oBAAoB,CAAA;EAAA,GAAA;EAC7B,CAAA;EAKO,MAAMC,YAAY,SAASL,kBAAkB,CAAC;EAGnD;EACF;EACA;EACA;EACA;EACEE,EAAAA,WAAWA,CAACP,MAAM,GAAGC,QAAQ,CAACC,IAAI,EAAE;MAClC,MAAMS,cAAc,GAClB,UAAU,IAAIC,iBAAiB,CAACC,SAAS,GACrC,gHAAgH,GAChH,kDAAkD,CAAA;EAExD,IAAA,KAAK,CACHb,MAAM,GACFW,cAAc,GACd,8DACN,CAAC,CAAA;MAAA,IAjBHF,CAAAA,IAAI,GAAG,cAAc,CAAA;EAkBrB,GAAA;EACF,CAAA;EAYO,MAAMK,YAAY,SAAST,kBAAkB,CAAC;IAmBnDE,WAAWA,CAACQ,gBAAgB,EAAE;MAC5B,IAAIC,OAAO,GAAG,OAAOD,gBAAgB,KAAK,QAAQ,GAAGA,gBAAgB,GAAG,EAAE,CAAA;EAG1E,IAAA,IAAI,OAAOA,gBAAgB,KAAK,QAAQ,EAAE;QACxC,MAAM;UAAEE,aAAa;UAAEC,UAAU;UAAEC,OAAO;EAAEC,QAAAA,YAAAA;EAAa,OAAC,GACxDL,gBAAgB,CAAA;EAGlBC,MAAAA,OAAO,GAAG,CAAA,EAAGC,aAAa,CAAA,EAAA,EAAKC,UAAU,CAAE,CAAA,CAAA;QAG3CF,OAAO,IAAIG,OAAO,GACd,CAAmBC,gBAAAA,EAAAA,YAAY,IAAZA,IAAAA,GAAAA,YAAY,GAAI,aAAa,CAAE,CAAA,GAClD,YAAY,CAAA;EAClB,KAAA;MAEA,KAAK,CAACJ,OAAO,CAAC,CAAA;MAAA,IAnChBP,CAAAA,IAAI,GAAG,cAAc,CAAA;EAoCrB,GAAA;EACF;;ECtFO,MAAMY,sBAAsB,CAAC;EAMlCd,EAAAA,WAAWA,GAAG;MACZ,IAAI,CAACe,YAAY,EAAE,CAAA;EACrB,GAAA;EAQAA,EAAAA,YAAYA,GAAG;EACb,IAAA,IAAI,CAACvB,WAAW,EAAE,EAAE;QAClB,MAAM,IAAIW,YAAY,EAAE,CAAA;EAC1B,KAAA;EACF,GAAA;EACF;;EC5BA;EACA;EACA;EACA;EACA;EACO,MAAMa,QAAQ,SAASF,sBAAsB,CAAC;EAInD;EACF;EACA;EACA;EACA;EACA;IACEd,WAAWA,CAACiB,OAAO,EAAE;EAAA,IAAA,IAAAC,qBAAA,CAAA;EACnB,IAAA,KAAK,EAAE,CAAA;EAAA,IAAA,IAAA,CATTD,OAAO,GAAA,KAAA,CAAA,CAAA;EAWL,IAAA,IAAI,EAAEA,OAAO,YAAYE,iBAAiB,CAAC,EAAE;QAC3C,MAAM,IAAIZ,YAAY,CAAC;EACrBG,QAAAA,aAAa,EAAE,WAAW;EAC1BE,QAAAA,OAAO,EAAEK,OAAO;EAChBJ,QAAAA,YAAY,EAAE,mBAAmB;EACjCF,QAAAA,UAAU,EAAE,0BAAA;EACd,OAAC,CAAC,CAAA;EACJ,KAAA;MAEA,IAAI,CAACM,OAAO,GAAGA,OAAO,CAAA;EAEtB,IAAA,MAAMG,IAAI,GAAG,IAAI,CAACH,OAAO,CAACG,IAAI,CAAA;EAC9B,IAAA,MAAMC,IAAI,GAAA,CAAAH,qBAAA,GAAG,IAAI,CAACD,OAAO,CAACpC,YAAY,CAAC,MAAM,CAAC,KAAAqC,IAAAA,GAAAA,qBAAA,GAAI,EAAE,CAAA;EAGpD,IAAA,IAAI/C,GAAG,CAAA;MASP,IAAI;QACFA,GAAG,GAAG,IAAImD,MAAM,CAACC,GAAG,CAAC,IAAI,CAACN,OAAO,CAACI,IAAI,CAAC,CAAA;OACxC,CAAC,OAAOG,KAAK,EAAE;EACd,MAAA,MAAM,IAAIjB,YAAY,CACpB,CAAmCc,gCAAAA,EAAAA,IAAI,iBACzC,CAAC,CAAA;EACH,KAAA;EAGA,IAAA,IACElD,GAAG,CAACsD,MAAM,KAAKH,MAAM,CAACI,QAAQ,CAACD,MAAM,IACrCtD,GAAG,CAACwD,QAAQ,KAAKL,MAAM,CAACI,QAAQ,CAACC,QAAQ,EACzC;EACA,MAAA,OAAA;EACF,KAAA;EAEA,IAAA,MAAMC,eAAe,GAAG1D,kBAAkB,CAACkD,IAAI,CAAC,CAAA;MAGhD,IAAI,CAACQ,eAAe,EAAE;EACpB,MAAA,MAAM,IAAIrB,YAAY,CACpB,CAAmCc,gCAAAA,EAAAA,IAAI,2BACzC,CAAC,CAAA;EACH,KAAA;EAEA,IAAA,MAAMQ,cAAc,GAAGnC,QAAQ,CAACoC,cAAc,CAACF,eAAe,CAAC,CAAA;MAG/D,IAAI,CAACC,cAAc,EAAE;QACnB,MAAM,IAAItB,YAAY,CAAC;EACrBG,QAAAA,aAAa,EAAE,WAAW;EAC1BE,QAAAA,OAAO,EAAEiB,cAAc;UACvBlB,UAAU,EAAE,yBAAyBiB,eAAe,CAAA,IAAA,CAAA;EACtD,OAAC,CAAC,CAAA;EACJ,KAAA;MAQA,IAAI,CAACX,OAAO,CAACjC,gBAAgB,CAAC,OAAO,EAAE,MACrCR,QAAQ,CAACqD,cAAc,EAAE;EACvBvC,MAAAA,aAAaA,GAAG;EACduC,QAAAA,cAAc,CAACjC,SAAS,CAACmC,GAAG,CAAC,iCAAiC,CAAC,CAAA;SAChE;EACD9C,MAAAA,MAAMA,GAAG;EACP4C,QAAAA,cAAc,CAACjC,SAAS,CAACoC,MAAM,CAAC,iCAAiC,CAAC,CAAA;EACpE,OAAA;EACF,KAAC,CACH,CAAC,CAAA;EACH,GAAA;EAMF,CAAA;EA/FahB,QAAQ,CA8FZiB,UAAU,GAAG,iBAAiB;;;;;;;;"}
|
1
|
+
{"version":3,"file":"skip-link.bundle.js","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/skip-link/skip-link.mjs"],"sourcesContent":["import { normaliseString } from './normalise-string.mjs'\n\n/**\n * Common helpers which do not require polyfill.\n *\n * IMPORTANT: If a helper require a polyfill, please isolate it in its own module\n * so that the polyfill can be properly tree-shaken and does not burden\n * the components that do not need that helper\n */\n\n/**\n * Config merging function\n *\n * Takes any number of objects and combines them together, with\n * greatest priority on the LAST item passed in.\n *\n * @internal\n * @param {...{ [key: string]: unknown }} configObjects - Config objects to merge\n * @returns {{ [key: string]: unknown }} A merged config object\n */\nexport function mergeConfigs(...configObjects) {\n // Start with an empty object as our base\n /** @type {{ [key: string]: unknown }} */\n const formattedConfigObject = {}\n\n // Loop through each of the passed objects\n for (const configObject of configObjects) {\n for (const key of Object.keys(configObject)) {\n const option = formattedConfigObject[key]\n const override = configObject[key]\n\n // Push their keys one-by-one into formattedConfigObject. Any duplicate\n // keys with object values will be merged, otherwise the new value will\n // override the existing value.\n if (isObject(option) && isObject(override)) {\n // @ts-expect-error Index signature for type 'string' is missing\n formattedConfigObject[key] = mergeConfigs(option, override)\n } else {\n // Apply override\n formattedConfigObject[key] = override\n }\n }\n }\n\n return formattedConfigObject\n}\n\n/**\n * Extracts keys starting with a particular namespace from dataset ('data-*')\n * object, removing the namespace in the process, normalising all values\n *\n * @internal\n * @param {{ schema: Schema }} Component - Component class\n * @param {DOMStringMap} dataset - The object to extract key-value pairs from\n * @param {string} namespace - The namespace to filter keys with\n * @returns {ObjectNested | undefined} Nested object with dot-separated key namespace removed\n */\nexport function extractConfigByNamespace(Component, dataset, namespace) {\n const property = Component.schema.properties[namespace]\n\n // Only extract configs for object schema properties\n if (property?.type !== 'object') {\n return\n }\n\n // Add default empty config\n const newObject = {\n [namespace]: /** @type {ObjectNested} */ ({})\n }\n\n for (const [key, value] of Object.entries(dataset)) {\n /** @type {ObjectNested | ObjectNested[NestedKey]} */\n let current = newObject\n\n // Split the key into parts, using . as our namespace separator\n const keyParts = key.split('.')\n\n /**\n * Create new level per part\n *\n * e.g. 'i18n.textareaDescription.other' becomes\n * `{ i18n: { textareaDescription: { other } } }`\n */\n for (const [index, name] of keyParts.entries()) {\n if (typeof current === 'object') {\n // Drop down to nested object until the last part\n if (index < keyParts.length - 1) {\n // New nested object (optionally) replaces existing value\n if (!isObject(current[name])) {\n current[name] = {}\n }\n\n // Drop down into new or existing nested object\n current = current[name]\n } else if (key !== namespace) {\n // Normalised value (optionally) replaces existing value\n current[name] = normaliseString(value)\n }\n }\n }\n }\n\n return newObject[namespace]\n}\n\n/**\n * Get hash fragment from URL\n *\n * Extract the hash fragment (everything after the hash) from a URL,\n * but not including the hash symbol\n *\n * @private\n * @param {string} url - URL\n * @returns {string | undefined} Fragment from URL, without the hash\n */\nexport function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined\n }\n\n return url.split('#').pop()\n}\n\n/**\n * Get GOV.UK Frontend breakpoint value from CSS custom property\n *\n * @private\n * @param {string} name - Breakpoint name\n * @returns {{ property: string, value?: string }} Breakpoint object\n */\nexport function getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`\n\n // Get value from `<html>` with breakpoints on CSS :root\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(property)\n\n return {\n property,\n value: value || undefined\n }\n}\n\n/**\n * Move focus to element\n *\n * Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n *\n * @private\n * @template {HTMLElement} FocusElement\n * @param {FocusElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: FocusElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: FocusElement): void} [options.onBlur] - Callback on blur\n */\nexport function setFocus($element, options = {}) {\n const isFocusable = $element.getAttribute('tabindex')\n\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1')\n }\n\n /**\n * Handle element focus\n */\n function onFocus() {\n $element.addEventListener('blur', onBlur, { once: true })\n }\n\n /**\n * Handle element blur\n */\n function onBlur() {\n options.onBlur?.call($element)\n\n if (!isFocusable) {\n $element.removeAttribute('tabindex')\n }\n }\n\n // Add listener to reset element on blur, after focus\n $element.addEventListener('focus', onFocus, { once: true })\n\n // Focus element\n options.onBeforeFocus?.call($element)\n $element.focus()\n}\n\n/**\n * Checks if component is already initialised\n *\n * @internal\n * @param {Element} $root - HTML element to be checked\n * @param {string} moduleName - name of component module\n * @returns {boolean} Whether component is already initialised\n */\nexport function isInitialised($root, moduleName) {\n return (\n $root instanceof HTMLElement &&\n $root.hasAttribute(`data-${moduleName}-init`)\n )\n}\n\n/**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n *\n * @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n */\nexport function isSupported($scope = document.body) {\n if (!$scope) {\n return false\n }\n\n return $scope.classList.contains('govuk-frontend-supported')\n}\n\n/**\n * Validate component config by schema\n *\n * Follows limited examples in JSON schema for wider support in future\n *\n * {@link https://ajv.js.org/json-schema.html#compound-keywords}\n * {@link https://ajv.js.org/packages/ajv-errors.html#single-message}\n *\n * @internal\n * @param {Schema} schema - Config schema\n * @param {{ [key: string]: unknown }} config - Component config\n * @returns {string[]} List of validation errors\n */\nexport function validateConfig(schema, config) {\n const validationErrors = []\n\n // Check errors for each schema\n for (const [name, conditions] of Object.entries(schema)) {\n const errors = []\n\n // Check errors for each schema condition\n if (Array.isArray(conditions)) {\n for (const { required, errorMessage } of conditions) {\n if (!required.every((key) => !!config[key])) {\n errors.push(errorMessage) // Missing config key value\n }\n }\n\n // Check one condition passes or add errors\n if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {\n validationErrors.push(...errors)\n }\n }\n }\n\n return validationErrors\n}\n\n/**\n * Check for an array\n *\n * @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an array\n */\nfunction isArray(option) {\n return Array.isArray(option)\n}\n\n/**\n * Check for an object\n *\n * @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an object\n */\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option)\n}\n\n/**\n * Format error message\n *\n * @internal\n * @param {ComponentWithModuleName} Component - Component that threw the error\n * @param {string} message - Error message\n * @returns {string} - Formatted error message\n */\nexport function formatErrorMessage(Component, message) {\n return `${Component.moduleName}: ${message}`\n}\n\n/**\n * Schema for component config\n *\n * @typedef {object} Schema\n * @property {{ [field: string]: SchemaProperty | undefined }} properties - Schema properties\n * @property {SchemaCondition[]} [anyOf] - List of schema conditions\n */\n\n/**\n * Schema property for component config\n *\n * @typedef {object} SchemaProperty\n * @property {'string' | 'boolean' | 'number' | 'object'} type - Property type\n */\n\n/**\n * Schema condition for component config\n *\n * @typedef {object} SchemaCondition\n * @property {string[]} required - List of required config fields\n * @property {string} errorMessage - Error message when required config fields not provided\n */\n\n/**\n * @internal\n * @typedef {keyof ObjectNested} NestedKey\n * @typedef {{ [key: string]: string | boolean | number | ObjectNested | undefined }} ObjectNested\n */\n\n/* eslint-disable jsdoc/valid-types --\n * `{new(...args: any[] ): object}` is not recognised as valid\n * https://github.com/gajus/eslint-plugin-jsdoc/issues/145#issuecomment-1308722878\n * https://github.com/jsdoc-type-pratt-parser/jsdoc-type-pratt-parser/issues/131\n **/\n\n/**\n * @typedef ComponentWithModuleName\n * @property {string} moduleName - Name of the component\n */\n\n/* eslint-enable jsdoc/valid-types */\n","import { formatErrorMessage } from '../common/index.mjs'\n\n/**\n * GOV.UK Frontend error\n *\n * A base class for `Error`s thrown by GOV.UK Frontend.\n *\n * It is meant to be extended into specific types of errors\n * to be thrown by our code.\n *\n * @example\n * ```js\n * class MissingRootError extends GOVUKFrontendError {\n * // Setting an explicit name is important as extending the class will not\n * // set a new `name` on the subclass. The `name` property is important\n * // to ensure intelligible error names even if the class name gets\n * // mangled by a minifier\n * name = \"MissingRootError\"\n * }\n * ```\n * @virtual\n */\nexport class GOVUKFrontendError extends Error {\n name = 'GOVUKFrontendError'\n}\n\n/**\n * Indicates that GOV.UK Frontend is not supported\n */\nexport class SupportError extends GOVUKFrontendError {\n name = 'SupportError'\n\n /**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * @param {HTMLElement | null} [$scope] - HTML element `<body>` checked for browser support\n */\n constructor($scope = document.body) {\n const supportMessage =\n 'noModule' in HTMLScriptElement.prototype\n ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet'\n : 'GOV.UK Frontend is not supported in this browser'\n\n super(\n $scope\n ? supportMessage\n : 'GOV.UK Frontend initialised without `<script type=\"module\">`'\n )\n }\n}\n\n/**\n * Indicates that a component has received an illegal configuration\n */\nexport class ConfigError extends GOVUKFrontendError {\n name = 'ConfigError'\n}\n\n/**\n * Indicates an issue with an element (possibly `null` or `undefined`)\n */\nexport class ElementError extends GOVUKFrontendError {\n name = 'ElementError'\n\n /**\n * @internal\n * @overload\n * @param {string} message - Element error message\n */\n\n /**\n * @internal\n * @overload\n * @param {ElementErrorOptions} options - Element error options\n */\n\n /**\n * @internal\n * @param {string | ElementErrorOptions} messageOrOptions - Element error message or options\n */\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : ''\n\n // Build message from options\n if (typeof messageOrOptions === 'object') {\n const { component, identifier, element, expectedType } = messageOrOptions\n\n message = identifier\n\n // Append reason\n message += element\n ? ` is not of type ${expectedType ?? 'HTMLElement'}`\n : ' not found'\n\n message = formatErrorMessage(component, message)\n }\n\n super(message)\n }\n}\n\n/**\n * Indicates that a component is already initialised\n */\nexport class InitError extends GOVUKFrontendError {\n name = 'InitError'\n\n /**\n * @internal\n * @param {ComponentWithModuleName | string} componentOrMessage - name of the component module\n */\n constructor(componentOrMessage) {\n const message =\n typeof componentOrMessage === 'string'\n ? componentOrMessage\n : formatErrorMessage(\n componentOrMessage,\n `Root element (\\`$root\\`) already initialised`\n )\n\n super(message)\n }\n}\n\n/**\n * Element error options\n *\n * @internal\n * @typedef {object} ElementErrorOptions\n * @property {string} identifier - An identifier that'll let the user understand which element has an error. This is whatever makes the most sense\n * @property {Element | null} [element] - The element in error\n * @property {string} [expectedType] - The type that was expected for the identifier\n * @property {ComponentWithModuleName} component - Component throwing the error\n */\n\n/**\n * @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName\n */\n","import { isInitialised, isSupported } from './common/index.mjs'\nimport { ElementError, InitError, SupportError } from './errors/index.mjs'\n\n/**\n * Base Component class\n *\n * Centralises the behaviours shared by our components\n *\n * @virtual\n * @template {Element} [RootElementType=HTMLElement]\n */\nexport class GOVUKFrontendComponent {\n /**\n * @type {typeof Element}\n */\n static elementType = HTMLElement\n\n // allows Typescript user to work around the lack of types\n // in GOVUKFrontend package, Typescript is not aware of $root\n // in components that extend GOVUKFrontendComponent\n /**\n * Returns the root element of the component\n *\n * @protected\n * @returns {RootElementType} - the root element of component\n */\n get $root() {\n return this._$root\n }\n\n /**\n * @protected\n * @type {RootElementType}\n */\n _$root\n\n /**\n * Constructs a new component, validating that GOV.UK Frontend is supported\n *\n * @internal\n * @param {Element | null} [$root] - HTML element to use for component\n */\n constructor($root) {\n const childConstructor = /** @type {ChildClassConstructor} */ (\n this.constructor\n )\n\n // TypeScript does not enforce that inheriting classes will define a `moduleName`\n // (even if we add a `@virtual` `static moduleName` property to this class).\n // While we trust users to do this correctly, we do a little check to provide them\n // a helpful error message.\n //\n // After this, we'll be sure that `childConstructor` has a `moduleName`\n // as expected of the `ChildClassConstructor` we've cast `this.constructor` to.\n if (typeof childConstructor.moduleName !== 'string') {\n throw new InitError(`\\`moduleName\\` not defined in component`)\n }\n\n if (!($root instanceof childConstructor.elementType)) {\n throw new ElementError({\n element: $root,\n component: childConstructor,\n identifier: 'Root element (`$root`)',\n expectedType: childConstructor.elementType.name\n })\n } else {\n this._$root = /** @type {RootElementType} */ ($root)\n }\n\n childConstructor.checkSupport()\n\n this.checkInitialised()\n\n const moduleName = childConstructor.moduleName\n\n this.$root.setAttribute(`data-${moduleName}-init`, '')\n }\n\n /**\n * Validates whether component is already initialised\n *\n * @private\n * @throws {InitError} when component is already initialised\n */\n checkInitialised() {\n const constructor = /** @type {ChildClassConstructor} */ (this.constructor)\n const moduleName = constructor.moduleName\n\n if (moduleName && isInitialised(this.$root, moduleName)) {\n throw new InitError(constructor)\n }\n }\n\n /**\n * Validates whether components are supported\n *\n * @throws {SupportError} when the components are not supported\n */\n static checkSupport() {\n if (!isSupported()) {\n throw new SupportError()\n }\n }\n}\n\n/**\n * @typedef ChildClass\n * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component\n */\n\n/**\n * @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor\n */\n","import { getFragmentFromUrl, setFocus } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/**\n * Skip link component\n *\n * @preserve\n * @augments GOVUKFrontendComponent<HTMLAnchorElement>\n */\nexport class SkipLink extends GOVUKFrontendComponent {\n static elementType = HTMLAnchorElement\n\n /**\n * @param {Element | null} $root - HTML element to use for skip link\n * @throws {ElementError} when $root is not set or the wrong type\n * @throws {ElementError} when $root.hash does not contain a hash\n * @throws {ElementError} when the linked element is missing or the wrong type\n */\n constructor($root) {\n super($root)\n\n const hash = this.$root.hash\n const href = this.$root.getAttribute('href') ?? ''\n\n /** @type {URL | undefined} */\n let url\n\n /**\n * Check for valid link URL\n *\n * {@link https://caniuse.com/url}\n * {@link https://url.spec.whatwg.org}\n *\n */\n try {\n url = new window.URL(this.$root.href)\n } catch (error) {\n throw new ElementError(\n `Skip link: Target link (\\`href=\"${href}\"\\`) is invalid`\n )\n }\n\n // Return early for external URLs or links to other pages\n if (\n url.origin !== window.location.origin ||\n url.pathname !== window.location.pathname\n ) {\n return\n }\n\n const linkedElementId = getFragmentFromUrl(hash)\n\n // Check link path matching current page\n if (!linkedElementId) {\n throw new ElementError(\n `Skip link: Target link (\\`href=\"${href}\"\\`) has no hash fragment`\n )\n }\n\n const $linkedElement = document.getElementById(linkedElementId)\n\n // Check for link target element\n if (!$linkedElement) {\n throw new ElementError({\n component: SkipLink,\n element: $linkedElement,\n identifier: `Target content (\\`id=\"${linkedElementId}\"\\`)`\n })\n }\n\n /**\n * Focus the linked element on click\n *\n * Adds a helper CSS class to hide native focus styles,\n * but removes it on blur to restore native focus styles\n */\n this.$root.addEventListener('click', () =>\n setFocus($linkedElement, {\n onBeforeFocus() {\n $linkedElement.classList.add('govuk-skip-link-focused-element')\n },\n onBlur() {\n $linkedElement.classList.remove('govuk-skip-link-focused-element')\n }\n })\n )\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-skip-link'\n}\n"],"names":["getFragmentFromUrl","url","includes","undefined","split","pop","setFocus","$element","options","_options$onBeforeFocu","isFocusable","getAttribute","setAttribute","onFocus","addEventListener","onBlur","once","_options$onBlur","call","removeAttribute","onBeforeFocus","focus","isInitialised","$root","moduleName","HTMLElement","hasAttribute","isSupported","$scope","document","body","classList","contains","formatErrorMessage","Component","message","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","component","identifier","element","expectedType","InitError","componentOrMessage","GOVUKFrontendComponent","_$root","childConstructor","elementType","checkSupport","checkInitialised","SkipLink","_this$$root$getAttrib","hash","href","window","URL","error","origin","location","pathname","linkedElementId","$linkedElement","getElementById","add","remove","HTMLAnchorElement"],"mappings":"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"}
|
@@ -28,12 +28,28 @@ function setFocus($element, options = {}) {
|
|
28
28
|
(_options$onBeforeFocu = options.onBeforeFocus) == null || _options$onBeforeFocu.call($element);
|
29
29
|
$element.focus();
|
30
30
|
}
|
31
|
+
function isInitialised($root, moduleName) {
|
32
|
+
return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);
|
33
|
+
}
|
34
|
+
|
35
|
+
/**
|
36
|
+
* Checks if GOV.UK Frontend is supported on this page
|
37
|
+
*
|
38
|
+
* Some browsers will load and run our JavaScript but GOV.UK Frontend
|
39
|
+
* won't be supported.
|
40
|
+
*
|
41
|
+
* @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support
|
42
|
+
* @returns {boolean} Whether GOV.UK Frontend is supported on this page
|
43
|
+
*/
|
31
44
|
function isSupported($scope = document.body) {
|
32
45
|
if (!$scope) {
|
33
46
|
return false;
|
34
47
|
}
|
35
48
|
return $scope.classList.contains('govuk-frontend-supported');
|
36
49
|
}
|
50
|
+
function formatErrorMessage(Component, message) {
|
51
|
+
return `${Component.moduleName}: ${message}`;
|
52
|
+
}
|
37
53
|
|
38
54
|
/**
|
39
55
|
* Schema for component config
|
@@ -57,6 +73,10 @@ function isSupported($scope = document.body) {
|
|
57
73
|
* @property {string[]} required - List of required config fields
|
58
74
|
* @property {string} errorMessage - Error message when required config fields not provided
|
59
75
|
*/
|
76
|
+
/**
|
77
|
+
* @typedef ComponentWithModuleName
|
78
|
+
* @property {string} moduleName - Name of the component
|
79
|
+
*/
|
60
80
|
|
61
81
|
class GOVUKFrontendError extends Error {
|
62
82
|
constructor(...args) {
|
@@ -81,60 +101,106 @@ class ElementError extends GOVUKFrontendError {
|
|
81
101
|
let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
|
82
102
|
if (typeof messageOrOptions === 'object') {
|
83
103
|
const {
|
84
|
-
|
104
|
+
component,
|
85
105
|
identifier,
|
86
106
|
element,
|
87
107
|
expectedType
|
88
108
|
} = messageOrOptions;
|
89
|
-
message =
|
109
|
+
message = identifier;
|
90
110
|
message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
|
111
|
+
message = formatErrorMessage(component, message);
|
91
112
|
}
|
92
113
|
super(message);
|
93
114
|
this.name = 'ElementError';
|
94
115
|
}
|
95
116
|
}
|
117
|
+
class InitError extends GOVUKFrontendError {
|
118
|
+
constructor(componentOrMessage) {
|
119
|
+
const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\`$root\`) already initialised`);
|
120
|
+
super(message);
|
121
|
+
this.name = 'InitError';
|
122
|
+
}
|
123
|
+
}
|
124
|
+
/**
|
125
|
+
* @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName
|
126
|
+
*/
|
96
127
|
|
97
128
|
class GOVUKFrontendComponent {
|
98
|
-
|
99
|
-
|
129
|
+
/**
|
130
|
+
* Returns the root element of the component
|
131
|
+
*
|
132
|
+
* @protected
|
133
|
+
* @returns {RootElementType} - the root element of component
|
134
|
+
*/
|
135
|
+
get $root() {
|
136
|
+
return this._$root;
|
100
137
|
}
|
101
|
-
|
138
|
+
constructor($root) {
|
139
|
+
this._$root = void 0;
|
140
|
+
const childConstructor = this.constructor;
|
141
|
+
if (typeof childConstructor.moduleName !== 'string') {
|
142
|
+
throw new InitError(`\`moduleName\` not defined in component`);
|
143
|
+
}
|
144
|
+
if (!($root instanceof childConstructor.elementType)) {
|
145
|
+
throw new ElementError({
|
146
|
+
element: $root,
|
147
|
+
component: childConstructor,
|
148
|
+
identifier: 'Root element (`$root`)',
|
149
|
+
expectedType: childConstructor.elementType.name
|
150
|
+
});
|
151
|
+
} else {
|
152
|
+
this._$root = $root;
|
153
|
+
}
|
154
|
+
childConstructor.checkSupport();
|
155
|
+
this.checkInitialised();
|
156
|
+
const moduleName = childConstructor.moduleName;
|
157
|
+
this.$root.setAttribute(`data-${moduleName}-init`, '');
|
158
|
+
}
|
159
|
+
checkInitialised() {
|
160
|
+
const constructor = this.constructor;
|
161
|
+
const moduleName = constructor.moduleName;
|
162
|
+
if (moduleName && isInitialised(this.$root, moduleName)) {
|
163
|
+
throw new InitError(constructor);
|
164
|
+
}
|
165
|
+
}
|
166
|
+
static checkSupport() {
|
102
167
|
if (!isSupported()) {
|
103
168
|
throw new SupportError();
|
104
169
|
}
|
105
170
|
}
|
106
171
|
}
|
107
172
|
|
173
|
+
/**
|
174
|
+
* @typedef ChildClass
|
175
|
+
* @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component
|
176
|
+
*/
|
177
|
+
|
178
|
+
/**
|
179
|
+
* @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor
|
180
|
+
*/
|
181
|
+
GOVUKFrontendComponent.elementType = HTMLElement;
|
182
|
+
|
108
183
|
/**
|
109
184
|
* Skip link component
|
110
185
|
*
|
111
186
|
* @preserve
|
187
|
+
* @augments GOVUKFrontendComponent<HTMLAnchorElement>
|
112
188
|
*/
|
113
189
|
class SkipLink extends GOVUKFrontendComponent {
|
114
190
|
/**
|
115
|
-
* @param {Element | null} $
|
116
|
-
* @throws {ElementError} when $
|
117
|
-
* @throws {ElementError} when $
|
191
|
+
* @param {Element | null} $root - HTML element to use for skip link
|
192
|
+
* @throws {ElementError} when $root is not set or the wrong type
|
193
|
+
* @throws {ElementError} when $root.hash does not contain a hash
|
118
194
|
* @throws {ElementError} when the linked element is missing or the wrong type
|
119
195
|
*/
|
120
|
-
constructor($
|
121
|
-
var _this$$
|
122
|
-
super();
|
123
|
-
|
124
|
-
|
125
|
-
throw new ElementError({
|
126
|
-
componentName: 'Skip link',
|
127
|
-
element: $module,
|
128
|
-
expectedType: 'HTMLAnchorElement',
|
129
|
-
identifier: 'Root element (`$module`)'
|
130
|
-
});
|
131
|
-
}
|
132
|
-
this.$module = $module;
|
133
|
-
const hash = this.$module.hash;
|
134
|
-
const href = (_this$$module$getAttr = this.$module.getAttribute('href')) != null ? _this$$module$getAttr : '';
|
196
|
+
constructor($root) {
|
197
|
+
var _this$$root$getAttrib;
|
198
|
+
super($root);
|
199
|
+
const hash = this.$root.hash;
|
200
|
+
const href = (_this$$root$getAttrib = this.$root.getAttribute('href')) != null ? _this$$root$getAttrib : '';
|
135
201
|
let url;
|
136
202
|
try {
|
137
|
-
url = new window.URL(this.$
|
203
|
+
url = new window.URL(this.$root.href);
|
138
204
|
} catch (error) {
|
139
205
|
throw new ElementError(`Skip link: Target link (\`href="${href}"\`) is invalid`);
|
140
206
|
}
|
@@ -148,12 +214,12 @@ class SkipLink extends GOVUKFrontendComponent {
|
|
148
214
|
const $linkedElement = document.getElementById(linkedElementId);
|
149
215
|
if (!$linkedElement) {
|
150
216
|
throw new ElementError({
|
151
|
-
|
217
|
+
component: SkipLink,
|
152
218
|
element: $linkedElement,
|
153
219
|
identifier: `Target content (\`id="${linkedElementId}"\`)`
|
154
220
|
});
|
155
221
|
}
|
156
|
-
this.$
|
222
|
+
this.$root.addEventListener('click', () => setFocus($linkedElement, {
|
157
223
|
onBeforeFocus() {
|
158
224
|
$linkedElement.classList.add('govuk-skip-link-focused-element');
|
159
225
|
},
|
@@ -163,6 +229,7 @@ class SkipLink extends GOVUKFrontendComponent {
|
|
163
229
|
}));
|
164
230
|
}
|
165
231
|
}
|
232
|
+
SkipLink.elementType = HTMLAnchorElement;
|
166
233
|
SkipLink.moduleName = 'govuk-skip-link';
|
167
234
|
|
168
235
|
export { SkipLink };
|