Merge pull request facebook#363 from iamdustan/flow-023

flow 0.23

Author: kassens

.eslintrc

@@ -8,7 +8,7 @@ plugins:
  - react
 
 globals:
- ReactElement: false
+ React$Element: false
 
 rules:
  brace-style: [2, 1tbs]

.flowconfig

@@ -15,4 +15,4 @@ suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe
 suppress_comment=\\(.\\|\n\\)*\\$FlowIssue
 
 [version]
-0.21.0
+0.23.0

.travis.yml

@@ -8,3 +8,12 @@ script:
  - npm run lint
  - flow check
  - npm test
+env:
+ - CXX=g++-4.8
+addons:
+ apt:
+ sources:
+ - ubuntu-toolchain-r-test
+ packages:
+ - g++-4.8
+

frontend/BlurInput.js

@@ -12,9 +12,25 @@
 
 var React = require('react');
 
-import type {DOMEvent} from './types';
+import type {DOMEvent, DOMNode} from './types';
+
+type Props = {
+ value?: string,
+ onChange: (text: string) => any,
+};
+
+type DefaultProps = {};
+type State = {
+ text: string,
+};
+
 
 class BlurInput extends React.Component {
+ props: Props;
+ defaultProps: DefaultProps;
+ state: State;
+ node: ?DOMNode;
+
  constructor(props: Object) {
  super(props);
  this.state = {text: this.props.value || ''};
@@ -39,7 +55,7 @@ class BlurInput extends React.Component {
  }
  }
 
- render(): ReactElement {
+ render() {
  return (
  <input
  value={this.state.text}

frontend/Container.js

@@ -22,8 +22,8 @@ import type MenuItem from './ContextMenu';
 class Container extends React.Component {
  props: {
  reload: () => void,
- extraPanes: Array<(node: Object) => ReactElement>,
- extraTabs: ?{[key: string]: () => ReactElement},
+ extraPanes: Array<(node: Object) => React$Element>,
+ extraTabs: ?{[key: string]: () => React$Element},
  menuItems: {
  tree?: (id: string, node: Object, store: Object) => ?Array<MenuItem>,
  attr?: (
@@ -35,10 +35,10 @@ class Container extends React.Component {
  store: Object
  ) => ?Array<MenuItem>,
  },
- extraTabs: {[key: string]: () => ReactElement},
+ extraTabs: {[key: string]: () => React$Element},
  };
 
- render(): ReactElement {
+ render() {
  var tabs = {
  Elements: () => (
  <SplitPane

frontend/DataView/DataView.js

@@ -19,18 +19,23 @@ var assign = require('object-assign');
 var consts = require('../../agent/consts');
 var previewComplex = require('./previewComplex');
 
+type Inspect = (path: Array<string>, cb: () => void) => void;
+type ShowMenu = boolean | (e: DOMEvent, val: any, path: Array<string>, name: string) => void;
+
+type DataViewProps = {
+ data: Object,
+ path: Array<string>,
+ inspect: Inspect,
+ showMenu: ShowMenu,
+ startOpen?: boolean,
+ noSort?: boolean,
+ readOnly?: boolean,
+};
+
 class DataView extends React.Component {
- props: {
- data: Object,
- path: Array<string>,
- inspect: (path: Array<string>, cb: () => void) => void,
- showMenu: (e: DOMEvent, val: any, path: Array<string>, name: string) => void,
- startOpen: boolean,
- noSort?: boolean,
- readOnly: boolean,
- };
+ props: DataViewProps;
 
- render(): ReactElement {
+ render() {
  var data = this.props.data;
  if (!data) {
  return <div style={styles.missing}>null</div>;
@@ -80,9 +85,22 @@ class DataView extends React.Component {
 }
 
 class DataItem extends React.Component {
+ props: {
+ path: Array<string>,
+ inspect: Inspect,
+ showMenu: ShowMenu,
+ startOpen?: boolean,
+ noSort?: boolean,
+ readOnly?: boolean,
+ name: string,
+ value: any,
+ };
+ defaultProps: {};
+ state: {open: boolean, loading: boolean};
+
  constructor(props) {
  super(props);
- this.state = {open: this.props.startOpen, loading: false};
+ this.state = {open: !!this.props.startOpen, loading: false};
  }
 
  componentDidMount() {
@@ -182,7 +200,11 @@ class DataItem extends React.Component {
  {this.props.name}:
  </div>
  <div
- onContextMenu={e => this.props.showMenu(e, this.props.value, this.props.path, this.props.name)}
+ onContextMenu={e => {
+ if (typeof this.props.showMenu === 'function') {
+ return this.props.showMenu(e, this.props.value, this.props.path, this.props.name);
+ }
+ }}
  style={styles.preview}
  >
  {preview}

frontend/DataView/Simple.js

@@ -17,12 +17,21 @@ var assign = require('object-assign');
 var flash = require('../flash');
 var valueStyles = require('../value-styles');
 
-import type {DOMEvent} from '../types';
+import type {DOMEvent, DOMNode} from '../types';
+
+type State = {
+ editing: boolean,
+ text: string,
+};
 
 class Simple extends React.Component {
+ state: State;
+ input: DOMNode;
+
  constructor(props: Object) {
  super(props);
  this.state = {
+ text: '',
  editing: false,
  };
  }
@@ -90,7 +99,7 @@ class Simple extends React.Component {
  }
  }
 
- render(): ReactElement {
+ render() {
  if (this.state.editing) {
  return (
  <input

frontend/Draggable.js

@@ -50,7 +50,7 @@ class Draggable extends React.Component {
  this.props.onStop();
  }
 
- render(): ReactElement {
+ render() {
  return (
  <div
  style={this.props.style}

frontend/HighlightHover.js

@@ -13,13 +13,26 @@
 var React = require('react');
 var assign = require('object-assign');
 
+type Props = {
+ style: ?Object,
+ children?: any,
+};
+
+type State = {
+ hover: boolean,
+};
+
 class HighlightHover extends React.Component {
+ props: Props;
+ defaultProps: {};
+ state: State;
+
  constructor(props: Object) {
  super(props);
  this.state = {hover: false};
  }
 
- render(): ReactElement {
+ render() {
  return (
  <div
  onMouseOver={() => !this.state.hover && this.setState({hover: true})}

frontend/Node.js

@@ -64,7 +64,7 @@ class Node extends React.Component {
  this.context.scrollTo(node.offsetTop, node.offsetHeight);
  }
 
- render(): ReactElement {
+ render() {
  var node = this.props.node;
  if (!node) {
  return <span>Node was deleted</span>;