I want to bring the options I selected to the top of the dropdown in react js multi select

Question

Here is my select code:

          <Select
                isMulti
                isSearchable
                controlShouldRenderValue={false}
                hideSelectedOptions={false}
                value={props.selectedHtmlOptions}
                styles={{
                  control: (base, state) => ({
                    ...base,
                    zIndex: 10,
                  }),
                }}
                closeMenuOnSelect={false}
                options={props.events.map(function (item) {
                  return { value: item, label: item };
                })}
                onChange={(value, context) => {
                    props.setSelectedHtmlOptions(value);


                }}
              />

And here is my function:

const getEventsStrings = () => {
    if (selectedHtmlOptions.length <= 25) {
      setWarningTable('none');
      const eventsStringArray = [];
      for (let i = 0; i < selectedHtmlOptions.length; i++) {
        eventsStringArray.push(selectedHtmlOptions[i].value);
      }
      setSelectedEvents(eventsStringArray);
      setShowBtnEffect(false);
    } else {
      toast.error("You can't select more than 25 events", {
        position: 'top-right',
        autoClose: 5000,
        hideProgressBar: false,
        closeOnClick: true,
        pauseOnHover: true,
        draggable: true,
        progress: undefined,
      });
      setShowBtnEffect(false);
    }
  };

If the selected ones are less than 25, the data is reflected in the table. What I want is for the options I selected in the dropdown section to come to the top.