Vite implementation

Author: mavdryk

.babelrc

@@ -48,8 +48,8 @@ const getVersionFromBranch = branch => {
 const currentBranchVersion = getVersionFromBranch(currentBranch)
 const targetBranchVersion = getVersionFromBranch(`remotes/origin/${targetBranch}`)
 
-console.log(`Version in branch ${currentBranch}: ${currentBranchVersion}`)
-console.log(`Version in branch ${targetBranch}: ${targetBranchVersion}`)
+console.info(`Version in branch ${currentBranch}: ${currentBranchVersion}`)
+console.info(`Version in branch ${targetBranch}: ${targetBranchVersion}`)
 
 const isVersionGreater = (targetBranchVersion, currentBranchVersion) => {
   const parseVersion = version => version.split('.').map(Number)
@@ -65,7 +65,7 @@ const isVersionGreater = (targetBranchVersion, currentBranchVersion) => {
 }
 
 if (isVersionGreater(targetBranchVersion, currentBranchVersion)) {
-  console.log(
+  console.info(
     `\x1b[32mCurrent version (${currentBranchVersion}) is greater than the target version (${targetBranchVersion}).\x1b[0m`
   )
   process.exit(0)

.eslintignore

@@ -0,0 +1,7 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "printWidth": 100,
+  "arrowParens": "avoid"
+}

.eslintrc.js

@@ -23,8 +23,7 @@ module.exports = {
   addons: [
     '@storybook/addon-links',
     '@storybook/addon-essentials',
-    '@storybook/addon-interactions',
-    '@storybook/preset-create-react-app'
+    '@storybook/addon-interactions'
   ],
   framework: '@storybook/react',
   core: {

.github/comparePackageVersions.js

@@ -0,0 +1,42 @@
+import eslintConfigPrettier from 'eslint-config-prettier'
+import globals from 'globals'
+import js from '@eslint/js'
+import react from 'eslint-plugin-react'
+import reactHooks from 'eslint-plugin-react-hooks'
+
+export default [
+  { ignores: ['dist'] },
+  js.configs.recommended,
+  eslintConfigPrettier,
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2021,
+      globals: globals.browser,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
+      }
+    },
+    plugins: {
+      react: react,
+      'react-hooks': reactHooks
+    },
+    settings: {
+      react: {
+        version: 'detect'
+      }
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      ...react.configs.recommended.rules,
+      'react/react-in-jsx-scope': 'off',
+      quotes: ['error', 'single', { avoidEscape: true, allowTemplateLiterals: false }],
+      semi: ['error', 'never'],
+      'no-unused-vars': process.env.NODE_ENV === 'production' ? 2 : 1,
+      'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+      'no-console': process.env.NODE_ENV === 'production' ? 2 : 0
+    }
+  }
+]

.prettierrc

@@ -1,111 +1,118 @@
 {
-    "name": "iguazio.dashboard-react-controls",
-    "version": "2.2.20",
-    "description": "Collection of resources (such as CSS styles, fonts and images) and ReactJS 17.x components to share among different Iguazio React repos.",
-    "main": "dist/index.js",
-    "module": "dist/index.js",
-    "files": [
-        "dist",
-        "README.md"
-    ],
-    "repository": {
-        "type": "git",
-        "url": "[email protected]:iguazio/dashboard-react-controls.git"
+  "name": "iguazio.dashboard-react-controls",
+  "version": "2.2.20",
+  "description": "Collection of resources (such as CSS styles, fonts and images) and ReactJS 17.x components to share among different Iguazio React repos.",
+  "module": "./dist/index.mjs",
+  "main": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "types": "./dist/index.d.ts"
     },
-    "keywords": [
-        "Iguazio",
-        "iguazio",
-        "MLRun",
-        "mlrun"
+    "./components": "./dist/components/index.mjs",
+    "./elements": "./dist/elements/index.mjs",
+    "./hooks": "./dist/hooks/index.mjs",
+    "./constants": "./dist/constants.mjs",
+    "./types": "./dist/types.mjs",
+    "./utils": "./dist/utils/index.mjs",
+    "./utils/*": "./dist/utils/*",
+    "./images/*": "./dist/images/*",
+    "./scss/*": "./dist/scss/*",
+    "./index.css": "./dist/index.css"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "[email protected]:iguazio/dashboard-react-controls.git"
+  },
+  "keywords": [
+    "Iguazio",
+    "iguazio",
+    "MLRun",
+    "mlrun"
+  ],
+  "peerDependencies": {
+    "classnames": "*",
+    "final-form": "*",
+    "final-form-arrays": "*",
+    "lodash": "*",
+    "prop-types": "*",
+    "react": "*",
+    "react-dom": "*",
+    "react-final-form": "*",
+    "react-final-form-arrays": "*",
+    "react-modal-promise": "*",
+    "react-transition-group": "*"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.19.0",
+    "@storybook/addon-actions": "^8.0.0",
+    "@storybook/addon-essentials": "^8.0.0",
+    "@storybook/addon-interactions": "^8.0.0",
+    "@storybook/addon-links": "^8.0.0",
+    "@storybook/builder-webpack5": "^8.0.0",
+    "@storybook/manager-webpack5": "^6.5.16",
+    "@storybook/react": "^8.0.0",
+    "@storybook/testing-library": "0.2.2",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "classnames": "^2.3.1",
+    "cross-env": "^7.0.3",
+    "eslint": "^9.13.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-refresh": "^0.4.14",
+    "final-form": "^4.20.10",
+    "final-form-arrays": "^3.1.0",
+    "globals": "^15.14.0",
+    "lodash": "^4.17.21",
+    "node": "21.6.2",
+    "prettier": "3.3.3",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-final-form": "^6.5.9",
+    "react-final-form-arrays": "^3.1.4",
+    "react-modal-promise": "^1.0.2",
+    "react-transition-group": "^4.4.5",
+    "sass": "^1.72.0",
+    "tsup": "^8.3.6",
+    "typescript": "^5.7.3",
+    "typescript-eslint": "^8.11.0",
+    "vite": "^6.0.11",
+    "vite-plugin-commonjs": "^0.10.4",
+    "vite-plugin-eslint": "^1.8.1",
+    "vite-plugin-static-copy": "^2.2.0",
+    "vite-plugin-svgr": "^4.3.0"
+  },
+  "scripts": {
+    "lint": "eslint 'src/**/*.{js,jsx}' --quiet",
+    "lint:fix": "eslint 'src/**/*.{js,jsx}' --fix",
+    "prettier": "prettier --check 'src/**/*.{js,jsx,scss}'",
+    "prettier:fix": "prettier --write 'src/**/*.{js,jsx,scss}'",
+    "build-storybook": "build-storybook",
+    "storybook": "start-storybook -p 6006",
+    "start": "vite",
+    "build": "vite build && npx tsc",
+    "compile": "cross-env NODE_ENV=development vite build && npx tsc",
+    "serve": "vite preview"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
     ],
-    "peerDependencies": {
-        "classnames": "*",
-        "final-form": "*",
-        "final-form-arrays": "*",
-        "lodash": "*",
-        "prop-types": "*",
-        "react": "*",
-        "react-dom": "*",
-        "react-final-form": "*",
-        "react-final-form-arrays": "*",
-        "react-modal-promise": "*",
-        "react-transition-group": "*"
-    },
-    "devDependencies": {
-        "@babel/cli": "^7.17.6",
-        "@babel/core": "^7.17.9",
-        "@babel/eslint-parser": "^7.17.0",
-        "@babel/plugin-transform-react-jsx": "^7.17.3",
-        "@babel/preset-env": "^7.16.11",
-        "@babel/preset-react": "^7.23.3",
-        "@storybook/addon-actions": "^8.0.0",
-        "@storybook/addon-essentials": "^8.0.0",
-        "@storybook/addon-interactions": "^8.0.0",
-        "@storybook/addon-links": "^8.0.0",
-        "@storybook/builder-webpack5": "^8.0.0",
-        "@storybook/manager-webpack5": "^6.5.16",
-        "@storybook/preset-create-react-app": "^8.0.0",
-        "@storybook/react": "^8.0.0",
-        "@storybook/testing-library": "0.2.2",
-        "@testing-library/jest-dom": "^6.4.2",
-        "@testing-library/react": "^14.2.1",
-        "@testing-library/user-event": "^14.5.2",
-        "babel-loader": "^8.2.4",
-        "babel-plugin-inline-react-svg": "^2.0.1",
-        "classnames": "^2.3.1",
-        "cross-env": "^7.0.3",
-        "eslint": "^8.57.0",
-        "eslint-config-prettier": "^9.1.0",
-        "eslint-config-react-app": "^7.0.1",
-        "eslint-plugin-prettier": "^5.1.3",
-        "eslint-plugin-storybook": "^0.8.0",
-        "eslint-webpack-plugin": "^4.0.1",
-        "final-form": "^4.20.10",
-        "final-form-arrays": "^3.1.0",
-        "lodash": "^4.17.21",
-        "node": "21.6.2",
-        "prettier": "3.2.5",
-        "prop-types": "^15.8.1",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "react-final-form": "^6.5.9",
-        "react-final-form-arrays": "^3.1.4",
-        "react-modal-promise": "^1.0.2",
-        "react-scripts": "5.0.1",
-        "react-transition-group": "^4.4.5",
-        "sass": "^1.50.0",
-        "web-vitals": "^2.1.4",
-        "webpack": "^5.94.0"
-    },
-    "scripts": {
-        "start": "react-scripts start",
-        "build": "react-scripts build",
-        "lint": "eslint 'src/**/*.{js,jsx}' --quiet",
-        "lint:fix": "eslint 'src/**/*.{js,jsx}' --fix",
-        "prettier": "prettier --check 'src/**/*.{js,jsx,scss}'",
-        "prettier:fix": "prettier --write 'src/**/*.{js,jsx,scss}'",
-        "test": "react-scripts test",
-        "eject": "react-scripts eject",
-        "build-storybook": "build-storybook",
-        "storybook": "start-storybook -p 6006",
-        "compile": "rm -rf dist/* && babel src/lib --out-dir dist --copy-files --no-copy-ignored --ignore src/**/*.stories.js"
-    },
-    "eslintConfig": {
-        "extends": [
-            "react-app",
-            "react-app/jest"
-        ]
-    },
-    "browserslist": {
-        "production": [
-            ">0.2%",
-            "not dead",
-            "not op_mini all"
-        ],
-        "development": [
-            "last 1 chrome version",
-            "last 1 firefox version",
-            "last 1 safari version"
-        ]
-    }
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
 }