From b2128609ac8159a14224deba399144b3400c8c20 Mon Sep 17 00:00:00 2001 From: Florian Dold Date: Sun, 13 Nov 2016 08:16:12 +0100 Subject: Finally give in and use React, minor tweeks. Preact (a minimalistic React alternative) had too many bugs ... --- lib/components.ts | 5 +- lib/decl/preact.d.ts | 560 -- lib/decl/react-dom.d.ts | 75 + lib/decl/react-global.d.ts | 11 + lib/decl/react.d.ts | 2547 ++++++ lib/refs.d.ts | 1 + lib/vendor/preact.js | 480 -- lib/vendor/react-dom.js | 18525 +++++++++++++++++++++++++++++++++++++++++++ lib/vendor/react.js | 3783 +++++++++ lib/wallet/emscriptif.ts | 271 +- lib/wallet/helpers.ts | 71 + lib/wallet/http.ts | 13 + lib/wallet/renderHtml.tsx | 2 +- lib/wallet/wallet.ts | 125 +- lib/wallet/wxApi.ts | 2 +- 15 files changed, 25201 insertions(+), 1270 deletions(-) delete mode 100644 lib/decl/preact.d.ts create mode 100644 lib/decl/react-dom.d.ts create mode 100644 lib/decl/react-global.d.ts create mode 100644 lib/decl/react.d.ts delete mode 100644 lib/vendor/preact.js create mode 100644 lib/vendor/react-dom.js create mode 100644 lib/vendor/react.js (limited to 'lib') diff --git a/lib/components.ts b/lib/components.ts index fb802ab47..066e6d07f 100644 --- a/lib/components.ts +++ b/lib/components.ts @@ -30,16 +30,15 @@ export interface StateHolder { * Component that doesn't hold its state in one object, * but has multiple state holders. */ -export abstract class ImplicitStateComponent extends preact.Component { +export abstract class ImplicitStateComponent extends React.Component { makeState(initial: StateType): StateHolder { let state: StateType = initial; return (s?: StateType): StateType => { if (s !== undefined) { state = s; - // In preact, this will always schedule a (debounced) redraw this.setState({} as any); } return state; }; } -} \ No newline at end of file +} diff --git a/lib/decl/preact.d.ts b/lib/decl/preact.d.ts deleted file mode 100644 index dfa094e0e..000000000 --- a/lib/decl/preact.d.ts +++ /dev/null @@ -1,560 +0,0 @@ -declare namespace preact { - interface ComponentProps { - children?:JSX.Element[]; - key?:string; - } - - interface PreactHTMLAttributes { - key?:string; - } - - interface VNode { - nodeName:ComponentConstructor|string; - attributes:{[name:string]:any}; - children:VNode[]; - key:string; - } - - interface ComponentLifecycle { - componentWillMount?():void; - - componentDidMount?():void; - - componentWillUnmount?():void; - - componentDidUnmount?():void; - - componentWillReceiveProps?(props:PropsType):void; - - shouldComponentUpdate?(props:PropsType):boolean; - - componentWillUpdate?():void; - - componentDidUpdate?():void; - } - - interface ComponentConstructor { - new (props?:PropsType):Component; - } - - abstract class Component implements ComponentLifecycle { - constructor(props?:PropsType); - - state:StateType; - props:PropsType & ComponentProps; - base:HTMLElement; - - linkState:(name:string) => void; - - setState(state:StateType, opts?:any):void; - - forceUpdate():void; - - abstract render(props:PropsType & ComponentProps, state:any):JSX.Element; - } - - function h(node:ComponentConstructor, params:PropsType, ...children:(JSX.Element|string)[]):JSX.Element; - function h(node:string, params:JSX.HTMLAttributes|JSX.SVGAttributes, ...children:(JSX.Element|string)[]):JSX.Element; - - function createElement(node:ComponentConstructor, params:PropsType, ...children:(JSX.Element|string)[]):JSX.Element; - function createElement(node:string, params:JSX.HTMLAttributes|JSX.SVGAttributes, ...children:(JSX.Element|string)[]):JSX.Element; - - function render(node:JSX.Element, parent:Element, merge?:boolean):Element; - - function rerender():void; - - function cloneElement(element:JSX.Element, props:any):JSX.Element; - - - var options:{ - syncComponentUpdates?:boolean; - debounceRendering?:(render:() => void) => void; - vnode?:(vnode:VNode) => void; - event?:(event:Event) => Event; - }; -} - -declare module "preact" { - export = preact; -} - -declare namespace JSX { - interface Element extends preact.VNode { - - } - - interface ElementClass extends preact.Component { - - } - - interface ElementAttributesProperty { - props:any; - } - - interface SVGAttributes { - clipPath?:string; - cx?:number | string; - cy?:number | string; - d?:string; - dx?:number | string; - dy?:number | string; - fill?:string; - fillOpacity?:number | string; - fontFamily?:string; - fontSize?:number | string; - fx?:number | string; - fy?:number | string; - gradientTransform?:string; - gradientUnits?:string; - markerEnd?:string; - markerMid?:string; - markerStart?:string; - offset?:number | string; - opacity?:number | string; - patternContentUnits?:string; - patternUnits?:string; - points?:string; - preserveAspectRatio?:string; - r?:number | string; - rx?:number | string; - ry?:number | string; - spreadMethod?:string; - stopColor?:string; - stopOpacity?:number | string; - stroke?:string; - strokeDasharray?:string; - strokeLinecap?:string; - strokeMiterlimit?:string; - strokeOpacity?:number | string; - strokeWidth?:number | string; - textAnchor?:string; - transform?:string; - version?:string; - viewBox?:string; - x1?:number | string; - x2?:number | string; - x?:number | string; - xlinkActuate?:string; - xlinkArcrole?:string; - xlinkHref?:string; - xlinkRole?:string; - xlinkShow?:string; - xlinkTitle?:string; - xlinkType?:string; - xmlBase?:string; - xmlLang?:string; - xmlSpace?:string; - y1?:number | string; - y2?:number | string; - y?:number | string; - } - - interface PathAttributes { - d:string; - } - - interface EventHandler { - (event:E):void; - } - - type ClipboardEventHandler = EventHandler; - type CompositionEventHandler = EventHandler; - type DragEventHandler = EventHandler; - type FocusEventHandler = EventHandler; - type KeyboardEventHandler = EventHandler; - type MouseEventHandler = EventHandler; - type TouchEventHandler = EventHandler; - type UIEventHandler = EventHandler; - type WheelEventHandler = EventHandler; - type AnimationEventHandler = EventHandler; - type TransitionEventHandler = EventHandler; - - type GenericEventHandler = EventHandler; - - interface DOMAttributed { - // Clipboard Events - onCopy?:ClipboardEventHandler; - onCut?:ClipboardEventHandler; - onPaste?:ClipboardEventHandler; - - // Composition Events - onCompositionEnd?:CompositionEventHandler; - onCompositionStart?:CompositionEventHandler; - onCompositionUpdate?:CompositionEventHandler; - - // Focus Events - onFocus?:FocusEventHandler; - onBlur?:FocusEventHandler; - - // Form Events - onChange?:GenericEventHandler; - onInput?:GenericEventHandler; - onSubmit?:GenericEventHandler; - - // Keyboard Events - onKeyDown?:KeyboardEventHandler; - onKeyPress?:KeyboardEventHandler; - onKeyUp?:KeyboardEventHandler; - - // Media Events - onAbort?:GenericEventHandler; - onCanPlay?:GenericEventHandler; - onCanPlayThrough?:GenericEventHandler; - onDurationChange?:GenericEventHandler; - onEmptied?:GenericEventHandler; - onEncrypted?:GenericEventHandler; - onEnded?:GenericEventHandler; - onLoadedData?:GenericEventHandler; - onLoadedMetadata?:GenericEventHandler; - onLoadStart?:GenericEventHandler; - onPause?:GenericEventHandler; - onPlay?:GenericEventHandler; - onPlaying?:GenericEventHandler; - onProgress?:GenericEventHandler; - onRateChange?:GenericEventHandler; - onSeeked?:GenericEventHandler; - onSeeking?:GenericEventHandler; - onStalled?:GenericEventHandler; - onSuspend?:GenericEventHandler; - onTimeUpdate?:GenericEventHandler; - onVolumeChange?:GenericEventHandler; - onWaiting?:GenericEventHandler; - - // MouseEvents - onClick?:MouseEventHandler; - onContextMenu?:MouseEventHandler; - onDoubleClick?:MouseEventHandler; - onDrag?:DragEventHandler; - onDragEnd?:DragEventHandler; - onDragEnter?:DragEventHandler; - onDragExit?:DragEventHandler; - onDragLeave?:DragEventHandler; - onDragOver?:DragEventHandler; - onDragStart?:DragEventHandler; - onDrop?:DragEventHandler; - onMouseDown?:MouseEventHandler; - onMouseEnter?:MouseEventHandler; - onMouseLeave?:MouseEventHandler; - onMouseMove?:MouseEventHandler; - onMouseOut?:MouseEventHandler; - onMouseOver?:MouseEventHandler; - onMouseUp?:MouseEventHandler; - - // Selection Events - onSelect?:GenericEventHandler; - - // Touch Events - onTouchCancel?:TouchEventHandler; - onTouchEnd?:TouchEventHandler; - onTouchMove?:TouchEventHandler; - onTouchStart?:TouchEventHandler; - - // UI Events - onScroll?:UIEventHandler; - - // Wheel Events - onWheel?:WheelEventHandler; - - // Animation Events - onAnimationStart?:AnimationEventHandler; - onAnimationEnd?:AnimationEventHandler; - onAnimationIteration?:AnimationEventHandler; - - // Transition Events - onTransitionEnd?:TransitionEventHandler; - } - - interface HTMLAttributes extends preact.PreactHTMLAttributes, DOMAttributed { - // Standard HTML Attributes - accept?:string; - acceptCharset?:string; - accessKey?:string; - action?:string; - allowFullScreen?:boolean; - allowTransparency?:boolean; - alt?:string; - async?:boolean; - autocomplete?:string; - autofocus?:boolean; - autoPlay?:boolean; - capture?:boolean; - cellPadding?:number | string; - cellSpacing?:number | string; - charSet?:string; - challenge?:string; - checked?:boolean; - class?:string; - className?:string; - cols?:number; - colSpan?:number; - content?:string; - contentEditable?:boolean; - contextMenu?:string; - controls?:boolean; - coords?:string; - crossOrigin?:string; - data?:string; - dateTime?:string; - default?:boolean; - defer?:boolean; - dir?:string; - disabled?:boolean; - download?:any; - draggable?:boolean; - encType?:string; - form?:string; - formAction?:string; - formEncType?:string; - formMethod?:string; - formNoValidate?:boolean; - formTarget?:string; - frameBorder?:number | string; - headers?:string; - height?:number | string; - hidden?:boolean; - high?:number; - href?:string; - hrefLang?:string; - for?:string; - httpEquiv?:string; - icon?:string; - id?:string; - inputMode?:string; - integrity?:string; - is?:string; - keyParams?:string; - keyType?:string; - kind?:string; - label?:string; - lang?:string; - list?:string; - loop?:boolean; - low?:number; - manifest?:string; - marginHeight?:number; - marginWidth?:number; - max?:number | string; - maxLength?:number; - media?:string; - mediaGroup?:string; - method?:string; - min?:number | string; - minLength?:number; - multiple?:boolean; - muted?:boolean; - name?:string; - noValidate?:boolean; - open?:boolean; - optimum?:number; - 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; - scoped?:boolean; - scrolling?:string; - seamless?:boolean; - selected?:boolean; - shape?:string; - size?:number; - sizes?:string; - span?:number; - spellCheck?:boolean; - src?:string; - srcset?:string; - srcDoc?:string; - srcLang?:string; - srcSet?:string; - start?:number; - step?:number | string; - style?:any; - summary?:string; - tabIndex?:number; - target?:string; - title?:string; - type?:string; - useMap?:string; - value?:string | string[]; - width?:number | string; - wmode?:string; - wrap?:string; - - // RDFa Attributes - about?:string; - datatype?:string; - inlist?:any; - prefix?:string; - property?:string; - resource?:string; - typeof?:string; - vocab?:string; - } - - interface IntrinsicElements { - // HTML - a:HTMLAttributes; - abbr:HTMLAttributes; - address:HTMLAttributes; - area:HTMLAttributes; - article:HTMLAttributes; - aside:HTMLAttributes; - audio:HTMLAttributes; - b:HTMLAttributes; - base:HTMLAttributes; - bdi:HTMLAttributes; - bdo:HTMLAttributes; - big:HTMLAttributes; - blockquote:HTMLAttributes; - body:HTMLAttributes; - br:HTMLAttributes; - button:HTMLAttributes; - canvas:HTMLAttributes; - caption:HTMLAttributes; - cite:HTMLAttributes; - code:HTMLAttributes; - col:HTMLAttributes; - colgroup:HTMLAttributes; - data:HTMLAttributes; - datalist:HTMLAttributes; - dd:HTMLAttributes; - del:HTMLAttributes; - details:HTMLAttributes; - dfn:HTMLAttributes; - dialog:HTMLAttributes; - div:HTMLAttributes; - dl:HTMLAttributes; - dt:HTMLAttributes; - em:HTMLAttributes; - embed:HTMLAttributes; - fieldset:HTMLAttributes; - figcaption:HTMLAttributes; - figure:HTMLAttributes; - footer:HTMLAttributes; - form:HTMLAttributes; - h1:HTMLAttributes; - h2:HTMLAttributes; - h3:HTMLAttributes; - h4:HTMLAttributes; - h5:HTMLAttributes; - h6:HTMLAttributes; - head:HTMLAttributes; - header:HTMLAttributes; - hr:HTMLAttributes; - html:HTMLAttributes; - i:HTMLAttributes; - iframe:HTMLAttributes; - img:HTMLAttributes; - input:HTMLAttributes; - ins:HTMLAttributes; - kbd:HTMLAttributes; - keygen:HTMLAttributes; - label:HTMLAttributes; - legend:HTMLAttributes; - li:HTMLAttributes; - link:HTMLAttributes; - main:HTMLAttributes; - map:HTMLAttributes; - mark:HTMLAttributes; - menu:HTMLAttributes; - menuitem:HTMLAttributes; - meta:HTMLAttributes; - meter:HTMLAttributes; - nav:HTMLAttributes; - noscript:HTMLAttributes; - object:HTMLAttributes; - ol:HTMLAttributes; - optgroup:HTMLAttributes; - option:HTMLAttributes; - output:HTMLAttributes; - p:HTMLAttributes; - param:HTMLAttributes; - picture:HTMLAttributes; - pre:HTMLAttributes; - progress:HTMLAttributes; - q:HTMLAttributes; - rp:HTMLAttributes; - rt:HTMLAttributes; - ruby:HTMLAttributes; - s:HTMLAttributes; - samp:HTMLAttributes; - script:HTMLAttributes; - section:HTMLAttributes; - select:HTMLAttributes; - small:HTMLAttributes; - source:HTMLAttributes; - span:HTMLAttributes; - strong:HTMLAttributes; - style:HTMLAttributes; - sub:HTMLAttributes; - summary:HTMLAttributes; - sup:HTMLAttributes; - table:HTMLAttributes; - tbody:HTMLAttributes; - td:HTMLAttributes; - textarea:HTMLAttributes; - tfoot:HTMLAttributes; - th:HTMLAttributes; - thead:HTMLAttributes; - time:HTMLAttributes; - title:HTMLAttributes; - tr:HTMLAttributes; - track:HTMLAttributes; - u:HTMLAttributes; - ul:HTMLAttributes; - "var":HTMLAttributes; - video:HTMLAttributes; - wbr:HTMLAttributes; - - //SVG - svg:SVGAttributes; - - circle:SVGAttributes; - clipPath:SVGAttributes; - defs:SVGAttributes; - ellipse:SVGAttributes; - feBlend:SVGAttributes; - feColorMatrix:SVGAttributes; - feComponentTransfer:SVGAttributes; - feComposite:SVGAttributes; - feConvolveMatrix:SVGAttributes; - feDiffuseLighting:SVGAttributes; - feDisplacementMap:SVGAttributes; - feFlood:SVGAttributes; - feGaussianBlur:SVGAttributes; - feImage:SVGAttributes; - feMerge:SVGAttributes; - feMergeNode:SVGAttributes; - feMorphology:SVGAttributes; - feOffset:SVGAttributes; - feSpecularLighting:SVGAttributes; - feTile:SVGAttributes; - feTurbulence:SVGAttributes; - filter:SVGAttributes; - foreignObject:SVGAttributes; - g:SVGAttributes; - image:SVGAttributes; - line:SVGAttributes; - linearGradient:SVGAttributes; - marker:SVGAttributes; - mask:SVGAttributes; - path:SVGAttributes; - pattern:SVGAttributes; - polygon:SVGAttributes; - polyline:SVGAttributes; - radialGradient:SVGAttributes; - rect:SVGAttributes; - stop:SVGAttributes; - symbol:SVGAttributes; - text:SVGAttributes; - tspan:SVGAttributes; - use:SVGAttributes; - } -} diff --git a/lib/decl/react-dom.d.ts b/lib/decl/react-dom.d.ts new file mode 100644 index 000000000..1f6ca6efd --- /dev/null +++ b/lib/decl/react-dom.d.ts @@ -0,0 +1,75 @@ +// Type definitions for React v0.14 (react-dom) +// Project: http://facebook.github.io/react/ +// Definitions by: Asana , AssureSign , Microsoft +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +/// + +declare namespace __React { + namespace __DOM { + function findDOMNode(instance: ReactInstance): E; + function findDOMNode(instance: ReactInstance): Element; + + function render

( + element: DOMElement, + container: Element, + callback?: (element: T) => any): T; + function render

( + element: SFCElement

, + container: Element, + callback?: () => any): void; + function render>( + element: CElement, + container: Element, + callback?: (component: T) => any): T; + function render

( + element: ReactElement

, + container: Element, + callback?: (component?: Component | Element) => any): Component | Element | void; + + function unmountComponentAtNode(container: Element): boolean; + + var version: string; + + function unstable_batchedUpdates(callback: (a: A, b: B) => any, a: A, b: B): void; + function unstable_batchedUpdates(callback: (a: A) => any, a: A): void; + function unstable_batchedUpdates(callback: () => any): void; + + function unstable_renderSubtreeIntoContainer

( + parentComponent: Component, + element: DOMElement, + container: Element, + callback?: (element: T) => any): T; + function unstable_renderSubtreeIntoContainer>( + parentComponent: Component, + element: CElement, + container: Element, + callback?: (component: T) => any): T; + function render

( + parentComponent: Component, + element: SFCElement

, + container: Element, + callback?: () => any): void; + function unstable_renderSubtreeIntoContainer

( + parentComponent: Component, + element: ReactElement

, + container: Element, + callback?: (component?: Component | Element) => any): Component | Element | void; + } + + namespace __DOMServer { + function renderToString(element: ReactElement): string; + function renderToStaticMarkup(element: ReactElement): string; + var version: string; + } +} + +declare module "react-dom" { + import DOM = __React.__DOM; + export = DOM; +} + +declare module "react-dom/server" { + import DOMServer = __React.__DOMServer; + export = DOMServer; +} diff --git a/lib/decl/react-global.d.ts b/lib/decl/react-global.d.ts new file mode 100644 index 000000000..912d029e9 --- /dev/null +++ b/lib/decl/react-global.d.ts @@ -0,0 +1,11 @@ +// Type definitions for React v0.14 (namespace) +// Project: http://facebook.github.io/react/ +// Definitions by: Asana , AssureSign , Microsoft +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +/// +/// + +import React = __React; +import ReactDOM = __React.__DOM; + diff --git a/lib/decl/react.d.ts b/lib/decl/react.d.ts new file mode 100644 index 000000000..5cba33227 --- /dev/null +++ b/lib/decl/react.d.ts @@ -0,0 +1,2547 @@ +// Type definitions for React v0.14 +// Project: http://facebook.github.io/react/ +// Definitions by: Asana , AssureSign , Microsoft , John Reilly +// Definitions: https://github.com/DefinitelyTyped/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

extends ReactElement

{ + type: string; + ref: Ref; + } + + interface ReactHTMLElement extends DOMElement { + } + + interface ReactSVGElement extends DOMElement { + } + + // + // 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

{ + (props?: P & ClassAttributes, ...children: ReactNode[]): DOMElement; + } + + interface HTMLFactory extends DOMFactory { + } + + interface SVGFactory extends DOMFactory { + } + + // + // 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

( + 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

( + 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

( + 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 + class Component implements ComponentLifecycle { + 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; + + // 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: any; + 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, 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; + cancelable: boolean; + currentTarget: EventTarget; + 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