Добавление класса к выбранным параметрам

Мне нужно работать с выбранным параметром в React-Select, чтобы поставить флажок в строке (и проверить его, когда выбран параметр.

Я могу изменять элементы через SCSS, но в классах нет разницы между выбранным и невыбранным параметром. (это просто еще один класс с, казалось бы, случайным именем. Его css-[random]-option)

Итак, есть ли способ добавить класс, когда выбрана опция?

Вот дизайн, который я должен сделать:

У меня все сделано, но флажок установлен.

Если вы хотите посмотреть код:

const customStyles = {}
return(<div class="SelectContainer">
    <div class="opener" onClick={(e) => {setIsOpen(!isOpen);}}>
        {outputValue ? outputValue : placeholder}
        <Chevron />
    </div>
    {isOpen &&
        <Select 
            onChange={onChangeFunction}
            value={elementValue}
            autoFocus
            backspaceRemovesValue={false}
            controlShouldRenderValue={false}
            hideSelectedOptions={false}
            menuIsOpen
            tabSelectsValue={false}
            noOptionsMessage={()=>{return "Aucun résultat";}}
            placeholder="Rechercher"
            customStyles={customStyles}
            {...rest}
            //style={{width:"100%"}}
        >
            {choices && choices.map((choice) => { 
                return (<option key={choice.val} value={choice.val}>{choice.option}</option>)
            })}
        </Select>
    }
</div>)

.SelectContainer{
    .opener{
      display:flex;
      align-items: center;
      justify-content: space-between;
      padding:0 24px;
      height:72px;
      //border:1px solid #000;
      background:#fff;
    }
    input{
      height:24px;
    }
    [class$="container"]{
      background:#fff;
      //padding:0 24px;
      padding:0;
      [class$="ValueContainer"]{
        
      }
      [class$="control"]{
        border:0;
        position:relative;
        padding-left:30px;
        margin:0 24px;
        &:before{
          content:' ';
          display:block;
          position:absolute;
          top:50%;
          left:0;
          transform:translateX(-0) translateY(-50%);
          width:16px;
          height:16px;
          background:url(../../assets/image/search.svg) center center no-repeat;
          background-size:contain;
        }
        [class$="Input"]{
          width: calc(100% - 50px);
          z-index: 100;
          position: relative;
          
          input{width:100% !important;}
        }
      }
      [class$="IndicatorsContainer"] [class$="indicatorContainer"]:last-child,[class$="IndicatorsContainer"] [class$="indicatorSeparator"]{
        display:none !important;
      }
      [class$="indicatorContainer"]{
        padding:0;
      }
      [class$="menu"]{
        position:relative;
        box-shadow:none;
        [class$="option"]{
          background:none !important;
          color:#000 !important;
          position:relative;
          padding:8px 24px;
          cursor:pointer;
          &:hover{
            background:var(--light) !important;
          }
          &:after{
            width:16px;height:16px;
            display:block;position:absolute;
            content:' ';
            border:2px solid #000;
            position:absolute;
            right:24px;
            top:calc(50% - 8px);
          }
        }
      }
    }
  }