diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 8035107..9fd2dd6 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -9,10 +9,10 @@ jobs:
   build-deploy:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
-    - uses: actions/setup-node@v3
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
       with:
-        node-version: '18'
+        node-version: '22'
 
     - name: Setup Yarn
       run: |
@@ -24,12 +24,12 @@ jobs:
       run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT
 
     - name: Cache node modules
-      uses: actions/cache@v3
+      uses: actions/cache@v4
       with:
         path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-        key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+        key: ${{ runner.os }}-node-22-yarn-${{ hashFiles('**/yarn.lock') }}
         restore-keys: |
-          ${{ runner.os }}-yarn-
+          ${{ runner.os }}-node-22-yarn-
 
     - name: Install dependencies
       run: yarn install
diff --git a/libName.js b/libName.cjs
similarity index 100%
rename from libName.js
rename to libName.cjs
diff --git a/package.json b/package.json
index 9959ce9..3c9feb2 100644
--- a/package.json
+++ b/package.json
@@ -1,9 +1,9 @@
 {
   "name": "@itseasy21/react-elastic-carousel",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "A flexible and responsive carousel component for react",
   "author": "itseasy21",
-  "type": "commonjs",
+  "type": "module",
   "contributors": [
     {
       "name": "sag1v (Sagiv Ben Giat)"
@@ -17,6 +17,13 @@
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
   "jsnext:main": "dist/index.es.js",
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
diff --git a/rollup.config.js b/rollup.config.js
index bc09aa9..5328842 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -12,7 +12,7 @@ import fs from "fs";
 const pkg = JSON.parse(fs.readFileSync("./package.json", "utf8"));
 
 // Use require for libName since it's a CommonJS module
-const libName = require("./libName");
+const libName = require("./libName.cjs");
 
 export default defineConfig({
   input: `src/${libName}/index.js`,
@@ -21,12 +21,15 @@ export default defineConfig({
       file: pkg.main,
       format: "cjs",
       sourcemap: true,
-      exports: "named"
+      exports: "named",
+      esModule: false,
+      interop: "auto"
     },
     {
       file: pkg.module,
       format: "es",
-      sourcemap: true
+      sourcemap: true,
+      exports: "named"
     }
   ],
   plugins: [
@@ -43,15 +46,20 @@ export default defineConfig({
     babel({
       exclude: "node_modules/**",
       babelHelpers: "runtime",
-      presets: ["@babel/preset-env", "@babel/preset-react"],
+      presets: [
+        ["@babel/preset-env", { modules: false }],
+        ["@babel/preset-react", { runtime: "automatic" }]
+      ],
       plugins: ["@babel/plugin-transform-runtime"]
     }),
     nodeResolve({
-      browser: true
+      browser: true,
+      extensions: [".js", ".jsx"]
     }),
     commonjs({
       include: "node_modules/**",
-      requireReturnsDefault: "auto"
+      requireReturnsDefault: "auto",
+      transformMixedEsModules: true
     }),
     copy({
       targets: [{ src: `src/${libName}/index.d.ts`, dest: "dist" }]