;
+
+ //
+ // Factories
+ // ----------------------------------------------------------------------
+
+ interface Factory {
+ (props?: P, ...children: ReactNode[]): ReactElement
;
+ }
+
+ interface ClassicFactory
{
+ (props?: P, ...children: ReactNode[]): ReactClassicElement
;
+ }
+
+ interface DOMFactory
{
+ (props?: P, ...children: ReactNode[]): ReactDOMElement
;
+ }
+
+ type HTMLFactory = DOMFactory;
+ type SVGFactory = DOMFactory;
+
+ //
+ // React Nodes
+ // http://facebook.github.io/react/docs/glossary.html
+ // ----------------------------------------------------------------------
+
+ type ReactText = string | number;
+ type ReactChild = ReactElementBase | 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(
+ type: string): DOMFactory
;
+ function createFactory
(
+ type: ClassicComponentClass | string): ClassicFactory;
+ function createFactory
(
+ type: ComponentClass): Factory;
+
+ function createElement
(
+ type: string,
+ props?: P,
+ ...children: ReactNode[]): ReactDOMElement
;
+ function createElement
(
+ type: ClassicComponentClass | string,
+ props?: P,
+ ...children: ReactNode[]): ReactClassicElement;
+ function createElement
(
+ type: ComponentClass,
+ props?: P,
+ ...children: ReactNode[]): ReactElement;
+
+ function render
(
+ element: ReactDOMElement
,
+ container: Element,
+ callback?: () => any): DOMComponent
;
+ function render(
+ element: ReactClassicElement,
+ container: Element,
+ callback?: () => any): ClassicComponent;
+ function render(
+ element: ReactElement,
+ container: Element,
+ callback?: () => any): Component;
+
+ function unmountComponentAtNode(container: Element): boolean;
+ function renderToString(element: ReactElementBase): string;
+ function renderToStaticMarkup(element: ReactElementBase): string;
+ function isValidElement(object: {}): boolean;
+ function initializeTouchEvents(shouldUseTouch: boolean): void;
+
+ function findDOMNode(
+ componentOrElement: Component | Element): TElement;
+ function findDOMNode(
+ componentOrElement: Component | Element): Element;
+
+ var DOM: ReactDOM;
+ var PropTypes: ReactPropTypes;
+ var Children: ReactChildren;
+
+ //
+ // Component API
+ // ----------------------------------------------------------------------
+
+ // Base component for plain JS classes
+ class Component implements ComponentLifecycle {
+ constructor(props: P, context: C);
+ setState(state: S, callback?: () => any): void;
+ forceUpdate(): void;
+ props: P;
+ state: S;
+ context: C;
+ refs: {
+ [key: string]: Component
+ };
+ }
+
+ interface ClassicComponent extends Component {
+ replaceState(nextState: S, callback?: () => any): void;
+ getDOMNode(): TElement;
+ getDOMNode(): Element;
+ isMounted(): boolean;
+ getInitialState?(): S;
+ setProps(nextProps: P, callback?: () => any): void;
+ replaceProps(nextProps: P, callback?: () => any): void;
+ }
+
+ interface DOMComponent extends ClassicComponent {
+ tagName: string;
+ }
+
+ type HTMLComponent = DOMComponent;
+ type SVGComponent = DOMComponent;
+
+ interface ChildContextProvider {
+ getChildContext(): CC;
+ }
+
+ //
+ // Class Interfaces
+ // ----------------------------------------------------------------------
+
+ interface ComponentClassBase {
+ propTypes?: ValidationMap;
+ contextTypes?: ValidationMap;
+ childContextTypes?: ValidationMap<{}>;
+ }
+
+ interface ComponentClass extends ComponentClassBase {
+ new(props?: P, context?: C): Component;
+ defaultProps?: P;
+ }
+
+ interface ClassicComponentClass extends ComponentClassBase {
+ new(props?: P, context?: C): ClassicComponent;
+ getDefaultProps?(): P;
+ displayName?: string;
+ }
+
+ //
+ // Component Specs and Lifecycle
+ // ----------------------------------------------------------------------
+
+ interface ComponentLifecycle {
+ componentWillMount?(): void;
+ componentDidMount?(): void;
+ componentWillReceiveProps?(nextProps: P, nextContext: C): void;
+ shouldComponentUpdate?(nextProps: P, nextState: S, nextContext: C): boolean;
+ componentWillUpdate?(nextProps: P, nextState: S, nextContext: C): void;
+ componentDidUpdate?(prevProps: P, prevState: S, prevContext: C): void;
+ componentWillUnmount?(): void;
+ }
+
+ interface Mixin extends ComponentLifecycle {
+ mixins?: Mixin;
+ statics?: {
+ [key: string]: any;
+ };
+
+ displayName?: string;
+ propTypes?: ValidationMap;
+ contextTypes?: ValidationMap;
+ childContextTypes?: ValidationMap
+
+ getInitialState?(): S;
+ getDefaultProps?(): P;
+ }
+
+ interface ComponentSpec extends Mixin {
+ render(): ReactElementBase;
+ }
+
+ //
+ // Event System
+ // ----------------------------------------------------------------------
+
+ interface SyntheticEvent {
+ bubbles: boolean;
+ cancelable: boolean;
+ currentTarget: EventTarget;
+ defaultPrevented: boolean;
+ eventPhase: number;
+ isTrusted: boolean;
+ nativeEvent: Event;
+ preventDefault(): void;
+ stopPropagation(): void;
+ target: EventTarget;
+ timeStamp: Date;
+ type: string;
+ }
+
+ interface ClipboardEvent extends SyntheticEvent {
+ clipboardData: DataTransfer;
+ }
+
+ 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 FocusEvent extends SyntheticEvent {
+ relatedTarget: EventTarget;
+ }
+
+ interface FormEvent extends SyntheticEvent {
+ }
+
+ 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 SyntheticEvent {
+ deltaMode: number;
+ deltaX: number;
+ deltaY: number;
+ deltaZ: number;
+ }
+
+ //
+ // Event Handler Types
+ // ----------------------------------------------------------------------
+
+ interface EventHandler {
+ (event: E): void;
+ }
+
+ interface ClipboardEventHandler extends EventHandler {}
+ interface KeyboardEventHandler extends EventHandler {}
+ interface FocusEventHandler extends EventHandler {}
+ interface FormEventHandler extends EventHandler {}
+ interface MouseEventHandler extends EventHandler {}
+ interface TouchEventHandler extends EventHandler {}
+ interface UIEventHandler extends EventHandler {}
+ interface WheelEventHandler extends EventHandler {}
+
+ //
+ // Props / DOM Attributes
+ // ----------------------------------------------------------------------
+
+ interface Props {
+ children?: ReactNode;
+ key?: number | string;
+ ref?: string;
+ }
+
+ interface DOMAttributes extends Props {
+ onCopy?: ClipboardEventHandler;
+ onCut?: ClipboardEventHandler;
+ onPaste?: ClipboardEventHandler;
+ onKeyDown?: KeyboardEventHandler;
+ onKeyPress?: KeyboardEventHandler;
+ onKeyUp?: KeyboardEventHandler;
+ onFocus?: FocusEventHandler;
+ onBlur?: FocusEventHandler;
+ onChange?: FormEventHandler;
+ onInput?: FormEventHandler;
+ onSubmit?: FormEventHandler;
+ onClick?: MouseEventHandler;
+ onDoubleClick?: MouseEventHandler;
+ onDrag?: MouseEventHandler;
+ onDragEnd?: MouseEventHandler;
+ onDragEnter?: MouseEventHandler;
+ onDragExit?: MouseEventHandler;
+ onDragLeave?: MouseEventHandler;
+ onDragOver?: MouseEventHandler;
+ onDragStart?: MouseEventHandler;
+ onDrop?: MouseEventHandler;
+ onMouseDown?: MouseEventHandler;
+ onMouseEnter?: MouseEventHandler;
+ onMouseLeave?: MouseEventHandler;
+ onMouseMove?: MouseEventHandler;
+ onMouseOut?: MouseEventHandler;
+ onMouseOver?: MouseEventHandler;
+ onMouseUp?: MouseEventHandler;
+ onTouchCancel?: TouchEventHandler;
+ onTouchEnd?: TouchEventHandler;
+ onTouchMove?: TouchEventHandler;
+ onTouchStart?: TouchEventHandler;
+ onScroll?: UIEventHandler;
+ onWheel?: WheelEventHandler;
+
+ dangerouslySetInnerHTML?: {
+ __html: string;
+ };
+ }
+
+ interface CSSProperties {
+ columnCount?: number;
+ flex?: number | string;
+ flexGrow?: number;
+ flexShrink?: number;
+ fontWeight?: number;
+ lineClamp?: number;
+ lineHeight?: number;
+ opacity?: number;
+ order?: number;
+ orphans?: number;
+ widows?: number;
+ zIndex?: number;
+ zoom?: number;
+
+ // SVG-related properties
+ fillOpacity?: number;
+ strokeOpacity?: number;
+ }
+
+ interface HTMLAttributes extends DOMAttributes {
+ accept?: string;
+ acceptCharset?: string;
+ accessKey?: string;
+ action?: string;
+ allowFullScreen?: boolean;
+ allowTransparency?: boolean;
+ alt?: string;
+ async?: boolean;
+ autoComplete?: boolean;
+ autoFocus?: boolean;
+ autoPlay?: boolean;
+ cellPadding?: number | string;
+ cellSpacing?: number | string;
+ charSet?: string;
+ checked?: boolean;
+ classID?: string;
+ className?: string;
+ cols?: number;
+ colSpan?: number;
+ content?: string;
+ contentEditable?: boolean;
+ contextMenu?: string;
+ controls?: any;
+ coords?: string;
+ crossOrigin?: string;
+ data?: string;
+ dateTime?: string;
+ defer?: boolean;
+ dir?: string;
+ disabled?: boolean;
+ download?: any;
+ draggable?: boolean;
+ encType?: string;
+ form?: string;
+ formNoValidate?: boolean;
+ frameBorder?: number | string;
+ height?: number | string;
+ hidden?: boolean;
+ href?: string;
+ hrefLang?: string;
+ htmlFor?: string;
+ httpEquiv?: string;
+ icon?: string;
+ id?: string;
+ label?: string;
+ lang?: string;
+ list?: string;
+ loop?: boolean;
+ manifest?: string;
+ max?: number | string;
+ maxLength?: number;
+ media?: string;
+ mediaGroup?: string;
+ method?: string;
+ min?: number | string;
+ multiple?: boolean;
+ muted?: boolean;
+ name?: string;
+ noValidate?: boolean;
+ open?: boolean;
+ pattern?: string;
+ placeholder?: string;
+ poster?: string;
+ preload?: string;
+ radioGroup?: string;
+ readOnly?: boolean;
+ rel?: string;
+ required?: boolean;
+ role?: string;
+ rows?: number;
+ rowSpan?: number;
+ sandbox?: string;
+ scope?: string;
+ scrollLeft?: number;
+ scrolling?: string;
+ scrollTop?: number;
+ seamless?: boolean;
+ selected?: boolean;
+ shape?: string;
+ size?: number;
+ sizes?: string;
+ span?: number;
+ spellCheck?: boolean;
+ src?: string;
+ srcDoc?: string;
+ srcSet?: string;
+ start?: number;
+ step?: number | string;
+ style?: CSSProperties;
+ tabIndex?: number;
+ target?: string;
+ title?: string;
+ type?: string;
+ useMap?: string;
+ value?: string;
+ width?: number | string;
+ wmode?: string;
+
+ // Non-standard Attributes
+ autoCapitalize?: boolean;
+ autoCorrect?: boolean;
+ property?: string;
+ itemProp?: string;
+ itemScope?: boolean;
+ itemType?: string;
+ }
+
+ interface SVGAttributes extends DOMAttributes {
+ cx?: SVGLength | SVGAnimatedLength;
+ cy?: any;
+ d?: string;
+ dx?: SVGLength | SVGAnimatedLength;
+ dy?: SVGLength | SVGAnimatedLength;
+ fill?: any; // SVGPaint | string
+ fillOpacity?: number | string;
+ fontFamily?: string;
+ fontSize?: number | string;
+ fx?: SVGLength | SVGAnimatedLength;
+ fy?: SVGLength | SVGAnimatedLength;
+ gradientTransform?: SVGTransformList | SVGAnimatedTransformList;
+ gradientUnits?: string;
+ markerEnd?: string;
+ markerMid?: string;
+ markerStart?: string;
+ offset?: number | string;
+ opacity?: number | string;
+ patternContentUnits?: string;
+ patternUnits?: string;
+ points?: string;
+ preserveAspectRatio?: string;
+ r?: SVGLength | SVGAnimatedLength;
+ rx?: SVGLength | SVGAnimatedLength;
+ ry?: SVGLength | SVGAnimatedLength;
+ spreadMethod?: string;
+ stopColor?: any; // SVGColor | string
+ stopOpacity?: number | string;
+ stroke?: any; // SVGPaint
+ strokeDasharray?: string;
+ strokeLinecap?: string;
+ strokeOpacity?: number | string;
+ strokeWidth?: SVGLength | SVGAnimatedLength;
+ textAnchor?: string;
+ transform?: SVGTransformList | SVGAnimatedTransformList;
+ version?: string;
+ viewBox?: string;
+ x1?: SVGLength | SVGAnimatedLength;
+ x2?: SVGLength | SVGAnimatedLength;
+ x?: SVGLength | SVGAnimatedLength;
+ y1?: SVGLength | SVGAnimatedLength;
+ y2?: SVGLength | SVGAnimatedLength
+ y?: SVGLength | SVGAnimatedLength;
+ }
+
+ //
+ // React.DOM
+ // ----------------------------------------------------------------------
+
+ interface ReactDOM {
+ // HTML
+ a: HTMLFactory;
+ abbr: HTMLFactory;
+ address: HTMLFactory;
+ area: HTMLFactory;
+ article: HTMLFactory;
+ aside: HTMLFactory;
+ audio: HTMLFactory;
+ b: HTMLFactory;
+ base: HTMLFactory;
+ bdi: HTMLFactory;
+ bdo: HTMLFactory;
+ big: HTMLFactory;
+ blockquote: HTMLFactory;
+ body: HTMLFactory;
+ br: HTMLFactory;
+ button: HTMLFactory;
+ canvas: HTMLFactory;
+ caption: HTMLFactory;
+ cite: HTMLFactory;
+ code: HTMLFactory;
+ col: HTMLFactory;
+ colgroup: HTMLFactory;
+ data: HTMLFactory;
+ datalist: HTMLFactory;
+ dd: HTMLFactory;
+ del: HTMLFactory;
+ details: HTMLFactory;
+ dfn: HTMLFactory;
+ dialog: HTMLFactory;
+ div: HTMLFactory;
+ dl: HTMLFactory;
+ dt: HTMLFactory;
+ em: HTMLFactory;
+ embed: HTMLFactory;
+ fieldset: HTMLFactory;
+ figcaption: HTMLFactory;
+ figure: HTMLFactory;
+ footer: HTMLFactory;
+ form: HTMLFactory;
+ h1: HTMLFactory;
+ h2: HTMLFactory;
+ h3: HTMLFactory;
+ h4: HTMLFactory;
+ h5: HTMLFactory;
+ h6: HTMLFactory;
+ head: HTMLFactory;
+ header: HTMLFactory;
+ hr: HTMLFactory;
+ html: HTMLFactory;
+ i: HTMLFactory;
+ iframe: HTMLFactory;
+ img: HTMLFactory;
+ input: HTMLFactory;
+ ins: HTMLFactory;
+ kbd: HTMLFactory;
+ keygen: HTMLFactory;
+ label: HTMLFactory;
+ legend: HTMLFactory;
+ li: HTMLFactory;
+ link: HTMLFactory;
+ main: HTMLFactory;
+ map: HTMLFactory;
+ mark: HTMLFactory;
+ menu: HTMLFactory;
+ menuitem: HTMLFactory;
+ meta: HTMLFactory;
+ meter: HTMLFactory;
+ nav: HTMLFactory;
+ noscript: HTMLFactory;
+ object: HTMLFactory;
+ ol: HTMLFactory;
+ optgroup: HTMLFactory;
+ option: HTMLFactory;
+ output: HTMLFactory;
+ p: HTMLFactory;
+ param: HTMLFactory;
+ picture: HTMLFactory;
+ pre: HTMLFactory;
+ progress: HTMLFactory;
+ q: HTMLFactory;
+ rp: HTMLFactory;
+ rt: HTMLFactory;
+ ruby: HTMLFactory;
+ s: HTMLFactory;
+ samp: HTMLFactory;
+ script: HTMLFactory;
+ section: HTMLFactory;
+ select: HTMLFactory;
+ small: HTMLFactory;
+ source: HTMLFactory;
+ span: HTMLFactory;
+ strong: HTMLFactory;
+ style: HTMLFactory;
+ sub: HTMLFactory;
+ summary: HTMLFactory;
+ sup: HTMLFactory;
+ table: HTMLFactory;
+ tbody: HTMLFactory;
+ td: HTMLFactory;
+ textarea: HTMLFactory;
+ tfoot: HTMLFactory;
+ th: HTMLFactory;
+ thead: HTMLFactory;
+ time: HTMLFactory;
+ title: HTMLFactory;
+ tr: HTMLFactory;
+ track: HTMLFactory;
+ u: HTMLFactory;
+ ul: HTMLFactory;
+ "var": HTMLFactory;
+ video: HTMLFactory;
+ wbr: HTMLFactory;
+
+ // SVG
+ circle: SVGFactory;
+ defs: SVGFactory;
+ ellipse: SVGFactory;
+ g: SVGFactory;
+ line: SVGFactory;
+ linearGradient: SVGFactory;
+ mask: SVGFactory;
+ path: SVGFactory;
+ pattern: SVGFactory;
+ polygon: SVGFactory;
+ polyline: SVGFactory;
+ radialGradient: SVGFactory;
+ rect: SVGFactory;
+ stop: SVGFactory;
+ svg: SVGFactory;
+ text: SVGFactory;
+ tspan: SVGFactory;
+ }
+
+ //
+ // React.PropTypes
+ // ----------------------------------------------------------------------
+
+ interface Validator {
+ (object: T, key: string, componentName: string): Error;
+ }
+
+ interface Requireable extends Validator {
+ isRequired: Validator;
+ }
+
+ interface ValidationMap {
+ [key: string]: Validator;
+ }
+
+ interface ReactPropTypes {
+ any: Requireable