Error in imageMouseEnterHandler when hovering over image with editable set to false

[riziuzi]

Describe the bug
Whenever I hover over the image in editable: false option, I get error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
To Reproduce

import { BlockNoteView, useBlockNote } from "@blocknote/react";
import React, { useEffect, useRef } from 'react';

const EditorComponent = ({ index, data }) => {
    const sampleData=[
        {
          "id": "initialBlockId",
          "type": "image",
          "props": {
            "backgroundColor": "default",
            "textAlignment": "left",
            "url": "https://unsplash.com/photos/a-woman-working-on-a-laptop-6uAssP0vuPs",
            "caption": "",
            "width": 512
          },
          "children": []
        },
        {
          "id": "1b931231-0e0f-4413-90b7-6642c4561fa7",
          "type": "paragraph",
          "props": {
            "textColor": "default",
            "backgroundColor": "default",
            "textAlignment": "left"
          },
          "content": [],
          "children": []
        }
      ]
const cleanData = transformData(data)
    const editor = useBlockNote({
        editable: false,
        initialContent: sampleData,
        onEditorReady: (editor) =>{ console.log('Editor is ready!', editor)
        },
        onEditorContentChange: (editor) =>
            {
                console.log("Editr Chnaged?")                                              
 editor.topLevelBlocks directly everything works fine
            },
        domAttributes: {
            editor: {
                class: "min-h-[calc(100vh-152px)] w-full"
            },
            blockGroup: {
                class: "border border-blue-500 "
            },
            blockContainer: {
                class: "",
            },
        },
    });

    return(
        <BlockNoteView editor={editor} theme={"dark"} className="flex justify-center text-left w-full border border-red-500 " />
    )

};

Suspect
the file at

./node_modules/@blocknote/core/src/blocks/ImageBlockContent/ImageBlockContent.ts

having the code:

  // Shows the resize handles when hovering over the image with the cursor.
  const imageMouseEnterHandler = () => {
    if (editor.isEditable) {
      imageWrapper.appendChild(leftResizeHandle);        // This was where the error was squiggled : Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
      imageWrapper.appendChild(rightResizeHandle);
    } else {
      imageWrapper.removeChild(leftResizeHandle);
      imageWrapper.removeChild(rightResizeHandle);
    }
  };

is showing the issue
Misc

• Node version: v18.16.1
• Package manager: npm
• Browser: Brave
• I'm a sponsor and would appreciate if you could look into this sooner than later 💖