如何将Styling API中的状态作为自定义可重用ReactSelect的道具发送？

import React from 'react';
import Select from 'react-select';
import { useTheme } from '@emotion/react';

const CustomSelect = ({ state, ...props }) => {
  const theme = useTheme();

  const customStyles = {
    control: (provided, state) => ({
      ...provided,
      backgroundColor: state.isFocused ? theme.colors.primary : theme.colors.secondary,
      borderColor: state.isFocused ? theme.colors.primary : theme.colors.secondary,
      '&:hover': {
        borderColor: state.isFocused ? theme.colors.primary : theme.colors.secondary,
      },
    }),
    // 其他样式属性...
  };

  return <Select styles={customStyles} {...props} />;
};

const App = () => {
  const [selectedOption, setSelectedOption] = useState(null);

  return (
    <div>
      <CustomSelect state={selectedOption} onChange={setSelectedOption} options={options} />
    </div>
  );
};