Merge pull request #3873 from Asana/react

React updates
This commit is contained in:
John Reilly
2015-03-18 17:56:49 +00:00
7 changed files with 145 additions and 81 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
# React v0.13.0-beta Type Definitions
# React v0.13.0 Type Definitions
This folder contains the following `.d.ts` files:
* `react-0.13.0.d.ts` declares the external module `"react"`
+9 -1
View File
@@ -1,4 +1,4 @@
// Type definitions for ReactWithAddons v0.13.0 RC2 (internal module)
// Type definitions for ReactWithAddons v0.13.1 (internal module)
// Project: http://facebook.github.io/react/
// Definitions by: Asana <https://asana.com>, AssureSign <http://www.assuresign.com>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
@@ -179,6 +179,8 @@ declare module React {
findRenderedComponentWithType<C extends Component<any, any>>(
tree: Component<any, any>,
type: ComponentClass<any>): C;
createRenderer(): ShallowRenderer;
}
interface SyntheticEventData {
@@ -255,5 +257,11 @@ declare module React {
touchStart: EventSimulator;
wheel: EventSimulator;
}
class ShallowRenderer {
getRenderOutput<C extends Component<any, any>>(): C;
render(element: ReactElement<any>, context?: any): void;
unmount(): void;
}
}
+20 -1
View File
@@ -224,6 +224,20 @@ React.DOM.div(htmlAttr);
React.DOM.span(htmlAttr);
React.DOM.input(htmlAttr);
React.DOM.svg({ viewBox: "0 0 48 48" },
React.DOM.rect({
x: 22,
y: 10,
width: 4,
height: 28
}),
React.DOM.rect({
x: 10,
y: 22,
width: 28,
height: 4
}));
//
// React.PropTypes
// --------------------------------------------------------------------------
@@ -324,7 +338,7 @@ interface TimerState {
secondsElapsed: number;
}
class Timer extends React.Component<React.Props<Timer>, TimerState> {
static state = {
state = {
secondsElapsed: 0
}
private _interval: number;
@@ -387,3 +401,8 @@ React.addons.TestUtils.Simulate.click(node);
React.addons.TestUtils.Simulate.change(node);
React.addons.TestUtils.Simulate.keyDown(node, { key: "Enter" });
var renderer: React.ShallowRenderer =
React.addons.TestUtils.createRenderer();
renderer.render(React.createElement(Timer));
var output: Timer = renderer.getRenderOutput<Timer>();
+38 -25
View File
@@ -1,4 +1,4 @@
// Type definitions for ReactWithAddons v0.13.0 RC2 (external module)
// Type definitions for ReactWithAddons v0.13.1 (external module)
// Project: http://facebook.github.io/react/
// Definitions by: Asana <https://asana.com>, AssureSign <http://www.assuresign.com>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
@@ -131,7 +131,7 @@ declare module "react/addons" {
// Base component for plain JS classes
class Component<P, S> implements ComponentLifecycle<P, S> {
constructor(props: P, context: any);
constructor(props?: P, context?: any);
setState(f: (prevState: S, props: P) => S, callback?: () => any): void;
setState(state: S, callback?: () => any): void;
forceUpdate(): void;
@@ -368,14 +368,18 @@ declare module "react/addons" {
};
}
// This interface is not complete. Only properties accepting
// unitless numbers are listed here (see CSSProperty.js in React)
interface CSSProperties {
boxFlex?: number;
boxFlexGroup?: number;
columnCount?: number;
flex?: number | string;
flexGrow?: number;
flexShrink?: number;
fontWeight?: number;
fontWeight?: number | string;
lineClamp?: number;
lineHeight?: number;
lineHeight?: number | string;
opacity?: number;
order?: number;
orphans?: number;
@@ -386,6 +390,7 @@ declare module "react/addons" {
// SVG-related properties
fillOpacity?: number;
strokeOpacity?: number;
strokeWidth?: number;
}
interface HTMLAttributes extends DOMAttributes {
@@ -501,18 +506,18 @@ declare module "react/addons" {
interface SVGAttributes extends DOMAttributes {
ref?: string | ((component: SVGComponent) => void);
cx?: SVGLength | SVGAnimatedLength;
cy?: any;
cx?: number | string;
cy?: number | string;
d?: string;
dx?: SVGLength | SVGAnimatedLength;
dy?: SVGLength | SVGAnimatedLength;
fill?: any; // SVGPaint | string
dx?: number | string;
dy?: number | string;
fill?: string;
fillOpacity?: number | string;
fontFamily?: string;
fontSize?: number | string;
fx?: SVGLength | SVGAnimatedLength;
fy?: SVGLength | SVGAnimatedLength;
gradientTransform?: SVGTransformList | SVGAnimatedTransformList;
fx?: number | string;
fy?: number | string;
gradientTransform?: string;
gradientUnits?: string;
markerEnd?: string;
markerMid?: string;
@@ -523,27 +528,27 @@ declare module "react/addons" {
patternUnits?: string;
points?: string;
preserveAspectRatio?: string;
r?: SVGLength | SVGAnimatedLength;
rx?: SVGLength | SVGAnimatedLength;
ry?: SVGLength | SVGAnimatedLength;
r?: number | string;
rx?: number | string;
ry?: number | string;
spreadMethod?: string;
stopColor?: any; // SVGColor | string
stopColor?: string;
stopOpacity?: number | string;
stroke?: any; // SVGPaint
stroke?: string;
strokeDasharray?: string;
strokeLinecap?: string;
strokeOpacity?: number | string;
strokeWidth?: SVGLength | SVGAnimatedLength;
strokeWidth?: number | string;
textAnchor?: string;
transform?: SVGTransformList | SVGAnimatedTransformList;
transform?: string;
version?: string;
viewBox?: string;
x1?: SVGLength | SVGAnimatedLength;
x2?: SVGLength | SVGAnimatedLength;
x?: SVGLength | SVGAnimatedLength;
y1?: SVGLength | SVGAnimatedLength;
y2?: SVGLength | SVGAnimatedLength
y?: SVGLength | SVGAnimatedLength;
x1?: number | string;
x2?: number | string;
x?: number | string;
y1?: number | string;
y2?: number | string
y?: number | string;
}
//
@@ -904,6 +909,8 @@ declare module "react/addons" {
findRenderedComponentWithType<C extends Component<any, any>>(
tree: Component<any, any>,
type: ComponentClass<any>): C;
createRenderer(): ShallowRenderer;
}
interface SyntheticEventData {
@@ -981,6 +988,12 @@ declare module "react/addons" {
wheel: EventSimulator;
}
class ShallowRenderer {
getRenderOutput<C extends Component<any, any>>(): C;
render(element: ReactElement<any>, context?: any): void;
unmount(): void;
}
//
// Browser Interfaces
// https://github.com/nikeee/2048-typescript/blob/master/2048/js/touch.d.ts
+30 -25
View File
@@ -1,4 +1,4 @@
// Type definitions for React v0.13.0 RC2 (internal module)
// Type definitions for React v0.13.1 (internal module)
// Project: http://facebook.github.io/react/
// Definitions by: Asana <https://asana.com>, AssureSign <http://www.assuresign.com>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
@@ -131,7 +131,7 @@ declare module React {
// Base component for plain JS classes
class Component<P, S> implements ComponentLifecycle<P, S> {
constructor(props: P, context: any);
constructor(props?: P, context?: any);
setState(f: (prevState: S, props: P) => S, callback?: () => any): void;
setState(state: S, callback?: () => any): void;
forceUpdate(): void;
@@ -368,14 +368,18 @@ declare module React {
};
}
// This interface is not complete. Only properties accepting
// unitless numbers are listed here (see CSSProperty.js in React)
interface CSSProperties {
boxFlex?: number;
boxFlexGroup?: number;
columnCount?: number;
flex?: number | string;
flexGrow?: number;
flexShrink?: number;
fontWeight?: number;
fontWeight?: number | string;
lineClamp?: number;
lineHeight?: number;
lineHeight?: number | string;
opacity?: number;
order?: number;
orphans?: number;
@@ -386,6 +390,7 @@ declare module React {
// SVG-related properties
fillOpacity?: number;
strokeOpacity?: number;
strokeWidth?: number;
}
interface HTMLAttributes extends DOMAttributes {
@@ -501,18 +506,18 @@ declare module React {
interface SVGAttributes extends DOMAttributes {
ref?: string | ((component: SVGComponent) => void);
cx?: SVGLength | SVGAnimatedLength;
cy?: any;
cx?: number | string;
cy?: number | string;
d?: string;
dx?: SVGLength | SVGAnimatedLength;
dy?: SVGLength | SVGAnimatedLength;
fill?: any; // SVGPaint | string
dx?: number | string;
dy?: number | string;
fill?: string;
fillOpacity?: number | string;
fontFamily?: string;
fontSize?: number | string;
fx?: SVGLength | SVGAnimatedLength;
fy?: SVGLength | SVGAnimatedLength;
gradientTransform?: SVGTransformList | SVGAnimatedTransformList;
fx?: number | string;
fy?: number | string;
gradientTransform?: string;
gradientUnits?: string;
markerEnd?: string;
markerMid?: string;
@@ -523,27 +528,27 @@ declare module React {
patternUnits?: string;
points?: string;
preserveAspectRatio?: string;
r?: SVGLength | SVGAnimatedLength;
rx?: SVGLength | SVGAnimatedLength;
ry?: SVGLength | SVGAnimatedLength;
r?: number | string;
rx?: number | string;
ry?: number | string;
spreadMethod?: string;
stopColor?: any; // SVGColor | string
stopColor?: string;
stopOpacity?: number | string;
stroke?: any; // SVGPaint
stroke?: string;
strokeDasharray?: string;
strokeLinecap?: string;
strokeOpacity?: number | string;
strokeWidth?: SVGLength | SVGAnimatedLength;
strokeWidth?: number | string;
textAnchor?: string;
transform?: SVGTransformList | SVGAnimatedTransformList;
transform?: string;
version?: string;
viewBox?: string;
x1?: SVGLength | SVGAnimatedLength;
x2?: SVGLength | SVGAnimatedLength;
x?: SVGLength | SVGAnimatedLength;
y1?: SVGLength | SVGAnimatedLength;
y2?: SVGLength | SVGAnimatedLength
y?: SVGLength | SVGAnimatedLength;
x1?: number | string;
x2?: number | string;
x?: number | string;
y1?: number | string;
y2?: number | string
y?: number | string;
}
//
+17 -3
View File
@@ -224,6 +224,21 @@ React.DOM.div(htmlAttr);
React.DOM.span(htmlAttr);
React.DOM.input(htmlAttr);
React.DOM.svg({ viewBox: "0 0 48 48" },
React.DOM.rect({
x: 22,
y: 10,
width: 4,
height: 28
}),
React.DOM.rect({
x: 10,
y: 22,
width: 28,
height: 4
}));
//
// React.PropTypes
// --------------------------------------------------------------------------
@@ -324,7 +339,7 @@ interface TimerState {
secondsElapsed: number;
}
class Timer extends React.Component<{}, TimerState> {
static state = {
state = {
secondsElapsed: 0
}
private _interval: number;
@@ -334,8 +349,7 @@ class Timer extends React.Component<{}, TimerState> {
}));
}
componentDidMount() {
var me = this;
this._interval = setInterval(() => me.tick(), 1000);
this._interval = setInterval(() => this.tick(), 1000);
}
componentWillUnmount() {
clearInterval(this._interval);
+30 -25
View File
@@ -1,4 +1,4 @@
// Type definitions for React v0.13.0 RC2 (external module)
// Type definitions for React v0.13.1 (external module)
// Project: http://facebook.github.io/react/
// Definitions by: Asana <https://asana.com>, AssureSign <http://www.assuresign.com>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
@@ -131,7 +131,7 @@ declare module "react" {
// Base component for plain JS classes
class Component<P, S> implements ComponentLifecycle<P, S> {
constructor(props: P, context: any);
constructor(props?: P, context?: any);
setState(f: (prevState: S, props: P) => S, callback?: () => any): void;
setState(state: S, callback?: () => any): void;
forceUpdate(): void;
@@ -368,14 +368,18 @@ declare module "react" {
};
}
// This interface is not complete. Only properties accepting
// unitless numbers are listed here (see CSSProperty.js in React)
interface CSSProperties {
boxFlex?: number;
boxFlexGroup?: number;
columnCount?: number;
flex?: number | string;
flexGrow?: number;
flexShrink?: number;
fontWeight?: number;
fontWeight?: number | string;
lineClamp?: number;
lineHeight?: number;
lineHeight?: number | string;
opacity?: number;
order?: number;
orphans?: number;
@@ -386,6 +390,7 @@ declare module "react" {
// SVG-related properties
fillOpacity?: number;
strokeOpacity?: number;
strokeWidth?: number;
}
interface HTMLAttributes extends DOMAttributes {
@@ -501,18 +506,18 @@ declare module "react" {
interface SVGAttributes extends DOMAttributes {
ref?: string | ((component: SVGComponent) => void);
cx?: SVGLength | SVGAnimatedLength;
cy?: any;
cx?: number | string;
cy?: number | string;
d?: string;
dx?: SVGLength | SVGAnimatedLength;
dy?: SVGLength | SVGAnimatedLength;
fill?: any; // SVGPaint | string
dx?: number | string;
dy?: number | string;
fill?: string;
fillOpacity?: number | string;
fontFamily?: string;
fontSize?: number | string;
fx?: SVGLength | SVGAnimatedLength;
fy?: SVGLength | SVGAnimatedLength;
gradientTransform?: SVGTransformList | SVGAnimatedTransformList;
fx?: number | string;
fy?: number | string;
gradientTransform?: string;
gradientUnits?: string;
markerEnd?: string;
markerMid?: string;
@@ -523,27 +528,27 @@ declare module "react" {
patternUnits?: string;
points?: string;
preserveAspectRatio?: string;
r?: SVGLength | SVGAnimatedLength;
rx?: SVGLength | SVGAnimatedLength;
ry?: SVGLength | SVGAnimatedLength;
r?: number | string;
rx?: number | string;
ry?: number | string;
spreadMethod?: string;
stopColor?: any; // SVGColor | string
stopColor?: string;
stopOpacity?: number | string;
stroke?: any; // SVGPaint
stroke?: string;
strokeDasharray?: string;
strokeLinecap?: string;
strokeOpacity?: number | string;
strokeWidth?: SVGLength | SVGAnimatedLength;
strokeWidth?: number | string;
textAnchor?: string;
transform?: SVGTransformList | SVGAnimatedTransformList;
transform?: string;
version?: string;
viewBox?: string;
x1?: SVGLength | SVGAnimatedLength;
x2?: SVGLength | SVGAnimatedLength;
x?: SVGLength | SVGAnimatedLength;
y1?: SVGLength | SVGAnimatedLength;
y2?: SVGLength | SVGAnimatedLength
y?: SVGLength | SVGAnimatedLength;
x1?: number | string;
x2?: number | string;
x?: number | string;
y1?: number | string;
y2?: number | string
y?: number | string;
}
//