@vueup/vue-quill 1.0.1 → 1.1.1

package/dist/vue-quill.esm-bundler.js

@@ -1,16 +1,17 @@
 /*!
- * VueQuill @vueup/vue-quill v1.0.1
+ * VueQuill @vueup/vue-quill v1.1.1
  * https://vueup.github.io/vue-quill/
  * 
  * Includes quill v1.3.7
  * https://quilljs.com/
  * 
- * Copyright (c) 2022 Ahmad Luthfi Masruri
+ * Copyright (c) 2023 Ahmad Luthfi Masruri
  * Released under the MIT license
- * Date: 2022-12-20T16:01:54.428Z
+ * Date: 2023-03-08T12:39:52.151Z
  */
 import Quill from 'quill';
 export { default as Quill } from 'quill';
+import Delta from 'quill-delta';
 export { default as Delta } from 'quill-delta';
 import { defineComponent, onMounted, onBeforeUnmount, ref, watch, nextTick, h } from 'vue';
 
@@ -51,7 +52,6 @@ const QuillEditor = defineComponent({
     props: {
         content: {
             type: [String, Object],
-            default: () => { },
         },
         contentType: {
             type: String,
@@ -204,28 +204,31 @@ const QuillEditor = defineComponent({
             }
             return Object.assign({}, props.globalOptions, props.options, clientOptions);
         };
+        const maybeClone = (delta) => {
+            return typeof delta === 'object' && delta ? delta.slice() : delta;
+        };
         const deltaHasValuesOtherThanRetain = (delta) => {
-            return Object.values(delta).some((v) => !v.retain);
+            return Object.values(delta.ops).some((v) => !v.retain || Object.keys(v).length !== 1);
         };
-        // eslint-disable-next-line vue/no-setup-props-destructure
-        let internalModel = props.content; // Doesn't need reactivity
+        // Doesn't need reactivity, but does need to be cloned to avoid deep mutations always registering as equal
+        let internalModel;
         const internalModelEquals = (against) => {
             if (typeof internalModel === typeof against) {
                 if (against === internalModel) {
                     return true;
                 }
                 // Ref/Proxy does not support instanceof, so do a loose check
-                if (typeof against === 'object' && typeof internalModel === 'object') {
+                if (typeof against === 'object' &&
+                    against &&
+                    typeof internalModel === 'object' &&
+                    internalModel) {
                     return !deltaHasValuesOtherThanRetain(internalModel.diff(against));
                 }
             }
             return false;
         };
         const handleTextChange = (delta, oldContents, source) => {
-            // Quill should never be null at this point because we receive an event
-            // so content should not be undefined but let's make ts and eslint happy
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-            internalModel = getContents();
+            internalModel = maybeClone(getContents());
             // Update v-model:content when text changes
             if (!internalModelEquals(props.content)) {
                 ctx.emit('update:content', internalModel);
@@ -285,15 +288,21 @@ const QuillEditor = defineComponent({
             return quill === null || quill === void 0 ? void 0 : quill.getContents(index, length);
         };
         const setContents = (content, source = 'api') => {
+            const normalizedContent = !content
+                ? props.contentType === 'delta'
+                    ? new Delta()
+                    : ''
+                : content;
             if (props.contentType === 'html') {
-                setHTML(content);
+                setHTML(normalizedContent);
             }
             else if (props.contentType === 'text') {
-                setText(content, source);
+                setText(normalizedContent, source);
             }
             else {
-                quill === null || quill === void 0 ? void 0 : quill.setContents(content, source);
+                quill === null || quill === void 0 ? void 0 : quill.setContents(normalizedContent, source);
             }
+            internalModel = maybeClone(normalizedContent);
         };
         const getText = (index, length) => {
             var _a;
@@ -326,14 +335,13 @@ const QuillEditor = defineComponent({
         watch(() => props.content, (newContent) => {
             if (!quill || !newContent || internalModelEquals(newContent))
                 return;
-            internalModel = newContent;
             // Restore the selection and cursor position after updating the content
             const selection = quill.getSelection();
             if (selection) {
                 nextTick(() => quill === null || quill === void 0 ? void 0 : quill.setSelection(selection));
             }
             setContents(newContent);
-        });
+        }, { deep: true });
         watch(() => props.enable, (newValue) => {
             if (quill)
                 quill.enable(newValue);

package/dist/vue-quill.esm-bundler.prod.js

@@ -1,12 +1,12 @@
 /*!
- * VueQuill @vueup/vue-quill v1.0.1
+ * VueQuill @vueup/vue-quill v1.1.1
  * https://vueup.github.io/vue-quill/
  * 
  * Includes quill v1.3.7
  * https://quilljs.com/
  * 
- * Copyright (c) 2022 Ahmad Luthfi Masruri
+ * Copyright (c) 2023 Ahmad Luthfi Masruri
  * Released under the MIT license
- * Date: 2022-12-20T16:01:54.428Z
+ * Date: 2023-03-08T12:39:52.151Z
  */
-import e from"quill";export{default as Quill}from"quill";export{default as Delta}from"quill-delta";import{defineComponent as t,onMounted as o,onBeforeUnmount as l,ref as n,watch as r,nextTick as i,h as a}from"vue";const d={essential:[[{header:[1,2,3,4,5,6,!1]}],["bold","italic","underline"],[{list:"ordered"},{list:"bullet"},{align:[]}],["blockquote","code-block","link"],[{color:[]},"clean"]],minimal:[[{header:1},{header:2}],["bold","italic","underline"],[{list:"ordered"},{list:"bullet"},{align:[]}]],full:[["bold","italic","underline","strike"],["blockquote","code-block"],[{header:1},{header:2}],[{list:"ordered"},{list:"bullet"}],[{script:"sub"},{script:"super"}],[{indent:"-1"},{indent:"+1"}],[{direction:"rtl"}],[{size:["small",!1,"large","huge"]}],[{header:[1,2,3,4,5,6,!1]}],[{color:[]},{background:[]}],[{font:[]}],[{align:[]}],["link","video","image"],["clean"]]},s=t({name:"QuillEditor",inheritAttrs:!1,props:{content:{type:[String,Object],default:()=>{}},contentType:{type:String,default:"delta",validator:e=>["delta","html","text"].includes(e)},enable:{type:Boolean,default:!0},readOnly:{type:Boolean,default:!1},placeholder:{type:String,required:!1},theme:{type:String,default:"snow",validator:e=>["snow","bubble",""].includes(e)},toolbar:{type:[String,Array,Object],required:!1,validator:e=>"string"!=typeof e||""===e||("#"===e.charAt(0)||-1!==Object.keys(d).indexOf(e))},modules:{type:Object,required:!1},options:{type:Object,required:!1},globalOptions:{type:Object,required:!1}},emits:["textChange","selectionChange","editorChange","update:content","focus","blur","ready"],setup:(t,a)=>{let s,u;o((()=>{m()})),l((()=>{s=null}));const c=n(),m=()=>{var o;if(c.value){if(u=b(),t.modules)if(Array.isArray(t.modules))for(const o of t.modules)e.register(`modules/${o.name}`,o.module);else e.register(`modules/${t.modules.name}`,t.modules.module);s=new e(c.value,u),T(t.content),s.on("text-change",v),s.on("selection-change",f),s.on("editor-change",y),"bubble"!==t.theme&&c.value.classList.remove("ql-bubble"),"snow"!==t.theme&&c.value.classList.remove("ql-snow"),null===(o=s.getModule("toolbar"))||void 0===o||o.container.addEventListener("mousedown",(e=>{e.preventDefault()})),a.emit("ready",s)}},b=()=>{const e={};if(""!==t.theme&&(e.theme=t.theme),t.readOnly&&(e.readOnly=t.readOnly),t.placeholder&&(e.placeholder=t.placeholder),t.toolbar&&""!==t.toolbar&&(e.modules={toolbar:(()=>{if("object"==typeof t.toolbar)return t.toolbar;if("string"==typeof t.toolbar){return"#"===t.toolbar.charAt(0)?t.toolbar:d[t.toolbar]}})()}),t.modules){const o=(()=>{var e,o;const l={};if(Array.isArray(t.modules))for(const n of t.modules)l[n.name]=null!==(e=n.options)&&void 0!==e?e:{};else l[t.modules.name]=null!==(o=t.modules.options)&&void 0!==o?o:{};return l})();e.modules=Object.assign({},e.modules,o)}return Object.assign({},t.globalOptions,t.options,e)};let p=t.content;const g=e=>{if(typeof p==typeof e){if(e===p)return!0;if("object"==typeof e&&"object"==typeof p)return t=p.diff(e),!Object.values(t).some((e=>!e.retain))}var t;return!1},v=(e,o,l)=>{p=O(),g(t.content)||a.emit("update:content",p),a.emit("textChange",{delta:e,oldContents:o,source:l})},h=n(),f=(e,t,o)=>{h.value=!!(null==s?void 0:s.hasFocus()),a.emit("selectionChange",{range:e,oldRange:t,source:o})};r(h,(e=>{a.emit(e?"focus":"blur",c)}));const y=(...e)=>{"text-change"===e[0]&&a.emit("editorChange",{name:e[0],delta:e[1],oldContents:e[2],source:e[3]}),"selection-change"===e[0]&&a.emit("editorChange",{name:e[0],range:e[1],oldRange:e[2],source:e[3]})},O=(e,o)=>"html"===t.contentType?C():"text"===t.contentType?x(e,o):null==s?void 0:s.getContents(e,o),T=(e,o="api")=>{"html"===t.contentType?j(e):"text"===t.contentType?q(e,o):null==s||s.setContents(e,o)},x=(e,t)=>{var o;return null!==(o=null==s?void 0:s.getText(e,t))&&void 0!==o?o:""},q=(e,t="api")=>{null==s||s.setText(e,t)},C=()=>{var e;return null!==(e=null==s?void 0:s.root.innerHTML)&&void 0!==e?e:""},j=e=>{s&&(s.root.innerHTML=e)};return r((()=>t.content),(e=>{if(!s||!e||g(e))return;p=e;const t=s.getSelection();t&&i((()=>null==s?void 0:s.setSelection(t))),T(e)})),r((()=>t.enable),(e=>{s&&s.enable(e)})),{editor:c,getEditor:()=>c.value,getToolbar:()=>{var e;return null===(e=null==s?void 0:s.getModule("toolbar"))||void 0===e?void 0:e.container},getQuill:()=>{if(s)return s;throw'The quill editor hasn\'t been instantiated yet, \n                  make sure to call this method when the editor ready\n                  or use v-on:ready="onReady(quill)" event instead.'},getContents:O,setContents:T,getHTML:C,setHTML:j,pasteHTML:(e,t="api")=>{const o=null==s?void 0:s.clipboard.convert(e);o&&(null==s||s.setContents(o,t))},getText:x,setText:q,reinit:()=>{i((()=>{var e;!a.slots.toolbar&&s&&(null===(e=s.getModule("toolbar"))||void 0===e||e.container.remove()),m()}))}}},render(){var e,t;return[null===(t=(e=this.$slots).toolbar)||void 0===t?void 0:t.call(e),a("div",{ref:"editor",...this.$attrs})]}});export{s as QuillEditor};
+import e from"quill";export{default as Quill}from"quill";import t from"quill-delta";export{default as Delta}from"quill-delta";import{defineComponent as o,onMounted as l,onBeforeUnmount as n,ref as r,watch as i,nextTick as a,h as d}from"vue";const s={essential:[[{header:[1,2,3,4,5,6,!1]}],["bold","italic","underline"],[{list:"ordered"},{list:"bullet"},{align:[]}],["blockquote","code-block","link"],[{color:[]},"clean"]],minimal:[[{header:1},{header:2}],["bold","italic","underline"],[{list:"ordered"},{list:"bullet"},{align:[]}]],full:[["bold","italic","underline","strike"],["blockquote","code-block"],[{header:1},{header:2}],[{list:"ordered"},{list:"bullet"}],[{script:"sub"},{script:"super"}],[{indent:"-1"},{indent:"+1"}],[{direction:"rtl"}],[{size:["small",!1,"large","huge"]}],[{header:[1,2,3,4,5,6,!1]}],[{color:[]},{background:[]}],[{font:[]}],[{align:[]}],["link","video","image"],["clean"]]},u=o({name:"QuillEditor",inheritAttrs:!1,props:{content:{type:[String,Object]},contentType:{type:String,default:"delta",validator:e=>["delta","html","text"].includes(e)},enable:{type:Boolean,default:!0},readOnly:{type:Boolean,default:!1},placeholder:{type:String,required:!1},theme:{type:String,default:"snow",validator:e=>["snow","bubble",""].includes(e)},toolbar:{type:[String,Array,Object],required:!1,validator:e=>"string"!=typeof e||""===e||("#"===e.charAt(0)||-1!==Object.keys(s).indexOf(e))},modules:{type:Object,required:!1},options:{type:Object,required:!1},globalOptions:{type:Object,required:!1}},emits:["textChange","selectionChange","editorChange","update:content","focus","blur","ready"],setup:(o,d)=>{let u,c;l((()=>{b()})),n((()=>{u=null}));const m=r(),b=()=>{var t;if(m.value){if(c=p(),o.modules)if(Array.isArray(o.modules))for(const t of o.modules)e.register(`modules/${t.name}`,t.module);else e.register(`modules/${o.modules.name}`,o.modules.module);u=new e(m.value,c),x(o.content),u.on("text-change",f),u.on("selection-change",O),u.on("editor-change",T),"bubble"!==o.theme&&m.value.classList.remove("ql-bubble"),"snow"!==o.theme&&m.value.classList.remove("ql-snow"),null===(t=u.getModule("toolbar"))||void 0===t||t.container.addEventListener("mousedown",(e=>{e.preventDefault()})),d.emit("ready",u)}},p=()=>{const e={};if(""!==o.theme&&(e.theme=o.theme),o.readOnly&&(e.readOnly=o.readOnly),o.placeholder&&(e.placeholder=o.placeholder),o.toolbar&&""!==o.toolbar&&(e.modules={toolbar:(()=>{if("object"==typeof o.toolbar)return o.toolbar;if("string"==typeof o.toolbar){return"#"===o.toolbar.charAt(0)?o.toolbar:s[o.toolbar]}})()}),o.modules){const t=(()=>{var e,t;const l={};if(Array.isArray(o.modules))for(const n of o.modules)l[n.name]=null!==(e=n.options)&&void 0!==e?e:{};else l[o.modules.name]=null!==(t=o.modules.options)&&void 0!==t?t:{};return l})();e.modules=Object.assign({},e.modules,t)}return Object.assign({},o.globalOptions,o.options,e)},g=e=>"object"==typeof e&&e?e.slice():e;let h;const v=e=>{if(typeof h==typeof e){if(e===h)return!0;if("object"==typeof e&&e&&"object"==typeof h&&h)return t=h.diff(e),!Object.values(t.ops).some((e=>!e.retain||1!==Object.keys(e).length))}var t;return!1},f=(e,t,l)=>{h=g(q()),v(o.content)||d.emit("update:content",h),d.emit("textChange",{delta:e,oldContents:t,source:l})},y=r(),O=(e,t,o)=>{y.value=!!(null==u?void 0:u.hasFocus()),d.emit("selectionChange",{range:e,oldRange:t,source:o})};i(y,(e=>{d.emit(e?"focus":"blur",m)}));const T=(...e)=>{"text-change"===e[0]&&d.emit("editorChange",{name:e[0],delta:e[1],oldContents:e[2],source:e[3]}),"selection-change"===e[0]&&d.emit("editorChange",{name:e[0],range:e[1],oldRange:e[2],source:e[3]})},q=(e,t)=>"html"===o.contentType?k():"text"===o.contentType?j(e,t):null==u?void 0:u.getContents(e,t),x=(e,l="api")=>{const n=e||("delta"===o.contentType?new t:"");"html"===o.contentType?w(n):"text"===o.contentType?C(n,l):null==u||u.setContents(n,l),h=g(n)},j=(e,t)=>{var o;return null!==(o=null==u?void 0:u.getText(e,t))&&void 0!==o?o:""},C=(e,t="api")=>{null==u||u.setText(e,t)},k=()=>{var e;return null!==(e=null==u?void 0:u.root.innerHTML)&&void 0!==e?e:""},w=e=>{u&&(u.root.innerHTML=e)};return i((()=>o.content),(e=>{if(!u||!e||v(e))return;const t=u.getSelection();t&&a((()=>null==u?void 0:u.setSelection(t))),x(e)}),{deep:!0}),i((()=>o.enable),(e=>{u&&u.enable(e)})),{editor:m,getEditor:()=>m.value,getToolbar:()=>{var e;return null===(e=null==u?void 0:u.getModule("toolbar"))||void 0===e?void 0:e.container},getQuill:()=>{if(u)return u;throw'The quill editor hasn\'t been instantiated yet, \n                  make sure to call this method when the editor ready\n                  or use v-on:ready="onReady(quill)" event instead.'},getContents:q,setContents:x,getHTML:k,setHTML:w,pasteHTML:(e,t="api")=>{const o=null==u?void 0:u.clipboard.convert(e);o&&(null==u||u.setContents(o,t))},getText:j,setText:C,reinit:()=>{a((()=>{var e;!d.slots.toolbar&&u&&(null===(e=u.getModule("toolbar"))||void 0===e||e.container.remove()),b()}))}}},render(){var e,t;return[null===(t=(e=this.$slots).toolbar)||void 0===t?void 0:t.call(e),d("div",{ref:"editor",...this.$attrs})]}});export{u as QuillEditor};

package/dist/vue-quill.global.js

@@ -1,13 +1,13 @@
 /*!
- * VueQuill @vueup/vue-quill v1.0.1
+ * VueQuill @vueup/vue-quill v1.1.1
  * https://vueup.github.io/vue-quill/
  * 
  * Includes quill v1.3.7
  * https://quilljs.com/
  * 
- * Copyright (c) 2022 Ahmad Luthfi Masruri
+ * Copyright (c) 2023 Ahmad Luthfi Masruri
  * Released under the MIT license
- * Date: 2022-12-20T16:01:54.428Z
+ * Date: 2023-03-08T12:39:52.151Z
  */
 (function (global, factory) {
             typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -18417,7 +18417,7 @@
             var Delta_1 = Delta;
 
 
-            var Delta_1$1 = Delta_1;
+            var Delta$1 = Delta_1;
 
             const toolbarOptions = {
                 essential: [
@@ -18456,7 +18456,6 @@
                 props: {
                     content: {
                         type: [String, Object],
-                        default: () => { },
                     },
                     contentType: {
                         type: String,
@@ -18609,28 +18608,31 @@
                         }
                         return Object.assign({}, props.globalOptions, props.options, clientOptions);
                     };
+                    const maybeClone = (delta) => {
+                        return typeof delta === 'object' && delta ? delta.slice() : delta;
+                    };
                     const deltaHasValuesOtherThanRetain = (delta) => {
-                        return Object.values(delta).some((v) => !v.retain);
+                        return Object.values(delta.ops).some((v) => !v.retain || Object.keys(v).length !== 1);
                     };
-                    // eslint-disable-next-line vue/no-setup-props-destructure
-                    let internalModel = props.content; // Doesn't need reactivity
+                    // Doesn't need reactivity, but does need to be cloned to avoid deep mutations always registering as equal
+                    let internalModel;
                     const internalModelEquals = (against) => {
                         if (typeof internalModel === typeof against) {
                             if (against === internalModel) {
                                 return true;
                             }
                             // Ref/Proxy does not support instanceof, so do a loose check
-                            if (typeof against === 'object' && typeof internalModel === 'object') {
+                            if (typeof against === 'object' &&
+                                against &&
+                                typeof internalModel === 'object' &&
+                                internalModel) {
                                 return !deltaHasValuesOtherThanRetain(internalModel.diff(against));
                             }
                         }
                         return false;
                     };
                     const handleTextChange = (delta, oldContents, source) => {
-                        // Quill should never be null at this point because we receive an event
-                        // so content should not be undefined but let's make ts and eslint happy
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        internalModel = getContents();
+                        internalModel = maybeClone(getContents());
                         // Update v-model:content when text changes
                         if (!internalModelEquals(props.content)) {
                             ctx.emit('update:content', internalModel);
@@ -18690,15 +18692,21 @@
                         return quill === null || quill === void 0 ? void 0 : quill.getContents(index, length);
                     };
                     const setContents = (content, source = 'api') => {
+                        const normalizedContent = !content
+                            ? props.contentType === 'delta'
+                                ? new Delta$1()
+                                : ''
+                            : content;
                         if (props.contentType === 'html') {
-                            setHTML(content);
+                            setHTML(normalizedContent);
                         }
                         else if (props.contentType === 'text') {
-                            setText(content, source);
+                            setText(normalizedContent, source);
                         }
                         else {
-                            quill === null || quill === void 0 ? void 0 : quill.setContents(content, source);
+                            quill === null || quill === void 0 ? void 0 : quill.setContents(normalizedContent, source);
                         }
+                        internalModel = maybeClone(normalizedContent);
                     };
                     const getText = (index, length) => {
                         var _a;
@@ -18731,14 +18739,13 @@
                     vue.watch(() => props.content, (newContent) => {
                         if (!quill || !newContent || internalModelEquals(newContent))
                             return;
-                        internalModel = newContent;
                         // Restore the selection and cursor position after updating the content
                         const selection = quill.getSelection();
                         if (selection) {
                             vue.nextTick(() => quill === null || quill === void 0 ? void 0 : quill.setSelection(selection));
                         }
                         setContents(newContent);
-                    });
+                    }, { deep: true });
                     vue.watch(() => props.enable, (newValue) => {
                         if (quill)
                             quill.enable(newValue);
@@ -18767,7 +18774,7 @@
                 },
             });
 
-            exports.Delta = Delta_1$1;
+            exports.Delta = Delta$1;
             exports.Quill = Quill;
             exports.QuillEditor = QuillEditor;