Merge pull request #146 from yunyu/ylin/jsx-element-types

fix: use JSX.Element for type definitions

Author: remarkablemark

index.d.ts

@@ -1,6 +1,5 @@
 // TypeScript Version: 3.3
 
-import * as React from 'react';
 import { DomElement } from 'domhandler';
 import domToReact from './lib/dom-to-react';
 import htmlToDOM from 'html-dom-parser';
@@ -9,24 +8,21 @@ export interface HTMLReactParserOptions {
   // TODO: Replace `object` by type for objects like `{ type: 'h1', props: { children: 'Heading' } }`
   replace?: (
     domNode: DomElement
-  ) => React.ReactElement | object | void | undefined | null | false;
+  ) => JSX.Element | object | void | undefined | null | false;
   library?: object;
 }
 
 /**
- * Converts HTML string to React elements.
+ * Converts HTML string to JSX element(s).
  *
- * @param  html    - The HTML string to parse to React.
+ * @param  html    - The HTML string to parse to JSX element(s).
  * @param  options - The parser options.
- * @return         - When parsed with HTML string, returns React elements; otherwise, returns string or empty array.
+ * @return         - Single or array of JSX elements.
  */
 declare function HTMLReactParser(
   html: string,
   options?: HTMLReactParserOptions
-):
-  | string
-  | React.DetailedReactHTMLElement<{}, HTMLElement>
-  | Array<React.DetailedReactHTMLElement<{}, HTMLElement>>;
+): ReturnType<typeof domToReact>;
 
 export { DomElement, domToReact, htmlToDOM };
 

lib/dom-to-react.d.ts

@@ -1,17 +1,16 @@
 // TypeScript Version: 3.3
 
-import * as React from 'react';
 import { HTMLReactParserOptions } from '..';
 import { DomElement } from 'domhandler';
 
 /**
- * Converts DOM nodes to React elements.
+ * Converts DOM nodes to JSX element(s).
  *
- * @param nodes - A list of formatted DomNodes to convert to React.
- * @param options - Options to use when converting to react.
- * @returns ReactElement or and array of ReactElements.
+ * @param nodes - An array of DomNodes to convert to JSX element(s).
+ * @param options - Options to use when converting to JSX.
+ * @returns Single or array of JSX elements.
  */
 export default function domToReact(
   nodes: DomElement[],
   options?: HTMLReactParserOptions
-): React.ReactElement | React.ReactElement[];
+): JSX.Element | JSX.Element[];

test/types/index.test.tsx

@@ -1,7 +1,7 @@
 import parse, { HTMLReactParserOptions, domToReact, htmlToDOM } from 'html-react-parser';
 import * as React from 'react';
 
-// $ExpectType string | DetailedReactHTMLElement<{}, HTMLElement> | DetailedReactHTMLElement<{}, HTMLElement>[]
+/* $ExpectType ReactElement | ReactElement[] */
 parse('<div>text</div>');
 
 // `options.replace`
@@ -39,8 +39,5 @@ parse('<a id="header" href="#">Heading</a>', {
 // $ExpectType DomElement[]
 const dom = htmlToDOM('<div>text</div>');
 
-/* $ExpectType ReactElement<any, string | ((props: any) => ReactElement<any, string | any | (new (props: any) => Component<any, any, any>)> | null) |
-(new (props: any) => Component<any, any, any>)> |
-ReactElement<any, string | ((props: any) => ReactElement<any, string | any | (new (props: any) => Component<any, any, any>)> | null) |
-(new (props: any) => Component<any, any, any>)>[] */
+/* $ExpectType ReactElement | ReactElement[] */
 domToReact(dom);

test/types/lib/dom-to-react.test.tsx

@@ -3,10 +3,7 @@ import domToReact from 'html-react-parser/lib/dom-to-react';
 import * as React from 'react';
 import htmlToDOM from 'html-dom-parser';
 
-/* $ExpectType ReactElement<any, string | ((props: any) => ReactElement<any, string | any | (new (props: any) => Component<any, any, any>)> | null) |
-(new (props: any) => Component<any, any, any>)> |
-ReactElement<any, string | ((props: any) => ReactElement<any, string | any | (new (props: any) => Component<any, any, any>)> | null) |
-(new (props: any) => Component<any, any, any>)>[] */
+/* $ExpectType ReactElement | ReactElement[] */
 domToReact(htmlToDOM('<div>text</div>'));
 
 // `options.replace`