data-allow-clear="true" with .Net 6 with asp-items="ViewBag.ClientRole" does not clear the selection

Dear support!

I am using Metronic 8 with Html theme 8 and .Net 6 to develop my application.

In the SELECT element, I am using data-allow-clear="true" and options are loads from the server and used in HTML as showed below:

a) Instruction in server controller:

ViewData["ClientRole"] = new SelectList(_context.ClientRole.Where(x => x.ClientAccountId.Equals(_clientAccountId)).OrderBy(o => o.Name), "ClientRoleId", "Name");

b) Select element in HTML page:

<div class="col-lg-6 fv-row">
<label asp-for="ClientRoleId" class="required form-label"></label>
<select id="input-client-role-id" asp-for="ClientRoleId" class="form-select" data-control="select2" data-allow-clear="true" asp-items="ViewBag.ClientRole"><option disabled selected>Select an option</option></select>
</div>

When the page is loaded, the disabled option is showed, but if I select some option in the list, I can not clear the selection any more. The behave desired after clicking the "x" button is to clear the selection mad before and the element show the disabled option again.

Thanks