Duplicate Option Selection Across Optgroups

[benerd]

I have encountered an issue with our tp-multi-select web component when handling options that appear under different optgroups but share the same value. In this scenario, selecting an option with a duplicated value causes all instances of that option to be selected.

Steps to Reproduce

1. Use the following HTML structure:

<tp-multi-select-options>
    <div class="multi-select__group">
        <div class="multi-select__group-heading body-text-ui-small"> MyP Top 10</div>
        <tp-multi-select-option selected="" value="Japan" label="Japan" parent=""> Japan </tp-multi-select-option> 
        <tp-multi-select-option selected="" value="Maldiverna" label="Maldiverna" parent=""> Maldiverna </tp-multi-select-option> 
        <tp-multi-select-option selected="" value="USA" label="USA" parent=""> USA </tp-multi-select-option> 
    </div>
    <div class="multi-select__group">
        <div class="multi-select__group-heading body-text-ui-small"> Asia</div>
        <tp-multi-select-option selected="" value="Japan" label="Japan" parent=""> Japan </tp-multi-select-option>
        <tp-multi-select-option selected="" value="India" label="India" parent=""> India </tp-multi-select-option>
    </div>
 </tp-multi-select-options>

2. Select the "Japan" option from either optgroup.

Expected Behavior
Only the selected instance of the "Japan" option should be highlighted.

Actual Behavior
Selecting the "Japan" option in one optgroup results in both instances of "Japan" in all optgroups being selected.