From d105bd4c8d8a489690bad0099d1b95d1104379b5 Mon Sep 17 00:00:00 2001 From: John Gozde Date: Mon, 4 Dec 2017 10:27:42 -0700 Subject: [PATCH 1/3] Use ComponentType for React.Fragment --- types/react/index.d.ts | 16 ++++++---------- types/react/test/index.ts | 6 +++--- types/react/test/tsx.tsx | 14 ++++++++++++++ 3 files changed, 23 insertions(+), 13 deletions(-) diff --git a/types/react/index.d.ts b/types/react/index.d.ts index e41299fdb5..f9b199cbd5 100644 --- a/types/react/index.d.ts +++ b/types/react/index.d.ts @@ -265,7 +265,7 @@ declare namespace React { function isValidElement

(object: {} | null | undefined): object is ReactElement

; const Children: ReactChildren; - const Fragment: symbol | number; + const Fragment: ComponentType; const version: string; // @@ -281,10 +281,8 @@ declare namespace React { constructor(props: P, context?: any); // Disabling unified-signatures to have separate overloads. It's easier to understand this way. - // tslint:disable:unified-signatures - setState(f: (prevState: Readonly, props: P) => Pick, callback?: () => any): void; - setState(state: Pick, callback?: () => any): void; - // tslint:enable:unified-signatures + setState(f: (prevState: Readonly, props: P) => Pick, callback?: () => any): void; // tslint:disable-line:unified-signatures + setState(state: Pick, callback?: () => any): void; // tslint:disable-line:unified-signatures forceUpdate(callBack?: () => any): void; render(): ReactNode; @@ -3519,17 +3517,15 @@ declare namespace React { declare global { namespace JSX { - // tslint:disable:no-empty-interface - interface Element extends React.ReactElement { } + interface Element extends React.ReactElement { } // tslint:disable-line:no-empty-interface interface ElementClass extends React.Component { render(): React.ReactNode; } interface ElementAttributesProperty { props: {}; } interface ElementChildrenAttribute { children: {}; } - interface IntrinsicAttributes extends React.Attributes { } - interface IntrinsicClassAttributes extends React.ClassAttributes { } - // tslint:enable:no-empty-interface + interface IntrinsicAttributes extends React.Attributes { } // tslint:disable-line:no-empty-interface + interface IntrinsicClassAttributes extends React.ClassAttributes { } // tslint:disable-line:no-empty-interface interface IntrinsicElements { // HTML diff --git a/types/react/test/index.ts b/types/react/test/index.ts index 3c49215c8a..e8aabfa35c 100644 --- a/types/react/test/index.ts +++ b/types/react/test/index.ts @@ -164,7 +164,7 @@ const statelessElement: React.SFCElement = React.createElement(Stateles const domElement: React.DOMElement, HTMLDivElement> = React.createElement("div"); const htmlElement = React.createElement("input", { type: "text" }); const svgElement = React.createElement("svg", { accentHeight: 12 }); -const fragmentElement: React.ReactElement = React.createElement(React.Fragment, undefined, [React.createElement("div"), React.createElement("div")]); +const fragmentElement: React.ReactElement<{}> = React.createElement(React.Fragment, {}, [React.createElement("div"), React.createElement("div")]); const customProps: React.HTMLProps = props; const customDomElement = "my-element"; @@ -229,7 +229,7 @@ const notValid: boolean = React.isValidElement(props); // false const isValid = React.isValidElement(element); // true let domNode: Element = ReactDOM.findDOMNode(component); domNode = ReactDOM.findDOMNode(domNode); -const fragmentType: symbol | number = React.Fragment; +const fragmentType: React.ComponentType = React.Fragment; // // React Elements @@ -255,7 +255,7 @@ myComponent.reset(); // Refs // -------------------------------------------------------------------------- -// tslint:disable:no-empty-interface +// tslint:disable-next-line:no-empty-interface interface RCProps { } class RefComponent extends React.Component { diff --git a/types/react/test/tsx.tsx b/types/react/test/tsx.tsx index dd91b5a0bd..6322f8f234 100644 --- a/types/react/test/tsx.tsx +++ b/types/react/test/tsx.tsx @@ -63,3 +63,17 @@ const StatelessComponentWithoutProps: React.SFC = (props) => { return

; }; ; + +// Fragments +
+ + + Child 1 + Child 2 + + + Child 3 + Child 4 + + +
; From 5afa32483e299cc02ebb706fca6cddf79134ec1b Mon Sep 17 00:00:00 2001 From: John Gozde Date: Mon, 4 Dec 2017 11:33:33 -0700 Subject: [PATCH 2/3] Prefer disable-next-line --- types/react/index.d.ts | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/types/react/index.d.ts b/types/react/index.d.ts index f9b199cbd5..a2ea9bdc6c 100644 --- a/types/react/index.d.ts +++ b/types/react/index.d.ts @@ -281,8 +281,10 @@ declare namespace React { constructor(props: P, context?: any); // Disabling unified-signatures to have separate overloads. It's easier to understand this way. - setState(f: (prevState: Readonly, props: P) => Pick, callback?: () => any): void; // tslint:disable-line:unified-signatures - setState(state: Pick, callback?: () => any): void; // tslint:disable-line:unified-signatures + // tslint:disable-next-line:unified-signatures + setState(f: (prevState: Readonly, props: P) => Pick, callback?: () => any): void; + // tslint:disable-next-line:unified-signatures + setState(state: Pick, callback?: () => any): void; forceUpdate(callBack?: () => any): void; render(): ReactNode; @@ -3517,15 +3519,18 @@ declare namespace React { declare global { namespace JSX { - interface Element extends React.ReactElement { } // tslint:disable-line:no-empty-interface + // tslint:disable-next-line:no-empty-interface + interface Element extends React.ReactElement { } interface ElementClass extends React.Component { render(): React.ReactNode; } interface ElementAttributesProperty { props: {}; } interface ElementChildrenAttribute { children: {}; } - interface IntrinsicAttributes extends React.Attributes { } // tslint:disable-line:no-empty-interface - interface IntrinsicClassAttributes extends React.ClassAttributes { } // tslint:disable-line:no-empty-interface + // tslint:disable-next-line:no-empty-interface + interface IntrinsicAttributes extends React.Attributes { } + // tslint:disable-next-line:no-empty-interface + interface IntrinsicClassAttributes extends React.ClassAttributes { } interface IntrinsicElements { // HTML From 13a6e92a7fdd432276059ab301304bd73dfb6ab6 Mon Sep 17 00:00:00 2001 From: John Gozde Date: Mon, 4 Dec 2017 11:49:38 -0700 Subject: [PATCH 3/3] Revert 'type' changes --- types/react/index.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/types/react/index.d.ts b/types/react/index.d.ts index a2ea9bdc6c..4c0aa8c0a3 100644 --- a/types/react/index.d.ts +++ b/types/react/index.d.ts @@ -88,7 +88,7 @@ declare namespace React { } interface ReactElement

{ - type: string | symbol | number | ComponentClass

| SFC

; + type: string | ComponentClass

| SFC

; props: P; key: Key | null; } @@ -222,7 +222,7 @@ declare namespace React { props?: ClassAttributes & P, ...children: ReactNode[]): CElement; function createElement

( - type: SFC

| ComponentClass

| string | symbol | number, + type: SFC

| ComponentClass

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

;