npm - quill-resize-module - Versions diffs - 2.0.2 → 2.0.3 - Mend

quill-resize-module 2.0.2 → 2.0.3

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.

Files changed (13) hide show

package/README.md +32 -68
package/demo/index.js +18 -2
package/dist/resize.css +2 -17
package/dist/resize.js +2 -2
package/package.json +1 -1
package/src/DefaultOptions.js +1 -53
package/src/QuillResize.js +1 -2
package/src/assets/resize.scss +112 -0
package/src/index.js +1 -1
package/src/modules/DisplaySize.js +1 -3
package/src/modules/Resize.js +9 -34
package/src/modules/Toolbar.js +64 -73
package/src/assets/resize.css +0 -15

package/README.md CHANGED Viewed

@@ -7,7 +7,9 @@ This module is original forked from <https://github.com/whatcould/quill-image-re
 ## Changed V2
 1. Support Quill2
 2. Removed formats/image formats/placeholder
-3. Add `embedTags` option for custom embed element
+3. Removed `options.styles`
+4. Add `embedTags` option for custom embed element
+4. Add `tools` option for custom toolbar
 ## Features
  - Image resize
@@ -92,7 +94,35 @@ const quill = new Quill(editor, {
 });
 ```
-Each module is described below.
+Customize the toolbar buttons with "tools" option.
+For example, add handler for image alt attribute:
+```javascript
+const quill = new Quill(editor, {
+    // ...
+    modules: {
+        // ...
+        resize: {
+            tools: [
+              'left', 'right',
+              {
+                text: 'Alt',
+                verify (activeEle) {
+                    return (activeEle && activeEle.tagName === 'IMG')
+                },
+                handler (evt, button, activeEle) {
+                    let alt = activeEle.alt || ''
+                    alt = window.prompt('Alt for image', alt)
+                    if (alt == null) return
+                    activeEle.setAttribute('alt', alt)
+                }
+              }
+            ]
+        }
+    }
+});
+```
 #### `Resize` - Resize the element
@@ -119,72 +149,6 @@ var quill = new Quill(editor, {
                         ratio: .5625  // keep width/height ratio. (ratio=height/width)
                     }
                 }
-            },
-            styles: {
-                handle: {
-                    backgroundColor: 'black',
-                    border: 'none',
-                    color: white
-                    // other camelCase styles for size display
-                }
-            }
-        }
-    }
-});
-```
-#### `DisplaySize` - Display pixel size
-Shows the size of the image in pixels near the bottom right of the image.
-The look and feel can be controlled with options:
-```javascript
-var quill = new Quill(editor, {
-    // ...
-    modules: {
-        // ...
-        resize: {
-            // ...
-            styles: {
-                display: {
-                    backgroundColor: 'black',
-                    border: 'none',
-                    color: white
-                    // other camelCase styles for size display
-                }
-            }
-        }
-    }
-});
-```
-#### `Toolbar` - Image alignment tools
-Displays a toolbar below the image, where the user can select an alignment for the image.
-The look and feel can be controlled with options:
-```javascript
-var quill = new Quill(editor, {
-    // ...
-    modules: {
-        // ...
-        resize: {
-            styles: {
-                // ...
-                toolbar: {
-                    backgroundColor: 'black',
-                    border: 'none',
-                    color: white
-                    // other camelCase styles for size display
-                },
-                toolbarButton: {
-                    // ...
-                },
-                toolbarButtonSvg: {
-                    // ...
-                },
             }
         }
     }

package/demo/index.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import 'quill/dist/quill.snow.css'
-import '../src/assets/resize.css'
+import '../src/assets/resize.scss'
 import Resize from '../src/index'
@@ -20,7 +20,23 @@ const demoEditor = new Quill('#editor', {
     ],
     resize: {
       // set embed tags to capture resize
-      embedTags: ['VIDEO', 'IFRAME']
+      embedTags: ['VIDEO', 'IFRAME'],
+      // custom toolbar
+      tools: [
+        'left', 'center', 'right', 'full', 'edit',
+        {
+          text: 'Alt',
+          verify (activeEle) {
+            return (activeEle && activeEle.tagName === 'IMG')
+          },
+          handler (evt, button, activeEle) {
+            let alt = activeEle.alt || ''
+            alt = window.prompt('Alt for image', alt)
+            if (alt == null) return
+            activeEle.setAttribute('alt', alt)
+          }
+        }
+      ]
     }
   }
 })

package/dist/resize.css CHANGED Viewed

@@ -1,20 +1,5 @@
 /*!
- * Quill Resize Module v2.0.2
+ * Quill Resize Module v2.0.3
  * https://github.com/mudoo/quill-resize-module
  */
-.ql-resize-style-left {
-    float: left;
-    margin: 0 1em 1em 0;
-}
-.ql-resize-style-center {
-    display: block;
-    margin: auto;
-}
-.ql-resize-style-right {
-    float: right;
-    margin: 0 0 1em 1em;
-}
-.ql-resize-style-full {
-    width: 100% !important;
-}
+.ql-resize-overlay{position:absolute;box-sizing:border-box;border:1px dashed #444;pointer-events:none}.ql-resize-toolbar{position:absolute;top:-12px;right:0;left:0;height:0;min-width:120px;text-align:center;color:#333;box-sizing:border-box;cursor:default;pointer-events:all}.ql-resize-toolbar button{display:inline-block;min-width:24px;height:24px;padding:2px;background-color:#fff;border:1px solid #999;vertical-align:middle}.ql-resize-toolbar button:first-child{border-top-left-radius:3px;border-bottom-left-radius:3px}.ql-resize-toolbar button:last-child{border-bottom-right-radius:3px;border-top-right-radius:3px}.ql-resize-toolbar button:not(:first-child){border-left:none}.ql-resize-toolbar button.active{filter:invert(20%)}.ql-resize-toolbar svg{width:18px}.ql-resize-handle{position:absolute;height:12px;width:12px;background-color:#fff;border:1px solid #777;box-sizing:border-box;opacity:.8;pointer-events:all}.ql-resize-handle.tl{top:-6px;left:-6px;cursor:nwse-resize}.ql-resize-handle.tr{top:-6px;right:-6px;cursor:nesw-resize}.ql-resize-handle.br{right:-6px;bottom:-6px;cursor:nwse-resize}.ql-resize-handle.bl{left:-6px;bottom:-6px;cursor:nwse-resize}.ql-resize-display{position:absolute;padding:4px 8px;text-align:center;background-color:#fff;color:#333;border:1px solid #777;box-sizing:border-box;opacity:.8;cursor:default;line-height:1}.ql-resize-style-left{float:left;margin:0 1em 1em 0}.ql-resize-style-center{display:block;margin:auto}.ql-resize-style-right{float:right;margin:0 0 1em 1em}.ql-resize-style-full{width:100% !important}

package/dist/resize.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /*!
- * Quill Resize Module v2.0.2
+ * Quill Resize Module v2.0.3
  * https://github.com/mudoo/quill-resize-module
  */
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("Quill")):"function"==typeof define&&define.amd?define(["Quill"],e):"object"==typeof exports?exports.QuillResize=e(require("Quill")):t.QuillResize=e(t.Quill)}(self,(t=>(()=>{"use strict";var e=[,e=>{e.exports=t}],i={};function o(t){var n=i[t];if(void 0!==n)return n.exports;var r=i[t]={exports:{}};return e[t](r,r.exports,o),r.exports}o.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return o.d(e,{a:e}),e},o.d=(t,e)=>{for(var i in e)o.o(e,i)&&!o.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var n={};o.r(n),o.d(n,{default:()=>ut});const r={modules:["DisplaySize","Toolbar","Resize","Keyboard"],keyboardSelect:!0,selectedClass:"selected",activeClass:"active",embedTags:["VIDEO","IFRAME"],parchment:{image:{attribute:["width"],limit:{minWidth:100}},video:{attribute:["width","height"],limit:{minWidth:200,ratio:.5625}}},styles:{overlay:{position:"absolute",boxSizing:"border-box",border:"1px dashed #444",pointerEvents:"none"},handle:{position:"absolute",height:"12px",width:"12px",backgroundColor:"white",border:"1px solid #777",boxSizing:"border-box",opacity:"0.80",pointerEvents:"all"},display:{position:"absolute",padding:"4px 8px",textAlign:"center",backgroundColor:"white",color:"#333",border:"1px solid #777",boxSizing:"border-box",opacity:"0.80",cursor:"default",lineHeight:"1"},toolbar:{position:"absolute",top:"-12px",right:"0",left:"0",height:"0",minWidth:"120px",textAlign:"center",color:"#333",boxSizing:"border-box",cursor:"default",pointerEvents:"all"},toolbarButton:{display:"inline-block",width:"24px",height:"24px",background:"white",border:"1px solid #999",verticalAlign:"middle"},toolbarButtonSvg:{}}};function l(t){return l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},l(t)}function s(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,a(o.key),o)}}function a(t){var e=function(t,e){if("object"!=l(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=l(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==l(e)?e:e+""}var u=function(){return t=function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.resizer=e,this.quill=e.quill,this.overlay=e.overlay,this.activeEle=e.activeEle,this.blot=e.blot,this.options=e.options,this.requestUpdate=function(){e.onUpdate(!0)}},(e=[{key:"onCreate",value:function(){}},{key:"onDestroy",value:function(){}},{key:"onUpdate",value:function(){}}])&&s(t.prototype,e),i&&s(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,e,i}();function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}function h(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,f(o.key),o)}}function f(t){var e=function(t,e){if("object"!=c(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=c(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==c(e)?e:e+""}function d(t,e,i){return e=y(e),function(t,e){if(e&&("object"==c(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,p()?Reflect.construct(e,i||[],y(t).constructor):e.apply(t,i))}function p(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(p=function(){return!!t})()}function y(t){return y=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},y(t)}function b(t,e){return b=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},b(t,e)}var v=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),d(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&b(t,e)}(e,t),i=e,(o=[{key:"onCreate",value:function(){this.display=document.createElement("div"),Object.assign(this.display.style,this.options.styles.display),this.overlay.appendChild(this.display)}},{key:"onUpdate",value:function(){if(this.display&&this.activeEle){var t=this.getCurrentSize();if(this.display.innerHTML=t.join(" &times; "),t[0]>120&&t[1]>30)Object.assign(this.display.style,{right:"4px",bottom:"4px",left:"auto"});else if("right"===this.activeEle.style.float){var e=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"auto",bottom:"-".concat(e.height+4,"px"),left:"-".concat(e.width+4,"px")})}else{var i=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"-".concat(i.width+4,"px"),bottom:"-".concat(i.height+4,"px"),left:"auto"})}}}},{key:"getCurrentSize",value:function(){return[this.activeEle.offsetWidth,this.activeEle.offsetHeight]}}])&&h(i.prototype,o),n&&h(i,n),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,o,n}(u);var m=o(1),g=o.n(m);function w(t){return w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},w(t)}function E(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,P(o.key),o)}}function O(t,e,i){return e=j(e),function(t,e){if(e&&("object"==w(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,x()?Reflect.construct(e,i||[],j(t).constructor):e.apply(t,i))}function x(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(x=function(){return!!t})()}function j(t){return j=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},j(t)}function S(t,e){return S=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},S(t,e)}function P(t){var e=function(t,e){if("object"!=w(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=w(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==w(e)?e:e+""}var k,C,q,A=(window.Quill||g()).import("parchment"),L=new(A.ClassAttributor?A.ClassAttributor:A.Attributor.Class)("imagestyle","ql-resize-style"),T=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),O(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&S(t,e)}(e,t),i=e,(o=[{key:"onCreate",value:function(){this.toolbar=document.createElement("div"),Object.assign(this.toolbar.style,this.options.styles.toolbar),this.overlay.appendChild(this.toolbar),this._defineAlignments(),this._addToolbarButtons()}},{key:"_defineAlignments",value:function(){var t=this,e=this.constructor.Icons;this.alignments=[{icon:e.AlignLeft,apply:function(){L.add(t.activeEle,"left")},isApplied:function(){return"left"===L.value(t.activeEle)}},{icon:e.AlignCenter,apply:function(){L.add(t.activeEle,"center")},isApplied:function(){return"center"===L.value(t.activeEle)}},{icon:e.AlignRight,apply:function(){L.add(t.activeEle,"right")},isApplied:function(){return"right"===L.value(t.activeEle)}},{icon:e.FloatFull,apply:function(){L.add(t.activeEle,"full")},isApplied:function(){return"full"===L.value(t.activeEle)}}]}},{key:"_addToolbarButtons",value:function(){var t=this,e=this.constructor.Icons,i=[];this.alignments.forEach((function(e,o){var n=document.createElement("span");i.push(n),n.innerHTML=e.icon,n.addEventListener("click",(function(){i.forEach((function(t){return t.style.filter=""})),e.isApplied()?L.remove(t.activeEle):(t._selectButton(n),e.apply()),t.requestUpdate()})),Object.assign(n.style,t.options.styles.toolbarButton),o>0&&(n.style.borderLeftWidth="0"),Object.assign(n.children[0].style,t.options.styles.toolbarButtonSvg),e.isApplied()&&t._selectButton(n),t.toolbar.appendChild(n)}));var o=document.createElement("span");o.innerHTML=e.Edit,Object.assign(o.style,this.options.styles.toolbarButton),o.style.borderLeftWidth="0",o.addEventListener("click",(function(){t.quill.emitter.emit("resize-edit",t.activeEle,t.blot)})),this.toolbar.appendChild(o)}},{key:"_selectButton",value:function(t){t.style.filter="invert(20%)"}}])&&E(i.prototype,o),n&&E(i,n),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,o,n}(u);function B(t){return B="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},B(t)}function M(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,o)}return i}function z(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?M(Object(i),!0).forEach((function(e){H(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):M(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function H(t,e,i){return(e=D(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function _(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,D(o.key),o)}}function D(t){var e=function(t,e){if("object"!=B(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=B(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==B(e)?e:e+""}function R(t,e,i){return e=W(e),function(t,e){if(e&&("object"==B(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,N()?Reflect.construct(e,i||[],W(t).constructor):e.apply(t,i))}function N(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(N=function(){return!!t})()}function W(t){return W=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},W(t)}function I(t,e){return I=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},I(t,e)}k=T,q={AlignLeft:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M15,8H13a1,1,0,0,1,0-2h2A1,1,0,0,1,15,8Z"/>\n  <path class="ql-fill" d="M15,12H13a1,1,0,0,1,0-2h2A1,1,0,0,1,15,12Z"/>\n  <path class="ql-fill" d="M15,16H5a1,1,0,0,1,0-2H15A1,1,0,0,1,15,16Z"/>\n  <path class="ql-fill" d="M15,4H5A1,1,0,0,1,5,2H15A1,1,0,0,1,15,4Z"/>\n  <rect class="ql-fill" x="2" y="6" width="8" height="6" rx="1" ry="1"/>\n</svg>',AlignCenter:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M14,16H4a1,1,0,0,1,0-2H14A1,1,0,0,1,14,16Z"/>\n  <path class="ql-fill" d="M14,4H4A1,1,0,0,1,4,2H14A1,1,0,0,1,14,4Z"/>\n  <rect class="ql-fill" x="3" y="6" width="12" height="6" rx="1" ry="1"/>\n</svg>',AlignRight:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M5,8H3A1,1,0,0,1,3,6H5A1,1,0,0,1,5,8Z"/>\n  <path class="ql-fill" d="M5,12H3a1,1,0,0,1,0-2H5A1,1,0,0,1,5,12Z"/>\n  <path class="ql-fill" d="M13,16H3a1,1,0,0,1,0-2H13A1,1,0,0,1,13,16Z"/>\n  <path class="ql-fill" d="M13,4H3A1,1,0,0,1,3,2H13A1,1,0,0,1,13,4Z"/>\n  <rect class="ql-fill" x="8" y="6" width="8" height="6" rx="1" ry="1" transform="translate(24 18) rotate(-180)"/>\n</svg>',FloatFull:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M13,16H5a1,1,0,0,1,0-2h8A1,1,0,0,1,13,16Z"/>\n  <path class="ql-fill" d="M13,4H5A1,1,0,0,1,5,2h8A1,1,0,0,1,13,4Z"/>\n  <rect class="ql-fill" x="2" y="6" width="14" height="6" rx="1" ry="1"/>\n</svg>',Edit:'<svg viewBox="0 0 18 18">\n  <path class="ql-fill" d="M 12.9 2 L 11.3 3.6 L 14.8 7 L 16.3 5.5 L 12.9 2 Z M 9.3 5.5 L 2 12.2 L 2 15.5 L 5.7 15.5 L 13 8.9 L 9.3 5.5 Z"></path>\n</svg>\n'},(C=P(C="Icons"))in k?Object.defineProperty(k,C,{value:q,enumerable:!0,configurable:!0,writable:!0}):k[C]=q;var U=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),R(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&I(t,e)}(e,t),function(t,e,i){return e&&_(t.prototype,e),i&&_(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t}(e,[{key:"onCreate",value:function(){this.blotOptions=this.options.parchment[this.blot.statics.blotName],this.boxes=[],this.addBox("nwse-resize"),this.addBox("nesw-resize"),this.addBox("nwse-resize"),this.addBox("nesw-resize"),this.positionBoxes()}},{key:"onDestroy",value:function(){this.setCursor("")}},{key:"positionBoxes",value:function(){var t=this,e="".concat(-parseFloat(this.options.styles.handle.width)/2,"px"),i="".concat(-parseFloat(this.options.styles.handle.height)/2,"px");[{left:e,top:i},{right:e,top:i},{right:e,bottom:i},{left:e,bottom:i}].forEach((function(e,i){Object.assign(t.boxes[i].style,e)}))}},{key:"addBox",value:function(t){var e=document.createElement("div");Object.assign(e.style,this.options.styles.handle),e.style.cursor=t,e.style.width="".concat(this.options.styles.handle.width,"px"),e.style.height="".concat(this.options.styles.handle.height,"px"),e.addEventListener("mousedown",this.handleMousedown.bind(this),!1),this.overlay.appendChild(e),this.boxes.push(e)}},{key:"handleMousedown",value:function(t){var e=this;this.blot.handling&&this.blot.handling(!0),this.dragBox=t.target,this.dragStartX=t.clientX,this.dragStartY=t.clientY,this.preDragSize={width:this.activeEle.offsetWidth,height:this.activeEle.offsetHeight},this.naturalSize=this.getNaturalSize(),this.setCursor(this.dragBox.style.cursor),this.handleDragProxy=function(t){return e.handleDrag(t)},this.handleMouseupProxy=function(t){return e.handleMouseup(t)},document.addEventListener("mousemove",this.handleDragProxy,!1),document.addEventListener("mouseup",this.handleMouseupProxy,!1)}},{key:"handleMouseup",value:function(t){var e=this.calcSize(t,this.blotOptions.limit);Object.assign(this.activeEle,e),Object.assign(this.activeEle.style,{width:null,height:null}),this.setCursor(""),this.blot.handling&&this.blot.handling(!1),document.removeEventListener("mousemove",this.handleDragProxy),document.removeEventListener("mouseup",this.handleMouseupProxy)}},{key:"handleDrag",value:function(t){if(this.activeEle&&this.blot){var e=z(z({},this.blotOptions.limit),{},{unit:!0});Object.assign(this.activeEle.style,this.calcSize(t,e)),this.requestUpdate()}}},{key:"calcSize",value:function(t){var e=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=t.clientX-this.dragStartX,n=t.clientY-this.dragStartY,r={},l=1;(this.blotOptions.attribute||["width"]).forEach((function(t){r[t]=e.preDragSize[t]})),this.dragBox!==this.boxes[0]&&this.dragBox!==this.boxes[3]||(l=-1),r.width&&(r.width=Math.round(this.preDragSize.width+o*l)),r.height&&(r.height=Math.round(this.preDragSize.height+n*l));var s,a=r.width,u=r.height;i.ratio?(i.minWidth&&(a=Math.max(i.minWidth,a)),i.maxWidth&&(a=Math.min(i.maxWidth,a)),u=a*i.ratio,i.minHeight&&u<i.minHeight&&(s=!0,u=i.minHeight),i.maxHeight&&u>i.maxHeight&&(s=!0,u=i.maxHeight),s&&(a=u/i.ratio)):(r.width&&(i.minWidth&&(a=Math.max(i.minWidth,a)),i.maxWidth&&(a=Math.min(i.maxWidth,a))),r.height&&(i.minHeight&&(u=Math.max(i.minHeight,u)),i.maxHeight&&(u=Math.min(i.maxHeight,u))));i.unit&&(a&&(a+="px"),u&&(u+="px"));var c={};return a&&(c.width=a),u&&(c.height=u),c}},{key:"getNaturalSize",value:function(){var t=this.activeEle,e=[0,0];return t.getAttribute("data-size")?e=t.getAttribute("data-size").split(","):(e=[t.naturalWidth||t.offsetWidth,t.naturalHeight||t.offsetHeight],t.setAttribute("data-size",e[0]+","+e[1])),{width:parseInt(e[0]),height:parseInt(e[1])}}},{key:"setCursor",value:function(t){[document.body,this.activeEle].forEach((function(e){e.style.cursor=t}))}}])}(u);function F(t){return F="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},F(t)}function Z(t,e,i){return(e=X(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function K(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var i=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=i){var o,n,r,l,s=[],a=!0,u=!1;try{if(r=(i=i.call(t)).next,0===e){if(Object(i)!==i)return;a=!1}else for(;!(a=(o=r.call(i)).done)&&(s.push(o.value),s.length!==e);a=!0);}catch(t){u=!0,n=t}finally{try{if(!a&&null!=i.return&&(l=i.return(),Object(l)!==l))return}finally{if(u)throw n}}return s}}(t,e)||function(t,e){if(t){if("string"==typeof t)return Q(t,e);var i={}.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?Q(t,e):void 0}}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Q(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,o=Array(e);i<e;i++)o[i]=t[i];return o}function G(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,X(o.key),o)}}function X(t){var e=function(t,e){if("object"!=F(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=F(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==F(e)?e:e+""}function Y(t,e,i){return e=$(e),function(t,e){if(e&&("object"==F(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,V()?Reflect.construct(e,i||[],$(t).constructor):e.apply(t,i))}function V(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(V=function(){return!!t})()}function $(t){return $=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},$(t)}function J(t,e){return J=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},J(t,e)}var tt=window.Quill||g(),et=tt.import("parchment"),it={BACKSPACE:8,TAB:9,ENTER:13,ESCAPE:27,LEFT:37,UP:38,RIGHT:39,DOWN:40,DELETE:46},ot=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),Y(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&J(t,e)}(e,t),function(t,e,i){return e&&G(t.prototype,e),i&&G(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t}(e,[{key:"onCreate",value:function(t){var e=this;this.keyboardProxy=function(t){return e.keyboardHandle(t)},document.addEventListener("keydown",this.keyboardProxy,!0)}},{key:"onDestroy",value:function(){document.removeEventListener("keydown",this.keyboardProxy,!0)}},{key:"keyboardHandle",value:function(t){if(!t.defaultPrevented&&!(t.shiftKey||t.ctrlKey||t.altKey)&&this.activeEle&&!t.fromResize&&!t.ctrlKey){var e,i=t.keyCode,o=this.blot.offset(this.quill.scroll),n=!1;i===it.BACKSPACE||i===it.DELETE?(this.blot.deleteAt(0),this.blot.parent.optimize(),n=!0):i>=it.LEFT&&i<=it.DOWN&&(i===it.RIGHT?o+=this.blot.length()||1:i===it.UP?(o=this.getOtherLineIndex(-1),e=this.quill.getLeaf(o)[0]):i===it.DOWN&&(o=this.getOtherLineIndex(1),e=this.quill.getLeaf(o)[0]),n=!0),n&&(t.stopPropagation(),t.preventDefault()),e&&this.resizer.judgeShow(e,e.domNode)||(this.quill.setSelection(o),this.resizer.hide())}}},{key:"getOtherLineIndex",value:function(t){var e=this.blot.offset(this.quill.scroll),i=K(this.quill.getLine(e),1)[0],o=this.blot.offset(i)+1,n=t>0?i.next:i.prev;if(n){var r=n.length();"block"===n.statics.blotName&&r--,e=n.offset(this.quill.scroll)+Math.min(r,o)}return e}},{key:"dispatchEvent",value:function(t){var e=new t.constructor(t);e.fromResize=!0,this.quill.root.dispatchEvent(e)}}],[{key:"injectInit",value:function(t){var e=t.keyboard.bindings;e[this.keys.LEFT].unshift(this.makeArrowHandler(this.keys.LEFT,!1)),e[this.keys.RIGHT].unshift(this.makeArrowHandler(this.keys.RIGHT,!1))}},{key:"makeArrowHandler",value:function(t,i){var o=t===e.keys.LEFT?"prefix":"suffix";return Z(Z({key:t,shiftKey:i,altKey:null},o,/^$/),"handler",(function(i){if(!this.quill.resizer)return!0;var o=i.index,n=t===e.keys.LEFT,r=t===e.keys.RIGHT,l=K(this.quill.getLine(o+(n?-1:0)),1)[0];if(this.quill.resizer.judgeShow(l))return!1;var s=this.quill.getIndex(l);if(r&&s+l.length()-1===o)return!0;r&&(o+=i.length+1);var a=K(this.quill.getLeaf(o),1)[0],u=a.offset(a.parent),c=a.constructor.scope===et.Scope.BLOCK_BLOT;return!(!n||!(c&&o===u||0===o||o===s))||(n&&0===u&&(o-=1,a=this.quill.getLeaf(o)[0]),!this.quill.resizer.judgeShow(a))}))}}])}(u);function nt(t){return nt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},nt(t)}function rt(t,e){for(var i=0;i<e.length;i++){var o=e[i];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,lt(o.key),o)}}function lt(t){var e=function(t,e){if("object"!=nt(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var o=i.call(t,e||"default");if("object"!=nt(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==nt(e)?e:e+""}/^2\./.test(tt.version)?ot.keys={BACKSPACE:"Backspace",TAB:"Tab",ENTER:"Enter",ESCAPE:"Escape",LEFT:"ArrowLeft",UP:"ArrowUp",RIGHT:"ArrowRight",DOWN:"ArrowDown",DELETE:"Delete"}:ot.keys=it;var st=(window.Quill||g()).import("parchment"),at=function(){return function(t,e,i){return e&&rt(t.prototype,e),i&&rt(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t}((function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),e.resizer=this,this.quill=e;var o=!1;i.modules&&(o=i.modules.slice()),this.options=Object.assign({},r,i),this.options.styles=Object.assign({},r.styles,i.styles),!1!==o&&(this.options.modules=o),document.execCommand("enableObjectResizing",!1,"false"),this.quill.root.addEventListener("mousedown",this.handleClick.bind(this),!1),this.quill.on("text-change",this.handleChange.bind(this)),this.quill.emitter.on("resize-edit",this.handleEdit.bind(this)),this.quill.container.style.position=this.quill.container.style.position||"relative",this.selectedBlots=[],this.options.selectedClass&&this.quill.on("selection-change",this.addBlotsSelectedClass.bind(this)),this.moduleClasses=this.options.modules,this.modules=[],this.options.keyboardSelect&&ot.injectInit(this.quill),this.options.embedTags&&this.initializeEmbed()}),[{key:"initializeModules",value:function(){var t=this;this.removeModules(),this.modules=this.moduleClasses.map((function(e){return new(t.constructor.Modules[e]||e)(t)})),this.modules.forEach((function(e){e.onCreate(t)})),this.onUpdate()}},{key:"initializeEmbed",value:function(){if(this.options.embedTags.length){this.embedClassName="ql-".concat(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:8,e="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";return Array.from({length:t},(function(){return e[Math.floor(62*Math.random())]})).join("")}());var t=[""].concat(this.options.embedTags).join(", .".concat(this.embedClassName," ")).slice(2);t+="{pointer-events: none;}";var e=document.createElement("style");e.textContent=t,this.quill.container.appendChild(e),this.quill.root.classList.add(this.embedClassName)}}},{key:"onUpdate",value:function(t){this.updateFromModule=t,this.repositionElements(),this.modules.forEach((function(t){t.onUpdate()}))}},{key:"removeModules",value:function(){this.modules.forEach((function(t){t.onDestroy()})),this.modules=[]}},{key:"handleEdit",value:function(){if(this.blot){var t=this.blot.offset(this.quill.scroll);this.hide(),this.quill.focus(),this.quill.setSelection(t,1)}}},{key:"handleClick",value:function(t){var e,i,o=!1,n=t.target,r=null===(e=this.options.embedTags)||void 0===e?void 0:e.join();if(r){var l=this.quill.root;(n===l||n.querySelectorAll(r).length)&&(l.classList.remove(this.embedClassName),n=document.elementFromPoint(t.clientX,t.clientY),l.classList.add(this.embedClassName))}n&&n.tagName&&(i=this.quill.constructor.find(n))&&(o=this.judgeShow(i,n)),o?t.preventDefault():this.activeEle&&this.hide()}},{key:"judgeShow",value:function(t,e){var i=!1;if(!t)return i;!e&&t.domNode&&(e=t.domNode);var o=this.options.parchment[t.statics.blotName];if(!o)return i;if(this.activeEle===e)return!0;var n=o.limit||{};return(!n.minWidth||n.minWidth&&e.offsetWidth>=n.minWidth)&&(i=!0,this.activeEle&&this.hide(),this.activeEle=e,this.blot=t,this.show(e)),i}},{key:"handleChange",value:function(t,e,i){this.updateFromModule?this.updateFromModule=!1:"user"===i&&this.overlay&&this.activeEle&&this.onUpdate()}},{key:"show",value:function(){this.showOverlay(),this.initializeModules(),this.options.activeClass&&this.activeEle.classList.add(this.options.activeClass)}},{key:"showOverlay",value:function(){var t=this;this.overlay&&this.hideOverlay(),this.quill.setSelection(null),this.setUserSelect("none"),this.overlay=document.createElement("div"),Object.assign(this.overlay.style,this.options.styles.overlay),this.overlay.addEventListener("dblclick",this.handleEdit.bind(this),!1),this.quill.container.appendChild(this.overlay),this.hideProxy=function(e){t.activeEle&&t.hide()},this.quill.root.addEventListener("input",this.hideProxy,!0),this.updateOverlayPositionProxy=this.updateOverlayPosition.bind(this),this.quill.root.addEventListener("scroll",this.updateOverlayPositionProxy),this.repositionElements()}},{key:"hideOverlay",value:function(){this.overlay&&(this.quill.container.removeChild(this.overlay),this.overlay=void 0,this.quill.root.removeEventListener("input",this.hideProxy,!0),this.quill.root.removeEventListener("scroll",this.updateOverlayPositionProxy),this.setUserSelect(""))}},{key:"repositionElements",value:function(){if(this.overlay&&this.activeEle){var t=this.quill.container,e=this.activeEle.getBoundingClientRect(),i=t.getBoundingClientRect();Object.assign(this.overlay.style,{left:"".concat(e.left-i.left-1+t.scrollLeft,"px"),top:"".concat(e.top-i.top+this.quill.root.scrollTop,"px"),width:"".concat(e.width,"px"),height:"".concat(e.height,"px"),marginTop:-1*this.quill.root.scrollTop+"px"})}}},{key:"updateOverlayPosition",value:function(){this.overlay.style.marginTop=-1*this.quill.root.scrollTop+"px"}},{key:"addBlotsSelectedClass",value:function(t,e){var i=this;if(!t)return this.removeBlotsSelectedClass(),void(this.selectedBlots=[]);var o=this.quill.scroll.descendants(st.Leaf||st.LeafBlot,t.index,t.length).filter((function(t){var e=!!i.options.parchment[t.statics.blotName];return e&&t.domNode.classList.add(i.options.selectedClass),e}));this.removeBlotsSelectedClass(o),this.selectedBlots=o}},{key:"removeBlotsSelectedClass",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];Array.isArray(e)||(e=[e]),this.selectedBlots.forEach((function(i){-1===e.indexOf(i)&&i.domNode.classList.remove(t.options.selectedClass)}))}},{key:"hide",value:function(){this.hideOverlay(),this.removeModules(),this.activeEle&&this.options.activeClass&&this.activeEle.classList.remove(this.options.activeClass),this.activeEle=void 0,this.blot=void 0}},{key:"setUserSelect",value:function(t){var e=this;["userSelect","mozUserSelect","webkitUserSelect","msUserSelect"].forEach((function(i){e.quill.root.style[i]=t,document.documentElement.style[i]=t}))}}])}();!function(t,e,i){(e=lt(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i}(at,"Modules",{Base:u,DisplaySize:v,Toolbar:T,Resize:U,Keyboard:ot}),window.Quill&&window.Quill.register("modules/resize",at);const ut=at;return n})()));
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("Quill")):"function"==typeof define&&define.amd?define(["Quill"],e):"object"==typeof exports?exports.QuillResize=e(require("Quill")):t.QuillResize=e(t.Quill)}(self,(t=>(()=>{"use strict";var e=[,e=>{e.exports=t}],i={};function r(t){var o=i[t];if(void 0!==o)return o.exports;var n=i[t]={exports:{}};return e[t](n,n.exports,r),n.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var o={};r.r(o),r.d(o,{default:()=>ct});const n={modules:["DisplaySize","Toolbar","Resize","Keyboard"],keyboardSelect:!0,selectedClass:"selected",activeClass:"active",embedTags:["VIDEO","IFRAME"],tools:["left","center","right","full","edit"],parchment:{image:{attribute:["width"],limit:{minWidth:100}},video:{attribute:["width","height"],limit:{minWidth:200,ratio:.5625}}}};function l(t){return l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},l(t)}function s(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,a(r.key),r)}}function a(t){var e=function(t,e){if("object"!=l(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=l(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==l(e)?e:e+""}var u=function(){return t=function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.resizer=e,this.quill=e.quill,this.overlay=e.overlay,this.activeEle=e.activeEle,this.blot=e.blot,this.options=e.options,this.requestUpdate=function(){e.onUpdate(!0)}},(e=[{key:"onCreate",value:function(){}},{key:"onDestroy",value:function(){}},{key:"onUpdate",value:function(){}}])&&s(t.prototype,e),i&&s(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,e,i}();function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}function h(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,f(r.key),r)}}function f(t){var e=function(t,e){if("object"!=c(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=c(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==c(e)?e:e+""}function d(t,e,i){return e=y(e),function(t,e){if(e&&("object"==c(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,p()?Reflect.construct(e,i||[],y(t).constructor):e.apply(t,i))}function p(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(p=function(){return!!t})()}function y(t){return y=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},y(t)}function v(t,e){return v=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},v(t,e)}var b=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),d(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&v(t,e)}(e,t),i=e,(r=[{key:"onCreate",value:function(){this.display=document.createElement("div"),this.display.className="ql-resize-display",this.overlay.appendChild(this.display)}},{key:"onUpdate",value:function(){if(this.display&&this.activeEle){var t=this.getCurrentSize();if(this.display.innerHTML=t.join(" &times; "),t[0]>120&&t[1]>30)Object.assign(this.display.style,{right:"4px",bottom:"4px",left:"auto"});else if("right"===this.activeEle.style.float){var e=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"auto",bottom:"-".concat(e.height+4,"px"),left:"-".concat(e.width+4,"px")})}else{var i=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"-".concat(i.width+4,"px"),bottom:"-".concat(i.height+4,"px"),left:"auto"})}}}},{key:"getCurrentSize",value:function(){return[this.activeEle.offsetWidth,this.activeEle.offsetHeight]}}])&&h(i.prototype,r),o&&h(i,o),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,r,o}(u);var m=r(1),g=r.n(m);function w(t){return w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},w(t)}function E(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,k(r.key),r)}}function O(t,e,i){return e=S(e),function(t,e){if(e&&("object"==w(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,j()?Reflect.construct(e,i||[],S(t).constructor):e.apply(t,i))}function j(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(j=function(){return!!t})()}function S(t){return S=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},S(t)}function x(t,e){return x=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},x(t,e)}function P(t,e,i){return(e=k(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function k(t){var e=function(t,e){if("object"!=w(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=w(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==w(e)?e:e+""}var q=(window.Quill||g()).import("parchment"),C=new(q.ClassAttributor?q.ClassAttributor:q.Attributor.Class)("imagestyle","ql-resize-style"),T=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),O(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&x(t,e)}(e,t),i=e,r=[{key:"onCreate",value:function(){this.toolbar=document.createElement("div"),this.toolbar.className="ql-resize-toolbar",this.overlay.appendChild(this.toolbar),this._addToolbarButtons()}},{key:"_addToolbarButtons",value:function(){var t=this,e=this.constructor.Icons,i=this.constructor.Tools,r=[];this.options.tools.forEach((function(o){var n=i[o]||o;if(!n.verify||!1!==n.verify.call(t,t.activeEle)){var l=document.createElement("button");r.push(l),l.innerHTML=(n.icon||"")+(n.text||"")||e[o],l.addEventListener("click",(function(e){n.handler&&!0!==n.handler.call(t,e,l,t.activeEle)||(r.forEach((function(t){return t.classList.remove("active")})),n.isApplied&&n.isApplied.call(t,t.activeEle)?C.remove(t.activeEle):(l.classList.add("active"),n.apply&&n.apply.call(t,t.activeEle)),t.requestUpdate())})),n.isApplied&&n.isApplied.call(t,t.activeEle)&&l.classList.add("active"),t.toolbar.appendChild(l)}}))}}],r&&E(i.prototype,r),o&&E(i,o),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,r,o}(u);function A(t){return A="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},A(t)}function L(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,r)}return i}function M(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?L(Object(i),!0).forEach((function(e){H(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):L(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function H(t,e,i){return(e=B(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function z(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,B(r.key),r)}}function B(t){var e=function(t,e){if("object"!=A(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=A(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==A(e)?e:e+""}function _(t,e,i){return e=N(e),function(t,e){if(e&&("object"==A(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,D()?Reflect.construct(e,i||[],N(t).constructor):e.apply(t,i))}function D(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(D=function(){return!!t})()}function N(t){return N=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},N(t)}function R(t,e){return R=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},R(t,e)}P(T,"Icons",{left:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M15,8H13a1,1,0,0,1,0-2h2A1,1,0,0,1,15,8Z"/>\n  <path class="ql-fill" d="M15,12H13a1,1,0,0,1,0-2h2A1,1,0,0,1,15,12Z"/>\n  <path class="ql-fill" d="M15,16H5a1,1,0,0,1,0-2H15A1,1,0,0,1,15,16Z"/>\n  <path class="ql-fill" d="M15,4H5A1,1,0,0,1,5,2H15A1,1,0,0,1,15,4Z"/>\n  <rect class="ql-fill" x="2" y="6" width="8" height="6" rx="1" ry="1"/>\n</svg>',center:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M14,16H4a1,1,0,0,1,0-2H14A1,1,0,0,1,14,16Z"/>\n  <path class="ql-fill" d="M14,4H4A1,1,0,0,1,4,2H14A1,1,0,0,1,14,4Z"/>\n  <rect class="ql-fill" x="3" y="6" width="12" height="6" rx="1" ry="1"/>\n</svg>',right:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M5,8H3A1,1,0,0,1,3,6H5A1,1,0,0,1,5,8Z"/>\n  <path class="ql-fill" d="M5,12H3a1,1,0,0,1,0-2H5A1,1,0,0,1,5,12Z"/>\n  <path class="ql-fill" d="M13,16H3a1,1,0,0,1,0-2H13A1,1,0,0,1,13,16Z"/>\n  <path class="ql-fill" d="M13,4H3A1,1,0,0,1,3,2H13A1,1,0,0,1,13,4Z"/>\n  <rect class="ql-fill" x="8" y="6" width="8" height="6" rx="1" ry="1" transform="translate(24 18) rotate(-180)"/>\n</svg>',full:'<svg viewbox="0 0 18 18">\n  <path class="ql-fill" d="M13,16H5a1,1,0,0,1,0-2h8A1,1,0,0,1,13,16Z"/>\n  <path class="ql-fill" d="M13,4H5A1,1,0,0,1,5,2h8A1,1,0,0,1,13,4Z"/>\n  <rect class="ql-fill" x="2" y="6" width="14" height="6" rx="1" ry="1"/>\n</svg>',edit:'<svg viewBox="0 0 18 18">\n  <path class="ql-fill" d="M 12.9 2 L 11.3 3.6 L 14.8 7 L 16.3 5.5 L 12.9 2 Z M 9.3 5.5 L 2 12.2 L 2 15.5 L 5.7 15.5 L 13 8.9 L 9.3 5.5 Z"></path>\n</svg>\n'}),P(T,"Tools",{left:{apply:function(t){C.add(t,"left")},isApplied:function(t){return"left"===C.value(t)}},center:{apply:function(t){C.add(t,"center")},isApplied:function(t){return"center"===C.value(t)}},right:{apply:function(t){C.add(t,"right")},isApplied:function(t){return"right"===C.value(t)}},full:{apply:function(t){C.add(t,"full")},isApplied:function(t){return"full"===C.value(t)}},edit:{handler:function(t,e,i){this.quill.emitter.emit("resize-edit",i,this.blot)}}});var W=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),_(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&R(t,e)}(e,t),i=e,r=[{key:"onCreate",value:function(){this.blotOptions=this.options.parchment[this.blot.statics.blotName],this.boxes=[],this.addBox("tl"),this.addBox("tr"),this.addBox("br"),this.addBox("bl")}},{key:"onDestroy",value:function(){this.setCursor("")}},{key:"addBox",value:function(t){var e=document.createElement("div");e.className="ql-resize-handle ".concat(t),e.addEventListener("mousedown",this.handleMousedown.bind(this),!1),this.overlay.appendChild(e),this.boxes.push(e)}},{key:"handleMousedown",value:function(t){var e=this;this.blot.handling&&this.blot.handling(!0),this.dragBox=t.target,this.dragStartX=t.clientX,this.dragStartY=t.clientY,this.preDragSize={width:this.activeEle.offsetWidth,height:this.activeEle.offsetHeight},this.naturalSize=this.getNaturalSize();var i=window.getComputedStyle(this.dragBox).cursor;this.setCursor(i),this.handleDragProxy=function(t){return e.handleDrag(t)},this.handleMouseupProxy=function(t){return e.handleMouseup(t)},document.addEventListener("mousemove",this.handleDragProxy,!1),document.addEventListener("mouseup",this.handleMouseupProxy,!1)}},{key:"handleMouseup",value:function(t){var e=this.calcSize(t,this.blotOptions.limit);Object.assign(this.activeEle,e),Object.assign(this.activeEle.style,{width:null,height:null}),this.setCursor(""),this.blot.handling&&this.blot.handling(!1),document.removeEventListener("mousemove",this.handleDragProxy),document.removeEventListener("mouseup",this.handleMouseupProxy)}},{key:"handleDrag",value:function(t){if(this.activeEle&&this.blot){var e=M(M({},this.blotOptions.limit),{},{unit:!0});Object.assign(this.activeEle.style,this.calcSize(t,e)),this.requestUpdate()}}},{key:"calcSize",value:function(t){var e=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.clientX-this.dragStartX,o=t.clientY-this.dragStartY,n={},l=1;(this.blotOptions.attribute||["width"]).forEach((function(t){n[t]=e.preDragSize[t]})),this.dragBox!==this.boxes[0]&&this.dragBox!==this.boxes[3]||(l=-1),n.width&&(n.width=Math.round(this.preDragSize.width+r*l)),n.height&&(n.height=Math.round(this.preDragSize.height+o*l));var s,a=n.width,u=n.height;i.ratio?(i.minWidth&&(a=Math.max(i.minWidth,a)),i.maxWidth&&(a=Math.min(i.maxWidth,a)),u=a*i.ratio,i.minHeight&&u<i.minHeight&&(s=!0,u=i.minHeight),i.maxHeight&&u>i.maxHeight&&(s=!0,u=i.maxHeight),s&&(a=u/i.ratio)):(n.width&&(i.minWidth&&(a=Math.max(i.minWidth,a)),i.maxWidth&&(a=Math.min(i.maxWidth,a))),n.height&&(i.minHeight&&(u=Math.max(i.minHeight,u)),i.maxHeight&&(u=Math.min(i.maxHeight,u)))),i.unit&&(a&&(a+="px"),u&&(u+="px"));var c={};return a&&(c.width=a),u&&(c.height=u),c}},{key:"getNaturalSize",value:function(){var t=this.activeEle,e=[0,0];return t.getAttribute("data-size")?e=t.getAttribute("data-size").split(","):(e=[t.naturalWidth||t.offsetWidth,t.naturalHeight||t.offsetHeight],t.setAttribute("data-size",e[0]+","+e[1])),{width:parseInt(e[0]),height:parseInt(e[1])}}},{key:"setCursor",value:function(t){[document.body,this.activeEle].forEach((function(e){e.style.cursor="".concat(t," !important")}))}}],r&&z(i.prototype,r),o&&z(i,o),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,r,o}(u);function I(t){return I="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},I(t)}function U(t,e,i){return(e=Q(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function Z(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var i=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=i){var r,o,n,l,s=[],a=!0,u=!1;try{if(n=(i=i.call(t)).next,0===e){if(Object(i)!==i)return;a=!1}else for(;!(a=(r=n.call(i)).done)&&(s.push(r.value),s.length!==e);a=!0);}catch(t){u=!0,o=t}finally{try{if(!a&&null!=i.return&&(l=i.return(),Object(l)!==l))return}finally{if(u)throw o}}return s}}(t,e)||function(t,e){if(t){if("string"==typeof t)return F(t,e);var i={}.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?F(t,e):void 0}}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function F(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,r=Array(e);i<e;i++)r[i]=t[i];return r}function K(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,Q(r.key),r)}}function Q(t){var e=function(t,e){if("object"!=I(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=I(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==I(e)?e:e+""}function G(t,e,i){return e=Y(e),function(t,e){if(e&&("object"==I(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,X()?Reflect.construct(e,i||[],Y(t).constructor):e.apply(t,i))}function X(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(X=function(){return!!t})()}function Y(t){return Y=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},Y(t)}function V(t,e){return V=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},V(t,e)}var $=window.Quill||g(),J=$.import("parchment"),tt={BACKSPACE:8,TAB:9,ENTER:13,ESCAPE:27,LEFT:37,UP:38,RIGHT:39,DOWN:40,DELETE:46},et=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),G(this,e,arguments)}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&V(t,e)}(e,t),i=e,o=[{key:"injectInit",value:function(t){var e=t.keyboard.bindings;e[this.keys.LEFT].unshift(this.makeArrowHandler(this.keys.LEFT,!1)),e[this.keys.RIGHT].unshift(this.makeArrowHandler(this.keys.RIGHT,!1))}},{key:"makeArrowHandler",value:function(t,i){var r=t===e.keys.LEFT?"prefix":"suffix";return U(U({key:t,shiftKey:i,altKey:null},r,/^$/),"handler",(function(i){if(!this.quill.resizer)return!0;var r=i.index,o=t===e.keys.LEFT,n=t===e.keys.RIGHT,l=Z(this.quill.getLine(r+(o?-1:0)),1)[0];if(this.quill.resizer.judgeShow(l))return!1;var s=this.quill.getIndex(l);if(n&&s+l.length()-1===r)return!0;n&&(r+=i.length+1);var a=Z(this.quill.getLeaf(r),1)[0],u=a.offset(a.parent),c=a.constructor.scope===J.Scope.BLOCK_BLOT;return!(!o||!(c&&r===u||0===r||r===s))||(o&&0===u&&(r-=1,a=this.quill.getLeaf(r)[0]),!this.quill.resizer.judgeShow(a))}))}}],(r=[{key:"onCreate",value:function(t){var e=this;this.keyboardProxy=function(t){return e.keyboardHandle(t)},document.addEventListener("keydown",this.keyboardProxy,!0)}},{key:"onDestroy",value:function(){document.removeEventListener("keydown",this.keyboardProxy,!0)}},{key:"keyboardHandle",value:function(t){if(!t.defaultPrevented&&!(t.shiftKey||t.ctrlKey||t.altKey)&&this.activeEle&&!t.fromResize&&!t.ctrlKey){var e,i=t.keyCode,r=this.blot.offset(this.quill.scroll),o=!1;i===tt.BACKSPACE||i===tt.DELETE?(this.blot.deleteAt(0),this.blot.parent.optimize(),o=!0):i>=tt.LEFT&&i<=tt.DOWN&&(i===tt.RIGHT?r+=this.blot.length()||1:i===tt.UP?(r=this.getOtherLineIndex(-1),e=this.quill.getLeaf(r)[0]):i===tt.DOWN&&(r=this.getOtherLineIndex(1),e=this.quill.getLeaf(r)[0]),o=!0),o&&(t.stopPropagation(),t.preventDefault()),e&&this.resizer.judgeShow(e,e.domNode)||(this.quill.setSelection(r),this.resizer.hide())}}},{key:"getOtherLineIndex",value:function(t){var e=this.blot.offset(this.quill.scroll),i=Z(this.quill.getLine(e),1)[0],r=this.blot.offset(i)+1,o=t>0?i.next:i.prev;if(o){var n=o.length();"block"===o.statics.blotName&&n--,e=o.offset(this.quill.scroll)+Math.min(n,r)}return e}},{key:"dispatchEvent",value:function(t){var e=new t.constructor(t);e.fromResize=!0,this.quill.root.dispatchEvent(e)}}])&&K(i.prototype,r),o&&K(i,o),Object.defineProperty(i,"prototype",{writable:!1}),i;var i,r,o}(u);function it(t){return it="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},it(t)}function rt(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,ot(r.key),r)}}function ot(t){var e=function(t,e){if("object"!=it(t)||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var r=i.call(t,e||"default");if("object"!=it(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==it(e)?e:e+""}/^2\./.test($.version)?et.keys={BACKSPACE:"Backspace",TAB:"Tab",ENTER:"Enter",ESCAPE:"Escape",LEFT:"ArrowLeft",UP:"ArrowUp",RIGHT:"ArrowRight",DOWN:"ArrowDown",DELETE:"Delete"}:et.keys=tt;var nt,lt,st,at=(window.Quill||g()).import("parchment"),ut=function(){return t=function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),e.resizer=this,this.quill=e;var r=!1;i.modules&&(r=i.modules.slice()),this.options=Object.assign({},n,i),!1!==r&&(this.options.modules=r),document.execCommand("enableObjectResizing",!1,"false"),this.quill.root.addEventListener("mousedown",this.handleClick.bind(this),!1),this.quill.on("text-change",this.handleChange.bind(this)),this.quill.emitter.on("resize-edit",this.handleEdit.bind(this)),this.quill.container.style.position=this.quill.container.style.position||"relative",this.selectedBlots=[],this.options.selectedClass&&this.quill.on("selection-change",this.addBlotsSelectedClass.bind(this)),this.moduleClasses=this.options.modules,this.modules=[],this.options.keyboardSelect&&et.injectInit(this.quill),this.options.embedTags&&this.initializeEmbed()},e=[{key:"initializeModules",value:function(){var t=this;this.removeModules(),this.modules=this.moduleClasses.map((function(e){return new(t.constructor.Modules[e]||e)(t)})),this.modules.forEach((function(e){e.onCreate(t)})),this.onUpdate()}},{key:"initializeEmbed",value:function(){if(this.options.embedTags.length){this.embedClassName="ql-".concat(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:8,e="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";return Array.from({length:t},(function(){return e[Math.floor(62*Math.random())]})).join("")}());var t=[""].concat(this.options.embedTags).join(", .".concat(this.embedClassName," ")).slice(2);t+="{pointer-events: none;}";var e=document.createElement("style");e.textContent=t,this.quill.container.appendChild(e),this.quill.root.classList.add(this.embedClassName)}}},{key:"onUpdate",value:function(t){this.updateFromModule=t,this.repositionElements(),this.modules.forEach((function(t){t.onUpdate()}))}},{key:"removeModules",value:function(){this.modules.forEach((function(t){t.onDestroy()})),this.modules=[]}},{key:"handleEdit",value:function(){if(this.blot){var t=this.blot.offset(this.quill.scroll);this.hide(),this.quill.focus(),this.quill.setSelection(t,1)}}},{key:"handleClick",value:function(t){var e,i,r=!1,o=t.target,n=null===(e=this.options.embedTags)||void 0===e?void 0:e.join();if(n){var l=this.quill.root;(o===l||o.querySelectorAll(n).length)&&(l.classList.remove(this.embedClassName),o=document.elementFromPoint(t.clientX,t.clientY),l.classList.add(this.embedClassName))}o&&o.tagName&&(i=this.quill.constructor.find(o))&&(r=this.judgeShow(i,o)),r?t.preventDefault():this.activeEle&&this.hide()}},{key:"judgeShow",value:function(t,e){var i=!1;if(!t)return i;!e&&t.domNode&&(e=t.domNode);var r=this.options.parchment[t.statics.blotName];if(!r)return i;if(this.activeEle===e)return!0;var o=r.limit||{};return(!o.minWidth||o.minWidth&&e.offsetWidth>=o.minWidth)&&(i=!0,this.activeEle&&this.hide(),this.activeEle=e,this.blot=t,this.show(e)),i}},{key:"handleChange",value:function(t,e,i){this.updateFromModule?this.updateFromModule=!1:"user"===i&&this.overlay&&this.activeEle&&this.onUpdate()}},{key:"show",value:function(){this.showOverlay(),this.initializeModules(),this.options.activeClass&&this.activeEle.classList.add(this.options.activeClass)}},{key:"showOverlay",value:function(){var t=this;this.overlay&&this.hideOverlay(),this.quill.setSelection(null),this.setUserSelect("none"),this.overlay=document.createElement("div"),this.overlay.className="ql-resize-overlay",this.overlay.addEventListener("dblclick",this.handleEdit.bind(this),!1),this.quill.container.appendChild(this.overlay),this.hideProxy=function(e){t.activeEle&&t.hide()},this.quill.root.addEventListener("input",this.hideProxy,!0),this.updateOverlayPositionProxy=this.updateOverlayPosition.bind(this),this.quill.root.addEventListener("scroll",this.updateOverlayPositionProxy),this.repositionElements()}},{key:"hideOverlay",value:function(){this.overlay&&(this.quill.container.removeChild(this.overlay),this.overlay=void 0,this.quill.root.removeEventListener("input",this.hideProxy,!0),this.quill.root.removeEventListener("scroll",this.updateOverlayPositionProxy),this.setUserSelect(""))}},{key:"repositionElements",value:function(){if(this.overlay&&this.activeEle){var t=this.quill.container,e=this.activeEle.getBoundingClientRect(),i=t.getBoundingClientRect();Object.assign(this.overlay.style,{left:"".concat(e.left-i.left-1+t.scrollLeft,"px"),top:"".concat(e.top-i.top+this.quill.root.scrollTop,"px"),width:"".concat(e.width,"px"),height:"".concat(e.height,"px"),marginTop:-1*this.quill.root.scrollTop+"px"})}}},{key:"updateOverlayPosition",value:function(){this.overlay.style.marginTop=-1*this.quill.root.scrollTop+"px"}},{key:"addBlotsSelectedClass",value:function(t,e){var i=this;if(!t)return this.removeBlotsSelectedClass(),void(this.selectedBlots=[]);var r=this.quill.scroll.descendants(at.Leaf||at.LeafBlot,t.index,t.length).filter((function(t){var e=!!i.options.parchment[t.statics.blotName];return e&&t.domNode.classList.add(i.options.selectedClass),e}));this.removeBlotsSelectedClass(r),this.selectedBlots=r}},{key:"removeBlotsSelectedClass",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];Array.isArray(e)||(e=[e]),this.selectedBlots.forEach((function(i){-1===e.indexOf(i)&&i.domNode.classList.remove(t.options.selectedClass)}))}},{key:"hide",value:function(){this.hideOverlay(),this.removeModules(),this.activeEle&&this.options.activeClass&&this.activeEle.classList.remove(this.options.activeClass),this.activeEle=void 0,this.blot=void 0}},{key:"setUserSelect",value:function(t){var e=this;["userSelect","mozUserSelect","webkitUserSelect","msUserSelect"].forEach((function(i){e.quill.root.style[i]=t,document.documentElement.style[i]=t}))}}],e&&rt(t.prototype,e),i&&rt(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t;var t,e,i}();nt=ut,st={Base:u,DisplaySize:b,Toolbar:T,Resize:W,Keyboard:et},(lt=ot(lt="Modules"))in nt?Object.defineProperty(nt,lt,{value:st,enumerable:!0,configurable:!0,writable:!0}):nt[lt]=st,window.Quill&&window.Quill.register("modules/resize",ut);const ct=ut;return o})()));

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "quill-resize-module",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "A module for Quill rich text editor to allow images/iframe/video and custom elements(covert to placeholder) to be resized.",
   "main": "dist/resize.js",
   "module": "src/index.js",

package/src/DefaultOptions.js CHANGED Viewed

@@ -4,6 +4,7 @@ export default {
   selectedClass: 'selected',
   activeClass: 'active',
   embedTags: ['VIDEO', 'IFRAME'],
+  tools: ['left', 'center', 'right', 'full', 'edit'],
   parchment: {
     image: {
@@ -19,58 +20,5 @@ export default {
         ratio: 0.5625
       }
     }
-  },
-  styles: {
-    overlay: {
-      position: 'absolute',
-      boxSizing: 'border-box',
-      border: '1px dashed #444',
-      pointerEvents: 'none'
-    },
-    handle: {
-      position: 'absolute',
-      height: '12px',
-      width: '12px',
-      backgroundColor: 'white',
-      border: '1px solid #777',
-      boxSizing: 'border-box',
-      opacity: '0.80',
-      pointerEvents: 'all'
-    },
-    display: {
-      position: 'absolute',
-      padding: '4px 8px',
-      textAlign: 'center',
-      backgroundColor: 'white',
-      color: '#333',
-      border: '1px solid #777',
-      boxSizing: 'border-box',
-      opacity: '0.80',
-      cursor: 'default',
-      lineHeight: '1'
-    },
-    toolbar: {
-      position: 'absolute',
-      top: '-12px',
-      right: '0',
-      left: '0',
-      height: '0',
-      minWidth: '120px',
-      textAlign: 'center',
-      color: '#333',
-      boxSizing: 'border-box',
-      cursor: 'default',
-      pointerEvents: 'all'
-    },
-    toolbarButton: {
-      display: 'inline-block',
-      width: '24px',
-      height: '24px',
-      background: 'white',
-      border: '1px solid #999',
-      verticalAlign: 'middle'
-    },
-    toolbarButtonSvg: {}
   }
 }

package/src/QuillResize.js CHANGED Viewed

@@ -31,7 +31,6 @@ export default class QuillResize {
     // Apply options to default options
     this.options = Object.assign({}, DefaultOptions, options)
-    this.options.styles = Object.assign({}, DefaultOptions.styles, options.styles)
     // (see above about moduleClasses)
     if (moduleClasses !== false) {
@@ -216,8 +215,8 @@ export default class QuillResize {
     // Create and add the overlay
     this.overlay = document.createElement('div')
+    this.overlay.className = 'ql-resize-overlay'
     // this.overlay.setAttribute('title', "Double-click to select image");
-    Object.assign(this.overlay.style, this.options.styles.overlay)
     this.overlay.addEventListener('dblclick', this.handleEdit.bind(this), false)
     this.quill.container.appendChild(this.overlay)

package/src/assets/resize.scss ADDED Viewed

@@ -0,0 +1,112 @@
+.ql-resize-overlay {
+  position: absolute;
+  box-sizing: border-box;
+  border: 1px dashed #444;
+  pointer-events: none;
+}
+.ql-resize-toolbar {
+  position: absolute;
+  top: -12px;
+  right: 0;
+  left: 0;
+  height: 0;
+  min-width: 120px;
+  text-align: center;
+  color: #333;
+  box-sizing: border-box;
+  cursor: default;
+  pointer-events: all;
+  button {
+    display: inline-block;
+    min-width: 24px;
+    height: 24px;
+    padding: 2px;
+    background-color: #fff;
+    border: 1px solid #999;
+    vertical-align: middle;
+    &:first-child {
+      border-top-left-radius: 3px;
+      border-bottom-left-radius: 3px;
+    }
+    &:last-child {
+      border-bottom-right-radius: 3px;
+      border-top-right-radius: 3px;
+    }
+    &:not(:first-child) {
+      border-left: none;
+    }
+    &.active {
+      filter: invert(20%);
+    }
+  }
+  svg {
+    width: 18px;
+  }
+}
+.ql-resize-handle {
+  position: absolute;
+  height: 12px;
+  width: 12px;
+  background-color: white;
+  border: 1px solid #777;
+  box-sizing: border-box;
+  opacity: 0.80;
+  pointer-events: all;
+  &.tl {
+    top: -6px;
+    left: -6px;
+    cursor: nwse-resize;
+  }
+  &.tr {
+    top: -6px;
+    right: -6px;
+    cursor: nesw-resize;
+  }
+  &.br {
+    right: -6px;
+    bottom: -6px;
+    cursor: nwse-resize;
+  }
+  &.bl {
+    left: -6px;
+    bottom: -6px;
+    cursor: nwse-resize;
+  }
+}
+.ql-resize-display {
+  position: absolute;
+  padding: 4px 8px;
+  text-align: center;
+  background-color: white;
+  color: #333;
+  border: 1px solid #777;
+  box-sizing: border-box;
+  opacity: 0.80;
+  cursor: default;
+  line-height: 1;
+}
+.ql-resize-style-left {
+    float: left;
+    margin: 0 1em 1em 0;
+}
+.ql-resize-style-center {
+    display: block;
+    margin: auto;
+}
+.ql-resize-style-right {
+    float: right;
+    margin: 0 0 1em 1em;
+}
+.ql-resize-style-full {
+    width: 100% !important;
+}

package/src/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
 import QuillResize from './QuillResize'
-import './assets/resize.css'
+import './assets/resize.scss'
 export default QuillResize

package/src/modules/DisplaySize.js CHANGED Viewed

@@ -4,9 +4,7 @@ export default class DisplaySize extends BaseModule {
   onCreate () {
     // Create the container to hold the size display
     this.display = document.createElement('div')
-    // Apply styles
-    Object.assign(this.display.style, this.options.styles.display)
+    this.display.className = 'ql-resize-display'
     // Attach it
     this.overlay.appendChild(this.display)

package/src/modules/Resize.js CHANGED Viewed

@@ -7,12 +7,10 @@ export default class Resize extends BaseModule {
     this.boxes = []
     // add 4 resize handles
-    this.addBox('nwse-resize') // top left
-    this.addBox('nesw-resize') // top right
-    this.addBox('nwse-resize') // bottom right
-    this.addBox('nesw-resize') // bottom left
-    this.positionBoxes()
+    this.addBox('tl') // top left
+    this.addBox('tr') // top right
+    this.addBox('br') // bottom right
+    this.addBox('bl') // bottom left
   }
   onDestroy () {
@@ -20,34 +18,10 @@ export default class Resize extends BaseModule {
     this.setCursor('')
   }
-  positionBoxes () {
-    const handleXOffset = `${-parseFloat(this.options.styles.handle.width) /
-      2}px`
-    const handleYOffset = `${-parseFloat(this.options.styles.handle.height) /
-      2}px`
-    // set the top and left for each drag handle
-    ;[
-      { left: handleXOffset, top: handleYOffset }, // top left
-      { right: handleXOffset, top: handleYOffset }, // top right
-      { right: handleXOffset, bottom: handleYOffset }, // bottom right
-      { left: handleXOffset, bottom: handleYOffset } // bottom left
-    ].forEach((pos, idx) => {
-      Object.assign(this.boxes[idx].style, pos)
-    })
-  }
-  addBox (cursor) {
+  addBox (place) {
     // create div element for resize handle
     const box = document.createElement('div')
-    // Star with the specified styles
-    Object.assign(box.style, this.options.styles.handle)
-    box.style.cursor = cursor
-    // Set the width/height to use 'px'
-    box.style.width = `${this.options.styles.handle.width}px`
-    box.style.height = `${this.options.styles.handle.height}px`
+    box.className = `ql-resize-handle ${place}`
     // listen for mousedown on each box
     box.addEventListener('mousedown', this.handleMousedown.bind(this), false)
@@ -72,7 +46,8 @@ export default class Resize extends BaseModule {
     // store the natural size
     this.naturalSize = this.getNaturalSize()
     // set the proper cursor everywhere
-    this.setCursor(this.dragBox.style.cursor)
+    const cursor = window.getComputedStyle(this.dragBox).cursor
+    this.setCursor(cursor)
     this.handleDragProxy = evt => this.handleDrag(evt)
     this.handleMouseupProxy = evt => this.handleMouseup(evt)
@@ -198,7 +173,7 @@ export default class Resize extends BaseModule {
   setCursor (value) {
     [document.body, this.activeEle].forEach(el => {
-      el.style.cursor = value // eslint-disable-line no-param-reassign
+      el.style.cursor = `${value} !important` // eslint-disable-line no-param-reassign
     })
   }
 }

package/src/modules/Toolbar.js CHANGED Viewed

@@ -19,106 +19,97 @@ const ImageFormatClass = new ClassAttributor('imagestyle', 'ql-resize-style')
 export default class Toolbar extends BaseModule {
   static Icons = {
-    AlignLeft: IconAlignLeft,
-    AlignCenter: IconAlignCenter,
-    AlignRight: IconAlignRight,
-    FloatFull: IconFloatFull,
-    Edit: IconPencil
+    left: IconAlignLeft,
+    center: IconAlignCenter,
+    right: IconAlignRight,
+    full: IconFloatFull,
+    edit: IconPencil
+  }
+  static Tools = {
+    left: {
+      apply (activeEle) {
+        ImageFormatClass.add(activeEle, 'left')
+      },
+      isApplied (activeEle) {
+        return ImageFormatClass.value(activeEle) === 'left'
+      }
+    },
+    center: {
+      apply (activeEle) {
+        ImageFormatClass.add(activeEle, 'center')
+      },
+      isApplied (activeEle) {
+        return ImageFormatClass.value(activeEle) === 'center'
+      }
+    },
+    right: {
+      apply (activeEle) {
+        ImageFormatClass.add(activeEle, 'right')
+      },
+      isApplied (activeEle) {
+        return ImageFormatClass.value(activeEle) === 'right'
+      }
+    },
+    full: {
+      apply (activeEle) {
+        ImageFormatClass.add(activeEle, 'full')
+      },
+      isApplied (activeEle) {
+        return ImageFormatClass.value(activeEle) === 'full'
+      }
+    },
+    edit: {
+      handler (evt, button, activeEle) {
+        this.quill.emitter.emit('resize-edit', activeEle, this.blot)
+      }
+    }
   }
   onCreate () {
     // Setup Toolbar
     this.toolbar = document.createElement('div')
-    Object.assign(this.toolbar.style, this.options.styles.toolbar)
+    this.toolbar.className = 'ql-resize-toolbar'
     this.overlay.appendChild(this.toolbar)
     // Setup Buttons
-    this._defineAlignments()
     this._addToolbarButtons()
   }
-  _defineAlignments () {
-    const Icons = this.constructor.Icons
-    this.alignments = [
-      {
-        icon: Icons.AlignLeft,
-        apply: () => {
-          ImageFormatClass.add(this.activeEle, 'left')
-        },
-        isApplied: () => ImageFormatClass.value(this.activeEle) === 'left'
-      },
-      {
-        icon: Icons.AlignCenter,
-        apply: () => {
-          ImageFormatClass.add(this.activeEle, 'center')
-        },
-        isApplied: () => ImageFormatClass.value(this.activeEle) === 'center'
-      },
-      {
-        icon: Icons.AlignRight,
-        apply: () => {
-          ImageFormatClass.add(this.activeEle, 'right')
-        },
-        isApplied: () => ImageFormatClass.value(this.activeEle) === 'right'
-      },
-      {
-        icon: Icons.FloatFull,
-        apply: () => {
-          ImageFormatClass.add(this.activeEle, 'full')
-        },
-        isApplied: () => ImageFormatClass.value(this.activeEle) === 'full'
-      }
-    ]
-  }
   _addToolbarButtons () {
     const Icons = this.constructor.Icons
+    const Tools = this.constructor.Tools
     const buttons = []
-    this.alignments.forEach((alignment, idx) => {
-      const button = document.createElement('span')
+    this.options.tools.forEach((t) => {
+      const tool = Tools[t] || t
+      if (tool.verify && tool.verify.call(this, this.activeEle) === false) return
+      const button = document.createElement('button')
       buttons.push(button)
-      button.innerHTML = alignment.icon
-      button.addEventListener('click', () => {
+      button.innerHTML = ((tool.icon || '') + (tool.text || '')) || Icons[t]
+      button.addEventListener('click', (evt) => {
+        if (tool.handler && tool.handler.call(this, evt, button, this.activeEle) !== true) return
         // deselect all buttons
-        buttons.forEach(button => (button.style.filter = ''))
-        if (alignment.isApplied()) {
+        buttons.forEach(button => (button.classList.remove('active')))
+        if (tool.isApplied && tool.isApplied.call(this, this.activeEle)) {
           // If applied, unapply
           ImageFormatClass.remove(this.activeEle)
         } else {
           // otherwise, select button and apply
-          this._selectButton(button)
-          alignment.apply()
+          button.classList.add('active')
+          tool.apply && tool.apply.call(this, this.activeEle)
         }
         // image may change position; redraw drag handles
         this.requestUpdate()
       })
-      Object.assign(button.style, this.options.styles.toolbarButton)
-      if (idx > 0) {
-        button.style.borderLeftWidth = '0'
-      }
-      Object.assign(
-        button.children[0].style,
-        this.options.styles.toolbarButtonSvg
-      )
-      if (alignment.isApplied()) {
+      if (tool.isApplied && tool.isApplied.call(this, this.activeEle)) {
         // select button if previously applied
-        this._selectButton(button)
+        button.classList.add('active')
       }
       this.toolbar.appendChild(button)
     })
-    // Edit button
-    const button = document.createElement('span')
-    button.innerHTML = Icons.Edit
-    Object.assign(button.style, this.options.styles.toolbarButton)
-    button.style.borderLeftWidth = '0'
-    button.addEventListener('click', () => {
-      this.quill.emitter.emit('resize-edit', this.activeEle, this.blot)
-    })
-    this.toolbar.appendChild(button)
-  }
-  _selectButton (button) {
-    button.style.filter = 'invert(20%)'
   }
 }

package/src/assets/resize.css DELETED Viewed

@@ -1,15 +0,0 @@
-.ql-resize-style-left {
-    float: left;
-    margin: 0 1em 1em 0;
-}
-.ql-resize-style-center {
-    display: block;
-    margin: auto;
-}
-.ql-resize-style-right {
-    float: right;
-    margin: 0 0 1em 1em;
-}
-.ql-resize-style-full {
-    width: 100% !important;
-}