Tweaked documentation

src/TwigComponent/doc/index.rst

@@ -951,6 +951,11 @@ When overriding the ``alert_message`` block, you have access to the ``message``
         {% endblock %}
     {% endcomponent %}
 
+
+.. versionadded:: 2.12
+
+    The ability to refer to the scope of higher components via the ``outerScope`` variable was added in 2.12.
+
 As mentioned before, variables from lower components are merged with those from upper components. When you need
 access to some properties or functions from higher components, that can be done via the ``outerScope...`` variable:
 
@@ -960,18 +965,15 @@ access to some properties or functions from higher components, that can be done
     {% set name = 'Fabien' %}
     {% set message = 'Hello' %}
     {% component Alert with { type: 'success', name: 'Bart' } %}
-        Hello {{ name }} {# name = Bart #}
+        Hello {{ name }} {# Hello Bart #}
 
-        {{ message }} {{ outerScope.name }} {# message = 'Hello', name = Fabien #}
+        {{ message }} {{ outerScope.name }} {# Hello Fabien #}
 
         {{ outerScope.this.someFunction }} {# this refers to SuccessAlert #}
 
         {{ outerScope.this.someProp }} {# references a "someProp" prop from SuccessAlert #}
     {% endcomponent %}
 
-To keep the generic Alert component unaware of the ``someProp`` prop it is better to use ``outerScope.this``
-instead of passing that info along via Alert's attributes.
-
 You can keep referring to components higher up as well. Just add another ``outerScope``.
 Remember though that the ``outerScope`` reference only starts once you're INSIDE the (embedded) component.
 
@@ -989,10 +991,6 @@ Remember though that the ``outerScope`` reference only starts once you're INSIDE
         {% endblock %}
     {% endcomponent %}
 
-.. versionadded:: 2.12
-
-    The ability to refer to the scope of higher components via the ``outerScope`` variable was added in 2.12.
-
 Component HTML Syntax
 ---------------------