"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.NavigationDropdown = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const components_1 = require("../../../../../../components/index.js");
const utils_1 = require("../../../../../../components/Media/Image/utils.js");
const utils_2 = require("../../../../../../utils/index.js");
const NavigationPopup_1 = tslib_1.__importDefault(require("../../../NavigationPopup/NavigationPopup.js"));
const ContentWrapper_1 = require("../ContentWrapper/ContentWrapper.js");
const b = (0, utils_2.block)('navigation-dropdown');
const TOGGLE_ARROW_SIZE = 12;
const NavigationDropdown = ({ text, icon, className, iconSize, hidePopup, items, isActive, ...props }) => {
    const iconData = icon && (0, utils_1.getMediaImage)(icon);
    const anchorRef = React.useRef(null);
    return ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsxs)("button", { ref: anchorRef, ...props, type: "button", className: b(null, className), "aria-expanded": isActive, children: [(0, jsx_runtime_1.jsx)(ContentWrapper_1.ContentWrapper, { text: text, icon: iconData, iconSize: iconSize, "aria-expanded": isActive }), (0, jsx_runtime_1.jsx)(components_1.ToggleArrow, { className: b('arrow'), size: TOGGLE_ARROW_SIZE, type: 'vertical', iconType: "navigation", open: isActive })] }), (0, jsx_runtime_1.jsx)(NavigationPopup_1.default, { open: isActive, onClose: hidePopup, items: items, anchorRef: anchorRef })] }));
};
exports.NavigationDropdown = NavigationDropdown;
//# sourceMappingURL=NavigationDropdown.js.map
