From 8194252213298213b23b4f22f890f265985042e2 Mon Sep 17 00:00:00 2001 From: Vincent Siao Date: Wed, 21 Jan 2015 15:50:55 -0800 Subject: [PATCH 1/3] Update react.d.ts for Typescript 1.4 --- react/react-tests.ts | 4 +- react/react.d.ts | 109 ++++++++++++++++++++++--------------------- 2 files changed, 56 insertions(+), 57 deletions(-) diff --git a/react/react-tests.ts b/react/react-tests.ts index a6040f682..5703f093e 100644 --- a/react/react-tests.ts +++ b/react/react-tests.ts @@ -193,9 +193,7 @@ var childMap: { [key: string]: number } = React.Children.map(children, (child) => { return 42; }); React.Children.forEach(children, (child) => {}); var nChildren: number = React.Children.count(children); -var onlyChild = React.Children.only([null, [[["Hallo"], true]], false, { - test: null -}]); +var onlyChild = React.Children.only([null, [[["Hallo"], true]], false]); // // Example from http://facebook.github.io/react/ diff --git a/react/react.d.ts b/react/react.d.ts index bf66534d2..96d2cf83e 100644 --- a/react/react.d.ts +++ b/react/react.d.ts @@ -8,12 +8,12 @@ declare module React { // React Elements // ---------------------------------------------------------------------- - // type ReactType = ComponentClass | string; + type ReactType = ComponentClass | string; interface ReactElement

{ - type: any; // ReactType + type: ReactType props: P; - key: any; // number | string + key: number | string; ref: string; } @@ -22,14 +22,17 @@ declare module React { // // React Nodes + // http://facebook.github.io/react/docs/glossary.html // ---------------------------------------------------------------------- - // type ReactText = string | number; - // type Fragment = ReactNode[]; - // type ReactNode = ReactElement | Fragment | ReactText | KeyMap; - // interface KeyMap { - // [key: string]: ReactNode; - // } + type ReactText = string | number; + type ReactEmpty = boolean; // | undefined | null + type ReactChild = ReactElement | ReactText; + + // Should be Array but type aliases cannot be recursive + type ReactFragment = Array; + type ReactNode = ReactChild | ReactFragment; + type ReactNodeList = ReactNode | ReactEmpty; // // React Components @@ -56,7 +59,7 @@ declare module React { // ---------------------------------------------------------------------- interface ComponentFactory

{ - (props?: P, ...children: any/*ReactNode*/[]): ReactElement

; + (props?: P, ...children: ReactNode[]): ReactElement

; } interface HTMLFactory extends ComponentFactory {} @@ -68,7 +71,7 @@ declare module React { interface TopLevelAPI { createClass

(spec: ComponentSpec): ComponentClassType

; - createElement

(type: any/*ReactType*/, props: P, ...children: any/*ReactNode*/[]): ReactElement

; + createElement

(type: ReactType, props: P, ...children: ReactNode[]): ReactElement

; createFactory

(componentClass: ComponentClassType

): ComponentFactory

; render

(element: ReactElement

, container: Element, callback?: () => any): Component

; unmountComponentAtNode(container: Element): boolean; @@ -245,8 +248,8 @@ declare module React { // ---------------------------------------------------------------------- export interface ReactAttributes { - children?: any; // ReactNode - key?: any; // number | string + children?: ReactNode; + key?: number | string; ref?: string; // Event Attributes @@ -286,13 +289,13 @@ declare module React { onWheel?: WheelEventHandler; dangerouslySetInnerHTML?: { - __html: string + __html: string; }; } interface CSSProperties { columnCount?: number; - flex?: any; // number | string + flex?: number | string; flexGrow?: number; flexShrink?: number; fontWeight?: number; @@ -322,8 +325,8 @@ declare module React { autoComplete?: boolean; autoFocus?: boolean; autoPlay?: boolean; - cellPadding?: any; // number | string - cellSpacing?: any; // number | string + cellPadding?: number | string; + cellSpacing?: number | string; charSet?: string; checked?: boolean; classID?: string; @@ -346,8 +349,8 @@ declare module React { encType?: string; form?: string; formNoValidate?: boolean; - frameBorder?: any; // number | string - height?: any; // number | string + frameBorder?: number | string; + height?: number | string; hidden?: boolean; href?: string; hrefLang?: string; @@ -360,12 +363,12 @@ declare module React { list?: string; loop?: boolean; manifest?: string; - max?: any; // number | string + max?: number | string; maxLength?: number; media?: string; mediaGroup?: string; method?: string; - min?: any; // number | string + min?: number | string; multiple?: boolean; muted?: boolean; name?: string; @@ -398,7 +401,7 @@ declare module React { srcDoc?: string; srcSet?: string; start?: number; - step?: any; // number | string + step?: number | string; style?: CSSProperties; tabIndex?: number; target?: string; @@ -406,7 +409,7 @@ declare module React { type?: string; useMap?: string; value?: string; - width?: any; // number | string + width?: number | string; wmode?: string; // Non-standard Attributes @@ -419,49 +422,49 @@ declare module React { } interface SVGAttributes extends ReactAttributes { - cx?: any; // SVGLength | SVGAnimatedLength + cx?: SVGLength | SVGAnimatedLength; cy?: any; d?: string; - dx?: any; // SVGLength | SVGAnimatedLength - dy?: any; // SVGLength | SVGAnimatedLength + dx?: SVGLength | SVGAnimatedLength; + dy?: SVGLength | SVGAnimatedLength; fill?: any; // SVGPaint | string - fillOpacity?: any; // number | string + fillOpacity?: number | string; fontFamily?: string; - fontSize?: any; // number | string - fx?: any; // SVGLength | SVGAnimatedLength - fy?: any; // SVGLength | SVGAnimatedLength - gradientTransform?: any; // SVGTransformList | SVGAnimatedTransformList + fontSize?: number | string; + fx?: SVGLength | SVGAnimatedLength; + fy?: SVGLength | SVGAnimatedLength; + gradientTransform?: SVGTransformList | SVGAnimatedTransformList; gradientUnits?: string; markerEnd?: string; markerMid?: string; markerStart?: string; - offset?: any; // number | string - opacity?: any; // number | string + offset?: number | string; + opacity?: number | string; patternContentUnits?: string; patternUnits?: string; points?: string; preserveAspectRatio?: string; - r?: any; // SVGLength | SVGAnimatedLength - rx?: any; // SVGLength | SVGAnimatedLength - ry?: any; // SVGLength | SVGAnimatedLength + r?: SVGLength | SVGAnimatedLength; + rx?: SVGLength | SVGAnimatedLength; + ry?: SVGLength | SVGAnimatedLength; spreadMethod?: string; stopColor?: any; // SVGColor | string - stopOpacity?: any; // number | string + stopOpacity?: number | string; stroke?: any; // SVGPaint strokeDasharray?: string; strokeLinecap?: string; - strokeOpacity?: any; // number | string - strokeWidth?: any; // SVGLength | SVGAnimatedLength + strokeOpacity?: number | string; + strokeWidth?: SVGLength | SVGAnimatedLength; textAnchor?: string; - transform?: any; // SVGTransformList | SVGAnimatedTransformList + transform?: SVGTransformList | SVGAnimatedTransformList; version?: string; viewBox?: string; - x1?: any; // SVGLength | SVGAnimatedLength - x2?: any; // SVGLength | SVGAnimatedLength - x?: any; // SVGLength | SVGAnimatedLength - y1?: any; // SVGLength | SVGAnimatedLength - y2?: any; // SVGLength | SVGAnimatedLength - y?: any; // SVGLength | SVGAnimatedLength + x1?: SVGLength | SVGAnimatedLength; + x2?: SVGLength | SVGAnimatedLength; + x?: SVGLength | SVGAnimatedLength; + y1?: SVGLength | SVGAnimatedLength; + y2?: SVGLength | SVGAnimatedLength + y?: SVGLength | SVGAnimatedLength; } // @@ -641,13 +644,11 @@ declare module React { // React.Children // ---------------------------------------------------------------------- - // type Child = ReactElement | ReactText; - interface ReactChildren { - map(children: any/*ReactNode*/, fn: (child: any/*Child*/) => T): { [key:string]: T }; - forEach(children: any/*ReactNode*/, fn: (child: any/*Child*/) => any): void; - count(children: any/*ReactNode*/): number; - only(children: any/*ReactNode*/): any/*Child*/; + map(children: ReactNode, fn: (child: ReactChild) => T): { [key:string]: T }; + forEach(children: ReactNode, fn: (child: ReactChild) => any): void; + count(children: ReactNode): number; + only(children: ReactNode): ReactChild; } // @@ -663,7 +664,7 @@ declare module React { // ---------------------------------------------------------------------- interface TransitionGroupProps { - component?: any; // ReactType + component?: ReactType; childFactory?: (child: ReactElement) => ReactElement; } @@ -758,7 +759,7 @@ declare module React { mockComponent(mocked: MockedComponentClass, mockTagName?: string): ReactTestUtils; - isElementOfType(element: ReactElement, type: any/*ReactType*/): boolean; + isElementOfType(element: ReactElement, type: ReactType): boolean; isDOMComponent(instance: Component): boolean; isCompositeComponent(instance: Component): boolean; isCompositeComponentWithType(instance: Component, type: ComponentClass): boolean; From e12488eb5cd0a996c220b847ea9892f27aaf9baf Mon Sep 17 00:00:00 2001 From: Vincent Siao Date: Wed, 21 Jan 2015 16:22:06 -0800 Subject: [PATCH 2/3] Fix ReactType references and ReactNode types --- react/react.d.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/react/react.d.ts b/react/react.d.ts index 96d2cf83e..ec80af795 100644 --- a/react/react.d.ts +++ b/react/react.d.ts @@ -11,7 +11,7 @@ declare module React { type ReactType = ComponentClass | string; interface ReactElement

{ - type: ReactType + type: ComponentClass

| string; props: P; key: number | string; ref: string; @@ -26,13 +26,11 @@ declare module React { // ---------------------------------------------------------------------- type ReactText = string | number; - type ReactEmpty = boolean; // | undefined | null type ReactChild = ReactElement | ReactText; - // Should be Array but type aliases cannot be recursive - type ReactFragment = Array; - type ReactNode = ReactChild | ReactFragment; - type ReactNodeList = ReactNode | ReactEmpty; + // Should be Array but type aliases cannot be recursive + type ReactFragment = Array; + type ReactNode = ReactChild | ReactFragment | boolean; // // React Components @@ -71,7 +69,7 @@ declare module React { interface TopLevelAPI { createClass

(spec: ComponentSpec): ComponentClassType

; - createElement

(type: ReactType, props: P, ...children: ReactNode[]): ReactElement

; + createElement

(type: ComponentClass

| string, props: P, ...children: ReactNode[]): ReactElement

; createFactory

(componentClass: ComponentClassType

): ComponentFactory

; render

(element: ReactElement

, container: Element, callback?: () => any): Component

; unmountComponentAtNode(container: Element): boolean; From 54e4632ca7b4085eab942223d24856edacaa6677 Mon Sep 17 00:00:00 2001 From: Vincent Siao Date: Thu, 22 Jan 2015 18:51:18 -0800 Subject: [PATCH 3/3] Revert "Change most uses of ComponentClass

to a type that represents the class" This reverts commit 7bb2b48cd26bf3c83ab63e038c4753b2137bc04b. Conflicts: react/react.d.ts --- react/react-tests.ts | 2 +- react/react.d.ts | 17 ++++++++--------- 2 files changed, 9 insertions(+), 10 deletions(-) diff --git a/react/react-tests.ts b/react/react-tests.ts index 5703f093e..07c8a89d4 100644 --- a/react/react-tests.ts +++ b/react/react-tests.ts @@ -32,7 +32,7 @@ var INPUT_REF: string = "input"; // Top-Level API // -------------------------------------------------------------------------- -var reactClass = React.createClass({ +var reactClass: React.ComponentClass = React.createClass({ getDefaultProps: () => { return { hello: undefined, diff --git a/react/react.d.ts b/react/react.d.ts index ec80af795..f2786cbc8 100644 --- a/react/react.d.ts +++ b/react/react.d.ts @@ -42,11 +42,7 @@ declare module React { propTypes?: ValidationMap

; } - interface ComponentClassType

extends ComponentStatics

{ - new (): ComponentClass

; - } - - interface ComponentClass

{ + interface ComponentClass

extends ComponentStatics

{ // Deprecated in 0.12. See http://fb.me/react-legacyfactory // new(props: P): ReactElement

; // (props: P): ReactElement

; @@ -68,9 +64,9 @@ declare module React { // ---------------------------------------------------------------------- interface TopLevelAPI { - createClass

(spec: ComponentSpec): ComponentClassType

; + createClass

(spec: ComponentSpec): ComponentClass

; createElement

(type: ComponentClass

| string, props: P, ...children: ReactNode[]): ReactElement

; - createFactory

(componentClass: ComponentClassType

): ComponentFactory

; + createFactory

(componentClass: ComponentClass

): ComponentFactory

; render

(element: ReactElement

, container: Element, callback?: () => any): Component

; unmountComponentAtNode(container: Element): boolean; renderToString(element: ReactElement): string; @@ -673,6 +669,9 @@ declare module React { transitionLeave?: boolean; } + interface CSSTransitionGroup extends ComponentClass {} + interface TransitionGroup extends ComponentClass {} + // // React.addons (Mixins) // ---------------------------------------------------------------------- @@ -873,10 +872,10 @@ declare module React { interface AddonsExports extends Exports { addons: { - CSSTransitionGroup: ComponentClassType; + CSSTransitionGroup: CSSTransitionGroup; LinkedStateMixin: LinkedStateMixin; PureRenderMixin: PureRenderMixin; - TransitionGroup: ComponentClassType; + TransitionGroup: TransitionGroup; batchedUpdates(callback: (a: A, b: B) => any, a: A, b: B): void; batchedUpdates(callback: (a: A) => any, a: A): void;