From 7b2ff56869f685f42600fd5a31b1ac18dceb08f2 Mon Sep 17 00:00:00 2001
From: Christopher Tempel <christopher.tempel@tyclipso.net>
Date: Mon, 18 Jul 2022 14:54:58 +0200
Subject: [PATCH] #4 add the possibility to define xss options

---
 README.md   | 18 ++++++++++++++++++
 src/main.ts | 10 +++++++---
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 94288cb..d3d6ffe 100644
--- a/README.md
+++ b/README.md
@@ -59,6 +59,24 @@ app.mount('#app')
 
 You can use the [linkify options](https://linkify.js.org/docs/options.html).
 
+### Define XSS Options
+
+```vue
+<template>
+  <div v-linkify:options="{
+    xssOptions: {
+      whiteList: {
+        span: ['style'],
+      }
+    },
+  }">
+    ...
+  </div>
+</template>
+```
+
+You can use the [xss options](https://jsxss.com/en/options#customize-whitelist).
+
 ### Add event listener
 
 ```vue
diff --git a/src/main.ts b/src/main.ts
index ba6a0a6..1b963ca 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,10 +1,14 @@
 import { App, Directive } from "@vue/runtime-core";
 import linkifyHtml from "linkify-html";
 import { Options } from "linkifyjs";
-import xss from "xss";
+import xss, { IFilterXSSOptions } from "xss";
 
-const linkify = (rawHtml: string, options: Options): string => {
-  const sanitized = xss(rawHtml);
+interface VueLinkifyOptions extends Options {
+  xssOptions?: IFilterXSSOptions;
+}
+
+const linkify = (rawHtml: string, options: VueLinkifyOptions): string => {
+  const sanitized = xss(rawHtml, options.xssOptions);
   return linkifyHtml(sanitized, options);
 };