@openeuropa/bcl-subscription 0.3791.202505281825 → 0.3821.202510100015

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.
@@ -1,11 +1,10 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
1
+ // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
2
2
 
3
3
  exports[`OE - Subscription renders correctly 1`] = `
4
4
  <jest>
5
5
  <header
6
6
  class="bcl-header bcl-header--eu"
7
7
  >
8
- <!-- navbar_settings -->
9
8
  <nav
10
9
  aria-label="Top Navigation"
11
10
  class="w-100 shadow-sm bcl-header__top-navbar navbar navbar-expand-lg navbar-light"
@@ -29,11 +28,11 @@ exports[`OE - Subscription renders correctly 1`] = `
29
28
  />
30
29
  </a>
31
30
  <button
32
- aria-controls="topNavbarDropdown"
31
+ aria-controls="header-navbar"
33
32
  aria-expanded="false"
34
33
  aria-label="Toggle navigation"
35
- class="navbar-toggler"
36
- data-bs-target="#topNavbarDropdown"
34
+ class="navbar-toggler bcl-navbar-toggler"
35
+ data-bs-target="#header-navbar"
37
36
  data-bs-toggle="collapse"
38
37
  type="button"
39
38
  >
@@ -41,202 +40,464 @@ exports[`OE - Subscription renders correctly 1`] = `
41
40
  class="navbar-toggler-icon"
42
41
  />
43
42
  </button>
44
- <div
45
- class="collapse navbar-collapse"
46
- id="topNavbarDropdown"
47
- >
48
- <ul
49
- class="nav"
50
- >
51
- <li
52
- class="nav-item"
53
- >
54
- <a
55
- class="nav-link"
56
- data-bs-target="#languageModal"
57
- data-bs-toggle="modal"
58
- href="/example.html"
59
- >
60
- <svg
61
- class="me-2-5 bi icon--xs"
62
- >
63
- <use
64
- xlink:href="/icons.svg#chat-left-dots-fill"
65
- />
66
- </svg>
67
- English
68
- </a>
69
- </li>
70
- <li
71
- class="nav-item"
72
- >
73
- <a
74
- class="nav-link"
75
- data-bs-target="#loginModal"
76
- data-bs-toggle="modal"
77
- href="/example.html"
78
- >
79
- <svg
80
- class="me-2-5 bi icon--xs"
81
- >
82
- <use
83
- xlink:href="/icons.svg#person-fill"
84
- />
85
- </svg>
86
- Log in
87
- </a>
88
- </li>
89
- </ul>
90
- </div>
91
43
  </div>
92
44
  </nav>
93
45
  <!-- project name -->
94
46
  <!-- navbar -->
95
47
  <nav
96
48
  aria-label="Main Navigation"
97
- class="bcl-header__navbar navbar navbar-expand-lg navbar-dark"
49
+ class="bcl-header__navbar collapse navbar-collapse navbar navbar-expand-lg navbar-dark"
50
+ id="header-navbar"
98
51
  >
99
52
  <div
100
53
  class="container"
101
54
  >
102
- <button
103
- aria-controls="navbarNavDropdown"
104
- aria-expanded="false"
105
- aria-label="Toggle navigation"
106
- class="navbar-toggler"
107
- data-bs-target="#navbarNavDropdown"
108
- data-bs-toggle="collapse"
109
- type="button"
55
+ <ul
56
+ class="me-auto navbar-nav"
110
57
  >
111
- <span
112
- class="navbar-toggler-icon"
113
- />
114
- </button>
115
- <div
116
- class="collapse navbar-collapse"
117
- id="navbarNavDropdown"
118
- >
119
- <ul
120
- class="me-auto navbar-nav"
58
+ <li
59
+ class="nav-item"
121
60
  >
122
- <li
123
- class="nav-item"
124
- >
125
- <a
126
- aria-current="page"
127
- class="nav-link active"
128
- href="/example.html"
129
- >
130
- Home
131
- </a>
132
- </li>
133
- <li
134
- class="nav-item"
135
- >
136
- <a
137
- class="nav-link"
138
- href="/example.html"
139
- >
140
- Item 01
141
- </a>
142
- </li>
143
- <li
144
- class="nav-item"
145
- >
146
- <a
147
- class="nav-link"
148
- href="/example.html"
149
- >
150
- Item 02
151
- </a>
152
- </li>
153
- <li
154
- class="nav-item dropdown"
61
+ <div
62
+ class="bcl-mega-menu"
155
63
  >
156
- <a
64
+ <button
65
+ aria-controls="mega-menu-dropdown-megamenu"
157
66
  aria-expanded="false"
158
- class="nav-link dropdown-toggle"
67
+ aria-haspopup="menu"
68
+ class="dropdown-toggle nav-link"
69
+ data-bs-auto-close="outside"
159
70
  data-bs-toggle="dropdown"
160
- href="#"
161
- id="navbarDropdownMenuLink"
162
- role="button"
71
+ id="dropdown-megamenu"
72
+ type="button"
163
73
  >
164
- Dropdown link
165
- </a>
166
- <ul
167
- aria-labelledby="navbarDropdownMenuLink"
168
- class="dropdown-menu"
74
+ A link with dropdown
75
+ </button>
76
+ <nav
77
+ aria-label="Main mega menu"
78
+ aria-labelledby="dropdown-megamenu"
79
+ class="bcl-mega-menu__container dropdown-menu"
80
+ id="mega-menu-dropdown-megamenu"
169
81
  >
170
- <li>
171
- <a
172
- class="dropdown-item"
173
- href="/example.html"
174
- >
175
- Action
176
- </a>
177
- </li>
178
- <li>
179
- <a
180
- class="dropdown-item"
181
- href="/example.html"
182
- >
183
- Another action
184
- </a>
185
- </li>
186
- <li>
187
- <a
188
- class="dropdown-item"
189
- href="/example.html"
82
+ <div
83
+ class="container"
84
+ >
85
+ <div
86
+ class="container d-lg-none bcl-mega-menu__back-button-block"
190
87
  >
191
- Something else here
192
- </a>
193
- </li>
194
- <li>
195
- <a
196
- class="dropdown-item"
197
- href="/example.html"
88
+ <button
89
+ aria-label="Back to main menu"
90
+ class="back-button btn btn-link btn-md"
91
+ type="button"
92
+ >
93
+ <svg
94
+ class="me-2-5 bi icon--fluid"
95
+ >
96
+ <use
97
+ xlink:href="/icons.svg#arrow-left"
98
+ />
99
+ </svg>
100
+ Back
101
+ </button>
102
+ </div>
103
+ <div
104
+ class="position-relative"
198
105
  >
199
- Very long label with custom text and custom link as an example
200
- </a>
201
- </li>
202
- </ul>
203
- </li>
204
- </ul>
205
- <form
206
- class="d-flex mt-3 mt-lg-0"
106
+ <div
107
+ class="row"
108
+ >
109
+ <div
110
+ class="col-md-12 col-xl-3 position-relative bcl-mega-menu__info"
111
+ >
112
+ <div
113
+ class="content-block"
114
+ >
115
+ <h4>
116
+ About the European Commission
117
+ </h4>
118
+ <p>
119
+ Description text, lorem ipsum dolor sit amet, consectetur adipiscing elit.
120
+ </p>
121
+ <p
122
+ class="m-0"
123
+ >
124
+ <a
125
+ class="content-link"
126
+ href="/example.html"
127
+ >
128
+ Discover more
129
+ <svg
130
+ class="ms-2-5 bi icon--s"
131
+ >
132
+ <use
133
+ xlink:href="/icons.svg#arrow-right"
134
+ />
135
+ </svg>
136
+ </a>
137
+ </p>
138
+ </div>
139
+ <div
140
+ class="shadow-container"
141
+ >
142
+ <span
143
+ class="shadow-bg"
144
+ />
145
+ </div>
146
+ </div>
147
+ <div
148
+ class="col-md-12 col-lg-4 col-xl-3 bcl-mega-menu__menu"
149
+ >
150
+ <ul
151
+ class="bcl-mega-menu__items __level-1"
152
+ >
153
+ <li
154
+ class="__parent"
155
+ >
156
+ <button
157
+ aria-controls="mm-panel-custom-trigger-mm-1"
158
+ aria-expanded="false"
159
+ aria-haspopup="menu"
160
+ class="active"
161
+ id="custom-trigger-mm-1"
162
+ type="button"
163
+ >
164
+ Base Category Item
165
+ </button>
166
+ <div
167
+ aria-labelledby="custom-trigger-mm-1"
168
+ class="bcl-mega-menu__submenu __level-2"
169
+ id="mm-panel-custom-trigger-mm-1"
170
+ role="group"
171
+ >
172
+ <div
173
+ class="__header"
174
+ >
175
+ <p
176
+ class="__label"
177
+ >
178
+ Base Category Item
179
+ </p>
180
+ </div>
181
+ <ul
182
+ class="bcl-mega-menu__items __level-2"
183
+ >
184
+ <li
185
+ class="__leaf"
186
+ >
187
+ <a
188
+ class="active"
189
+ href="/example.html"
190
+ >
191
+ Base Sub Category Item
192
+ </a>
193
+ </li>
194
+ <li
195
+ class="__leaf"
196
+ >
197
+ <a
198
+ href="/example.html"
199
+ >
200
+ Base Sub Category Item
201
+ </a>
202
+ </li>
203
+ <li
204
+ class="__leaf"
205
+ >
206
+ <a
207
+ href="/example.html"
208
+ >
209
+ Base Sub Category Item
210
+ </a>
211
+ </li>
212
+ <li
213
+ class="__leaf"
214
+ >
215
+ <a
216
+ href="/example.html"
217
+ >
218
+ Base Sub Category Item
219
+ </a>
220
+ </li>
221
+ <li
222
+ class="__see_all __leaf"
223
+ >
224
+ <a
225
+ aria-label="See all items in ‘Base Category Item’"
226
+ class="see-all-button"
227
+ href="/example.html"
228
+ >
229
+ <span>
230
+ See all
231
+ </span>
232
+ <svg
233
+ class="ms-2-5 bi icon--s"
234
+ >
235
+ <use
236
+ xlink:href="/icons.svg#arrow-right"
237
+ />
238
+ </svg>
239
+ </a>
240
+ </li>
241
+ </ul>
242
+ </div>
243
+ </li>
244
+ <li
245
+ class="__leaf"
246
+ >
247
+ <span>
248
+ Base Category Item
249
+ </span>
250
+ </li>
251
+ <li
252
+ class="__parent"
253
+ >
254
+ <button
255
+ aria-controls="mm-panel-custom-trigger-mm-2"
256
+ aria-expanded="false"
257
+ aria-haspopup="menu"
258
+ id="custom-trigger-mm-2"
259
+ type="button"
260
+ >
261
+ Base Category Item
262
+ </button>
263
+ <div
264
+ aria-labelledby="custom-trigger-mm-2"
265
+ class="bcl-mega-menu__submenu __level-2"
266
+ id="mm-panel-custom-trigger-mm-2"
267
+ role="group"
268
+ >
269
+ <div
270
+ class="__header"
271
+ >
272
+ <p
273
+ class="__label"
274
+ >
275
+ Base Category Item
276
+ </p>
277
+ </div>
278
+ <ul
279
+ class="bcl-mega-menu__items __level-2"
280
+ >
281
+ <li
282
+ class="__leaf"
283
+ >
284
+ <a
285
+ href="/example.html"
286
+ >
287
+ Base Sub Category Item
288
+ </a>
289
+ </li>
290
+ <li
291
+ class="__leaf"
292
+ >
293
+ <a
294
+ href="/example.html"
295
+ >
296
+ Base Sub Category Item
297
+ </a>
298
+ </li>
299
+ <li
300
+ class="__leaf"
301
+ >
302
+ <a
303
+ href="/example.html"
304
+ >
305
+ Base Sub Category Item
306
+ </a>
307
+ </li>
308
+ <li
309
+ class="__leaf"
310
+ >
311
+ <a
312
+ href="/example.html"
313
+ >
314
+ Base Sub Category Item
315
+ </a>
316
+ </li>
317
+ <li
318
+ class="__leaf"
319
+ >
320
+ <a
321
+ href="/example.html"
322
+ >
323
+ Base Sub Category Item
324
+ </a>
325
+ </li>
326
+ <li
327
+ class="__leaf"
328
+ >
329
+ <a
330
+ href="/example.html"
331
+ >
332
+ Base Sub Category Item
333
+ </a>
334
+ </li>
335
+ <li
336
+ class="__leaf"
337
+ >
338
+ <a
339
+ href="/example.html"
340
+ >
341
+ Base Sub Category Item
342
+ </a>
343
+ </li>
344
+ <li
345
+ class="__leaf"
346
+ >
347
+ <a
348
+ href="/example.html"
349
+ >
350
+ Base Sub Category Item
351
+ </a>
352
+ </li>
353
+ </ul>
354
+ </div>
355
+ </li>
356
+ <li
357
+ class="__leaf"
358
+ >
359
+ <a
360
+ href="/example.html"
361
+ >
362
+ Base Category Item
363
+ </a>
364
+ </li>
365
+ <li
366
+ class="__leaf"
367
+ >
368
+ <a
369
+ href="/example.html"
370
+ >
371
+ Base Category Item
372
+ </a>
373
+ </li>
374
+ <li
375
+ class="__leaf"
376
+ >
377
+ <a
378
+ href="/example.html"
379
+ >
380
+ Base Category Item
381
+ </a>
382
+ </li>
383
+ <li
384
+ class="__leaf"
385
+ >
386
+ <a
387
+ href="/example.html"
388
+ >
389
+ Base Category Item
390
+ </a>
391
+ </li>
392
+ <li
393
+ class="__leaf"
394
+ >
395
+ <a
396
+ href="/example.html"
397
+ >
398
+ Base Category Item
399
+ </a>
400
+ </li>
401
+ <li
402
+ class="__leaf"
403
+ >
404
+ <a
405
+ href="/example.html"
406
+ >
407
+ Base Category Item
408
+ </a>
409
+ </li>
410
+ </ul>
411
+ </div>
412
+ </div>
413
+ </div>
414
+ </div>
415
+ </nav>
416
+ </div>
417
+ </li>
418
+ <li
419
+ class="nav-item"
420
+ >
421
+ <a
422
+ aria-current="page"
423
+ class="nav-link active"
424
+ href="/example.html"
425
+ >
426
+ Home
427
+ </a>
428
+ </li>
429
+ <li
430
+ class="nav-item"
431
+ >
432
+ <a
433
+ class="nav-link"
434
+ href="/example.html"
435
+ >
436
+ Item 01
437
+ </a>
438
+ </li>
439
+ <li
440
+ class="nav-item"
207
441
  >
208
- <label
209
- class="form-label visually-hidden"
210
- for="inlineFormInputGroupSearch"
442
+ <a
443
+ class="nav-link"
444
+ href="/example.html"
211
445
  >
212
- Search
213
- </label>
214
- <input
215
- class="border-start-0 rounded-0 rounded-start form-control"
216
- id="inlineFormInputGroupSearch"
217
- placeholder="Search"
218
- required="true"
219
- type="text"
220
- />
446
+ Item 02
447
+ </a>
448
+ </li>
449
+ <li
450
+ class="nav-item dropdown"
451
+ >
221
452
  <button
222
- class="border-start-0 rounded-0 rounded-end btn btn-light btn-md"
453
+ aria-expanded="false"
454
+ autocomplete="off"
455
+ class="dropdown-toggle btn btn-primary btn-md"
456
+ data-bs-toggle="dropdown"
457
+ id="navbarDropdownMenuLink"
223
458
  type="button"
224
459
  >
225
- <span
226
- class="visually-hidden"
227
- >
228
- search
229
- </span>
230
- <svg
231
- class="bi icon--fluid"
232
- >
233
- <use
234
- xlink:href="/icons.svg#search"
235
- />
236
- </svg>
460
+ Dropdown link
237
461
  </button>
238
- </form>
239
- </div>
462
+ <ul
463
+ aria-labelledby="navbarDropdownMenuLink"
464
+ class="dropdown-menu"
465
+ >
466
+ <li>
467
+ <a
468
+ class="dropdown-item"
469
+ href="/example.html"
470
+ >
471
+ Action
472
+ </a>
473
+ </li>
474
+ <li>
475
+ <a
476
+ class="dropdown-item"
477
+ href="/example.html"
478
+ >
479
+ Another action
480
+ </a>
481
+ </li>
482
+ <li>
483
+ <a
484
+ class="dropdown-item"
485
+ href="/example.html"
486
+ >
487
+ Something else here
488
+ </a>
489
+ </li>
490
+ <li>
491
+ <a
492
+ class="dropdown-item"
493
+ href="/example.html"
494
+ >
495
+ Very long label with custom text and custom link as an example
496
+ </a>
497
+ </li>
498
+ </ul>
499
+ </li>
500
+ </ul>
240
501
  </div>
241
502
  </nav>
242
503
  <!-- breadcrumbs -->
@@ -834,6 +1095,7 @@ exports[`OE - Subscription renders correctly 1`] = `
834
1095
  class="col-12 bcl-sidebar col-lg-3"
835
1096
  >
836
1097
  <nav
1098
+ aria-labelledby="bcl-inpage-navigation-dropdown"
837
1099
  class="bcl-inpage-navigation position-sticky"
838
1100
  id="bcl-inpage-navigation"
839
1101
  >
@@ -859,7 +1121,6 @@ exports[`OE - Subscription renders correctly 1`] = `
859
1121
  Page content
860
1122
  </h2>
861
1123
  <div
862
- aria-labelledby="bcl-inpage-navigation-dropdown"
863
1124
  class="dropdown-menu"
864
1125
  >
865
1126
  <ul
@@ -1053,7 +1314,7 @@ exports[`OE - Subscription renders correctly 1`] = `
1053
1314
  >
1054
1315
  <form
1055
1316
  class="needs-validation"
1056
- novalidate="true"
1317
+ novalidate="novalidate"
1057
1318
  onsubmit="return false;"
1058
1319
  >
1059
1320
  <fieldset>
@@ -1076,7 +1337,7 @@ exports[`OE - Subscription renders correctly 1`] = `
1076
1337
  <input
1077
1338
  class="form-control"
1078
1339
  placeholder="Type in your e-mail address"
1079
- required="true"
1340
+ required="required"
1080
1341
  type="email"
1081
1342
  />
1082
1343
  <div
@@ -1097,7 +1358,7 @@ exports[`OE - Subscription renders correctly 1`] = `
1097
1358
  <select
1098
1359
  class="form-select"
1099
1360
  id="language-select"
1100
- required="true"
1361
+ required="required"
1101
1362
  >
1102
1363
  <option
1103
1364
  disabled=""
@@ -1143,7 +1404,7 @@ exports[`OE - Subscription renders correctly 1`] = `
1143
1404
  <input
1144
1405
  class="form-check-input"
1145
1406
  id="exampleInputCheck1"
1146
- required="true"
1407
+ required="required"
1147
1408
  type="checkbox"
1148
1409
  />
1149
1410
  <label
@@ -1,4 +1,4 @@
1
- const drupalAttribute = require("drupal-attribute");
1
+ const { DrupalAttribute } = require("drupal-attribute");
2
2
 
3
3
  module.exports = {
4
4
  id: "subscribeModal",
@@ -10,7 +10,7 @@ module.exports = {
10
10
  '<button class="btn btn-primary form-submit ms-4">Subscribe now</button>' +
11
11
  "</div>",
12
12
  form: {
13
- attributes: new drupalAttribute()
13
+ attributes: new DrupalAttribute()
14
14
  .addClass("needs-validation")
15
15
  .setAttribute("novalidate", true)
16
16
  .setAttribute("onsubmit", "return false;"),
@@ -75,7 +75,7 @@ module.exports = {
75
75
  heading: "Thank you!",
76
76
  icon_path: "/icons.svg",
77
77
  variant: "success",
78
- attributes: new drupalAttribute().addClass([
78
+ attributes: new DrupalAttribute().addClass([
79
79
  "success-alert",
80
80
  "d-none",
81
81
  "mb-0",
@@ -89,7 +89,7 @@ module.exports = {
89
89
  icon_path: "/icons.svg",
90
90
  variant: "danger",
91
91
  dismissible: false,
92
- attributes: new drupalAttribute().addClass([
92
+ attributes: new DrupalAttribute().addClass([
93
93
  "error-alert",
94
94
  "d-none",
95
95
  "mb-0",
package/package.json CHANGED
@@ -2,13 +2,13 @@
2
2
  "name": "@openeuropa/bcl-subscription",
3
3
  "author": "European Commission",
4
4
  "license": "EUPL-1.2",
5
- "version": "0.3791.202505281825",
5
+ "version": "0.3821.202510100015",
6
6
  "publishConfig": {
7
7
  "access": "public"
8
8
  },
9
9
  "description": "OE - BCL subscription",
10
10
  "dependencies": {
11
- "@openeuropa/bcl-subscription-block": "^0.3791.202505281825"
11
+ "@openeuropa/bcl-subscription-block": "^0.3821.202510100015"
12
12
  },
13
13
  "repository": {
14
14
  "type": "git",
@@ -24,5 +24,5 @@
24
24
  "design-system",
25
25
  "twig"
26
26
  ],
27
- "gitHead": "8c5a67ad5d9387e87ba0f5ca576e8dee9b07a90d"
27
+ "gitHead": "6a890344c1b3fed3b4f049080c3e30cc55b42b9d"
28
28
  }
@@ -1,10 +1,10 @@
1
- {% extends '@oe-bcl/bcl-base-templates/content-type.html.twig' %}
1
+ {% extends '@oe-bcl/bcl-base-templates/content-type.html.twig' -%}
2
2
 
3
- {% block sidebar %}
3
+ {%- block sidebar %}
4
4
  {% include '@oe-bcl/bcl-inpage-navigation/inpage-navigation.html.twig' with sidebar only %}
5
- {% endblock %}
5
+ {%- endblock -%}
6
6
 
7
- {% block content_bottom %}
7
+ {%- block content_bottom %}
8
8
  {% include '@oe-bcl/bcl-subscription-block/subscription-block.html.twig' with subscription only %}
9
9
  {% include '@oe-bcl/bcl-subscription/subscription-modal.html.twig' with modal only %}
10
- {% endblock %}
10
+ {%- endblock -%}
@@ -21,7 +21,7 @@ describe("OE - Subscription", () => {
21
21
 
22
22
  test(`passes the accessibility tests`, async () => {
23
23
  expect(
24
- await axe(renderTwigFileAsHtml(template, demoData)),
24
+ await axe(await renderTwigFileAsHtml(template, demoData)),
25
25
  ).toHaveNoViolations();
26
26
  });
27
27
  });