Best practice in using document.createElement() in Preact?

Question

So my use case is that I am using Preact and TypeScript, and I want to add OpenSeadragon to my application and I want to use Overlays feature of it.

Currently I am using it like this to add an overlay:

        const overlayElement = document.createElement("div")


        const location = new OpenSeaDragon.Point(0, 0);
        viewer.addOverlay({
            element: overlayElement,
            location: location,
            // placement: OpenSeaDragon.Placement.TOP_LEFT,
            checkResize: false, // Set to true if overlay should resize with viewer
        });

But I wonder if I am doing something wrong with using document.createElement() since it's creating a DOM node outside of the tree.

If I use createElement() from Preact, TypeScript complains about the fact that it's not of type HTMLElement:

Type 'VNode<(ClassAttributes<HTMLElement> & { id: string; }) | null>' is missing the following properties from type 'HTMLElement': accessKey, accessKeyLabel, autocapitalize, dir, and 285 more.ts(2740)

I wonder if it is counted as the best practice going with document.createElement() solution. And if so, is there something that I should be aware of, such as removing the element when the component is unmounted?

Any ideas and suggestions are very appreciated, thanks in advance!