STRIPES-953 Only use DOMPurify's output if it changed something; export sanitize logic

[zburke]

There are two pieces of work here:

1. Only use DOMPurify's output if it changed something
2. Export the sanitize logic

only use DOMPurify's output if it changed something

ReactQuill has a funny behavior- if the input value attribute is different from what it provided to its onChange handler, it will reset its cursor state and put it back at the beginning of the string. The HTML for links output by ReactQuill are generally not offensive, but reversing the attribute order during the value lifecycle resets the cursor repeatedly, even for non-offending templates...

DOMPurify also has a funny behavior, it reverses the attributes of any tag that you feed it.

This PR checks for any changes that DOMPurify would make to the string, and if there are none, it just uses the string...
A tempting alternative approach would be to just call DOMPurify.sanitize twice 🤢 and be done with it... it may come to that in the future.

I also added target and rel to sanitize settings to prevent unwanted removals from happening.

Export the sanitize logic

This makes it possible to sanitize the value at the module level, before it enters the loop/value lifecycle of the form. This allows us to get in front of any malicious/problematic values that were stored via API request (thus bypassing validation logic in the UI that would have prevented such values) and still uphold the UX of the editor.

The sanitize function requires the value (a string) and an optional override config for DOMPurify. The default configuration is adequate for handling the front-end capabilities of the editor.

import { sanitize } from 'stripes-template-editor';

const valueProp = sanitize(value);
// or
const valueProp = sanitize(value, overrideConfig);

Future work - flat-out remove the built-in sanitization in TemplateEditor.js

Refs STRIPES-953