How to resolve react-select TypeScript error?

Question

import React, { useState } from 'react';
import { Theme } from '@/styles';
import Select, { components, DropdownIndicatorProps, PropsValue } from 'react-select';
import { TbCaretUpDownFilled } from 'react-icons/tb';

const DropdownIndicator = (props: DropdownIndicatorProps<true>) => (
  <components.DropdownIndicator {...props}>
    <TbCaretUpDownFilled />
  </components.DropdownIndicator>
);

type OptionType = {
  value: string;
  label: string;
};

interface MySelectProps {
  label: string;
  options: OptionType[];
}
const selectStyles = {
  control: (styles: any) => ({
    ...styles,
    backgroundColor: 'white',
    borderRadius: '0.375rem',
    
  }),
  option: (styles: any, { isDisabled, isFocused, isSelected }: any) => ({
    ...styles,
    '&:hover': {
      backgroundColor: Theme.colors.brandColor2,
    },
    backgroundColor: isDisabled
      ? null
      : isSelected
      ? Theme.colors.white
      : isFocused
      ? Theme.colors.brandColor1
      : null,
    color: isDisabled
      ? Theme.colors.brandColor1
      : isSelected
      ? Theme.colors.brandColor1
      : Theme.colors.brandColor1,
  }),
  indicatorSeparator: (styles: any) => ({
    ...styles,
    display: 'none',
  }),
};

const MySelect: React.FC<MySelectProps> = ({ label, options }) => {
  const [selectedOption, setSelectedOption] = useState<OptionType | null>(null);

  const handleChange = (option: OptionType | null) => {
    setSelectedOption(option);
  };

  return (
    <div className="mb-4">
      <label className="block text-gray-700 text-sm font-bold mb-2 capitalize" htmlFor="select">
        {label}
      </label>
      <Select
        options={options}
        placeholder="Select"
        id="select"
        styles={selectStyles}
        components={{ DropdownIndicator }}
        value={selectedOption as PropsValue<true> | undefined}
        onChange={(option) => handleChange(option as OptionType | null)}
      />
    </div>
  );
};
export default MySelect;

i got the typescript error from options={options}

Could you please solve this issues ?

Type 'OptionType[]' is not assignable to type 'readonly (true | GroupBase)[]'. Type 'OptionType' is not assignable to type 'true | GroupBase'. Property 'options' is missing in type 'OptionType' but required in type 'GroupBase'.ts(2322) types.d.ts(5, 14): 'options' is declared here. Select.d.ts(184, 5): The expected type comes from property 'options' which is declared here on type 'IntrinsicAttributes & Omit<PublicBaseSelectProps<true, boolean, GroupBase>, StateManagedPropKeys> & Partial<...> & StateManagerAdditionalProps<...> & RefAttributes<...>' (property) options?: OptionsOrGroups<true, GroupBase> | undefined Array of options that populate the select menu