adminator-admin-dashboard 2.7.0 → 2.8.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adminator-admin-dashboard",
-  "version": "2.7.0",
+  "version": "2.8.0",
   "private": false,
   "description": "Modern jQuery-free Bootstrap 5 Admin Dashboard Template with Dark Mode",
   "main": "dist/index.html",
@@ -38,7 +38,7 @@
     "src/**/*",
     "webpack.config.js",
     "CLAUDE.md",
-    "RELEASE_NOTES.md",
+    "CHANGELOG.md",
     "README.md"
   ],
   "engines": {
@@ -55,53 +55,52 @@
     "lint:js": "eslint ./src ./webpack ./*.js -f table --ext .js --ext .jsx",
     "lint:scss": "stylelint ./src/**/*.scss",
     "lint": "npm run lint:js && npm run lint:scss",
-    "prepublishOnly": "npm run build",
+    "prepublishOnly": "npm run lint && npm run build",
     "postpublish": "echo 'Package published successfully! View at: https://www.npmjs.com/package/adminator-admin-dashboard'"
   },
   "devDependencies": {
-    "@babel/core": "^7.27.4",
-    "@babel/eslint-parser": "^7.27.5",
-    "@babel/plugin-transform-runtime": "^7.27.4",
-    "@babel/preset-env": "^7.27.2",
-    "@babel/runtime": "^7.27.6",
-    "@eslint/js": "^9.29.0",
+    "@babel/core": "^7.28.0",
+    "@babel/eslint-parser": "^7.28.0",
+    "@babel/plugin-transform-runtime": "^7.28.0",
+    "@babel/preset-env": "^7.28.0",
+    "@eslint/js": "^9.33.0",
     "babel-loader": "^10.0.0",
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "copy-webpack-plugin": "^13.0.0",
-    "cross-env": "^7.0.3",
+    "cross-env": "^10.0.0",
     "css-loader": "^7.1.2",
     "css-minimizer-webpack-plugin": "^7.0.2",
-    "eslint": "^9.29.0",
+    "eslint": "^9.33.0",
     "eslint-formatter-table": "^7.32.1",
-    "globals": "^16.2.0",
+    "globals": "^16.3.0",
     "html-webpack-plugin": "^5.6.3",
-    "mini-css-extract-plugin": "^2.9.2",
+    "mini-css-extract-plugin": "^2.9.3",
     "postcss": "^8.5.6",
     "postcss-loader": "^8.1.1",
-    "postcss-preset-env": "^10.2.3",
-    "sass": "^1.89.2",
+    "postcss-preset-env": "^10.2.4",
+    "sass": "^1.90.0",
     "sass-loader": "^16.0.5",
     "shx": "^0.4.0",
     "style-loader": "^4.0.0",
-    "stylelint": "^16.21.0",
+    "stylelint": "^16.23.1",
     "stylelint-config-standard": "^38.0.0",
-    "webpack": "^5.99.9",
+    "webpack": "^5.101.0",
     "webpack-cli": "^6.0.1",
     "webpack-dashboard": "^3.3.8",
     "webpack-dev-server": "^5.2.2"
   },
   "dependencies": {
-    "@fullcalendar/core": "^6.1.17",
-    "@fullcalendar/daygrid": "^6.1.17",
-    "@fullcalendar/interaction": "^6.1.17",
-    "@fullcalendar/list": "^6.1.17",
-    "@fullcalendar/timegrid": "^6.1.17",
+    "@babel/runtime": "^7.28.2",
+    "@fullcalendar/core": "^6.1.19",
+    "@fullcalendar/daygrid": "^6.1.19",
+    "@fullcalendar/interaction": "^6.1.19",
+    "@fullcalendar/list": "^6.1.19",
+    "@fullcalendar/timegrid": "^6.1.19",
     "@popperjs/core": "^2.11.8",
     "bootstrap": "^5.3.7",
     "brand-colors": "^2.1.1",
     "chart.js": "^4.5.0",
     "dayjs": "^1.11.13",
-    "file-loader": "^6.2.0",
     "jsvectormap": "^1.6.0",
     "load-google-maps-api": "^2.0.2",
     "lodash": "^4.17.21",

package/src/assets/scripts/app.js

@@ -5,9 +5,9 @@
 
 // Note: Bootstrap 5 CSS is still available via SCSS imports
 // Bootstrap JS components removed to eliminate jQuery dependency
-import DOM from './utils/dom';
+import { DOM } from './utils/dom';
 import DateUtils from './utils/date';
-import Theme from './utils/theme';
+import ThemeManager from './utils/theme';
 import Sidebar from './components/Sidebar';
 import ChartComponent from './components/Chart';
 
@@ -31,6 +31,7 @@ class AdminatorApp {
   constructor() {
     this.components = new Map();
     this.isInitialized = false;
+    this.themeManager = ThemeManager;
     
     // Initialize when DOM is ready
     DOM.ready(() => {
@@ -212,7 +213,7 @@ class AdminatorApp {
     // Initializing theme system
     
     // Initialize theme system first
-    Theme.init();
+    this.themeManager.init();
     
     // Inject theme toggle if missing - with retry mechanism
     setTimeout(() => {
@@ -249,11 +250,11 @@ class AdminatorApp {
         const toggle = DOM.select('#theme-toggle');
         if (toggle) {
         // Set initial state
-          const currentTheme = Theme.current();
+          const currentTheme = this.themeManager.current();
           toggle.checked = currentTheme === 'dark';
         
           DOM.on(toggle, 'change', () => {
-            Theme.apply(toggle.checked ? 'dark' : 'light');
+            this.themeManager.apply(toggle.checked ? 'dark' : 'light');
           });
         
           // Listen for theme changes from other sources

package/src/assets/scripts/utils/theme.js

@@ -40,7 +40,9 @@ const Theme = {
     }
     try {
       localStorage.setItem(THEME_KEY, theme);
-    } catch (_) {}
+    } catch {
+      // Ignore errors
+    }
     window.dispatchEvent(new CustomEvent('adminator:themeChanged', { detail: { theme } }));
   },
   toggle() {
@@ -50,7 +52,7 @@ const Theme = {
   current() {
     try {
       return localStorage.getItem(THEME_KEY) || 'light';
-    } catch (_) {
+    } catch {
       return 'light';
     }
   },

package/src/assets/scripts/vectorMaps/index.js

@@ -24,7 +24,7 @@ export default (function () {
     if (mapInstance) {
       try {
         mapInstance.destroy();
-      } catch (e) {
+      } catch {
         // Map instance cleanup
       }
       mapInstance = null;
@@ -166,7 +166,7 @@ export default (function () {
           tooltip.text(`${regionName}${value ? `: ${  value}` : ''}`);
         },
         
-        onLoaded(map) {
+        onLoaded() {
           // Map loaded successfully
         },
       });
@@ -174,7 +174,7 @@ export default (function () {
       // Store instance for theme updates
       worldMapContainer.mapInstance = mapInstance;
       
-    } catch (error) {
+    } catch {
       // Error initializing JSVectorMap
       
       // Fallback: show a simple message
@@ -238,7 +238,7 @@ export default (function () {
           container.style.backgroundColor = colors.backgroundColor;
         }
         
-      } catch (error) {
+      } catch {
         // Theme update failed, reinitializing map
         vectorMapInit();
       }
@@ -261,7 +261,7 @@ export default (function () {
     if (mapInstance) {
       try {
         mapInstance.destroy();
-      } catch (e) {
+      } catch {
         // Map cleanup on unload
       }
       mapInstance = null;

package/RELEASE_NOTES.md

@@ -1,92 +0,0 @@
-# 🚀 Adminator v2.7.0 - jQuery-Free Release
-
-## 📋 Overview
-This major release completely removes jQuery dependency from the Adminator admin dashboard while maintaining all functionality and improving performance. The project now uses modern vanilla JavaScript with Bootstrap 5.3.7.
-
-## ✨ Major Changes
-
-### 🗑️ Removed jQuery Dependencies (600KB+ bundle reduction)
-- ❌ **jQuery Core** (3.7.1) → ✅ **Vanilla JavaScript**
-- ❌ **jQuery Sparkline** (2.4.0) → ✅ **Chart.js 4.5.0** mini charts
-- ❌ **Bootstrap Datepicker** (1.10.0) → ✅ **HTML5 date inputs** + vanilla JS
-- ❌ **DataTables** (1.10.18) → ✅ **Custom vanilla JS** table component
-- ❌ **Easy Pie Chart** (2.1.7) → ✅ **Custom SVG** pie charts
-- ❌ **jVectorMap** (2.0.4) → ✅ **JSVectorMap 1.6.0** (jQuery-free)
-
-### 🔧 New Vanilla JavaScript Components
-- **Bootstrap 5 Components**: Modals, dropdowns, popovers, tooltips, accordions
-- **Enhanced Data Tables**: Sorting, pagination, search functionality
-- **Interactive Charts**: Chart.js-based sparklines with theme support
-- **Vector Maps**: Interactive world maps with markers and tooltips
-- **Date Pickers**: HTML5 date inputs with enhanced UX
-- **Theme System**: Improved dark/light mode with CSS variables
-
-### 📱 Mobile Enhancements
-- Full-width search overlay for mobile devices
-- Enhanced dropdown behavior with overlay management
-- Touch-friendly interactions and gestures
-- Viewport-based responsive breakpoints
-- Prevents horizontal scrolling on mobile
-
-### 🎨 Bootstrap 5 Migration
-- **Updated to Bootstrap 5.3.7** from Bootstrap 4
-- **Fixed deprecated classes**: `sr-only` → `visually-hidden`
-- **Updated data attributes**: `data-toggle` → `data-bs-toggle`
-- **Enhanced UI components**: New examples and improved styling
-- **Better accessibility**: Proper ARIA attributes and keyboard navigation
-
-## 🚀 Performance Improvements
-- **Bundle size reduction**: ~600KB smaller JavaScript bundle
-- **Faster page loads**: Eliminated jQuery dependency
-- **Modern ES6+**: Class-based architecture with better maintainability
-- **Optimized builds**: Webpack 5.99.9 with modern optimizations
-
-## 📦 New Features
-- **Theme Toggle**: Automatic injection with OS preference detection
-- **Comprehensive Documentation**: Updated CLAUDE.md with full architecture guide
-- **Mobile-First Design**: Enhanced mobile experience across all components
-- **Dark Mode**: Complete dark mode implementation with CSS variables
-
-## 🔧 Technical Details
-- **Build System**: Webpack 5.99.9 with hot module replacement
-- **JavaScript**: ES6+ with Babel transpilation, ESLint 9.x flat config
-- **CSS**: Sass/SCSS with PostCSS processing
-- **Frontend**: 100% jQuery-free vanilla JavaScript
-- **Theme System**: CSS variables-based dark/light mode
-
-## 📖 Documentation
-- Complete architecture documentation in `CLAUDE.md`
-- Development commands and workflow guidelines
-- Component integration examples
-- Mobile optimization techniques
-
-## 🔗 Demo
-- **Live Demo**: https://puikinsh.github.io/Adminator-admin-dashboard/
-- **Development Server**: `npm start` (http://localhost:4000)
-
-## 💻 Quick Start
-```bash
-# Install dependencies
-npm install
-
-# Start development server
-npm start
-
-# Build for production
-npm run build
-
-# Run linters
-npm run lint
-```
-
-## 🎯 What's Next
-This release establishes a modern, maintainable foundation for the Adminator admin dashboard. All functionality has been preserved while significantly improving performance and developer experience.
-
-## 🙏 Acknowledgments
-- Original design by [Colorlib](https://colorlib.com)
-- jQuery removal and modernization completed with comprehensive testing
-- Bootstrap 5 migration with full backward compatibility
-
----
-
-**Full Changelog**: https://github.com/puikinsh/Adminator-admin-dashboard/compare/v2.6.1...v2.7.0

package/dist/55b07f26c86c8e3d3754.svg

@@ -1 +0,0 @@
-export default __webpack_public_path__ + "assets/c1e38fd9e0e74ba58f7a2b77ef29fdd3.svg";

package/dist/9fad440d8ee7a949a9a9.svg

@@ -1 +0,0 @@
-export default __webpack_public_path__ + "assets/f0fc8c798eac5636249c4ea287832422.svg";

package/dist/test.html

@@ -1,91 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
-  <title>Test</title>
-  <style>
-    #loader {
-      transition: all 0.3s ease-in-out;
-      opacity: 1;
-      visibility: visible;
-      position: fixed;
-      height: 100vh;
-      width: 100%;
-      background: #fff;
-      z-index: 90000;
-    }
-
-    #loader.fadeOut {
-      opacity: 0;
-      visibility: hidden;
-    }
-
-
-
-    .spinner {
-      width: 40px;
-      height: 40px;
-      position: absolute;
-      top: calc(50% - 20px);
-      left: calc(50% - 20px);
-      background-color: #333;
-      border-radius: 100%;
-      -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
-      animation: sk-scaleout 1.0s infinite ease-in-out;
-    }
-
-    @-webkit-keyframes sk-scaleout {
-      0% { -webkit-transform: scale(0) }
-      100% {
-        -webkit-transform: scale(1.0);
-        opacity: 0;
-      }
-    }
-
-    @keyframes sk-scaleout {
-      0% {
-        -webkit-transform: scale(0);
-        transform: scale(0);
-      } 100% {
-        -webkit-transform: scale(1.0);
-        transform: scale(1.0);
-        opacity: 0;
-      }
-    }
-  </style>
-<script defer="defer" src="main.js"></script></head>
-<body class="app">
-  <div id="loader">
-    <div class="spinner"></div>
-  </div>
-
-  <script>
-    window.addEventListener('load', function load() {
-      const loader = document.getElementById('loader');
-      setTimeout(function() {
-          loader.classList.add('fadeOut');
-      }, 300);
-    });
-  </script>
-  <div class="page-container">
-    
-    <main class="main-content bgc-grey-100">
-      <div id="mainContent">
-        <div class="full-container">
-          <button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">
-            Tooltip on top
-          </button>
-          <button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">
-            Tooltip on top
-          </button>
-
-        </div>
-      </div>
-    </main>
-    <footer class="bdT ta-c p-30 lh-0 fsz-sm c-grey-600">
-        <span>Copyright © 2025 Designed by <a href="https://colorlib.com" target="_blank" rel="nofollow noopener noreferrer" title="Colorlib">Colorlib</a>. All rights reserved.</span>
-    </footer>
-  </div>
-</body>
-</html>

package/src/test.html

@@ -1,96 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-  <title>Test</title>
-  <style>
-    #loader {
-      transition: all 0.3s ease-in-out;
-      opacity: 1;
-      visibility: visible;
-      position: fixed;
-      height: 100vh;
-      width: 100%;
-      background: #fff;
-      z-index: 90000;
-    }
-
-    #loader.fadeOut {
-      opacity: 0;
-      visibility: hidden;
-    }
-
-
-
-    .spinner {
-      width: 40px;
-      height: 40px;
-      position: absolute;
-      top: calc(50% - 20px);
-      left: calc(50% - 20px);
-      background-color: #333;
-      border-radius: 100%;
-      -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
-      animation: sk-scaleout 1.0s infinite ease-in-out;
-    }
-
-    @-webkit-keyframes sk-scaleout {
-      0% { -webkit-transform: scale(0) }
-      100% {
-        -webkit-transform: scale(1.0);
-        opacity: 0;
-      }
-    }
-
-    @keyframes sk-scaleout {
-      0% {
-        -webkit-transform: scale(0);
-        transform: scale(0);
-      } 100% {
-        -webkit-transform: scale(1.0);
-        transform: scale(1.0);
-        opacity: 0;
-      }
-    }
-  </style>
-</head>
-<body class="app">
-  <div id='loader'>
-    <div class="spinner"></div>
-  </div>
-
-  <script>
-    window.addEventListener('load', function load() {
-      const loader = document.getElementById('loader');
-      setTimeout(function() {
-          loader.classList.add('fadeOut');
-      }, 300);
-    });
-  </script>
-  <div class="page-container">
-    <!-- <div class="header navbar">
-      <div class="header-container">
-        
-      </div>
-      
-    </div> -->
-    <main class='main-content bgc-grey-100'>
-      <div id='mainContent'>
-        <div class="full-container">
-          <button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">
-            Tooltip on top
-          </button>
-          <button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">
-            Tooltip on top
-          </button>
-
-        </div>
-      </div>
-    </main>
-    <footer class="bdT ta-c p-30 lh-0 fsz-sm c-grey-600">
-        <span>Copyright © 2025 Designed by <a href="https://colorlib.com" target="_blank" rel="nofollow noopener noreferrer" title="Colorlib">Colorlib</a>. All rights reserved.</span>
-    </footer>
-  </div>
-</body>
-</html>