import { jsx as _jsx } from "react/jsx-runtime";
import { Popup } from '@gravity-ui/uikit';
import { block } from "../../../../utils/index.js";
import { NavigationLayout } from "../../models.js";
import NavigationItem from "../NavigationItem/index.js";
import './NavigationPopup.css';
const b = block('navigation-popup');
const OFFSET_RESET = { mainAxis: 0, crossAxis: 0 };
export const NavigationPopup = ({ anchorRef, items, onClose, open }) => {
    // Opening and closing is controlled by the associated button,
    // but in order to give the popup control over closing as well (e.g. on click outside or escape key press)
    // there needs to be an awkward looking handler like this.
    const onOpenChange = (isOpen) => {
        if (!isOpen) {
            onClose();
        }
    };
    return (_jsx(Popup, { className: b(), 
        // Workaround to recalculate position on every opening. Required for valid position calculation for scrolled header links.
        anchorElement: anchorRef.current, open: open, onOpenChange: onOpenChange, keepMounted: true, strategy: "fixed", placement: "bottom-start", offset: OFFSET_RESET, children: _jsx("ul", { className: b('list'), children: items.map((item) => (_jsx(NavigationItem, { className: b('link'), data: item, menuLayout: NavigationLayout.Dropdown }, item.text))) }) }));
};
export default NavigationPopup;
//# sourceMappingURL=NavigationPopup.js.map
