Merge pull request #1 from iChristwin/rollup

fixed , ready for release

Author: iChristwin

docs/img/M3ter-head.svg

@@ -1,31 +1,33 @@
-
 ## M3ter Head
-<p align="center"><img src='./img/M3ter-head.svg'/></p>
+
 Avatars to infuse a touch of whimsy and individuality into the M3tering Protocol. Generate one-of-a-kind SVG avatars that serve as distinctive visual representations for device DIDs and blockchain address strings commonly encountered in the M3tering Protocol.
 
 ### Usage:
 
 1. Import the `M3terHead` component into your React code:
 
    ```javascript
-   import * as React from 'react';
-   import M3terHead from 'm3ters';
+   import * as React from "react";
+   import { M3terHead } from "m3ters";
    ```
 
 2. Render the avatar within your component, providing a unique seed string for generation:
 
    ```jsx
-   export default class MyComponent extends React.Component {
-     render() {
-       return (
-         <div>
-           <M3terHead seed={"device_DID_string"} />
-         </div>
-       );
-     }
+   export default function Home() {
+     return (
+       <>
+         <M3terHead seed={"device_DID_string"} />
+       </>
+     );
    }
    ```
+
+3. Your browser should render an SVG image like the one shown below
+<p align="center"><img src='./img/M3ter-head.svg'/></p>
+
 ## Credits
+
 Inspired by the charming [Bottts](https://bottts.com/) designed by [Pablo Stanley](https://twitter.com/pablostanley) and adapted from Magnusson's [Bottts Maker 🤖](https://github.com/magnusson/bottts-maker).
 
 ## Licensing

docs/m3ter-head.md

@@ -41,6 +41,7 @@
     "rollup": "rollup -c"
   },
   "type": "module",
+  "source": "src/index.js",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
   "files": [

package-lock.json

@@ -6,7 +6,7 @@ import terser from "@rollup/plugin-terser";
 export default [
   {
     input: "src/index.js",
-    external: ["react", "react-dom", "seedrandom"],
+    external: [/@babel\/core/, /@babel\/preset-react/, /react/, /react-dom/],
     output: [
       {
         file: "dist/index.cjs",
@@ -19,16 +19,16 @@ export default [
       },
     ],
     plugins: [
-      babel({
-        exclude: "node_modules/**",
-        presets: ["@babel/preset-react"],
-        babelHelpers: "bundled",
-      }),
       resolve({
         moduleDirectories: ["node_modules", "src"],
         extensions: [".js", ".jsx"],
       }),
       commonjs(),
+      babel({
+        exclude: "node_modules/**",
+        presets: ["@babel/preset-react"],
+        babelHelpers: "bundled",
+      }),
       terser(),
     ],
   },

package.json

@@ -1 +1,3 @@
+import React from 'react';
+
 export * from "./M3terHead.jsx";

rollup.config.js

@@ -1 +1,3 @@
+import React from 'react';
+
 export * from "./components";

src/components/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export { Arturito } from "./Arturito";
 export { Bulging } from "./Bulging";
 export { Dizzy } from "./Dizzy";

src/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export { Arturito } from "./Arturito";
 export { Bite } from "./Bite";
 export { Diagram } from "./Diagram";

src/parts/Eyes/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export { Camo1 } from "./Camo1";
 export { Camo2 } from "./Camo2";
 export { Dirty1 } from "./Dirty1";