// Type definitions for React v0.14 // Project: http://facebook.github.io/react/ // Definitions by: Asana , AssureSign , Microsoft // Definitions: https://github.com/borisyankov/DefinitelyTyped declare namespace __React { // // React Elements // ---------------------------------------------------------------------- type ReactType = string | ComponentClass | StatelessComponent; type Key = string | number; type Ref = string | ((instance: T) => any); type ComponentState = {} | void; interface Attributes { key?: Key; } interface ClassAttributes extends Attributes { ref?: Ref; } interface ReactElement

{ type: string | ComponentClass

| SFC

; props: P; key?: Key; } interface SFCElement

extends ReactElement

{ type: SFC

; } type CElement> = ComponentElement; interface ComponentElement> extends ReactElement

{ type: ComponentClass

; ref?: Ref; } type ClassicElement

= CElement>; interface DOMElement

, T extends Element> extends ReactElement

{ type: string; ref: Ref; } interface ReactHTMLElement extends DOMElement, T> { } interface ReactSVGElement extends DOMElement, SVGElement> { } // // Factories // ---------------------------------------------------------------------- interface Factory

{ (props?: P & Attributes, ...children: ReactNode[]): ReactElement

; } interface SFCFactory

{ (props?: P & Attributes, ...children: ReactNode[]): SFCElement

; } interface ComponentFactory> { (props?: P & ClassAttributes, ...children: ReactNode[]): CElement; } type CFactory> = ComponentFactory; type ClassicFactory

= CFactory>; interface DOMFactory

, T extends Element> { (props?: P & ClassAttributes, ...children: ReactNode[]): DOMElement; } interface HTMLFactory extends DOMFactory, T> { } interface SVGFactory extends DOMFactory, SVGElement> { } // // React Nodes // http://facebook.github.io/react/docs/glossary.html // ---------------------------------------------------------------------- type ReactText = string | number; type ReactChild = ReactElement | ReactText; // Should be Array but type aliases cannot be recursive type ReactFragment = {} | Array; type ReactNode = ReactChild | ReactFragment | boolean; // // Top Level API // ---------------------------------------------------------------------- function createClass(spec: ComponentSpec): ClassicComponentClass

; function createFactory

, T extends Element>( type: string): DOMFactory; function createFactory

(type: SFC

): SFCFactory

; function createFactory

( type: ClassType, ClassicComponentClass

>): CFactory>; function createFactory, C extends ComponentClass

>( type: ClassType): CFactory; function createFactory

(type: ComponentClass

| SFC

): Factory

; function createElement

, T extends Element>( type: string, props?: P & ClassAttributes, ...children: ReactNode[]): DOMElement; function createElement

( type: SFC

, props?: P & Attributes, ...children: ReactNode[]): SFCElement

; function createElement

( type: ClassType, ClassicComponentClass

>, props?: P & ClassAttributes>, ...children: ReactNode[]): CElement>; function createElement, C extends ComponentClass

>( type: ClassType, props?: P & ClassAttributes, ...children: ReactNode[]): CElement; function createElement

( type: ComponentClass

| SFC

, props?: P & Attributes, ...children: ReactNode[]): ReactElement

; function cloneElement

, T extends Element>( element: DOMElement, props?: P & ClassAttributes, ...children: ReactNode[]): DOMElement; function cloneElement

( element: SFCElement

, props?: Q, // should be Q & Attributes, but then Q is inferred as {} ...children: ReactNode[]): SFCElement

; function cloneElement

>( element: CElement, props?: Q, // should be Q & ClassAttributes ...children: ReactNode[]): CElement; function cloneElement

( element: ReactElement

, props?: Q, // should be Q & Attributes ...children: ReactNode[]): ReactElement

; function isValidElement

(object: {}): object is ReactElement

; var DOM: ReactDOM; var PropTypes: ReactPropTypes; var Children: ReactChildren; var version: string; // // Component API // ---------------------------------------------------------------------- type ReactInstance = Component | Element; // Base component for plain JS classes interface Component extends ComponentLifecycle { } class Component { constructor(props?: P, context?: any); setState(f: (prevState: S, props: P) => S, callback?: () => any): void; setState(state: S, callback?: () => any): void; forceUpdate(callBack?: () => any): void; render(): JSX.Element | null; // React.Props is now deprecated, which means that the `children` // property is not available on `P` by default, even though you can // always pass children as variadic arguments to `createElement`. // In the future, if we can define its call signature conditionally // on the existence of `children` in `P`, then we should remove this. props: P & { children?: ReactNode }; state: S; context: {}; refs: { [key: string]: ReactInstance }; } class PureComponent extends Component {} interface ClassicComponent extends Component { replaceState(nextState: S, callback?: () => any): void; isMounted(): boolean; getInitialState?(): S; } interface ChildContextProvider { getChildContext(): CC; } // // Class Interfaces // ---------------------------------------------------------------------- type SFC

= StatelessComponent

; interface StatelessComponent

{ (props: P & { children?: ReactNode }, context?: any): ReactElement; propTypes?: ValidationMap

; contextTypes?: ValidationMap; defaultProps?: P; displayName?: string; } interface ComponentClass

{ new(props?: P, context?: any): Component; propTypes?: ValidationMap

; contextTypes?: ValidationMap; childContextTypes?: ValidationMap; defaultProps?: P; displayName?: string; } interface ClassicComponentClass

extends ComponentClass

{ new(props?: P, context?: any): ClassicComponent; getDefaultProps?(): P; } /** * We use an intersection type to infer multiple type parameters from * a single argument, which is useful for many top-level API defs. * See https://github.com/Microsoft/TypeScript/issues/7234 for more info. */ type ClassType, C extends ComponentClass

> = C & (new() => T) & (new() => { props: P }); // // Component Specs and Lifecycle // ---------------------------------------------------------------------- interface ComponentLifecycle { componentWillMount?(): void; componentDidMount?(): void; componentWillReceiveProps?(nextProps: P, nextContext: any): void; shouldComponentUpdate?(nextProps: P, nextState: S, nextContext: any): boolean; componentWillUpdate?(nextProps: P, nextState: S, nextContext: any): void; componentDidUpdate?(prevProps: P, prevState: S, prevContext: any): void; componentWillUnmount?(): void; } interface Mixin extends ComponentLifecycle { mixins?: Mixin; statics?: { [key: string]: any; }; displayName?: string; propTypes?: ValidationMap; contextTypes?: ValidationMap; childContextTypes?: ValidationMap; getDefaultProps?(): P; getInitialState?(): S; } interface ComponentSpec extends Mixin { render(): ReactElement; [propertyName: string]: any; } // // Event System // ---------------------------------------------------------------------- interface SyntheticEvent { bubbles: boolean; currentTarget: EventTarget & T; cancelable: boolean; defaultPrevented: boolean; eventPhase: number; isTrusted: boolean; nativeEvent: Event; preventDefault(): void; isDefaultPrevented(): boolean; stopPropagation(): void; isPropagationStopped(): boolean; persist(): void; target: EventTarget; timeStamp: Date; type: string; } interface ClipboardEvent extends SyntheticEvent { clipboardData: DataTransfer; } interface CompositionEvent extends SyntheticEvent { data: string; } interface DragEvent extends MouseEvent { dataTransfer: DataTransfer; } interface FocusEvent extends SyntheticEvent { relatedTarget: EventTarget; } interface FormEvent extends SyntheticEvent { } interface KeyboardEvent extends SyntheticEvent { altKey: boolean; charCode: number; ctrlKey: boolean; getModifierState(key: string): boolean; key: string; keyCode: number; locale: string; location: number; metaKey: boolean; repeat: boolean; shiftKey: boolean; which: number; } interface MouseEvent extends SyntheticEvent { altKey: boolean; button: number; buttons: number; clientX: number; clientY: number; ctrlKey: boolean; getModifierState(key: string): boolean; metaKey: boolean; pageX: number; pageY: number; relatedTarget: EventTarget; screenX: number; screenY: number; shiftKey: boolean; } interface TouchEvent extends SyntheticEvent { altKey: boolean; changedTouches: TouchList; ctrlKey: boolean; getModifierState(key: string): boolean; metaKey: boolean; shiftKey: boolean; targetTouches: TouchList; touches: TouchList; } interface UIEvent extends SyntheticEvent { detail: number; view: AbstractView; } interface WheelEvent extends MouseEvent { deltaMode: number; deltaX: number; deltaY: number; deltaZ: number; } interface AnimationEvent extends SyntheticEvent<{}> { animationName: string; pseudoElement: string; elapsedTime: number; } interface TransitionEvent extends SyntheticEvent<{}> { propertyName: string; pseudoElement: string; elapsedTime: number; } // // Event Handler Types // ---------------------------------------------------------------------- interface EventHandler> { (event: E): void; } type ReactEventHandler = EventHandler>; type ClipboardEventHandler = EventHandler>; type CompositionEventHandler = EventHandler>; type DragEventHandler = EventHandler>; type FocusEventHandler = EventHandler>; type FormEventHandler = EventHandler>; type KeyboardEventHandler = EventHandler>; type MouseEventHandler = EventHandler>; type TouchEventHandler = EventHandler>; type UIEventHandler = EventHandler>; type WheelEventHandler = EventHandler>; type AnimationEventHandler = EventHandler; type TransitionEventHandler = EventHandler; // // Props / DOM Attributes // ---------------------------------------------------------------------- /** * @deprecated. This was used to allow clients to pass `ref` and `key` * to `createElement`, which is no longer necessary due to intersection * types. If you need to declare a props object before passing it to * `createElement` or a factory, use `ClassAttributes`: * * ```ts * var b: Button; * var props: ButtonProps & ClassAttributes