@squiz/xaccel-xss-safe-content

xss-safe-content

This package provides a React component that will escape dangerous HTML allowing WYSIWYG content to be safely used without possible XSS vulnerability injection vectors being added.

The component takes two defined props and spreads the others as HTML Attributes.

The remaining props are expected to be HTML Elements properties or Class Attributes.

Component Properties

Property Name	Property description	Property Type	IsRequired
content	The HTML content to be sanitized and rendered inside the component.	string	[x]
elementType	The type of element to render the sanitized content in. Defaults to 'div'.	string or React component

Props Example:

<XssSafeContent
  content='<script>alert("This is a test");</script>'
  elementType="section"
  className="customClass"
>
</XssSafeContent>

Usage:

Install the package by running: npm i @squiz/xaccel-xss-safe-content

import { XssSafeContent } from '@squiz/xaccel-xss-safe-content';

function SomeReactComponent({ content }) {
    return <XSSSafeContent content={content} elementType={'div'} />;
}