@openeuropa/bcl-twig-templates 0.28.1 → 1.0.2

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

@@ -0,0 +1,73 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - path (string) (default: '')
+  - label (string) (default: '')
+  - disabled (boolean) (default: false)
+  - active (boolean) (default: false)
+  - aria_label (string) (default: '') - deprecated, use attributes
+  - icon (icon object) (default: {})
+  - attributes (drupal attrs)
+#}
+
+{% set _path = path|default('') %}
+{% set _label = label|default('') %}
+{% set _disabled = disabled ?? false %}
+{% set _active = active ?? false %}
+{% set _aria_label = aria_label|default('') %}
+{% set _icon = icon|default({}) %}
+{% set _icon_path = icon_path|default('') %}
+{% set _icon_name = icon_name|default('') %}
+{% set _icon_html = icon_html|default('') %}
+{% set _classes = ['page-link'] %}
+
+{% if _icon_path is not empty and _icon is empty %}
+  {% if _icon_name is not empty %}
+    {% set _icon = _icon|merge({
+      name: _icon_name,
+      path: _icon_path,
+      size: "fluid"
+    }) %}
+    {% set _label = "" %}
+  {% endif %}
+{% else %}
+  {% if _icon_html is not empty %}
+    {% set _label %}
+      <span aria-hidden="true">{{- _icon_html -}}</span>
+    {% endset %}
+  {% endif %}
+{% endif %}
+
+{% if _icon is not empty %}
+  {% set _icon = _icon|merge({
+    path: _icon_path,
+  }) %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% if _aria_label is not empty %}
+  {% set attributes = attributes.setAttribute('aria-label', _aria_label ) %}
+{% endif %}
+
+{% if _active %}
+  {% set attributes = attributes.setAttribute('aria-current', 'page' ) %}
+{% endif %}
+
+{% set attributes = attributes.addClass(_classes) %}
+
+{% if _path %}
+  {%- include '@oe-bcl/bcl-link/link.html.twig' with {
+    label: _label,
+    path: _path,
+    disabled: _disabled,
+    icon: _icon,
+    attributes: attributes,
+  } only -%}
+{% else %}
+  <div {{ attributes }}>{{- _label -}}</div>
+{% endif %}
+
+{% endapply %}

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

@@ -5,49 +5,27 @@
     - options ['sm', 'lg']
   - alignment (string) (default: '')
     - options ['end', 'center']
-  - aria_label (string) (default: '')
   - variant: (string) (default: '')
+    - options: ['glossary']
+  - aria_label (string) (default: '') - deprecated, use attributes
   - enable_prev_next_icon (boolean) (default: false)
   - enable_first_last_icon (boolean) (default: true)
-  - first (object)
-    format: {
-      - path (string)
-      - label (string)
-      - disabled (boolean)
-      - aria_label (string)
-      - icon (Icon component)
-    }
-  - prev (object)
-    format: {
-      - path (string)
-      - label (string)
-      - disabled (boolean)
-      - aria_label (string)
-      - icon (Icon component)
-    }
-  - next (object)
-    format: {
-      - path (string)
-      - label (string)
-      - disabled (boolean)
-      - aria_label (string)
-      - icon (Icon component)
-    }
-  - last (object)
-    format: {
-      - path (string)
-      - label (string)
-      - disabled (boolean)
-      - aria_label (string)
-      - icon (Icon component)
-    }
-  - items (array of objects)
+  - ellipsis_before (boolean) (default: false)
+  - ellipsis_after (boolean) (default: false)
+  - first (pagination Item object) (default: {})
+  - prev (pagination Item object) (default: {})
+  - next (pagination Item object) (default: {})
+  - last (pagination Item object) (default: {})
+  - items (pagination item[]) (default: [])
     format: [
     {
-      - path (string)
-      - label (string)
-      - disabled (boolean)
-      - active (boolean)
+      - path (string) (default: '')
+      - label (string) (default: '')
+      - disabled (boolean) (default: false)
+      - active (boolean) (default: false)
+      - aria_label (string) (default: '') - deprecated, use attributes
+      - icon (Icon component) (default: {})
+      - attributes (drupal attrs)
     }
   - icon_path (string) (default: '')
   - attributes (drupal attrs)
@@ -55,32 +33,90 @@
 
 {% set _size = size|default('') %}
 {% set _alignment = alignment|default('') %}
-{% set _aria_label = aria_label|default('') %}
 {% set _variant = variant|default('') %}
-{% set _enable_prev_next_icon = enable_prev_next_icon|default(false) %}
+{% set _aria_label = aria_label|default('') %}
+{% set _enable_prev_next_icon = enable_prev_next_icon ?? false %}
 {% set _enable_first_last_icon = enable_first_last_icon ?? true %}
+{% set _ellipsis_before = ellipsis_before ?? false %}
+{% set _ellipsis_after = ellipsis_after ?? false %}
 {% set _first = first|default({}) %}
 {% set _prev = prev|default({}) %}
 {% set _next = next|default({}) %}
 {% set _last = last|default({}) %}
 {% set _items = items|default([]) %}
 {% set _icon_path = icon_path|default('') %}
+{% set _internal_items = [] %}
 
-{% set _classes = 'pagination' %}
-{% if _size is not empty %}
-  {% set _classes = _classes ~ ' pagination-' ~ _size %}
+{% if _enable_first_last_icon %}
+  {% if _first is not empty %}
+    {% set _first = _first|merge({
+      icon_html: "«",
+      icon_name: "chevron-double-left",
+    }) %}
+  {% endif %}
+  {% if _last is not empty %}
+    {% set _last = _last|merge({
+      icon_html: '»',
+      icon_name: "chevron-double-right",
+    }) %}
+  {% endif %}
 {% endif %}
-{% if _variant is not empty %}
-  {% set _classes = _classes ~ ' pagination--' ~ _variant %}
+
+{% if _enable_prev_next_icon %}
+  {% if _prev is not empty %}
+    {% set _prev = _prev|merge({
+      icon_html: "‹",
+      icon_name: "chevron-left",
+    }) %}
+  {% endif %}
+  {% if _next is not empty %}
+    {% set _next = _next|merge({
+      icon_html: "›",
+      icon_name: "chevron-right",
+    }) %}
+  {% endif %}
 {% endif %}
-{% if _alignment is not empty %}
-  {% set _classes = _classes ~ ' justify-content-' ~ _alignment %}
+
+
+{% set _internal_items = _internal_items|merge([_first, _prev]) %}
+
+{% set _ellipsis_markup %} … {% endset %}
+
+{% if _ellipsis_before %}
+  {% set _ellipsis_before_item = {
+    icon_html: _ellipsis_markup,
+    icon_path: "",
+  } %}
+  {% set _internal_items = _internal_items|merge([_ellipsis_before_item]) %}
+{% endif %}
+
+{% set _internal_items = _internal_items|merge(_items) %}
+
+{% if _ellipsis_after %}
+  {% set _ellipsis_after_item = {
+    icon_html: _ellipsis_markup,
+    icon_path: "",
+  } %}
+  {% set _internal_items = _internal_items|merge([_ellipsis_after_item]) %}
 {% endif %}
 
+{% set _internal_items = _internal_items|merge([_next, _last]) %}
+
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}
 {% endif %}
 
+{% set _classes = ['pagination'] %}
+{% if _size is not empty %}
+  {% set _classes = _classes|merge(['pagination-' ~ _size]) %}
+{% endif %}
+{% if _variant is not empty %}
+  {% set _classes = _classes|merge(['pagination--' ~ _variant]) %}
+{% endif %}
+{% if _alignment is not empty %}
+  {% set _classes = _classes|merge(['justify-content-' ~ _alignment]) %}
+{% endif %}
+
 {% set attributes = attributes.setAttribute('role', 'navigation') %}
 
 {% if _variant == 'glossary' %}
@@ -90,188 +126,32 @@
 {% if _aria_label is not empty %}
   {% set attributes = attributes.setAttribute('aria-label', aria_label) %}
 {% endif %}
-{% if _extra_classes is not empty %}
-  {% set _class = _class ~ ' ' ~ _extra_classes %}
-{% endif %}
 
 <nav
   {{ attributes }}
 >
-  <ul class="{{ _classes }}">
-  {% if _first is not empty %}
-    {% set _first_class = 'page-item' %}
-    {% if _first.disabled %}
-      {% set _first_class = _first_class ~ ' disabled' %}
-    {% endif %}
-    <li class="{{ _first_class }}">
-      <a
-        class="page-link"
-        href="{{ _first.path }}"
-        {% if _first.disabled %}
-        tabindex="-1"
-        aria-disabled="true"
+  <ul class="{{ _classes|join(' ') }}">
+{% if _internal_items is not empty and _internal_items is iterable %}
+  {% for _item in _internal_items %}
+    {% if _item is not empty %}
+      {% set _item_class = ['page-item'] %}
+      {% if _item.disabled %}
+        {% set _item_class = _item_class|merge(['disabled']) %}
+      {% endif %}
+      {% if _item.active %}
+        {% set _item_class = _item_class|merge(['active']) %}
+      {% endif %}
+      <li class="{{ _item_class|join(' ') }}">
+        {% if _item.icon_path is not defined %}
+          {% set _item = _item|merge({
+            icon_path: _icon_path,
+          }) %}
         {% endif %}
-        {%- if _first.aria_label -%}
-        aria-label="{{ _first.aria_label }}"
-        {%- endif -%}
-      >
-      {%- if _enable_first_last_icon -%}
-        {%- if _first.icon is not empty -%}
-          {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _first.icon only -%}
-        {%- else -%}
-          {%- if _icon_path is not empty -%}
-            {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
-              name: "chevron-double-left",
-              size: "fluid",
-              path: _icon_path,
-            } only %}
-          {%- else -%}
-            <span aria-hidden="true">&laquo;</span>
-          {%- endif -%}
-        {%- endif -%}
-      {%- else -%}
-        {{- _first.label -}}
-      {%- endif -%}
-      </a>
-    </li>
-  {% endif %}
-  {% if _prev is not empty %}
-    {% set _prev_class = 'page-item' %}
-    {% if _prev.disabled %}
-      {% set _prev_class = _prev_class ~ ' disabled' %}
-    {% endif %}
-    <li class="{{ _prev_class }}">
-      <a
-        class="page-link"
-        href="{{ _prev.path }}"
-        {% if _prev.disabled %}
-        tabindex="-1"
-        aria-disabled="true"
-        {% endif %}
-        {%- if _prev.aria_label -%}
-        aria-label="{{ _prev.aria_label }}"
-        {%- endif -%}
-      >
-      {%- if _enable_prev_next_icon -%}
-        {%- if _prev.icon is not empty -%}
-          {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _prev.icon only -%}
-        {%- else -%}
-          {%- if _icon_path is not empty -%}
-            {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
-              name: "chevron-left",
-              size: "fluid",
-              path: _icon_path,
-            } only %}
-          {%- else -%}
-            <span aria-hidden="true">&lsaquo;</span>
-          {%- endif -%}
-        {%- endif -%}
-      {%- else -%}
-        {{- _prev.label -}}
-      {%- endif -%}
-      </a>
-    </li>
-  {% endif %}
-  {% if _items is not empty and _items is iterable %}
-    {% for _item in _items %}
-    {% set _item_class = 'page-item' %}
-    {% if _item.disabled %}
-      {% set _item_class = _item_class ~ ' disabled' %}
+        {% include '@oe-bcl/bcl-pagination/pagination-item.html.twig' with _item only %}
+      </li>
     {% endif %}
-    {% if _item.active %}
-      {% set _item_class = _item_class ~ ' active' %}
-    {% endif %}
-    <li class="{{ _item_class }}">
-      <a
-        class="page-link"
-        href="{{ _item.path }}"
-        {% if _item.disabled %}
-        tabindex="-1"
-        aria-disabled="true"
-        {% endif %}
-        {% if _item.active %}
-        aria-current="page"
-        {% endif %}
-      >
-        {{- _item.label -}}
-      </a>
-    </li>
-    {% endfor %}
-  {% endif %}
-  {% if _next is not empty %}
-    {% set _next_class = 'page-item' %}
-    {% if _next.disabled %}
-      {% set _next_class = _next_class ~ ' disabled' %}
-    {% endif %}
-    <li class="{{ _next_class }}">
-      <a
-        class="page-link"
-        href="{{ _next.path }}"
-        {% if _next.disabled %}
-        tabindex="-1"
-        aria-disabled="true"
-        {% endif %}
-        {%- if _next.aria_label -%}
-        aria-label="{{ _next.aria_label }}"
-        {%- endif -%}
-      >
-      {%- if _enable_prev_next_icon -%}
-        {%- if _next.icon is not empty -%}
-          {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _next.icon only -%}
-        {%- else -%}
-          {%- if _icon_path is not empty -%}
-            {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
-              name: "chevron-right",
-              size: "fluid",
-              path: _icon_path,
-            } only %}
-          {%- else -%}
-            <span aria-hidden="true">&rsaquo;</span>
-          {%- endif -%}
-        {%- endif -%}
-      {%- else -%}
-        {{- _next.label -}}
-      {%- endif -%}
-      </a>
-    </li>
-  {% endif %}
-  {% if _last is not empty %}
-    {% set _last_class = 'page-item' %}
-    {% if _last.disabled %}
-      {% set _last_class = _last_class ~ ' disabled' %}
-    {% endif %}
-    <li class="{{ _last_class }}">
-      <a
-        class="page-link"
-        href="{{ _last.path }}"
-        {% if _last.disabled %}
-        tabindex="-1"
-        aria-disabled="true"
-        {% endif %}
-        {%- if _last.aria_label -%}
-        aria-label="{{ _last.aria_label }}"
-        {%- endif -%}
-      >
-      {%- if _enable_first_last_icon -%}
-        {%- if _last.icon is not empty -%}
-          {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _last.icon only -%}
-        {%- else -%}
-          {%- if _icon_path is not empty -%}
-            {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
-              name: "chevron-double-right",
-              size: "fluid",
-              path: _icon_path,
-            } only %}
-          {%- else -%}
-            <span aria-hidden="true">&raquo;</span>
-          {%- endif -%}
-        {%- endif -%}
-      {%- else -%}
-        {{- _last.label -}}
-        {%- endif -%}
-      </a>
-    </li>
-  {% endif %}
+  {% endfor %}
+{% endif %}
   </ul>
 </nav>
 

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

@@ -17,9 +17,9 @@
 {% set _progress = progress|default(0) %}
 {% set _min = min|default(0) %}
 {% set _max = max|default(100) %}
-{% set _striped = striped|default(false) %}
-{% set _animated = animated|default(false) %}
-{% set _hidden_label = hidden_label|default(false) %}
+{% set _striped = striped ?? false %}
+{% set _animated = animated ?? false %}
+{% set _hidden_label = hidden_label ?? false %}
 {% set _label = label|default('') %}
 {% set _bar_label = bar_label|default('') %}
 {% set _variant = variant|default('') %}

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

@@ -5,26 +5,22 @@
 {% endblock %}
 
 {% block content %}
-  {% if project_status_title is not empty %}
-    {% set _project_title_attributes = create_attribute().addClass(['mb-4']) %}
-    {% if project_status_id is not empty %}
-      {% set _project_title_attributes = _project_title_attributes.setAttribute('id', project_status_id) %}
-    {% endif %}
-    {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
-      title: project_status_title,
-      title_tag: 'h2',
-      attributes: _project_title_attributes,
-    } only %}
-  {% endif %}
   {% if project_status is not empty %}
+    {% if project_status_title is not empty %}
+      {% set _project_title_attributes = create_attribute().addClass(['mb-4']) %}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: project_status_title,
+        title_tag: 'h2',
+        attributes: create_attribute().setAttribute('id', project_status_id),
+      } only %}
+    {% endif %}
     {% include '@oe-bcl/bcl-project-status/project-status.html.twig' with project_status %}
-  {% endif %}
-  {% if project_contributions is not empty %}
-    {% include '@oe-bcl/bcl-project-status/project-contributions.html.twig' with project_contributions %}
-  {% endif %}
-
-  {% if status_lists is not empty %}
-    {% include '@oe-bcl/bcl-project/project-lists.html.twig' with status_lists only %}
+    {% if project_contributions is not empty %}
+      {% include '@oe-bcl/bcl-project-status/project-contributions.html.twig' with project_contributions %}
+    {% endif %}
+    {% if status_lists is not empty %}
+      {% include '@oe-bcl/bcl-project/project-lists.html.twig' with status_lists only %}
+    {% endif %}
   {% endif %}
 
   {% if first_paragraphs is defined and first_paragraphs is not empty %}
@@ -59,17 +55,6 @@
     {% endfor %}
   {% endif %}
 
-  {% if gallery.main_title is not empty %}
-    {% set _gallery_title_attributes = create_attribute().addClass(['my-4']) %}
-    {% if gallery.main_title_id is not empty %}
-      {% set _gallery_title_attributes = _gallery_title_attributes.setAttribute('id', gallery.main_title_id) %}
-    {% endif %}
-    {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
-      title: gallery.main_title,
-      title_tag: 'h2',
-      attributes: _gallery_title_attributes,
-    } only %}
-  {% endif %}
   {% if gallery is not empty %}
   <div class="mt-3 mb-4-5">
     {% include '@oe-bcl/bcl-gallery/gallery.html.twig' with gallery only %}

package/templates/bcl-project-status/project-contributions.html.twig

@@ -2,7 +2,7 @@
 
 {# Parameters:
   - corporate_contributions (string) (default: '') // value every 5 percent
-  - legend (description list object) (default: false)
+  - legend (description list object) (default: {})
   - chart (boolean) (default: false)
 
   Blocks - 
@@ -12,7 +12,7 @@
 
 {% set _corporate_contributions = corporate_contributions|default('') %}
 {% set _legend = legend|default({}) %}
-{% set _chart = chart|default(false) %}
+{% set _chart = chart ?? false %}
 
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}

package/templates/bcl-project-status/project-status.html.twig

@@ -1,24 +1,23 @@
 {% apply spaceless %}
 
 {# Parameters:
+  - label (string) (default: '')
   - status (string) (default: 'planned')
+  - badge (string) (default: '')
   - start_date (string) (default: '')
   - start_label (string) (default: '')
   - end_date (string) (default: '')
   - end_label (string) (default: '')
-  - label (string) (default: '')
-  - badge (string) (default: ''),
   - progress (string) (default: '')
   - attributes (drupal attrs)
 #}
 
 {% set _label = label|default('') %}
 {% set _status = status|default('planned') %}
-{% set _charts = charts|default('') %}
 {% set _badge = badge|default('') %}
 {% set _start_date = start_date|default('') %}
-{% set _end_date = end_date|default('') %}
 {% set _start_label = start_label|default('') %}
+{% set _end_date = end_date|default('') %}
 {% set _end_label = end_label|default('') %}
 {% set _progress = progress|default('') %}
 

package/templates/bcl-recent-activities/recent-activities.html.twig

@@ -1,7 +1,7 @@
 {% apply spaceless %}
 
 {# Parameters:
-  - activities (array of custom object) (default: [])
+  - activities (object[]) (default: [])
     format: [
       {
         image: {

package/templates/bcl-search-form/search-form.html.twig

@@ -9,7 +9,7 @@
   ]
 #}
 
-{% set _pill = pill|default(false) %}
+{% set _pill = pill ?? false %}
 {% set _icon = icon|default({}) %}
 {% set _submit = submit|default({}) %}
 {% set _input = input|default({}) %}

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

@@ -15,7 +15,21 @@
   - valid_feedback (string) (default: '')
   - required (boolean) (default: false)
   - multiple (boolean) (default: false)
-  - options: (array of objects with value and label keys) (default: [])
+  - options (object[]) (default: [])
+    format: [
+      {
+        selected (boolean, optional)
+        disabled (boolean, optional)
+        label (string)
+        hidden (boolean, optional)
+        options (object[], optional)
+          format: [{
+            selected (boolean, optional)
+            disabled (boolean, optional)
+            label (string)
+          }]
+      }
+    ]
   - aria_label (string) (default: '')
   - clean_class (boolean) (default: false) - removes 'form-select' class
   - attributes (drupal attrs)
@@ -24,19 +38,19 @@
 {% set _id = id|default('') %}
 {% set _label = label|default('') %}
 {% set _label_extra_classes = label_extra_classes|default('') %}
-{% set _hidden_label = hidden_label|default(false) %}
+{% set _hidden_label = hidden_label ?? false %}
 {% set _helper_text = helper_text|default('') %}
 {% set _helper_text_id = helper_text_id|default('') %}
-{% set _disabled = disabled|default(false) %}
-{% set _invalid = invalid|default(false) %}
-{% set _valid = valid|default(false) %}
+{% set _disabled = disabled ?? false %}
+{% set _invalid = invalid ?? false %}
+{% set _valid = valid ?? false %}
 {% set _invalid_feedback = invalid_feedback|default('') %}
 {% set _valid_feedback = valid_feedback|default('') %}
-{% set _required = required|default(false) %}
-{% set _multiple = multiple|default(false) %}
+{% set _required = required ?? false %}
+{% set _multiple = multiple ?? false %}
 {% set _options = options|default([]) %}
 {% set _aria_label = aria_label|default('') %}
-{% set _clean_class = clean_class|default(false) %}
+{% set _clean_class = clean_class ?? false %}
 
 {% set _classes = ['form-select'] %}
 {% set _label_class = 'form-label' %}

package/templates/bcl-subscription/subscription-modal.html.twig

@@ -3,7 +3,7 @@
 {# Parameters:
   - form: (form object) (default: {})
   - success_alert: (alert object) (default: {})
-  - error_alert: (button Object) (default: {})
+  - error_alert: (alert Object) (default: {})
 
   Blocks:
   - body