admin-lte 4.0.0-rc6 → 4.0.0-rc7

package/.claude/settings.local.json

@@ -25,7 +25,11 @@
       "Bash(npm view:*)",
       "Bash(cat:*)",
       "Bash(npm pack:*)",
-      "Bash(npm publish:*)"
+      "Bash(npm publish:*)",
+      "Bash(npm dist-tag add:*)",
+      "Bash(git init:*)",
+      "Bash(gh repo create:*)",
+      "Bash(git push)"
     ],
     "deny": [],
     "ask": []

package/CHANGELOG.md

@@ -7,6 +7,54 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [4.0.0-rc7] - 2026-03-10
+
+### Added
+
+- **Sidebar Without Hover:** New `sidebar-without-hover` body class that prevents collapsed mini sidebar from expanding on hover (#5837)
+  - New demo page at `layout/collapsed-sidebar-without-hover.html`
+- **JavaScript Documentation:** Added documentation pages for all JS components
+  - Layout, Card Widget, Direct Chat, Fullscreen, and Accessibility modules
+  - Updated PushMenu documentation with configuration options and responsive behavior
+  - All 7 JS components now fully documented in the sidebar navigation
+- **Accessibility Module:** WCAG 2.1 AA compliance features (skip links, focus management, keyboard navigation, reduced motion, live announcements)
+- **Print Layout Fix:** Sidebar and main content now both visible when printing (#5996)
+
+### Changed
+
+- **Sidebar Persistence:** `enablePersistence` now defaults to `false` (was `true`). Opt in via `data-enable-persistence="true"` on `.app-sidebar`. **BREAKING CHANGE**
+- **Layout Plugin Refactor:** Single Layout instance with persistent hold-transition timer, proper cleanup on resize (#5956)
+- **PushMenu Plugin Refactor:** Single PushMenu instance with proper responsive logic, config from data attributes, mobile-aware state management (#5954)
+- **Login/Register Box:** Increased width from 360px to 400px (#5963)
+
+### Fixed
+
+- **Fixed Footer with Layout Fixed:** Footer now stays pinned at the bottom when using both `.fixed-footer` and `.layout-fixed` (#5805)
+- **Mobile Sidebar Scroll Chaining:** Added `overscroll-behavior: contain` to prevent page scroll when scrolling sidebar on mobile (#5864)
+- **Sidebar Flicker on Load:** Resolved by layout refactor fixing duplicate initialization and broken hold-transition timer (#5952)
+- **Bootstrap Modal Escape Key:** Accessibility module no longer intercepts Escape key when a Bootstrap modal is open (#5993)
+- **Pagination Border Radius:** Fixed `calc()` syntax in `_bootstrap-variables.scss` to match Bootstrap 5.3 format (#5951)
+- **slideUp/slideDown at Duration 0:** Added early return guard for zero/near-zero animation durations (#5964)
+- **TypeScript Comments in Build:** Added `removeComments: true` to tsconfig.json for smaller unminified bundles (#5953)
+
+### Updated
+
+- **Dependencies:** Updated all packages to latest semver-compatible versions
+  - astro: 5.x → 6.0.0
+  - @astrojs/mdx: 4.x → 5.0.0
+  - @astrojs/check: 0.9.6 → 0.9.7
+  - @rollup/plugin-typescript: 12.3.0 → 12.3.1
+  - @typescript-eslint/eslint-plugin: 8.48.1 → 8.50.0
+  - @typescript-eslint/parser: 8.48.1 → 8.50.0
+  - autoprefixer: 10.4.22 → 10.4.23
+  - eslint: 9.39.1 → 9.39.4
+  - postcss: 8.5.7 → 8.5.8
+  - rollup: 4.53.3 → 4.59.0
+  - sass: 1.94.2 → 1.97.3
+  - terser: 5.44.1 → 5.44.3
+  - typescript: 5.9.2 → 5.9.3
+- **Bundlewatch:** Updated adminlte.js size limit to 5.2 kB
+
 ## [4.0.0-rc6] - 2025-12-08
 
 ### Security

package/README.md

@@ -9,27 +9,27 @@
 **AdminLTE** is a fully responsive administration template. Based on **[Bootstrap 5](https://getbootstrap.com/)** framework and also the JavaScript plugins.
 Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops.
 
-## What's New in v4.0.0-rc6
+## What's New in v4.0.0-rc7
 
-**Security & Feature Release** - Important security fixes and new sidebar persistence feature:
+**Bug Fixes, Refactors & Documentation** - Major plugin refactors, complete JS documentation, and new features:
 
-- **Security Fixes** - Resolved 4 vulnerabilities (XSS in Astro, auth bypass, unsanitized attributes)
-- **Sidebar State Persistence** - Sidebar now remembers collapsed/expanded state across page refreshes
-- **Node.js 22** - Updated all GitHub Actions workflows to Node.js 22 LTS (supported until 2027)
-- **Latest Dependencies** - 15+ packages updated including Astro 5.16.4, Prettier 3.7.4, Rollup 4.53.3
-- **CI/CD Improvements** - Updated CodeQL actions to v3, fixed release workflow bugs
+- **Layout & PushMenu Refactors** - Single-instance architecture, proper responsive logic, configurable via data attributes
+- **Sidebar Without Hover** - New `sidebar-without-hover` class to keep collapsed sidebar from expanding on hover
+- **Complete JS Documentation** - All 7 JavaScript components now fully documented
+- **Astro 6.0.0** - Upgraded to latest Astro with Vite 7 and Shiki 4
+- **Bug Fixes** - Fixed footer with layout-fixed, mobile scroll chaining, print layout, modal escape key, pagination borders
 
 **Key Improvements:**
 
-- ✅ Zero security vulnerabilities - all npm audit issues resolved
-- ✅ Sidebar state persists in localStorage (configurable, SSR-safe, mobile-aware)
-- ✅ GitHub Actions use Node.js 22 (Active LTS until April 2027)
-- ✅ CodeQL security scanning updated to latest v3 actions
-- ✅ Release workflow fixed for proper asset packaging
+- Fixed footer now works correctly with `layout-fixed` (#5805)
+- Sidebar no longer causes page scroll chaining on mobile (#5864)
+- Print layout shows both sidebar and content (#5996)
+- Sidebar persistence is now opt-in via `data-enable-persistence="true"` (**breaking change**)
+- All dependencies updated to latest versions
 
 **Install the latest:**
 ```bash
-npm install admin-lte@4.0.0-rc6
+npm install admin-lte@4.0.0-rc7
 ```
 
 See the [CHANGELOG.md](CHANGELOG.md) for complete details.
@@ -72,7 +72,7 @@ To build for production:
 
 ## Browser Support
 
-AdminLTE supports all modern browsers with the latest Bootstrap 5.3.7:
+AdminLTE supports all modern browsers with the latest Bootstrap 5.3.8:
 - Chrome (latest)
 - Firefox (latest)
 - Safari (latest)

package/dist/UI/general.html

@@ -382,7 +382,7 @@
                   <i class="nav-icon bi bi-clipboard-fill"></i>
                   <p>
                     Layout Options
-                    <span class="nav-badge badge text-bg-secondary me-3">6</span>
+                    <span class="nav-badge badge text-bg-secondary me-3">7</span>
                     <i class="nav-arrow bi bi-chevron-right"></i>
                   </p>
                 </a>
@@ -435,6 +435,12 @@
                       <p>Sidebar Mini <small>+ Collapsed</small></p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../layout/collapsed-sidebar-without-hover.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../layout/logo-switch.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
@@ -629,12 +635,48 @@
                   </p>
                 </a>
                 <ul class="nav nav-treeview">
+                  <li class="nav-item">
+                    <a href="../docs/javascript/layout.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Layout</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/pushmenu.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>PushMenu</p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../docs/javascript/treeview.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
                       <p>Treeview</p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/card-widget.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Card Widget</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/direct-chat.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Direct Chat</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/fullscreen.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Fullscreen</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/accessibility.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Accessibility</p>
+                    </a>
+                  </li>
                 </ul>
               </li>
               <li class="nav-item">
@@ -1990,7 +2032,7 @@
         <!--end::To the end-->
         <!--begin::Copyright-->
         <strong>
-          Copyright &copy; 2014-2025&nbsp;
+          Copyright &copy; 2014-2026&nbsp;
           <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
         </strong>
         All rights reserved.

package/dist/UI/icons.html

@@ -382,7 +382,7 @@
                   <i class="nav-icon bi bi-clipboard-fill"></i>
                   <p>
                     Layout Options
-                    <span class="nav-badge badge text-bg-secondary me-3">6</span>
+                    <span class="nav-badge badge text-bg-secondary me-3">7</span>
                     <i class="nav-arrow bi bi-chevron-right"></i>
                   </p>
                 </a>
@@ -435,6 +435,12 @@
                       <p>Sidebar Mini <small>+ Collapsed</small></p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../layout/collapsed-sidebar-without-hover.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../layout/logo-switch.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
@@ -629,12 +635,48 @@
                   </p>
                 </a>
                 <ul class="nav nav-treeview">
+                  <li class="nav-item">
+                    <a href="../docs/javascript/layout.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Layout</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/pushmenu.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>PushMenu</p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../docs/javascript/treeview.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
                       <p>Treeview</p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/card-widget.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Card Widget</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/direct-chat.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Direct Chat</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/fullscreen.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Fullscreen</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/accessibility.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Accessibility</p>
+                    </a>
+                  </li>
                 </ul>
               </li>
               <li class="nav-item">
@@ -820,7 +862,7 @@
         <!--end::To the end-->
         <!--begin::Copyright-->
         <strong>
-          Copyright &copy; 2014-2025&nbsp;
+          Copyright &copy; 2014-2026&nbsp;
           <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
         </strong>
         All rights reserved.

package/dist/UI/timeline.html

@@ -382,7 +382,7 @@
                   <i class="nav-icon bi bi-clipboard-fill"></i>
                   <p>
                     Layout Options
-                    <span class="nav-badge badge text-bg-secondary me-3">6</span>
+                    <span class="nav-badge badge text-bg-secondary me-3">7</span>
                     <i class="nav-arrow bi bi-chevron-right"></i>
                   </p>
                 </a>
@@ -435,6 +435,12 @@
                       <p>Sidebar Mini <small>+ Collapsed</small></p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../layout/collapsed-sidebar-without-hover.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../layout/logo-switch.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
@@ -629,12 +635,48 @@
                   </p>
                 </a>
                 <ul class="nav nav-treeview">
+                  <li class="nav-item">
+                    <a href="../docs/javascript/layout.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Layout</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/pushmenu.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>PushMenu</p>
+                    </a>
+                  </li>
                   <li class="nav-item">
                     <a href="../docs/javascript/treeview.html" class="nav-link">
                       <i class="nav-icon bi bi-circle"></i>
                       <p>Treeview</p>
                     </a>
                   </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/card-widget.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Card Widget</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/direct-chat.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Direct Chat</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/fullscreen.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Fullscreen</p>
+                    </a>
+                  </li>
+                  <li class="nav-item">
+                    <a href="../docs/javascript/accessibility.html" class="nav-link">
+                      <i class="nav-icon bi bi-circle"></i>
+                      <p>Accessibility</p>
+                    </a>
+                  </li>
                 </ul>
               </li>
               <li class="nav-item">
@@ -906,7 +948,7 @@
         <!--end::To the end-->
         <!--begin::Copyright-->
         <strong>
-          Copyright &copy; 2014-2025&nbsp;
+          Copyright &copy; 2014-2026&nbsp;
           <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
         </strong>
         All rights reserved.

package/dist/css/adminlte.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /*!
- *   AdminLTE v4.0.0-rc5
+ *   AdminLTE v4.0.0-rc7
  *   Author: Colorlib
  *   Website: AdminLTE.io <https://adminlte.io>
  *   License: Open source - MIT <https://opensource.org/licenses/MIT>
@@ -4757,10 +4757,15 @@ textarea.form-control-lg {
 }
 
 .page-item:not(:first-child) .page-link {
-  margin-left: calc(var(--bs-border-width) * -1);
+  margin-left: calc(-1 * var(--bs-border-width));
+}
+.page-item:first-child .page-link {
+  border-top-left-radius: var(--bs-pagination-border-radius);
+  border-bottom-left-radius: var(--bs-pagination-border-radius);
 }
-.page-item .page-link {
-  border-radius: var(--bs-pagination-border-radius);
+.page-item:last-child .page-link {
+  border-top-right-radius: var(--bs-pagination-border-radius);
+  border-bottom-right-radius: var(--bs-pagination-border-radius);
 }
 
 .pagination-lg {
@@ -12948,6 +12953,7 @@ textarea.form-control-lg {
   padding-right: 0.5rem;
   padding-bottom: 0.5rem;
   padding-left: 0.5rem;
+  overscroll-behavior: contain;
   scrollbar-color: var(--bs-secondary-bg) transparent;
 }
 .sidebar-wrapper::-webkit-scrollbar-thumb {
@@ -13211,19 +13217,19 @@ textarea.form-control-lg {
   animation-duration: 0.3s;
   animation-fill-mode: both;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover {
   min-width: var(--lte-sidebar-width);
   max-width: var(--lte-sidebar-width);
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-header {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-header {
   display: inline;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-link {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-link {
   width: auto;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-link p,
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .brand-text,
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .logo-xl {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-link p,
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .brand-text,
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .logo-xl {
   width: auto;
   margin-left: 0;
   visibility: visible;
@@ -13231,7 +13237,7 @@ textarea.form-control-lg {
   animation-duration: 0.3s;
   animation-fill-mode: both;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .brand-text {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .brand-text {
   display: inline;
   max-width: inherit;
   margin-left: 0.5rem;
@@ -13239,8 +13245,8 @@ textarea.form-control-lg {
   animation-duration: 0.3s;
   animation-fill-mode: both;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-badge,
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-arrow {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-badge,
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-arrow {
   display: inline-block;
   visibility: visible;
   animation-name: fadeIn;
@@ -13248,10 +13254,10 @@ textarea.form-control-lg {
   animation-fill-mode: both;
   animation-delay: 0.3s;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-link p {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-link p {
   padding-left: 0.5rem;
 }
-.sidebar-mini.sidebar-collapse .app-sidebar:hover .logo-xs {
+.sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .logo-xs {
   visibility: hidden;
   animation-name: fadeOut;
   animation-duration: 0.3s;
@@ -13857,6 +13863,9 @@ body:not(.app-loaded) .app-footer {
   bottom: 0;
   z-index: 1030;
 }
+.fixed-footer.layout-fixed .app-main {
+  min-height: 0;
+}
 
 .dropdown-menu {
   overflow: hidden;
@@ -15178,7 +15187,7 @@ html.maximized-card {
 
 .login-box,
 .register-box {
-  width: 360px;
+  width: 400px;
 }
 @media (max-width: 576px) {
   .login-box,
@@ -15578,6 +15587,42 @@ fieldset legend {
     font-size: 0.8em;
     content: " (" attr(href) ")";
   }
+  /* Print Layout Fix - Ensure sidebar and main content are both visible */
+  .app-wrapper {
+    display: grid !important;
+    grid-template-rows: auto 1fr auto !important;
+    grid-template-columns: auto 1fr !important;
+  }
+  .sidebar-overlay {
+    display: none !important;
+  }
+  .app-sidebar {
+    position: static !important;
+    display: block !important;
+    min-width: 200px !important;
+    max-width: 200px !important;
+    max-height: none !important;
+    margin-left: 0 !important;
+    overflow: visible !important;
+  }
+  .sidebar-wrapper {
+    height: auto !important;
+    overflow: visible !important;
+  }
+  .app-header {
+    position: static !important;
+  }
+  .app-main {
+    width: auto !important;
+    max-width: 100% !important;
+    overflow: visible !important;
+  }
+  .app-content {
+    overflow: visible !important;
+  }
+  .app-footer {
+    position: static !important;
+  }
 }
 
 /*# sourceMappingURL=adminlte.css.map */