Skip to content

Commit 177ac11

Browse files
committed
fix(html): remove sanitize-html-react, reduce package size
Remove sanitize html, to reduce our package size. Document the need for sanitization in the readme. Fixes ReactTooltip#429
1 parent 76910c4 commit 177ac11

File tree

6 files changed

+3456
-12198
lines changed

6 files changed

+3456
-12198
lines changed

README.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ Global|Specific |Type |Values | Description
6464
offset | data-offset | Object | top, right, bottom, left | `data-offset="{'top': 10, 'left': 10}"` for specific and `offset={{top: 10, left: 10}}` for global
6565
multiline | data-multiline | Bool | true, false | support `<br>`, `<br />` to make multiline
6666
className | data-class | String | | extra custom class, can use !important to overwrite react-tooltip's default class
67-
html | data-html | Bool | true, false | `<p data-tip="<p>HTML tooltip</p>" data-html={true}></p>` or `<ReactTooltip html={true} />`
67+
html | data-html | Bool | true, false | `<p data-tip="<p>HTML tooltip</p>" data-html={true}></p>` or `<ReactTooltip html={true} />`, but see [Security Note](#security-note) below.
6868
delayHide | data-delay-hide | Number | | `<p data-tip="tooltip" data-delay-hide='1000'></p>` or `<ReactTooltip delayHide={1000} />`
6969
delayShow | data-delay-show | Number | | `<p data-tip="tooltip" data-delay-show='1000'></p>` or `<ReactTooltip delayShow={1000} />`
7070
delayUpdate | data-delay-update | Number | | `<p data-tip="tooltip" data-delay-update='1000'></p>` or `<ReactTooltip delayUpdate={1000} />` Sets a delay in calling getContent if the tooltip is already shown and you mouse over another target
@@ -78,6 +78,10 @@ className | data-class | String | | extra custom class, can use !importan
7878
resizeHide | null | Bool | true, false | Hide the tooltip when resizing the window, default is true
7979
wrapper | null | String | div, span | Selecting the wrapper element of the react tooltip, default is div
8080

81+
### Security Note
82+
83+
The `html` option allows a tooltip to directly display raw HTML. This is a security risk if any of that content is supplied by the user. Any user-supplied content must be sanitized, using a package like [sanitize-html-react](https://www.npmjs.com/package/sanitize-html-react). We chose not to include sanitization after discovering it [increased our package size](https://github.com/wwayne/react-tooltip/issues/429) too much - we don't want to penalize people who don't use the `html` option.
84+
8185
## Using react component as tooltip
8286
Check the example [React-tooltip Test](https://react-tooltip.netlify.com/)
8387

0 commit comments

Comments
 (0)