fix: improve vite/esm compatibility

Author: phDooY

package.json

@@ -2,9 +2,21 @@
   "name": "@files-ui/react",
   "version": "1.2.3",
   "description": "UI components for file uploads with React js",
+  "type": "module",
   "main": "./build/index.js",
   "module": "./build/index.es.js",
   "types": "./build/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./build/index.d.ts",
+      "import": "./build/index.es.js",
+      "require": "./build/index.js"
+    }
+  },
+  "files": [
+    "build"
+  ],
+  "sideEffects": false,
   "scripts": {
     "build": "rollup -c",
     "test": "jest"

rollup.config.js

@@ -3,35 +3,44 @@ import resolve from "@rollup/plugin-node-resolve";
 import peerDepsExternal from "rollup-plugin-peer-deps-external";
 import typescript from "rollup-plugin-typescript2";
 import sass from "rollup-plugin-sass";
-import packageJson from "./package.json";
-//import jsx from 'rollup-plugin-jsx'
-//import json from "rollup-plugin-json";
-//import { terser } from "rollup-plugin-terser";
+import { terser } from "rollup-plugin-terser";
+import { createRequire } from 'module';
+const require = createRequire(import.meta.url);
+const packageJson = require('./package.json');
+
 export default {
   input: "./src/index.ts",
   output: [
     {
       file: packageJson.main,
       format: "cjs",
       sourcemap: true,
+      exports: "named",
     },
     {
       file: packageJson.module,
       format: "esm",
       sourcemap: true,
+      exports: "named",
     },
   ],
   plugins: [
     sass({ insert: true }),
-    
     peerDepsExternal(),
-    resolve(
-     // { preferBuiltins: true, mainFields: ['browser'] }
-      ),
-    commonjs(),
-    typescript(),
-    //terser(),
-    //json(),
-    // jsx( {factory: 'React.createElement'} ),
+    resolve({
+      extensions: [".ts", ".tsx", ".js", ".jsx"],
+      preferBuiltins: true,
+      mainFields: ["module", "main", "browser"],
+    }),
+    commonjs({
+      include: /node_modules/,
+      extensions: [".js", ".ts"],
+    }),
+    typescript({
+      tsconfig: "./tsconfig.json",
+      clean: true,
+    }),
+    terser(),
   ],
+  external: ["react", "react-dom"],
 };