From 915d75bb198be9fca25490d7d8c5146332a5c924 Mon Sep 17 00:00:00 2001
From: 22Alexandra <beldean.ale@gmail.com>
Date: Tue, 27 Feb 2024 12:30:04 +0200
Subject: [PATCH 1/5] EWPP-4137: Cleanup deprecated patterns and fields.

---
 .../src/TwigExtension/TwigExtension.php       |  7 --
 .../banners/banner_hero.ui_patterns.yml       | 75 ------------------
 .../banners/banner_page.ui_patterns.yml       | 64 ---------------
 .../banners/pattern-banner-hero.html.twig     | 62 ---------------
 .../banners/pattern-banner-page.html.twig     | 51 ------------
 .../patterns/button/button.ui_patterns.yml    |  9 ---
 .../file_teaser/file_teaser.ui_patterns.yml   |  4 +-
 .../file_teaser/pattern-file-teaser.html.twig |  2 +-
 .../file_translation.ui_patterns.yml          |  2 +-
 .../list_item/list_item.ui_patterns.yml       | 16 +---
 .../page_header/page_header.ui_patterns.yml   | 21 -----
 ...ial_media_links_horizontal.ui_patterns.yml | 25 ------
 ...ocial_media_links_vertical.ui_patterns.yml | 26 -------
 .../patterns/page_header_rendering.yml        | 13 ----
 tests/src/Kernel/fixtures/rendering.yml       | 78 -------------------
 15 files changed, 5 insertions(+), 450 deletions(-)
 delete mode 100644 templates/patterns/banners/banner_hero.ui_patterns.yml
 delete mode 100644 templates/patterns/banners/banner_page.ui_patterns.yml
 delete mode 100644 templates/patterns/banners/pattern-banner-hero.html.twig
 delete mode 100644 templates/patterns/banners/pattern-banner-page.html.twig
 delete mode 100644 templates/patterns/social_media_links/social_media_links_horizontal.ui_patterns.yml
 delete mode 100644 templates/patterns/social_media_links/social_media_links_vertical.ui_patterns.yml

diff --git a/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php b/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
index a88d892e3..9efdc2887 100644
--- a/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
+++ b/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
@@ -507,13 +507,6 @@ protected function getIconPath(array $context, string $icon): string {
    *   The trimmed output.
    */
   public function smartTrim(Environment $env, $input, $limit = 0) {
-    if ($limit === NULL) {
-      // phpcs:disable Drupal.Semantics.FunctionTriggerError
-      @trigger_error('Using the smart_trim filter with a null limit value is deprecated in oe_theme:3.x and will be removed in oe_theme:4.x releases.', E_USER_DEPRECATED);
-      // phpcs:enable
-      $limit = 0;
-    }
-
     // Bubbles Twig template argument's cacheability & attachment metadata.
     $this->bubbleArgMetadata($input);
     $truncate = new TruncateHTML();
diff --git a/templates/patterns/banners/banner_hero.ui_patterns.yml b/templates/patterns/banners/banner_hero.ui_patterns.yml
deleted file mode 100644
index c9f39c81f..000000000
--- a/templates/patterns/banners/banner_hero.ui_patterns.yml
+++ /dev/null
@@ -1,75 +0,0 @@
-banner_hero:
-  label: "Hero banner (Deprecated in 3.4.0 - Use Banner pattern with size \"l\" instead.)"
-  description: "Hero banner displays a prominent message and related action. It can have an image as background. The pattern will be deprecated in 3.4.0. Use the Banner pattern instead."
-  variants:
-    default:
-      label: "Default"
-      description: "Default contains title, description and link with gray background."
-    primary:
-      label: "Primary"
-      description: "Primary contains title, description and link with blue background."
-    image:
-      label: "Image"
-      description: "Image contains title, description and link with a background image."
-    image_shade:
-      label: "Image shade"
-      description: "Image shade contains title, description and link with a shade effect on the background image."
-  fields:
-    title:
-      type: "text"
-      label: "Title"
-      description: "Banner title."
-      preview: "EU Budget for the future"
-    description:
-      type: "text"
-      label: "Description"
-      description: "Banner description."
-      preview: "The European Commission has put forward ambitious yet realistic proposals for a modern EU budget. It is time for an EU budget that reflects rapid developments in innovation, the economy, the environment and geopolitics, amongst others."
-    url:
-      type: "Url"
-      label: "URL"
-      description: "Banner link url."
-      preview: "http://example.com"
-    label:
-      type: "text"
-      label: "Link text"
-      description: "Banner link text."
-      preview: "Subscribe"
-    image:
-      type: "array"
-      label: "Image"
-      description: "Banner image."
-      preview:
-        src: "https://loremflickr.com/1000/500/arch"
-    alignment:
-      type: "text"
-      label: "Alignment"
-      description: "The Hero banner can be 'center' or 'left' (aligned left)."
-      preview: "left"
-    banner_type:
-      type: "text"
-      label: "Type (deprecated)"
-      description: "The Hero Banner type, it can be one of 'default','image','image-shade','primary'. Deprecated, use the Variant instead."
-      preview:
-    centered:
-      type: "boolean"
-      label: "Centered (deprecated)"
-      description: "Define if banner should be centered. Deprecated, use the Alignment field instead."
-      preview:
-      escape: false
-    full_width:
-      type: "boolean"
-      label: "Full width"
-      description: "Define if the banner should be extended to full width."
-      preview: true
-      escape: false
-    external_link:
-      type: "boolean"
-      label: "External link"
-      description: "Whether the banner link is external or not."
-      preview: false
-    credit:
-      type: "text"
-      label: "Credit"
-      description: "Credit for the image."
-      preview: "© Copyright or credit"
diff --git a/templates/patterns/banners/banner_page.ui_patterns.yml b/templates/patterns/banners/banner_page.ui_patterns.yml
deleted file mode 100644
index 05ff7b0b0..000000000
--- a/templates/patterns/banners/banner_page.ui_patterns.yml
+++ /dev/null
@@ -1,64 +0,0 @@
-banner_page:
-  label: "Page banner (Deprecated in 3.4.0 - Use Banner pattern with size \"m\" instead.)"
-  description: "A page banner is smaller than a Hero banner. The pattern will be deprecated in 3.4.0. Use the Banner pattern instead."
-  variants:
-    default:
-      label: "Default"
-      description: "Default contains title, description and link with gray background."
-    primary:
-      label: "Primary"
-      description: "Primary contains title, description and link with blue background."
-    image:
-      label: "Image"
-      description: "Image contains title, description and link with a background image."
-    image_shade:
-      label: "Image shade"
-      description: "Image shade contains title, description and link with a shade effect on the background image."
-  fields:
-    title:
-      type: "text"
-      label: "Title"
-      description: "Banner title."
-      preview: "EU Budget for the future"
-    description:
-      type: "text"
-      label: "Description"
-      description: "Banner description."
-      preview: "The European Commission has put forward ambitious yet realistic proposals for a modern EU budget. It is time for an EU budget that reflects rapid developments in innovation, the economy, the environment and geopolitics, amongst others."
-    url:
-      type: "Url"
-      label: "URL"
-      description: "Banner link url."
-      preview: "http://example.com"
-    label:
-      type: "text"
-      label: "Link text"
-      description: "Banner link text."
-      preview: "Subscribe"
-    image:
-      type: "array"
-      label: "Image"
-      description: "Banner image."
-      preview:
-        src: "https://loremflickr.com/1000/500/arch"
-    alignment:
-      type: "text"
-      label: "Alignment"
-      description: "The Page banner can be 'center' or 'left' (aligned left)."
-      preview: "left"
-    full_width:
-      type: "boolean"
-      label: "Full width"
-      description: "Define if the banner should be extended to full width."
-      preview: true
-      escape: false
-    external_link:
-      type: "boolean"
-      label: "External link"
-      description: "Whether the banner link is external or not."
-      preview: true
-    credit:
-      type: "text"
-      label: "Credit"
-      description: "Credit for the image."
-      preview: "© Copyright or credit"
diff --git a/templates/patterns/banners/pattern-banner-hero.html.twig b/templates/patterns/banners/pattern-banner-hero.html.twig
deleted file mode 100644
index c0fd0ee7d..000000000
--- a/templates/patterns/banners/pattern-banner-hero.html.twig
+++ /dev/null
@@ -1,62 +0,0 @@
-{#
-/**
- * @file
- * Hero banner.
- */
-#}
-
-{% if url is not empty and label is not empty %}
-  {% set _link = {
-    'link': {
-      'path': url,
-      'label': label,
-      'icon_position': 'after'
-    },
-    'icon': {
-      'path': ecl_icon_path,
-      'name': external_link ? "external" : "corner-arrow",
-      'transform': external_link ? "" : "rotate-90",
-      'size': "xs"
-    }
-  } -%}
-{% endif %}
-
-{% set _centered = alignment == 'center' %}
-{% if alignment is null and centered is not empty %}
-  {% set _centered = centered %}
-{% endif -%}
-
-{% if banner_type is not empty %}
-  {% set _variant = banner_type %}
-{% endif %}
-{% if _variant is empty %}
-  {% set _variant = variant %}
-{% endif %}
-{% if 'shade' in _variant %}
-  {% set _variant = 'image-shade' %}
-{% endif %}
-
-{% set _picture = [] %}
-{% if image.src is not empty %}
-  {% set _picture = {
-    img: {
-      src: image.src|default(''),
-      alt: image.alt|default(''),
-    }
-  } %}
-{% endif %}
-
-<div{{ container_attributes }}>
-  {% include '@ecl-twig/banner' with {
-    title: title,
-    description: description,
-    link: _link,
-    picture: _picture,
-    size: 'l',
-    variant: _variant,
-    centered: _centered,
-    full_width: full_width,
-    credit: credit|default('')
-  } only %}
-
-</div>
diff --git a/templates/patterns/banners/pattern-banner-page.html.twig b/templates/patterns/banners/pattern-banner-page.html.twig
deleted file mode 100644
index 435328cad..000000000
--- a/templates/patterns/banners/pattern-banner-page.html.twig
+++ /dev/null
@@ -1,51 +0,0 @@
-{#
-/**
- * @file
- * Page banner.
- */
-#}
-
-{% if url is not empty and label is not empty %}
-  {% set _link = {
-    'link': {
-      'path': url,
-      'label': label,
-      'icon_position': 'after'
-    },
-    'icon': {
-      'path': ecl_icon_path,
-      'name': external_link ? "external" : "corner-arrow",
-      'transform': external_link ? "" : "rotate-90",
-      'size': "xs"
-    }
-  } -%}
-{% endif %}
-
-{% set _variant = variant %}
-{% if 'shade' in _variant %}
-  {% set _variant = 'image-shade' %}
-{% endif %}
-
-{% set _picture = [] %}
-{% if image.src is not empty %}
-  {% set _picture = {
-    img: {
-      src: image.src|default(''),
-      alt: image.alt|default(''),
-    }
-  } %}
-{% endif %}
-
-<div{{ container_attributes }}>
-  {% include '@ecl-twig/banner' with {
-    title: title,
-    description: description,
-    link: _link,
-    picture: _picture,
-    size: 'm',
-    variant: _variant,
-    centered: alignment == 'center',
-    full_width: full_width,
-    credit: credit|default('')
-  } only %}
-</div>
diff --git a/templates/patterns/button/button.ui_patterns.yml b/templates/patterns/button/button.ui_patterns.yml
index 8a6d0ce49..6d9281658 100644
--- a/templates/patterns/button/button.ui_patterns.yml
+++ b/templates/patterns/button/button.ui_patterns.yml
@@ -20,15 +20,6 @@ button:
     search:
       label: "Search"
       description: "Search button."
-    form:
-      label: "Form (deprecated)"
-      description: "The form buttons are used to confirm a choice or send information. This was deprecated in ECL 2.x."
-    form_primary:
-      label: "Form primary (deprecated)"
-      description: "The form buttons are used to confirm a choice or send information. This was deprecated in ECL 2.x."
-    splash_page:
-      label: "Splash page (deprecated)"
-      description: "Special buttons used on the site's splash page. This was deprecated in ECL 2.x."
   fields:
     type_attribute:
       type: "text"
diff --git a/templates/patterns/file_teaser/file_teaser.ui_patterns.yml b/templates/patterns/file_teaser/file_teaser.ui_patterns.yml
index caaeb1526..fce4d820a 100644
--- a/templates/patterns/file_teaser/file_teaser.ui_patterns.yml
+++ b/templates/patterns/file_teaser/file_teaser.ui_patterns.yml
@@ -43,7 +43,7 @@ file_teaser:
     translations:
       type: "array"
       label: "Files"
-      description: "List of teaser (teaser is deprecated - to be removed in 4.x) text/FileValueObject pairs, respectively keyed with 'teaser' and 'file'."
+      description: "List of teaser (teaser is deprecated - to be removed in 5.x) text/FileValueObject pairs, respectively keyed with 'teaser' and 'file'."
       preview:
         - teaser: "Morbi fringilla turpis augue, et interdum ipsum egestas sed. Proin tristique, ante id aliquet malesuada, lorem dolor vulputate magna, a commodo purus ante nec massa."
           file:
@@ -97,7 +97,7 @@ file_teaser:
               external_link: TRUE
     more_info:
       type: "text"
-      label: "More information (deprecated - to be removed in 4.x)"
+      label: "More information (deprecated - to be removed in 5.x)"
       description: "Informative text about the available translations."
       preview: "Looking for another language which is not on the list? Find out why."
     length:
diff --git a/templates/patterns/file_teaser/pattern-file-teaser.html.twig b/templates/patterns/file_teaser/pattern-file-teaser.html.twig
index 00857bec7..f208d8e30 100644
--- a/templates/patterns/file_teaser/pattern-file-teaser.html.twig
+++ b/templates/patterns/file_teaser/pattern-file-teaser.html.twig
@@ -12,7 +12,7 @@
   {% if item.file.size %}
     {% set _translation_meta = '(' ~ item.file.size|format_size ~ ' - ' ~ item.file.extension|upper  ~ ')' %}
   {% endif %}
-  {# 'lang_full' parameter is deprecated in ECL v4 - to be removed in 4.x of
+  {# 'lang_full' parameter is deprecated in ECL v4 - to be removed in 5.x of
     oe_theme too. #}
   {% set _translations = _translations|merge([{
     'title': item.file.title,
diff --git a/templates/patterns/file_translation/file_translation.ui_patterns.yml b/templates/patterns/file_translation/file_translation.ui_patterns.yml
index ad7a69e9a..c4867fd5a 100644
--- a/templates/patterns/file_translation/file_translation.ui_patterns.yml
+++ b/templates/patterns/file_translation/file_translation.ui_patterns.yml
@@ -50,7 +50,7 @@ file_translation:
       preview: "Other languages"
     more_info:
       type: "text"
-      label: "More information (deprecated - to be removed in 4.x)"
+      label: "More information (deprecated - to be removed in 5.x)"
       description: "Informative text about the available translations."
       preview: "Looking for another language which is not on the list? Find out why."
     publication_date:
diff --git a/templates/patterns/list_item/list_item.ui_patterns.yml b/templates/patterns/list_item/list_item.ui_patterns.yml
index f1560b9dd..290a963f2 100644
--- a/templates/patterns/list_item/list_item.ui_patterns.yml
+++ b/templates/patterns/list_item/list_item.ui_patterns.yml
@@ -54,20 +54,6 @@ list_item:
       description: "Used to trim the length of the 'Detail' field (optional)."
       preview: 250
       escape: false
-    additional_information:
-      type: array
-      label: "Additional information (deprecated)"
-      description: "Additional information to be displayed right below the 'Detail' field. Make sure you pass an array of renderable items. This field is not displayed on the following variants: 'navigation', 'block' and 'highlight'. Deprecated, use the lists parameter instead."
-      preview:
-        - '#type': pattern
-          '#id': field_list
-          '#variant': horizontal
-          '#fields':
-            items:
-              - label: "When"
-                body: "Thursday 15 November, 08:00 AM to Friday 16 November"
-              - label: "Where"
-                body: "The EGG, Rue Barra 175, 1070 Brussels, Belgium"
     meta:
       type: "array"
       label: "Metadata"
@@ -108,7 +94,7 @@ list_item:
       preview: "left"
     icon:
       type: "text"
-      label: "Icon (deprecated - to be removed in 4.x)"
+      label: "Icon (deprecated - to be removed in 5.x)"
       description: "An optional icon to be used with the link."
       preview: "list"
     badges:
diff --git a/templates/patterns/page_header/page_header.ui_patterns.yml b/templates/patterns/page_header/page_header.ui_patterns.yml
index e97ecb85b..a68c3807b 100644
--- a/templates/patterns/page_header/page_header.ui_patterns.yml
+++ b/templates/patterns/page_header/page_header.ui_patterns.yml
@@ -27,27 +27,6 @@ page_header:
         - "News article"
         - "6 July 2015"
         - "Brussels"
-    language_switcher:
-      type: "array"
-      label: "Language switcher (Deprecated)"
-      description: "The language selector offers the alternative language versions of the page’s main content. This has been deprecated in ECL V3."
-      preview:
-        current: "French"
-        unavailable: "English"
-        is_primary: true
-        options:
-          - href: "#"
-            hreflang: "it"
-            label: "Italian"
-            lang: "it"
-          - href: "#"
-            hreflang: "es"
-            label: "Spanish"
-            lang: "es"
-          - href: "#"
-            hreflang: "de"
-            label: "German"
-            lang: "de"
     breadcrumb:
       type: "array"
       label: "Breadcrumb"
diff --git a/templates/patterns/social_media_links/social_media_links_horizontal.ui_patterns.yml b/templates/patterns/social_media_links/social_media_links_horizontal.ui_patterns.yml
deleted file mode 100644
index f111c2aaa..000000000
--- a/templates/patterns/social_media_links/social_media_links_horizontal.ui_patterns.yml
+++ /dev/null
@@ -1,25 +0,0 @@
-social_media_links_horizontal:
-  label: "Social media links: horizontal (Deprecated)"
-  description: "Social network icon with link of label, displayed horizontally."
-  fields:
-    title:
-      type: "text"
-      label: "Title"
-      description: "Social media block title."
-      preview: "View European Commission on:"
-    links:
-      type: "array"
-      label: "Social links"
-      description: "List of social links."
-      preview:
-        - service: "facebook"
-          label: "Facebook"
-          url: "#"
-        - service: "twitter"
-          label: "Twitter"
-          url: "#"
-        - service: "instagram"
-          label: "Instagram"
-          url: "#"
-  additional:
-    hidden: true
diff --git a/templates/patterns/social_media_links/social_media_links_vertical.ui_patterns.yml b/templates/patterns/social_media_links/social_media_links_vertical.ui_patterns.yml
deleted file mode 100644
index 4c111adb4..000000000
--- a/templates/patterns/social_media_links/social_media_links_vertical.ui_patterns.yml
+++ /dev/null
@@ -1,26 +0,0 @@
-social_media_links_vertical:
-  label: "Social media links: vertical (Deprecated)"
-  description: "Social network icon with link of label."
-  fields:
-    title:
-      type: "text"
-      label: "Title"
-      description: "Social media block title."
-      preview: "View European Commission on:"
-    links:
-      type: "array"
-      label: "Social links"
-      description: "List of social links."
-      preview:
-        - service: "facebook"
-          label: "Facebook"
-          url: "#"
-        - service: "twitter"
-          label: "Twitter"
-          url: "#"
-        - service: "instagram"
-          label: "Instagram"
-          url: "#"
-  additional:
-    style: "max-width: 400px"
-    hidden: true
diff --git a/tests/src/Kernel/fixtures/patterns/page_header_rendering.yml b/tests/src/Kernel/fixtures/patterns/page_header_rendering.yml
index 362ea3c98..088c6a9d2 100644
--- a/tests/src/Kernel/fixtures/patterns/page_header_rendering.yml
+++ b/tests/src/Kernel/fixtures/patterns/page_header_rendering.yml
@@ -257,19 +257,6 @@
         - "News article>"
         - "6 July 2015&"
         - "Brussels<"
-      language_switcher:
-        current: "French"
-        unavailable: "English"
-        is_primary: true
-        options:
-          - href: "#"
-            hreflang: "es"
-            label: "Spanish"
-            lang: "es"
-          - href: "#"
-            hreflang: "it"
-            label: "Italian"
-            lang: "it"
       hide_title: true
   assertions:
     count:
diff --git a/tests/src/Kernel/fixtures/rendering.yml b/tests/src/Kernel/fixtures/rendering.yml
index 1eb69c83e..cd160c119 100644
--- a/tests/src/Kernel/fixtures/rendering.yml
+++ b/tests/src/Kernel/fixtures/rendering.yml
@@ -2227,84 +2227,6 @@
   assertions:
     equals:
       'button.ecl-button--call': "Button label"
-- array:
-    '#type': pattern
-    '#id': button
-    '#variant': form
-    '#fields':
-      label: "Button label"
-  assertions:
-    equals:
-      'button.ecl-button--form': "Button label"
-- array:
-    '#type': pattern
-    '#id': button
-    '#variant': form_primary
-    '#fields':
-      label: "Button label"
-  assertions:
-    equals:
-      'button.ecl-button--form-primary': "Button label"
-- array:
-    '#type': pattern
-    '#id': button
-    '#variant': splash_page
-    '#fields':
-      label: "Button label"
-  assertions:
-    equals:
-      'button.ecl-button--splash-page': "Button label"
-- array:
-    '#type': pattern
-    '#id': social_media_links_vertical
-    '#fields':
-      title: "View European Commission on:"
-      links:
-        - service: "facebook"
-          label: "Facebook"
-          url: "http://facebook.com"
-        - service: "twitter"
-          label: "Twitter"
-          url: "http://twitter.com"
-        - service: "instagram"
-          label: "Instagram"
-          url: "http://instagram.com"
-  assertions:
-    count:
-      'a.ecl-social-media-follow__link[href="http://facebook.com"]': 1
-      'a.ecl-social-media-follow__link[href="http://instagram.com"]': 1
-      'a.ecl-social-media-follow__link[href="http://twitter.com"]': 1
-    equals:
-      '.ecl-social-media-follow--vertical > p.ecl-social-media-follow__description': "View European Commission on:"
-      'a.ecl-social-media-follow__link[href="http://facebook.com"] span': "Facebook"
-      'a.ecl-social-media-follow__link[href="http://twitter.com"] span': "Twitter"
-      'a.ecl-social-media-follow__link[href="http://instagram.com"] span': "Instagram"
-- array:
-    '#type': pattern
-    '#id': social_media_links_horizontal
-    '#fields':
-      title: "View European Commission on:"
-      links:
-        - service: "facebook"
-          label: "Facebook"
-          url: "http://facebook.com"
-        - service: "twitter"
-          label: "Twitter"
-          url: "http://twitter.com"
-        - service: "instagram"
-          label: "Instagram"
-          url: "http://instagram.com"
-  assertions:
-    assertions:
-      count:
-        'a.ecl-social-media-follow__link[href="http://facebook.com"]': 1
-        'a.ecl-social-media-follow__link[href="http://instagram.com"]': 1
-        'a.ecl-social-media-follow__link[href="http://twitter.com"]': 1
-      equals:
-        '.ecl-social-media-follow > p.ecl-social-media-follow__description': "View European Commission on:"
-        'a.ecl-social-media-follow__link[href="http://facebook.com"] span': "Facebook"
-        'a.ecl-social-media-follow__link[href="http://twitter.com"] span': "Twitter"
-        'a.ecl-social-media-follow__link[href="http://instagram.com"] span': "Instagram"
 - array:
     '#type': pattern
     '#id': social_icon

From 8d737d25e451efee27ec5a0d7ca02355e375085d Mon Sep 17 00:00:00 2001
From: 22Alexandra <beldean.ale@gmail.com>
Date: Tue, 27 Feb 2024 12:32:15 +0200
Subject: [PATCH 2/5] EWPP-4137: Add README entry for updating to 4.0.0.

---
 README.md | 40 +++++++++++++++++++++++++++++++++++++++-
 1 file changed, 39 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index d19973195..1fe198a73 100644
--- a/README.md
+++ b/README.md
@@ -3,7 +3,7 @@
 [![Build Status](https://drone.fpfis.eu/api/badges/openeuropa/oe_theme/status.svg?branch=master)](https://drone.fpfis.eu/openeuropa/oe_theme)
 [![Packagist](https://img.shields.io/packagist/v/openeuropa/oe_theme.svg)](https://packagist.org/packages/openeuropa/oe_theme)
 
-Drupal 8 and 9 theme based on the [Europa Component Library][1] (ECL).
+Drupal 10 theme based on the [Europa Component Library][1] (ECL).
 
 **Table of contents:**
 
@@ -111,6 +111,44 @@ Each component library can use one of the following ECL brandings:
 
 To learn more about EC/EU families and ECL branding visit the [ECL website](https://ec.europa.eu/component-library).
 
+### Upgrade to 4.0.0
+
+#### The following patterns have been removed:
+  - `banner_hero`
+  - `banner_page`
+  - `social_media_links_horizontal`
+  - `social_media_links_vertical`
+
+#### The following variants of the button pattern have been removed:
+  - `form`
+  - `form_primary`
+  - `splash_page`
+
+The `language_switcher` field of the `page_header` pattern has been removed.
+The `additional_information` field of the `list_item` pattern has been removed.
+The `text_highlight` and `image_overlay` variants fo the `banner` pattern have been replaced by a single variant
+`text_overlay`.
+
+#### Two ECL components have been replaced:
+- Message component (`twig-component-message`) replaced by Notification component (`twig-component-notification`)
+- Language list component (`twig-component-language-list`) replaced by Splash page (`twig-component-splash-page`)
+
+#### Colors
+In order to accommodate the color changes in ECL 4.0.0 we have added two twig functions to determine the correct color
+for border and background based on the component library (European Union or European Commission):
+- `ecl_class_border_color`
+- `ecl_class_background_color`
+The grey color used in typography case has been replaced with dark.
+
+#### New patterns
+- Highlighted list pattern (`highlighted_list`) - used for displaying a main highlighted item along with 3
+secondary items placed on the right side of the page. All the items are using the `list_item` pattern's structure
+with `default`.
+- Tabs pattern (`tabs`) - used mainly for navigation links. We are using this to render the Drupal local tasks.
+
+#### Content display changes
+All the teaser templates are using the vertical variant for displaying the lists.
+
 ### Upgrade to 3.0.0
 
 #### Page header pattern

From e75b1e93f99ce7faab8c2bb280c97d4c18bda11d Mon Sep 17 00:00:00 2001
From: 22Alexandra <beldean.ale@gmail.com>
Date: Tue, 27 Feb 2024 14:40:29 +0200
Subject: [PATCH 3/5] EWPP-4137: Ensure smart_trim has always a limit value
 set.

---
 .../oe_theme_helper/tests/src/Kernel/TwigExtensionTest.php  | 4 ++--
 .../patterns/featured_item/pattern-featured-item.html.twig  | 6 ++++--
 .../patterns/file_teaser/pattern-file-teaser.html.twig      | 6 ++++--
 .../list_item/pattern-list-item--variant-block.html.twig    | 3 ++-
 .../pattern-list-item--variant-highlight.html.twig          | 3 ++-
 templates/patterns/list_item/pattern-list-item.html.twig    | 4 +++-
 6 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/modules/oe_theme_helper/tests/src/Kernel/TwigExtensionTest.php b/modules/oe_theme_helper/tests/src/Kernel/TwigExtensionTest.php
index 85fce99e5..6bbf2f0dd 100644
--- a/modules/oe_theme_helper/tests/src/Kernel/TwigExtensionTest.php
+++ b/modules/oe_theme_helper/tests/src/Kernel/TwigExtensionTest.php
@@ -107,7 +107,7 @@ public function smartTrimFilterDataProvider(): array {
       ],
       'Do not trim a string if length is NULL' => [
         'variables' => [
-          'length' => NULL,
+          'length' => 0,
           'content' => 'This is a very long text that is not going to be trimmed.',
         ],
         'assertions' => [
@@ -168,7 +168,7 @@ public function smartTrimFilterDataProvider(): array {
       ],
       'Do not trim a plain_text render array when length is NULL' => [
         'variables' => [
-          'length' => NULL,
+          'length' => 0,
           'content' => [
             '#plain_text' => 'This is a very long text that is not going to be trimmed.',
           ],
diff --git a/templates/patterns/featured_item/pattern-featured-item.html.twig b/templates/patterns/featured_item/pattern-featured-item.html.twig
index 736674cc8..a378927b0 100644
--- a/templates/patterns/featured_item/pattern-featured-item.html.twig
+++ b/templates/patterns/featured_item/pattern-featured-item.html.twig
@@ -4,6 +4,8 @@
  * Featured item pattern.
  */
 #}
+{% set _length = length|default(0) %}
+
 {# Prepare the title as a link or simple string. #}
 {% if link.href is not empty %}
   {% set _title = {
@@ -23,7 +25,7 @@
     {% set _description %}
       {% if description %}
         <p class="ecl-paragraph">
-          {{ description|smart_trim(length) }}
+          {{ description|smart_trim(_length) }}
         </p>
       {% endif %}
       <a href="{{ link.href }}" class="ecl-button ecl-button--call">
@@ -70,7 +72,7 @@
 {% endif %}
 
 {% include '@ecl-twig/card' with {
-  'description': _description|default(description|smart_trim(length)),
+  'description': _description|default(description|smart_trim(_length)),
   'primary_meta': metas,
   'title': _title,
   'secondary_meta': _footer_items,
diff --git a/templates/patterns/file_teaser/pattern-file-teaser.html.twig b/templates/patterns/file_teaser/pattern-file-teaser.html.twig
index f208d8e30..185f3a1ea 100644
--- a/templates/patterns/file_teaser/pattern-file-teaser.html.twig
+++ b/templates/patterns/file_teaser/pattern-file-teaser.html.twig
@@ -5,6 +5,8 @@
  */
 #}
 
+{% set _length = length|default(0) %}
+
 {# Process value objects into ECL compatible array. #}
 {% set _translations = [] %}
 {% for item in translations %}
@@ -16,7 +18,7 @@
     oe_theme too. #}
   {% set _translations = _translations|merge([{
     'title': item.file.title,
-    'description': item.teaser|smart_trim(length),
+    'description': item.teaser|smart_trim(_length),
     'meta': _translation_meta,
     'lang': item.file.language_code|to_internal_language_id,
     'download': {
@@ -100,7 +102,7 @@
 
 {% include '@ecl-twig/file' with {
   'title': file.title,
-  'description': teaser|smart_trim(length),
+  'description': teaser|smart_trim(_length),
   'picture': _picture|default({}),
   'language': file.language_code|to_language,
   'meta': _meta,
diff --git a/templates/patterns/list_item/pattern-list-item--variant-block.html.twig b/templates/patterns/list_item/pattern-list-item--variant-block.html.twig
index c47df0ff6..d8dedad65 100644
--- a/templates/patterns/list_item/pattern-list-item--variant-block.html.twig
+++ b/templates/patterns/list_item/pattern-list-item--variant-block.html.twig
@@ -4,6 +4,7 @@
  * Default implementation for the block list item component.
  */
 #}
+{% set _length = length|default(0) %}
 {# Prepare the title as a link or simple string. #}
 {%- if url %}
   {% set link = {
@@ -29,6 +30,6 @@
 
 {% include '@ecl-twig/card' with {
   title: _title|default([]),
-  description: detail|smart_trim(length),
+  description: detail|smart_trim(_length),
   labels: badges,
 } only %}
diff --git a/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig b/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig
index 23fe60bd5..cc8fa642b 100644
--- a/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig
+++ b/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig
@@ -4,6 +4,7 @@
  * Default implementation for the highlight list item component.
  */
 #}
+{% set _length = length|default(0) %}
 {# Prepare the title as a link or simple string. #}
 {%- if url %}
   {% set _title = {
@@ -34,6 +35,6 @@
 {% include '@ecl-twig/card' with {
   title: _title|default([]),
   picture: picture|default([]),
-  description: detail|smart_trim(length),
+  description: detail|smart_trim(_length),
   labels: badges,
 } only %}
diff --git a/templates/patterns/list_item/pattern-list-item.html.twig b/templates/patterns/list_item/pattern-list-item.html.twig
index 7d45fd1b4..27f5f96fc 100644
--- a/templates/patterns/list_item/pattern-list-item.html.twig
+++ b/templates/patterns/list_item/pattern-list-item.html.twig
@@ -19,6 +19,8 @@
     - "extra_classes" (string) (default: '')
 #}
 
+{% set _length = length|default(0) %}
+
 {# Prepare the picture array. #}
 {% if image %}
   {% set picture = {
@@ -93,7 +95,7 @@
   {% set _title = title %}
 {%- endif -%}
 {% if detail is not empty %}
-  {% set description = detail|smart_trim(length) %}
+  {% set description = detail|smart_trim(_length) %}
 {% endif %}
 
 {# Prepare the lists array. #}

From 7c35fa19bdd328414aa5185b3cf0552101c9fce7 Mon Sep 17 00:00:00 2001
From: 22Alexandra <beldean.ale@gmail.com>
Date: Tue, 27 Feb 2024 15:17:05 +0200
Subject: [PATCH 4/5] EWPP-4137: Update SocialMediaLinksFormatter.

---
 .../Field/FieldFormatter/SocialMediaLinksFormatter.php       | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/modules/oe_theme_helper/src/Plugin/Field/FieldFormatter/SocialMediaLinksFormatter.php b/modules/oe_theme_helper/src/Plugin/Field/FieldFormatter/SocialMediaLinksFormatter.php
index d54fecaf9..d2ab12b69 100755
--- a/modules/oe_theme_helper/src/Plugin/Field/FieldFormatter/SocialMediaLinksFormatter.php
+++ b/modules/oe_theme_helper/src/Plugin/Field/FieldFormatter/SocialMediaLinksFormatter.php
@@ -13,7 +13,7 @@
  * This formatter assumes that link categories will be compatible with
  * media service names used in the "Social media links: horizontal" pattern.
  *
- * @see templates/patterns/social_media_links/social_media_links_horizontal.ui_patterns.yml
+ * @see templates/patterns/social_media_links/social_media_links.ui_patterns.yml
  *
  * @FieldFormatter(
  *   id = "oe_theme_helper_social_media_links_formatter",
@@ -90,7 +90,8 @@ public function viewElements(FieldItemListInterface $items, $langcode) {
 
     $pattern = [
       '#type' => 'pattern',
-      '#id' => 'social_media_links_' . $this->getSetting('variant'),
+      '#id' => 'social_media_links',
+      '#variant' => $this->getSetting('variant'),
       '#fields' => [
         'title' => $this->getSetting('title'),
         'links' => [],

From c1b2d5dd8518d812e5a76e279daf4a410f450152 Mon Sep 17 00:00:00 2001
From: 22Alexandra <beldean.ale@gmail.com>
Date: Wed, 6 Mar 2024 10:41:16 +0200
Subject: [PATCH 5/5] EWPP-4137: Add limit parameter type of smart_trim twig
 filter.

---
 modules/oe_theme_helper/src/TwigExtension/TwigExtension.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php b/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
index 9efdc2887..6dde313c5 100644
--- a/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
+++ b/modules/oe_theme_helper/src/TwigExtension/TwigExtension.php
@@ -506,7 +506,7 @@ protected function getIconPath(array $context, string $icon): string {
    * @return mixed
    *   The trimmed output.
    */
-  public function smartTrim(Environment $env, $input, $limit = 0) {
+  public function smartTrim(Environment $env, $input, int $limit = 0) {
     // Bubbles Twig template argument's cacheability & attachment metadata.
     $this->bubbleArgMetadata($input);
     $truncate = new TruncateHTML();