Merge pull request #19 from bibixx/refactor/refactor-and-add-ts-support

Refactor and add ts support

.cz.json

@@ -0,0 +1,3 @@
+{
+  "path": "./node_modules/cz-conventional-changelog"
+}

.eslintignore

@@ -1 +1 @@
-build
+build

.eslintrc.js

@@ -1,44 +1,20 @@
 module.exports = {
-  "extends": "airbnb",
-  "parser": "babel-eslint",
+  "extends": ["airbnb-typescript"],
   "env": {
     "browser": true,
     "es6": true
   },
-  "settings": {
-    "import/resolver": {
-      "webpack": {
-        config: "./build/webpack.dev.js",
-      }
-    }
-  },
   "globals": {
     "AdobeAn": true
   },
+  parserOptions: {
+    project: './tsconfig.json',
+  },
   rules: {
-    "import/no-commonjs": ["error", "always"],
-
-    "react/forbid-prop-types": 0,
-    // "react/react-in-jsx-scope": 0,
-    "react/jsx-filename-extension": 0,
-    "react/no-deprecated": 0,
-    "react/no-danger": 0,
-    "react/jsx-curly-spacing": [2, {"when": "never", "allowMultiline": false}],
-    "react/prefer-stateless-function": 0,
-    "react/no-did-mount-set-state": 0,
-    "no-sequences": 0,
-
-    "eol-last": ["error", "always"],
-    "no-return-assign": 0,
-    "function-paren-newline": 0,
-    "func-names": 0,
-    "semi": ["error", "always"],
-    "quotes": ["error", "double"],
-    "no-console": 0,
-    "prefer-template": "warn",
-    "quote-props": ["error", "as-needed"],
-    "indent": ["error", 2, { "SwitchCase": 1, "MemberExpression": 1 }],
-    "no-plusplus": 0,
-    "no-mixed-operators": ["error", {"allowSamePrecedence": true}]
+    "import/no-default-export": 1,
+    "import/prefer-default-export": 0,
+    "react/static-property-placement": ["error", 'static public field'],
+    "react/state-in-constructor": 0,
+    "no-restricted-syntax": 0
   }
 }

.github/workflows/commitlint.yml

@@ -0,0 +1,11 @@
+name: Lint Commit Messages
+on: [pull_request]
+
+jobs:
+  commitlint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - uses: wagoid/commitlint-github-action@v2

.github/workflows/lint.yml

@@ -0,0 +1,24 @@
+name: Lint
+on:
+  push:
+    branches:
+      - '*'
+  pull_request:
+    branches:
+      - '*'
+jobs:
+  lint:
+    name: Lint
+    runs-on: ubuntu-18.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Setup Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12
+      - name: Install dependencies
+        run: npm ci
+      - run: npm run lint

.github/workflows/release.yml

@@ -0,0 +1,25 @@
+name: Release
+on:
+  push:
+    branches:
+      - master
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-18.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Setup Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12
+      - name: Install dependencies
+        run: npm ci
+      - name: Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: npx semantic-release

.gitignore

@@ -3,3 +3,5 @@
 yarn-error.log
 build/
 yarn.lock
+.eslintcache
+.husky/_

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname $0)/_/husky.sh"
+
+npx --no-install commitlint --edit 

LICENSE.md

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2019 Bartosz Legięć
+Copyright (c) 2019-2020 Bartosz Legięć
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -2,8 +2,8 @@
 
 [![npm](https://badgen.net/npm/v/react-adobe-animate)](https://www.npmjs.com/package/react-adobe-animate)
 [![npm](https://badgen.net/npm/dt/react-adobe-animate)](https://www.npmjs.com/package/react-adobe-animate)
-[![Snyk Vulnerabilities for GitHub Repo](https://img.shields.io/snyk/vulnerabilities/github/bibixx/react-adobe-animate)](https://snyk.io/test/github/bibixx/react-adobe-animate)
 [![npm](https://badgen.net/npm/dm/react-adobe-animate)](https://www.npmjs.com/package/react-adobe-animate)
+[![Snyk Vulnerabilities for GitHub Repo](https://img.shields.io/snyk/vulnerabilities/github/bibixx/react-adobe-animate)](https://snyk.io/test/github/bibixx/react-adobe-animate)
 ![CircleCI branch](https://badgen.net/circleci/github/bibixx/react-adobe-animate/master)
 [![david-dm.org](https://badgen.net/david/dep/bibixx/react-adobe-animate)](https://david-dm.org/bibixx/react-adobe-animate)
 [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)
@@ -17,12 +17,12 @@
 
 ## Examples
 
-* [Simple implementation (codesandbox.io)](https://codesandbox.io/s/react-adobe-animate-zw61y)
+* [Simple implementation (codesandbox.io)](https://githubbox.com/bibixx/react-adobe-animate/tree/master/examples)
 
 ## Dependencies
 
 * React
-* CreateJS – add this to your page `<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>`
+* CreateJS – add this to your page `<script src="https://code.createjs.com/1.0.0/createjs.min.js"></script>`
 * Your animation – add .js file exported from Adobe Animate to page with `<script>` tag
 
 ## How to use
@@ -36,25 +36,26 @@
   </head>
   <body>
     <div id="root"></div>
-    <script src="https://code.createjs.com/createjs-2015.11.26.min.js" type="text/javascript"></script>
+    <script src="https://code.createjs.com/1.0.0/createjs.min.js" type="text/javascript"></script>
     <script src="./lishtml5-with-background.js" type="text/javascript"></script>
     <script src="./lishtml5.js" type="text/javascript"></script>
   </body>
 </html>
 
 ```
 
-#### App.js
-```jsx
-import React, { useState } from "react";
-import AnimateCC from "react-adobe-animate";
+#### App.tsx
+```tsx
+import { useState } from "react";
+import AnimateCC, { GetAnimationObjectParameter } from "react-adobe-animate";
 
 const App = () => {
-  const [paused, setPaused] = useState(false);
-  const [, setAnimationObject] = useState(null);
-  const getAnimationObject = obj => setAnimationObject(obj);
+  const [paused, setPaused] = useState(true);
+  const [animationObject, getAnimationObject] = useState<GetAnimationObjectParameter|null>(null);
   const onClick = () => setPaused(!paused);
 
+  console.log(animationObject);
+
   return (
     <div style={{ width: "400px" }}>
       <AnimateCC
@@ -69,7 +70,7 @@ const App = () => {
         paused={paused}
       />
 
-      <button onClick={onClick}>{paused ? "Unpause" : "Pause"}</button>
+      <button onClick={onClick}>{paused ? "Unpause" : "Pause"}</button><br />
     </div>
   );
 };
@@ -94,13 +95,17 @@ Unfortunately it isn't possible to export from Adobe Animate two unique animatio
 
 ## 🤝 Contributing
 
-Contributions, issues and feature requests are welcome!<br />Feel free to check [issues page](https://github.com/bibixx/react-adobe-animate/issues).
+Contributions, issues and feature requests are welcome!\
+Feel free to check [issues page](https://github.com/bibixx/react-adobe-animate/issues).
+
+For development purposes you can use the `example` folder. \
+You'll find instructions on how to use it in [`example/README.md`](https://github.com/bibixx/react-adobe-animate/blob/master/example/README.md)
 
 ## Show your support
 
 Give a ⭐️ if this project helped you!
 
 ## 📝 License
 
-Copyright © 2019 [bibixx <[email protected]>](https://github.com/bibixx).<br />
-This project is [MIT](https://github.com/bibixx/react-adobe-animate/blob/master/LICENSE) licensed.
+Copyright © 2019-2020 [bibixx](https://github.com/bibixx) <[email protected]>.<br />
+This project is [MIT](https://github.com/bibixx/react-adobe-animate/blob/master/LICENSE.md) licensed.

example/.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*