@talentsoft-opensource/uxp-themes/dist/scripts/Navbar-horizontal-navigation.js

Talentsoft UX themes

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var NavbarHorizontal = /** @class */ (function () {
    function NavbarHorizontal($navBarElement) {
        var navBarStatus = $navBarElement.querySelector('span.navbar-status');
        var itemsNavbarHorizontal = $navBarElement.querySelectorAll('li');
        if (navBarStatus) {
            navBarStatus.style.transition = 'all .5s';
        }
        Array.prototype.forEach.call(itemsNavbarHorizontal, function ($el) {
            $el.addEventListener('mouseenter', function (event) {
                var position = event.currentTarget.offsetLeft;
                if (navBarStatus) {
                    navBarStatus.style.transform = "translateX(" + position + "px)";
                    navBarStatus.style.width = event.currentTarget.offsetWidth + "px";
                }
            });
            $el.addEventListener('mouseleave', function (event) {
                if (navBarStatus) {
                    var itemIsSelected = $navBarElement.querySelector('.navbar--horizontal--active');
                    if (itemIsSelected) {
                        var position = itemIsSelected.offsetLeft;
                        navBarStatus.style.transform = "translateX(" + position + "px)";
                        navBarStatus.style.width = itemIsSelected.offsetWidth + "px";
                    }
                }
            });
        });
    }
    return NavbarHorizontal;
}());
exports.default = NavbarHorizontal;