+ The College of Commissioners held today the first weekly meeting of 2019 which was devoted to discussing the challenges of this new year. Commissioners used the opportunity to take stock and discuss the year ahead, including the European elections in May and other important milestones ahead.
+
+
+
+
+
+
+
+ The European economy is forecast to continue expanding for the seventh year in a row in 2019, with real GDP expected to grow in all EU Member States. As global uncertainties continue to weigh, domestic dynamics are set to support the European economy. Growth is expected to gather pace again next year.
+
+
+
+
+
+
+
+ In the modern global economy trade is essential for growth, jobs and competiveness, and the EU is committed to maintaining an open and rules-based trading system. With the rising threat of protectionism and weakened commitment of large players to global trade governance, the EU must take the lead.
+
+
+
+
+`;
+
+exports[`Accordion renders correctly with a single icon 1`] = `
+
+
+
+
+
+
+
+ The College of Commissioners held today the first weekly meeting of 2019 which was devoted to discussing the challenges of this new year. Commissioners used the opportunity to take stock and discuss the year ahead, including the European elections in May and other important milestones ahead.
+
+
+
+
+
+
+
+ The European economy is forecast to continue expanding for the seventh year in a row in 2019, with real GDP expected to grow in all EU Member States. As global uncertainties continue to weigh, domestic dynamics are set to support the European economy. Growth is expected to gather pace again next year.
+
+
+
+
+
+
+
+ In the modern global economy trade is essential for growth, jobs and competiveness, and the EU is committed to maintaining an open and rules-based trading system. With the rising threat of protectionism and weakened commitment of large players to global trade governance, the EU must take the lead.
+
+
+
+
+`;
+
+exports[`Accordion renders correctly with extra attributes 1`] = `
+
+
+
+
+
+
+
+ The College of Commissioners held today the first weekly meeting of 2019 which was devoted to discussing the challenges of this new year. Commissioners used the opportunity to take stock and discuss the year ahead, including the European elections in May and other important milestones ahead.
+
+
+
+
+
+
+
+ The European economy is forecast to continue expanding for the seventh year in a row in 2019, with real GDP expected to grow in all EU Member States. As global uncertainties continue to weigh, domestic dynamics are set to support the European economy. Growth is expected to gather pace again next year.
+
+
+
+
+
+
+
+ In the modern global economy trade is essential for growth, jobs and competiveness, and the EU is committed to maintaining an open and rules-based trading system. With the rising threat of protectionism and weakened commitment of large players to global trade governance, the EU must take the lead.
+
+
+
+
+`;
+
+exports[`Accordion renders correctly with extra class names 1`] = `
+
+
+
+
+
+
+
+ The College of Commissioners held today the first weekly meeting of 2019 which was devoted to discussing the challenges of this new year. Commissioners used the opportunity to take stock and discuss the year ahead, including the European elections in May and other important milestones ahead.
+
+
+
+
+
+
+
+ The European economy is forecast to continue expanding for the seventh year in a row in 2019, with real GDP expected to grow in all EU Member States. As global uncertainties continue to weigh, domestic dynamics are set to support the European economy. Growth is expected to gather pace again next year.
+
+
+
+
+
+
+
+ In the modern global economy trade is essential for growth, jobs and competiveness, and the EU is committed to maintaining an open and rules-based trading system. With the rising threat of protectionism and weakened commitment of large players to global trade governance, the EU must take the lead.
+
+
+
+
+`;
+
+exports[`Accordion renders correctly with old data 1`] = `
+
+
+
+
+
+
+
+ The College of Commissioners held today the first weekly meeting of 2019 which was devoted to discussing the challenges of this new year. Commissioners used the opportunity to take stock and discuss the year ahead, including the European elections in May and other important milestones ahead.
+
+
+
+
+
+
+
+ The European economy is forecast to continue expanding for the seventh year in a row in 2019, with real GDP expected to grow in all EU Member States. As global uncertainties continue to weigh, domestic dynamics are set to support the European economy. Growth is expected to gather pace again next year.
+
+
+
+
+
+
+
+ In the modern global economy trade is essential for growth, jobs and competiveness, and the EU is committed to maintaining an open and rules-based trading system. With the rising threat of protectionism and weakened commitment of large players to global trade governance, the EU must take the lead.
+
+
+
+
+`;
diff --git a/src/components/accordion/accordion-print.scss b/src/components/accordion/accordion-print.scss
new file mode 100644
index 00000000000..8ef4f4a399f
--- /dev/null
+++ b/src/components/accordion/accordion-print.scss
@@ -0,0 +1,50 @@
+/**
+ * Accordion print
+ * @define accordion
+ */
+
+@use 'sass:map';
+
+// Exposed variables
+$theme: null !default;
+$accordion-print: null !default;
+
+.ecl-accordion__item {
+ margin-top: map.get($theme, 'spacing-print', 'l');
+ page-break-inside: avoid;
+
+ &:first-of-type {
+ margin-top: 0;
+ }
+}
+
+.ecl-accordion__toggle-icon {
+ display: none;
+}
+
+.ecl-accordion__title {
+ font: map.get($accordion-print, 'toggle-font');
+ margin: 0;
+ max-width: var(--max-w);
+ page-break-after: avoid;
+}
+
+.ecl-accordion__toggle {
+ background-color: map.get($accordion-print, 'toggle-background');
+ border-width: 0;
+ color: map.get($accordion-print, 'toggle-color');
+ display: block;
+ padding: 0;
+ text-align: start;
+ width: 100%;
+}
+
+.ecl-accordion__content,
+.ecl-accordion__content[hidden] {
+ color: map.get($accordion-print, 'content-color');
+ display: block;
+ font: map.get($accordion-print, 'content-font');
+ margin-top: map.get($theme, 'spacing-print', 'm');
+ max-width: var(--max-w);
+ page-break-inside: avoid;
+}
diff --git a/src/components/accordion/accordion.html.twig b/src/components/accordion/accordion.html.twig
new file mode 100644
index 00000000000..e97d31fa0af
--- /dev/null
+++ b/src/components/accordion/accordion.html.twig
@@ -0,0 +1,106 @@
+{% apply spaceless %}
+
+{#
+ Parameters:
+ - "items" (array) (default: []): format: [
+ {
+ "id": (string),
+ level: (string),
+ toggle: (predefined structure): see Button component, format: {
+ label: (string),
+ },
+ content: (block),
+ },
+ ...
+ ]
+ - "icon" (array) OR (object) (default: []) Two icons in an array that will be toggled.
+ - "extra_classes" (string) (default: '')
+ - "extra_attributes" (array) (default: []): format: [
+ {
+ "name" (string) (default: ''),
+ "value" (optional) (string)
+ ...
+ ],
+#}
+
+{# Internal properties #}
+
+{% set _css_class = 'ecl-accordion' %}
+{% set _extra_attributes = 'data-ecl-auto-init="Accordion"' %}
+{% set _items = items|default([]) %}
+{% set _icons = icon is iterable and icon|keys is not empty ? icon : [icon] %}
+
+{% if _icons|length == 1 and _icons[0].name == 'plus' %}
+ {% set _icons = _icons|merge([{'name': 'minus', 'path': _icons[0].path}]) %}
+{% endif %}
+
+{# Internal logic - Process properties #}
+
+{% if extra_classes is defined and extra_classes is not empty %}
+ {% set _css_class = _css_class ~ ' ' ~ extra_classes %}
+{% endif %}
+
+{% if extra_attributes is defined and extra_attributes is not empty and extra_attributes is iterable %}
+ {% for attr in extra_attributes %}
+ {% if attr.value is defined %}
+ {% set _extra_attributes = _extra_attributes ~ ' ' ~ attr.name|e('html_attr') ~ '="' ~ attr.value|e('html_attr') ~ '"' %}
+ {% else %}
+ {% set _extra_attributes = _extra_attributes ~ ' ' ~ attr.name|e('html_attr') %}
+ {% endif %}
+ {% endfor %}
+{% endif %}
+
+{# Print the result #}
+
+
+ {% if _items is not empty %}
+ {% for _item in _items %}
+