import * as React from 'react';
export type LiveTypedProps={formId:string;title?:string;baseUrl?:string;style?:React.CSSProperties;onSubmitted?:(result:{formId:string;submissionId:string})=>void};
export function LiveTyped({formId,title='Contact form',baseUrl='https://livetyped.com',style,onSubmitted}:LiveTypedProps){
 const frame=React.useRef<HTMLIFrameElement>(null),[height,setHeight]=React.useState(520),origin=new URL(baseUrl).origin;
 React.useEffect(()=>{const receive=(e:MessageEvent)=>{if(e.origin!==origin||e.source!==frame.current?.contentWindow||e.data?.formId!==formId)return;if(e.data.type==='livetyped:resize'&&Number.isFinite(e.data.height))setHeight(Math.max(200,Math.min(2400,e.data.height)));if(e.data.type==='livetyped:submitted')onSubmitted?.({formId,submissionId:e.data.submissionId});};window.addEventListener('message',receive);return()=>window.removeEventListener('message',receive);},[formId,origin,onSubmitted]);
 return <iframe ref={frame} title={title} src={`${origin}/f/${encodeURIComponent(formId)}`} allow="microphone" loading="lazy" style={{width:'100%',height,border:0,display:'block',...style}}/>;
}
export default LiveTyped;
