refactor(general): add esm and cjs exports

package.json

@@ -1,14 +1,26 @@
 {
-  "name": "flowbite-datepicker",
-  "version": "1.2.6",
+  "name": "flowbite-datepicker-1.3.0",
+  "version": "1.3.0",
   "description": "A Tailwind CSS powered datepicker built with vanilla JavaScript and Flowbite",
-  "module": "js/main.js",
+  "main": "dist/main.cjs.js",
+  "module": "dist/main.esm.js",
   "exports": {
-    ".": "./js/main.js",
-    "./Datepicker": "./js/Datepicker.js",
-    "./DateRangePicker": "./js/DateRangePicker.js",
-    "./locales/*": "./js/i18n/locales/*.js",
-    "./locales/": "./js/i18n/locales/"
+    ".": {
+      "require": "./dist/main.cjs.js",
+      "import": "./dist/main.esm.js"
+    },
+    "./Datepicker": {
+      "require": "./dist/Datepicker.cjs.js",
+      "import": "./dist/Datepicker.esm.js"
+    },
+    "./DateRangePicker": {
+      "require": "./dist/DateRangePicker.cjs.js",
+      "import": "./dist/DateRangePicker.esm.js"
+    },
+    "./locales": {
+      "require": "./dist/locales/index.cjs.js",
+      "import": "./dist/locales/index.esm.js"
+    }
   },
   "repository": {
     "type": "git",
@@ -36,7 +48,10 @@
   "author": "Flowbite & Hidenao Miyamoto",
   "license": "MIT",
   "devDependencies": {
-    "@rollup/plugin-node-resolve": "^11.0.1",
+    "@babel/core": "^7.24.7",
+    "@babel/preset-env": "^7.24.7",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^26.0.1",
     "autoprefixer": "^10.4.0",
     "bootstrap4": "npm:bootstrap@^4.5.3",
     "bootstrap5": "npm:bootstrap@^5.0.1",
@@ -57,6 +72,7 @@
     "unexpected": "^12.0.0"
   },
   "dependencies": {
+    "@rollup/plugin-node-resolve": "^15.2.3",
     "flowbite": "^2.0.0"
   }
 }

rollup.config.js

@@ -1,43 +1,60 @@
 import resolve from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+import { babel } from '@rollup/plugin-babel';
 
-const plugins = [
-  resolve(),
-];
-
-module.exports = [
+export default [
   {
-    input: 'js/Datepicker.js',
-    output: {
-      file: 'dist/js/datepicker.js',
-      format: 'iife',
-      name: 'Datepicker',
-    },
-    plugins,
+    input: 'js/main.js',
+    output: [
+      {
+        file: 'dist/main.cjs.js',
+        format: 'cjs',
+      },
+      {
+        file: 'dist/main.esm.js',
+        format: 'es',
+      },
+    ],
+    plugins: [
+      resolve(),
+      commonjs(),
+      babel({ babelHelpers: 'bundled', presets: ['@babel/preset-env'] }),
+    ],
   },
   {
-    input: 'js/datepicker-full.js',
-    output: {
-      file: 'dist/js/datepicker-full.js',
-      format: 'iife',
-    },
-    plugins,
-  },
-  {
-    input: 'js/lib/date.js',
-    output: {
-      file: 'test/_utils/date.js',
-      name: 'dateUtils',
-      format: 'iife'
-    },
-    plugins,
+    input: 'js/Datepicker.js',
+    output: [
+      {
+        file: 'dist/Datepicker.cjs.js',
+        format: 'cjs',
+      },
+      {
+        file: 'dist/Datepicker.esm.js',
+        format: 'es',
+      },
+    ],
+    plugins: [
+      resolve(),
+      commonjs(),
+      babel({ babelHelpers: 'bundled', presets: ['@babel/preset-env'] }),
+    ],
   },
   {
-    input: 'js/lib/dom.js',
-    output: {
-      file: 'test/_utils/dom.js',
-      name: 'domUtils',
-      format: 'iife'
-    },
-    plugins,
-  },
+    input: 'js/DateRangePicker.js',
+    output: [
+      {
+        file: 'dist/DateRangePicker.cjs.js',
+        format: 'cjs',
+      },
+      {
+        file: 'dist/DateRangePicker.esm.js',
+        format: 'es',
+      },
+    ],
+    plugins: [
+      resolve(),
+      commonjs(),
+      babel({ babelHelpers: 'bundled', presets: ['@babel/preset-env'] }),
+    ],
+  }
 ];