free version (#74) (#75) (#76)

* free version update

* free version on change complete

* yml file update

---------

Co-authored-by: ct-vrushti <vrushti.chopda@codedthemes.com>
Co-authored-by: ct-vrushti <vrushti.pcoded@gmail.com>
Co-authored-by: Dikshit Moradiya <phoenixcoded@gmail.com>

Author: 4 people

.github/workflows/prod-angular.yml

@@ -7,7 +7,7 @@ on:
     branches:
       - master
     paths:
-      - 'angular/**'
+      - "angular/**"
   #pull_request:
   #  types:
   #    - closed
@@ -25,10 +25,10 @@ jobs:
       - name: 🚚 Get latest code
         uses: actions/checkout@v4
 
-      - name: Install Node.js 22
+      - name: Install Node.js 24
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
+          node-version: "24"
 
       - name: 🔨 Build Project
         run: |
@@ -46,4 +46,4 @@ jobs:
           REMOTE_USER: u965251139
           REMOTE_PORT: "65002"
           TARGET: domains/ableproadmin.com/public_html/angular/free
-          EXCLUDE: "/angular/node_modules/"
+          EXCLUDE: "/angular/node_modules/"

.github/workflows/prod-react.yml

@@ -25,16 +25,16 @@ jobs:
       - name: 🚚 Get latest code
         uses: actions/checkout@v4
 
-      - name: Install Node.js 22
+      - name: Install Node.js 24
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
+          node-version: "24"
 
       - name: 🔨 Build Project
         run: |
           cd react
           corepack enable
-          yarn set version 4.9.1 
+          yarn set version 4.12.0 
           yarn 
           yarn run build
 

.github/workflows/prod-vue.yml

@@ -7,7 +7,7 @@ on:
     branches:
       - master
     paths:
-      - 'vue/**'
+      - "vue/**"
 
 jobs:
   #if_merged:
@@ -20,10 +20,10 @@ jobs:
       - name: 🚚 Get latest code
         uses: actions/checkout@v4
 
-      - name: Use Node.js 22
+      - name: Use Node.js 24
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
+          node-version: "24"
 
       - name: 🔨 Build Project
         run: |
@@ -41,4 +41,4 @@ jobs:
           REMOTE_USER: u965251139
           REMOTE_PORT: "65002"
           TARGET: domains/ableproadmin.com/public_html/vue/free
-          EXCLUDE: "/full-version/node_modules/"
+          EXCLUDE: "/full-version/node_modules/"

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Phoenixcoded
+Copyright (c) 2026 Phoenixcoded
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

react/.env

@@ -1,4 +1,4 @@
-VITE_APP_VERSION = v2.2.0
+VITE_APP_VERSION = v3.0.0
 GENERATE_SOURCEMAP = false
 
 ## Public URL

react/package.json

@@ -1,33 +1,33 @@
 {
   "name": "able-pro-react-free-admin-dashboard",
-  "version": "2.2.0",
+  "version": "3.0.0",
   "dependencies": {
     "@emotion/cache": "11.14.0",
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.1",
-    "@fontsource/inter": "5.2.6",
-    "@mui/lab": "7.0.0-beta.16",
-    "@mui/material": "7.3.1",
-    "@mui/system": "7.3.1",
-    "@vitejs/plugin-react": "5.0.2",
-    "apexcharts": "5.3.4",
-    "formik": "2.4.6",
-    "framer-motion": "12.23.12",
+    "@fontsource/inter": "5.2.8",
+    "@mui/lab": "7.0.1-beta.20",
+    "@mui/material": "7.3.6",
+    "@mui/system": "7.3.6",
+    "@vitejs/plugin-react": "5.1.2",
+    "apexcharts": "5.3.6",
+    "formik": "2.4.9",
+    "framer-motion": "12.23.26",
     "iconsax-reactjs": "0.0.8",
-    "lodash-es": "4.17.21",
+    "lodash-es": "4.17.22",
     "prop-types": "15.8.1",
-    "react": "19.1.1",
-    "react-apexcharts": "1.7.0",
+    "react": "19.2.3",
+    "react-apexcharts": "1.9.0",
     "react-device-detect": "2.2.3",
-    "react-dom": "19.1.1",
-    "react-router": "7.8.2",
-    "react-router-dom": "7.8.2",
+    "react-dom": "19.2.3",
+    "react-router": "7.11.0",
+    "react-router-dom": "7.11.0",
     "simplebar-react": "3.3.2",
-    "swr": "2.3.6",
-    "vite": "7.1.3",
+    "swr": "2.3.8",
+    "vite": "7.3.0",
     "vite-jsconfig-paths": "2.0.1",
-    "web-vitals": "5.0.1",
-    "yup": "1.7.0"
+    "web-vitals": "5.1.0",
+    "yup": "1.7.1"
   },
   "scripts": {
     "start": "vite",
@@ -56,17 +56,17 @@
     ]
   },
   "devDependencies": {
-    "@eslint/compat": "1.3.2",
-    "@eslint/eslintrc": "3.3.1",
-    "@eslint/js": "9.34.0",
-    "eslint": "9.34.0",
+    "@eslint/compat": "2.0.0",
+    "@eslint/eslintrc": "3.3.3",
+    "@eslint/js": "9.39.2",
+    "eslint": "9.39.2",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-jsx-a11y": "6.10.2",
     "eslint-plugin-prettier": "5.5.4",
     "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-react-hooks": "5.2.0",
-    "immutable": "5.1.3",
-    "prettier": "3.6.2"
+    "eslint-plugin-react-hooks": "7.0.1",
+    "immutable": "5.1.4",
+    "prettier": "3.7.4"
   },
-  "packageManager": "yarn@4.9.4"
+  "packageManager": "yarn@4.12.0"
 }

react/src/assets/third-party/apex-chart.css

@@ -0,0 +1,42 @@
+.apexcharts-legend-series {
+  gap: 8px;
+}
+
+/* @override - margin bottom depends on marker size in tooltip */
+.apexcharts-tooltip-marker {
+  margin-bottom: 2px !important;
+}
+
+.apexcharts-tooltip-series-group.apexcharts-active,
+.apexcharts-tooltip-series-group:last-child {
+  padding-bottom: 0 !important;
+}
+
+.apexcharts-menu-icon svg,
+.apexcharts-reset-icon svg,
+.apexcharts-zoom-icon svg,
+.apexcharts-zoomin-icon svg,
+.apexcharts-zoomout-icon svg {
+  fill: var(--palette-text-secondary) !important;
+}
+
+.apexcharts-pan-icon svg {
+  stroke: var(--palette-text-secondary) !important;
+  fill: transparent !important;
+}
+
+.apexcharts-zoom-icon.apexcharts-selected svg {
+  fill: var(--palette-primary-main) !important;
+}
+
+.apexcharts-pan-icon.apexcharts-selected svg {
+  stroke: var(--palette-primary-main) !important;
+}
+
+.apexcharts-toolbar .apexcharts-pan-icon:hover:not(.apexcharts-selected) svg {
+  stroke: var(--palette-grey-600) !important;
+}
+
+.apexcharts-toolbar div:hover:not(.apexcharts-selected):not(.apexcharts-pan-icon) svg {
+  fill: var(--palette-grey-600) !important;
+}

react/src/components/@extended/Avatar.jsx

@@ -1,11 +1,12 @@
 import PropTypes from 'prop-types';
 
 // material-ui
-import { alpha, styled } from '@mui/material/styles';
+import { styled } from '@mui/material/styles';
 import MuiAvatar from '@mui/material/Avatar';
 
 // project-imports
 import getColors from 'utils/getColors';
+import { withAlpha } from 'utils/colorUtils';
 
 function getColorStyle({ theme, color, type }) {
   const colors = getColors(theme, color);
@@ -29,12 +30,12 @@ function getColorStyle({ theme, color, type }) {
         color: main,
         border: '1px solid',
         borderColor: light,
-        backgroundColor: alpha(lighter, 0.8)
+        backgroundColor: withAlpha(lighter, 0.8)
       };
     default:
       return {
         color: main,
-        backgroundColor: alpha(lighter, 0.8)
+        backgroundColor: withAlpha(lighter, 0.8)
       };
   }
 }
@@ -113,7 +114,7 @@ const AvatarStyle = styled(MuiAvatar, { shouldForwardProp: (prop) => prop !== 'c
     ...getSizeStyle(size),
     ...getColorStyle({ theme, color, type }),
     ...(size === 'badge' && {
-      borderColor: theme.palette.background.default
+      borderColor: theme.vars.palette.background.default
     })
   })
 );