admin-lte 4.0.0-rc6 → 4.0.0

package/dist/js/adminlte.js

@@ -1,6 +1,6 @@
 /*!
- * AdminLTE v4.0.0-rc6 (https://adminlte.io)
- * Copyright 2014-2025 Colorlib <https://colorlib.com>
+ * AdminLTE v4.0.0 (https://adminlte.io)
+ * Copyright 2014-2026 Colorlib <https://colorlib.com>
  * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
  */
 (function (global, factory) {
@@ -12,7 +12,6 @@
     const domContentLoadedCallbacks = [];
     const onDOMContentLoaded = (callback) => {
         if (document.readyState === 'loading') {
-            // add listener on the first call when the document is in loading state
             if (!domContentLoadedCallbacks.length) {
                 document.addEventListener('DOMContentLoaded', () => {
                     for (const callback of domContentLoadedCallbacks) {
@@ -26,8 +25,11 @@
             callback();
         }
     };
-    /* SLIDE UP */
     const slideUp = (target, duration = 500) => {
+        if (duration <= 1) {
+            target.style.display = 'none';
+            return;
+        }
         target.style.transitionProperty = 'height, margin, padding';
         target.style.transitionDuration = `${duration}ms`;
         target.style.boxSizing = 'border-box';
@@ -52,7 +54,6 @@
             target.style.removeProperty('transition-property');
         }, duration);
     };
-    /* SLIDE DOWN */
     const slideDown = (target, duration = 500) => {
         target.style.removeProperty('display');
         let { display } = globalThis.getComputedStyle(target);
@@ -60,6 +61,9 @@
             display = 'block';
         }
         target.style.display = display;
+        if (duration <= 1) {
+            return;
+        }
         const height = target.offsetHeight;
         target.style.overflow = 'hidden';
         target.style.height = '0';
@@ -85,59 +89,33 @@
         }, duration);
     };
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE layout.ts
-     * @description Layout for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * ------------------------------------------------------------------------
-     * Constants
-     * ------------------------------------------------------------------------
-     */
     const CLASS_NAME_HOLD_TRANSITIONS = 'hold-transition';
     const CLASS_NAME_APP_LOADED = 'app-loaded';
-    /**
-     * Class Definition
-     * ====================================================
-     */
     class Layout {
         _element;
+        _holdTransitionTimer;
         constructor(element) {
             this._element = element;
+            this._holdTransitionTimer = undefined;
         }
-        holdTransition() {
-            let resizeTimer;
-            window.addEventListener('resize', () => {
-                document.body.classList.add(CLASS_NAME_HOLD_TRANSITIONS);
-                clearTimeout(resizeTimer);
-                resizeTimer = setTimeout(() => {
-                    document.body.classList.remove(CLASS_NAME_HOLD_TRANSITIONS);
-                }, 400);
-            });
+        holdTransition(time = 100) {
+            if (this._holdTransitionTimer) {
+                clearTimeout(this._holdTransitionTimer);
+            }
+            document.body.classList.add(CLASS_NAME_HOLD_TRANSITIONS);
+            this._holdTransitionTimer = setTimeout(() => {
+                document.body.classList.remove(CLASS_NAME_HOLD_TRANSITIONS);
+            }, time);
         }
     }
     onDOMContentLoaded(() => {
-        const data = new Layout(document.body);
-        data.holdTransition();
+        const layout = new Layout(document.body);
+        window.addEventListener('resize', () => layout.holdTransition(200));
         setTimeout(() => {
             document.body.classList.add(CLASS_NAME_APP_LOADED);
         }, 400);
     });
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE card-widget.ts
-     * @description Card widget for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * Constants
-     * ====================================================
-     */
     const DATA_KEY$4 = 'lte.card-widget';
     const EVENT_KEY$4 = `.${DATA_KEY$4}`;
     const EVENT_COLLAPSED$2 = `collapsed${EVENT_KEY$4}`;
@@ -180,7 +158,6 @@
             const event = new Event(EVENT_COLLAPSED$2);
             if (this._parent) {
                 this._parent.classList.add(CLASS_NAME_COLLAPSING);
-                // Only target direct children to avoid affecting nested cards
                 const elm = this._parent?.querySelectorAll(`:scope > ${SELECTOR_CARD_BODY}, :scope > ${SELECTOR_CARD_FOOTER}`);
                 elm.forEach(el => {
                     if (el instanceof HTMLElement) {
@@ -200,7 +177,6 @@
             const event = new Event(EVENT_EXPANDED$2);
             if (this._parent) {
                 this._parent.classList.add(CLASS_NAME_EXPANDING);
-                // Only target direct children to avoid affecting nested cards
                 const elm = this._parent?.querySelectorAll(`:scope > ${SELECTOR_CARD_BODY}, :scope > ${SELECTOR_CARD_FOOTER}`);
                 elm.forEach(el => {
                     if (el instanceof HTMLElement) {
@@ -279,11 +255,6 @@
             this.maximize();
         }
     }
-    /**
-     *
-     * Data Api implementation
-     * ====================================================
-     */
     onDOMContentLoaded(() => {
         const collapseBtn = document.querySelectorAll(SELECTOR_DATA_COLLAPSE);
         collapseBtn.forEach(btn => {
@@ -314,26 +285,13 @@
         });
     });
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE treeview.ts
-     * @description Treeview plugin for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * ------------------------------------------------------------------------
-     * Constants
-     * ------------------------------------------------------------------------
-     */
-    // const NAME = 'Treeview'
     const DATA_KEY$3 = 'lte.treeview';
     const EVENT_KEY$3 = `.${DATA_KEY$3}`;
     const EVENT_EXPANDED$1 = `expanded${EVENT_KEY$3}`;
     const EVENT_COLLAPSED$1 = `collapsed${EVENT_KEY$3}`;
     const EVENT_LOAD_DATA_API = `load${EVENT_KEY$3}`;
-    const CLASS_NAME_MENU_OPEN$1 = 'menu-open';
-    const SELECTOR_NAV_ITEM$1 = '.nav-item';
+    const CLASS_NAME_MENU_OPEN = 'menu-open';
+    const SELECTOR_NAV_ITEM = '.nav-item';
     const SELECTOR_NAV_LINK = '.nav-link';
     const SELECTOR_TREEVIEW_MENU = '.nav-treeview';
     const SELECTOR_DATA_TOGGLE$1 = '[data-lte-toggle="treeview"]';
@@ -341,10 +299,6 @@
         animationSpeed: 300,
         accordion: true
     };
-    /**
-     * Class Definition
-     * ====================================================
-     */
     class Treeview {
         _element;
         _config;
@@ -355,10 +309,10 @@
         open() {
             const event = new Event(EVENT_EXPANDED$1);
             if (this._config.accordion) {
-                const openMenuList = this._element.parentElement?.querySelectorAll(`${SELECTOR_NAV_ITEM$1}.${CLASS_NAME_MENU_OPEN$1}`);
+                const openMenuList = this._element.parentElement?.querySelectorAll(`${SELECTOR_NAV_ITEM}.${CLASS_NAME_MENU_OPEN}`);
                 openMenuList?.forEach(openMenu => {
                     if (openMenu !== this._element.parentElement) {
-                        openMenu.classList.remove(CLASS_NAME_MENU_OPEN$1);
+                        openMenu.classList.remove(CLASS_NAME_MENU_OPEN);
                         const childElement = openMenu?.querySelector(SELECTOR_TREEVIEW_MENU);
                         if (childElement) {
                             slideUp(childElement, this._config.animationSpeed);
@@ -366,7 +320,7 @@
                     }
                 });
             }
-            this._element.classList.add(CLASS_NAME_MENU_OPEN$1);
+            this._element.classList.add(CLASS_NAME_MENU_OPEN);
             const childElement = this._element?.querySelector(SELECTOR_TREEVIEW_MENU);
             if (childElement) {
                 slideDown(childElement, this._config.animationSpeed);
@@ -375,7 +329,7 @@
         }
         close() {
             const event = new Event(EVENT_COLLAPSED$1);
-            this._element.classList.remove(CLASS_NAME_MENU_OPEN$1);
+            this._element.classList.remove(CLASS_NAME_MENU_OPEN);
             const childElement = this._element?.querySelector(SELECTOR_TREEVIEW_MENU);
             if (childElement) {
                 slideUp(childElement, this._config.animationSpeed);
@@ -383,7 +337,7 @@
             this._element.dispatchEvent(event);
         }
         toggle() {
-            if (this._element.classList.contains(CLASS_NAME_MENU_OPEN$1)) {
+            if (this._element.classList.contains(CLASS_NAME_MENU_OPEN)) {
                 this.close();
             }
             else {
@@ -391,13 +345,8 @@
             }
         }
     }
-    /**
-     * ------------------------------------------------------------------------
-     * Data Api implementation
-     * ------------------------------------------------------------------------
-     */
     onDOMContentLoaded(() => {
-        const openMenuItems = document.querySelectorAll(`${SELECTOR_NAV_ITEM$1}.${CLASS_NAME_MENU_OPEN$1}`);
+        const openMenuItems = document.querySelectorAll(`${SELECTOR_NAV_ITEM}.${CLASS_NAME_MENU_OPEN}`);
         openMenuItems.forEach(menuItem => {
             const childElement = menuItem.querySelector(SELECTOR_TREEVIEW_MENU);
             if (childElement) {
@@ -410,11 +359,10 @@
         button.forEach(btn => {
             btn.addEventListener('click', event => {
                 const target = event.target;
-                const targetItem = target.closest(SELECTOR_NAV_ITEM$1);
+                const targetItem = target.closest(SELECTOR_NAV_ITEM);
                 const targetLink = target.closest(SELECTOR_NAV_LINK);
                 const targetTreeviewMenu = targetItem?.querySelector(SELECTOR_TREEVIEW_MENU);
                 const lteToggleElement = event.currentTarget;
-                // Avoid creating Treeview instances on non menu elements
                 if (!targetTreeviewMenu) {
                     return;
                 }
@@ -422,10 +370,8 @@
                     event.preventDefault();
                 }
                 if (targetItem) {
-                    // Read data attributes
                     const accordionAttr = lteToggleElement.dataset.accordion;
                     const animationSpeedAttr = lteToggleElement.dataset.animationSpeed;
-                    // Build config from data attributes, fallback to Default
                     const config = {
                         accordion: accordionAttr === undefined ? Default.accordion : accordionAttr === 'true',
                         animationSpeed: animationSpeedAttr === undefined ? Default.animationSpeed : Number(animationSpeedAttr)
@@ -437,17 +383,6 @@
         });
     });
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE direct-chat.ts
-     * @description Direct chat for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * Constants
-     * ====================================================
-     */
     const DATA_KEY$2 = 'lte.direct-chat';
     const EVENT_KEY$2 = `.${DATA_KEY$2}`;
     const EVENT_EXPANDED = `expanded${EVENT_KEY$2}`;
@@ -455,10 +390,6 @@
     const SELECTOR_DATA_TOGGLE = '[data-lte-toggle="chat-pane"]';
     const SELECTOR_DIRECT_CHAT = '.direct-chat';
     const CLASS_NAME_DIRECT_CHAT_OPEN = 'direct-chat-contacts-open';
-    /**
-     * Class Definition
-     * ====================================================
-     */
     class DirectChat {
         _element;
         constructor(element) {
@@ -477,11 +408,6 @@
             }
         }
     }
-    /**
-     *
-     * Data Api implementation
-     * ====================================================
-     */
     onDOMContentLoaded(() => {
         const button = document.querySelectorAll(SELECTOR_DATA_TOGGLE);
         button.forEach(btn => {
@@ -497,17 +423,6 @@
         });
     });
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE fullscreen.ts
-     * @description Fullscreen plugin for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * Constants
-     * ============================================================================
-     */
     const DATA_KEY$1 = 'lte.fullscreen';
     const EVENT_KEY$1 = `.${DATA_KEY$1}`;
     const EVENT_MAXIMIZED = `maximized${EVENT_KEY$1}`;
@@ -515,10 +430,6 @@
     const SELECTOR_FULLSCREEN_TOGGLE = '[data-lte-toggle="fullscreen"]';
     const SELECTOR_MAXIMIZE_ICON = '[data-lte-icon="maximize"]';
     const SELECTOR_MINIMIZE_ICON = '[data-lte-icon="minimize"]';
-    /**
-     * Class Definition.
-     * ============================================================================
-     */
     class FullScreen {
         _element;
         _config;
@@ -532,10 +443,10 @@
             const iconMinimize = document.querySelector(SELECTOR_MINIMIZE_ICON);
             void document.documentElement.requestFullscreen();
             if (iconMaximize) {
-                iconMaximize.style.display = 'none';
+                iconMaximize.classList.add('d-none');
             }
             if (iconMinimize) {
-                iconMinimize.style.display = 'block';
+                iconMinimize.classList.remove('d-none');
             }
             this._element.dispatchEvent(event);
         }
@@ -545,10 +456,10 @@
             const iconMinimize = document.querySelector(SELECTOR_MINIMIZE_ICON);
             void document.exitFullscreen();
             if (iconMaximize) {
-                iconMaximize.style.display = 'block';
+                iconMaximize.classList.remove('d-none');
             }
             if (iconMinimize) {
-                iconMinimize.style.display = 'none';
+                iconMinimize.classList.add('d-none');
             }
             this._element.dispatchEvent(event);
         }
@@ -563,10 +474,6 @@
             }
         }
     }
-    /**
-     * Data Api implementation
-     * ============================================================================
-     */
     onDOMContentLoaded(() => {
         const buttons = document.querySelectorAll(SELECTOR_FULLSCREEN_TOGGLE);
         buttons.forEach(btn => {
@@ -582,44 +489,24 @@
         });
     });
 
-    /**
-     * --------------------------------------------
-     * @file AdminLTE push-menu.ts
-     * @description Push menu for AdminLTE.
-     * @license MIT
-     * --------------------------------------------
-     */
-    /**
-     * ------------------------------------------------------------------------
-     * Constants
-     * ------------------------------------------------------------------------
-     */
     const DATA_KEY = 'lte.push-menu';
     const EVENT_KEY = `.${DATA_KEY}`;
     const EVENT_OPEN = `open${EVENT_KEY}`;
     const EVENT_COLLAPSE = `collapse${EVENT_KEY}`;
     const CLASS_NAME_SIDEBAR_MINI = 'sidebar-mini';
-    const CLASS_NAME_SIDEBAR_COLLAPSE = 'sidebar-collapse';
-    const CLASS_NAME_SIDEBAR_OPEN = 'sidebar-open';
     const CLASS_NAME_SIDEBAR_EXPAND = 'sidebar-expand';
     const CLASS_NAME_SIDEBAR_OVERLAY = 'sidebar-overlay';
-    const CLASS_NAME_MENU_OPEN = 'menu-open';
+    const CLASS_NAME_SIDEBAR_COLLAPSE = 'sidebar-collapse';
+    const CLASS_NAME_SIDEBAR_OPEN = 'sidebar-open';
     const SELECTOR_APP_SIDEBAR = '.app-sidebar';
-    const SELECTOR_SIDEBAR_MENU = '.sidebar-menu';
-    const SELECTOR_NAV_ITEM = '.nav-item';
-    const SELECTOR_NAV_TREEVIEW = '.nav-treeview';
     const SELECTOR_APP_WRAPPER = '.app-wrapper';
     const SELECTOR_SIDEBAR_EXPAND = `[class*="${CLASS_NAME_SIDEBAR_EXPAND}"]`;
     const SELECTOR_SIDEBAR_TOGGLE = '[data-lte-toggle="sidebar"]';
     const STORAGE_KEY_SIDEBAR_STATE = 'lte.sidebar.state';
     const Defaults = {
         sidebarBreakpoint: 992,
-        enablePersistence: true
+        enablePersistence: false
     };
-    /**
-     * Class Definition
-     * ====================================================
-     */
     class PushMenu {
         _element;
         _config;
@@ -627,100 +514,82 @@
             this._element = element;
             this._config = { ...Defaults, ...config };
         }
-        menusClose() {
-            const navTreeview = document.querySelectorAll(SELECTOR_NAV_TREEVIEW);
-            navTreeview.forEach(navTree => {
-                navTree.style.removeProperty('display');
-                navTree.style.removeProperty('height');
-            });
-            const navSidebar = document.querySelector(SELECTOR_SIDEBAR_MENU);
-            const navItem = navSidebar?.querySelectorAll(SELECTOR_NAV_ITEM);
-            if (navItem) {
-                navItem.forEach(navI => {
-                    navI.classList.remove(CLASS_NAME_MENU_OPEN);
-                });
-            }
+        isCollapsed() {
+            return document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE);
+        }
+        isExplicitlyOpen() {
+            return document.body.classList.contains(CLASS_NAME_SIDEBAR_OPEN);
+        }
+        isMiniMode() {
+            return document.body.classList.contains(CLASS_NAME_SIDEBAR_MINI);
+        }
+        isMobileSize() {
+            return globalThis.innerWidth <= this._config.sidebarBreakpoint;
         }
         expand() {
-            const event = new Event(EVENT_OPEN);
             document.body.classList.remove(CLASS_NAME_SIDEBAR_COLLAPSE);
-            document.body.classList.add(CLASS_NAME_SIDEBAR_OPEN);
-            this._element.dispatchEvent(event);
+            if (this.isMobileSize()) {
+                document.body.classList.add(CLASS_NAME_SIDEBAR_OPEN);
+            }
+            this._element.dispatchEvent(new Event(EVENT_OPEN));
         }
         collapse() {
-            const event = new Event(EVENT_COLLAPSE);
             document.body.classList.remove(CLASS_NAME_SIDEBAR_OPEN);
             document.body.classList.add(CLASS_NAME_SIDEBAR_COLLAPSE);
-            this._element.dispatchEvent(event);
-        }
-        addSidebarBreakPoint() {
-            const sidebarExpandList = document.querySelector(SELECTOR_SIDEBAR_EXPAND)?.classList ?? [];
-            const sidebarExpand = Array.from(sidebarExpandList).find(className => className.startsWith(CLASS_NAME_SIDEBAR_EXPAND)) ?? '';
-            const sidebar = document.getElementsByClassName(sidebarExpand)[0];
-            const sidebarContent = globalThis.getComputedStyle(sidebar, '::before').getPropertyValue('content');
-            this._config = { ...this._config, sidebarBreakpoint: Number(sidebarContent.replace(/[^\d.-]/g, '')) };
-            // FIXED: Don't auto-collapse on mobile if sidebar is currently open
-            // This prevents resize events (triggered by scrolling) from closing the sidebar
-            const isCurrentlyOpen = document.body.classList.contains(CLASS_NAME_SIDEBAR_OPEN);
-            if (window.innerWidth <= this._config.sidebarBreakpoint) {
-                // Only collapse if not currently open (prevents scroll-triggered closes)
-                if (!isCurrentlyOpen) {
-                    this.collapse();
-                }
-            }
-            else {
-                if (!document.body.classList.contains(CLASS_NAME_SIDEBAR_MINI)) {
-                    this.expand();
-                }
-                if (document.body.classList.contains(CLASS_NAME_SIDEBAR_MINI) && document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE)) {
-                    this.collapse();
-                }
-            }
+            this._element.dispatchEvent(new Event(EVENT_COLLAPSE));
         }
         toggle() {
-            if (document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE)) {
+            const isCollapsed = this.isCollapsed();
+            if (isCollapsed) {
                 this.expand();
             }
             else {
                 this.collapse();
             }
-            this.saveSidebarState();
+            if (this._config.enablePersistence) {
+                this.saveSidebarState(isCollapsed ? CLASS_NAME_SIDEBAR_OPEN : CLASS_NAME_SIDEBAR_COLLAPSE);
+            }
         }
-        /**
-         * Save sidebar state to localStorage
-         */
-        saveSidebarState() {
-            if (!this._config.enablePersistence) {
+        setupSidebarBreakPoint() {
+            const sidebarExpand = document.querySelector(SELECTOR_SIDEBAR_EXPAND);
+            if (!sidebarExpand) {
                 return;
             }
-            // Check for SSR environment
-            if (globalThis.window === undefined || globalThis.localStorage === undefined) {
+            const content = globalThis.getComputedStyle(sidebarExpand, '::before')
+                .getPropertyValue('content');
+            if (!content || content === 'none') {
+                return;
+            }
+            const breakpointValue = Number(content.replace(/[^\d.-]/g, ''));
+            if (Number.isNaN(breakpointValue)) {
+                return;
+            }
+            this._config = { ...this._config, sidebarBreakpoint: breakpointValue };
+        }
+        updateStateByResponsiveLogic() {
+            if (this.isMobileSize()) {
+                if (!this.isExplicitlyOpen()) {
+                    this.collapse();
+                }
+            }
+            else {
+                if (!(this.isMiniMode() && this.isCollapsed())) {
+                    this.expand();
+                }
+            }
+        }
+        saveSidebarState(state) {
+            if (globalThis.localStorage === undefined) {
                 return;
             }
             try {
-                const state = document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE) ?
-                    CLASS_NAME_SIDEBAR_COLLAPSE :
-                    CLASS_NAME_SIDEBAR_OPEN;
                 localStorage.setItem(STORAGE_KEY_SIDEBAR_STATE, state);
             }
             catch {
-                // localStorage may be unavailable (private browsing, quota exceeded, etc.)
             }
         }
-        /**
-         * Load sidebar state from localStorage
-         * Only applies on desktop; mobile always starts collapsed
-         */
         loadSidebarState() {
-            if (!this._config.enablePersistence) {
-                return;
-            }
-            // Check for SSR environment
-            if (globalThis.window === undefined || globalThis.localStorage === undefined) {
-                return;
-            }
-            // Don't restore state on mobile - let responsive behavior handle it
-            if (globalThis.innerWidth <= this._config.sidebarBreakpoint) {
+            if (globalThis.localStorage === undefined) {
                 return;
             }
             try {
@@ -731,36 +600,62 @@
                 else if (storedState === CLASS_NAME_SIDEBAR_OPEN) {
                     this.expand();
                 }
-                // If null (never saved), let default behavior apply
+                else {
+                    this.updateStateByResponsiveLogic();
+                }
+            }
+            catch {
+                this.updateStateByResponsiveLogic();
+            }
+        }
+        clearSidebarState() {
+            if (globalThis.localStorage === undefined) {
+                return;
+            }
+            try {
+                localStorage.removeItem(STORAGE_KEY_SIDEBAR_STATE);
             }
             catch {
-                // localStorage may be unavailable
             }
         }
         init() {
-            this.addSidebarBreakPoint();
-            this.loadSidebarState();
+            this.setupSidebarBreakPoint();
+            if (!this._config.enablePersistence) {
+                this.clearSidebarState();
+            }
+            if (this._config.enablePersistence && !this.isMobileSize()) {
+                this.loadSidebarState();
+            }
+            else {
+                this.updateStateByResponsiveLogic();
+            }
         }
     }
-    /**
-     * ------------------------------------------------------------------------
-     * Data Api implementation
-     * ------------------------------------------------------------------------
-     */
     onDOMContentLoaded(() => {
         const sidebar = document?.querySelector(SELECTOR_APP_SIDEBAR);
-        if (sidebar) {
-            const data = new PushMenu(sidebar, Defaults);
-            data.init();
-            window.addEventListener('resize', () => {
-                data.init();
-            });
+        if (!sidebar) {
+            return;
         }
+        const sidebarBreakpointAttr = sidebar.dataset.sidebarBreakpoint;
+        const enablePersistenceAttr = sidebar.dataset.enablePersistence;
+        const config = {
+            sidebarBreakpoint: sidebarBreakpointAttr === undefined ?
+                Defaults.sidebarBreakpoint :
+                Number(sidebarBreakpointAttr),
+            enablePersistence: enablePersistenceAttr === undefined ?
+                Defaults.enablePersistence :
+                enablePersistenceAttr === 'true'
+        };
+        const pushMenu = new PushMenu(sidebar, config);
+        pushMenu.init();
+        window.addEventListener('resize', () => {
+            pushMenu.setupSidebarBreakPoint();
+            pushMenu.updateStateByResponsiveLogic();
+        });
         const sidebarOverlay = document.createElement('div');
         sidebarOverlay.className = CLASS_NAME_SIDEBAR_OVERLAY;
         document.querySelector(SELECTOR_APP_WRAPPER)?.append(sidebarOverlay);
         let overlayTouchMoved = false;
-        // Handle touch events on overlay (area outside sidebar)
         sidebarOverlay.addEventListener('touchstart', () => {
             overlayTouchMoved = false;
         }, { passive: true });
@@ -770,17 +665,13 @@
         sidebarOverlay.addEventListener('touchend', event => {
             if (!overlayTouchMoved) {
                 event.preventDefault();
-                const target = event.currentTarget;
-                const data = new PushMenu(target, Defaults);
-                data.collapse();
+                pushMenu.collapse();
             }
             overlayTouchMoved = false;
         }, { passive: false });
         sidebarOverlay.addEventListener('click', event => {
             event.preventDefault();
-            const target = event.currentTarget;
-            const data = new PushMenu(target, Defaults);
-            data.collapse();
+            pushMenu.collapse();
         });
         const fullBtn = document.querySelectorAll(SELECTOR_SIDEBAR_TOGGLE);
         fullBtn.forEach(btn => {
@@ -792,17 +683,12 @@
                 }
                 if (button) {
                     event?.preventDefault();
-                    const data = new PushMenu(button, Defaults);
-                    data.toggle();
+                    pushMenu.toggle();
                 }
             });
         });
     });
 
-    /**
-     * AdminLTE Accessibility Module
-     * WCAG 2.1 AA Compliance Features
-     */
     class AccessibilityManager {
         config;
         liveRegion = null;
@@ -838,7 +724,6 @@
             this.initTableAccessibility();
             this.initFormAccessibility();
         }
-        // WCAG 4.1.3: Status Messages
         createLiveRegion() {
             if (this.liveRegion)
                 return;
@@ -850,7 +735,6 @@
             this.liveRegion.setAttribute('role', 'status');
             document.body.append(this.liveRegion);
         }
-        // WCAG 2.4.1: Bypass Blocks
         addSkipLinks() {
             const skipLinksContainer = document.createElement('div');
             skipLinksContainer.className = 'skip-links';
@@ -865,7 +749,6 @@
             skipLinksContainer.append(skipToMain);
             skipLinksContainer.append(skipToNav);
             document.body.insertBefore(skipLinksContainer, document.body.firstChild);
-            // Ensure targets exist and are focusable
             this.ensureSkipTargets();
         }
         ensureSkipTargets() {
@@ -884,7 +767,6 @@
                 nav.setAttribute('tabindex', '-1');
             }
         }
-        // WCAG 2.4.3: Focus Order & 2.4.7: Focus Visible
         initFocusManagement() {
             document.addEventListener('keydown', (event) => {
                 if (event.key === 'Tab') {
@@ -894,7 +776,6 @@
                     this.handleEscapeKey(event);
                 }
             });
-            // Focus management for modals and dropdowns
             this.initModalFocusManagement();
             this.initDropdownFocusManagement();
         }
@@ -902,14 +783,12 @@
             const focusableElements = this.getFocusableElements();
             const currentIndex = focusableElements.indexOf(document.activeElement);
             if (event.shiftKey) {
-                // Shift+Tab (backward)
                 if (currentIndex <= 0) {
                     event.preventDefault();
                     focusableElements.at(-1)?.focus();
                 }
             }
             else if (currentIndex >= focusableElements.length - 1) {
-                // Tab (forward)
                 event.preventDefault();
                 focusableElements[0]?.focus();
             }
@@ -927,30 +806,23 @@
             return Array.from(document.querySelectorAll(selector));
         }
         handleEscapeKey(event) {
-            // Close modals, dropdowns, etc.
             const activeModal = document.querySelector('.modal.show');
-            const activeDropdown = document.querySelector('.dropdown-menu.show');
             if (activeModal) {
-                const closeButton = activeModal.querySelector('[data-bs-dismiss="modal"]');
-                closeButton?.click();
-                event.preventDefault();
+                return;
             }
-            else if (activeDropdown) {
+            const activeDropdown = document.querySelector('.dropdown-menu.show');
+            if (activeDropdown) {
                 const toggleButton = document.querySelector('[data-bs-toggle="dropdown"][aria-expanded="true"]');
                 toggleButton?.click();
                 event.preventDefault();
             }
         }
-        // WCAG 2.1.1: Keyboard Access
         initKeyboardNavigation() {
-            // Add keyboard support for custom components
             document.addEventListener('keydown', (event) => {
                 const target = event.target;
-                // Handle arrow key navigation for menus
                 if (target.closest('.nav, .navbar-nav, .dropdown-menu')) {
                     this.handleMenuNavigation(event);
                 }
-                // Handle Enter and Space for custom buttons
                 if ((event.key === 'Enter' || event.key === ' ') && target.hasAttribute('role') && target.getAttribute('role') === 'button' && !target.matches('button, input[type="button"], input[type="submit"]')) {
                     event.preventDefault();
                     target.click();
@@ -991,14 +863,11 @@
             event.preventDefault();
             menuItems[nextIndex]?.focus();
         }
-        // WCAG 2.3.3: Animation from Interactions
         respectReducedMotion() {
             const prefersReducedMotion = globalThis.matchMedia('(prefers-reduced-motion: reduce)').matches;
             if (prefersReducedMotion) {
                 document.body.classList.add('reduce-motion');
-                // Disable smooth scrolling
                 document.documentElement.style.scrollBehavior = 'auto';
-                // Reduce animation duration
                 const style = document.createElement('style');
                 style.textContent = `
         *, *::before, *::after {
@@ -1010,18 +879,15 @@
                 document.head.append(style);
             }
         }
-        // WCAG 3.3.1: Error Identification
         initErrorAnnouncements() {
             const observer = new MutationObserver((mutations) => {
                 mutations.forEach((mutation) => {
                     mutation.addedNodes.forEach((node) => {
                         if (node.nodeType === Node.ELEMENT_NODE) {
                             const element = node;
-                            // Check for error messages
                             if (element.matches('.alert-danger, .invalid-feedback, .error')) {
                                 this.announce(element.textContent || 'Error occurred', 'assertive');
                             }
-                            // Check for success messages
                             if (element.matches('.alert-success, .success')) {
                                 this.announce(element.textContent || 'Success', 'polite');
                             }
@@ -1034,14 +900,11 @@
                 subtree: true
             });
         }
-        // WCAG 1.3.1: Info and Relationships
         initTableAccessibility() {
             document.querySelectorAll('table').forEach((table) => {
-                // Add table role if missing
                 if (!table.hasAttribute('role')) {
                     table.setAttribute('role', 'table');
                 }
-                // Ensure headers have proper scope
                 table.querySelectorAll('th').forEach((th) => {
                     if (!th.hasAttribute('scope')) {
                         const isInThead = th.closest('thead');
@@ -1054,7 +917,6 @@
                         }
                     }
                 });
-                // Add caption if missing but title exists
                 if (!table.querySelector('caption') && table.hasAttribute('title')) {
                     const caption = document.createElement('caption');
                     caption.textContent = table.getAttribute('title') || '';
@@ -1062,18 +924,15 @@
                 }
             });
         }
-        // WCAG 3.3.2: Labels or Instructions
         initFormAccessibility() {
             document.querySelectorAll('input, select, textarea').forEach((input) => {
                 const htmlInput = input;
-                // Ensure all inputs have labels
                 if (!htmlInput.labels?.length && !htmlInput.hasAttribute('aria-label') && !htmlInput.hasAttribute('aria-labelledby')) {
                     const placeholder = htmlInput.getAttribute('placeholder');
                     if (placeholder) {
                         htmlInput.setAttribute('aria-label', placeholder);
                     }
                 }
-                // Add required indicators
                 if (htmlInput.hasAttribute('required')) {
                     const label = htmlInput.labels?.[0];
                     if (label && !label.querySelector('.required-indicator')) {
@@ -1083,8 +942,6 @@
                         label.append(indicator);
                     }
                 }
-                // Handle invalid state unless the element explicitly opts out via the
-                // 'disable-adminlte-validations' class.
                 if (!htmlInput.classList.contains('disable-adminlte-validations')) {
                     htmlInput.addEventListener('invalid', () => {
                         this.handleFormError(htmlInput);
@@ -1100,10 +957,6 @@
                 errorElement.id = errorId;
                 errorElement.className = 'invalid-feedback';
                 errorElement.setAttribute('role', 'alert');
-                // Always append the error element as the last child of the parent.
-                // This prevents breaking layouts where inputs use Bootstrap's
-                // `.input-group-text` decorators, ensuring the error stays below
-                // the entire input group.
                 input.parentNode?.append(errorElement);
             }
             errorElement.textContent = input.validationMessage;
@@ -1111,7 +964,6 @@
             input.classList.add('is-invalid');
             this.announce(`Error in ${input.labels?.[0]?.textContent || input.name}: ${input.validationMessage}`, 'assertive');
         }
-        // Modal focus management
         initModalFocusManagement() {
             document.addEventListener('shown.bs.modal', (event) => {
                 const modal = event.target;
@@ -1119,18 +971,15 @@
                 if (focusableElements.length > 0) {
                     focusableElements[0].focus();
                 }
-                // Store previous focus
                 this.focusHistory.push(document.activeElement);
             });
             document.addEventListener('hidden.bs.modal', () => {
-                // Restore previous focus
                 const previousElement = this.focusHistory.pop();
                 if (previousElement) {
                     previousElement.focus();
                 }
             });
         }
-        // Dropdown focus management
         initDropdownFocusManagement() {
             document.addEventListener('shown.bs.dropdown', (event) => {
                 const dropdown = event.target;
@@ -1141,7 +990,6 @@
                 }
             });
         }
-        // Public API methods
         announce(message, priority = 'polite') {
             if (!this.liveRegion) {
                 this.createLiveRegion();
@@ -1149,7 +997,6 @@
             if (this.liveRegion) {
                 this.liveRegion.setAttribute('aria-live', priority);
                 this.liveRegion.textContent = message;
-                // Clear after announcement
                 setTimeout(() => {
                     if (this.liveRegion) {
                         this.liveRegion.textContent = '';
@@ -1161,7 +1008,6 @@
             const element = document.querySelector(selector);
             if (element) {
                 element.focus();
-                // Ensure element is visible
                 element.scrollIntoView({ behavior: 'smooth', block: 'center' });
             }
         }
@@ -1186,7 +1032,6 @@
             });
         }
         addLandmarks() {
-            // Add main landmark if missing
             const main = document.querySelector('main');
             if (!main) {
                 const appMain = document.querySelector('.app-main');
@@ -1195,7 +1040,6 @@
                     appMain.id = 'main';
                 }
             }
-            // Add navigation landmarks
             document.querySelectorAll('.navbar-nav, .nav').forEach((nav, index) => {
                 if (!nav.hasAttribute('role')) {
                     nav.setAttribute('role', 'navigation');
@@ -1204,35 +1048,17 @@
                     nav.setAttribute('aria-label', `Navigation ${index + 1}`);
                 }
             });
-            // Add search landmark
             const searchForm = document.querySelector('form[role="search"], .navbar-search');
             if (searchForm && !searchForm.hasAttribute('role')) {
                 searchForm.setAttribute('role', 'search');
             }
         }
     }
-    // Initialize accessibility when DOM is ready
     const initAccessibility = (config) => {
         return new AccessibilityManager(config);
     };
 
-    /**
-     * AdminLTE v4.0.0-rc5
-     * Author: Colorlib
-     * Website: AdminLTE.io <https://adminlte.io>
-     * License: Open source - MIT <https://opensource.org/licenses/MIT>
-     */
     onDOMContentLoaded(() => {
-        /**
-         * Initialize AdminLTE Core Components
-         * -------------------------------
-         */
-        const layout = new Layout(document.body);
-        layout.holdTransition();
-        /**
-         * Initialize Accessibility Features - WCAG 2.1 AA Compliance
-         * --------------------------------------------------------
-         */
         const accessibilityManager = initAccessibility({
             announcements: true,
             skipLinks: true,
@@ -1240,12 +1066,7 @@
             keyboardNavigation: true,
             reducedMotion: true
         });
-        // Add semantic landmarks
         accessibilityManager.addLandmarks();
-        // Mark app as loaded after initialization
-        setTimeout(() => {
-            document.body.classList.add('app-loaded');
-        }, 400);
     });
 
     exports.CardWidget = CardWidget;