@openeuropa/bcl-theme-joinup 0.1.202408021145

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

@@ -0,0 +1,130 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - id (string) (default: dropdown-random(1000))
+  - trigger (link or button)
+  - link (boolean) (default: false)
+  - direction (string) (default: '')
+    - options ['dropup', 'dropend', 'dropstart']
+  - alignment (string) (default: '')
+    - options [
+      'dropdown-menu-end',
+      'dropdown-menu-sm-end',
+      'dropdown-menu-md-end',
+      'dropdown-menu-lg-end',
+      'dropdown-menu-xl-end',
+      'dropdown-menu-xxl-end',
+      'dropdown-menu-start',
+      'dropdown-menu-sm-start',
+      'dropdown-menu-md-start',
+      'dropdown-menu-lg-start',
+      'dropdown-menu-xl-start',
+      'dropdown-menu-xxl-start'
+    ]
+  - dark (boolean) (default: false)
+  - remove_wrapper (boolean) (default: false)
+  - items (object[])
+    format: [
+      {
+        - link or button object
+        - active (boolean)
+        - divider (bolean) - show divider
+        - button (boolean) - set to button
+      }
+    ]
+  - attributes (drupal attrs)
+#}
+
+{% set _id = id|default('dropdown-' ~ random(1000)) %}
+{% set _trigger = trigger|default({}) %}
+{% set _link = link ?? false %}
+{% set _direction = direction|default('') %}
+{% set _alignment = alignment|default('') %}
+{% set _dark = dark ?? false %}
+{% set _remove_wrapper = remove_wrapper ?? false %}
+{% set _items = items|default([]) %}
+
+{% set _class = 'dropdown' %}
+{% set _dropdown_classes = ['dropdown-menu'] %}
+
+{% if _dark %}
+  {% set _dropdown_classes = _dropdown_classes|merge(['dropdown-menu-dark']) %}
+{% endif %}
+{% if _alignment %}
+  {% set _dropdown_classes = _dropdown_classes|merge([_alignment]) %}
+{% endif %}
+{% if _direction %}
+  {% set _class = _class ~ ' ' ~ _direction %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.setAttribute('aria-labelledby', _id).addClass(_dropdown_classes) %}
+
+{% if _trigger.attributes is empty %}
+  {% set _trigger = _trigger|merge({
+    attributes: create_attribute()
+  }) %}
+{% endif %}
+{% set _trigger = _trigger|merge({
+  attributes: _trigger.attributes.addClass(['dropdown-toggle'])
+                      .setAttribute('aria-expanded', 'false')
+                      .setAttribute('data-bs-toggle', 'dropdown')
+                      .setAttribute('id', _id)
+}) %}
+
+{% if _link %}
+  {% set _trigger = _trigger|merge({
+    attributes: _trigger.attributes.setAttribute('role', 'button') 
+  }) %}
+{% else %}
+  {% set _trigger = _trigger|merge({
+    attributes: _trigger.attributes.setAttribute('autocomplete', 'off') 
+  }) %}
+{% endif %}
+
+{% if not _remove_wrapper %}
+<div class="{{ _class }}">
+{% endif %}
+  {% if _link %}
+    {% include '@oe-bcl/bcl-link/link.html.twig' with _trigger only %}
+  {% else %}
+    {% include '@oe-bcl/bcl-button/button.html.twig' with _trigger only %}
+  {% endif %}
+  <ul
+    {{ attributes }}
+  >
+    {% if _items is not empty and _items is iterable %}
+      {% for _item in _items %}
+        {% if _item.attributes is empty %}
+          {% set _item = _item|merge({
+            attributes: create_attribute()
+          }) %}
+        {% endif %}
+        {% set _item_classes = ['dropdown-item'] %}
+        {% if _item.active %}
+          {% set _item_classes = _item_classes|merge(['active']) %}
+        {% endif %}
+        {% set _item = _item|merge({
+          clean_class: true,
+          attributes: _item.attributes.addClass(_item_classes)
+        }) %}
+        <li>
+        {% if _item.divider is defined %}
+          <hr class="dropdown-divider">
+        {% elseif _item.button is defined %}
+          {% include '@oe-bcl/bcl-button/button.html.twig' with _item only %}
+        {% else %}
+          {% include '@oe-bcl/bcl-link/link.html.twig' with _item only %}
+        {% endif %}
+        </li>
+      {% endfor %}
+    {% endif %}
+  </ul>
+{% if not _remove_wrapper %}
+</div>
+{% endif %}
+
+{% endapply %}

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

@@ -0,0 +1,24 @@
+{% extends '@oe-bcl/bcl-base-templates/content-type.html.twig' %}
+
+{% block sidebar %}
+  {% include '@oe-bcl/bcl-inpage-navigation/inpage-navigation.html.twig' with sidebar only %}
+{% endblock %}
+
+{% block content %}
+  {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with details_list only %}
+
+  <h2 id="item-1" class="my-4">Description</h2>
+  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet eleifend tortor. In facilisis eros vitae turpis ullamcorper,
+  a euismod dolor lacinia. Nam facilisis ipsum et sollicitudin imperdiet. Curabitur a efficitur ante. Phasellus non felis laoreet,
+  posuere ante ut, rhoncus tortor. Proin sed erat vel nisl luctus vulputate. Nunc tristique ultricies turpis, eu dictum enim ultrices vel.
+  Sed posuere at leo sit amet placerat. Sed dapibus viverra urna ac pretium. Praesent et laoreet erat, eget volutpat metus. Duis ac augue
+  sed tortor elementum dignissim in sit amet velit. Nullam nec viverra mi.
+  </p>
+  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet eleifend tortor. In facilisis eros vitae turpis ullamcorper,
+  a euismod dolor lacinia. Nam facilisis ipsum et sollicitudin imperdiet.
+  </p>
+
+  <h2 id="item-2" class="my-4">Related documents</h2>
+  {% include '@oe-bcl/bcl-file/file.html.twig' with files[0] only %}
+  {% include '@oe-bcl/bcl-file/file.html.twig' with files[1] only %}
+{% endblock %}

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

@@ -0,0 +1,128 @@
+{% apply spaceless %}
+
+{#
+  Parameters:
+  - title (string) (default: '')
+  - title_tag (string) (default: 'h2')
+  - title_link: (link object) (default: {})
+  - title_attributes (drupal attrs)
+  - variant (string) (default: 'default')
+      options:  default, block ]
+  - display_icons (boolean) (default: true)
+  - items (array) (default: []):
+    - icon (associate array) (default: { size: 'm' })
+    - subtitle (string) (default: '')
+    - title (string) (default: '')
+    - description (string) (default:'')
+  - grid_columns (int) (default: 1)
+  - responsiveness (string) (default: 'md')
+  - responsive_columns (integer) (default: 3)
+  - gutter (int) (default: 4)
+  - equal_height (boolean) (default: false)
+  - cols_extra_classes (string) (default: '')
+  - icon_path (string) (default: '')
+  - link_more (object of type link) (default {})
+#}
+
+{% set _title = title|default('') %}
+{% set _title_tag = title_tag|default('h2') %}
+{% set _title_link = title_link|default({}) %}
+{% set _title_attributes = title_attributes ?: create_attribute() %}
+{% set _variant = variant|default('default') %}
+{% set _display_icons = display_icons ?? true %}
+{% set _items = items|default([]) %}
+{% set _grid_columns = grid_columns|default(1) %}
+{% set _responsiveness = responsiveness|default('md') %}
+{% set _responsive_columns = responsive_columns|default(3) %}
+{% set _gutter = gutter|default(4) %}
+{% set _equal_height = equal_height ?? false %}
+{% set _cols_extra_classes = cols_extra_classes|default('') %}
+{% set _icon_path = icon_path|default('') %}
+{% set _link_more = link_more|default({}) %}
+
+{% set _cols_classes = 'col' %}
+{% set _classes = ['bcl-fact-figures', 'bcl-fact-figures--' ~ _variant] %}
+{% set _wrapper_classes = [] %}
+
+{% set _grid_classes = [
+  'row-cols-' ~ _responsiveness ~ '-' ~ _responsive_columns,
+  'row', 'row-cols-' ~ _grid_columns
+] %}
+{% if _responsive_columns == 3 %}
+ {% set _grid_classes = _grid_classes|merge(['row-cols-sm-2']) %}
+{% endif %}
+{% if _variant == 'block' or _variant == 'block-primary' %}
+  {% set _wrapper_classes = _wrapper_classes|merge(['bg-light p-3-5 pt-0']) %}
+{% endif %}
+{% if _gutter is not empty %}
+  {% set _grid_classes = _grid_classes|merge(['g-' ~ _gutter]) %}
+{% endif %}
+{% if _title is not empty %}
+  {% set _grid_classes = _grid_classes|merge(['mt-3']) %}
+{% endif %}
+{% if _equal_height %}
+  {% set _cols_classes = _cols_classes ~ ' h-100' %}
+{% endif %}
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% 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,
+  } only %}
+{% endif %}
+  <div
+  {% if _wrapper_classes is not empty %}
+    class="{{ _wrapper_classes|join(' ') }}"
+  {% endif %}
+  >
+    <div class="{{ _grid_classes|join(' ') }}">
+    {% if _items is defined and _items is not empty and _items is iterable %}
+      {% for _item in _items %}
+      <div class="{{ _cols_classes }}">
+      {% if _item.icon is defined and _item.icon is not empty and _display_icons %}
+        {% set _icon_attributes = _item.icon.attributes ?: create_attribute() %}
+        {% set _item = _item|merge({
+          icon: _item.icon|merge({
+            path: _icon_path,
+            size: 'l',
+            attributes: _icon_attributes.addClass(['mb-2', 'icon--primary']),
+          })
+        }) %}
+        {% include '@oe-bcl/bcl-icon/icon.html.twig' with _item.icon only %}
+      {% endif %}
+      {% if _item.title is defined and _item.title is not empty %}
+        <div class="fs-4 fw-medium">
+          {{- _item.title -}}
+        </div>
+      {% endif %}
+      {% if _item.subtitle is defined and _item.subtitle is not empty %}
+        <div class="fs-5 fw-medium">
+          {{- _item.subtitle -}}
+        </div>
+      {% endif %}
+      {% if _item.description is defined and _item.description is not empty %}
+        <p>
+          {{- _item.description -}}
+        </p>
+      {% endif %}
+      </div>
+      {% endfor %}
+    {% endif %}
+    </div>
+    {% if _link_more is defined and _link_more is not empty %}
+      <div class="border-top d-block pt-3 mt-3">
+        {% include '@oe-bcl/bcl-link/link.html.twig' with _link_more only %}
+      </div>
+    {% endif %}
+  </div>
+</div>
+
+{% endapply %}

package/templates/bcl-featured-media/featured-media.html.twig

@@ -0,0 +1,172 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - title (string) (default: '')
+  - title_tag (string) (default: 'h2')
+  - title_link: (link object) (default: {})
+  - title_attributes: (drupal attrs)
+  - with_text (boolean) (default: false)
+  - alignment: (string) (default: 'right')
+    - options ['left', 'right']
+  - image: (string) (default: '')
+  - poster_image: (string) (default: '')
+  - content: (string) (default: '')
+  - wrapper_classes: (default: '')
+  - force_wrapper (boolean) (default: false) - always render wrapper element
+  - content_classes: (string) (default: '')
+  - read_more (object) (default: {})
+  - description_title (string) (default: '')
+  - description_title_tag (string) (default: 'h3')
+  - description_title_attributes (drupal attrs)
+  - description (string) (default: '')
+  - ratio: (string) (default: '16x9')
+    - options ['1x1', '4x3', '16x9', '21x9']
+  - sources: (object[]) (default: []) format: [
+    {
+      type: '',
+      src: ''
+    }
+  ]
+  - tracks: (object[]) (default: []) format: [
+    {
+      kind: '',
+      label: '',
+      src: '',
+      src_lang: ''
+    }
+  ]
+
+  Blocks:
+    - "embedded_media"
+#}
+
+{% set _title = title|default('') %}
+{% set _title_tag = title_tag|default('h2') %}
+{% set _title_link = title_link|default({}) %}
+{% set _title_attributes = title_attributes ?: create_attribute() %}
+{% set _force_wrapper = force_wrapper ?? false %}
+{% set _with_text = with_text ?? false %}
+{% set _alignment = alignment|default('right') %}
+{% set _image = image|default('') %}
+{% set _poster_image = poster_image|default('') %}
+{% set _content = content|default('') %}
+{% set _wrapper_classes = wrapper_classes|default('') %}
+{% set _content_classes = content_classes|default('') %}
+{% set _read_more = read_more|default({}) %}
+{% set _description_title = description_title|default('') %}
+{% set _description_title_tag = description_title_tag|default('h3') %}
+{% set _description_title_attributes = description_title_attributes ?: create_attribute() %}
+{% set _description = description|default('') %}
+{% set _ratio = ratio|default('16x9') %}
+{% set _sources = sources|default([]) %}
+{% set _tracks = tracks|default([]) %}
+{% set _embedded_media = embedded_media|default('') %}
+
+{% set _classes = 'bcl-featured-item' %}
+{% set _col_classes = 'col-12 col-md-6' %}
+
+{% if _wrapper_classes is not empty %}
+  {% set _classes = _classes ~ ' ' ~ wrapper_classes %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(["rounded", "overflow-hidden"]) %}
+
+{% if _image is not empty %}
+  {% set attributes = attributes.addClass(["d-inline-flex", "flex-wrap"]) %}
+  {% if _content_classes is not empty %}
+    {% set _content_classes = _content_classes ~ ' flex-1 w-min-content' %}
+  {% else %}
+    {% set _content_classes = 'flex-1 w-min-content' %}
+  {% endif %}
+{% endif %}
+
+{% if _with_text or _force_wrapper %}
+<div class="{{ _classes }}">
+{% endif %}
+{% if _with_text %}
+  <div class="row">
+{% endif %}
+
+{%- 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,
+  } only %}
+{%- endif -%}
+
+{% if _with_text %}
+  <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '1' : '2' }}">
+    {%- if _description_title is not empty -%}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: _description_title,
+        title_tag: _description_title_tag,
+        attributes: _description_title_attributes,
+      } only %}
+    {%- endif -%}
+    {{- _description|default('') -}}
+
+    {% if _read_more is not empty %}
+      {% include '@oe-bcl/bcl-link/link.html.twig' with _read_more only %}
+    {% endif %}
+  </div>
+  <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '2 mt-4 mt-md-0' : '1' }}">
+{% endif %}
+
+<figure
+  {{ attributes }}
+>
+{% if _embedded_media is not empty %}
+  {% set _video_classes = "ratio ratio-" ~ _ratio %}
+  <div class="{{ _video_classes }}">
+    {%- block embedded_media _embedded_media -%}
+  </div>
+{% elseif _sources is not empty and _sources is iterable %}
+  <video
+    controls
+    poster="{{ _poster_image }}"
+    class="w-100 d-block"
+  >
+  {% for source in _sources %}
+  <source type="{{ source.type }}" src="{{ source.src }}" />
+  {% endfor %}
+  {% if _tracks is not empty and _tracks is iterable %}
+    {% for track in _tracks %}
+    <track
+      kind="{{ track.kind }}"
+      label="{{ track.label }}"
+      src="{{ track.src }}"
+      srclang="{{ track.src_lang }}"
+    />
+    {% endfor %}
+  {% endif %}
+  </video>
+{% else %}
+  {{ _image }}
+{% endif %}
+
+{% if _content is not empty %}
+  <figcaption
+    {% if _content_classes is not empty %}
+    class="{{ _content_classes }}"
+    {% endif %}
+  >
+    {{- _content -}}
+  </figcaption>
+{% endif %}
+</figure>
+
+{% if _with_text %}
+    </div>
+  </div>
+{% endif %}
+{% if _with_text or _force_wrapper %}
+</div>
+{% endif %}
+
+{% endapply %}

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

@@ -0,0 +1,93 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - id (string) (default: language-dropdown-random(1000))
+  - label (string) (default: '')
+  - icon_path (string) (default: '')
+  - items (string) (default: [])
+    format: [
+      {
+        extension: '',
+        language: '',
+        size: '',
+        download: {}, - link Object
+      },
+    ]
+#}
+
+{% set _id = id|default('language-dropdown' ~ random(1000)) %}
+{% set _label = label|default('') %}
+{% set _icon_path = icon_path|default('') %}
+{% set _items = items|default([]) %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(['bg-lighter', 'py-3', 'px-4', 'border-top']) %}
+
+<div
+  {{ attributes }}>
+  <div class="text-end text-md-center">
+    {% include '@oe-bcl/bcl-link/link.html.twig' with _label|merge({
+      path: '#' ~ _id,
+      attributes: create_attribute()
+                  .addClass(['standalone'])
+                  .setAttribute('aria-controls', _id)
+                  .setAttribute('data-bs-toggle', 'collapse')
+                  .setAttribute('aria-expanded', 'false')
+                  .setAttribute('role', 'button'),
+    }) only %}
+  </div>
+  {% if _items is not empty and _items is iterable %}
+  <div class="collapse" id="{{ _id }}">
+    {% for _item in _items %}
+      {% set _item_classes = loop.last ? 'pt-3' : 'py-3 border-bottom' %}
+      <div class="{{ _item_classes }}">
+      {% if _item.type == 'content' %}
+        {{ _item.content }}
+      {% else %}
+        <div class="row">
+          <div class="col-12 col-md-9">
+            {% if _item.title is not empty %}
+              <p class="fw-bold m-0">{{ _item.title }}</p>
+            {% endif %}
+            {% if _item.description is not empty %}
+              <p class="m-0">{{ _item.description }}</p>
+            {% endif %}
+            {% if _item.language is not empty or _item.meta is not empty %}
+            <small class="fw-bold m-0">
+              {%- if _item.language is not empty -%}
+                {{- _item.language -}}
+              {%- endif -%}
+              {%- if _item.meta is not empty -%}
+                <span class="fw-normal">
+                  {{- ' ' ~ _item.meta -}}
+                </span>
+              {%- endif -%}
+            </small>
+            {% 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({
+            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 %}
+          </div>
+        </div>
+      {% endif %}
+      </div>
+    {% endfor %}
+  </div>
+  {% endif %}
+</div>
+
+{% endapply %}