Proper formatting of checkbox for bootstrap 5

[codeconsole]

Currently check boxes display horribly. The main issue is with the <f:all tag not having a clean way of passing styling attributes to specific widgets.

This PR allows:

<f:all bean="${propertyName}" class="row" requiredClass="mb-3 required" labelClass="col-sm-2 col-form-label text-sm-end" divClass="col-sm-10" widget-selectDateClass="w-auto form-select d-inline" widget-class="form-control" widget-checkBoxClass="form-check-input align-middle"  widget-invalidClass="is-invalid" />

Specifically

widget-selectDateClass="w-auto form-select d-inline"  widget-checkBoxClass="form-check-input align-middle"

Does 2 things.

1. removes selectDateClass from attrs for other widgets.
2. Allows passing of classes necessary to format check boxes correctly.

Should later be refined via https://github.com/gpc/fields/issues/392

[jdaugherty]

Isn't it a core design goal of fields to move this type of logic into templates?

If you need a default check box, you write a checkbox specific template and read any widget attrs.

This change looks like we're wanting to avoid writing templates and introduce logic directly into the default form generation.

If we're wanting the benefits of fields (pulling constraints & properties from beans) to setup a form tag, we really should split out that logic separate from the template logic. Otherwise, we'll play wack-o-mole on adding attributes.

As this is, I'm not for this change since the defaults are meant to be catch alls, and not specific to a given theme.

[codeconsole]

Isn't it a core design goal of fields to move this type of logic into templates?

If that was the core design goal, why does it have an <f:all tag which is being used heavily by the scaffolding plugin and custom class names would never have been used.

@jdaugherty so what do you propose, leave it broken and poorly formatted? That is the way it currently is.
Or recommend not using Dates or booleans?

Previously it depended on a custom css file. This at least allows the flexibility to keep the old way or use bootstrap 5 without having to depend on custom css.

<~- create -->
<f:all bean="${propertyName}" class="row" requiredClass="mb-3 required" labelClass="col-sm-2 col-form-label text-sm-end" divClass="col-sm-10" widget-class="form-control" widget-invalidClass="is-invalid" />

<~- edit -->
<f:all bean="${propertyName}" class="row" requiredClass="mb-3 required" labelClass="col-sm-2 col-form-label text-sm-end" divClass="col-sm-10" widget-selectDateClass="w-auto form-select d-inline" widget-class="form-control" widget-checkBoxClass="form-check-input align-middle"  widget-invalidClass="is-invalid" />

<-- index -->
<f:table class="scaffold table table-striped table-sm" controller="\${controllerName}" collection="\${${propertyName}List}"/>

<-- show -->
<f:display bean="sample" listClass="container" listItemClass="row mb-3" labelClass="form-label col-sm-3 text-sm-end" valueClass="col-sm-9" />

Currently, I do use templates to make this work, but the default implementation should not require templates and at least render readable.

Also note that this is an intermediate solution with a TODO reference to an open Issue to iteratively refine this. This is just a work around to get things working correctly.

[jdaugherty]

I'll take my feedback to the ticket and will approve as an intermediate solution.