Add a rich text Twig component

core-bundle/contao/templates/twig/component/_rich_text.html.twig

@@ -0,0 +1,33 @@
+{#
+    This component outputs rich text content, that was typically composed by
+    an editor in the backend using the tinyMCE editor. By default, the content
+    will be output raw and therefore needs to be trusted!
+
+      <div class="rte">
+        <p>Lorem ipsum</p>
+      </div>
+
+    Mandatory variables:
+        @var string text
+
+    Optional variables:
+        @var \Contao\CoreBundle\String\HtmlAttributes attributes
+
+    Note:
+        You can either group all variables in an object named "rich_text" or
+        all directly in the context. Grouping under an object has precedence.
+#}
+
+{% block rich_text_component %}
+    {% set rich_text = rich_text|default(_context) %}
+
+    {% set rich_text_attributes = attrs(rich_text.attributes|default)
+        .addClass('rte')
+        .mergeWith(rich_text_attributes|default)
+    %}
+    <div{% block rich_text_attributes %}{{ rich_text_attributes }}{% endblock %}>
+        {% block rich_text_inner %}
+            {{ rich_text.text|csp_inline_styles|insert_tag|encode_email|raw }}
+        {% endblock %}
+    </div>
+{% endblock %}

core-bundle/contao/templates/twig/content_element/text.html.twig

@@ -1,5 +1,6 @@
 {% extends "@Contao/content_element/_base.html.twig" %}
 {% use "@Contao/component/_figure.html.twig" %}
+{% use "@Contao/component/_rich_text.html.twig" %}
 
 {% set content_layout_attributes = attrs()
     .addClass('media media--' ~ layout, layout and image)
@@ -26,13 +27,7 @@
 
     {# Richtext #}
     {% block text %}
-        {% set text_attributes = attrs()
-            .addClass('rte')
-            .mergeWith(text_attributes|default)
-        %}
-        <div{% block text_attributes %}{{ text_attributes }}{% endblock %}>
-            {{ text|csp_inline_styles|insert_tag|encode_email|raw }}
-        </div>
+        {% with {text, attributes: text_attributes|default} %}{{ block('rich_text_component') }}{% endwith %}
     {% endblock %}
 
     {% if layout == 'below' %}