import { jsx as _jsx } from "react/jsx-runtime";
import { filterSuggestionItems, } from "@endexai/blocknote-core";
import { flip, offset, shift, size, } from "@floating-ui/react";
import { useCallback, useMemo } from "react";
import { useBlockNoteEditor } from "../../hooks/useBlockNoteEditor.js";
import { useUIElementPositioning } from "../../hooks/useUIElementPositioning.js";
import { useUIPluginState } from "../../hooks/useUIPluginState.js";
import { SuggestionMenu } from "./SuggestionMenu.js";
import { SuggestionMenuWrapper } from "./SuggestionMenuWrapper.js";
import { getDefaultReactSlashMenuItems } from "./getDefaultReactSlashMenuItems.js";
export function SuggestionMenuController(props) {
    const editor = useBlockNoteEditor();
    const { triggerCharacter, suggestionMenuComponent, minQueryLength, onItemClick, getItems, floatingOptions, } = props;
    const onItemClickOrDefault = useMemo(() => {
        return (onItemClick ||
            ((item) => {
                item.onItemClick(editor);
            }));
    }, [editor, onItemClick]);
    const getItemsOrDefault = useMemo(() => {
        return (getItems ||
            (async (query) => filterSuggestionItems(getDefaultReactSlashMenuItems(editor), query)));
    }, [editor, getItems]);
    const callbacks = {
        closeMenu: editor.suggestionMenus.closeMenu,
        clearQuery: editor.suggestionMenus.clearQuery,
    };
    const cb = useCallback((callback) => {
        return editor.suggestionMenus.onUpdate(triggerCharacter, callback);
    }, [editor.suggestionMenus, triggerCharacter]);
    const state = useUIPluginState(cb);
    const { isMounted, ref, style, getFloatingProps } = useUIElementPositioning(state?.show || false, state?.referencePos || null, 2000, {
        placement: "bottom-start",
        middleware: [
            offset(10),
            // Flips the menu placement to maximize the space available, and prevents
            // the menu from being cut off by the confines of the screen.
            flip({
                mainAxis: true,
                crossAxis: false,
            }),
            shift(),
            size({
                apply({ availableHeight, elements }) {
                    Object.assign(elements.floating.style, {
                        maxHeight: `${availableHeight - 10}px`,
                    });
                },
            }),
        ],
        onOpenChange(open) {
            if (!open) {
                editor.suggestionMenus.closeMenu();
            }
        },
        ...floatingOptions,
    });
    if (!isMounted ||
        !state ||
        (!state?.ignoreQueryLength &&
            minQueryLength &&
            (state.query.startsWith(" ") || state.query.length < minQueryLength))) {
        return null;
    }
    return (_jsx("div", { ref: ref, style: style, ...getFloatingProps(), children: _jsx(SuggestionMenuWrapper, { query: state.query, closeMenu: callbacks.closeMenu, clearQuery: callbacks.clearQuery, getItems: getItemsOrDefault, suggestionMenuComponent: suggestionMenuComponent || SuggestionMenu, onItemClick: onItemClickOrDefault }) }));
}
//# sourceMappingURL=SuggestionMenuController.js.map