flip/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/FlipsideCrypto/DefinitelyTyped.git synced 2026-02-06 19:07:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

react: allow null as props for React.createElement() (#22837)

Browse Source
This commit is contained in:
Andres Kalle 2018-01-24 21:40:08 +02:00 committed by Andy
parent a0898b0a15
commit c33af47bb2
3 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
types/create-react-class/create-react-class-tests.ts
View File

@ -73,6 +73,12 @@ const ClassicComponent: React.ClassicComponentClass<Props> = createReactClass<Pr
}
});
const ClassicComponentNoProps: React.ClassicComponentClass = createReactClass({
render() {
return DOM.div();
}
});
// React.createFactory
const classicFactory: React.ClassicFactory<Props> =
React.createFactory(ClassicComponent);
@ -81,6 +87,7 @@ const classicFactoryElement: React.ClassicElement<Props> =
// React.createElement
const classicElement: React.ClassicElement<Props> = React.createElement(ClassicComponent, props);
const classicElementNullProps: React.ClassicElement<{}> = React.createElement(ClassicComponentNoProps, null);
// React.cloneElement
const clonedClassicElement: React.ClassicElement<Props> =

16
types/react/index.d.ts vendored
View File

@ -193,37 +193,37 @@ declare namespace React {
// TODO: generalize this to everything in `keyof ReactHTML`, not just "input"
function createElement(
type: "input",
props?: InputHTMLAttributes<HTMLInputElement> & ClassAttributes<HTMLInputElement>,
props?: InputHTMLAttributes<HTMLInputElement> & ClassAttributes<HTMLInputElement> | null,
...children: ReactNode[]): DetailedReactHTMLElement<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
function createElement<P extends HTMLAttributes<T>, T extends HTMLElement>(
type: keyof ReactHTML,
props?: ClassAttributes<T> & P,
props?: ClassAttributes<T> & P | null,
...children: ReactNode[]): DetailedReactHTMLElement<P, T>;
function createElement<P extends SVGAttributes<T>, T extends SVGElement>(
type: keyof ReactSVG,
props?: ClassAttributes<T> & P,
props?: ClassAttributes<T> & P | null,
...children: ReactNode[]): ReactSVGElement;
function createElement<P extends DOMAttributes<T>, T extends Element>(
type: string,
props?: ClassAttributes<T> & P,
props?: ClassAttributes<T> & P | null,
...children: ReactNode[]): DOMElement<P, T>;
// Custom components
function createElement<P>(
type: SFC<P>,
props?: Attributes & P,
props?: Attributes & P | null,
...children: ReactNode[]): SFCElement<P>;
function createElement<P>(
type: ClassType<P, ClassicComponent<P, ComponentState>, ClassicComponentClass<P>>,
props?: ClassAttributes<ClassicComponent<P, ComponentState>> & P,
props?: ClassAttributes<ClassicComponent<P, ComponentState>> & P | null,
...children: ReactNode[]): CElement<P, ClassicComponent<P, ComponentState>>;
function createElement<P, T extends Component<P, ComponentState>, C extends ComponentClass<P>>(
type: ClassType<P, T, C>,
props?: ClassAttributes<T> & P,
props?: ClassAttributes<T> & P | null,
...children: ReactNode[]): CElement<P, T>;
function createElement<P>(
type: SFC<P> | ComponentClass<P> | string,
props?: Attributes & P,
props?: Attributes & P | null,
...children: ReactNode[]): ReactElement<P>;
// DOM Elements

10
types/react/test/index.ts
View File

@ -141,6 +141,9 @@ const StatelessComponent3: React.SFC<SCProps> =
// allows null return
props => props.foo ? DOM.div(null, props.foo, props.children) : null;
// allows null as props
const StatelessComponent4: React.SFC = props => null;
// React.createFactory
const factory: React.CFactory<Props, ModernComponent> =
React.createFactory(ModernComponent);
@ -160,15 +163,22 @@ const domFactoryElement: React.DOMElement<React.DOMAttributes<{}>, Element> =
// React.createElement
const element: React.CElement<Props, ModernComponent> = React.createElement(ModernComponent, props);
const elementNoState: React.CElement<Props, ModernComponentNoState> = React.createElement(ModernComponentNoState, props);
const elementNullProps: React.CElement<{}, ModernComponentNoPropsAndState> = React.createElement(ModernComponentNoPropsAndState, null);
const statelessElement: React.SFCElement<SCProps> = React.createElement(StatelessComponent, props);
const statelessElementNullProps: React.SFCElement<SCProps> = React.createElement(StatelessComponent4, null);
const domElement: React.DOMElement<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> = React.createElement("div");
const domElementNullProps = React.createElement("div", null);
const htmlElement = React.createElement("input", { type: "text" });
const inputElementNullProps: React.DOMElement<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> = React.createElement("input", null);
const svgElement = React.createElement("svg", { accentHeight: 12 });
const svgElementNullProps = React.createElement("svg", null);
const fragmentElement: React.ReactElement<{}> = React.createElement(React.Fragment, {}, [React.createElement("div"), React.createElement("div")]);
const fragmentElementNullProps: React.ReactElement<{}> = React.createElement(React.Fragment, null, [React.createElement("div"), React.createElement("div")]);
const customProps: React.HTMLProps<HTMLElement> = props;
const customDomElement = "my-element";
const nonLiteralElement = React.createElement(customDomElement, customProps);
const customDomElementNullProps = React.createElement(customDomElement, null);
// https://github.com/Microsoft/TypeScript/issues/15019