React Iframe for writing to contentDocument with hook.

CustomIframe.tsx

import { useEffect, useRef } from "react";

export const CustomIframe = ({ html }: { html: string }): JSX.Element => {
    const iframeRef = useRef<HTMLIFrameElement | null>(null);

    // rewrite document when html changed.
    useEffect(() => {
        if (!iframeRef.current) return;
        const doc = iframeRef.current.contentDocument;

        doc.open();
        doc.write(html);
        doc.close();
    }, [html]);

    return <iframe src="about:blank" ref={iframeRef} />;
};

const App = (): JSX.Element => {
    const html = `<h1>Hello Iframe</h1>`;
    return <CustomIframe html={html} />;
};

export default App;