@n8d/htwoo-core/dist/js/cjs/htwoo.nav.js

hTWOo is a Fluent Design Framework purely in HTML and CSS

'use strict';

/**
 * Reset the current page indicator for all nav items
 * @param allNavItems - Collection of navigation items
 */
const resetCurrentPage = (allNavItems) => {
    allNavItems.forEach((item) => {
        item.removeAttribute('aria-current');
    });
};
/**
 * Handle navigation item click events
 * @param event - Click event
 */
const handleNavItemClick = (event) => {
    const target = event.target;
    let curClickItem = target;
    // Skip handling for button and icon clicks
    if (!curClickItem.classList.contains('hoo-buttonitem') && !curClickItem.classList.contains('hoo-icon')) {
        const curNavItem = curClickItem.closest('.hoo-navitem');
        if (curNavItem) {
            const curNav = curClickItem.closest('.hoo-nav');
            if (!curNav)
                return;
            const allNavItems = curNav.querySelectorAll('* .hoo-navitem');
            resetCurrentPage(allNavItems);
            curNavItem.setAttribute('aria-current', 'true');
        }
    }
};
/**
 * Handle icon click events for expanding/collapsing submenus
 * @param event - Click event
 */
const handleIconClick = (event) => {
    const target = event.target;
    const curIcon = target;
    const subMenu = curIcon.closest('.hoo-navitem');
    if (!subMenu)
        return;
    if (subMenu.getAttribute('aria-expanded') === 'true') {
        subMenu.setAttribute('aria-expanded', 'false');
    }
    else {
        subMenu.setAttribute('aria-expanded', 'true');
    }
};
/**
 * Initialize menu functionality
 */
const initMenu = () => {
    const navMenus = document.querySelectorAll('.hoo-nav');
    navMenus.forEach(nav => {
        // Add click handlers to navigation items
        const navItems = nav.querySelectorAll('.hoo-navitem');
        navItems.forEach(navItem => {
            navItem.addEventListener('click', handleNavItemClick);
        });
        // Add click handlers to navigation icons
        const navIcons = nav.querySelectorAll('.hoo-buttonicon');
        navIcons.forEach(navIcon => {
            navIcon.addEventListener('click', handleIconClick);
        });
    });
};

exports.initMenu = initMenu;