how to implement .select2 and .multiselect feature at the same time

Question

I want to make UI as in image 1 where user must see multiselect dropdown and can select multiple checkbox emails and also can mark only one email as Primary email id by clicking in right side as shown in the image 1. So basically 2 things are there 1-Can select multiple checkboxes dropdown emails and 2- Can select/Mark any one email as a primary email out of selected checkboxes emails.

Also, User should be able to type and search emails. And if any emails which is not present in the dropdown then he should be able and add it as in image 2.

After that onSubmit i need to fetch all the selected email id and able to seperate Primary email id.

image 1

image 2

i did try with .multiselect jquery but only able to get multiselect dropdown and cannot add primary id selection feature and not able to add any emails which is not present in the dropdown.

Output image link- https://ibb.co/rdcZkVh https://ibb.co/rdcZkVh

$('.share_quote_client_email').multiselect({
  placeholder: 'Select Emails',
  search: true,
  selectAll: true,
});

var options = $('#share_quote_modal_client_container').find('.ms-options').find('li');
if (options.length > 0) {
  options.each(function(index) {
    debugger;
    const htmlContent = '&emsp;&emsp;&emsp;<span class="fa fa-star-o"></span> <a href="#">Mark as Primary</a>';
    const existingLabel = $(this).find('label');
    existingLabel[0].innerHTML += htmlContent;
  });
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<select class="shared_email_textbox spot_quote_email_drop_down share_quote_client_email" multiple>
  <option value="">Select Client</option>
  {% for client in clients %} '
  <option value="{{client.id}}" data-name="{{client.first_name}}" data-company_name="{{client.company_name|default_if_none:''}}" data-mobile_number="{{client.mobile_number|default_if_none:''}}" data-country_id="{{client.country_id}}" data-country_short_name="{{client.country_short_name}}"
    data-client-type="{{client.user_sub_type}}">{{client.email}}</option>
  {% endfor %}
</select>