javascript - React-quill-new upgrades to react 18, toolbar list menus closes themselves on opening them - Stack Overflow

I have a problem on upgrading the quill editor using react-quill-new, them menus closes themselves on click and below is my code. please help me what to do

import ReactQuill from 'react-quill-new';

import 'react-quill-new/dist/quill.snow.css';

export const QuillEditor = (props: any) => { const { description, setDescription } = props;

// toolbar options for quill editor
const toolbarOptions = [
    [{ 'size': ['small', false, 'large', 'huge'] }],
    [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
    [{ 'font': [] }],
    [{ 'list': 'ordered' }, { 'list': 'bullet' }],
    [{ 'script': 'sub' }, { 'script': 'super' }],
    [{ 'direction': 'rtl' }],
    [{ 'color': [] }, { 'background': [] }],
    [{ 'align': [] }],
    ['bold', 'italic', 'underline', 'strike'],
    ['blockquote', 'code-block'],
    ['link', 'image', 'video', 'formula'],
    ['clean'],
];
return <ReactQuill
    theme="snow"
    id="description"
    value={description}
    placeholder="Start typing here..."
    onChange={setDescription}
    modules={{
        toolbar: toolbarOptions,
        history: {          
            delay: 2500,
            userOnly: true
        },
    }

    }
/>

}

Any help will be appreaciated.