[TwigComponent][Docs] Fix outerblock markup example

[tobiasberge]

Q	A
Bug fix?	yes
New feature?	no
Issues	See below...
License	MIT

I was following the guide for nested UX components and inheritance. Really cool stuff. 👍

Inheritance & Forwarding "Outer Blocks"

I was confused about this code example that re-uses the alert component and "passes through" the content text from the SuccessAlert component usage:

{# templates/components/SuccessAlert.html.twig #}
<twig:Alert type="success">
{% component Alert with {type: 'success'} %}
    {{ block(outerBlocks.content) }}
</twig:Alert>

Is it really supposed to be two nested alert components? Because this throws an error because of the missing {% endcomponent %} tag.

Should it be either this...

{# templates/components/SuccessAlert.html.twig #}
<twig:Alert type="success">
    {{ block(outerBlocks.content) }}
</twig:Alert>

or this syntax?

{# templates/components/SuccessAlert.html.twig #}
{% component Alert with {type: 'success'} %}
    {{ block(outerBlocks.content) }}
{% endcomponent %}

[smnandre]

Thank you @tobiasberge!

[smnandre]

Is it really supposed to be two nested alert components?

With your fix it's more logic :)

[Kocal]

Thank you @tobiasberge.