import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import Icons from "../icons";
import { popupDefaults, Wrapper } from "./styled";
const Popup = (props) => {
    const theme = props.theme
        ? { ...popupDefaults, ...props.theme }
        : popupDefaults;
    const [innerHold, setInnerHold] = React.useState(false);
    const close = React.useCallback(() => {
        if (!innerHold) {
            props.handleClose();
        }
        else {
            setInnerHold(false);
        }
    }, [props.handleClose, innerHold]);
    return (_jsx(Wrapper, { theme: theme, onClick: close, className: `ui-popup__wrapper ${props.className ?? ""}`, children: _jsxs("div", { className: "ui-popup__content", onClick: (e) => e.stopPropagation(), onMouseDown: () => setInnerHold(true), onMouseUp: () => setInnerHold(false), children: [props.children, _jsx("div", { className: "ui-popup__close", onClick: close, children: _jsx(Icons.Cross, { color: theme.closeColor ?? "#ffffff" }) })] }) }));
};
export default Popup;
//# sourceMappingURL=index.js.map