** Uncaught TypeError: Cannot read properties of null (reading 'useState')**

   import { useState } from 'react';
import React from 'react';
import Slider from "react-slick";
import ReactFlagsSelect from 'react-flags-select';
import { FaFacebook } from 'react-icons/fa';


export default function Slide() {
    const [selected, setSelected] = useState('TR');
    const settings = {
        dots: false,
        infinite: true,
        arrows: false,
        speed: 500,
        slidesToShow: 1,
        slidesToScroll: 1
    };
    const flags = {
        US: '+1',
        GB: '+5',
        FR: '+70',
        DE: '+30',
        IT: '+11',
        TR: '+90',
    }
.
.
.
.
<div className="flex gap-x-3">
    <ReactFlagsSelect
       countries={Object.keys(flags)}
       customLabels={flags}
       selected={selected}
      onSelect={code => setSelected(code)}
                            />

and same problem occurs with react-select-flag, i just want to use react select flag with npm???