class CustomSidebar extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: 'open' });
this.shadowRoot.innerHTML = `
`;
// Add event listeners for submenus
const submenuButtons = this.shadowRoot.querySelectorAll('button.nav-item');
submenuButtons.forEach(button => {
if (button.nextElementSibling && button.nextElementSibling.classList.contains('submenu')) {
button.addEventListener('click', () => {
const icon = button.querySelector('i:last-child');
const submenu = button.nextElementSibling;
submenu.classList.toggle('open');
icon.classList.toggle('rotate-90');
});
}
});
// Initialize feather icons
feather.replace();
}
}
customElements.define('custom-sidebar', CustomSidebar);