import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useRef } from 'react';
import { Popup } from '@gravity-ui/uikit';
import { cn } from "../../../../classname.js";
import { Link } from "../../../../forms/Link.js";
import { i18n } from "../../../../i18n/widgets/index.js";
import { useElementState } from "../../../../react-utils/index.js";
import "./widget.css";
const b = cn('link-placeholder-widget');
const placement = ['bottom-start', 'top-start', 'bottom-end', 'top-end'];
export const LinkPlaceholderWidget = ({ onCancel, onSubmit, }) => {
    const [anchor, setAnchor] = useElementState();
    const currentUrlRef = useRef('');
    const currentTextRef = useRef('');
    const handleUrlChange = (url) => {
        currentUrlRef.current = url;
    };
    const handleTextChange = (text) => {
        currentTextRef.current = text;
    };
    const handleSubmit = (params) => {
        onSubmit(params);
    };
    const handleOpenChange = (open, _event, reason) => {
        if (open)
            return;
        if (reason === 'escape-key') {
            onCancel();
            return;
        }
        const url = currentUrlRef.current.trim();
        if (url) {
            onSubmit({ url, text: currentTextRef.current });
        }
        else {
            onCancel();
        }
    };
    return (_jsxs(_Fragment, { children: [_jsx("span", { ref: setAnchor, className: b(), children: _jsx("a", { href: "#", children: i18n('link') }) }), _jsx(Popup, { qa: "g-md-link-form", open: true, modal: true, onOpenChange: handleOpenChange, className: b('popup'), anchorElement: anchor, placement: placement, children: _jsx(Link, { autoFocus: true, onSubmit: handleSubmit, onUrlChange: handleUrlChange, onTextChange: handleTextChange }) })] }));
};
//# sourceMappingURL=widget.js.map
