Support enumerable accounts (#102)

Covert to TypeScript

.babelrc.js

@@ -0,0 +1 @@
+module.exports = require('./babel.config.js');

.flowconfig

@@ -1,18 +0,0 @@
-[ignore]
-<PROJECT_ROOT>/build
-<PROJECT_ROOT>/packages/.*/build
-
-[include]
-
-[libs]
-node_modules/@polkadot/dev/flow-typed
-node_modules/@polkadot/dev-react/flow-typed
-
-[lints]
-all=warn
-
-[options]
-include_warnings=true
-module.name_mapper='^@polkadot/app-\(accounts\|addresses\|explorer\|extrinsics\|home\|rpc\|settings\|storage\|toolbox\|vanitygen\)\(.*\)$' -> '<PROJECT_ROOT>/packages/app-\1/src\2'
-module.name_mapper='^@polkadot/apps\(.*\)$' -> '<PROJECT_ROOT>/packages/apps/src\1'
-module.name_mapper='^@polkadot/ui-\(app\|identicon\|keyring\|react-rx\|react\|signer\)\(.*\)$' -> '<PROJECT_ROOT>/packages/ui-\1/src\2'

flow-typed/semantic-ui-react.js

@@ -1,46 +0,0 @@
-// @flow
-
-declare module 'semantic-ui-react/dist/es/collections/Menu' {
-  declare module.exports: React$StatelessFunctionalComponent<*> & {
-    Item: React$StatelessFunctionalComponent<*>
-  };
-}
-
-declare module 'semantic-ui-react/dist/es/elements/Button' {
-  declare module.exports: React$StatelessFunctionalComponent<*> & {
-    Group: React$StatelessFunctionalComponent<*>,
-    Or: React$StatelessFunctionalComponent<*>
-  };
-}
-
-declare module 'semantic-ui-react/dist/es/elements/Divider' {
-  declare module.exports: React$StatelessFunctionalComponent<*>;
-}
-
-declare module 'semantic-ui-react/dist/es/elements/Icon' {
-  declare module.exports: React$StatelessFunctionalComponent<*>;
-}
-
-declare module 'semantic-ui-react/dist/es/elements/Input' {
-  declare module.exports: React$StatelessFunctionalComponent<*>;
-}
-
-declare module 'semantic-ui-react/dist/es/elements/Label' {
-  declare module.exports: React$StatelessFunctionalComponent<*>;
-}
-
-declare module 'semantic-ui-react/dist/es/modules/Dropdown' {
-  declare module.exports: React$StatelessFunctionalComponent<*> & {
-    Divider: React$StatelessFunctionalComponent<*>,
-    Header: React$StatelessFunctionalComponent<*>,
-    Item: React$StatelessFunctionalComponent<*>
-  };
-}
-
-declare module 'semantic-ui-react/dist/es/modules/Modal' {
-  declare module.exports: React$StatelessFunctionalComponent<*> & {
-    Actions: React$StatelessFunctionalComponent<*>,
-    Content: React$StatelessFunctionalComponent<*>,
-    Header: React$StatelessFunctionalComponent<*>
-  };
-}

flow-typed/semver.js

@@ -1,8 +0,0 @@
-// @flow
-
-declare module 'semver' {
-  declare module.exports: {
-    gt: (a: string, b: string) => boolean,
-    lt: (a: string, b: string) => boolean
-  }
-}

flow-typed/sodium.js

@@ -1,15 +0,0 @@
-// @flow
-
-declare module 'sodium' {
-  declare module.exports: {
-    Key: {
-      Sign: {
-        fromSeed (seed: Buffer): {
-          getPublicKey (): {
-            baseBuffer: Buffer
-          }
-        }
-      }
-    }
-  }
-}

flow-typed/store.js

@@ -1,10 +0,0 @@
-// @flow
-
-declare module 'store' {
-  declare module.exports: {
-    each: (fn: (value: any, key: string) => void) => void,
-    get: (key: string) => any,
-    remove: (key: string) => any,
-    set: (key: string, value: any) => void,
-  }
-}

lerna.json

@@ -10,5 +10,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.17.15"
+  "version": "0.18.0"
 }

package.json

@@ -10,20 +10,21 @@
     "packages/*"
   ],
   "scripts": {
-    "build": "polkadot-dev-build-babel",
-    "check": "eslint packages && flow check",
+    "build": "polkadot-dev-build-ts",
+    "check": "tsc --noEmit",
     "clean": "polkadot-dev-clean-build",
+    "postinstall": "polkadot-dev-yarn-only",
+    "test": "jest --coverage",
     "demo:identicon": "webpack-serve --config packages/ui-identicon/webpack.config.js --content packages/ui-identicon --port 3000",
     "demo:rx": "webpack-serve --config packages/ui-react-rx/webpack.config.js --content packages/ui-react-rx --port 3000",
     "demo:ui": "webpack-serve --config packages/ui-react/webpack.config.js --content packages/ui-react --port 3000",
     "deploy:ghpages": "gh-pages -d packages/apps/build",
-    "postinstall": "polkadot-dev-yarn-only",
     "vanitygen": "polkadot-dev-build-babel && node packages/app-vanitygen/build/generator/cli.js",
-    "start": "cd packages/apps && webpack-serve --config webpack.config.js --port 3000",
-    "test": "jest --coverage"
+    "start": "cd packages/apps && webpack-serve --config webpack.config.js --port 3000"
   },
   "devDependencies": {
-    "@polkadot/dev-react": "^0.19.25",
+    "@polkadot/dev-react": "^0.20.3",
+    "@polkadot/ts": "^0.1.2",
     "autoprefixer": "^8.6.2",
     "gh-pages": "^1.1.0",
     "postcss-import": "^11.1.0",

packages/app-accounts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-accounts",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,7 +15,7 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/ui-app": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/ui-app": "^0.18.0"
   }
 }

packages/app-accounts/src/Address.js → packages/app-accounts/src/Address.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-accounts authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
+import { BareProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -30,7 +29,7 @@ const DEFAULT_ADDR = '5'.padEnd(16, 'x');
 const DEFAULT_SHORT = `${DEFAULT_ADDR.slice(0, 7)}…${DEFAULT_ADDR.slice(-7)}`;
 
 export default class Address extends React.PureComponent<Props, State> {
-  state: State = ({}: $Shape<State>);
+  state: State = {} as State;
 
   static getDerivedStateFromProps ({ value }: Props, { address, publicKey, shortValue }: State): State {
     try {
@@ -51,7 +50,7 @@ export default class Address extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
     const { address, isValid, shortValue } = this.state;
 
@@ -76,7 +75,7 @@ export default class Address extends React.PureComponent<Props, State> {
     );
   }
 
-  renderBalance (): React$Node {
+  renderBalance () {
     const { isValid, publicKey } = this.state;
 
     if (!isValid) {

packages/app-accounts/src/Creator.js → packages/app-accounts/src/Creator.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-accounts authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -11,7 +10,7 @@ import Button from '@polkadot/ui-app/Button';
 import Input from '@polkadot/ui-app/Input';
 import Password from '@polkadot/ui-app/Password';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 import isHex from '@polkadot/util/is/hex';
 import hexToU8a from '@polkadot/util/hex/toU8a';
 import u8aFromString from '@polkadot/util/u8a/fromString';
@@ -41,7 +40,7 @@ type State = {
 function formatSeed (seed: string): Uint8Array {
   return isHex(seed)
     ? hexToU8a(seed)
-    : u8aFromString(seed.padEnd(32, ' '));
+    : u8aFromString((seed as string).padEnd(32, ' '));
 }
 
 function addressFromSeed (seed: string): string {
@@ -61,7 +60,7 @@ class Creator extends React.PureComponent<Props, State> {
     this.state = this.emptyState();
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
     const { address, isSeedValid } = this.state;
 
@@ -86,7 +85,7 @@ class Creator extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { isValid } = this.state;
 
@@ -110,7 +109,7 @@ class Creator extends React.PureComponent<Props, State> {
     );
   }
 
-  renderInput (): React$Node {
+  renderInput () {
     const { t } = this.props;
     const { isNameValid, isPassValid, isSeedValid, name, password, seed } = this.state;
 
@@ -169,7 +168,7 @@ class Creator extends React.PureComponent<Props, State> {
     };
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State, props: Props): State => {
         const { name = prevState.name, password = prevState.password, seed = prevState.seed } = newState;
@@ -177,7 +176,7 @@ class Creator extends React.PureComponent<Props, State> {
         const isNameValid = !!name;
         const isSeedValid = isHex(seed)
           ? seed.length === 66
-          : seed.length <= 32;
+          : (seed as string).length <= 32;
         const isPassValid = password.length > 0 && password.length <= 32;
 
         if (isSeedValid && seed !== prevState.seed) {
@@ -199,15 +198,15 @@ class Creator extends React.PureComponent<Props, State> {
   }
 
   onChangeSeed = (seed: string): void => {
-    this.nextState({ seed });
+    this.nextState({ seed } as State);
   }
 
   onChangeName = (name: string): void => {
-    this.nextState({ name });
+    this.nextState({ name } as State);
   }
 
   onChangePass = (password: string): void => {
-    this.nextState({ password });
+    this.nextState({ password } as State);
   }
 
   onCommit = (): void => {

packages/app-accounts/src/Editor.js → packages/app-accounts/src/Editor.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-accounts authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { KeyringPair } from '@polkadot/util-keyring/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { KeyringPair } from '@polkadot/util-keyring/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -12,7 +11,7 @@ import Button from '@polkadot/ui-app/Button';
 import Input from '@polkadot/ui-app/Input';
 import InputAddress from '@polkadot/ui-app/InputAddress';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 
 import Address from './Address';
 import translate from './translate';
@@ -43,7 +42,7 @@ class Editor extends React.PureComponent<Props, State> {
       : void 0;
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -57,7 +56,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { currentPair, isEdited } = this.state;
 
@@ -94,7 +93,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  renderData (): React$Node {
+  renderData () {
     const { t } = this.props;
     const { currentPair, defaultValue, editedName } = this.state;
 
@@ -143,7 +142,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  createState (currentPair: KeyringPair | null): $Shape<State> {
+  createState (currentPair: KeyringPair | null): State {
     return {
       currentPair,
       editedName: currentPair
@@ -153,9 +152,9 @@ class Editor extends React.PureComponent<Props, State> {
     };
   }
 
-  nextState (newState?: $Shape<State> = {}): void {
+  nextState (newState: State = {} as State): void {
     this.setState(
-      (prevState: State): $Shape<State> => {
+      (prevState: State): State => {
         let { currentPair = prevState.currentPair, editedName = prevState.editedName } = newState;
         const previous = prevState.currentPair || { address: () => null };
         let isEdited = false;
@@ -184,11 +183,11 @@ class Editor extends React.PureComponent<Props, State> {
 
     this.nextState({
       currentPair
-    });
+    } as State);
   }
 
   onChangeName = (editedName: string): void => {
-    this.nextState({ editedName });
+    this.nextState({ editedName } as State);
   }
 
   onCommit = (): void => {
@@ -203,7 +202,7 @@ class Editor extends React.PureComponent<Props, State> {
       whenEdited: Date.now()
     });
 
-    this.nextState({});
+    this.nextState({} as State);
   }
 
   onDiscard = (): void => {
@@ -215,7 +214,7 @@ class Editor extends React.PureComponent<Props, State> {
 
     this.nextState({
       editedName: currentPair.getMeta().name
-    });
+    } as State);
   }
 
   onForget = (): void => {
@@ -239,7 +238,7 @@ class Editor extends React.PureComponent<Props, State> {
     this.nextState({
       currentPair: nextPair,
       defaultValue
-    });
+    } as State);
   }
 }
 

packages/app-accounts/src/index.js → packages/app-accounts/src/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-accounts authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './index.css';
 
@@ -25,7 +24,7 @@ type State = {
 }
 
 // FIXME React-router would probably be the best route, not home-grown
-const Components: { [Actions]: React$ComponentType<{}> } = {
+const Components: { [index: string]: React.ComponentType<any> } = {
   'create': Creator,
   'edit': Editor
 };
@@ -33,7 +32,7 @@ const Components: { [Actions]: React$ComponentType<{}> } = {
 class AccountsApp extends React.PureComponent<Props, State> {
   state: State = { action: 'edit' };
 
-  render (): React$Node {
+  render () {
     const { className, style, t } = this.props;
     const { action } = this.state;
     const Component = Components[action];

packages/app-accounts/src/translate.js → packages/app-accounts/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-accounts authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-addresses/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-addresses",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,8 +15,8 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/app-accounts": "^0.17.15",
-    "@polkadot/ui-app": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/app-accounts": "^0.18.0",
+    "@polkadot/ui-app": "^0.18.0"
   }
 }

packages/app-addresses/src/Creator.js → packages/app-addresses/src/Creator.tsx

@@ -1,16 +1,15 @@
 // Copyright 2017-2018 @polkadot/app-addresses authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
 import Button from '@polkadot/ui-app/Button';
 import Input from '@polkadot/ui-app/Input';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 import addressDecode from '@polkadot/util-keyring/address/decode';
 import addressEncode from '@polkadot/util-keyring/address/encode';
 
@@ -38,7 +37,7 @@ class Creator extends React.PureComponent<Props, State> {
     this.state = this.emptyState();
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
     const { address } = this.state;
 
@@ -59,7 +58,7 @@ class Creator extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { isValid } = this.state;
 
@@ -83,7 +82,7 @@ class Creator extends React.PureComponent<Props, State> {
     );
   }
 
-  renderInput (): React$Node {
+  renderInput () {
     const { t } = this.props;
     const { address, isAddressValid, isNameValid, name } = this.state;
 
@@ -125,7 +124,7 @@ class Creator extends React.PureComponent<Props, State> {
     };
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State, props: Props): State => {
         const { address = prevState.address, name = prevState.name } = newState;
@@ -156,11 +155,11 @@ class Creator extends React.PureComponent<Props, State> {
   }
 
   onChangeAddress = (address: string): void => {
-    this.nextState({ address });
+    this.nextState({ address } as State);
   }
 
   onChangeName = (name: string): void => {
-    this.nextState({ name });
+    this.nextState({ name } as State);
   }
 
   onCommit = (): void => {

packages/app-addresses/src/Editor.js → packages/app-addresses/src/Editor.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-addresses authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { KeyringAddress } from '@polkadot/ui-keyring/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { KeyringAddress } from '@polkadot/ui-keyring/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -12,7 +11,7 @@ import Button from '@polkadot/ui-app/Button';
 import Input from '@polkadot/ui-app/Input';
 import InputAddress from '@polkadot/ui-app/InputAddress';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 
 import Address from '@polkadot/app-accounts/Address';
 import translate from './translate';
@@ -43,7 +42,7 @@ class Editor extends React.PureComponent<Props, State> {
       : void 0;
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -57,7 +56,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { currentAddress, isEdited } = this.state;
 
@@ -94,7 +93,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  renderData (): React$Node {
+  renderData () {
     const { t } = this.props;
     const { currentAddress, defaultValue, editedName } = this.state;
 
@@ -142,7 +141,7 @@ class Editor extends React.PureComponent<Props, State> {
     );
   }
 
-  createState (currentAddress: KeyringAddress | null): $Shape<State> {
+  createState (currentAddress: KeyringAddress | null): State {
     const { name = '' } = currentAddress
       ? currentAddress.getMeta()
       : {};
@@ -154,7 +153,7 @@ class Editor extends React.PureComponent<Props, State> {
     };
   }
 
-  nextState (newState?: $Shape<State> = {}): void {
+  nextState (newState: State = {} as State): void {
     this.setState(
       (prevState: State): State => {
         let { currentAddress = prevState.currentAddress, editedName = prevState.editedName } = newState;
@@ -183,13 +182,11 @@ class Editor extends React.PureComponent<Props, State> {
   onChangeAddress = (publicKey: Uint8Array): void => {
     const currentAddress = keyring.getAddress(publicKey) || null;
 
-    this.nextState({
-      currentAddress
-    });
+    this.nextState({ currentAddress } as State);
   }
 
   onChangeName = (editedName: string): void => {
-    this.nextState({ editedName });
+    this.nextState({ editedName } as State);
   }
 
   onCommit = (): void => {
@@ -204,7 +201,7 @@ class Editor extends React.PureComponent<Props, State> {
       whenEdited: Date.now()
     });
 
-    this.nextState({});
+    this.nextState({} as State);
   }
 
   onDiscard = (): void => {
@@ -216,7 +213,7 @@ class Editor extends React.PureComponent<Props, State> {
 
     this.nextState({
       editedName: currentAddress.getMeta().name
-    });
+    } as State);
   }
 
   onForget = (): void => {
@@ -240,7 +237,7 @@ class Editor extends React.PureComponent<Props, State> {
     this.nextState({
       currentAddress: nextAddress,
       defaultValue
-    });
+    } as State);
   }
 }
 

packages/app-addresses/src/index.js → packages/app-addresses/src/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-addresses authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './index.css';
 
@@ -25,7 +24,7 @@ type State = {
 }
 
 // FIXME React-router would probably be the best route, not home-grown
-const Components: { [Actions]: React$ComponentType<{}> } = {
+const Components: { [index: string]: React.ComponentType<any> } = {
   'create': Creator,
   'edit': Editor
 };
@@ -33,7 +32,7 @@ const Components: { [Actions]: React$ComponentType<{}> } = {
 class AddressesApp extends React.PureComponent<Props, State> {
   state: State = { action: 'edit' };
 
-  render (): React$Node {
+  render () {
     const { className, style, t } = this.props;
     const { action } = this.state;
     const Component = Components[action];

packages/app-addresses/src/translate.js → packages/app-addresses/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-addresses authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-explorer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-explorer",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,10 +15,10 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/primitives-codec": "^0.17.24",
-    "@polkadot/primitives-json": "^0.17.24",
-    "@polkadot/ui-app": "^0.17.15",
-    "@polkadot/util-crypto": "^0.22.9"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/primitives-codec": "^0.19.5",
+    "@polkadot/primitives-json": "^0.19.5",
+    "@polkadot/ui-app": "^0.18.0",
+    "@polkadot/util-crypto": "^0.24.6"
   }
 }

packages/app-explorer/src/BestHash.js → packages/app-explorer/src/BestHash.tsx

@@ -1,19 +1,19 @@
 // Copyright 2017-2018 @polkadot/app-explorer authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Header } from '@polkadot/primitives/header';
+import { Header } from '@polkadot/primitives/header';
 
 import headerHash from '@polkadot/primitives-codec/header/hash';
 import withApiDiv from '@polkadot/ui-react-rx/with/apiDiv';
 import u8aToHex from '@polkadot/util/u8a/toHex';
 
-export default withApiDiv({ name: 'newHead', section: 'chain' })(
-  (value?: Header): ?string => {
-    return value
+const Component: React.ComponentType<any> = withApiDiv({ name: 'newHead', section: 'chain' })(
+  (value?: Header): string | undefined =>
+    value
       ? u8aToHex(headerHash(value), 64)
-      : value;
-  },
+      : value,
   { className: 'explorer--BestHash' }
 );
+
+export default Component;

packages/app-explorer/src/BlockHeader/index.js → packages/app-explorer/src/BlockHeader/index.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-explorer authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Header } from '@polkadot/primitives/header';
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { Header } from '@polkadot/primitives/header';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './BlockHeader.css';
 
@@ -21,7 +20,7 @@ type Props = I18nProps & {
   value?: Header
 };
 
-function BlockHeader ({ className, value, style }: Props): React$Node {
+function BlockHeader ({ className, value, style }: Props) {
   if (!value) {
     return null;
   }

packages/app-explorer/src/BlockHeaders.js → packages/app-explorer/src/BlockHeaders.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-explorer authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Header } from '@polkadot/primitives/header';
+import { Header } from '@polkadot/primitives/header';
 
 import React from 'react';
 
@@ -42,13 +41,12 @@ const apiOptions = {
 };
 
 export default withApiDiv(apiMethod, apiOptions)(
-  (value?: Array<Header> = []): Array<React$Node> => {
-    return value.map((value) => (
+  (value: Array<Header> = []) =>
+    value.map((value) => (
       <BlockHeader
         key={value.number.toString()}
         value={value}
       />
-    ));
-  },
+    )),
   { className: 'explorer--BlockHeaders' }
 );

packages/app-explorer/src/index.js → packages/app-explorer/src/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-explorer authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './index.css';
 
@@ -18,7 +17,7 @@ import translate from './translate';
 
 type Props = I18nProps & {};
 
-function ExplorerApp ({ className, style, t }: Props): React$Node {
+function ExplorerApp ({ className, style, t }: Props) {
   return (
     <div
       className={classes('explorer--App', className)}

packages/app-explorer/src/translate.js → packages/app-explorer/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-explorer authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-extrinsics/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-extrinsics",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,10 +15,10 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/extrinsics-codec": "^0.17.24",
-    "@polkadot/ui-app": "^0.17.15",
-    "@polkadot/ui-signer": "^0.17.15",
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/extrinsics-codec": "^0.19.5",
+    "@polkadot/ui-app": "^0.18.0",
+    "@polkadot/ui-signer": "^0.18.0",
     "react-dropzone": "^4.2.9"
   }
 }

packages/app-extrinsics/src/Account.js → packages/app-extrinsics/src/Account.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { KeyringOption$Type } from '@polkadot/ui-keyring/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { KeyringOption$Type } from '@polkadot/ui-keyring/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -17,6 +16,7 @@ import translate from './translate';
 
 type Props = I18nProps & {
   defaultValue?: Uint8Array,
+  isDisabled?: boolean,
   isError?: boolean,
   isInput?: boolean,
   label: string,
@@ -40,8 +40,8 @@ class Account extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
-    const { className, defaultValue, isError, isInput, label, style, t, type, withLabel } = this.props;
+  render () {
+    const { className, defaultValue, isDisabled, isError, isInput, label, style, t, type, withLabel } = this.props;
     const { publicKey } = this.state;
 
     return (
@@ -52,6 +52,7 @@ class Account extends React.PureComponent<Props, State> {
         <div className='large'>
           <InputAddress
             defaultValue={defaultValue}
+            isDisabled={isDisabled}
             isError={isError}
             isInput={isInput}
             label={label}

packages/app-extrinsics/src/Extrinsic.js → packages/app-extrinsics/src/Extrinsic.tsx

@@ -1,13 +1,12 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Extrinsic$Method } from '@polkadot/extrinsics/types';
-import type { BareProps } from '@polkadot/ui-app/types';
-import type { ApiProps } from '@polkadot/ui-react-rx/types';
-import type { RawParam } from '@polkadot/ui-app/Params/types';
-import type { EncodedMessage } from '@polkadot/ui-signer/types';
+import { Extrinsic$Method } from '@polkadot/extrinsics/types';
+import { BareProps } from '@polkadot/ui-app/types';
+import { ApiProps } from '@polkadot/ui-react-rx/types';
+import { RawParam } from '@polkadot/ui-app/Params/types';
+import { EncodedMessage } from '@polkadot/ui-signer/types';
 
 import React from 'react';
 
@@ -22,11 +21,13 @@ import paramComponents from './Params';
 
 type Props = BareProps & ApiProps & {
   defaultValue: Extrinsic$Method,
+  isDisabled?: boolean,
   isError?: boolean,
   isPrivate?: boolean,
   labelMethod?: string,
   labelSection?: string,
-  onChange: (encoded: EncodedMessage) => void
+  onChange: (encoded: EncodedMessage) => void,
+  withLabel?: boolean
 };
 
 type State = {
@@ -46,8 +47,8 @@ class Extrinsic extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
-    const { className, defaultValue, isError, isPrivate, labelMethod, labelSection, style } = this.props;
+  render () {
+    const { className, defaultValue, isDisabled, isError, isPrivate, labelMethod, labelSection, style, withLabel } = this.props;
     const { extrinsic } = this.state;
 
     return (
@@ -57,11 +58,13 @@ class Extrinsic extends React.PureComponent<Props, State> {
       >
         <InputExtrinsic
           defaultValue={defaultValue}
+          isDisabled={isDisabled}
           isError={isError}
           isPrivate={isPrivate}
           labelMethod={labelMethod}
           labelSection={labelSection}
           onChange={this.onChangeExtrinsic}
+          withLabel={withLabel}
         />
         <Params
           item={extrinsic}
@@ -72,7 +75,7 @@ class Extrinsic extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(newState, () => {
       const { apiSupport, onChange } = this.props;
       const { extrinsic, values } = this.state;
@@ -88,7 +91,7 @@ class Extrinsic extends React.PureComponent<Props, State> {
         : new Uint8Array([]);
 
       onChange({
-        extrinsic,
+        // extrinsic,
         isValid,
         values: [value]
       });
@@ -96,11 +99,11 @@ class Extrinsic extends React.PureComponent<Props, State> {
   }
 
   onChangeExtrinsic = (extrinsic: Extrinsic$Method): void => {
-    this.nextState({ extrinsic });
+    this.nextState({ extrinsic } as State);
   };
 
   onChangeValues = (values: Array<RawParam>): void => {
-    this.nextState({ values });
+    this.nextState({ values } as State);
   }
 }
 

packages/app-extrinsics/src/Nonce.js → packages/app-extrinsics/src/Nonce.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type BN from 'bn.js';
-import type { BareProps } from '@polkadot/ui-app/types';
+import BN from 'bn.js';
+import { BareProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -18,7 +17,7 @@ type Props = BareProps & {
   value?: Uint8Array
 };
 
-export default function Nonce ({ className, label, style, onChange, value }: Props): React$Node {
+export default function Nonce ({ className, label, style, onChange, value }: Props) {
   return (
     <div
       className={classes('ui--row', className)}

packages/app-extrinsics/src/Params/Account.js → packages/app-extrinsics/src/Params/Account.tsx

@@ -1,19 +1,17 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Props } from '@polkadot/ui-app/Params/types';
+import { Props } from '@polkadot/ui-app/Params/types';
 
 import React from 'react';
 
 import BaseAccount from '../Account';
 
 export default class Account extends React.PureComponent<Props> {
-  render (): React$Node {
+  render () {
     const { className, defaultValue: { value }, isDisabled, isError, label, style, withLabel } = this.props;
-    // flowlint-next-line unclear-type:off
-    const defaultValue = ((value: any): Uint8Array);
+    const defaultValue = (value as Uint8Array);
 
     return (
       <BaseAccount
@@ -30,12 +28,12 @@ export default class Account extends React.PureComponent<Props> {
     );
   }
 
-  onChange = (value?: Uint8Array): void => {
+  onChange = (publicKey?: Uint8Array): void => {
     const { onChange } = this.props;
 
     onChange({
-      isValid: !!value && value.length === 32,
-      value
+      isValid: !!publicKey && publicKey.length === 32,
+      value: publicKey
     });
   }
 }

packages/app-extrinsics/src/Params/Call.js → packages/app-extrinsics/src/Params/Call.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Props } from '@polkadot/ui-app/Params/types';
+import { Props } from '@polkadot/ui-app/Params/types';
 
 import React from 'react';
 
@@ -11,9 +10,10 @@ import extrinsics from '@polkadot/extrinsics';
 
 import Extrinsic from './Extrinsic';
 
-const defaultValue = extrinsics.staking.public.transfer;
+// @ts-ignore checking?
+const defaultValue = extrinsics.get('staking').public.transfer;
 
-export default function Call ({ className, isDisabled, isError, label, onChange, style, withLabel }: Props): React$Node {
+export default function Call ({ className, isDisabled, isError, label, onChange, style, withLabel }: Props) {
   return (
     <Extrinsic
       className={className}

packages/app-extrinsics/src/Params/Extrinsic.js → packages/app-extrinsics/src/Params/Extrinsic.tsx

@@ -1,12 +1,11 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Extrinsic$Method } from '@polkadot/extrinsics/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { RawParam$OnChange } from '@polkadot/ui-app/Params/types';
-import type { EncodedMessage } from '@polkadot/ui-signer/types';
+import { Extrinsic$Method } from '@polkadot/extrinsics/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { RawParam$OnChange } from '@polkadot/ui-app/Params/types';
+import { EncodedMessage } from '@polkadot/ui-signer/types';
 
 import React from 'react';
 
@@ -15,8 +14,8 @@ import translate from '../translate';
 
 type Props = I18nProps & {
   defaultValue: Extrinsic$Method,
-  isDisabled: boolean,
-  isError: boolean,
+  isDisabled?: boolean,
+  isError?: boolean,
   isPrivate: boolean,
   label: string,
   onChange: RawParam$OnChange,
@@ -24,7 +23,7 @@ type Props = I18nProps & {
 };
 
 class Extrinsic extends React.PureComponent<Props> {
-  render (): React$Node {
+  render () {
     const { className, defaultValue, isDisabled, isError, isPrivate, label, style, t, withLabel } = this.props;
 
     return (
@@ -58,8 +57,7 @@ class Extrinsic extends React.PureComponent<Props> {
 
     onChange({
       isValid,
-      // flowlint-next-line unclear-type:off
-      value: ((values[0]: any): Uint8Array)
+      value: (values[0] as Uint8Array)
     });
   }
 }

packages/app-extrinsics/src/Params/Proposal.js → packages/app-extrinsics/src/Params/Proposal.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Props } from '@polkadot/ui-app/Params/types';
+import { Props } from '@polkadot/ui-app/Params/types';
 
 import React from 'react';
 
@@ -11,9 +10,10 @@ import extrinsics from '@polkadot/extrinsics';
 
 import Extrinsic from './Extrinsic';
 
-const defaultValue = extrinsics.consensus.private.setCode;
+// @ts-ignore check?
+const defaultValue = extrinsics.get('consensus').private.setCode;
 
-export default function Proposal ({ className, isDisabled, isError, label, onChange, style, withLabel }: Props): React$Node {
+export default function Proposal ({ className, isDisabled, isError, label, onChange, style, withLabel }: Props) {
   return (
     <Extrinsic
       className={className}

packages/app-extrinsics/src/Params/index.js → packages/app-extrinsics/src/Params/index.ts

@@ -1,15 +1,14 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { ComponentMap } from '@polkadot/ui-app/Params/types';
+import { ComponentMap } from '@polkadot/ui-app/Params/types';
 
 import Account from './Account';
 import Call from './Call';
 import Proposal from './Proposal';
 
-const components: $Shape<ComponentMap> = {
+const components: ComponentMap = {
   'AccountId': Account,
   'Call': Call,
   'Proposal': Proposal

packages/app-extrinsics/src/Selection.js → packages/app-extrinsics/src/Selection.tsx

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type BN from 'bn.js';
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { EncodedMessage, QueueTx$MessageAdd } from '@polkadot/ui-signer/types';
+import BN from 'bn.js';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { EncodedMessage, QueueTx$MessageAdd } from '@polkadot/ui-signer/types';
 
 import React from 'react';
 
@@ -30,13 +29,15 @@ type State = {
   publicKey: Uint8Array
 };
 
-const defaultExtrinsic = extrinsics.staking.public.transfer;
-const defaultRpc = rpc.author.public.submitExtrinsic;
+// @ts-ignore check?
+const defaultExtrinsic = extrinsics.get('staking').public.transfer;
+// @ts-ignore check?
+const defaultRpc = rpc.get('author').public.submitExtrinsic;
 
 class Selection extends React.PureComponent<Props, State> {
-  state: State = ({
+  state: State = {
     isValid: false
-  }: $Shape<State>);
+  } as State;
 
   render () {
     const { className, style, t } = this.props;
@@ -83,7 +84,7 @@ class Selection extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State): State => {
         const { encoded = prevState.encoded, nonce = prevState.nonce, publicKey = prevState.publicKey } = newState;
@@ -105,15 +106,15 @@ class Selection extends React.PureComponent<Props, State> {
   }
 
   onChangeMessage = (encoded: EncodedMessage): void => {
-    this.nextState({ encoded });
+    this.nextState({ encoded } as State);
   }
 
   onChangeNonce = (nonce: BN): void => {
-    this.nextState({ nonce });
+    this.nextState({ nonce } as State);
   }
 
   onChangeSender = (publicKey: Uint8Array): void => {
-    this.nextState({ publicKey });
+    this.nextState({ publicKey } as State);
   }
 
   onQueue = (): void => {

packages/app-extrinsics/src/index.js → packages/app-extrinsics/src/index.tsx

@@ -1,33 +1,32 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
-import type { QueueProps } from '@polkadot/ui-signer/types';
+import { BareProps } from '@polkadot/ui-app/types';
+import { QueueProps } from '@polkadot/ui-signer/types';
 
 import './index.css';
 
 import React from 'react';
 
 import classes from '@polkadot/ui-app/util/classes';
-import Signer from '@polkadot/ui-signer';
+import { QueueConsumer } from '@polkadot/ui-signer/Context';
 
 import Selection from './Selection';
 
 type Props = BareProps;
 
-export default function ExtrinsicsApp ({ className, style }: Props): React$Node {
+export default function ExtrinsicsApp ({ className, style }: Props) {
   return (
     <div
       className={classes('extrinsics--App', className)}
       style={style}
     >
-      <Signer.Queue.Consumer>
-        {({ queueAdd }: QueueProps = {}) => (
+      <QueueConsumer>
+        {({ queueAdd }: QueueProps) => (
           <Selection queueAdd={queueAdd} />
         )}
-      </Signer.Queue.Consumer>
+      </QueueConsumer>
     </div>
   );
 }

packages/app-extrinsics/src/translate.js → packages/app-extrinsics/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-extrinsics authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-rpc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-rpc",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,9 +15,9 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/ui-app": "^0.17.15",
-    "@polkadot/ui-keyring": "^0.17.15",
-    "@polkadot/ui-signer": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/ui-app": "^0.18.0",
+    "@polkadot/ui-keyring": "^0.18.0",
+    "@polkadot/ui-signer": "^0.18.0"
   }
 }

packages/app-rpc/src/Account.js → packages/app-rpc/src/Account.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import BN from 'bn.js';
 import React from 'react';
@@ -16,14 +15,14 @@ import Nonce from '@polkadot/ui-react-rx/Nonce';
 import translate from './translate';
 
 type Props = I18nProps & {
-  defaultValue?: Uint8Array,
+  defaultValue?: Uint8Array | null,
   isError?: boolean,
-  onChange: (publicKey?: Uint8Array, nonce: BN) => void
+  onChange: (publicKey: Uint8Array | undefined | null, nonce: BN) => void
 };
 
 type State = {
   nonce: BN,
-  publicKey?: Uint8Array
+  publicKey?: Uint8Array | null
 };
 
 class Account extends React.PureComponent<Props, State> {
@@ -38,7 +37,7 @@ class Account extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { className, defaultValue, isError, style, t } = this.props;
 
     return (
@@ -63,7 +62,7 @@ class Account extends React.PureComponent<Props, State> {
     );
   }
 
-  renderNonce (): React$Node {
+  renderNonce () {
     const { t } = this.props;
     const { publicKey } = this.state;
 

packages/app-rpc/src/Results.js → packages/app-rpc/src/Results.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
-import type { QueueTx } from '@polkadot/ui-signer/types';
+import { BareProps } from '@polkadot/ui-app/types';
+import { QueueTx } from '@polkadot/ui-signer/types';
 
 import React from 'react';
 
@@ -18,7 +17,7 @@ type Props = BareProps & {
   queue: Array<QueueTx>
 };
 
-export default function Results ({ className, queue = [], style }: Props): React$Node {
+export default function Results ({ className, queue = [], style }: Props) {
   const filtered = queue
     .filter(({ error, result }) =>
       !isUndefined(error) || !isUndefined(result)

packages/app-rpc/src/Selection.js → packages/app-rpc/src/Selection.tsx

@@ -1,12 +1,11 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Interface$Method } from '@polkadot/jsonrpc/types';
-import type { RawParam } from '@polkadot/ui-app/Params/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { QueueTx$MessageAdd } from '@polkadot/ui-signer/types';
+import { Interface$Method } from '@polkadot/jsonrpc/types';
+import { RawParam } from '@polkadot/ui-app/Params/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { QueueTx$MessageAdd } from '@polkadot/ui-signer/types';
 
 import './index.css';
 
@@ -35,7 +34,8 @@ type State = {
   values: Array<RawParam>
 }
 
-const defaultMethod = rpc.author.public.submitExtrinsic;
+// @ts-ignore check?
+const defaultMethod = rpc.get('author').public.submitExtrinsic;
 
 class Selection extends React.PureComponent<Props, State> {
   state: State = {
@@ -46,7 +46,7 @@ class Selection extends React.PureComponent<Props, State> {
     values: []
   };
 
-  render (): React$Node {
+  render () {
     const { className, style, t } = this.props;
     const { isValid, rpc } = this.state;
 
@@ -78,7 +78,7 @@ class Selection extends React.PureComponent<Props, State> {
     );
   }
 
-  renderAccount (): React$Node {
+  renderAccount () {
     const { rpc: { isSigned = false }, publicKey } = this.state;
 
     if (!isSigned) {
@@ -93,7 +93,7 @@ class Selection extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State): State => {
         const { rpc = prevState.rpc, nonce = prevState.nonce, publicKey = prevState.publicKey, values = prevState.values } = newState;
@@ -112,16 +112,16 @@ class Selection extends React.PureComponent<Props, State> {
     );
   }
 
-  onChangeAccount = (publicKey?: Uint8Array, nonce: BN): void => {
-    this.nextState({ nonce, publicKey });
+  onChangeAccount = (publicKey: Uint8Array | undefined | null, nonce: BN): void => {
+    this.nextState({ nonce, publicKey } as State);
   }
 
   onChangeMethod = (rpc: Interface$Method): void => {
-    this.nextState({ rpc });
+    this.nextState({ rpc } as State);
   }
 
   onChangeValues = (values: Array<RawParam>): void => {
-    this.nextState({ values });
+    this.nextState({ values } as State);
   }
 
   onSubmit = (): void => {

packages/app-rpc/src/index.js → packages/app-rpc/src/index.tsx

@@ -1,31 +1,30 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
-import type { QueueProps } from '@polkadot/ui-signer/types';
+import { BareProps } from '@polkadot/ui-app/types';
+import { QueueProps } from '@polkadot/ui-signer/types';
 
 import './index.css';
 
 import React from 'react';
 
 import classes from '@polkadot/ui-app/util/classes';
-import Signer from '@polkadot/ui-signer';
+import { QueueConsumer } from '@polkadot/ui-signer/Context';
 
 import Results from './Results';
 import Selection from './Selection';
 
 type Props = BareProps & {};
 
-export default function RpcApp ({ className, style }: Props): React$Node {
+export default function RpcApp ({ className, style }: Props) {
   return (
     <div
       className={classes('rpc--App', className)}
       style={style}
     >
-      <Signer.Queue.Consumer>
-        {({ queue, queueAdd }: QueueProps = {}) => [
+      <QueueConsumer>
+        {({ queue, queueAdd }: QueueProps) => [
           <Selection
             key='add'
             queueAdd={queueAdd}
@@ -35,7 +34,7 @@ export default function RpcApp ({ className, style }: Props): React$Node {
             queue={queue}
           />
         ]}
-      </Signer.Queue.Consumer>
+      </QueueConsumer>
     </div>
   );
 }

packages/app-rpc/src/resultToText.js → packages/app-rpc/src/resultToText.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import bnToHex from '@polkadot/util/bn/toHex';
 import u8aToHex from '@polkadot/util/u8a/toHex';
@@ -9,18 +8,16 @@ import isBn from '@polkadot/util/is/bn';
 import isObject from '@polkadot/util/is/object';
 import isU8a from '@polkadot/util/is/u8a';
 
-function resultToText (result: mixed): mixed {
+function resultToText (result: any): any {
   if (result === null || result === undefined) {
     return 'null';
   }
 
   if (isU8a(result)) {
-    // $FlowFixMe type has been determined
     return u8aToHex(result);
   }
 
   if (isBn(result)) {
-    // $FlowFixMe type has been determined
     return bnToHex(result);
   }
 
@@ -33,15 +30,13 @@ function resultToText (result: mixed): mixed {
   if (isObject(result)) {
     return JSON
       .stringify(
-        // $FlowFixMe type has been determined
         Object
           .keys(result)
           .reduce((map, key) => {
-            // $FlowFixMe type has been determined
-            map[key] = resultToText(result[key]);
+            map[key] = resultToText((result as { [index: string]: string })[key]);
 
             return map;
-          }, {})
+          }, ({} as { [index: string]: string }))
       )
       .replace(/\\"/g, '"')
       .replace(/":"/g, '": "');

packages/app-rpc/src/translate.js → packages/app-rpc/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-rpc authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-storage/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-storage",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,7 +15,7 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/ui-app": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/ui-app": "^0.18.0"
   }
 }

packages/app-storage/src/Queries.js → packages/app-storage/src/Queries.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { StorageQuery } from './types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { StorageQuery } from './types';
 
 import React from 'react';
 
@@ -18,7 +17,7 @@ type Props = I18nProps & {
   value?: Array<StorageQuery>
 };
 
-function Queries ({ className, onRemove, style, value }: Props): React$Node {
+function Queries ({ className, onRemove, style, value }: Props) {
   if (!value || !value.length) {
     return null;
   }

packages/app-storage/src/Query.js → packages/app-storage/src/Query.tsx

@@ -1,10 +1,10 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { StorageQuery } from './types';
+import { Storage$Key$Value } from '@polkadot/storage/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { StorageQuery } from './types';
 
 import React from 'react';
 
@@ -25,22 +25,24 @@ type Props = I18nProps & {
 type ComponentProps = {};
 
 type State = {
-  inputs: Array<React$Node>,
-  Component: React$ComponentType<ComponentProps>;
+  inputs: Array<any>, // node?
+  Component: React.ComponentType<ComponentProps>;
 };
 
-const cache = [];
+const cache: Array<React.ComponentType<ComponentProps>> = [];
 
 class Query extends React.PureComponent<Props, State> {
-  state: State = ({}: $Shape<State>);
+  state: State = {} as State;
 
-  static getCachedComponent ({ id, key, params }: StorageQuery): React$ComponentType<ComponentProps> {
+  static getCachedComponent ({ id, key, params }: StorageQuery): React.ComponentType<ComponentProps> {
     if (!cache[id]) {
-      const values = params.map(({ value }) => value);
+      const values: Array<Storage$Key$Value> = params.map(({ value }) =>
+        // FIXME not 100% convinced, arrays could be an issue? (Plus, if we have to cast, something just _seems_ off)
+        value as Storage$Key$Value
+      );
 
-      // $FlowFixMe we SHOULD be transforming these before passing
       cache[id] = withStorageDiv(key, { params: values })(
-        (value) =>
+        (value: any) =>
           valueToText(key.type, value),
         { className: 'ui--output' }
       );
@@ -64,7 +66,7 @@ class Query extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { className, style, value: { key } } = this.props;
     const { Component, inputs } = this.state;
 

packages/app-storage/src/Selection.js → packages/app-storage/src/Selection.tsx

@@ -1,12 +1,11 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Storage$Key } from '@polkadot/storage/types';
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { RawParams } from '@polkadot/ui-app/Params/types';
-import type { StorageQuery } from './types';
+import { Storage$Key } from '@polkadot/storage/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { RawParams } from '@polkadot/ui-app/Params/types';
+import { StorageQuery } from './types';
 
 import React from 'react';
 
@@ -30,7 +29,8 @@ type State = {
   params: RawParams
 };
 
-const defaultValue = storage.timestamp.public.current;
+// @ts-ignore check?
+const defaultValue = storage.get('timestamp').public.current;
 let id = -1;
 
 class Selection extends React.PureComponent<Props, State> {
@@ -40,7 +40,7 @@ class Selection extends React.PureComponent<Props, State> {
     params: []
   };
 
-  render (): React$Node {
+  render () {
     const { className, style, t } = this.props;
     const { isValid, key } = this.state;
 
@@ -74,7 +74,7 @@ class Selection extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State) => {
         const { key = prevState.key, params = prevState.params } = newState;
@@ -107,11 +107,11 @@ class Selection extends React.PureComponent<Props, State> {
   }
 
   onChangeKey = (key: Storage$Key): void => {
-    this.nextState({ key });
+    this.nextState({ key } as State);
   }
 
-  onChangeParams = (params?: RawParams = []): void => {
-    this.nextState({ params });
+  onChangeParams = (params: RawParams = []): void => {
+    this.nextState({ params } as State);
   }
 }
 

packages/app-storage/src/index.js → packages/app-storage/src/index.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { StorageQuery } from './types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { StorageQuery } from './types';
 
 import './index.css';
 
@@ -27,7 +26,7 @@ class StorageApp extends React.PureComponent<Props, State> {
     queue: []
   };
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
     const { queue } = this.state;
 

packages/app-storage/src/translate.js → packages/app-storage/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-storage/src/types.js → packages/app-storage/src/types.d.ts

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-storage authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Storage$Key } from '@polkadot/storage/types';
-import type { RawParams } from '@polkadot/ui-app/Params/types';
+import { Storage$Key } from '@polkadot/storage/types';
+import { RawParams } from '@polkadot/ui-app/Params/types';
 
 export type StorageQuery = {
   id: number,

packages/app-toolbox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-toolbox",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,8 +15,8 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/ui-app": "^0.17.15",
-    "@polkadot/ui-keyring": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/ui-app": "^0.18.0",
+    "@polkadot/ui-keyring": "^0.18.0"
   }
 }

packages/app-toolbox/src/Hash.js → packages/app-toolbox/src/Hash.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps as Props } from '@polkadot/ui-app/types';
+import { I18nProps as Props } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -31,7 +30,7 @@ class Hash extends React.PureComponent<Props, State> {
     isHexData: false
   };
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -45,7 +44,7 @@ class Hash extends React.PureComponent<Props, State> {
     );
   }
 
-  renderInput (): React$Node {
+  renderInput () {
     const { t } = this.props;
     const { data, isHexData } = this.state;
 
@@ -78,7 +77,7 @@ class Hash extends React.PureComponent<Props, State> {
     );
   }
 
-  renderOutput (): React$Node {
+  renderOutput () {
     const { t } = this.props;
     const { hash } = this.state;
 

packages/app-toolbox/src/Sign.js → packages/app-toolbox/src/Sign.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps as Props } from '@polkadot/ui-app/types';
-import type { KeyringPair } from '@polkadot/util-keyring/types';
+import { I18nProps as Props } from '@polkadot/ui-app/types';
+import { KeyringPair } from '@polkadot/util-keyring/types';
 
 import React from 'react';
 
@@ -14,7 +13,7 @@ import InputAddress from '@polkadot/ui-app/InputAddress';
 import Output from '@polkadot/ui-app/Output';
 import Static from '@polkadot/ui-app/Static';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 import hexToU8a from '@polkadot/util/hex/toU8a';
 import isHex from '@polkadot/util/is/hex';
 import u8aFromString from '@polkadot/util/u8a/fromString';
@@ -57,7 +56,7 @@ class Sign extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -74,7 +73,7 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  renderAccount (): React$Node {
+  renderAccount () {
     const { t } = this.props;
     const { defaultValue } = this.state;
 
@@ -94,7 +93,7 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { isLocked } = this.state;
 
@@ -115,7 +114,7 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  renderInput (): React$Node {
+  renderInput () {
     const { t } = this.props;
     const { data, isHexData } = this.state;
 
@@ -148,7 +147,7 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  renderSignature (): React$Node {
+  renderSignature () {
     const { t } = this.props;
     const { signature } = this.state;
 
@@ -167,7 +166,7 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  renderUnlock (): React$Node {
+  renderUnlock () {
     const { currentPair, isUnlockVisible } = this.state;
 
     if (!isUnlockVisible) {
@@ -182,9 +181,9 @@ class Sign extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState = (newState: $Shape<State>): void => {
+  nextState = (newState: State): void => {
     this.setState(
-      (prevState: State): $Shape<State> => {
+      (prevState: State): State => {
         const { currentPair = prevState.currentPair, data = prevState.data, isHexData = prevState.isHexData, isUnlockVisible = prevState.isUnlockVisible } = newState;
         const isLocked = !currentPair || !currentPair.hasSecretKey();
         let signature = '';
@@ -216,19 +215,19 @@ class Sign extends React.PureComponent<Props, State> {
 
     this.nextState({
       isUnlockVisible: !isUnlockVisible
-    });
+    } as State);
   }
 
   onChangeAccount = (publicKey: Uint8Array): void => {
     const currentPair = keyring.getPair(publicKey);
 
-    this.nextState({ currentPair });
+    this.nextState({ currentPair } as State);
   }
 
   onChangeData = (data: string): void => {
     const isHexData = isHex(data);
 
-    this.nextState({ data, isHexData });
+    this.nextState({ data, isHexData } as State);
   }
 
   onUnlock = (): void => {

packages/app-toolbox/src/Unlock.js → packages/app-toolbox/src/Unlock.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { KeyringPair } from '@polkadot/util-keyring/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { KeyringPair } from '@polkadot/util-keyring/types';
 
 import React from 'react';
 import { Trans } from 'react-i18next';
@@ -19,12 +18,12 @@ import translate from './translate';
 
 type Props = I18nProps & {
   onClose: () => void,
-  pair: KeyringPair
+  pair: KeyringPair | null
 };
 
 type UnlockI18n = {
   key: string,
-  value: I18Next$Translate$Config
+  value: any // I18Next$Translate$Config
 }
 
 type State = {
@@ -40,15 +39,15 @@ class Unlock extends React.PureComponent<Props, State> {
     unlockError: null
   };
 
-  static getDerivedStateFromProps ({ pair }: Props, prevState: State): $Shape<State> {
+  static getDerivedStateFromProps ({ pair }: Props, prevState: State): State {
     return {
       address: pair
         ? pair.address()
         : ''
-    };
+    } as State;
   }
 
-  render (): React$Node {
+  render () {
     const { className, style, t } = this.props;
 
     return (
@@ -73,7 +72,7 @@ class Unlock extends React.PureComponent<Props, State> {
     );
   }
 
-  renderActions (): React$Node {
+  renderActions () {
     const { t } = this.props;
 
     return (
@@ -97,7 +96,7 @@ class Unlock extends React.PureComponent<Props, State> {
     );
   }
 
-  renderContent (): React$Node {
+  renderContent () {
     const { t } = this.props;
     const { address, password, unlockError } = this.state;
 
@@ -105,6 +104,7 @@ class Unlock extends React.PureComponent<Props, State> {
       <div className='toolbox--Unlock-Content' key='content'>
         <div className='expanded'>
           <p>
+            // @ts-ignore ok, Trans def seems wrong?
             <Trans i18nkey='unlock.info'>
               You are about to unlock your account <span className='code'>{address}</span> to allow for the signing of messages.
             </Trans>
@@ -131,10 +131,10 @@ class Unlock extends React.PureComponent<Props, State> {
     ];
   }
 
-  unlockAccount (password?: string): ?UnlockI18n {
+  unlockAccount (password?: string): UnlockI18n | null {
     const { pair } = this.props;
 
-    if (pair.hasSecretKey()) {
+    if (!pair || pair.hasSecretKey()) {
       return null;
     }
 

packages/app-toolbox/src/Verify.js → packages/app-toolbox/src/Verify.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps as Props } from '@polkadot/ui-app/types';
+import { I18nProps as Props } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -12,7 +11,7 @@ import Input from '@polkadot/ui-app/Input';
 import InputAddress from '@polkadot/ui-app/InputAddress';
 import Static from '@polkadot/ui-app/Static';
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 import hexToU8a from '@polkadot/util/hex/toU8a';
 import isHex from '@polkadot/util/is/hex';
 import u8aFromString from '@polkadot/util/u8a/fromString';
@@ -55,7 +54,7 @@ class Verify extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -70,7 +69,7 @@ class Verify extends React.PureComponent<Props, State> {
     );
   }
 
-  renderAddress (): React$Node {
+  renderAddress () {
     const { t } = this.props;
     const { defaultPublicKey, isValidAddress } = this.state;
 
@@ -90,7 +89,7 @@ class Verify extends React.PureComponent<Props, State> {
     );
   }
 
-  renderInput (): React$Node {
+  renderInput () {
     const { t } = this.props;
     const { data, isHexData } = this.state;
 
@@ -123,7 +122,7 @@ class Verify extends React.PureComponent<Props, State> {
     );
   }
 
-  renderSignature (): React$Node {
+  renderSignature () {
     const { t } = this.props;
     const { isValid, isValidSignature, signature } = this.state;
 
@@ -149,7 +148,7 @@ class Verify extends React.PureComponent<Props, State> {
     );
   }
 
-  nextState (newState: $Shape<State>): void {
+  nextState (newState: State): void {
     this.setState(
       (prevState: State): State => {
         const { isHexData = prevState.isHexData, isValidAddress = prevState.isValidAddress, isValidSignature = prevState.isValidSignature, currentPublicKey = prevState.currentPublicKey, data = prevState.data, signature = prevState.signature } = newState;
@@ -182,19 +181,19 @@ class Verify extends React.PureComponent<Props, State> {
   onChangeData = (data: string): void => {
     const isHexData = isHex(data);
 
-    this.nextState({ data, isHexData });
+    this.nextState({ data, isHexData } as State);
   }
 
   onChangeSignature = (signature: string): void => {
     const isValidSignature = isHex(signature) && signature.length === 130;
 
-    this.nextState({ signature, isValidSignature });
+    this.nextState({ signature, isValidSignature } as State);
   }
 
   onChangeAddress = (currentPublicKey: Uint8Array): void => {
     const isValidAddress = currentPublicKey && currentPublicKey.length === 32;
 
-    this.nextState({ currentPublicKey, isValidAddress });
+    this.nextState({ currentPublicKey, isValidAddress } as State);
   }
 }
 

packages/app-toolbox/src/index.js → packages/app-toolbox/src/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './index.css';
 
@@ -26,7 +25,7 @@ type State = {
 }
 
 // FIXME React-router would probably be the best route, not home-grown
-const Components: { [Actions]: React$ComponentType<{}> } = {
+const Components: { [index: string]: React.ComponentType<any> } = { // Actions
   'hash': Hash,
   'sign': Sign,
   'verify': Verify
@@ -37,7 +36,7 @@ class ToolboxApp extends React.PureComponent<Props, State> {
     action: 'hash'
   };
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
     const { action } = this.state;
     const Component = Components[action];
@@ -53,7 +52,7 @@ class ToolboxApp extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { action } = this.state;
 

packages/app-toolbox/src/translate.js → packages/app-toolbox/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-toolbox authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/app-vanitygen/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/app-vanitygen",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,8 +15,9 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/ui-app": "^0.17.15",
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/ui-app": "^0.18.0",
+    "@types/yargs": "^11.0.0",
     "chalk": "^2.4.1",
     "yargs": "10.1.2"
   },

packages/app-vanitygen/src/Match.js → packages/app-vanitygen/src/Match.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
+import { BareProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
@@ -26,7 +25,7 @@ type State = {
 };
 
 export default class Match extends React.PureComponent<Props, State> {
-  state: State = ({}: $Shape<State>);
+  state: State = {} as State;
 
   static getDerivedStateFromProps ({ seed }: Props): State {
     return {
@@ -34,7 +33,7 @@ export default class Match extends React.PureComponent<Props, State> {
     };
   }
 
-  render (): React$Node {
+  render () {
     const { address, className, count, offset, style } = this.props;
     const { hexSeed } = this.state;
 

packages/app-vanitygen/src/generator/calculate.js → packages/app-vanitygen/src/generator/calculate.ts

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Generator$Calculation, Generator$Options } from './types';
+import { Generator$Calculation, Generator$Options } from './types';
 
 function calculateAt (atOffset: number, test: Array<string>, address: string): Generator$Calculation {
   return {
@@ -18,7 +17,7 @@ function calculateAt (atOffset: number, test: Array<string>, address: string): G
   };
 }
 
-module.exports = function calculate (test: Array<string>, _address: string, { atOffset = -1, withCase = false }: Generator$Options): Generator$Calculation {
+export default function calculate (test: Array<string>, _address: string, { atOffset = -1, withCase = false }: Generator$Options): Generator$Calculation {
   const address = withCase
     ? _address
     : _address.toLowerCase();
@@ -44,4 +43,4 @@ module.exports = function calculate (test: Array<string>, _address: string, { at
     count: bestCount,
     offset: bestOffset
   };
-};
+}

packages/app-vanitygen/src/generator/cli.js → packages/app-vanitygen/src/generator/cli.ts

@@ -3,13 +3,20 @@
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
 
-const yargs = require('yargs');
-const chalk = require('chalk');
-const u8aToHex = require('@polkadot/util/u8a/toHex');
-
-const generator = require('./index.js');
-const matchRegex = require('./regex');
-const { pkFromSeed } = require('./sodium');
+import yargs from 'yargs';
+import chalk from 'chalk';
+import u8aToHex from '@polkadot/util/u8a/toHex';
+
+import generator from './index';
+import matchRegex from './regex';
+import { pkFromSeed } from './sodium';
+
+type Best = {
+  address: string,
+  count: number,
+  offset: number,
+  seed?: Uint8Array
+}
 
 const { match, withCase } = yargs
   .option('match', {
@@ -29,8 +36,12 @@ const options = {
   withCase
 };
 const startAt = Date.now();
-let best = { count: -1 };
-let total = 0;
+let best: Best = {
+  address: '',
+  count: -1,
+  offset: 65536
+};
+let total: number = 0;
 let indicator = -1;
 
 if (!matchRegex.test(match)) {
@@ -49,7 +60,7 @@ function showProgress () {
     indicator = 0;
   }
 
-  process.stdout.write(`\r[${INDICATORS[indicator]}] ${total.toString().match(NUMBER_REGEX).join(',')} keys in ${(elapsed).toFixed(2)}s (${(total / elapsed).toFixed(0)} keys/s)`);
+  process.stdout.write(`\r[${INDICATORS[indicator]}] ${(total.toString().match(NUMBER_REGEX) || []).join(',')} keys in ${(elapsed).toFixed(2)}s (${(total / elapsed).toFixed(0)} keys/s)`);
 }
 
 function showBest () {

packages/app-vanitygen/src/generator/generate.js

@@ -1,28 +0,0 @@
-// Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
-// This software may be modified and distributed under the terms
-// of the ISC license. See the LICENSE file for details.
-// @flow
-
-import type { Generator$PkFromSeed, Generator$Match, Generator$Options } from './types';
-
-const randomBytes = require('@polkadot/util-crypto/random/asU8a');
-const addressEncode = require('@polkadot/util-keyring/address/encode');
-const pairFromSeed = require('@polkadot/util-crypto/nacl/keypair/fromSeed');
-
-const calculate = require('./calculate');
-
-const tweetPkFromSeed = (seed: Uint8Array): Uint8Array =>
-  pairFromSeed(seed).publicKey;
-
-module.exports = function generator (test: Array<string>, options: Generator$Options, pkFromSeed?: Generator$PkFromSeed = tweetPkFromSeed): Generator$Match {
-  const seed = randomBytes();
-  const address = addressEncode(pkFromSeed(seed));
-  const { count, offset } = calculate(test, address, options);
-
-  return {
-    address,
-    count,
-    offset,
-    seed
-  };
-};

packages/app-vanitygen/src/generator/generate.ts

@@ -0,0 +1,27 @@
+// Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { Generator$PkFromSeed, Generator$Match, Generator$Options } from './types';
+
+import randomBytes from '@polkadot/util-crypto/random/asU8a';
+import addressEncode from '@polkadot/util-keyring/address/encode';
+import pairFromSeed from '@polkadot/util-crypto/nacl/keypair/fromSeed';
+
+import calculate from './calculate';
+
+const tweetPkFromSeed = (seed: Uint8Array): Uint8Array =>
+  pairFromSeed(seed).publicKey;
+
+export default function generator (test: Array<string>, options: Generator$Options, pkFromSeed: Generator$PkFromSeed = tweetPkFromSeed): Generator$Match {
+  const seed = randomBytes();
+  const address = addressEncode(pkFromSeed(seed));
+  const { count, offset } = calculate(test, address, options);
+
+  return {
+    address,
+    count,
+    offset,
+    seed
+  };
+}

packages/app-vanitygen/src/generator/index.js → packages/app-vanitygen/src/generator/index.ts

@@ -1,13 +1,12 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Generator$PkFromSeed, Generator$Matches, Generator$Result, Generator$Options } from './types';
+import { Generator$PkFromSeed, Generator$Matches, Generator$Result, Generator$Options } from './types';
 
-const generate = require('./generate');
+import generate from './generate';
 
-module.exports = function generator (options: Generator$Options, pkFromSeed?: Generator$PkFromSeed): Generator$Result {
+export default function generator (options: Generator$Options, pkFromSeed?: Generator$PkFromSeed): Generator$Result {
   const { match, runs = 10, withCase = false } = options;
   const test = withCase
     ? match.split('')
@@ -23,4 +22,4 @@ module.exports = function generator (options: Generator$Options, pkFromSeed?: Ge
     elapsed: Date.now() - startAt,
     found
   };
-};
+}

packages/app-vanitygen/src/generator/regex.js → packages/app-vanitygen/src/generator/regex.ts

@@ -1,8 +1,7 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 const regex = new RegExp('^[1-9A-HJ-NP-Za-km-z]*$', '');
 
-module.exports = regex;
+export default regex;

packages/app-vanitygen/src/generator/sodium.js → packages/app-vanitygen/src/generator/sodium.ts

@@ -1,12 +1,13 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-const bufferToU8a = require('@polkadot/util/buffer/toU8a');
-const u8aToBuffer = require('@polkadot/util/u8a/toBuffer');
+import bufferToU8a from '@polkadot/util/buffer/toU8a';
+import u8aToBuffer from '@polkadot/util/u8a/toBuffer';
 
-let pkFromSeed = void 0;
+type PkSeedFn = (seed: Uint8Array) => Uint8Array;
+
+let pkFromSeed: PkSeedFn | undefined;
 
 try {
   const sodium = require('sodium');
@@ -22,6 +23,6 @@ try {
   console.log(`Using NaCl bindings from 'tweet-nacl' (faster 'sodium' dependency not installed)`);
 }
 
-module.exports = {
+export {
   pkFromSeed
 };

packages/app-vanitygen/src/generator/sort.js → packages/app-vanitygen/src/generator/sort.ts

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Generator$Match } from './types';
+import { Generator$Match } from './types';
 
 function numberSort (a: number, b: number): number {
   if (a > b) {
@@ -15,7 +14,7 @@ function numberSort (a: number, b: number): number {
   return 0;
 }
 
-module.exports = function sort (a: Generator$Match, b: Generator$Match): number {
+export default function sort (a: Generator$Match, b: Generator$Match): number {
   const countResult = numberSort(a.count, b.count);
 
   if (countResult !== 0) {

packages/app-vanitygen/src/generator/types.js → packages/app-vanitygen/src/generator/types.d.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 export type Generator$Calculation = {
   count: number,

packages/app-vanitygen/src/index.js → packages/app-vanitygen/src/index.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { Generator$Matches, Generator$Result } from './generator/types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { Generator$Matches, Generator$Result } from './generator/types';
 
 import './index.css';
 
@@ -56,7 +55,7 @@ class VanityApp extends React.PureComponent<Props, State> {
     withCase: true
   };
 
-  render (): React$Node {
+  render () {
     const { className, style } = this.props;
 
     return (
@@ -72,7 +71,7 @@ class VanityApp extends React.PureComponent<Props, State> {
     );
   }
 
-  renderButtons (): React$Node {
+  renderButtons () {
     const { t } = this.props;
     const { isMatchValid, isRunning } = this.state;
 
@@ -92,7 +91,7 @@ class VanityApp extends React.PureComponent<Props, State> {
     );
   }
 
-  renderMatches (): React$Node {
+  renderMatches () {
     const { matches } = this.state;
 
     return (
@@ -108,7 +107,7 @@ class VanityApp extends React.PureComponent<Props, State> {
     );
   }
 
-  renderOptions (): React$Node {
+  renderOptions () {
     const { t } = this.props;
     const { isMatchValid, isRunning, match, withCase } = this.state;
 
@@ -147,7 +146,7 @@ class VanityApp extends React.PureComponent<Props, State> {
     );
   }
 
-  renderStats (): React$Node {
+  renderStats () {
     const { t } = this.props;
     const { elapsed, keyCount } = this.state;
 

packages/app-vanitygen/src/translate.js → packages/app-vanitygen/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/app-vanitygen authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/apps/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/apps",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "description": "An Apps portal into the Polkadot network",
   "main": "index.js",
   "homepage": ".",
@@ -16,17 +16,17 @@
     "check": "stylelint 'src/**/*.css' && eslint src && flow check"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/app-accounts": "^0.17.15",
-    "@polkadot/app-addresses": "^0.17.15",
-    "@polkadot/app-explorer": "^0.17.15",
-    "@polkadot/app-extrinsics": "^0.17.15",
-    "@polkadot/app-rpc": "^0.17.15",
-    "@polkadot/app-storage": "^0.17.15",
-    "@polkadot/app-toolbox": "^0.17.15",
-    "@polkadot/app-vanitygen": "^0.17.15",
-    "@polkadot/ui-app": "^0.17.15",
-    "@polkadot/ui-signer": "^0.17.15"
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/app-accounts": "^0.18.0",
+    "@polkadot/app-addresses": "^0.18.0",
+    "@polkadot/app-explorer": "^0.18.0",
+    "@polkadot/app-extrinsics": "^0.18.0",
+    "@polkadot/app-rpc": "^0.18.0",
+    "@polkadot/app-storage": "^0.18.0",
+    "@polkadot/app-toolbox": "^0.18.0",
+    "@polkadot/app-vanitygen": "^0.18.0",
+    "@polkadot/ui-app": "^0.18.0",
+    "@polkadot/ui-signer": "^0.18.0"
   },
   "devDependencies": {
     "babel-loader": "^8.0.0-beta.2",

packages/apps/src/Connecting/index.js

@@ -1,41 +0,0 @@
-// Copyright 2017-2018 @polkadot/apps authors & contributors
-// This software may be modified and distributed under the terms
-// of the ISC license. See the LICENSE file for details.
-// @flow
-
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { ApiProps } from '@polkadot/ui-react-rx/types';
-
-import './Connecting.css';
-
-import React from 'react';
-
-import classes from '@polkadot/ui-app/util/classes';
-import withApi from '@polkadot/ui-react-rx/with/api';
-
-import translate from '../translate';
-
-type Props = I18nProps & ApiProps;
-
-function Connecting ({ apiConnected, className, style, t }: Props): React$Node {
-  if (apiConnected) {
-    return null;
-  }
-
-  return (
-    <div
-      className={classes('apps--Connecting', className)}
-      style={style}
-    >
-      <div className='apps--Connecting-text'>
-        {t('connecting.disconnected', {
-          defaultValue: 'You are not connected to a node. Ensure that your node is running and that the Websocket endpoint is reachable.'
-        })}
-      </div>
-    </div>
-  );
-}
-
-export default translate(
-  withApi(Connecting)
-);

packages/apps/src/Connecting/index.tsx

@@ -0,0 +1,44 @@
+// Copyright 2017-2018 @polkadot/apps authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { I18nProps } from '@polkadot/ui-app/types';
+import { ApiProps } from '@polkadot/ui-react-rx/types';
+
+import './Connecting.css';
+
+import React from 'react';
+
+import classes from '@polkadot/ui-app/util/classes';
+import withApi from '@polkadot/ui-react-rx/with/api';
+
+import translate from '../translate';
+
+type Props = I18nProps & ApiProps;
+
+class Connecting extends React.PureComponent<Props> {
+  render () {
+    const { apiConnected, className, style, t } = this.props;
+
+    if (apiConnected) {
+      return null;
+    }
+
+    return (
+      <div
+        className={classes('apps--Connecting', className)}
+        style={style}
+      >
+        <div className='apps--Connecting-text'>
+          {t('connecting.disconnected', {
+            defaultValue: 'You are not connected to a node. Ensure that your node is running and that the Websocket endpoint is reachable.'
+          })}
+        </div>
+      </div>
+    );
+  }
+}
+
+export default translate(
+  withApi(Connecting)
+);

packages/apps/src/Content/index.js

@@ -1,38 +0,0 @@
-// Copyright 2017-2018 @polkadot/apps authors & contributors
-// This software may be modified and distributed under the terms
-// of the ISC license. See the LICENSE file for details.
-// @flow
-
-import type { Location } from 'react-router-dom';
-import type { I18nProps } from '@polkadot/ui-app/types';
-
-import './Content.css';
-
-import React from 'react';
-import { withRouter } from 'react-router';
-
-import classes from '@polkadot/ui-app/util/classes';
-
-import routing from '../routing';
-
-type Props = I18nProps & {
-  location: Location
-};
-
-function Content ({ children, className, location, style }: Props): React$Node {
-  const app = location.pathname.slice(1) || routing.default;
-  const { Component } = routing.routes.find((route) =>
-    route && route.name === app
-  ) || routing.unknown;
-
-  return (
-    <div
-      className={classes('apps--Content', className)}
-      style={style}
-    >
-      <Component />
-    </div>
-  );
-}
-
-export default withRouter(Content);

packages/apps/src/Content/index.tsx

@@ -0,0 +1,44 @@
+// Copyright 2017-2018 @polkadot/apps authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { I18nProps } from '@polkadot/ui-app/types';
+import { Route } from '../types';
+
+import './Content.css';
+
+import React from 'react';
+import { withRouter } from 'react-router';
+
+import classes from '@polkadot/ui-app/util/classes';
+
+import routing from '../routing';
+
+type Props = I18nProps & {
+  location: Location
+};
+
+class Content extends React.PureComponent<Props> {
+  render () {
+    const { className, location, style } = this.props;
+
+    const app = location.pathname.slice(1) || routing.default;
+    const { Component } = routing.routes.find((route: Route | null) =>
+      route
+        ? route.name === app
+        : false
+    ) || routing.unknown;
+
+    return (
+      <div
+        className={classes('apps--Content', className)}
+        style={style}
+      >
+        <Component />
+      </div>
+    );
+  }
+}
+
+// @ts-ignore Ok, here the definition doesn't like this one... at all :(
+export default withRouter(Content);

packages/apps/src/NodeInfo.js → packages/apps/src/NodeInfo.tsx

@@ -1,14 +1,13 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 
 import classes from '@polkadot/ui-app/util/classes';
-import keyring from '@polkadot/ui-keyring';
+import keyring from '@polkadot/ui-keyring/index';
 import Chain from '@polkadot/ui-react-rx/Chain';
 import NodeName from '@polkadot/ui-react-rx/NodeName';
 import NodeVersion from '@polkadot/ui-react-rx/NodeVersion';
@@ -18,11 +17,10 @@ import translate from './translate';
 type Props = I18nProps & {};
 
 function updateTestInfo (chain?: string) {
-  console.log('updateTestInfo:chain', chain);
   keyring.setTestMode(chain === 'dev');
 }
 
-function NodeInfo ({ className, style, t }: Props): React$Node {
+function NodeInfo ({ className, style, t }: Props) {
   return (
     <div className={classes('apps--NodeInfo', className)}>
       <Chain

packages/apps/src/NotFound/index.js → packages/apps/src/NotFound/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './NotFound.css';
 
@@ -15,7 +14,7 @@ import translate from '../translate';
 
 type Props = I18nProps & {};
 
-function NotFound ({ className, style, t }: Props): React$Node {
+function NotFound ({ className, style, t }: Props) {
   return (
     <div
       className={classes('apps--NotFound', className)}

packages/apps/src/SideBar/Item.js → packages/apps/src/SideBar/Item.tsx

@@ -1,10 +1,9 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
-import type { Route } from '../types';
+import { I18nProps } from '@polkadot/ui-app/types';
+import { Route } from '../types';
 
 import './Item.css';
 
@@ -18,7 +17,7 @@ type Props = I18nProps & {
   route: Route
 };
 
-export default function Item ({ route: { i18n, icon, isExact, name, path = '' }, t }: Props): React$Node {
+export default function Item ({ route: { i18n, icon, isExact, name, path = '' }, t }: Props) {
   return (
     <Menu.Item className='apps--SideBar-Item'>
       <NavLink

packages/apps/src/SideBar/index.js → packages/apps/src/SideBar/index.tsx

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '@polkadot/ui-app/types';
+import { I18nProps } from '@polkadot/ui-app/types';
 
 import './SideBar.css';
 
@@ -18,10 +17,10 @@ import translate from '../translate';
 import Item from './Item';
 
 type Props = I18nProps & {
-  children?: React$Node
+  children?: any, // React$Node
 };
 
-function SideBar ({ children, className, style, t }: Props): React$Node {
+function SideBar ({ children, className, style, t }: Props) {
   return (
     <div
       className={classes('apps--SideBar', className)}

packages/apps/src/index.js → packages/apps/src/index.tsx

@@ -1,17 +1,16 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
+import { BareProps } from '@polkadot/ui-app/types';
 
 import './index.css';
 
 import React from 'react';
 
-import createApp from '@polkadot/ui-app';
+import createApp from '@polkadot/ui-app/index';
 import classes from '@polkadot/ui-app/util/classes';
-import Signer from '@polkadot/ui-signer';
+import Signer from '@polkadot/ui-signer/index';
 
 import Connecting from './Connecting';
 import Content from './Content';
@@ -20,7 +19,7 @@ import SideBar from './SideBar';
 
 type Props = BareProps & {};
 
-function App ({ className, style }: Props): React$Node {
+function App ({ className, style }: Props) {
   return (
     <div
       className={classes('apps--App', className)}

packages/apps/src/routing/accounts.js → packages/apps/src/routing/accounts.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Accounts from '@polkadot/app-accounts';
+import Accounts from '@polkadot/app-accounts/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'accounts'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/addresses.js → packages/apps/src/routing/addresses.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Addresses from '@polkadot/app-addresses';
+import Addresses from '@polkadot/app-addresses/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'addresses'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/explorer.js → packages/apps/src/routing/explorer.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Explorer from '@polkadot/app-explorer';
+import Explorer from '@polkadot/app-explorer/index';
 
 export default ([
   {
@@ -19,4 +18,4 @@ export default ([
     name: 'explorer',
     path: '/'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/extrinsics.js → packages/apps/src/routing/extrinsics.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Extrinsics from '@polkadot/app-extrinsics';
+import Extrinsics from '@polkadot/app-extrinsics/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'extrinsics'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/index.js → packages/apps/src/routing/index.ts

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routing } from '../types';
+import { Routing, Routes } from '../types';
 
 import accounts from './accounts';
 import addresses from './addresses';
@@ -19,8 +18,8 @@ import vanitygen from './vanitygen';
 
 export default ({
   default: 'explorer',
-  routes: [].concat(
+  routes: ([] as Routes).concat(
     explorer, extrinsics, storage, null, accounts, addresses, vanitygen, null, rpc, toolbox
   ),
   unknown
-}: Routing);
+} as Routing);

packages/apps/src/routing/rpc.js → packages/apps/src/routing/rpc.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Rpc from '@polkadot/app-rpc';
+import Rpc from '@polkadot/app-rpc/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'rpc'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/storage.js → packages/apps/src/routing/storage.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Storage from '@polkadot/app-storage';
+import Storage from '@polkadot/app-storage/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'storage'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/toolbox.js → packages/apps/src/routing/toolbox.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Toolbox from '@polkadot/app-toolbox';
+import Toolbox from '@polkadot/app-toolbox/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'toolbox'
   }
-]: Routes);
+] as Routes);

packages/apps/src/routing/unknown.js → packages/apps/src/routing/unknown.ts

@@ -1,9 +1,8 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Route } from '../types';
+import { Route } from '../types';
 
 import NotFound from '../NotFound';
 
@@ -12,8 +11,8 @@ export default ({
   i18n: {
     defaultValue: 'Not found'
   },
-  icon: 'error',
+  icon: 'warning circle',
   isExact: false,
   isHidden: true,
   name: 'unknown'
-}: Route);
+} as Route);

packages/apps/src/routing/vanitygen.js → packages/apps/src/routing/vanitygen.ts

@@ -1,11 +1,10 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { Routes } from '../types';
+import { Routes } from '../types';
 
-import Vanity from '@polkadot/app-vanitygen';
+import Vanity from '@polkadot/app-vanitygen/index';
 
 export default ([
   {
@@ -18,4 +17,4 @@ export default ([
     isHidden: false,
     name: 'vanitygen'
   }
-]: Routes);
+] as Routes);

packages/apps/src/translate.js → packages/apps/src/translate.ts

@@ -1,7 +1,6 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
 import { translate } from 'react-i18next';
 

packages/apps/src/types.js → packages/apps/src/types.d.ts

@@ -1,14 +1,14 @@
 // Copyright 2017-2018 @polkadot/apps authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '@polkadot/ui-app/types';
+import { SemanticICONS } from 'semantic-ui-react/dist/commonjs';
+import { BareProps } from '@polkadot/ui-app/types';
 
 export type Route = {
-  Component: React$ComponentType<BareProps>,
-  i18n: I18Next$Translate$Config,
-  icon: string,
+  Component: React.ComponentType<BareProps>,
+  i18n: any, // I18Next$Translate$Config,
+  icon: SemanticICONS,
   isExact: boolean,
   isHidden: boolean,
   name: string,

packages/apps/webpack.config.js

@@ -24,7 +24,7 @@ function createWebpack ({ alias = {}, context, name = 'index' }) {
   return {
     context,
     devtool: isProd ? 'source-map' : 'cheap-eval-source-map',
-    entry: `./src/${name}.js`,
+    entry: `./src/${name}.tsx`,
     mode: ENV,
     output: {
       path: path.join(context, 'build'),
@@ -32,7 +32,8 @@ function createWebpack ({ alias = {}, context, name = 'index' }) {
       chunkFilename: `[name].[chunkhash:8].js`
     },
     resolve: {
-      alias
+      alias,
+      extensions: ['.js', '.jsx', '.ts', '.tsx']
     },
     module: {
       rules: [
@@ -77,7 +78,7 @@ function createWebpack ({ alias = {}, context, name = 'index' }) {
           ]
         },
         {
-          test: /\.js$/,
+          test: /\.(js|ts|tsx)$/,
           exclude: /(node_modules)/,
           use: [
             require.resolve('thread-loader'),

packages/ui-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polkadot/ui-app",
-  "version": "0.17.15",
+  "version": "0.18.0",
   "main": "index.js",
   "repository": "https://github.com/polkadot-js/apps.git",
   "author": "Jaco Greeff <jacogr@gmail.com>",
@@ -15,20 +15,27 @@
     "test": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0-beta.47",
-    "@polkadot/extrinsics": "^0.17.24",
-    "@polkadot/storage": "^0.17.24",
-    "@polkadot/ui-keyring": "^0.17.15",
-    "@polkadot/ui-react": "^0.17.15",
-    "@polkadot/ui-react-rx": "^0.17.15",
+    "@babel/runtime": "^7.0.0-beta.51",
+    "@polkadot/extrinsics": "^0.19.5",
+    "@polkadot/storage": "^0.19.5",
+    "@polkadot/ui-keyring": "^0.18.0",
+    "@polkadot/ui-react": "^0.18.0",
+    "@polkadot/ui-react-rx": "^0.18.0",
+    "@types/i18next-browser-languagedetector": "^2.0.1",
+    "@types/i18next-xhr-backend": "^1.4.1",
+    "@types/react-copy-to-clipboard": "^4.2.5",
+    "@types/react-dropzone": "^4.2.0",
+    "@types/react-i18next": "^7.6.1",
+    "@types/react-router-dom": "^4.2.7",
     "i18next": "^11.1.1",
     "i18next-browser-languagedetector": "^2.2.0",
     "i18next-xhr-backend": "^1.5.1",
-    "react": "^16.4.0",
+    "react": "^16.4.1",
     "react-copy-to-clipboard": "^5.0.1",
-    "react-dom": "^16.4.0",
-    "react-i18next": "^7.5.1",
-    "react-router-dom": "^4.2.2",
+    "react-dom": "^16.4.1",
+    "react-i18next": "^7.7.0",
+    "react-router": "^4.3.1",
+    "react-router-dom": "^4.3.1",
     "semantic-ui-css": "^2.3.1",
     "semantic-ui-react": "^0.80.0",
     "store": "^2.0.12"

packages/ui-app/src/Button/Divider.js → packages/ui-app/src/Button/Divider.tsx

@@ -1,17 +1,14 @@
 // Copyright 2017-2018 @polkadot/ui-app authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '../types';
+import { DividerProps } from './types';
 
 import React from 'react';
 
 import classes from '../util/classes';
 
-type Props = BareProps;
-
-function ButtonDivider ({ className, style }: Props): React$Node {
+function ButtonDivider ({ className, style }: DividerProps) {
   return (
     <div
       className={classes('ui button compact mini basic', className)}

packages/ui-app/src/Button/Group.js → packages/ui-app/src/Button/Group.tsx

@@ -1,22 +1,17 @@
 // Copyright 2017-2018 @polkadot/ui-app authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '../types';
+import { GroupProps, GroupType } from './types';
 
 import React from 'react';
-import SUIButton from 'semantic-ui-react/dist/es/elements/Button';
+import SUIButton from 'semantic-ui-react/dist/commonjs/elements/Button/Button';
 
 import Button from '@polkadot/ui-app/Button';
 import classes from '../util/classes';
 import Divider from './Divider';
 
-type Props = BareProps & {
-  children?: React$Node
-};
-
-function ButtonGroup ({ children, className, style }: Props): React$Node {
+function ButtonGroup ({ children, className, style }: GroupProps) {
   return (
     <div
       className={classes('ui--Button-Group', className)}
@@ -30,6 +25,6 @@ function ButtonGroup ({ children, className, style }: Props): React$Node {
   );
 }
 
-ButtonGroup.Divider = Divider;
+(ButtonGroup as GroupType).Divider = Divider;
 
-export default ButtonGroup;
+export default (ButtonGroup as GroupType);

packages/ui-app/src/Button/Or.js → packages/ui-app/src/Button/Or.tsx

@@ -1,12 +1,11 @@
 // Copyright 2017-2018 @polkadot/ui-app authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { I18nProps } from '../types';
+import { I18nProps } from '../types';
 
 import React from 'react';
-import SUIButton from 'semantic-ui-react/dist/es/elements/Button';
+import SUIButton from 'semantic-ui-react/dist/commonjs/elements/Button/Button';
 
 import isUndefined from '@polkadot/util/is/undefined';
 
@@ -16,7 +15,7 @@ type Props = I18nProps & {
   text?: string
 };
 
-function ButtonOr ({ className, style, t, text }: Props): React$Node {
+function ButtonOr ({ className, style, t, text }: Props) {
   return (
     <SUIButton.Or
       className={className}

packages/ui-app/src/Button/index.js → packages/ui-app/src/Button/index.tsx

@@ -1,14 +1,13 @@
 // Copyright 2017-2018 @polkadot/ui-app authors & contributors
 // This software may be modified and distributed under the terms
 // of the ISC license. See the LICENSE file for details.
-// @flow
 
-import type { BareProps } from '../types';
+import { ButtonProps, ButtonType } from './types';
 
 import './Button.css';
 
 import React from 'react';
-import SUIButton from 'semantic-ui-react/dist/es/elements/Button';
+import SUIButton from 'semantic-ui-react/dist/commonjs/elements/Button/Button';
 
 import isUndefined from '@polkadot/util/is/undefined';
 
@@ -16,24 +15,7 @@ import Divider from './Divider';
 import Group from './Group';
 import Or from './Or';
 
-export type Button$Sizes = 'mini' | 'tiny' | 'small' | 'medium' | 'large' | 'big' | 'huge' | 'massive';
-
-type Props = BareProps & {
-  children?: React$Node,
-  floated?: 'left' | 'right',
-  icon?: string,
-  isBasic?: boolean,
-  isCircular?: boolean,
-  isDisabled?: boolean,
-  isNegative?: boolean,
-  isPrimary?: boolean,
-  onClick?: () => void | Promise<void>,
-  size?: Button$Sizes,
-  // flowlint-next-line unclear-type:off
-  text?: any
-};
-
-function Button ({ children, className, floated, icon, isBasic = false, isCircular = false, isDisabled = false, isNegative = false, isPrimary = false, onClick, size, style, text }: Props): React$Node {
+function Button ({ children, className, floated, icon, isBasic = false, isCircular = false, isDisabled = false, isNegative = false, isPrimary = false, onClick, size, style, text }: ButtonProps) {
   const props = {
     basic: isBasic,
     circular: isCircular,
@@ -60,8 +42,8 @@ function Button ({ children, className, floated, icon, isBasic = false, isCircul
     );
 }
 
-Button.Divider = Divider;
-Button.Group = Group;
-Button.Or = Or;
+(Button as ButtonType).Divider = Divider;
+(Button as ButtonType).Group = Group;
+(Button as ButtonType).Or = Or;
 
-export default Button;
+export default (Button as ButtonType);

packages/ui-app/src/Button/types.d.ts

@@ -0,0 +1,37 @@
+// Copyright 2017-2018 @polkadot/ui-app authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { BareProps } from '../types';
+
+export type Button$Sizes = 'mini' | 'tiny' | 'small' | 'medium' | 'large' | 'big' | 'huge' | 'massive';
+
+export type ButtonProps = BareProps & {
+  children?: any,
+  floated?: 'left' | 'right',
+  icon?: string,
+  isBasic?: boolean,
+  isCircular?: boolean,
+  isDisabled?: boolean,
+  isNegative?: boolean,
+  isPrimary?: boolean,
+  onClick?: () => void | Promise<void>,
+  size?: Button$Sizes,
+  text?: any
+};
+
+export type DividerProps = BareProps;
+
+export type GroupProps = BareProps & {
+  children?: any
+};
+
+export type GroupType = React.ComponentType<GroupProps> & {
+  Divider: React.ComponentType<DividerProps>
+}
+
+export type ButtonType = React.ComponentType<ButtonProps> & {
+  Divider: React.ComponentType<DividerProps>,
+  Group: GroupType,
+  Or: React.ComponentType<BareProps>
+}