Refactor code structure for improved readability and maintainability

Author: SMAKSS

eslint.config.js

@@ -1,16 +1,22 @@
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
 import tsParser from '@typescript-eslint/parser';
 import tsPlugin from '@typescript-eslint/eslint-plugin';
 import reactHooksPlugin from 'eslint-plugin-react-hooks';
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
 export default [
   {
-    files: ['**/*.{js,jsx,ts,tsx}'],
     ignores: [
       'dist/**',
       'prettier.config.cjs',
       'lint-staged.config.cjs',
       'commitlint.config.cjs'
-    ],
+    ]
+  },
+  {
+    files: ['**/*.{ts,tsx}'],
     languageOptions: {
       parser: tsParser,
       parserOptions: {
@@ -20,7 +26,7 @@ export default [
         },
         ecmaVersion: 'latest',
         sourceType: 'module',
-        tsconfigRootDir: '.',
+        tsconfigRootDir: __dirname,
         project: ['./tsconfig.json']
       }
     },
@@ -31,15 +37,32 @@ export default [
     rules: {
       'linebreak-style': 'off',
       '@typescript-eslint/no-explicit-any': 'warn',
-      '@typescript-eslint/ban-types': [
-        'error',
-        {
-          extendDefaults: true,
-          types: {
-            '{}': false
-          }
-        }
-      ],
+      'react-hooks/rules-of-hooks': 'error',
+      'react-hooks/exhaustive-deps': 'warn',
+      'object-shorthand': 'error',
+      'no-console': ['warn', { allow: ['warn', 'error', 'info'] }]
+    }
+  },
+  {
+    files: ['**/*.{js,jsx}'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+          modules: true
+        },
+        ecmaVersion: 'latest',
+        sourceType: 'module'
+      }
+    },
+    plugins: {
+      '@typescript-eslint': tsPlugin,
+      'react-hooks': reactHooksPlugin
+    },
+    rules: {
+      'linebreak-style': 'off',
+      '@typescript-eslint/no-explicit-any': 'warn',
       'react-hooks/rules-of-hooks': 'error',
       'react-hooks/exhaustive-deps': 'warn',
       'object-shorthand': 'error',

package.json

@@ -5,22 +5,21 @@
   },
   "description": "Enhance your React apps with advanced scroll detection using @smakss/react-scroll-direction. This powerful hook not only detects scroll direction but also provides scroll position information. Ideal for React, Remix, Next.js, and Gatsby projects, it comes with adjustable sensitivity and supports ES Modules.",
   "devDependencies": {
-    "@commitlint/cli": "^19.3.0",
-    "@commitlint/config-conventional": "^19.2.2",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-typescript": "^11.1.6",
-    "@types/react": "^18.3.3",
-    "@typescript-eslint/eslint-plugin": "^7.17.0",
-    "@typescript-eslint/parser": "^7.17.0",
-    "eslint": "^9.8.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-react-hooks": "^4.6.2",
-    "husky": "^9.1.3",
-    "lint-staged": "^15.2.7",
-    "prettier": "^3.3.3",
-    "rollup": "^4.19.1",
-    "typescript": "^5.5.4"
+    "@commitlint/cli": "^20.4.0",
+    "@commitlint/config-conventional": "^20.4.0",
+    "@types/react": "^19.2.10",
+    "@typescript-eslint/eslint-plugin": "^8.54.0",
+    "@typescript-eslint/parser": "^8.54.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-prettier": "^5.5.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "husky": "^9.1.7",
+    "lint-staged": "^16.2.7",
+    "prettier": "^3.8.1",
+    "typescript": "^5.9.3",
+    "vite": "^6.3.6",
+    "vite-plugin-dts": "^4.5.4"
   },
   "engines": {
     "node": ">=18.0.0"
@@ -59,7 +58,7 @@
     "react scroll direction and position"
   ],
   "license": "MIT",
-  "main": "dist/es/index.js",
+  "main": "dist/index.js",
   "name": "@smakss/react-scroll-direction",
   "peerDependencies": {
     "react": ">=16.8.0"
@@ -71,7 +70,8 @@
   "scripts": {
     "format": "prettier --write \"**/*.+(js|jsx|json|yml|yaml|css|ts|tsx|md|gql|graphql|mdx)\"",
     "format:check": "prettier -l \"**/*.+(js|jsx|json|yml|yaml|css|ts|tsx|md|gql|graphql|mdx)\"",
-    "generate": "rollup -c",
+    "build": "vite build",
+    "generate": "vite build",
     "lint": "npx eslint --cache --cache-location ./node_modules/.cache/.eslintcache --max-warnings=0 .",
     "lint:fix": "npx eslint --fix .",
     "setup": "yarn && husky install",

rollup.config.js

@@ -0,0 +1,26 @@
+import { defineConfig } from 'vite';
+import dts from 'vite-plugin-dts';
+import packageJson from './package.json' assert { type: 'json' };
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: 'src/index.ts',
+      formats: ['es'],
+      fileName: () => 'index.js'
+    },
+    sourcemap: true,
+    rollupOptions: {
+      external: [
+        ...Object.keys(packageJson.peerDependencies || {}),
+        'react/jsx-runtime'
+      ]
+    }
+  },
+  plugins: [
+    dts({
+      entryRoot: 'src',
+      outDir: 'dist'
+    })
+  ]
+});