36 lines
828 B
TypeScript
36 lines
828 B
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
|
|
import { createPortal } from 'react-dom';
|
|
|
|
export const IFrame: React.FC<
|
|
React.IframeHTMLAttributes<unknown> & {
|
|
setInnerRef?: (ref: HTMLIFrameElement | undefined) => void;
|
|
appendStyles?: boolean;
|
|
theme?: 'light' | 'dark';
|
|
transparent?: boolean;
|
|
}
|
|
> = ({ children, setInnerRef, appendStyles = true, theme, ...props }) => {
|
|
const [ref, setRef] = useState<HTMLIFrameElement | null>();
|
|
const doc = ref?.contentWindow?.document as Document;
|
|
const mountNode = doc?.body;
|
|
|
|
return (
|
|
<iframe
|
|
{...props}
|
|
ref={(ref) => {
|
|
if (ref) {
|
|
setRef(ref);
|
|
|
|
if (setInnerRef) {
|
|
setInnerRef(ref);
|
|
}
|
|
}
|
|
}}
|
|
>
|
|
{mountNode ? createPortal(children, mountNode) : null}
|
|
</iframe>
|
|
);
|
|
};
|