import { jsx as _jsx } from "react/jsx-runtime";
import * as React from 'react';
import { useMount } from "../../gravity-blocks/hooks/index.js";
import loadHubspotScript from "./loadHubspotScript.js";
import { setHubspotDefaultValues } from "./setHubspotDefaultValues.js";
const HubspotFormContainer = React.forwardRef((props, ref) => {
    const { className, formId, formInstanceId, portalId, region, formClassName, createDOMElement, defaultValues, } = props;
    const containerRef = React.useRef(null);
    const hsContainerRef = React.useRef();
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    React.useImperativeHandle(ref, () => containerRef.current);
    const containerId = formInstanceId
        ? `hubspot-form-${formId}-${formInstanceId}`
        : `hubspot-form-${formId}`;
    const createForm = () => {
        if (containerRef.current && !hsContainerRef.current && createDOMElement) {
            hsContainerRef.current = document.createElement('div');
            containerRef.current.id = '';
            hsContainerRef.current.id = containerId;
            containerRef.current.appendChild(hsContainerRef.current);
        }
        if (!createDOMElement || hsContainerRef.current) {
            if (window.hbspt) {
                window.hbspt.forms.create({
                    region,
                    portalId,
                    formId,
                    target: `#${containerId}`,
                    cssClass: formClassName,
                    formInstanceId,
                    onFormReady: defaultValues
                        ? (form) => setHubspotDefaultValues(form, defaultValues)
                        : undefined,
                });
            }
        }
    };
    useMount(() => {
        (async () => {
            if (!window.hbspt) {
                await loadHubspotScript();
            }
            createForm();
        })();
        return () => {
            if (createDOMElement && containerRef.current && containerRef.current.lastChild) {
                containerRef.current.removeChild(containerRef.current.lastChild);
            }
        };
    });
    return _jsx("div", { className: className, id: containerId, ref: containerRef });
});
HubspotFormContainer.displayName = 'HubspotFormContainer';
export default HubspotFormContainer;
//# sourceMappingURL=HubspotFormContainer.js.map
