var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
/*
This file is part of the Notesnook project (https://notesnook.com/)

Copyright (C) 2023 Streetwriters (Private) Limited

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/
import { useEffect } from "react";
import { Box } from "@theme-ui/components";
import { PopupPresenter } from "@notesnook/ui";
import { getPopupContainer, getPopupRoot, getToolbarElement, unmountPopupRoot } from "../../toolbar/utils/dom";
import { useIsMobile, useToolbarStore } from "../../toolbar/stores/toolbar-store";
import { ResponsivePresenter } from "../responsive";
export function PopupWrapper(props) {
    const { id, position, children, autoCloseOnUnmount } = props, presenterProps = __rest(props, ["id", "position", "children", "autoCloseOnUnmount"]);
    const { closePopup, isPopupOpen } = usePopupHandler(props);
    const isMobile = useIsMobile();
    useEffect(() => {
        if (!autoCloseOnUnmount)
            return;
        return () => {
            closePopup(id);
        };
    }, [autoCloseOnUnmount, id, closePopup]);
    return (_jsx(PopupPresenter, Object.assign({ onClose: () => closePopup(id), position: position, blocking: true, focusOnRender: true, className: isMobile ? "editor-mobile-toolbar-popup" : undefined, isMobile: isMobile, container: getPopupContainer() }, presenterProps, { isOpen: isPopupOpen, children: _jsx(Box, { sx: {
                boxShadow: "menu",
                borderRadius: "default",
                overflow: "hidden"
            }, children: children }) }), id));
}
export function usePopupHandler(options) {
    const { isOpen, id, onClosed, group } = options;
    const openedPopups = useToolbarStore((store) => store.openedPopups);
    const openPopup = useToolbarStore((store) => store.openPopup);
    const closePopup = useToolbarStore((store) => store.closePopup);
    const closePopupGroup = useToolbarStore((store) => store.closePopupGroup);
    const isPopupOpen = typeof openedPopups[id] === "object";
    const isPopupDefined = typeof openedPopups[id] !== "undefined";
    useEffect(() => {
        if (isOpen)
            openPopup({ id, group });
        else
            closePopup(id);
    }, [isOpen, closePopup, openPopup, id, group]);
    useEffect(() => {
        // we don't want to close the popup just when it is about to open.
        if (!isPopupOpen && isPopupDefined)
            onClosed === null || onClosed === void 0 ? void 0 : onClosed();
    }, [isPopupOpen, isPopupDefined]);
    useEffect(() => {
        // if another popup in the same group is open, close it.
        if (isPopupOpen) {
            closePopupGroup(group, [id]);
        }
    }, [onClosed, isPopupOpen, closePopupGroup, id, group]);
    return { isPopupOpen, closePopup };
}
export function showPopup(options) {
    const { popup } = options, props = __rest(options, ["popup"]);
    function hide() {
        unmountPopupRoot();
    }
    getPopupRoot().render(_jsx(ResponsivePresenter, Object.assign({ isOpen: true, position: {
            target: getToolbarElement(),
            isTargetAbsolute: true,
            location: "below",
            align: "end",
            yOffset: 10
        }, blocking: true, focusOnRender: true, container: getPopupContainer() }, props, { onClose: () => {
            var _a;
            hide();
            (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
        }, children: popup(hide) })));
    return hide;
}
