"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MarkupEditorComponent = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const MarkupEditorComponent = function MarkupEditorComponent({ editor, autofocus, className, children }) {
    const ref = (0, react_1.useRef)(null);
    // insert editor to dom
    (0, react_1.useLayoutEffect)(() => {
        const domElem = editor.markupEditor.cm.dom;
        if (ref.current) {
            ref.current.appendChild(domElem);
        }
        return () => {
            domElem.remove();
        };
    }, [editor.markupEditor]);
    // update editor after connecting to dom
    (0, react_1.useEffect)(() => {
        editor.markupEditor.cm.requestMeasure();
        if (autofocus) {
            editor.markupEditor.focus();
        }
    }, [editor.markupEditor]);
    return (
    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
    (0, jsx_runtime_1.jsx)("div", { ref: ref, className: className, onClick: (event) => {
            const target = event.target;
            if (target instanceof Element && target.classList.contains('cm-editor')) {
                editor.markupEditor.focus();
            }
        }, children: children }));
};
exports.MarkupEditorComponent = MarkupEditorComponent;
//# sourceMappingURL=MarkupEditorComponent.js.map
