@ons/design-system 55.1.0 → 56.0.0

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.
Files changed (81) hide show
  1. package/components/access-code/_macro.njk +3 -3
  2. package/components/accordion/_macro.njk +1 -1
  3. package/components/address-input/_macro.njk +7 -7
  4. package/components/address-output/_macro.njk +7 -7
  5. package/components/autosuggest/_macro.njk +19 -19
  6. package/components/breadcrumbs/_macro.njk +3 -3
  7. package/components/button/_button.scss +49 -51
  8. package/components/button/_macro.njk +61 -35
  9. package/components/button/_macro.spec.js +24 -24
  10. package/components/button/button.spec.js +11 -11
  11. package/components/call-to-action/_macro.njk +1 -1
  12. package/components/card/_macro.njk +10 -10
  13. package/components/checkboxes/_checkbox-macro.njk +9 -9
  14. package/components/checkboxes/_macro.njk +10 -10
  15. package/components/checkboxes/checkbox-with-fieldset.js +6 -5
  16. package/components/checkboxes/checkboxes.dom.js +6 -9
  17. package/components/code-highlight/_macro.njk +1 -1
  18. package/components/collapsible/_macro.njk +7 -7
  19. package/components/date-input/_macro.njk +5 -5
  20. package/components/document-list/_macro.njk +29 -29
  21. package/components/duration/_macro.njk +9 -9
  22. package/components/duration/_macro.spec.js +0 -3
  23. package/components/error/_macro.njk +1 -1
  24. package/components/external-link/_macro.njk +1 -1
  25. package/components/feedback/_macro.njk +2 -2
  26. package/components/field/_macro.njk +5 -5
  27. package/components/fieldset/_fieldset.scss +5 -0
  28. package/components/fieldset/_macro.njk +8 -8
  29. package/components/footer/_macro.njk +19 -23
  30. package/components/footer/_macro.spec.js +0 -6
  31. package/components/header/_macro.njk +39 -41
  32. package/components/header/_macro.spec.js +4 -8
  33. package/components/hero/_macro.njk +15 -15
  34. package/components/icons/_macro.njk +2 -2
  35. package/components/images/_macro.njk +3 -3
  36. package/components/input/_input-type.scss +4 -0
  37. package/components/input/_macro.njk +41 -34
  38. package/components/input/_macro.spec.js +66 -59
  39. package/components/label/_macro.njk +1 -1
  40. package/components/language-selector/_macro.njk +1 -1
  41. package/components/lists/_macro.njk +22 -22
  42. package/components/message/_macro.njk +6 -6
  43. package/components/message-list/_macro.njk +1 -1
  44. package/components/metadata/_macro.njk +2 -2
  45. package/components/modal/_macro.njk +4 -4
  46. package/components/mutually-exclusive/_macro.njk +1 -1
  47. package/components/mutually-exclusive/mutually-exclusive.js +3 -1
  48. package/components/navigation/_macro.njk +11 -10
  49. package/components/navigation/_macro.spec.js +3 -2
  50. package/components/pagination/_macro.njk +3 -3
  51. package/components/panel/_macro.njk +37 -39
  52. package/components/panel/_macro.spec.js +1 -13
  53. package/components/promotional-banner/_macro.njk +2 -2
  54. package/components/question/_macro.njk +20 -20
  55. package/components/question/_macro.spec.js +2 -2
  56. package/components/question/_question.scss +1 -1
  57. package/components/quote/_macro.njk +2 -2
  58. package/components/radios/_macro.njk +8 -8
  59. package/components/radios/check-radios.js +5 -1
  60. package/components/related-content/_macro.njk +2 -2
  61. package/components/relationships/_macro.njk +4 -3
  62. package/components/search/_macro.njk +12 -2
  63. package/components/search/_macro.spec.js +27 -2
  64. package/components/section-navigation/_macro.njk +2 -2
  65. package/components/select/_macro.njk +8 -8
  66. package/components/share-page/_macro.njk +2 -2
  67. package/components/status/_macro.njk +2 -2
  68. package/components/summary/_macro.njk +25 -25
  69. package/components/table/_macro.njk +10 -10
  70. package/components/table-of-contents/_macro.njk +4 -4
  71. package/components/textarea/_macro.njk +8 -8
  72. package/components/timeline/_macro.njk +1 -1
  73. package/components/video/_macro.njk +1 -1
  74. package/css/census.css +1 -1
  75. package/css/ids.css +1 -1
  76. package/css/main.css +1 -1
  77. package/layout/_template.njk +35 -35
  78. package/package.json +1 -1
  79. package/scripts/main.es5.js +1 -1
  80. package/scripts/main.js +1 -1
  81. package/scss/patternlib.scss +2 -2
@@ -4,7 +4,7 @@
4
4
 
5
5
  {% set currentLanguageISOCode = "en" %}
6
6
 
7
- {% if pageConfig is defined and pageConfig and pageConfig.language is defined and pageConfig.language and pageConfig.language.languages is defined and pageConfig.language.languages %}
7
+ {% if pageConfig and pageConfig.language and pageConfig.language.languages %}
8
8
  {% set currentLanguage = pageConfig.language.languages | selectattr("current") | first %}
9
9
  {% set currentLanguageISOCode = currentLanguage.ISOCode %}
10
10
  {% set otherLanguage = pageConfig.language.languages | rejectattr("current") | first %}
@@ -12,21 +12,21 @@
12
12
  {% endif %}
13
13
 
14
14
  {# Meta icons #}
15
- {% if pageConfig is defined and pageConfig and pageConfig.theme is defined and pageConfig.theme %}
15
+ {% if pageConfig and pageConfig.theme %}
16
16
  {% set metaicons = pageConfig.theme + "/" + currentLanguageISOCode + "/" %}
17
17
  {% else %}
18
18
  {% set metaicons = "" %}
19
19
  {% endif %}
20
20
 
21
- {% if pageConfig.cdn is defined and pageConfig.cdn or release_version is defined and release_version %}
21
+ {% if pageConfig.cdn or release_version %}
22
22
  {# Production #}
23
- {% set cdn_url = (pageConfig.cdn.url if pageConfig.cdn is defined and pageConfig.cdn and pageConfig.cdn.url is defined and pageConfig.cdn.url) or "https://cdn.ons.gov.uk/sdc/design-system" %}
23
+ {% set cdn_url = (pageConfig.cdn.url if pageConfig.cdn and pageConfig.cdn.url) or "https://cdn.ons.gov.uk/sdc/design-system" %}
24
24
  {% set slash = "" if cdn_url | last == "/" else "/" %}
25
- {% set assetsURL = cdn_url + slash + ((pageConfig.cdn.version if pageConfig.cdn is defined and pageConfig.cdn and pageConfig.cdn.version is defined and pageConfig.cdn.version) or release_version) %}
26
- {% elif pageInfo is defined and pageInfo and pageInfo.version is defined and pageInfo.version %}
25
+ {% set assetsURL = cdn_url + slash + ((pageConfig.cdn.version if pageConfig.cdn and pageConfig.cdn.version) or release_version) %}
26
+ {% elif pageInfo and pageInfo.version %}
27
27
  {# Prototype kits #}
28
28
  {% set assetsURL = "/" + pageInfo.version %}
29
- {% elif pageConfig.assetsURL is defined and pageConfig.assetsURL %}
29
+ {% elif pageConfig.assetsURL %}
30
30
  {# Runner Dev #}
31
31
  {% set assetsURL = pageConfig.assetsURL %}
32
32
  {% else %}
@@ -34,9 +34,9 @@
34
34
  {% set assetsURL = "" %}
35
35
  {% endif %}
36
36
 
37
- {% if pageConfig is defined and pageConfig and pageConfig.title is defined and pageConfig.title %}
37
+ {% if pageConfig and pageConfig.title %}
38
38
  {% set page_title = pageConfig.title %}
39
- {% elif pageInfo is defined and pageInfo and pageInfo.title is defined and pageInfo.title %}
39
+ {% elif pageInfo and pageInfo.title %}
40
40
  {% set page_title = pageInfo.title %}
41
41
  {% else %}
42
42
  {% set page_title = "ONS Design System" %}
@@ -54,16 +54,16 @@
54
54
  {# Page columns #}
55
55
  {% set mainColNumber = "8" %}
56
56
 
57
- {% if pageConfig.mainCol is defined and pageConfig.mainCol %}
58
- {% set mainColNumber = pageConfig.mainCol.columns if pageConfig.mainCol.columns is defined and pageConfig.mainCol.columns %}
59
- {% set mainColClasses = (' ' + pageConfig.mainCol.colClasses) if pageConfig.mainCol.colClasses is defined and pageConfig.mainCol.colClasses %}
60
- {% set mainClasses = (' ' + pageConfig.mainCol.classes) if pageConfig.mainCol.classes is defined and pageConfig.mainCol.classes %}
57
+ {% if pageConfig.mainCol %}
58
+ {% set mainColNumber = pageConfig.mainCol.columns if pageConfig.mainCol.columns %}
59
+ {% set mainColClasses = (' ' + pageConfig.mainCol.colClasses) if pageConfig.mainCol.colClasses %}
60
+ {% set mainClasses = (' ' + pageConfig.mainCol.classes) if pageConfig.mainCol.classes %}
61
61
  {% endif %}
62
62
 
63
- {% if pageConfig.asideCol is defined and pageConfig.asideCol %}
64
- {% set asideColNumber = 12 - mainColNumber if pageConfig.asideCol.position is defined and pageConfig.asideCol.position %}
65
- {% set asideColClasses = (' ' + pageConfig.asideCol.colClasses) if pageConfig.asideCol.colClasses is defined and pageConfig.asideCol.colClasses %}
66
- {% set asideClasses = (' ' + pageConfig.asideCol.classes) if pageConfig.asideCol.classes is defined and pageConfig.asideCol.classes %}
63
+ {% if pageConfig.asideCol %}
64
+ {% set asideColNumber = 12 - mainColNumber if pageConfig.asideCol.position %}
65
+ {% set asideColClasses = (' ' + pageConfig.asideCol.colClasses) if pageConfig.asideCol.colClasses %}
66
+ {% set asideClasses = (' ' + pageConfig.asideCol.classes) if pageConfig.asideCol.classes %}
67
67
  {% endif %}
68
68
 
69
69
  <!doctype html>
@@ -77,9 +77,9 @@
77
77
  <link rel="stylesheet" media="print" href="{{ assetsURL }}/css/print.css">
78
78
  <meta name="theme-color" content="{% if pageConfig.theme == 'census' %}#902082{% else %}#206095{% endif %}"/>
79
79
 
80
- {% if pageConfig.headMeta is defined and pageConfig.headMeta %}
80
+ {% if pageConfig.headMeta %}
81
81
 
82
- {% if pageConfig.headMeta.description is defined and pageConfig.headMeta.description or pageConfig.description is defined and pageConfig.description %}
82
+ {% if pageConfig.headMeta.description or pageConfig.description %}
83
83
  <meta name="description" content="{{ pageConfig.headMeta.description | default(pageConfig.description) }}">
84
84
  {% endif %}
85
85
 
@@ -94,7 +94,7 @@
94
94
  <meta property="og:description" content="{{ pageConfig.headMeta.description | default(pageConfig.description) }}">
95
95
  <meta property="og:site_name" content="{{ pageConfig.header.title | default(pageConfig.title) }}">
96
96
  <meta property="og:locale" content="{{ currentLanguageISOCode }}">
97
- {% if otherLanguageISOCode is defined and otherLanguageISOCode %}
97
+ {% if otherLanguageISOCode %}
98
98
  <meta property="og:locale:alternate" content="{{ otherLanguageISOCode }}">
99
99
  {% endif %}
100
100
 
@@ -109,7 +109,7 @@
109
109
  <!-- Canonical -->
110
110
  <link rel="canonical" href="{{ pageConfig.headMeta.canonicalUrl | default(pageConfig.absoluteUrl) }}">
111
111
 
112
- {% if pageConfig.headMeta.hrefLangs is defined and pageConfig.headMeta.hrefLangs %}
112
+ {% if pageConfig.headMeta.hrefLangs %}
113
113
  {% for item in pageConfig.headMeta.hrefLangs %}
114
114
  <link rel="alternate" href="{{ item.url }}" hreflang="{{ item.lang }}">
115
115
  {% endfor %}
@@ -131,17 +131,17 @@
131
131
  {% block head %}{% endblock %}
132
132
 
133
133
  </head>
134
- <body{% if pageConfig.bodyClasses is defined and pageConfig.bodyClasses %} class="{{ pageConfig.bodyClasses }}"{% endif %}>
135
- <script{% if pageConfig.cspNonce is defined and pageConfig.cspNonce %} nonce="{{ pageConfig.cspNonce }}"{% elif pageConfig.cspNonce is not defined and csp_nonce is defined and csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>document.body.className = ((document.body.className) ? document.body.className + ' ons-js-enabled' : 'ons-js-enabled');</script>
134
+ <body{% if pageConfig.bodyClasses %} class="{{ pageConfig.bodyClasses }}"{% endif %}>
135
+ <script{% if pageConfig.cspNonce %} nonce="{{ pageConfig.cspNonce }}"{% elif pageConfig.cspNonce is not defined and csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>document.body.className = ((document.body.className) ? document.body.className + ' ons-js-enabled' : 'ons-js-enabled');</script>
136
136
  {% block bodyStart %}{% endblock %}
137
137
  {% block body %}
138
138
  <div class="ons-page">
139
139
  <div class="ons-page__content">
140
- {% if form is defined and form and form.attributes is defined and form.attributes %}
140
+ {% if form and form.attributes %}
141
141
  <form
142
- {% if form.classes is defined and form.classes %}class="{{ form.classes }}"{% endif %}
142
+ {% if form.classes %}class="{{ form.classes }}"{% endif %}
143
143
  method="{{ form.method | default('POST') }}"
144
- {% if form.attributes is defined and form.attributes %}{% for attribute, value in (form.attributes.items() if form.attributes is mapping and form.attributes.items else form.attributes) %}{{ attribute }}{% if value is defined and value %}="{{value}}" {% endif %}{% endfor %}{% endif %}
144
+ {% if form.attributes %}{% for attribute, value in (form.attributes.items() if form.attributes is mapping and form.attributes.items else form.attributes) %}{{ attribute }}{% if value %}="{{value}}" {% endif %}{% endfor %}{% endif %}
145
145
  >
146
146
  {% endif %}
147
147
  {% block preHeader %}{% endblock %}
@@ -188,7 +188,7 @@
188
188
  {% endblock %}
189
189
  {% block pageContent %}
190
190
  <div class="ons-page__container ons-container{{ containerClasses }}">
191
- {% if pageConfig.breadcrumbs is defined and pageConfig.breadcrumbs %}
191
+ {% if pageConfig.breadcrumbs %}
192
192
  {% from "components/breadcrumbs/_macro.njk" import onsBreadcrumbs %}
193
193
  {{
194
194
  onsBreadcrumbs({
@@ -200,16 +200,16 @@
200
200
  {% endif %}
201
201
  {% block preMain %}{% endblock %}
202
202
  <div class="ons-grid">
203
- {% if pageConfig.asideCol is defined and pageConfig.asideCol %}
203
+ {% if pageConfig.asideCol %}
204
204
  {% set aside %}
205
205
  <div class="ons-grid__col ons-col-{{ asideColNumber }}@m{{ asideColClasses }}">
206
- <aside {% if pageConfig.asideCol.id is defined and pageConfig.asideCol.id %}id="{{ asideId }}" {% endif %}class="ons-page__aside{{ asideClasses }}">
206
+ <aside {% if pageConfig.asideCol.id %}id="{{ asideId }}" {% endif %}class="ons-page__aside{{ asideClasses }}">
207
207
  {% block aside %}{% endblock %}
208
208
  </aside>
209
209
  </div>
210
210
  {% endset %}
211
211
  {% endif %}
212
- {% if pageConfig.asideCol is defined and pageConfig.asideCol and pageConfig.asideCol.position is defined and pageConfig.asideCol.position == "before" %}
212
+ {% if pageConfig.asideCol and pageConfig.asideCol.position == "before" %}
213
213
  {{ aside | safe }}
214
214
  {% endif %}
215
215
  <div class="ons-grid__col ons-col-{{ mainColNumber }}@m{{ mainColClasses }}">
@@ -217,20 +217,20 @@
217
217
  {% block main %}{% endblock %}
218
218
  </main>
219
219
  </div>
220
- {% if pageConfig.asideCol is defined and pageConfig.asideCol and pageConfig.asideCol.position is defined and pageConfig.asideCol.position == "after" %}
220
+ {% if pageConfig.asideCol and pageConfig.asideCol.position == "after" %}
221
221
  {{ aside | safe }}
222
222
  {% endif %}
223
223
  </div>
224
224
  </div>
225
225
  {% endblock %}
226
226
 
227
- {% if form is defined and form and form.attributes is defined and form.attributes %}
227
+ {% if form and form.attributes %}
228
228
  </form>
229
229
  {% endif %}
230
230
  </div>
231
231
  {% block preFooter %}{% endblock %}
232
232
  {% block footer %}
233
- {% if pageConfig.footer is defined and pageConfig.footer %}
233
+ {% if pageConfig.footer %}
234
234
  {{
235
235
  onsFooter({
236
236
  "assetsURL": assetsURL,
@@ -257,13 +257,13 @@
257
257
  {% block bodyEnd %}{% endblock %}
258
258
  {% endblock %}
259
259
 
260
- {% if isPatternLib is defined and isPatternLib %}
260
+ {% if isPatternLib %}
261
261
  {% set scripts = assetsURL + "/scripts/main.js," + assetsURL + "/scripts/patternlib.js" %}
262
262
  {% else %}
263
263
  {% set scripts = assetsURL + "/scripts/main.js" %}
264
264
  {% endif %}
265
265
 
266
- <script{% if pageConfig.cspNonce is defined and pageConfig.cspNonce %} nonce="{{ pageConfig.cspNonce }}"{% elif pageConfig.cspNonce is not defined and csp_nonce is defined and csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>
266
+ <script{% if pageConfig.cspNonce %} nonce="{{ pageConfig.cspNonce }}"{% elif pageConfig.cspNonce is not defined and csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>
267
267
  (function() {
268
268
  var s = '{{ scripts | safe }}'.split(','),
269
269
  c = document.createElement('script');
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ons/design-system",
3
3
  "description": "ONS Design System built CSS, JS, and Nunjucks templates",
4
- "version": "55.1.0",
4
+ "version": "56.0.0",
5
5
  "main": "index.js",
6
6
  "license": "MIT",
7
7
  "author": {