Remove Flow, rewrite in TypeScript

skevy · Jan 16, 2018 · a85aa77 · appsforartists · Jan 16, 2018 · skevy
1 parent 18f3230
commit a85aa77
Show file tree

Hide file tree

Showing 18 changed files with 1,653 additions and 2,060 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,13 +1,13 @@
 {
   "presets": [
-    ["env", {
-      "targets": {
-        "node": true
+    [
+      "env",
+      {
+        "targets": {
+          "node": true
+        }
       }
-    }],
+    ],
     "stage-0"
-  ],
-  "plugins": [
-    "transform-flow-strip-types"
   ]
 }
diff --git a/.eslintrc b/.eslintrc
diff --git a/demos/1-chat-heads/index.html b/demos/1-chat-heads/index.html
@@ -10,6 +10,6 @@
     </head>
     <body>
         <div id="app"></div>
-        <script src="./index.js"></script>
+        <script src="./index.tsx"></script>
     </body>
 </html>
diff --git a/demos/1-chat-heads/index.js → demos/1-chat-heads/index.tsx b/demos/1-chat-heads/index.js → demos/1-chat-heads/index.tsx
@@ -1,32 +1,40 @@
-/**
- * @flow
- */
-
-import React from "react";
-import ReactDOM from "react-dom";
+import * as React from "react";
+import * as ReactDOM from "react-dom";
 
 import { Spring } from "wobble";
 
-// $FlowFixMe
+// @ts-ignore
 import * as images from "./*.jpg";
 
-const INITIAL_X = 250,
-  INITIAL_Y = 300;
+const INITIAL_X = 250;
+const INITIAL_Y = 300;
+
+interface IBall {
+  x: number;
+  y: number;
+}
+
+interface IBallSpring {
+  x: Spring;
+  y: Spring;
+}
 
 class ChatHeads extends React.Component {
-  balls = Array(6).fill([]).map(() => ({ x: INITIAL_X, y: INITIAL_Y }));
+  public balls: IBall[] = Array(6)
+    .fill([])
+    .map(() => ({ x: INITIAL_X, y: INITIAL_Y }));
 
-  springs = [];
+  public springs: IBallSpring[] = [];
 
-  componentDidMount() {
+  public componentDidMount() {
     window.addEventListener("mousemove", this.handleMouseMove);
     window.addEventListener("touchmove", this.handleTouchMove);
     this.createFollowerSprings();
     this.springs[0].x.start();
     this.springs[0].y.start();
   }
 
-  render() {
+  public render() {
     return (
       <div
         style={{
@@ -36,7 +44,7 @@ class ChatHeads extends React.Component {
           background: "#EEE"
         }}
       >
-        {this.balls.map(({ x, y }, i) =>
+        {this.balls.map(({ x, y }, i) => (
           <div
             key={i}
             style={{
@@ -52,25 +60,25 @@ class ChatHeads extends React.Component {
               zIndex: this.balls.length - i
             }}
           />
-        )}
+        ))}
       </div>
     );
   }
 
-  createFollowerSprings() {
+  public createFollowerSprings() {
     const springConfig = {
       stiffness: 120,
       damping: 14,
       mass: 1
     };
     // Follower springs
     for (let i = 0; i < this.balls.length - 1; i++) {
-      let x = new Spring({
+      const x = new Spring({
         ...springConfig,
         fromValue: 0,
         toValue: INITIAL_X
       }).onUpdate(s => this.onSpringUpdate(i, "x", s));
-      let y = new Spring({
+      const y = new Spring({
         ...springConfig,
         fromValue: 0,
         toValue: INITIAL_Y
@@ -79,7 +87,7 @@ class ChatHeads extends React.Component {
     }
   }
 
-  onSpringUpdate = (i: number, dim: "x" | "y", s: Spring) => {
+  public onSpringUpdate = (i: number, dim: "x" | "y", s: Spring) => {
     const val = s.currentValue;
     this.balls[i + 1][dim] = val;
     if (i < this.balls.length - 2) {
@@ -92,7 +100,13 @@ class ChatHeads extends React.Component {
     this.forceUpdate();
   };
 
-  handleMouseMove = ({ pageX: x, pageY: y }) => {
+  public handleMouseMove = ({
+    pageX: x,
+    pageY: y
+  }: {
+    pageX: number;
+    pageY: number;
+  }) => {
     this.balls[0].x = x;
     this.balls[0].y = y;
     this.springs[0].x
@@ -107,7 +121,7 @@ class ChatHeads extends React.Component {
       .start();
   };
 
-  handleTouchMove = ({ touches }) => {
+  public handleTouchMove = ({ touches }: TouchEvent) => {
     this.handleMouseMove(touches[0]);
   };
 }

diff --git a/demos/package.json b/demos/package.json
@@ -11,10 +11,14 @@
     "wobble": "link:../"
   },
   "devDependencies": {
+    "@types/react": "^16.0.34",
+    "@types/react-dom": "^16.0.3",
     "babel-preset-env": "^1.6.1",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-1": "^6.24.1",
     "now": "^9.1.0",
-    "parcel-bundler": "^1.4.1"
+    "parcel-bundler": "^1.4.1",
+    "tslint": "^5.9.1",
+    "typescript": "^2.6.2"
   }
-}
+}
diff --git a/demos/tsconfig.json b/demos/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "jsx": "react",
+    "sourceMap": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "target": "esnext",
+    "pretty": true
+  },
+  "exclude": [
+    "node_modules"
+  ]
+}
diff --git a/demos/yarn.lock b/demos/yarn.lock
@@ -2,6 +2,21 @@
 # yarn lockfile v1
 
 
+"@types/node@*":
+  version "9.3.0"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-9.3.0.tgz#3a129cda7c4e5df2409702626892cb4b96546dd5"
+
+"@types/react-dom@^16.0.3":
+  version "16.0.3"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.3.tgz#8accad7eabdab4cca3e1a56f5ccb57de2da0ff64"
+  dependencies:
+    "@types/node" "*"
+    "@types/react" "*"
+
+"@types/react@*", "@types/react@^16.0.34":
+  version "16.0.34"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.0.34.tgz#7a8f795afd8a404a9c4af9539b24c75d3996914e"
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -158,7 +173,7 @@ aws4@^1.2.1:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.6.0.tgz#83ef5ca860b2b32e4a0deedee8c771b9db57471e"
 
-babel-code-frame@^6.26.0:
+babel-code-frame@^6.22.0, babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
   dependencies:
@@ -982,6 +997,10 @@ buffer@^4.3.0:
     ieee754 "^1.1.4"
     isarray "^1.0.0"
 
+builtin-modules@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
+
 builtin-status-codes@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz#85982878e21b98e1c66425e03d0174788f569ee8"
@@ -1162,7 +1181,7 @@ combined-stream@^1.0.5, combined-stream@~1.0.5:
   dependencies:
     delayed-stream "~1.0.0"
 
-commander@^2.11.0, commander@~2.13.0:
+commander@^2.11.0, commander@^2.12.1, commander@~2.13.0:
   version "2.13.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
 
@@ -1394,6 +1413,10 @@ detect-libc@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
 
+diff@^3.2.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/diff/-/diff-3.4.0.tgz#b1d85507daf3964828de54b37d0d73ba67dda56c"
+
 diffie-hellman@^5.0.0:
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.2.tgz#b5835739270cfe26acf632099fded2a07f209e5e"
@@ -1732,7 +1755,7 @@ glob-parent@^2.0.0:
   dependencies:
     is-glob "^2.0.0"
 
-glob@^7.0.5, glob@^7.1.2:
+glob@^7.0.5, glob@^7.1.1, glob@^7.1.2:
   version "7.1.2"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
   dependencies:
@@ -2140,7 +2163,7 @@ js-tokens@^3.0.0, js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
 
-js-yaml@^3.10.0:
+js-yaml@^3.10.0, js-yaml@^3.7.0:
   version "3.10.0"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.10.0.tgz#2e78441646bd4682e963f22b6e92823c309c62dc"
   dependencies:
@@ -3197,7 +3220,7 @@ resolve@1.1.7:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
-resolve@^1.4.0:
+resolve@^1.3.2, resolve@^1.4.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.5.0.tgz#1f09acce796c9a762579f31b2c1cc4c3cddf9f36"
   dependencies:
@@ -3593,6 +3616,33 @@ truncate-utf8-bytes@^1.0.0:
   dependencies:
     utf8-byte-length "^1.0.1"
 
+tslib@^1.8.0, tslib@^1.8.1:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.8.1.tgz#6946af2d1d651a7b1863b531d6e5afa41aa44eac"
+
+tslint@^5.9.1:
+  version "5.9.1"
+  resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.9.1.tgz#1255f87a3ff57eb0b0e1f0e610a8b4748046c9ae"
+  dependencies:
+    babel-code-frame "^6.22.0"
+    builtin-modules "^1.1.1"
+    chalk "^2.3.0"
+    commander "^2.12.1"
+    diff "^3.2.0"
+    glob "^7.1.1"
+    js-yaml "^3.7.0"
+    minimatch "^3.0.4"
+    resolve "^1.3.2"
+    semver "^5.3.0"
+    tslib "^1.8.0"
+    tsutils "^2.12.1"
+
+tsutils@^2.12.1:
+  version "2.18.0"
+  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-2.18.0.tgz#f97385709d348169002c12f6f5fd42c1df13b250"
+  dependencies:
+    tslib "^1.8.1"
+
 tty-browserify@0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
@@ -3607,6 +3657,10 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   version "0.14.5"
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
 
+typescript@^2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.6.2.tgz#3c5b6fd7f6de0914269027f03c0946758f7673a4"
+
 ua-parser-js@^0.7.9:
   version "0.7.17"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.17.tgz#e9ec5f9498b9ec910e7ae3ac626a805c4d09ecac"
@@ -3753,7 +3807,7 @@ window-size@0.1.0:
   resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
 
 "wobble@link:..":
-  version "1.3.0"
+  version "1.3.1"
 
 wordwrap@0.0.2:
   version "0.0.2"