{% raw %}
When generating and inserting HTML or CSS as raw strings, treat it as untrusted input and avoid direct injection into the DOM. Constructing ; // avoid this unless input is fully trusted
// Safer: set CSS variables on elements (no raw HTML injection)
// For each themed container element:
// If injection is required, sanitize and document
import DOMPurify from 'dompurify';
const safe = DOMPurify.sanitize(styles, {ALLOWED_TAGS: ['style'], ALLOWED_ATTR: []});
return ; // include comment why injection is necessary
Why this matters: Unescaped or unsanitized content inserted into the DOM can enable XSS or CSS injections. Using safe APIs, validation, or vetted sanitization prevents class of security vulnerabilities and makes intent explicit during code review.
{% endraw %}