Merge pull request #22 from creativetimofficial/feature/v4.0.0

Feature/v4.0.0

.env

@@ -0,0 +1 @@
+GENERATE_SOURCEMAP=false

.eslintrc.json

@@ -3,32 +3,30 @@
     "browser": true,
     "es2021": true
   },
-  "extends": ["plugin:react/recommended", "airbnb", "prettier"],
+  "extends": ["plugin:react/recommended", "prettier"],
   "parserOptions": {
     "ecmaFeatures": {
       "jsx": true
     },
     "ecmaVersion": 12,
     "sourceType": "module"
   },
-  "plugins": ["react", "prettier"],
+  "plugins": ["react", "react-hooks", "import", "prettier"],
   "rules": {
-    "prettier/prettier": [
-      "error",
-      {
-        "endOfLine": "auto"
-      }
-    ],
-    "default-param-last": "off",
-    "react/react-in-jsx-scope": "off",
     "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
-    "react/jsx-props-no-spreading": [
-      1,
-      {
-        "custom": "ignore"
-      }
-    ],
-    "react/jsx-curly-spacing": [2, "never"]
+    "react/require-default-props": "off",
+    "no-param-reassign": "off",
+    "jsx-a11y/alt-text": "off",
+    "react/react-in-jsx-scope": "off",
+    "react/display-name": "off"
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    },
+    "import/resolver": { "node": { "moduleDirectory": ["node_modules", "src/"] } }
   },
-  "settings": { "import/resolver": { "node": { "paths": ["src"] } } }
+  "globals": {
+    "JSX": true
+  }
 }

CHANGELOG.md

@@ -1,11 +1,19 @@
 # Change Log
 
+## [4.0.0] 2022-07-04
+
+- Rename components prefix from Sui to Soft.
+- Update dependencies.
+- Fix the peer dependencies issue.
+- Fix the eslint issue with react-app.
+- Migrate eslint config from airbnb to react-app.
+
 ## [3.1.0] 2022-03-04
 
 ### Bug fixing
 
 - Momoized the context provider values
-- Fix the conditionally used of useContext for SuiPagination component
+- Fix the conditionally used of useContext for SoftPagination component
 - Fix the import/no-anonymouse-default-export
 
 ### Major style changes
@@ -54,12 +62,12 @@ There is a warnings related to the stylis-plugin-rtl dependency that won't affec
 - The `box-shadow`, `border-radius` and `typography` `regular` size renamed to `md` for theme
 - The `backgroundColor` prop renamed to `bgColor` for components
 - The `boxShadow` prop renamed to `shadow` for components
-- SuiBox `backgroundGradient` prop replaced with `variant: ["contained", "gradient"]`
-- SuiButton `buttonColor` prop renamed to `color`
-- SuiBadge `size` prop updated to ["xs", "sm", "md", "lg"]
-- SuiInput `withIcon` prop renamed to `icon`
-- SuiProgress `gradient` prop replaced with `variant: ["contained", "gradient"]`
-- SuiTypography `textColor` prop renamed to `color`
+- SoftBox `backgroundGradient` prop replaced with `variant: ["contained", "gradient"]`
+- SoftButton `buttonColor` prop renamed to `color`
+- SoftBadge `size` prop updated to ["xs", "sm", "md", "lg"]
+- SoftInput `withIcon` prop renamed to `icon`
+- SoftProgress `gradient` prop replaced with `variant: ["contained", "gradient"]`
+- SoftTypography `textColor` prop renamed to `color`
 - Sidenav is more dynamic now, color, brand, brandName props are added
 
 ### Deleted components

README.md

@@ -1,6 +1,6 @@
 # [Soft UI Dashboard React](http://demos.creative-tim.com/soft-ui-dashboard-react/#/dashboard?ref=readme-sudr) [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?url=https://www.creative-tim.com/product/soft-ui-dashboard-react&text=Check%20Soft%20UI%20Dashboard%20react%20made%20by%20@CreativeTim%20#webdesign%20#dashboard%20#softdesign%20#react%20https://www.creative-tim.com/product/soft-ui-dashboard-react)
 
-![version](https://img.shields.io/badge/version-3.0.0-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-dashboard-react.svg)](https://github.com/creativetimofficial/soft-ui-dashboard-react/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-dashboard-react.svg)](https://github.com/creativetimofficial/soft-ui-dashboard-react/issues?q=is%3Aissue+is%3Aclosed)
+![version](https://img.shields.io/badge/version-4.0.0-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-dashboard-react.svg)](https://github.com/creativetimofficial/soft-ui-dashboard-react/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-dashboard-react.svg)](https://github.com/creativetimofficial/soft-ui-dashboard-react/issues?q=is%3Aissue+is%3Aclosed)
 
 ![Image](https://s3.amazonaws.com/creativetim_bucket/products/500/original/soft-ui-dashboard-material-ui.jpg)
 
@@ -110,15 +110,15 @@ soft-ui-dashboard-react
     │   │       ├── index.js
     │   │       └── theme-rtl.js
     │   ├── components
-    │   │   ├── SuiAlert
-    │   │   ├── SuiAvatar
-    │   │   ├── SuiBadge
-    │   │   ├── SuiBox
-    │   │   ├── SuiButton
-    │   │   ├── SuiInput
-    │   │   ├── SuiPagination
-    │   │   ├── SuiProgress
-    │   │   └── SuiTypography
+    │   │   ├── SoftAlert
+    │   │   ├── SoftAvatar
+    │   │   ├── SoftBadge
+    │   │   ├── SoftBox
+    │   │   ├── SoftButton
+    │   │   ├── SoftInput
+    │   │   ├── SoftPagination
+    │   │   ├── SoftProgress
+    │   │   └── SoftTypography
     │   ├── context
     │   ├── examples
     │   │   ├── Breadcrumbs

package.json

@@ -1,10 +1,9 @@
 {
   "name": "soft-ui-dashboard-react",
-  "version": "3.1.0",
+  "version": "4.0.0",
   "author": "Creative Tim",
   "license": "SEE LICENSE IN <https://www.creative-tim.com/license>",
   "description": "ReactJS version of Soft UI Dashboard by Creative Tim",
-  "homepage": "https://demos.creative-tim.com/soft-ui-dashboard-react/#/",
   "bugs": {
     "url": "https://github.com/creativetimofficial/soft-ui-dashboard-react/issues"
   },
@@ -17,27 +16,26 @@
     "npm": ">=6"
   },
   "dependencies": {
-    "@emotion/cache": "11.7.1",
-    "@emotion/react": "11.8.1",
-    "@emotion/styled": "11.8.1",
-    "@mui/icons-material": "5.4.2",
-    "@mui/material": "5.4.3",
-    "@mui/styled-engine": "5.4.2",
-    "@testing-library/jest-dom": "5.16.2",
-    "@testing-library/react": "12.1.3",
-    "@testing-library/user-event": "13.5.0",
+    "@emotion/cache": "11.9.3",
+    "@emotion/react": "11.9.3",
+    "@emotion/styled": "11.9.3",
+    "@mui/icons-material": "5.8.4",
+    "@mui/material": "5.8.6",
+    "@mui/styled-engine": "5.8.0",
+    "@testing-library/jest-dom": "5.16.4",
+    "@testing-library/react": "13.3.0",
+    "@testing-library/user-event": "14.2.1",
     "chart.js": "3.4.1",
     "chroma-js": "2.4.2",
     "prop-types": "15.8.1",
-    "react": "17.0.2",
+    "react": "18.2.0",
     "react-chartjs-2": "3.0.4",
-    "react-countup": "6.1.1",
-    "react-dom": "17.0.2",
-    "react-flatpickr": "3.10.7",
-    "react-github-btn": "1.2.1",
-    "react-router-dom": "6.2.1",
-    "react-scripts": "5.0.0",
-    "stylis": "4.0.13",
+    "react-countup": "6.3.0",
+    "react-dom": "18.2.0",
+    "react-flatpickr": "3.10.13",
+    "react-router-dom": "6.3.0",
+    "react-scripts": "5.0.1",
+    "stylis": "4.1.1",
     "stylis-plugin-rtl": "2.1.1",
     "uuid": "8.3.2",
     "web-vitals": "2.1.4"
@@ -69,14 +67,12 @@
     ]
   },
   "devDependencies": {
-    "eslint": "8.10.0",
-    "eslint-config-airbnb": "19.0.4",
-    "eslint-config-prettier": "8.4.0",
-    "eslint-plugin-import": "2.25.4",
-    "eslint-plugin-jsx-a11y": "6.5.1",
-    "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-react": "7.28.0",
-    "eslint-plugin-react-hooks": "4.3.0",
-    "prettier": "2.5.1"
+    "eslint": "8.18.0",
+    "eslint-config-prettier": "8.5.0",
+    "eslint-plugin-import": "2.26.0",
+    "eslint-plugin-prettier": "4.2.1",
+    "eslint-plugin-react": "7.30.1",
+    "eslint-plugin-react-hooks": "4.6.0",
+    "prettier": "2.7.1"
   }
 }

public/index.html

@@ -37,6 +37,7 @@
       href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp"
       rel="stylesheet"
     />
+    <script async defer src="https://buttons.github.io/buttons.js"></script>
   </head>
 
   <body>

src/App.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react
@@ -24,7 +24,7 @@ import CssBaseline from "@mui/material/CssBaseline";
 import Icon from "@mui/material/Icon";
 
 // Soft UI Dashboard React components
-import SuiBox from "components/SuiBox";
+import SoftBox from "components/SoftBox";
 
 // Soft UI Dashboard React examples
 import Sidenav from "examples/Sidenav";
@@ -109,7 +109,7 @@ export default function App() {
     });
 
   const configsButton = (
-    <SuiBox
+    <SoftBox
       display="flex"
       justifyContent="center"
       alignItems="center"
@@ -129,7 +129,7 @@ export default function App() {
       <Icon fontSize="default" color="inherit">
         settings
       </Icon>
-    </SuiBox>
+    </SoftBox>
   );
 
   return direction === "rtl" ? (

src/assets/theme/functions/boxShadow.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/functions/gradientChartLine.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/functions/hexToRgb.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/functions/linearGradient.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/functions/pxToRem.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/functions/rgba.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/index.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/assets/theme/theme-rtl.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/components/SuiAlert/SuiAlertCloseIcon.js → src/components/SoftAlert/SoftAlertCloseIcon.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react

src/components/SuiAlert/SuiAlertRoot.js → src/components/SoftAlert/SoftAlertRoot.js

@@ -1,6 +1,6 @@
 /**
 =========================================================
-* Soft UI Dashboard React - v3.1.0
+* Soft UI Dashboard React - v4.0.0
 =========================================================
 
 * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard-react