Fixed microbundle

.npmignore

@@ -3,12 +3,12 @@ coverage
 documentation.md
 assets
 src
-
+*.map
 .babelrc
 .eslintrc
 .flowconfig
 webpack.*.js
 .travis.yml
 .vscode
 example
-license.md
+license.md

.travis.yml

@@ -11,6 +11,7 @@ before_install:
   - npm i
 before_script:
   - npm prune
+  - rm dist -rf
 script:
   - npm run build
   - npm run test

package.json

@@ -4,18 +4,20 @@
   "description": "(ﾉ´ヮ´)ﾉ*:･ﾟ✧ A super easy animation library for React.",
   "typings": "dist/react-anime.d.ts",
   "types": "dist/react-anime.d.ts",
-  "source": "src/react-anime.ts",
+  "source": "src/react-anime.tsx",
   "main": "dist/react-anime.js",
   "module": "dist/react-anime.module.js",
   "unpkg": "dist/react-anime.umd.js",
+  "exports": "./dist/react-anime.modern.js",
   "scripts": {
+    "start": "npm run build",
     "pretest": "jest -u",
     "test": "jest --coverage",
     "tsc": "tsc",
     "lint": "eslint ./src/**/*.ts",
     "prettier": "prettier --config .prettierrc.js --write \"src/**/*.{ts,tsx,js,json}\"",
     "coverage": "nyc npm test && nyc report --reporter=lcov && codecov",
-    "build": "microbundle src/react-anime.tsx -f cjs,es,modern,umd --target web --jsx React.createElement --compress",
+    "build": "microbundle --jsx React.createElement --compress",
     "dev": "microbundle watch"
   },
   "jest": {
@@ -73,8 +75,9 @@
     "@babel/preset-env": "^7.13.9",
     "@babel/preset-react": "^7.12.13",
     "@babel/preset-typescript": "^7.13.0",
-    "@types/animejs": "^3.1.x",
-    "@types/react": "^17.0.x",
+    "@types/animejs": "^3.1.2",
+    "@types/jest": "^26.0.20",
+    "@types/react": "^17.0.2",
     "@types/react-test-renderer": "^17.0.x",
     "@typescript-eslint/eslint-plugin": "^4.16.x",
     "@typescript-eslint/parser": "^4.16.x",

src/react-anime.tsx

@@ -1,7 +1,90 @@
 // eslint-disable-next-line
 import React, { Fragment, useRef, useCallback, useEffect } from 'react';
 import animejs, { AnimeInstance } from 'animejs';
-import { AnimeProps } from './types';
+
+export type Easing =
+  | 'easeInSine'
+  | 'easeOutSine'
+  | 'easeInOutSine'
+  | 'easeInCirc'
+  | 'easeOutCirc'
+  | 'easeInOutCirc'
+  | 'easeInElastic'
+  | 'easeOutElastic'
+  | 'easeInOutElastic'
+  | 'easeInBack'
+  | 'easeOutBack'
+  | 'easeInOutBack'
+  | 'easeInBounce'
+  | 'easeOutBounce'
+  | 'easeInOutBounce'
+  | 'easeInQuad'
+  | 'easeOutQuad'
+  | 'easeInOutQuad'
+  | 'easeInCubic'
+  | 'easeOutCubic'
+  | 'easeInOutCubic'
+  | 'easeInQuart'
+  | 'easeOutQuart'
+  | 'easeInOutQuart'
+  | 'easeInQuint'
+  | 'easeOutQuint'
+  | 'easeInOutQuint'
+  | 'easeInExpo'
+  | 'easeOutExpo'
+  | 'easeInOutExpo'
+  | 'linear'
+  | [number, number, number, number];
+
+export type AnimeValue =
+  | {
+      value: string | number;
+      delay: ((el: Element, index?: number, len?: number) => number) | number;
+      duration?:
+        | ((el: Element, index?: number, len?: number) => number)
+        | number;
+      easing?: Easing;
+    }
+  | string
+  | number
+  | ((el: Element, index?: number) => string | number);
+
+export type AnimeProps = {
+  children: React.ReactNode;
+  delay?: ((el: Element, index?: number, len?: number) => number) | number;
+  duration?: ((el: Element, index?: number, len?: number) => number) | number;
+  autoplay?: boolean;
+  loop?: number | boolean;
+  direction?: 'normal' | 'reverse' | 'alternate';
+  easing?: Easing;
+  elasticity?: number;
+  round?: number | boolean;
+  svg?: boolean;
+  begin?: Function;
+  update?: Function;
+  complete?: Function;
+
+  // DOM
+  value?: AnimeValue | AnimeValue[];
+
+  // Transformations
+  translateX?: AnimeValue | AnimeValue[];
+  translateY?: AnimeValue | AnimeValue[];
+  rotate?: AnimeValue | AnimeValue[];
+  scale?: AnimeValue | AnimeValue[];
+
+  // CSS
+  opacity?: AnimeValue | AnimeValue[];
+  color?: AnimeValue | AnimeValue[];
+  backgroundColor?: AnimeValue | AnimeValue[];
+
+  //SVG
+  points?: AnimeValue | AnimeValue[];
+  strokeDashoffset?: AnimeValue | AnimeValue[];
+
+  // Custom Props
+  [prop: string]: any;
+};
 
 const PREFIX = '__anime__';