@adminlte/react 0.1.0 → 0.3.0

package/CHANGELOG.md

@@ -1,11 +1,22 @@
 # Changelog
 
-All notable changes to **adminlte-react** are documented in this file.
+All notable changes to **@adminlte/react** are documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [Unreleased]
+## [0.3.0] - 2026-07-02
+
+### Changed
+
+- **AdminLTE core upgraded to 4.1.0.** The bundled stylesheet (`@adminlte/react/css`) picks up everything from core [4.0.4](https://github.com/ColorlibHQ/AdminLTE/blob/master/CHANGELOG.md#404---2026-07-02) and [4.1.0](https://github.com/ColorlibHQ/AdminLTE/blob/master/CHANGELOG.md#410---2026-07-02): ~6 KB gzip smaller (duplicate docs styles removed and the docs/FAQ styling split into core's separate `adminlte-docs.css`, which applications never needed), WCAG AA contrast fix for breadcrumb links on the content-header background, and the repaired callout link/code colors. The RTL stylesheet in the demo was refreshed to match.
+- Demo loads Bootstrap 5.3.8 from the CDN (was 5.3.7), matching the compiled core CSS.
+
+### Notes
+
+- Core 4.1.0's new JavaScript (ESM bundle, TypeScript declarations, component lifecycle, bundled ColorMode) does not affect this port: `@adminlte/react` re-implements all behavior natively in React and never loads `adminlte.js`. Do **not** load core's `adminlte.js` alongside this library — both implement the `data-lte-toggle` data API and cards would double-toggle. Theme preferences continue to interoperate with core via the shared `lte-theme` storage key.
+
+## [0.2.0] - 2026-06-10
 
 ### Added
 
@@ -40,6 +51,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 
+- **Package renamed to `@adminlte/react`** (previously `adminlte-react`), published under the
+  `@adminlte` npm org. Update imports: `from '@adminlte/react'` and
+  `import '@adminlte/react/css'`.
 - **Build: per-file ESM output (RSC boundaries preserved).** The package is no longer a single
   bundled file stamped with a blanket `"use client"`. Each source module now compiles to its own
   `dist/` file, so the `'use client'` directive survives per component: server-component-authored

package/README.md

@@ -9,7 +9,7 @@
 
 A modern React/Next.js component library for building admin dashboards and web applications with AdminLTE 4 styling and Bootstrap 5.3 — built for the Next.js App Router and React Server Components by [Colorlib](https://colorlib.com).
 
-**Status**: v0.1.0 (Early Release) · **Live demo:** [adminlte.io/themes/next-react](https://adminlte.io/themes/next-react/)
+**Status**: v0.3.0 (Early Release, AdminLTE core 4.1.0) · **Live demo:** [adminlte.io/themes/next-react](https://adminlte.io/themes/next-react/)
 
 <p align="center">
   <a href="https://adminlte.io/themes/next-react/">
@@ -22,24 +22,27 @@ A modern React/Next.js component library for building admin dashboards and web a
 
 **Available for your stack** — the same AdminLTE 4 dashboard, in the framework you know best:
 
-<p align="center">
+<!-- ADMINLTE-ECOSYSTEM:START -->
+<div align="center">
+  <a href="https://github.com/ColorlibHQ/AdminLTE"><img height="36" alt="HTML" src="https://img.shields.io/badge/HTML-0D6EFD?style=for-the-badge&logo=html5&logoColor=white"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-react"><img height="36" alt="React" src="https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-react"><img height="36" alt="Next.js" src="https://img.shields.io/badge/Next.js-000000?style=for-the-badge&logo=nextdotjs&logoColor=white"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-vue"><img height="36" alt="Vue" src="https://img.shields.io/badge/Vue.js-35495E?style=for-the-badge&logo=vuedotjs&logoColor=4FC08D"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-vue"><img height="36" alt="Nuxt" src="https://img.shields.io/badge/Nuxt-00DC82?style=for-the-badge&logo=nuxt&logoColor=white"></a>
+  <a href="https://github.com/ColorlibHQ/adminlte-angular"><img height="36" alt="Angular" src="https://img.shields.io/badge/Angular-DD0031?style=for-the-badge&logo=angular&logoColor=white"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-laravel"><img height="36" alt="Laravel" src="https://img.shields.io/badge/Laravel-FF2D20?style=for-the-badge&logo=laravel&logoColor=white"></a>
+  <a href="https://github.com/ColorlibHQ/adminlte-symfony"><img height="36" alt="Symfony" src="https://img.shields.io/badge/Symfony-000000?style=for-the-badge&logo=symfony&logoColor=white"></a>
   <a href="https://github.com/ColorlibHQ/adminlte-django"><img height="36" alt="Django" src="https://img.shields.io/badge/Django-092E20?style=for-the-badge&logo=django&logoColor=white"></a>
+  <a href="https://github.com/ColorlibHQ/adminlte-aspnet"><img height="36" alt="ASP.NET" src="https://img.shields.io/badge/ASP.NET-512BD4?style=for-the-badge&logo=dotnet&logoColor=white"></a>
+  <a href="https://github.com/ColorlibHQ/adminlte-drupal"><img height="36" alt="Drupal" src="https://img.shields.io/badge/Drupal-0678BE?style=for-the-badge&logo=drupal&logoColor=white"></a>
+  <a href="https://docs.adminlte.io"><img height="36" alt="Docs" src="https://img.shields.io/badge/Docs-adminlte.io-0EA5E9?style=for-the-badge&logo=readthedocs&logoColor=white"></a>
+</div>
+<!-- ADMINLTE-ECOSYSTEM:END -->
+
+<p align="center">
+  <a href="https://adminlte.io/themes/next-react/"><img src=".github/preview.png" alt="AdminLTE 4 for React — dashboard preview" width="100%"></a>
 </p>
 
-<p align="center"><sub>
-  Frameworks:
-  <a href="https://github.com/ColorlibHQ/adminlte-react">React</a> ·
-  <a href="https://github.com/ColorlibHQ/adminlte-react">Next.js</a> ·
-  <a href="https://github.com/ColorlibHQ/adminlte-vue">Vue</a> ·
-  <a href="https://github.com/ColorlibHQ/adminlte-vue">Nuxt</a> ·
-  <a href="https://github.com/ColorlibHQ/adminlte-laravel">Laravel</a> ·
-  <a href="https://github.com/ColorlibHQ/adminlte-django">Django</a>
-</sub></p>
 
 > **Documentation:** Full guides and an API reference for every component, hook, and
 > context live in the demo app under `/docs`. Run `pnpm demo` and open
@@ -60,9 +63,9 @@ A modern React/Next.js component library for building admin dashboards and web a
 ## Installation
 
 ```bash
-npm install adminlte-react
+npm install @adminlte/react
 # or
-pnpm add adminlte-react
+pnpm add @adminlte/react
 ```
 
 ### Peer Dependencies
@@ -104,7 +107,7 @@ for the full matrix.
 
 ```tsx
 // app/layout.tsx
-import 'adminlte-react/css'
+import '@adminlte/react/css'
 import 'bootstrap-icons/font/bootstrap-icons.css'
 import './globals.css'
 
@@ -135,7 +138,7 @@ export default function RootLayout({ children }) {
 
 ```tsx
 // app/(dashboard)/layout.tsx
-import { DashboardLayout } from 'adminlte-react'
+import { DashboardLayout } from '@adminlte/react'
 import { menuItems } from '@/lib/menu'
 
 export default function Layout({ children }) {
@@ -156,7 +159,7 @@ export default function Layout({ children }) {
 
 ```ts
 // lib/menu.ts
-import type { MenuNode } from 'adminlte-react'
+import type { MenuNode } from '@adminlte/react'
 
 export const menuItems: MenuNode[] = [
   {
@@ -189,7 +192,7 @@ export const menuItems: MenuNode[] = [
 
 ```tsx
 // app/(dashboard)/page.tsx
-import { AppContent, SmallBox, Card, Progress } from 'adminlte-react'
+import { AppContent, SmallBox, Card, Progress } from '@adminlte/react'
 
 export default function Dashboard() {
   return (
@@ -289,7 +292,7 @@ Standalone hooks:
 
 ```tsx
 'use client'
-import { useSidebarContext, useColorModeContext } from 'adminlte-react'
+import { useSidebarContext, useColorModeContext } from '@adminlte/react'
 
 function Toolbar() {
   const { toggle } = useSidebarContext()
@@ -320,7 +323,7 @@ All components use Bootstrap 5.3 utility classes. Customize via CSS variables or
 Full TypeScript support with exported types:
 
 ```tsx
-import type { DashboardLayoutProps, MenuNode, BootstrapTheme } from 'adminlte-react'
+import type { DashboardLayoutProps, MenuNode, BootstrapTheme } from '@adminlte/react'
 
 const props: DashboardLayoutProps = {
   menuItems: [],