@openeuropa/bcl-theme-joinup 1.3.0 → 1.5.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@openeuropa/bcl-theme-joinup",
   "author": "European Commission",
   "license": "EUPL-1.2",
-  "version": "1.3.0",
+  "version": "1.5.0",
   "description": "OE - BCL theme joinup",
   "scripts": {
     "align-templates": "lerna --scope \"@openeuropa/bcl-twig-templates\" run prepublish",
@@ -28,10 +28,10 @@
     "@ecl/resources-eu-logo": "3.7.1",
     "@ecl/resources-flag-icons": "3.7.1",
     "@fontsource/roboto": "4.5.8",
-    "@openeuropa/bcl-bootstrap": "^1.3.0",
-    "@openeuropa/bcl-builder": "^1.3.0",
-    "@openeuropa/bcl-theme-default": "^1.3.0",
-    "@openeuropa/bcl-twig-templates": "^1.3.0",
+    "@openeuropa/bcl-bootstrap": "^1.5.0",
+    "@openeuropa/bcl-builder": "^1.5.0",
+    "@openeuropa/bcl-theme-default": "^1.5.0",
+    "@openeuropa/bcl-twig-templates": "^1.5.0",
     "copyfiles": "2.4.1",
     "cross-env": "7.0.3",
     "flag-icons": "6.9.2",
@@ -56,5 +56,5 @@
     "design-system",
     "twig"
   ],
-  "gitHead": "965b58bc48d2c2ee183db317ff2dd43d2f3bec9e"
+  "gitHead": "7707e40523c6a3d4c719c80388f2df50fa6b7896"
 }

package/templates/bcl-fact-figures/fact-figures.html.twig

@@ -93,7 +93,7 @@
           icon: _item.icon|merge({
             path: _icon_path,
             size: 'l',
-            attributes: _icon_attributes.addClass('mb-2'),
+            attributes: _icon_attributes.addClass(['mb-2', 'icon--primary']),
           })
         }) %}
         {% include '@oe-bcl/bcl-icon/icon.html.twig' with _item.icon only %}

package/templates/bcl-file/file-translations.html.twig

@@ -69,18 +69,21 @@
             {% endif %}
           </div>
           <div class="col-12 col-md-3 align-self-end text-md-end">
-          {% include '@oe-bcl/bcl-link/link.html.twig' with _item.download|merge({
+          {% set download_attributes = create_attribute()
+                                      .setAttribute('download', true)
+                                      .setAttribute('target', '_blank')
+                                      .addClass(['d-block', 'standalone', 'mt-1'])
+          %}
+          {% set _download_item = _item.download|merge({
             icon_position: "after",
             icon: {
               name: "download",
               size: "fluid",
               path: _icon_path,
-            },
-            attributes: create_attribute()
-                        .setAttribute('download', true)
-                        .setAttribute('target', '_blank')
-                        .addClass(['d-block', 'standalone', 'mt-1'])
-          }) only %}
+            }|merge(_item.download.icon|default({})),
+            attributes: download_attributes.merge(_item.download.attributes|default(create_attribute()))
+          }) %}
+          {% include '@oe-bcl/bcl-link/link.html.twig' with _download_item only %}
           </div>
         </div>
       {% endif %}

package/templates/bcl-file/file.html.twig

@@ -138,17 +138,18 @@
           </small>
           {% endif %}
         </div>
+        {% set download_attributes = create_attribute()
+                                      .setAttribute('download', 'true')
+                                      .setAttribute('target', '_blank')
+                                      .addClass(['standalone', 'align-self-center', 'd-inline-block', 'mt-1', 'mt-md-0', 'flex-shrink-0']) %}
         {% set _download = _download|merge({
           icon_position: "after",
           icon: {
             name: "download",
             size: "fluid",
             path: _icon_path,
-          },
-          attributes: create_attribute()
-                      .setAttribute('download', true)
-                      .setAttribute('target', '_blank')
-                      .addClass(['standalone', 'align-self-center', 'd-inline-block', 'mt-1', 'mt-md-0', 'flex-shrink-0'])
+          }|merge(_download.icon|default({})),
+          attributes: download_attributes.merge(_download.attributes|default(create_attribute()))
         }) %}
         {% include '@oe-bcl/bcl-link/link.html.twig' with _download only %}
       </div>

package/templates/bcl-inpage-navigation/inpage-navigation.html.twig

@@ -7,7 +7,9 @@ Parameters:
   - title_link: (link object) (default: {})
   - title_attributes (drupal attrs)
   - links: (link[]) (default: [])
-  - id (string) (default: bcl-inpage-navigation-random(10))
+  - id (string) (default: bcl-inpage-navigation-random(100))
+  - dropdown_id (string) (default: bcl-inpage-navigation-dropdown-random(100))
+  - icon_path (string) (default: '')
   - attributes (drupal attrs)
 #}
 
@@ -16,7 +18,9 @@ Parameters:
 {% set _title_link = title_link|default({}) %}
 {% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _links = links|default([]) %}
-{% set _id = id|default('bcl-inpage-navigation-' ~ random(10)) %}
+{% set _id = id|default('bcl-inpage-navigation-' ~ random(100)) %}
+{% set _icon_path = icon_path|default('') %}
+{% set _dropdown_id = dropdown_id|default('bcl-inpage-navigation-dropdown' ~ random(100)) %}
 
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}
@@ -24,19 +28,36 @@ Parameters:
 
 {% set attributes = attributes.addClass(['bcl-inpage-navigation', 'position-sticky']).setAttribute('id', _id) %}
 {% set title_attributes = _title_attributes.addClass('mb-0') %}
+{% set _title_content %}
+  {{ _title }}
+  {%- include '@oe-bcl/bcl-icon/icon.html.twig' with {
+    name: 'chevron-down',
+    size: 's',
+    path: _icon_path,
+  } only -%}
+{% endset %}
 
 <nav {{ attributes }}>
+  {% set trigger_attributes = create_attribute()
+                              .setAttribute('aria-expanded', 'false')
+                              .setAttribute('type', 'button')
+                              .setAttribute('id', _dropdown_id)
+                              .setAttribute('data-bs-toggle', 'dropdown')
+                              .addClass(['dropdown-toggle']) %}
   {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
-    title: _title,
+    title: _title_content,
     title_tag: _title_tag,
     title_link: _title_link,
-    attributes: _title_attributes.addClass('mb-0'),
-  } only %}
-  {% include '@oe-bcl/bcl-navigation/navigation.html.twig' with {
-    'pills': true,
-    'vertical': true,
-    'items': _links,
+    attributes: _title_attributes
+                .merge(trigger_attributes),
   } only %}
+  <div class="dropdown-menu" aria-labelledby="{{ _dropdown_id }}">
+    {% include '@oe-bcl/bcl-navigation/navigation.html.twig' with {
+      'pills': true,
+      'vertical': true,
+      'items': _links,
+    } only %}
+  </div>
 </nav>
 
 {% endapply %}

package/templates/bcl-links-block/links-block.html.twig

@@ -35,18 +35,18 @@
 
 {% set attributes = attributes.addClass(_classes) %}
 
-<div
-  {{ attributes }}
->
-  {% if _title is not empty %}
-    {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
-      title: _title,
-      title_tag: _title_tag,
-      title_link: _title_link,
-      attributes: _title_attributes.addClass(_title_classes),
-    } only %}
-  {% endif %}
-  {% if _links is not empty and _links is iterable %}
+{% if _links is not empty and _links is iterable %}
+  <div
+    {{ attributes }}
+  >
+    {% if _title is not empty %}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: _title,
+        title_tag: _title_tag,
+        title_link: _title_link,
+        attributes: _title_attributes.addClass(_title_classes),
+      } only %}
+    {% endif %}
     <ul class="ps-0 mb-0">
       {% for _link in _links %}
         {% if _link.attributes is empty %}
@@ -70,7 +70,7 @@
         </li>
       {% endfor %}
     </ul>
-  {% endif %}
-</div>
+  </div>
+{% endif %}
 
 {% endapply %}

package/templates/bcl-pagination/pagination.html.twig

@@ -29,6 +29,7 @@
     }
   - icon_path (string) (default: '')
   - attributes (drupal attrs)
+  - list_attributes (drupal attrs)
 #}
 
 {% set _size = size|default('') %}
@@ -102,19 +103,23 @@
 
 {% set _internal_items = _internal_items|merge([_next, _last]) %}
 
-{% if attributes is empty %}
-  {% set attributes = create_attribute() %}
+{% if list_attributes is empty %}
+  {% set list_attributes = create_attribute() %}
 {% endif %}
 
-{% set _classes = ['pagination'] %}
+{% set list_attributes = list_attributes.addClass('pagination') %}
 {% if _size is not empty %}
-  {% set _classes = _classes|merge(['pagination-' ~ _size]) %}
+  {% set list_attributes = list_attributes.addClass('pagination-' ~ _size) %}
 {% endif %}
 {% if _variant is not empty %}
-  {% set _classes = _classes|merge(['pagination--' ~ _variant]) %}
+  {% set list_attributes = list_attributes.addClass('pagination--' ~ _variant) %}
 {% endif %}
 {% if _alignment is not empty %}
-  {% set _classes = _classes|merge(['justify-content-' ~ _alignment]) %}
+  {% set list_attributes = list_attributes.addClass('justify-content-' ~ _alignment) %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
 {% endif %}
 
 {% set attributes = attributes.setAttribute('role', 'navigation') %}
@@ -127,10 +132,8 @@
   {% set attributes = attributes.setAttribute('aria-label', aria_label) %}
 {% endif %}
 
-<nav
-  {{ attributes }}
->
-  <ul class="{{ _classes|join(' ') }}">
+<nav{{ attributes }}>
+  <ul{{ list_attributes }}>
 {% if _internal_items is not empty and _internal_items is iterable %}
   {% for _item in _internal_items %}
     {% if _item is not empty %}