@fishawack/lab-velocity 0.3.7 → 0.3.9

package/form/Wysiwyg.vue

@@ -11,6 +11,7 @@
 import Quill from "quill";
 import input from "./input.js";
 import XInput from "./input.vue";
+import sanitizeHtml from 'sanitize-html';
 
 export default {
     mixins: [input],
@@ -56,11 +57,27 @@ export default {
                 : this.editor.root.innerHTML;
         },
         setValue() {
-            this.editor.root.innerHTML =
+            const temp =
                 this.simple && this.modelValue // Surround text in p tags to keep it grouped correctly on simple strings. Ignore if modelValue empty otherwise you'll end up with <p>null</p>
                     ? `<p>${this.modelValue}</p>`
                     : this.modelValue;
+            this.editor.root.innerHTML = this.formatCleaner(temp);
         },
+        // Function to remove p tags from inside li tags, breaks the wysiwyg
+        formatCleaner(unformmatted) {
+            if(!unformmatted) {
+                return "";
+            }
+            let parser = document.createElement('div');
+            parser.innerHTML = unformmatted.replace(/(\r\n|\n|\r|\t)/gm,"");
+            const lists = parser.getElementsByTagName('ul');
+            for(var x = 0; x < lists.length; x++) {
+                lists[x].innerHTML = sanitizeHtml(lists[x].innerHTML, {
+                    allowedTags: [ 'b', 'i', 'em', 'strong', 'a','li']
+                });
+            }
+            return parser.innerHTML;
+        }
     },
 
     mounted() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fishawack/lab-velocity",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "description": "Avalere Health branded style system",
   "scripts": {
     "setup": "npm ci || npm i && npm run content",
@@ -41,7 +41,8 @@
   },
   "dependencies": {
     "element-plus": "^2.7.8",
-    "quill": "^1.3.7"
+    "quill": "^1.3.7",
+    "sanitize-html": "^2.13.1"
   },
   "files": [
     "*.scss",