Add a wapper element for all content fields to allow show/hide field using Javascript

[MikeAlhayek]

Is your feature request related to a problem? Please describe.

There is no easy way to hide/show content fields "label and input as a group" using javascript event because there is no wrapper element to select.

Describe the solution you'd like

I think all of the content fields should have a wrapper element to allow the user to easily hide/show the entire field block using javascript.

For example, the TextField will go from looking like this

@{
    var settings = Model.PartFieldDefinition.GetSettings<TextFieldSettings>();
    var culture = await Orchard.GetContentCultureAsync(Model.Field.ContentItem);
}

<div class="mb-3">
    <label asp-for="Text">@Model.PartFieldDefinition.DisplayName()</label>
    <input asp-for="Text" class="form-control content-preview-text" dir="@culture.GetLanguageDirection()" />
    @if (!String.IsNullOrEmpty(settings.Hint))
    {
        <span class="hint">@settings.Hint</span>
    }
</div>

to looking like this

@using OrchardCore.Mvc.Utilities
@{
    var settings = Model.PartFieldDefinition.GetSettings<TextFieldSettings>();
    var culture = await Orchard.GetContentCultureAsync(Model.Field.ContentItem);
    var fieldName = Model.PartFieldDefinition.Name;
}

<div class="mb-3 field-wrapper [email protected]()" id="@Html.IdFor(x => x.Text)_FieldWrapper">
    <label asp-for="Text" class="form-label">@Model.PartFieldDefinition.DisplayName()</label>
    <input asp-for="Text" class="form-control content-preview-text" dir="@culture.GetLanguageDirection()" />
    @if (!String.IsNullOrEmpty(settings.Hint))
    {
        <span class="hint">@settings.Hint</span>
    }
</div>