Skip to content

Commit

Permalink
Merge pull request #464 from wwayne/remove_sanitize_html
Browse files Browse the repository at this point in the history
fix(html): remove sanitize-html-react, reduce package size
  • Loading branch information
aronhelser authored Jan 2, 2019
2 parents 76910c4 + 177ac11 commit 07d48ef
Show file tree
Hide file tree
Showing 6 changed files with 3,456 additions and 12,198 deletions.
6 changes: 5 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ Global|Specific |Type |Values | Description
offset | data-offset | Object | top, right, bottom, left | `data-offset="{'top': 10, 'left': 10}"` for specific and `offset={{top: 10, left: 10}}` for global
multiline | data-multiline | Bool | true, false | support `<br>`, `<br />` to make multiline
className | data-class | String | | extra custom class, can use !important to overwrite react-tooltip's default class
html | data-html | Bool | true, false | `<p data-tip="<p>HTML tooltip</p>" data-html={true}></p>` or `<ReactTooltip html={true} />`
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.
delayHide | data-delay-hide | Number | | `<p data-tip="tooltip" data-delay-hide='1000'></p>` or `<ReactTooltip delayHide={1000} />`
delayShow | data-delay-show | Number | | `<p data-tip="tooltip" data-delay-show='1000'></p>` or `<ReactTooltip delayShow={1000} />`
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
Expand All @@ -78,6 +78,10 @@ className | data-class | String | | extra custom class, can use !importan
resizeHide | null | Bool | true, false | Hide the tooltip when resizing the window, default is true
wrapper | null | String | div, span | Selecting the wrapper element of the react tooltip, default is div

### Security Note

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.

## Using react component as tooltip
Check the example [React-tooltip Test](https://react-tooltip.netlify.com/)

Expand Down
Loading

0 comments on commit 07d48ef

Please sign in to comment.