Skip to content

Commit 52b64e1

Browse files
committed
minor #2384 [TwigComponent] Add tip about make:twig-component command (DennisdeBest, Kocal)
This PR was merged into the 2.x branch. Discussion ---------- [TwigComponent] Add tip about `make:twig-component` command Add information on how to use the maker bundle to craete twig components, especially on how to create them in a subdirectory | Q | A | ------------- | --- | Bug fix? | no | New feature? | no Commits ------- 18edb28 [Doc][TwigComponent] Simplify examples, use a tip 16a5bfe Add maker bundle information
2 parents 6008eed + 18edb28 commit 52b64e1

File tree

1 file changed

+20
-10
lines changed

1 file changed

+20
-10
lines changed

src/TwigComponent/doc/index.rst

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,15 @@ and any other components by running:
122122
123123
Take a moment to fist pump - then come back!
124124

125+
.. tip
126+
127+
If you use the `Symfony MakerBundle`_, you can easily create a new component
128+
with the ``make:twig-component`` command:
129+
130+
.. code-block:: terminal
131+
132+
$ php bin/console make:twig-component Alert
133+
125134
.. _naming:
126135

127136
Naming Your Component
@@ -297,22 +306,22 @@ prefix the attribute with ``:`` or use the normal ``{{ }}`` syntax:
297306
// pass object, array, or anything you imagine
298307
<twig:Alert :foo="{col: ['foo', 'oof']}" />
299308

300-
Boolean props are converted using PHP's type juggling rules. The
301-
string ``"false"`` is converted to the boolean ``true``.
309+
Boolean props are converted using PHP's type juggling rules. The
310+
string ``"false"`` is converted to the boolean ``true``.
302311

303-
To pass the boolean ``false``, you can pass a Twig expression
312+
To pass the boolean ``false``, you can pass a Twig expression
304313
``{{ false }}`` or use the dynamic syntax (with the ``:`` prefix):
305314

306315
.. code-block:: html+twig
307316

308-
{# ❌ the string 'false' is converted to the boolean 'true' #}
317+
{# ❌ the string 'false' is converted to the boolean 'true' #}
309318
<twig:Alert message="..." withCloseButton="false" />
310319

311320
{# ✅ use the 'false' boolean value #}
312321
<twig:Alert message="..." withCloseButton="{{ false }}" />
313-
322+
314323
{# ✅ use the dynamic syntax #}
315-
<twig:Alert message="..." :withCloseButton="false" />
324+
<twig:Alert message="..." :withCloseButton="false" />
316325

317326
Don't forget that you can mix and match props with attributes that you
318327
want to render on the root element:
@@ -507,14 +516,14 @@ component use a ``PreMount`` hook::
507516
an error will be prompted, indicating that one or more options do not exist.
508517
To avoid this, use the ``ignoreUndefined()`` method with ``true``.
509518
See `ignore not defined options`_ for more info::
510-
519+
511520
$resolver->setIgnoreUndefined(true);
512-
521+
513522
The major drawback of this configuration is that the OptionsResolver will
514523
remove every non-defined option when resolving data. To maintain props that
515524
have not been defined within the OptionsResolver, combine the data from the
516525
hook with the resolved data::
517-
526+
518527
return $resolver->resolve($data) + $data;
519528

520529
The data returned from ``preMount()`` will be used as the props for mounting.
@@ -691,7 +700,7 @@ You can also add more, named blocks:
691700
</div>
692701

693702
Render these in the normal way.
694-
703+
695704
.. code-block:: html+twig
696705

697706
<twig:Alert type="success">
@@ -1771,3 +1780,4 @@ https://symfony.com/doc/current/contributing/code/bc.html
17711780
.. _`shadcn/ui`: https://ui.shadcn.com
17721781
.. _`tales-from-a-dev/twig-tailwind-extra`: https://github.com/tales-from-a-dev/twig-tailwind-extra
17731782
.. _`ignore not defined options`: https://symfony.com/doc/current/components/options_resolver.html#ignore-not-defined-options
1783+
.. _`Symfony MakerBundle`: https://symfony.com/bundles/SymfonyMakerBundle/current/index.html

0 commit comments

Comments
 (0)