Render form-switch from Tabler

[cavasinf]

@kevinpapst have you ever try to do a switch input from Tabler?

https://preview.tabler.io/form-elements.html

Look's like simple,
we only need to add form-switch class to the current div .form-check.

How it should look:

<label class="form-check form-switch">
   <input class="form-check-input" type="checkbox">
   <span class="form-check-label">Can connect</span>
</label>

---

What I've tried:

<label class="form-check form-switch">
    {{ form_label(form.canConnect) }}
    {{ form_widget(form.canConnect) }}
    {{ form_errors(form.canConnect) }}
</label>

How it render from twig:

<label class="form-check form-switch">
    <div class="form-check"> <!-- WRONG !!! -->
        <input type="checkbox" class="form-check-input">
        <label class="form-check-label">Can connect</label>
    </div>
</label>

[kevinpapst]

No, haven't tried yet and honestly: form themes are one of the biggest pain points (besides the security system) in Symfony 👿
What happens if you use {{ form_row(form.canConnect, {attr: {class: 'form-switch'}}) }}?

[cavasinf]

Classes added from form_row are inserted inside the <input> class attr. 😞

<div class="form-check">
   <input type="checkbox" class="form-switch form-check-input">
   <label class="form-check-label">label.canConnect</label>
</div>

What is needed to do, is to add it into the div .form-check "container".

[kevinpapst]

Okay, I will setup a form demo page in the demo app, doesn't work otherwise.
We should do the same for all the other changes... I will see what I manage today. Been sick for a week and slowly getting better...

[cavasinf]

What could be nice,
is to try to replicate the form demo page from Tabler.io: https://preview.tabler.io/form-elements.html

But with our macro and twig blocks.

[cavasinf]

Been sick for a week

Covid ?

[kevinpapst]

Don't wanna know ... all I know is: small children bring home every available virus out there.

[kevinpapst]

The solution is deep hidden in the Symfony code, sometimes a look into the base code is good:
Check this file: vendor/symfony/twig-bridge/Resources/views/Form/bootstrap_5_layout.html.twig

It already works when you define the switch like that:

            ->add('checkboxSwitch', CheckboxType::class, [
                'required' => false,
                'label_attr' => ['class' => 'checkbox-switch']
            ])

See kevinpapst/TablerBundle-Demo@d0e203c#diff-a03adc7a8da7ae673fbd0fc9d7002fb75ded6663d188b10d25e707b33613aa87R103-R106