From 5568ed72fb2c31c1924eac114f38d6294c3ba342 Mon Sep 17 00:00:00 2001 From: Mark Date: Sun, 13 Dec 2020 19:12:06 -0500 Subject: [PATCH 1/2] build(package): upgrade dependency `html-dom-parser` to 0.5.0 BREAKING CHANGE: upgrade dependency `html-dom-parser` to 0.5.0 --- index.d.ts | 30 +++++++++++++++--------- lib/attributes-to-props.d.ts | 13 ++++++----- lib/dom-to-react.d.ts | 17 +++++++------- lib/dom-to-react.js | 4 ++-- package.json | 3 +-- test/types/index.tsx | 41 +++++++++++++++++---------------- test/types/lib/dom-to-react.tsx | 33 ++++++++++++++------------ 7 files changed, 77 insertions(+), 64 deletions(-) diff --git a/index.d.ts b/index.d.ts index aa36b8c3..588c2081 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,12 +1,24 @@ -// TypeScript Version: 3.3 +// TypeScript Version: 4.1 + +import { ParserOptions } from 'htmlparser2'; +import { + Comment, + DomHandlerOptions, + Element, + ProcessingInstruction, + Text +} from 'domhandler'; +import htmlToDOM from 'html-dom-parser'; -import { DomElement, ParserOptions } from 'htmlparser2'; -import domToReact from './lib/dom-to-react'; import attributesToProps from './lib/attributes-to-props'; -import htmlToDOM from 'html-dom-parser'; +import domToReact from './lib/dom-to-react'; + +export { attributesToProps, domToReact, htmlToDOM }; +export type HTMLParser2Options = ParserOptions & DomHandlerOptions; +export type DOMNode = Comment | Element | ProcessingInstruction | Text; export interface HTMLReactParserOptions { - htmlparser2?: ParserOptions; + htmlparser2?: HTMLParser2Options; library?: { cloneElement: ( @@ -20,7 +32,7 @@ export interface HTMLReactParserOptions { }; replace?: ( - domNode: DomElement + domNode: DOMNode ) => JSX.Element | object | void | undefined | null | false; trim?: boolean; @@ -33,11 +45,7 @@ export interface HTMLReactParserOptions { * @param options - Parser options. * @return - JSX element(s), empty array, or string. */ -declare function HTMLReactParser( +export default function HTMLReactParser( html: string, options?: HTMLReactParserOptions ): ReturnType; - -export { DomElement, ParserOptions, domToReact, htmlToDOM, attributesToProps }; - -export default HTMLReactParser; diff --git a/lib/attributes-to-props.d.ts b/lib/attributes-to-props.d.ts index 2dfc8bc3..d793fe8d 100644 --- a/lib/attributes-to-props.d.ts +++ b/lib/attributes-to-props.d.ts @@ -1,11 +1,12 @@ -// TypeScript Version: 3.3 +// TypeScript Version: 4.1 + +export type Attributes = Record; +export type Props = Attributes; /** * Converts HTML/SVG DOM attributes to React props. * - * @param attributes - The HTML/SVG DOM attributes. - * @returns - The React props. + * @param attributes - HTML/SVG DOM attributes. + * @return - React props. */ -export default function attributesToProps( - attributes: { [key: string]: string } -): { [key: string]: string }; +export default function attributesToProps(attributes: Attributes): Props; diff --git a/lib/dom-to-react.d.ts b/lib/dom-to-react.d.ts index ba8d60d6..ae45a032 100644 --- a/lib/dom-to-react.d.ts +++ b/lib/dom-to-react.d.ts @@ -1,16 +1,17 @@ -// TypeScript Version: 3.3 +// TypeScript Version: 4.1 -import { HTMLReactParserOptions } from '..'; -import { DomElement } from 'domhandler'; +import { DOMNode, HTMLReactParserOptions } from '..'; + +export { DOMNode, HTMLReactParserOptions }; /** * Converts DOM nodes to JSX element(s). * - * @param nodes - DOM nodes. - * @param options - Parser options. - * @returns - JSX element(s). + * @param nodes - DOM nodes. + * @param options - Parser options. + * @return - JSX element(s). */ export default function domToReact( - nodes: DomElement[], + nodes: DOMNode[], options?: HTMLReactParserOptions -): JSX.Element | JSX.Element[]; +): string | JSX.Element | JSX.Element[]; diff --git a/lib/dom-to-react.js b/lib/dom-to-react.js index 986dbee5..f08745c4 100644 --- a/lib/dom-to-react.js +++ b/lib/dom-to-react.js @@ -5,13 +5,13 @@ var utilities = require('./utilities'); var setStyleProp = utilities.setStyleProp; /** - * Converts DOM nodes to React elements. + * Converts DOM nodes to JSX element(s). * * @param {DomElement[]} nodes - DOM nodes. * @param {object} [options={}] - Options. * @param {Function} [options.replace] - Replacer. * @param {object} [options.library] - Library (React/Preact/etc.). - * @return {string|ReactElement|ReactElement[]} + * @return {string|JSX.Element|JSX.Element[]} */ function domToReact(nodes, options) { options = options || {}; diff --git a/package.json b/package.json index 8cdf2748..a8a4faa2 100644 --- a/package.json +++ b/package.json @@ -32,8 +32,7 @@ "dom" ], "dependencies": { - "@types/htmlparser2": "3.10.2", - "html-dom-parser": "0.3.0", + "html-dom-parser": "0.5.0", "react-property": "1.0.1", "style-to-js": "1.1.0" }, diff --git a/test/types/index.tsx b/test/types/index.tsx index 0bb19a48..4658f481 100644 --- a/test/types/index.tsx +++ b/test/types/index.tsx @@ -3,53 +3,54 @@ import parse, { domToReact, htmlToDOM } from 'html-react-parser'; +import { Element } from 'domhandler'; import * as React from 'react'; // $ExpectError parse(); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse(''); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('string'); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('

text

'); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('
  • 1
  • 2
  • '); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('
    ', { replace: domNode => { - if (domNode.attribs && domNode.attribs.id === 'replace') { + if (domNode instanceof Element && domNode.attribs.id === 'replace') { return replaced; } } }); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('
    ', { - replace({ attribs }) { - return attribs && attribs.id === 'remove' && <>; + replace: domNode => { + if (domNode instanceof Element && domNode.attribs.id === 'remove') { + return <>; + } } }); -let options: HTMLReactParserOptions; - -options = { - replace: node => { - if (node.attribs && node.attribs.id === 'header') { +const options: HTMLReactParserOptions = { + replace: domNode => { + if (domNode instanceof Element && domNode.attribs.id === 'header') { return; } } }; -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('Heading', options); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('
    ', { library: { cloneElement: (element, props, children) => @@ -60,7 +61,7 @@ parse('
    ', { } }); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('

    ', { htmlparser2: { xmlMode: true, @@ -72,11 +73,11 @@ parse('

    ', { } }); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] parse('\t

    text \r

    \n', { trim: true }); -// $ExpectType DomElement[] +// $ExpectType DOMNode[] const domNodes = htmlToDOM('
    text
    '); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] domToReact(domNodes); diff --git a/test/types/lib/dom-to-react.tsx b/test/types/lib/dom-to-react.tsx index 1d124fb1..88903ddc 100644 --- a/test/types/lib/dom-to-react.tsx +++ b/test/types/lib/dom-to-react.tsx @@ -1,43 +1,46 @@ -import { DomElement } from 'domhandler'; +import { Element } from 'domhandler'; import { HTMLReactParserOptions } from 'html-react-parser'; import domToReact from 'html-react-parser/lib/dom-to-react'; import * as React from 'react'; import htmlToDOM from 'html-dom-parser'; -// $ExpectType DomElement[] +// $ExpectType DOMNode[] htmlToDOM('
    text
    '); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] +domToReact(htmlToDOM('string')); + +// $ExpectType string | Element | Element[] domToReact(htmlToDOM('
    text
    ')); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] domToReact(htmlToDOM('

    text

    '), { replace: domNode => { - if (domNode.attribs && domNode.attribs.id === 'replace') { + if (domNode instanceof Element && domNode.attribs.id === 'replace') { return replaced; } } }); -let options: HTMLReactParserOptions; - -options = { - replace({ attribs }) { - return attribs && attribs.id === 'remove' && <>; +const options: HTMLReactParserOptions = { + replace: domNode => { + if (domNode instanceof Element && domNode.attribs.id === 'remove') { + return <>; + } } }; -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] domToReact(htmlToDOM('


    '), options); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] domToReact(htmlToDOM('Heading'), { - replace: node => { - if (node.attribs && node.attribs.id === 'header') { + replace: domNode => { + if (domNode instanceof Element && domNode.attribs.id === 'header') { return; } } }); -// $ExpectType Element | Element[] +// $ExpectType string | Element | Element[] domToReact(htmlToDOM('\t

    text \r

    \n'), { trim: true }); From e9842af8d830fd09c5283df639c8a21f8c52cfe5 Mon Sep 17 00:00:00 2001 From: Mark Date: Sun, 13 Dec 2020 20:48:04 -0500 Subject: [PATCH 2/2] chore(release): 1.0.0 --- CHANGELOG.md | 14 ++++++++++++++ package.json | 2 +- 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9251b7a5..39b2469e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,20 @@ All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. +# [1.0.0](https://github.com/remarkablemark/html-react-parser/compare/v0.14.3...v1.0.0) (2020-12-14) + + +### Build System + +* **package:** upgrade dependency `html-dom-parser` to 0.5.0 ([5568ed7](https://github.com/remarkablemark/html-react-parser/commit/5568ed72fb2c31c1924eac114f38d6294c3ba342)) + + +### BREAKING CHANGES + +* **package:** upgrade dependency `html-dom-parser` to 0.5.0 + + + ## [0.14.3](https://github.com/remarkablemark/html-react-parser/compare/v0.14.2...v0.14.3) (2020-12-12) diff --git a/package.json b/package.json index a8a4faa2..a39aeb97 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "html-react-parser", - "version": "0.14.3", + "version": "1.0.0", "description": "HTML to React parser.", "author": "Mark ", "main": "index.js",