@openeuropa/bcl-theme-joinup 0.1.202408021145

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

@@ -0,0 +1,195 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - striped (boolean) (default: false)
+  - hoverable (boolean) (default: false)
+  - table_responsive (string) (default: '')
+    - options ['all', 'sm', 'md', 'lg', 'xl', 'xxl']
+  - variant (string) (default: '')
+    - options ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark']
+  - small (boolean) (default: false)
+  - alignment (string) (default: '')
+    - options ['bottom', 'middle', 'top']
+  - caption (string) (default: '')
+  - caption_top (boolean) (default: false)
+  - border (string) (default: '')
+    - options ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark']
+  - borderless (boolean) (default: false)
+  - table_footer (object[]) (default: {})
+    format: [
+      {
+        - col_span
+        - content
+      }
+    ]
+  - table_head (object[]) (default: {})
+    format: [
+      {
+        - col_span
+        - content
+      }
+    ]
+  - rows (object[]) (default: [])
+      format: [
+        {
+          - active
+          - alignment
+          - variant
+          - cells: [
+            {
+              - col_span
+              - content
+            }
+          ]
+        }
+    ]
+  - attributes (drupal attrs)
+#}
+
+{% set _striped = striped ?? false %}
+{% set _hoverable = hoverable ?? false %}
+{% set _table_responsive = table_responsive|default('') %}
+{% set _variant = variant|default('') %}
+{% set _small = small ?? false %}
+{% set _alignment = alignment|default('') %}
+{% set _caption = caption|default('') %}
+{% set _caption_top = caption_top ?? false %}
+{% set _border = border|default('') %}
+{% set _borderless = borderless ?? false %}
+{% set _table_footer = table_footer|default({}) %}
+{% set _table_head = table_head|default({}) %}
+{% set _rows = rows|default([]) %}
+
+{% set _classes = ['table'] %}
+{% if _striped %}
+  {% set _classes = _classes|merge(['table-striped']) %}
+{% endif %}
+{% if _hoverable %}
+  {% set _classes = _classes|merge(['table-hover']) %}
+{% endif %}
+{% if _alignment is not empty %}
+  {% set _classes = _classes|merge(['align-' ~ _alignment]) %}
+{% endif %}
+{% if _variant is not empty %}
+  {% set _classes = _classes|merge(['table-' ~ _variant]) %}
+{% endif %}
+{% if _small %}
+  {% set _classes = _classes|merge(['table-sm']) %}
+{% endif %}
+{% if _border is not empty %}
+  {% set _classes = _classes|merge(['table-bordered', 'border-' ~ _border]) %}
+{% endif %}
+{% if _borderless %}
+  {% set _classes = _classes|merge(['table-borderless']) %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(_classes) %}
+
+{% if _table_responsive is not empty %}
+  {% set _responsive_class = 'table-responsive' %}
+  {% if _table_responsive != 'all' %}
+    {% set _responsive_class = _responsive_class ~ '-' ~ _table_responsive %}
+  {% endif %}
+  <div class="{{ _responsive_class }}">
+{% endif %}
+
+<table
+  {{ attributes }}
+>
+{%- if _caption is not empty -%}
+  <caption
+    {% if _caption_top %}
+    class="caption-top"
+    {% endif %}
+  >
+    {{- _caption -}}
+  </caption>
+{%- endif -%}
+{% if _table_head is not empty %}
+  <thead>
+  {% if _table_head.cells is not empty and _table_head.cells is iterable %}
+    <tr>
+    {% for _cell in _table_head.cells %}
+      <td
+      {% if _cell.col_span is not empty %}
+        colspan={{ _cell.col_span }}
+      {% endif %}
+      >
+        {{- _cell.content -}}
+      </td>
+    {% endfor %}
+    </tr>
+  {% endif %}
+  </thead>
+{% endif %}
+
+{% if _rows is not empty and _rows is iterable %}
+<tbody>
+  {% for _row in _rows %}
+    {% set _row_class = '' %}
+    {% if _row.active %}
+      {% set _row_class = 'table-active' %}
+    {% endif %}
+    {% if _row.alignment is not empty %}
+      {% if _row_class is not empty %}
+        {% set _row_class = _row_class ~ ' align-' ~ _row.alignment %}
+      {% else %}
+        {% set _row_class = 'align-' ~ _row.alignment %}
+      {% endif %}
+    {% endif %}
+    {% if _row.variant is not empty %}
+      {% if _row_class is not empty %}
+        {% set _row_class = _row_class ~ ' table-' ~ _row.variant %}
+      {% else %}
+        {% set _row_class = 'table-' ~ _row.variant %}
+      {% endif %}
+    {% endif %}
+    <tr
+    {% if _row_class is not empty %}
+    class="{{ _row_class }}"
+    {% endif %}
+    >
+    {% if _row.cells is defined and _row.cells is not empty and _row.cells is iterable %}
+      {% for _cell in _row.cells %}
+        <td
+        {% if _cell.col_span is defined and _cell.col_span is not empty %}
+          colspan={{ _cell.col_span }}
+        {% endif %}
+        >
+          {{- _cell.content -}}
+        </td>
+      {% endfor %}
+    {% endif %}
+    </tr>
+  {% endfor %}
+</tbody>
+{% endif %}
+
+{% if _table_footer is not empty %}
+  <tfoot>
+  {% if _table_footer.cells is not empty and _table_footer.cells is iterable %}
+    <tr>
+    {% for _cell in _table_footer.cells %}
+      <td
+      {% if _cell.col_span is not empty %}
+        colspan={{ _cell.col_span }}
+      {% endif %}
+      >
+        {{- _cell.content -}}
+      </td>
+    {% endfor %}
+    </tr>
+  {% endif %}
+  </tfoot>
+{% endif %}
+</table>
+
+{% if _table_responsive is not empty %}
+  </div>
+{% endif %}
+
+{% endapply %}

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

@@ -0,0 +1,149 @@
+{% apply spaceless %}
+
+{#
+  Parameters:
+  - id (string) (default: '')
+  - label (string) (default: '')
+  - required (boolean) (default: false)
+  - disabled (boolean) (default: false)
+  - readonly (boolean) (default: false)
+  - invalid (boolean) (default: false)
+  - valid (boolean) (default: false)
+  - invalid_feedback (string) (default: '')
+  - valid_feedback (string) (default: '')
+  - helper_text (string) (default: '')
+  - helper_text_id (string) (default: '')
+  - hidden_label (boolean) (default: false)
+  - text (string) (default: '')
+  - rows (int) (default: 4)
+  - floating (boolean) (default: false)
+  - horizontal (boolean) (default: false)
+  - horizontal_class (string) (default: col-sm-10)
+  - horizontal_label_class (string) (default: col-sm-2)
+  - attributes (drupal attrs)
+#}
+
+{% set _id = id|default('') %}
+{% set _label = label|default('') %}
+{% set _required = required ?? false %}
+{% set _disabled = disabled ?? false %}
+{% set _readonly = readonly ?? false %}
+{% set _invalid = invalid ?? false %}
+{% set _valid = valid ?? false %}
+{% set _invalid_feedback = invalid_feedback|default('') %}
+{% set _valid_feedback = valid_feedback|default('') %}
+{% set _helper_text = helper_text|default('') %}
+{% set _helper_text_id = helper_text_id|default('') %}
+{% set _hidden_label = hidden_label ?? false %}
+{% set _text = text|default('') %}
+{% set _rows = rows|default('4') %}
+{% set _floating = floating ?? false %}
+{% set _horizontal = horizontal ?? false %}
+{% set _horizontal_class = horizontal_class|default('col-sm-10') %}
+{% set _horizontal_label_class = horizontal_label_class|default('col-sm-2') %}
+
+{% set _label_block = false %}
+{% set _label_class = 'form-label' %}
+{% set _classes = ['form-control'] %}
+
+{% if _invalid is not empty %}
+  {% set _classes = _classes|merge(['is-invalid']) %}
+{% endif %}
+{% if _valid is not empty %}
+  {% set _classes = _classes|merge(['is-valid']) %}
+{% endif %}
+{% set _placeholder = placeholder|default('') %}
+{% if _horizontal %}
+  {% set _label_class = 'col-form-label ' ~ _horizontal_label_class %}
+{% endif %}
+{% if _hidden_label %}
+  {% set _label_class = _label_class ~ ' visually-hidden' %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(_classes).setAttribute('rows', _rows) %}
+
+{% if _id %}
+  {% set attributes = attributes.setAttribute('id', _id) %}
+{% endif %}
+
+{% if _required %}
+  {% set attributes = attributes.setAttribute('required', true) %}
+{% endif %}
+
+{% if _disabled %}
+  {% set attributes = attributes.setAttribute('disabled', true) %}
+{% endif %}
+
+{% if _readonly %}
+  {% set attributes = attributes.setAttribute('readonly', true) %}
+{% endif %}
+
+{% if _placeholder is not empty %}
+  {% set attributes = attributes.setAttribute('placeholder', _placeholder) %}
+{% endif %}
+
+{% if _helper_text_id is not empty %}
+  {% set attributes = attributes.setAttribute('aria-describedby', _helper_text_id) %}
+{% endif %}
+
+{% if _floating or _horizontal %}
+{% set _wrapper_class = _floating ? 'form-floating' : 'row' %}
+<div class="{{ _wrapper_class }}">
+{% endif %}
+{% if _label is not empty %}
+  {% set _label_block %}
+    <label
+    {% if _id %}
+      for="{{ _id|e('html_attr') }}"
+    {% endif %}
+      class="{{ _label_class }}"
+    >
+      {{- label -}}
+    </label>
+  {% endset %}
+{% endif %}
+
+{% if _label_block and _floating == false %}
+  {{ _label_block|raw }}
+{% endif %}
+{% if _horizontal and floating == false %}
+<div class="{{ _horizontal_class }}">
+{% endif %}
+  <textarea
+    {{ attributes }}
+  >
+  {{- _text -}}
+  </textarea>
+{% if _horizontal and floating == false %}
+</div>
+{% endif %}
+{% if _label_block and _floating %}
+  {{ _label_block|raw }}
+{% endif %}
+{% if _invalid_feedback is not empty %}
+  <div class="invalid-feedback">
+    {{- _invalid_feedback -}}
+  </div>
+{% endif %}
+{% if _valid_feedback is not empty %}
+  <div class="valid-feedback">
+    {{- _valid_feedback -}}
+  </div>
+{% endif %}
+{% if _helper_text is not empty %}
+  <div
+    class="form-text"
+  {%- if _helper_text_id is not empty -%}
+    id="{{ _helper_text_id }}"
+  {%- endif -%}>
+    {{- _helper_text -}}
+  </div>
+{% endif %}
+{% if _floating or _horizontal %}
+</div>
+{% endif %}
+{% endapply %}

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

@@ -0,0 +1,34 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - id (string) (default: '')
+  - label (string) (default: '')
+  - title (string) (default: '')
+  - content (string) (default: '')
+#}
+
+{% set _id = id|default('') %}
+{% set _label = label|default('') %}
+{% set _title = title|default('') %}
+{% set _content = content|default('') %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% if _id is not empty %}
+  {% set attributes = attributes.setAttribute('id', _id) %}
+{% endif %}
+
+<li
+  {{ attributes }}>
+  <p class="fs-5 mb-1 fw-medium">{{ _label }}</p>
+  {% if _title is not empty %}
+  <p class="fs-6 mb-1 fw-medium">{{ _title }}</p>
+  {% endif %}
+  {% if _content is not empty %}
+  <div>{{ _content }}</div>
+  {% endif %}
+</li>
+
+{% endapply %}

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

@@ -0,0 +1,115 @@
+{% apply spaceless %}
+
+{#
+Parameters:
+  - id: (integer) (default: random(1000))
+  - title: (string) (default: '')
+  - title_tag: (string) (default: 'h2')
+  - title_link: (link object) (default: {})
+  - title_attributes (drupal attrs)
+  - toggle_collapsed: (string) (default: '')
+  - toggle_expanded: (string) (default: '')
+  - items (array) (default: []): [
+    {
+      id: (string) (default: '')
+      label: (string) (default: '')
+      title: (string) (default: '')
+      content: (block) (default: '')
+    }
+  ]
+  - hide: (object)
+    format: {
+      from (integer) (default: items.length)
+      to (integer) (default: items.length)
+    }
+  - icon_path (string) (default: ''): file containing the svg icons
+#}
+
+{% set _id = id|default(random(1000)) %}
+{% 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 _toggle_collapsed = toggle_collapsed|default('') %}
+{% set _toggle_expanded = toggle_expanded|default('') %}
+{% set _items = items|default([]) %}
+{% set _hide_from = hide.from|default(items|length) %}
+{% set _hide_to = hide.to|default(items|length) %}
+{% set _icon_path = icon_path|default('') %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass('bcl-timeline') %}
+
+{# Internal logic - Process properties #}
+
+{% set _display_amount = items|length %}
+{% set _hide_amount = 0 %}
+{% set _bottom_amount = 0 %}
+
+{% if _hide_from > 0 %}
+  {% if _hide_to > 0 %}
+    {% set _bottom_amount = _display_amount - _hide_to %}
+  {% else %}
+    {% set _bottom_amount = _hide_to|abs %}
+  {% endif %}
+  {% set _countbase = items|length - _bottom_amount %}
+  {% set _display_amount = _hide_from %}
+  {% set _hide_amount = _countbase - _display_amount %}
+  {% set _toggle_collapsed = _toggle_collapsed|replace({'%d': _hide_amount}) %}
+  {% set _toggle_expanded = _toggle_expanded|replace({'%d': _hide_amount}) %}
+{% 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 %}
+
+{# Print the result #}
+<ol {{ attributes }}>
+  {% if _items is not empty %}
+    {% for _item in _items %}
+      {# Decide on per item if it should display. #}
+      {% if _item.attributes is empty %}
+        {% set _item = _item|merge({
+          attributes: create_attribute()
+        }) %}
+      {% endif %}
+      {% if loop.index > _display_amount and loop.revindex > _bottom_amount %}
+        {% set _item = _item|merge({
+          attributes: _item.attributes.addClass('collapse',  'collapse-' ~ _id)
+        }) %}
+      {% endif %}
+      {% include '@oe-bcl/bcl-timeline/timeline-item.html.twig' with _item only %}
+      {# Display the show more button if required. #}
+      {% if (_hide_amount > 0 and loop.revindex == _bottom_amount + 1) or (_hide_amount > 0 and _hide_to == 0 and loop.revindex == 1) %}
+        <li class="bcl-timeline__item--toggle">
+          <button
+            aria-expanded="false"
+            data-bs-toggle="collapse"
+            data-bs-target=".collapse-{{ _id }}"
+            class="btn btn-light btn-md"
+            type="button"
+          >
+            <span class="label-collapsed">{{ _toggle_collapsed }}</span>
+            <span class="label-expanded">{{ _toggle_expanded }}</span>
+            {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
+              name: 'chevron-down',
+              size: 'fluid',
+              path: _icon_path,
+              attributes: create_attribute().addClass('ms-2-5'),
+            } only %}
+          </button>
+        </li>
+      {% endif %}
+    {% endfor %}
+  {% endif %}
+</ol>
+
+{% endapply %}

package/templates/bcl-toast/toasts.html.twig

@@ -0,0 +1,123 @@
+{% apply spaceless %}
+
+{#
+  Parameters:
+  - with_wrapper (boolean) (default: false)
+  - wrapper_classes (string) (default: '')
+  - wrapper_aria_live (string) (default: '')
+  - with_container (boolean) (default: false)
+  - container_classes (string) (default: '')
+  - toasts (object[]) format: [
+    {
+      - body (string) (default: '')
+      - role (string) (default: 'alert')
+      - with_close (boolean) (default: true)
+      - autohide (boolean) (default: false)
+      - with_body_wrapper (boolean) (default: false)
+      - body_wrapper_classes (string) (default: '')
+      - attributes (drupal object) (default: undefined)
+    }
+  ]
+  - attributes (drupal attrs)
+#}
+
+{% set _with_wrapper = with_wrapper ?? false %}
+{% set _wrapper_classes = wrapper_classes|default('') %}
+{% set _wrapper_aria_live = wrapper_aria_live|default('') %}
+{% set _with_container = with_container ?? false %}
+{% set _toasts = toasts|default([]) %}
+
+{% set _container_classes = 'toast-container' %}
+
+{% if container_classes %}
+  {% set _container_classes = _container_classes ~ ' ' ~ container_classes %}
+{% endif %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{# wrapper #}
+{% if _with_wrapper %}
+  {% set attributes = attributes.setAttribute('aria-atomic', "true") %}
+  {% if _wrapper_aria_live %}
+    {% set attributes = attributes.setAttribute('aria-live', _wrapper_aria_live) %}
+  {% endif %}
+  {% if _wrapper_classes %}
+    {% set attributes = attributes.addClass(_wrapper_classes|split(' ')) %}
+  {% endif %}
+
+<div {{ attributes }}>
+
+{% endif %}
+{# container #}
+{% if _with_container %}
+  <div class="{{ _container_classes }}">
+{% endif %}
+{# toasts #}
+{% if _toasts is not empty %}
+  {% for _toast in _toasts %}
+    {% set _classes = ['toast'] %}
+    {% set _body = _toast.body|default('') %}
+    {% set _role = _toast.role|default('') %}
+    {% set _with_close = _toast.with_close ?? true %}
+    {% set _aria_live = _toast.aria_live|default('') %}
+    {% set _autohide = _toast.autohide ?? true %}
+    {% set _with_body_wrapper = _toast.with_body_wrapper ?? false %}
+    {% set _body_wrapper_classes = _toast.body_wrapper_classes|default('') %}
+    {% set _toast_attributes = _toast.attributes ?: create_attribute() %}
+    {% set _toast_attributes =  _toast_attributes.addClass(_classes).setAttribute('aria-atomic', 'true') %}
+    {% if _aria_live is not empty %}
+      {% set _toast_attributes = _toast_attributes.setAttribute('aria-live', _aria_live) %}
+    {% endif %}
+    {% if _role is not empty %}
+      {% set _toast_attributes = _toast_attributes.setAttribute('role', _role) %}
+    {% endif %}
+    {% if not _autohide %}
+      {% set _toast_attributes = _toast_attributes.setAttribute('data-bs-autohide', 'false') %}
+    {% endif %}
+    <div
+      {{ _toast_attributes }}
+    >
+    {% if _with_close or
+      (_toast.header is defined and _toast.header is not empty)
+    %}
+    <div class="toast-header">
+    {{- _toast.header|default('') -}}
+    {% if _with_close %}
+      {% set button_attributes = create_attribute()
+                                .addClass(['btn-close'])
+                                .setAttribute('aria-label', 'close')
+                                .setAttribute('data-bs-dismiss', 'toast')
+      %}
+      {%- include '@oe-bcl/bcl-button/button.html.twig' with {
+        attributes: button_attributes,
+        clean_class: true
+      } only -%}
+    {% endif %}
+    </div>
+  {% endif %}
+  {% if _with_body_wrapper %}
+    <div
+    {% if _body_wrapper_classes %}
+      class="{{ _body_wrapper_classes }}"
+    {% endif %}
+    >
+  {% endif %}
+    <div class="toast-body">
+      {{- _body -}}
+    </div>
+  {% if _with_body_wrapper %}
+    </div>
+  {% endif %}
+  </div>
+  {% endfor %}
+{% endif %}
+{% if _with_container %}
+  </div>
+{% endif %}
+{% if _with_wrapper %}
+</div>
+{% endif %}
+
+{% endapply %}

package/templates/bcl-user/user-compact.html.twig

@@ -0,0 +1,64 @@
+{% apply spaceless %}
+
+{# Parameters:
+  - picture (object) (default: {})
+    format: {
+    - path (string) (default: '')
+    - alt (string) (default: '')
+    - classes (string) (default: '')
+    }
+  - name (object) (default: {})
+    format: {
+    - text (string) (default: '')
+    - link (string) (default: '')
+    }
+  - infos (string[]) (default: [])
+#}
+
+{% set _picture = picture|default({}) %}
+{% set _name = name|default({}) %}
+{% set _infos = infos|default([]) %}
+
+{% set _picture_classes = 'rounded-pill' %}
+{% set _classes = ['bcl-user-compact', 'd-flex', 'mb-3'] %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(_classes) %}
+
+{% if _picture is not empty and _picture.classes is not empty %}
+  {% set _picture_classes = _picture_classes ~ ' ' ~ _picture.classes %}
+{% endif %}
+
+<div
+  {{ attributes }}
+>
+  <div class="flex-shrink-0">
+    <img
+      class="{{ _picture_classes }}"
+      src="{{ _picture.path }}"
+      alt="{{ _picture.alt }}"
+    >
+  </div>
+  <div class="flex-grow-1 ms-3">
+  {% if _name.link is not empty %}
+    <a href="{{ _name.link }}" class="fs-5 standalone mb-0">{{ _name.text }}</a>
+  {% else %}
+    <p class="fs-5 mb-0 text-primary">{{ _name.text }}</p>
+  {% endif %}
+
+  {% if _infos is not empty %}
+    <div class="d-flex flex-wrap">
+    {% for _info in _infos %}
+      {% if _info is not empty %}
+      <span class="text-muted text-nowrap{{ loop.last ? '' :' me-4-5'}}">{{ _info }}</span>
+      {% endif %}
+    {% endfor %}
+    </div>
+  {% endif %}
+  </div>
+</div>
+
+{% endapply %}

package/templates/bcl-user/user-terms.html.twig

@@ -0,0 +1,11 @@
+{% extends "@oe-bcl/bcl-base-templates/content-type.html.twig" %}
+
+{% block content %}
+  {{ get_dummy_text(4, true) }}
+  <ul class="mb-4-5">
+    <li>{{ get_dummy_text() }}</li>
+    <li>{{ get_dummy_text() }}</li>
+    <li>{{ get_dummy_text() }}</li>
+  </ul>
+  {% include '@oe-bcl/bcl-form/form.html.twig' with terms_form only %}
+{% endblock %}