Should not be an error when importing non-React functions in non-Reac…

…t projects

CHANGELOG.md

@@ -1,3 +1,21 @@
+# 4.2.2 (2024-08-04)
+
+- The `Face` React component should now be imported as:
+
+  ```javascript
+  // New correct way
+  import { Face } from "facesjs/react";
+  ```
+
+  Rather than the way it was imported in version 4.2.0:
+
+  ```javascript
+  // Old wrong way
+  import { Face } from "facesjs";
+  ```
+
+  The reason is because version 4.2.0 broke importing other facesjs exports in some non-React projects.
+
 # 4.2.1 (2024-05-15)
 
 - #47 - Restore the "shave" facial feature option to the editor, which was accidentally removed in v4.1.0.

README.md

@@ -86,7 +86,8 @@ const face = generate(undefined, { gender: "female", race: "asian" });
 You can use the `display` function within any frontend JS framework, but for ease of use with the most popular one, this package includes a `Face` component for React.
 
 ```javascript
-import { Face, generate } from "facesjs";
+import { generate } from "facesjs";
+import { Face } from "facesjs/react";
 import { useEffect } from "react";
 
 export const MyFace = ({ face }) => {

package.json

@@ -91,13 +91,25 @@
     }
   },
   "exports": {
-    "import": {
-      "types": "./build/esmodules/index.d.ts",
-      "default": "./build/esmodules/index.js"
+    ".": {
+      "import": {
+        "types": "./build/esmodules/index.d.ts",
+        "default": "./build/esmodules/index.js"
+      },
+      "require": {
+        "types": "./build/commonjs/index.d.ts",
+        "default": "./build/commonjs/index.js"
+      }
     },
-    "require": {
-      "types": "./build/commonjs/index.d.ts",
-      "default": "./build/commonjs/index.js"
+    "./react": {
+      "import": {
+        "types": "./build/esmodules/Face.d.ts",
+        "default": "./build/esmodules/Face.js"
+      },
+      "require": {
+        "types": "./build/commonjs/Face.d.ts",
+        "default": "./build/commonjs/Face.js"
+      }
     }
   },
   "main": "./build/commonjs/index.js",

src/index.ts

@@ -1,7 +1,6 @@
 export { display } from "./display.js";
 export { generate } from "./generate.js";
 export { faceToSvgString } from "./faceToSvgString.js";
-export { Face } from "./Face.js";
 
 // Usually not needed, but just in case...
 export { default as svgs } from "./svgs.js";