@vueup/vue-quill 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * VueQuill @vueup/vue-quill v1.0.0
2
+ * VueQuill @vueup/vue-quill v1.0.1
3
3
  * https://vueup.github.io/vue-quill/
4
4
  *
5
5
  * Includes quill v1.3.7
@@ -7,12 +7,12 @@
7
7
  *
8
8
  * Copyright (c) 2022 Ahmad Luthfi Masruri
9
9
  * Released under the MIT license
10
- * Date: 2022-10-21T15:47:50.853Z
10
+ * Date: 2022-12-20T16:01:54.428Z
11
11
  */
12
12
  import Quill from 'quill';
13
13
  export { default as Quill } from 'quill';
14
14
  export { default as Delta } from 'quill-delta';
15
- import { defineComponent, onMounted, onBeforeUnmount, ref, watch, h, nextTick } from 'vue';
15
+ import { defineComponent, onMounted, onBeforeUnmount, ref, watch, nextTick, h } from 'vue';
16
16
 
17
17
  const toolbarOptions = {
18
18
  essential: [
@@ -204,15 +204,38 @@ const QuillEditor = defineComponent({
204
204
  }
205
205
  return Object.assign({}, props.globalOptions, props.options, clientOptions);
206
206
  };
207
+ const deltaHasValuesOtherThanRetain = (delta) => {
208
+ return Object.values(delta).some((v) => !v.retain);
209
+ };
210
+ // eslint-disable-next-line vue/no-setup-props-destructure
211
+ let internalModel = props.content; // Doesn't need reactivity
212
+ const internalModelEquals = (against) => {
213
+ if (typeof internalModel === typeof against) {
214
+ if (against === internalModel) {
215
+ return true;
216
+ }
217
+ // Ref/Proxy does not support instanceof, so do a loose check
218
+ if (typeof against === 'object' && typeof internalModel === 'object') {
219
+ return !deltaHasValuesOtherThanRetain(internalModel.diff(against));
220
+ }
221
+ }
222
+ return false;
223
+ };
207
224
  const handleTextChange = (delta, oldContents, source) => {
225
+ // Quill should never be null at this point because we receive an event
226
+ // so content should not be undefined but let's make ts and eslint happy
227
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
228
+ internalModel = getContents();
208
229
  // Update v-model:content when text changes
209
- ctx.emit('update:content', getContents());
230
+ if (!internalModelEquals(props.content)) {
231
+ ctx.emit('update:content', internalModel);
232
+ }
210
233
  ctx.emit('textChange', { delta, oldContents, source });
211
234
  };
212
235
  const isEditorFocus = ref();
213
236
  const handleSelectionChange = (range, oldRange, source) => {
214
237
  // Set isEditorFocus if quill.hasFocus()
215
- isEditorFocus.value = (quill === null || quill === void 0 ? void 0 : quill.hasFocus()) ? true : false;
238
+ isEditorFocus.value = !!(quill === null || quill === void 0 ? void 0 : quill.hasFocus());
216
239
  ctx.emit('selectionChange', { range, oldRange, source });
217
240
  };
218
241
  watch(isEditorFocus, (focus) => {
@@ -300,13 +323,17 @@ const QuillEditor = defineComponent({
300
323
  initialize();
301
324
  });
302
325
  };
303
- // watch(
304
- // () => props.content,
305
- // (newContent, oldContents) => {
306
- // if (!quill || !newContent || newContent === oldContents) return
307
- // setContents(newContent)
308
- // }
309
- // )
326
+ watch(() => props.content, (newContent) => {
327
+ if (!quill || !newContent || internalModelEquals(newContent))
328
+ return;
329
+ internalModel = newContent;
330
+ // Restore the selection and cursor position after updating the content
331
+ const selection = quill.getSelection();
332
+ if (selection) {
333
+ nextTick(() => quill === null || quill === void 0 ? void 0 : quill.setSelection(selection));
334
+ }
335
+ setContents(newContent);
336
+ });
310
337
  watch(() => props.enable, (newValue) => {
311
338
  if (quill)
312
339
  quill.enable(newValue);
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * VueQuill @vueup/vue-quill v1.0.0
2
+ * VueQuill @vueup/vue-quill v1.0.1
3
3
  * https://vueup.github.io/vue-quill/
4
4
  *
5
5
  * Includes quill v1.3.7
@@ -7,6 +7,6 @@
7
7
  *
8
8
  * Copyright (c) 2022 Ahmad Luthfi Masruri
9
9
  * Released under the MIT license
10
- * Date: 2022-10-21T15:47:50.853Z
10
+ * Date: 2022-12-20T16:01:54.428Z
11
11
  */
12
- 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,h as a,nextTick as i}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),f(t.content),s.on("text-change",g),s.on("selection-change",h),s.on("editor-change",v),"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)},g=(e,t,o)=>{a.emit("update:content",y()),a.emit("textChange",{delta:e,oldContents:t,source:o})},p=n(),h=(e,t,o)=>{p.value=!!(null==s?void 0:s.hasFocus()),a.emit("selectionChange",{range:e,oldRange:t,source:o})};r(p,(e=>{a.emit(e?"focus":"blur",c)}));const v=(...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]})},y=(e,o)=>"html"===t.contentType?O():"text"===t.contentType?T(e,o):null==s?void 0:s.getContents(e,o),f=(e,o="api")=>{"html"===t.contentType?q(e):"text"===t.contentType?x(e,o):null==s||s.setContents(e,o)},T=(e,t)=>{var o;return null!==(o=null==s?void 0:s.getText(e,t))&&void 0!==o?o:""},x=(e,t="api")=>{null==s||s.setText(e,t)},O=()=>{var e;return null!==(e=null==s?void 0:s.root.innerHTML)&&void 0!==e?e:""},q=e=>{s&&(s.root.innerHTML=e)};return 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:y,setContents:f,getHTML:O,setHTML:q,pasteHTML:(e,t="api")=>{const o=null==s?void 0:s.clipboard.convert(e);o&&(null==s||s.setContents(o,t))},getText:T,setText:x,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};
12
+ 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};
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * VueQuill @vueup/vue-quill v1.0.0
2
+ * VueQuill @vueup/vue-quill v1.0.1
3
3
  * https://vueup.github.io/vue-quill/
4
4
  *
5
5
  * Includes quill v1.3.7
@@ -7,7 +7,7 @@
7
7
  *
8
8
  * Copyright (c) 2022 Ahmad Luthfi Masruri
9
9
  * Released under the MIT license
10
- * Date: 2022-10-21T15:47:50.853Z
10
+ * Date: 2022-12-20T16:01:54.428Z
11
11
  */
12
12
  (function (global, factory) {
13
13
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -18609,15 +18609,38 @@
18609
18609
  }
18610
18610
  return Object.assign({}, props.globalOptions, props.options, clientOptions);
18611
18611
  };
18612
+ const deltaHasValuesOtherThanRetain = (delta) => {
18613
+ return Object.values(delta).some((v) => !v.retain);
18614
+ };
18615
+ // eslint-disable-next-line vue/no-setup-props-destructure
18616
+ let internalModel = props.content; // Doesn't need reactivity
18617
+ const internalModelEquals = (against) => {
18618
+ if (typeof internalModel === typeof against) {
18619
+ if (against === internalModel) {
18620
+ return true;
18621
+ }
18622
+ // Ref/Proxy does not support instanceof, so do a loose check
18623
+ if (typeof against === 'object' && typeof internalModel === 'object') {
18624
+ return !deltaHasValuesOtherThanRetain(internalModel.diff(against));
18625
+ }
18626
+ }
18627
+ return false;
18628
+ };
18612
18629
  const handleTextChange = (delta, oldContents, source) => {
18630
+ // Quill should never be null at this point because we receive an event
18631
+ // so content should not be undefined but let's make ts and eslint happy
18632
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
18633
+ internalModel = getContents();
18613
18634
  // Update v-model:content when text changes
18614
- ctx.emit('update:content', getContents());
18635
+ if (!internalModelEquals(props.content)) {
18636
+ ctx.emit('update:content', internalModel);
18637
+ }
18615
18638
  ctx.emit('textChange', { delta, oldContents, source });
18616
18639
  };
18617
18640
  const isEditorFocus = vue.ref();
18618
18641
  const handleSelectionChange = (range, oldRange, source) => {
18619
18642
  // Set isEditorFocus if quill.hasFocus()
18620
- isEditorFocus.value = (quill === null || quill === void 0 ? void 0 : quill.hasFocus()) ? true : false;
18643
+ isEditorFocus.value = !!(quill === null || quill === void 0 ? void 0 : quill.hasFocus());
18621
18644
  ctx.emit('selectionChange', { range, oldRange, source });
18622
18645
  };
18623
18646
  vue.watch(isEditorFocus, (focus) => {
@@ -18705,13 +18728,17 @@
18705
18728
  initialize();
18706
18729
  });
18707
18730
  };
18708
- // watch(
18709
- // () => props.content,
18710
- // (newContent, oldContents) => {
18711
- // if (!quill || !newContent || newContent === oldContents) return
18712
- // setContents(newContent)
18713
- // }
18714
- // )
18731
+ vue.watch(() => props.content, (newContent) => {
18732
+ if (!quill || !newContent || internalModelEquals(newContent))
18733
+ return;
18734
+ internalModel = newContent;
18735
+ // Restore the selection and cursor position after updating the content
18736
+ const selection = quill.getSelection();
18737
+ if (selection) {
18738
+ vue.nextTick(() => quill === null || quill === void 0 ? void 0 : quill.setSelection(selection));
18739
+ }
18740
+ setContents(newContent);
18741
+ });
18715
18742
  vue.watch(() => props.enable, (newValue) => {
18716
18743
  if (quill)
18717
18744
  quill.enable(newValue);