Navbar

HTML

<x-navbar brand="Micro UI"></x-navbar>

JavaScript

const navItems = [
    {label: 'Navbar', type: 'link', href: 'navbar.html'},
    {label: 'Dialog', type: 'link', href: 'dialog.html'},
    {label: 'Overlay', type: 'link', href: 'overlay.html'},
    {label: 'Spinner', type: 'link', href: 'spinner.html'},
    {label: 'Snackbar', type: 'link', href: 'snackbar.html'},
    {label: 'Menu', type: 'link', href: 'menu.html'},
    {label: 'Aside', type: 'link', href: 'aside.html'},
    {label: 'Tabs', type: 'link', href: 'tabs.html'},
    {label: 'Table', type: 'link', href: 'table.html'},
    {label: 'Button', type: 'link', href: 'button.html'},
    {label: 'Form', type: 'link', href: 'form.html'}
];
document.addEventListener("DOMContentLoaded", () => {
    const navbar = document.querySelector('x-navbar');
    navbar.setNavItems(navItems);
    navbar.setActive(0);
});