@nationalarchives/frontend 0.19.0 → 0.20.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/nationalarchives/all+analytics.js +1 -1
- package/nationalarchives/all+analytics.js.map +1 -1
- package/nationalarchives/all.js +1 -1
- package/nationalarchives/all.js.map +1 -1
- package/nationalarchives/components/checkboxes/macro-options.json +15 -15
- package/nationalarchives/components/compound-filters/macro-options.json +6 -6
- package/nationalarchives/components/cookie-banner/macro-options.json +11 -7
- package/nationalarchives/components/date-input/date-input-day.njk +1 -1
- package/nationalarchives/components/date-input/date-input-month.njk +1 -1
- package/nationalarchives/components/date-input/date-input-year.njk +1 -1
- package/nationalarchives/components/date-input/fixtures.json +5 -5
- package/nationalarchives/components/date-input/macro-options.json +10 -16
- package/nationalarchives/components/date-input/template.njk +11 -11
- package/nationalarchives/components/date-search/macro-options.json +11 -11
- package/nationalarchives/components/error-summary/error-summary.js +1 -1
- package/nationalarchives/components/error-summary/error-summary.js.map +1 -1
- package/nationalarchives/components/error-summary/error-summary.mjs +108 -0
- package/nationalarchives/components/error-summary/macro-options.json +1 -1
- package/nationalarchives/components/files-list/macro-options.json +1 -1
- package/nationalarchives/components/footer/fixtures.json +3 -3
- package/nationalarchives/components/footer/macro-options.json +25 -18
- package/nationalarchives/components/footer/template.njk +3 -5
- package/nationalarchives/components/gallery/macro-options.json +1 -1
- package/nationalarchives/components/hero/macro-options.json +4 -3
- package/nationalarchives/components/index-grid/macro-options.json +1 -1
- package/nationalarchives/components/picture/macro-options.json +1 -1
- package/nationalarchives/components/radios/macro-options.json +11 -11
- package/nationalarchives/components/search-field/macro-options.json +7 -7
- package/nationalarchives/components/search-field/template.njk +1 -2
- package/nationalarchives/components/secondary-navigation/macro-options.json +3 -3
- package/nationalarchives/components/select/macro-options.json +10 -10
- package/nationalarchives/components/skip-link/macro-options.json +4 -2
- package/nationalarchives/components/tabs/macro-options.json +1 -1
- package/nationalarchives/components/text-input/fixtures.json +79 -12
- package/nationalarchives/components/text-input/macro-options.json +33 -12
- package/nationalarchives/components/text-input/text-input.njk +3 -2
- package/nationalarchives/components/textarea/fixtures.json +58 -10
- package/nationalarchives/components/textarea/macro-options.json +26 -10
- package/nationalarchives/components/textarea/template.njk +1 -1
- package/nationalarchives/components/warning/macro-options.json +4 -3
- package/nationalarchives/templates/fixtures.json +6 -6
- package/package.json +1 -1
@@ -3,49 +3,49 @@
|
|
3
3
|
"name": "label",
|
4
4
|
"type": "string",
|
5
5
|
"required": true,
|
6
|
-
"description": ""
|
6
|
+
"description": "The label for the checkboxes field."
|
7
7
|
},
|
8
8
|
{
|
9
9
|
"name": "headingLevel",
|
10
10
|
"type": "number",
|
11
11
|
"required": true,
|
12
|
-
"description": ""
|
12
|
+
"description": "The heading level which represents an element from `<h1>` through to `<h6>`."
|
13
13
|
},
|
14
14
|
{
|
15
15
|
"name": "headingSize",
|
16
16
|
"type": "string",
|
17
17
|
"required": false,
|
18
|
-
"description": ""
|
18
|
+
"description": "The physical size of the checkboxes title (`xl`, `l`, `m` or `s`)."
|
19
19
|
},
|
20
20
|
{
|
21
21
|
"name": "id",
|
22
22
|
"type": "string",
|
23
23
|
"required": true,
|
24
|
-
"description": ""
|
24
|
+
"description": "A unique ID for the checkboxes component."
|
25
25
|
},
|
26
26
|
{
|
27
27
|
"name": "name",
|
28
28
|
"type": "string",
|
29
29
|
"required": true,
|
30
|
-
"description": ""
|
30
|
+
"description": "The name of the form field."
|
31
31
|
},
|
32
32
|
{
|
33
33
|
"name": "hint",
|
34
34
|
"type": "string",
|
35
35
|
"required": false,
|
36
|
-
"description": ""
|
36
|
+
"description": "An optional hint to display above the form field."
|
37
37
|
},
|
38
38
|
{
|
39
39
|
"name": "error",
|
40
40
|
"type": "object",
|
41
41
|
"required": false,
|
42
|
-
"description": "",
|
42
|
+
"description": "If set, the details of any errors.",
|
43
43
|
"params": [
|
44
44
|
{
|
45
45
|
"name": "text",
|
46
46
|
"type": "string",
|
47
47
|
"required": true,
|
48
|
-
"description": ""
|
48
|
+
"description": "The error text to display."
|
49
49
|
}
|
50
50
|
]
|
51
51
|
},
|
@@ -53,31 +53,31 @@
|
|
53
53
|
"name": "items",
|
54
54
|
"type": "array",
|
55
55
|
"required": true,
|
56
|
-
"description": "",
|
56
|
+
"description": "A list of checkbox items to render.",
|
57
57
|
"params": [
|
58
58
|
{
|
59
59
|
"name": "text",
|
60
60
|
"type": "string",
|
61
61
|
"required": true,
|
62
|
-
"description": ""
|
62
|
+
"description": "The label of the checkbox item."
|
63
63
|
},
|
64
64
|
{
|
65
65
|
"name": "value",
|
66
66
|
"type": "string",
|
67
67
|
"required": true,
|
68
|
-
"description": ""
|
68
|
+
"description": "The form field value."
|
69
69
|
},
|
70
70
|
{
|
71
71
|
"name": "name",
|
72
72
|
"type": "string",
|
73
73
|
"required": false,
|
74
|
-
"description": ""
|
74
|
+
"description": "The name of the form field item. If set, this will override the main `name` property."
|
75
75
|
},
|
76
76
|
{
|
77
77
|
"name": "checked",
|
78
78
|
"type": "boolean",
|
79
79
|
"required": false,
|
80
|
-
"description": ""
|
80
|
+
"description": "If true, the checkbox will be checked."
|
81
81
|
}
|
82
82
|
]
|
83
83
|
},
|
@@ -85,13 +85,13 @@
|
|
85
85
|
"name": "small",
|
86
86
|
"type": "boolean",
|
87
87
|
"required": false,
|
88
|
-
"description": ""
|
88
|
+
"description": "If true, show smaller checkboxes."
|
89
89
|
},
|
90
90
|
{
|
91
91
|
"name": "inline",
|
92
92
|
"type": "boolean",
|
93
93
|
"required": false,
|
94
|
-
"description": ""
|
94
|
+
"description": "If true, show the checkboxes inline rather than vertical."
|
95
95
|
},
|
96
96
|
{
|
97
97
|
"name": "formGroupClasses",
|
@@ -3,25 +3,25 @@
|
|
3
3
|
"name": "items",
|
4
4
|
"type": "array",
|
5
5
|
"required": true,
|
6
|
-
"description": "",
|
6
|
+
"description": "A list of compound filter items.",
|
7
7
|
"params": [
|
8
8
|
{
|
9
9
|
"name": "label",
|
10
10
|
"type": "string",
|
11
11
|
"required": true,
|
12
|
-
"description": ""
|
12
|
+
"description": "The label to show for the filter item."
|
13
13
|
},
|
14
14
|
{
|
15
15
|
"name": "href",
|
16
16
|
"type": "string",
|
17
17
|
"required": true,
|
18
|
-
"description": ""
|
18
|
+
"description": "The URL for the filter item."
|
19
19
|
},
|
20
20
|
{
|
21
21
|
"name": "title",
|
22
22
|
"type": "string",
|
23
23
|
"required": false,
|
24
|
-
"description": ""
|
24
|
+
"description": "An optional title for the filter item."
|
25
25
|
}
|
26
26
|
]
|
27
27
|
},
|
@@ -29,13 +29,13 @@
|
|
29
29
|
"name": "removeAllText",
|
30
30
|
"type": "string",
|
31
31
|
"required": false,
|
32
|
-
"description": ""
|
32
|
+
"description": "The text to show for the 'Remove all' link."
|
33
33
|
},
|
34
34
|
{
|
35
35
|
"name": "removeAllHref",
|
36
36
|
"type": "string",
|
37
37
|
"required": false,
|
38
|
-
"description": ""
|
38
|
+
"description": "The URL for the 'Remove all' link."
|
39
39
|
},
|
40
40
|
{
|
41
41
|
"name": "classes",
|
@@ -3,43 +3,47 @@
|
|
3
3
|
"name": "serviceName",
|
4
4
|
"type": "string",
|
5
5
|
"required": true,
|
6
|
-
"description": ""
|
6
|
+
"description": "The name of the service that the cookie banner is for."
|
7
7
|
},
|
8
8
|
{
|
9
9
|
"name": "title",
|
10
10
|
"type": "string",
|
11
11
|
"required": false,
|
12
|
-
"
|
12
|
+
"default": "This website uses cookies",
|
13
|
+
"description": "The main title of the cookie banner."
|
13
14
|
},
|
14
15
|
{
|
15
16
|
"name": "body",
|
16
17
|
"type": "string",
|
17
18
|
"required": false,
|
18
|
-
"
|
19
|
+
"default": "We use some essential cookies to make this service work.\nWe'd also like to use analytics cookies so we can understand how you use the service and make improvements.",
|
20
|
+
"description": "The body text of the cookie banner."
|
19
21
|
},
|
20
22
|
{
|
21
23
|
"name": "acceptedBody",
|
22
24
|
"type": "string",
|
23
25
|
"required": false,
|
24
|
-
"
|
26
|
+
"default": "You have accepted optional cookies. You can change your cookie settings on the [cookies page](cookiesUrl)",
|
27
|
+
"description": "The text to show if the user has accepts cookies."
|
25
28
|
},
|
26
29
|
{
|
27
30
|
"name": "rejectedBody",
|
28
31
|
"type": "string",
|
29
32
|
"required": false,
|
30
|
-
"
|
33
|
+
"default": "You have rejected optional cookies. You can change your cookie settings on the [cookies page](cookiesUrl)",
|
34
|
+
"description": "The text to show if the user declines cookies."
|
31
35
|
},
|
32
36
|
{
|
33
37
|
"name": "cookiesUrl",
|
34
38
|
"type": "string",
|
35
39
|
"required": true,
|
36
|
-
"description": ""
|
40
|
+
"description": "The URL of the cookie preferences page for the service."
|
37
41
|
},
|
38
42
|
{
|
39
43
|
"name": "preferencesSetKey",
|
40
44
|
"type": "string",
|
41
45
|
"required": false,
|
42
|
-
"description": ""
|
46
|
+
"description": "If set, the name of the cookie used to indicate that the user has set their cookie preferences."
|
43
47
|
},
|
44
48
|
{
|
45
49
|
"name": "style",
|
@@ -3,6 +3,6 @@
|
|
3
3
|
<label for="{{ params.id }}-day" class="tna-date-input__item-label">
|
4
4
|
Day
|
5
5
|
</label>
|
6
|
-
<input type="text" id="{{ params.id }}-day" value="{{ params.value.day if params.value }}" name="{{ params.name }}
|
6
|
+
<input type="text" id="{{ params.id }}-day" value="{{ params.value.day if params.value }}" name="{{ params.name }}-day" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-day"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
|
7
7
|
</div>
|
8
8
|
{%- endmacro %}
|
@@ -3,6 +3,6 @@
|
|
3
3
|
<label for="{{ params.id }}-month" class="tna-date-input__item-label">
|
4
4
|
Month
|
5
5
|
</label>
|
6
|
-
<input type="text" id="{{ params.id }}-month" value="{{ params.value.month if params.value }}" name="{{ params.name }}
|
6
|
+
<input type="text" id="{{ params.id }}-month" value="{{ params.value.month if params.value }}" name="{{ params.name }}-month" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-month"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
|
7
7
|
</div>
|
8
8
|
{%- endmacro %}
|
@@ -3,6 +3,6 @@
|
|
3
3
|
<label for="{{ params.id }}-year" class="tna-date-input__item-label">
|
4
4
|
Year
|
5
5
|
</label>
|
6
|
-
<input type="text" id="{{ params.id }}-year" value="{{ params.value.year if params.value }}" name="{{ params.name }}
|
6
|
+
<input type="text" id="{{ params.id }}-year" value="{{ params.value.year if params.value }}" name="{{ params.name }}-year" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %} tna-date-input__item-input--wider" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-year"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
|
7
7
|
</div>
|
8
8
|
{%- endmacro %}
|
@@ -86,7 +86,7 @@
|
|
86
86
|
"headingSize": "xs",
|
87
87
|
"id": "date",
|
88
88
|
"name": "date",
|
89
|
-
"fields": ["
|
89
|
+
"fields": ["m", "y"]
|
90
90
|
},
|
91
91
|
"html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div></div></fieldset></div>"
|
92
92
|
},
|
@@ -98,22 +98,22 @@
|
|
98
98
|
"headingSize": "xs",
|
99
99
|
"id": "date",
|
100
100
|
"name": "date",
|
101
|
-
"fields": ["
|
101
|
+
"fields": ["y", "m"],
|
102
102
|
"progressive": true
|
103
103
|
},
|
104
104
|
"html": "<div class=\"tna-form__group\" data-module=\"date-input\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div></div></fieldset></div>"
|
105
105
|
},
|
106
106
|
{
|
107
|
-
"name": "
|
107
|
+
"name": "autofill date of birth",
|
108
108
|
"options": {
|
109
109
|
"label": "Enter a start date",
|
110
110
|
"headingLevel": 4,
|
111
111
|
"headingSize": "xs",
|
112
112
|
"id": "date",
|
113
113
|
"name": "date",
|
114
|
-
"
|
114
|
+
"autofillDateOfBirth": true
|
115
115
|
},
|
116
|
-
"html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--day\"><label for=\"date-day\" class=\"tna-date-input__item-label\">Day</label><input type=\"text\" id=\"date-day\" value=\"\" name=\"date\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div></div></fieldset></div>"
|
116
|
+
"html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--day\"><label for=\"date-day\" class=\"tna-date-input__item-label\">Day</label><input type=\"text\" id=\"date-day\" value=\"\" name=\"date-day\" class=\"tna-date-input__item-input\" inputmode=\"numeric\" autocomplete=\"bday-day\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\" autocomplete=\"bday-month\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\" autocomplete=\"bday-year\"></div></div></fieldset></div>"
|
117
117
|
},
|
118
118
|
{
|
119
119
|
"name": "with classes",
|
@@ -3,37 +3,37 @@
|
|
3
3
|
"name": "label",
|
4
4
|
"type": "string",
|
5
5
|
"required": true,
|
6
|
-
"description": ""
|
6
|
+
"description": "The label for the date input field."
|
7
7
|
},
|
8
8
|
{
|
9
9
|
"name": "headingLevel",
|
10
10
|
"type": "number",
|
11
11
|
"required": true,
|
12
|
-
"description": ""
|
12
|
+
"description": "The heading level which represents an element from `<h1>` through to `<h6>`."
|
13
13
|
},
|
14
14
|
{
|
15
15
|
"name": "headingSize",
|
16
16
|
"type": "string",
|
17
17
|
"required": false,
|
18
|
-
"description": ""
|
18
|
+
"description": "The physical size of the date input title (`xl`, `l`, `m` or `s`)."
|
19
19
|
},
|
20
20
|
{
|
21
21
|
"name": "id",
|
22
22
|
"type": "string",
|
23
23
|
"required": true,
|
24
|
-
"description": ""
|
24
|
+
"description": "A unique ID for the date input component."
|
25
25
|
},
|
26
26
|
{
|
27
27
|
"name": "name",
|
28
28
|
"type": "string",
|
29
29
|
"required": true,
|
30
|
-
"description": ""
|
30
|
+
"description": "The name of the form field."
|
31
31
|
},
|
32
32
|
{
|
33
33
|
"name": "hint",
|
34
34
|
"type": "string",
|
35
35
|
"required": false,
|
36
|
-
"description": ""
|
36
|
+
"description": "An optional hint to display above the form field."
|
37
37
|
},
|
38
38
|
{
|
39
39
|
"name": "fields",
|
@@ -45,7 +45,7 @@
|
|
45
45
|
"name": "value",
|
46
46
|
"type": "object",
|
47
47
|
"required": false,
|
48
|
-
"description": "",
|
48
|
+
"description": "The values of the date fields.",
|
49
49
|
"params": [
|
50
50
|
{
|
51
51
|
"name": "day",
|
@@ -71,13 +71,13 @@
|
|
71
71
|
"name": "error",
|
72
72
|
"type": "object",
|
73
73
|
"required": false,
|
74
|
-
"description": "",
|
74
|
+
"description": "If set, the details of any errors.",
|
75
75
|
"params": [
|
76
76
|
{
|
77
77
|
"name": "text",
|
78
78
|
"type": "string",
|
79
79
|
"required": true,
|
80
|
-
"description": ""
|
80
|
+
"description": "The error text to display."
|
81
81
|
}
|
82
82
|
]
|
83
83
|
},
|
@@ -85,7 +85,7 @@
|
|
85
85
|
"name": "inline",
|
86
86
|
"type": "boolean",
|
87
87
|
"required": false,
|
88
|
-
"description": ""
|
88
|
+
"description": "If true, show the date inputs inline rather than vertical."
|
89
89
|
},
|
90
90
|
{
|
91
91
|
"name": "progressive",
|
@@ -93,12 +93,6 @@
|
|
93
93
|
"required": false,
|
94
94
|
"description": ""
|
95
95
|
},
|
96
|
-
{
|
97
|
-
"name": "removeFieldNameSuffixes",
|
98
|
-
"type": "boolean",
|
99
|
-
"required": false,
|
100
|
-
"description": ""
|
101
|
-
},
|
102
96
|
{
|
103
97
|
"name": "formGroupClasses",
|
104
98
|
"type": "string",
|
@@ -29,29 +29,29 @@
|
|
29
29
|
</p>
|
30
30
|
{%- endif %}
|
31
31
|
<div class="tna-date-input{% if params.inline %} tna-date-input--inline{% endif %}" id="{{ params.id }}">
|
32
|
-
{%- set fields = params.fields if params.fields else ['
|
32
|
+
{%- set fields = params.fields if params.fields else ['d', 'm', 'y'] -%}
|
33
33
|
{%- if params.progressive %}
|
34
34
|
{%- if params.fields %}
|
35
35
|
{%- set fields = [] -%}
|
36
|
-
{% if '
|
37
|
-
{%- set fields = fields
|
36
|
+
{% if 'y' in params.fields %}
|
37
|
+
{%- set fields = fields + ['year'] -%}
|
38
38
|
{%- endif %}
|
39
|
-
{% if '
|
40
|
-
{%- set fields = fields
|
39
|
+
{% if 'm' in params.fields %}
|
40
|
+
{%- set fields = fields + ['month'] -%}
|
41
41
|
{%- endif %}
|
42
|
-
{% if '
|
43
|
-
{%- set fields = fields
|
42
|
+
{% if 'd' in params.fields %}
|
43
|
+
{%- set fields = fields + ['day'] -%}
|
44
44
|
{%- endif %}
|
45
45
|
{%- else %}
|
46
|
-
{%- set fields = ['
|
46
|
+
{%- set fields = ['y', 'm', 'd'] -%}
|
47
47
|
{%- endif %}
|
48
48
|
{%- endif %}
|
49
49
|
{%- for field in fields %}
|
50
|
-
{%- if field == '
|
50
|
+
{%- if field == 'd' %}
|
51
51
|
{{ tnaDateInputDayElement(params) | indent(6) }}
|
52
|
-
{%- elif field == '
|
52
|
+
{%- elif field == 'm' %}
|
53
53
|
{{ tnaDateInputMonthElement(params) | indent(6) }}
|
54
|
-
{%- elif field == '
|
54
|
+
{%- elif field == 'y' %}
|
55
55
|
{{ tnaDateInputYearElement(params) | indent(6) }}
|
56
56
|
{%- endif %}
|
57
57
|
{%- endfor %}
|
@@ -3,55 +3,55 @@
|
|
3
3
|
"name": "label",
|
4
4
|
"type": "string",
|
5
5
|
"required": true,
|
6
|
-
"description": ""
|
6
|
+
"description": "The label for the date search field."
|
7
7
|
},
|
8
8
|
{
|
9
9
|
"name": "headingLevel",
|
10
10
|
"type": "number",
|
11
11
|
"required": true,
|
12
|
-
"description": ""
|
12
|
+
"description": "The heading level which represents an element from `<h1>` through to `<h6>`."
|
13
13
|
},
|
14
14
|
{
|
15
15
|
"name": "headingSize",
|
16
16
|
"type": "string",
|
17
17
|
"required": false,
|
18
|
-
"description": ""
|
18
|
+
"description": "The physical size of the date search title (`xl`, `l`, `m` or `s`)."
|
19
19
|
},
|
20
20
|
{
|
21
21
|
"name": "id",
|
22
22
|
"type": "string",
|
23
23
|
"required": true,
|
24
|
-
"description": ""
|
24
|
+
"description": "A unique ID for the date search component."
|
25
25
|
},
|
26
26
|
{
|
27
27
|
"name": "name",
|
28
28
|
"type": "string",
|
29
29
|
"required": true,
|
30
|
-
"description": ""
|
30
|
+
"description": "The name of the form field."
|
31
31
|
},
|
32
32
|
{
|
33
33
|
"name": "hint",
|
34
34
|
"type": "string",
|
35
35
|
"required": false,
|
36
|
-
"description": ""
|
36
|
+
"description": "An optional hint to display above the form field."
|
37
37
|
},
|
38
38
|
{
|
39
39
|
"name": "value",
|
40
40
|
"type": "string",
|
41
41
|
"required": false,
|
42
|
-
"description": ""
|
42
|
+
"description": "The form field value."
|
43
43
|
},
|
44
44
|
{
|
45
45
|
"name": "error",
|
46
46
|
"type": "object",
|
47
47
|
"required": false,
|
48
|
-
"description": "",
|
48
|
+
"description": "If set, the details of any errors.",
|
49
49
|
"params": [
|
50
50
|
{
|
51
51
|
"name": "text",
|
52
52
|
"type": "string",
|
53
53
|
"required": true,
|
54
|
-
"description": ""
|
54
|
+
"description": "The error text to display."
|
55
55
|
}
|
56
56
|
]
|
57
57
|
},
|
@@ -59,13 +59,13 @@
|
|
59
59
|
"name": "maxWidth",
|
60
60
|
"type": "boolean",
|
61
61
|
"required": false,
|
62
|
-
"description": ""
|
62
|
+
"description": "If true, make the date search field expand to the full width of the container."
|
63
63
|
},
|
64
64
|
{
|
65
65
|
"name": "inline",
|
66
66
|
"type": "boolean",
|
67
67
|
"required": false,
|
68
|
-
"description": ""
|
68
|
+
"description": "If true, show the date search inline rather than vertical."
|
69
69
|
},
|
70
70
|
{
|
71
71
|
"name": "formGroupClasses",
|
@@ -1,2 +1,2 @@
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("TNAFrontend",[],t):"object"==typeof exports?exports.TNAFrontend=t():e.TNAFrontend=t()}(self,(()=>(()=>{"use strict";var e={d:(t,
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("TNAFrontend",[],t):"object"==typeof exports?exports.TNAFrontend=t():e.TNAFrontend=t()}(self,(()=>(()=>{"use strict";var e={d:(t,n)=>{for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function n(e){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},n(e)}function r(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,o(r.key),r)}}function o(e){var t=function(e){if("object"!=n(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=n(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==n(t)?t:t+""}e.r(t),e.d(t,{ErrorSummary:()=>i});var i=function(){return e=function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.$module=t},t=[{key:"init",value:function(){var e=this;this.$module&&("true"===this.$module.dataset.disableAutofocus||this.setFocus(this.$module),this.$module.addEventListener("click",(function(t){return e.handleClick(t)})))}},{key:"setFocus",value:function(e){var t,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=e.getAttribute("tabindex");function o(){var t;null===(t=n.onBlur)||void 0===t||t.call(e),r||e.removeAttribute("tabindex")}r||e.setAttribute("tabindex","-1"),e.addEventListener("focus",(function(){e.addEventListener("blur",o,{once:!0})}),{once:!0}),null===(t=n.onBeforeFocus)||void 0===t||t.call(e),e.focus()}},{key:"handleClick",value:function(e){var t=e.target;t&&this.focusTarget(t)&&e.preventDefault()}},{key:"getFragmentFromUrl",value:function(e){if(e.includes("#"))return e.split("#").pop()}},{key:"focusTarget",value:function(e){if(!(e instanceof HTMLAnchorElement))return!1;var t=this.getFragmentFromUrl(e.href);if(!t)return!1;var n=document.getElementById(t);if(!n)return!1;var r=this.getAssociatedLegendOrLabel(n);return!!r&&(r.scrollIntoView(),n.focus({preventScroll:!0}),!0)}},{key:"getAssociatedLegendOrLabel",value:function(e){var t,n=e.closest("fieldset");if(n){var r=n.getElementsByTagName("legend");if(r.length){var o=r[0];if(e instanceof HTMLInputElement&&("checkbox"===e.type||"radio"===e.type))return o;var i=o.getBoundingClientRect().top,u=e.getBoundingClientRect();if(u.height&&window.innerHeight&&u.top+u.height-i<window.innerHeight/2)return o}}return null!==(t=document.querySelector("label[for='".concat(e.getAttribute("id"),"']")))&&void 0!==t?t:e.closest("label")}}],t&&r(e.prototype,t),Object.defineProperty(e,"prototype",{writable:!1}),e;var e,t}();return t})()));
|
2
2
|
//# sourceMappingURL=error-summary.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"components/error-summary/error-summary.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,IACQ,mBAAXG,QAAyBA,OAAOC,IAC9CD,OAAO,cAAe,GAAIH,GACA,iBAAZC,QACdA,QAAqB,YAAID,IAEzBD,EAAkB,YAAIC,GACvB,CATD,CASGK,MAAM,I,mBCRT,IAAIC,EAAsB,CCA1BA,EAAwB,CAACL,EAASM,KACjC,IAAI,IAAIC,KAAOD,EACXD,EAAoBG,EAAEF,EAAYC,KAASF,EAAoBG,EAAER,EAASO,IAC5EE,OAAOC,eAAeV,EAASO,EAAK,CAAEI,YAAY,EAAMC,IAAKN,EAAWC,IAE1E,ECNDF,EAAwB,CAACQ,EAAKC,IAAUL,OAAOM,UAAUC,eAAeC,KAAKJ,EAAKC,GCClFT,EAAyBL,IACH,oBAAXkB,QAA0BA,OAAOC,aAC1CV,OAAOC,eAAeV,EAASkB,OAAOC,YAAa,CAAEC,MAAO,WAE7DX,OAAOC,eAAeV,EAAS,aAAc,CAAEoB,OAAO,GAAO,G,0sBCLvD,IAAMC,EAAY,WAGtB,O,EAFD,SAAAA,EAAYC,I,4FAASC,CAAA,KAAAF,GACnBG,KAAKF,QAAUA,CACjB,E,EAAC,EAAAf,IAAA,OAAAa,MAED,
|
1
|
+
{"version":3,"file":"components/error-summary/error-summary.js","mappings":"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","sources":["webpack://TNAFrontend/webpack/universalModuleDefinition","webpack://TNAFrontend/webpack/bootstrap","webpack://TNAFrontend/webpack/runtime/define property getters","webpack://TNAFrontend/webpack/runtime/hasOwnProperty shorthand","webpack://TNAFrontend/webpack/runtime/make namespace object","webpack://TNAFrontend/./src/nationalarchives/components/error-summary/error-summary.mjs"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine(\"TNAFrontend\", [], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"TNAFrontend\"] = factory();\n\telse\n\t\troot[\"TNAFrontend\"] = factory();\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","export class ErrorSummary {\n constructor($module) {\n this.$module = $module;\n }\n\n init() {\n if (!this.$module) {\n return;\n }\n\n const disableAutoFocus =\n this.$module.dataset.disableAutofocus === \"true\" || false;\n\n if (!disableAutoFocus) {\n this.setFocus(this.$module);\n }\n\n this.$module.addEventListener(\"click\", (event) => this.handleClick(event));\n }\n\n 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 handleClick(event) {\n const $target = event.target;\n if ($target && this.focusTarget($target)) {\n event.preventDefault();\n }\n }\n\n getFragmentFromUrl(url) {\n if (!url.includes(\"#\")) {\n return undefined;\n }\n\n return url.split(\"#\").pop();\n }\n\n focusTarget($target) {\n // If the element that was clicked was not a link, return early\n if (!($target instanceof HTMLAnchorElement)) {\n return false;\n }\n\n const inputId = this.getFragmentFromUrl($target.href);\n if (!inputId) {\n return false;\n }\n\n const $input = document.getElementById(inputId);\n if (!$input) {\n return false;\n }\n\n const $legendOrLabel = this.getAssociatedLegendOrLabel($input);\n if (!$legendOrLabel) {\n return false;\n }\n\n // Scroll the legend or label into view *before* calling focus on the input\n // to avoid extra scrolling in browsers that don't support `preventScroll`\n // (which at time of writing is most of them...)\n $legendOrLabel.scrollIntoView();\n $input.focus({ preventScroll: true });\n\n return true;\n }\n\n /**\n * Get associated legend or label\n *\n * Returns the first element that exists from this list:\n *\n * - The `<legend>` associated with the closest `<fieldset>` ancestor, as long\n * as the top of it is no more than half a viewport height away from the\n * bottom of the input\n * - The first `<label>` that is associated with the input using for=\"inputId\"\n * - The closest parent `<label>`\n *\n * @private\n * @param {Element} $input - The input\n * @returns {Element | null} Associated legend or label, or null if no\n * associated legend or label can be found\n */\n getAssociatedLegendOrLabel($input) {\n const $fieldset = $input.closest(\"fieldset\");\n\n if ($fieldset) {\n const $legends = $fieldset.getElementsByTagName(\"legend\");\n\n if ($legends.length) {\n const $candidateLegend = $legends[0];\n\n // If the input type is radio or checkbox, always use the legend if\n // there is one.\n if (\n $input instanceof HTMLInputElement &&\n ($input.type === \"checkbox\" || $input.type === \"radio\")\n ) {\n return $candidateLegend;\n }\n\n // For other input types, only scroll to the fieldset’s legend (instead\n // of the label associated with the input) if the input would end up in\n // the top half of the screen.\n //\n // This should avoid situations where the input either ends up off the\n // screen, or obscured by a software keyboard.\n const legendTop = $candidateLegend.getBoundingClientRect().top;\n const inputRect = $input.getBoundingClientRect();\n\n // If the browser doesn't support Element.getBoundingClientRect().height\n // or window.innerHeight (like IE8), bail and just link to the label.\n if (inputRect.height && window.innerHeight) {\n const inputBottom = inputRect.top + inputRect.height;\n\n if (inputBottom - legendTop < window.innerHeight / 2) {\n return $candidateLegend;\n }\n }\n }\n }\n\n return (\n document.querySelector(`label[for='${$input.getAttribute(\"id\")}']`) ??\n $input.closest(\"label\")\n );\n }\n}\n"],"names":["root","factory","exports","module","define","amd","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","ErrorSummary","$module","_classCallCheck","this","_this","dataset","disableAutofocus","setFocus","addEventListener","event","handleClick","$element","_options$onBeforeFocu","options","arguments","length","undefined","isFocusable","getAttribute","onBlur","_options$onBlur","removeAttribute","setAttribute","once","onBeforeFocus","focus","$target","target","focusTarget","preventDefault","url","includes","split","pop","HTMLAnchorElement","inputId","getFragmentFromUrl","href","$input","document","getElementById","$legendOrLabel","getAssociatedLegendOrLabel","scrollIntoView","preventScroll","_document$querySelect","$fieldset","closest","$legends","getElementsByTagName","$candidateLegend","HTMLInputElement","type","legendTop","getBoundingClientRect","top","inputRect","height","window","innerHeight","querySelector","concat"],"sourceRoot":""}
|