import { observable, action } from 'xmobx/mobx';
import { pancakeSidebar } from 'src/views/App/Sidebarz';
const state = observable({
    isMenuVisible: false,
    isMenuDropDownVisible: false,
    isSearchMenuVisible: false,
    isTopHeaderVisible: false,
    setIsMenuVisible: action(setIsMenuVisible),
    setIsMenuDropDownVisible: action(setIsMenuDropDownVisible),
    setIsSearchMenuVisible: action(setIsSearchMenuVisible),
    hide: action(hide),
    show: action(show),
    handleClickBoundary: action(handleClickBoundary),
    handleMenuToggle: action(handleMenuToggle),
    handleShowDepartments: action(handleShowDepartments),
    handleMenuDropDownToggle: action(handleMenuDropDownToggle),
    handleShowMobileMenu: action(handleShowMobileMenu),
    setMenuDropDownVisibility: action(setMenuDropDownVisibility),
});
// should be simpler like @see state/common
// these are actions
// mobile menu...
function setIsMenuVisible(visibility) {
    state.isMenuVisible = visibility;
}
// desktop menu - changes on wr
function setIsMenuDropDownVisible(visibility) {
    state.isMenuDropDownVisible = visibility;
}
// wr only...
function setIsSearchMenuVisible(visibility) {
    state.isSearchMenuVisible = visibility;
}
function hide() {
    if (state.isMenuDropDownVisible) {
        state.isMenuDropDownVisible = false;
    }
}
function show() {
    if (!state.isMenuDropDownVisible) {
        state.isMenuDropDownVisible = true;
    }
}
function handleClickBoundary(event, element) {
    // SKB2B-1340
    const { target } = event;
    const text = target.textContent.toLowerCase();
    if (text !== 'departments') {
        state.hide();
    }
}
function handleMenuToggle() {
    state.isMenuVisible ? state.setIsMenuVisible(false) : state.setIsMenuVisible(true);
    console.log('[Header] handleMenuToggle', state.isMenuVisible);
}
function handleMenuDropDownToggle() {
    if (state.isMenuDropDownVisible) {
        state.hide();
    }
    else {
        state.show();
    }
    console.log('[Header] handleMenuDropDownToggle', state.isMenuDropDownVisible);
}
function handleShowMobileMenu() {
    pancakeSidebar.setIsVisible(!pancakeSidebar.isVisible);
}
/**
 * @todo handle this and handle close here?
 */
function handleShowDepartments() {
    alert('search dropdown');
}
// @note - this was in wr
function setMenuDropDownVisibility() {
    console.debug('[menu] isMenuDropDownVisible');
    state.setIsMenuDropDownVisible(false);
    // state.setIsMenuDropDownVisible(!state.isMenuDropDownVisible)
}
setMenuDropDownVisibility();
export default state;
export { state, handleMenuDropDownToggle, handleShowDepartments, handleShowMobileMenu, handleMenuToggle, };
//# sourceMappingURL=state.js.map