A solution to get filtered options in React Select

custom-select.js

import { useState } from 'react';
import Select, { components } from 'react-select';

export default function CustomSelect() {
  const [filteredOptions, setFilteredOptions] = useState<Options<{ value: string | number; label: string }>>([]);
  const currentFilteredOptions = useRef<Options<{ value: string | number; label: string }>>([]);

  useEffect(() => {
    const newOptions = currentFilteredOptions.current;
    if (JSON.stringify(newOptions) !== JSON.stringify(filteredOptions)) {
      setFilteredOptions(newOptions);
    }
  });
  
  return (
    <Select
      ...
      components={{
        MenuList: CustomMenuList,
      }}
     />
  );
 
  function CustomMenuList(props: any) {
    currentFilteredOptions.current = Array.isArray(props.children)
      ? props.children.map((child: any) => child.props.data)
      : [];
    return <components.MenuList {...props} />;
  }
}