quill-resize-module 2.1.1 → 2.1.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.
- package/demo/index.ts +1 -1
- package/dist/QuillResize.d.ts +1 -0
- package/dist/QuillResize.d.ts.map +1 -1
- package/dist/resize.css +0 -4
- package/dist/resize.esm.js +25 -14
- package/dist/resize.js +2 -2
- package/package.json +1 -1
- package/src/QuillResize.ts +1 -0
- package/src/modules/Resize.ts +7 -7
- package/src/types.d.ts +3 -0
package/demo/index.ts
CHANGED
|
@@ -66,7 +66,7 @@ const demoEditor = new Quill('#editor', {
|
|
|
66
66
|
})
|
|
67
67
|
|
|
68
68
|
const $result = document.querySelector('#result') as HTMLTextAreaElement
|
|
69
|
-
$result.value = `Quill V${Quill.version}`
|
|
69
|
+
$result.value = `Quill V${Quill.version}\nResize Module V${Resize.version}\n`
|
|
70
70
|
document.querySelector('.btn-html')!.addEventListener('click', function () {
|
|
71
71
|
$result.value = demoEditor.root.innerHTML
|
|
72
72
|
})
|
package/dist/QuillResize.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuillResize.d.ts","sourceRoot":"","sources":["../src/QuillResize.ts"],"names":[],"mappings":"AAAA,OAAuB,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACrE,OAAO,IAAI,MAAM,sBAAsB,CAAA;AACvC,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,OAAO,MAAM,mBAAmB,CAAA;AACvC,OAAO,MAAM,MAAM,kBAAkB,CAAA;AACrC,OAAO,QAAQ,MAAM,oBAAoB,CAAA;AAEzC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,WAAW;IAC9B,MAAM,CAAC,OAAO;;;;;;MAAmD;
|
|
1
|
+
{"version":3,"file":"QuillResize.d.ts","sourceRoot":"","sources":["../src/QuillResize.ts"],"names":[],"mappings":"AAAA,OAAuB,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACrE,OAAO,IAAI,MAAM,sBAAsB,CAAA;AACvC,OAAO,WAAW,MAAM,uBAAuB,CAAA;AAC/C,OAAO,OAAO,MAAM,mBAAmB,CAAA;AACvC,OAAO,MAAM,MAAM,kBAAkB,CAAA;AACrC,OAAO,QAAQ,MAAM,oBAAoB,CAAA;AAEzC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,WAAW;IAC9B,MAAM,CAAC,OAAO;;;;;;MAAmD;IACjE,MAAM,CAAC,OAAO,SAAc;IAE5B,KAAK,EAAE,KAAK,CAAA;IACZ,OAAO,EAAE,kBAAkB,CAAA;IAC3B,aAAa,EAAE,GAAG,EAAE,CAAA;IACpB,OAAO,EAAE,GAAG,EAAE,CAAK;IACnB,aAAa,EAAE,GAAG,EAAE,CAAK;IACzB,SAAS,CAAC,EAAE,WAAW,CAAA;IACvB,IAAI,CAAC,EAAE,GAAG,CAAA;IACV,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,SAAS,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAA;IAChC,0BAA0B,CAAC,EAAE,MAAM,IAAI,CAAA;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAA;gBAEb,KAAK,EAAE,KAAK,EAAE,OAAO,GAAE,kBAAuB;IAqD3D,iBAAiB,IAAK,IAAI;IAc1B,eAAe,IAAK,IAAI;IAYxB,QAAQ,CAAE,UAAU,CAAC,EAAE,OAAO,GAAG,IAAI;IAQrC,aAAa,IAAK,IAAI;IAQtB,UAAU,IAAK,IAAI;IAQnB,WAAW,CAAE,GAAG,EAAE,UAAU,GAAG,IAAI;IAgCnC,SAAS,CAAE,IAAI,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,OAAO;IA8BpD,YAAY,CAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAU9D,IAAI,IAAK,IAAI;IAOb,WAAW,IAAK,IAAI;IA+BpB,WAAW,IAAK,IAAI;IAiBpB,kBAAkB,IAAK,IAAI;IAmB3B,qBAAqB,IAAK,IAAI;IAI9B,qBAAqB,CAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAiBxC,wBAAwB,CAAE,WAAW,GAAE,GAAG,GAAG,GAAG,EAAO,GAAG,IAAI;IAU9D,IAAI,IAAK,IAAI;IASb,aAAa,CAAE,KAAK,EAAE,MAAM,GAAG,IAAI;CAYpC"}
|
package/dist/resize.css
CHANGED
|
@@ -1,5 +1 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Quill Resize Module v2.1.1
|
|
3
|
-
* https://github.com/mudoo/quill-resize-module
|
|
4
|
-
*/
|
|
5
1
|
.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:nesw-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;text-align:center}.ql-resize-style-right{float:right;margin:0 0 1em 1em}.ql-resize-style-full{width:100% !important}.ql-resize-style-full>*{width:100%}
|
package/dist/resize.esm.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* Quill Resize Module v2.1.
|
|
2
|
+
* Quill Resize Module v2.1.3
|
|
3
3
|
* https://github.com/mudoo/quill-resize-module
|
|
4
4
|
*/
|
|
5
|
-
import
|
|
5
|
+
import * as __WEBPACK_EXTERNAL_MODULE_quill__ from "quill";
|
|
6
6
|
/******/ // The require scope
|
|
7
7
|
/******/ var __webpack_require__ = {};
|
|
8
8
|
/******/
|
|
@@ -27,6 +27,11 @@ import { default as __WEBPACK_EXTERNAL_MODULE_quill_default__ } from "quill";
|
|
|
27
27
|
/************************************************************************/
|
|
28
28
|
var __webpack_exports__ = {};
|
|
29
29
|
|
|
30
|
+
// EXPORTS
|
|
31
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
32
|
+
A: () => (/* binding */ src)
|
|
33
|
+
});
|
|
34
|
+
|
|
30
35
|
;// ./src/DefaultOptions.ts
|
|
31
36
|
const defaultOptions = {
|
|
32
37
|
modules: ['DisplaySize', 'Toolbar', 'Resize', 'Keyboard'],
|
|
@@ -151,14 +156,18 @@ class DisplaySize extends BaseModule {
|
|
|
151
156
|
}
|
|
152
157
|
|
|
153
158
|
;// external "quill"
|
|
154
|
-
|
|
155
|
-
|
|
159
|
+
var x = (y) => {
|
|
160
|
+
var x = {}; __webpack_require__.d(x, y); return x
|
|
161
|
+
}
|
|
162
|
+
var y = (x) => (() => (x))
|
|
163
|
+
const external_quill_namespaceObject = x({ ["default"]: () => (__WEBPACK_EXTERNAL_MODULE_quill__["default"]) });
|
|
164
|
+
;// ./node_modules/quill/assets/icons/float-left.svg?raw
|
|
156
165
|
const float_leftraw_namespaceObject = "<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>";
|
|
157
|
-
;// ./node_modules
|
|
166
|
+
;// ./node_modules/quill/assets/icons/float-center.svg?raw
|
|
158
167
|
const float_centerraw_namespaceObject = "<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>";
|
|
159
|
-
;// ./node_modules
|
|
168
|
+
;// ./node_modules/quill/assets/icons/float-right.svg?raw
|
|
160
169
|
const float_rightraw_namespaceObject = "<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>";
|
|
161
|
-
;// ./node_modules
|
|
170
|
+
;// ./node_modules/quill/assets/icons/float-full.svg?raw
|
|
162
171
|
const float_fullraw_namespaceObject = "<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>";
|
|
163
172
|
;// ./src/assets/pencil.svg?raw
|
|
164
173
|
const pencilraw_namespaceObject = "<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";
|
|
@@ -170,7 +179,7 @@ const pencilraw_namespaceObject = "<svg viewBox=\"0 0 18 18\">\n <path class=\"
|
|
|
170
179
|
|
|
171
180
|
|
|
172
181
|
|
|
173
|
-
const _Quill = window.Quill ||
|
|
182
|
+
const _Quill = window.Quill || external_quill_namespaceObject["default"];
|
|
174
183
|
const Parchment = _Quill.import('parchment');
|
|
175
184
|
const ALIGNMENT_CLASSES = {
|
|
176
185
|
LEFT: 'left',
|
|
@@ -349,7 +358,7 @@ class Resize extends BaseModule {
|
|
|
349
358
|
// note which box
|
|
350
359
|
this.dragBox = evt.target;
|
|
351
360
|
// note starting mousedown position
|
|
352
|
-
if (evt instanceof TouchEvent) {
|
|
361
|
+
if (window.TouchEvent && evt instanceof TouchEvent) {
|
|
353
362
|
this.dragStartX = evt.changedTouches[0].clientX;
|
|
354
363
|
this.dragStartY = evt.changedTouches[0].clientY;
|
|
355
364
|
}
|
|
@@ -398,7 +407,7 @@ class Resize extends BaseModule {
|
|
|
398
407
|
// activeEle not set yet
|
|
399
408
|
return;
|
|
400
409
|
}
|
|
401
|
-
if (evt instanceof TouchEvent && evt.cancelable) {
|
|
410
|
+
if (window.TouchEvent && evt instanceof TouchEvent && evt.cancelable) {
|
|
402
411
|
evt.preventDefault();
|
|
403
412
|
}
|
|
404
413
|
const limit = Object.assign(Object.assign({}, this.blotOptions.limit), { unit: true });
|
|
@@ -407,7 +416,7 @@ class Resize extends BaseModule {
|
|
|
407
416
|
}
|
|
408
417
|
calcSize(evt, limit = {}) {
|
|
409
418
|
let clientX, clientY;
|
|
410
|
-
if (evt instanceof TouchEvent) {
|
|
419
|
+
if (window.TouchEvent && evt instanceof TouchEvent) {
|
|
411
420
|
clientX = evt.changedTouches[0].clientX;
|
|
412
421
|
clientY = evt.changedTouches[0].clientY;
|
|
413
422
|
}
|
|
@@ -509,7 +518,7 @@ class Resize extends BaseModule {
|
|
|
509
518
|
;// ./src/modules/Keyboard.ts
|
|
510
519
|
|
|
511
520
|
|
|
512
|
-
const Keyboard_Quill = window.Quill ||
|
|
521
|
+
const Keyboard_Quill = window.Quill || external_quill_namespaceObject["default"];
|
|
513
522
|
const Keyboard_Parchment = Keyboard_Quill.import('parchment');
|
|
514
523
|
const keyCodes = {
|
|
515
524
|
BACKSPACE: 8,
|
|
@@ -680,7 +689,7 @@ function randomString(length = 8) {
|
|
|
680
689
|
|
|
681
690
|
|
|
682
691
|
|
|
683
|
-
const QuillResize_Quill = window.Quill ||
|
|
692
|
+
const QuillResize_Quill = window.Quill || external_quill_namespaceObject["default"];
|
|
684
693
|
const QuillResize_Parchment = QuillResize_Quill.import('parchment');
|
|
685
694
|
/**
|
|
686
695
|
* Custom module for quilljs to allow user to resize elements
|
|
@@ -947,6 +956,7 @@ class QuillResize {
|
|
|
947
956
|
}
|
|
948
957
|
}
|
|
949
958
|
QuillResize.Modules = { Base: BaseModule, DisplaySize: DisplaySize, Toolbar: modules_Toolbar, Resize: Resize, Keyboard: Keyboard };
|
|
959
|
+
QuillResize.version = "2.1.3";
|
|
950
960
|
/* harmony default export */ const src_QuillResize = (QuillResize);
|
|
951
961
|
if (window.Quill) {
|
|
952
962
|
window.Quill.register('modules/resize', QuillResize);
|
|
@@ -958,4 +968,5 @@ if (window.Quill) {
|
|
|
958
968
|
|
|
959
969
|
/* harmony default export */ const src = (src_QuillResize);
|
|
960
970
|
|
|
961
|
-
|
|
971
|
+
var __webpack_exports__default = __webpack_exports__.A;
|
|
972
|
+
export { __webpack_exports__default as default };
|
package/dist/resize.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* Quill Resize Module v2.1.
|
|
2
|
+
* Quill Resize Module v2.1.3
|
|
3
3
|
* https://github.com/mudoo/quill-resize-module
|
|
4
4
|
*/
|
|
5
|
-
!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)}(this,(t=>(()=>{"use strict";var e={912(e){e.exports=t}},i={};function s(t){var l=i[t];if(void 0!==l)return l.exports;var o=i[t]={exports:{}};return e[t](o,o.exports,s),o.exports}s.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return s.d(e,{a:e}),e},s.d=(t,e)=>{for(var i in e)s.o(e,i)&&!s.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},s.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),s.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var l={};s.r(l),s.d(l,{default:()=>S});const o={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}}}};class a{constructor(t){this.resizer=t,this.quill=t.quill,this.overlay=t.overlay,this.activeEle=t.activeEle,this.blot=t.blot,this.options=t.options,this.requestUpdate=()=>{t.onUpdate(!0)}}onCreate(){}onDestroy(){}onUpdate(){}}var h=s(912),n=s.n(h);const r=window.Quill||n(),d=r.import("parchment"),c={LEFT:"left",RIGHT:"right",CENTER:"center",FULL:"full"},u=d.ClassAttributor?d.ClassAttributor:d.Attributor.Class,p="resize-inline",m=new u(p,"ql-resize-style",{scope:d.Scope.INLINE,whitelist:Object.values(c)}),v="resize-block",g=new u(v,"ql-resize-style",{scope:d.Scope.BLOCK,whitelist:Object.values(c)});r.register(m,!0),r.register(g,!0);class f extends a{onCreate(){this.toolbar=document.createElement("div"),this.toolbar.className="ql-resize-toolbar",this.overlay.appendChild(this.toolbar),this._addToolbarButtons()}_addToolbarButtons(){const t=this.constructor.Icons,e=this.constructor.Tools,i=[];this.options.tools.forEach((s=>{const l="string"==typeof s?e[s]:s;if(l.verify&&!1===l.verify.call(this,this.activeEle,this.blot))return;const o=document.createElement("button");o.type="button",i.push(o),o.innerHTML=(l.icon||"")+(l.text||"")||("string"==typeof s?t[s]:""),"string"==typeof s&&(o.className=`ql-resize-toolbar-${s}`),l.attrs&&Object.keys(l.attrs).forEach((t=>{o.setAttribute(t,l.attrs[t])})),o.addEventListener("click",(t=>{l.handler&&!0!==l.handler.call(this,t,o,this.activeEle,this.blot)||(i.forEach((t=>t.classList.remove("active"))),l.isApplied&&l.isApplied.call(this,this.activeEle,this.blot)?this._applyToolFormatting(""):(o.classList.add("active"),l.toolClass&&this._applyToolFormatting(l.toolClass)),this.requestUpdate())})),l.isApplied&&l.isApplied.call(this,this.activeEle,this.blot)&&o.classList.add("active"),this.toolbar.appendChild(o)}))}_getFormatValue(t,e){if(e.statics.scope===d.Scope.INLINE_BLOT){const t=this.quill.getIndex(e);return this.quill.getFormat(t,1)[p]||""}return e.statics.scope===d.Scope.BLOCK_BLOT&&g.value(t)||""}_applyToolFormatting(t){const e=this.quill.getIndex(this.blot);this.blot.statics.scope===d.Scope.INLINE_BLOT?this.quill.formatText(e,1,p,t):this.blot.statics.scope===d.Scope.BLOCK_BLOT&&this.quill.formatLine(e,1,v,t)}}f.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'},f.Tools={left:{toolClass:c.LEFT,isApplied(t,e){return this._getFormatValue(t,e)===c.LEFT}},center:{toolClass:c.CENTER,isApplied(t,e){return this._getFormatValue(t,e)===c.CENTER}},right:{toolClass:c.RIGHT,isApplied(t,e){return this._getFormatValue(t,e)===c.RIGHT}},full:{toolClass:c.FULL,isApplied(t,e){return this._getFormatValue(t,e)===c.FULL}},edit:{handler(t,e,i,s){this.quill.emitter.emit("resize-edit",i,s)}}};const y=f;const b=window.Quill||n(),E=b.import("parchment"),x={BACKSPACE:8,TAB:9,ENTER:13,ESCAPE:27,LEFT:37,UP:38,RIGHT:39,DOWN:40,DELETE:46};class L extends a{static injectInit(t){const 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))}static makeArrowHandler(t,e){const i=t===L.keys.LEFT?"prefix":"suffix";return{key:t,shiftKey:e,altKey:null,[i]:/^$/,handler:function(e){if(!this.quill.resizer)return!0;let i=e.index;const s=t===L.keys.LEFT,l=t===L.keys.RIGHT,[o]=this.quill.getLine(i+(s?-1:0));if(this.quill.resizer.judgeShow(o))return!1;const a=this.quill.getIndex(o);if(l&&a+o.length()-1===i)return!0;l&&(i+=e.length+1);let[h]=this.quill.getLeaf(i);const n=h.offset(h.parent),r=h.constructor.scope===E.Scope.BLOCK_BLOT;return!(!s||!(r&&i===n||0===i||i===a))||(s&&0===n&&(i-=1,h=this.quill.getLeaf(i)[0]),!this.quill.resizer.judgeShow(h))}}}onCreate(){this.options.keyboardSelect&&L.injectInit(this.quill),this.keyboardProxy=t=>this.keyboardHandle(t),document.addEventListener("keydown",this.keyboardProxy,!0)}onDestroy(){document.removeEventListener("keydown",this.keyboardProxy,!0)}keyboardHandle(t){if(t.defaultPrevented)return;if(t.shiftKey||t.ctrlKey||t.altKey)return;if(!this.activeEle||t.fromResize||t.ctrlKey)return;const e=t.keyCode;let i,s=this.blot.offset(this.quill.scroll),l=!1;e===x.BACKSPACE||e===x.DELETE?(this.blot.deleteAt(0),this.blot.parent.optimize(),l=!0):e>=x.LEFT&&e<=x.DOWN&&(e===x.RIGHT?s+=this.blot.length()||1:e===x.UP?(s=this.getOtherLineIndex(-1),i=this.quill.getLeaf(s)[0]):e===x.DOWN&&(s=this.getOtherLineIndex(1),i=this.quill.getLeaf(s)[0]),l=!0),l&&(t.stopPropagation(),t.preventDefault()),i&&this.resizer.judgeShow(i,i.domNode)||(this.quill.setSelection(s),this.resizer.hide())}getOtherLineIndex(t){let e=this.blot.offset(this.quill.scroll);const[i]=this.quill.getLine(e),s=this.blot.offset(i)+1,l=t>0?i.next:i.prev;if(l){let t=l.length();"block"===l.statics.blotName&&t--,e=l.offset(this.quill.scroll)+Math.min(t,s)}return e}dispatchEvent(t){const e=new t.constructor(t);e.fromResize=!0,this.quill.root.dispatchEvent(e)}}/^2\./.test(b.version)?L.keys={BACKSPACE:"Backspace",TAB:"Tab",ENTER:"Enter",ESCAPE:"Escape",LEFT:"ArrowLeft",UP:"ArrowUp",RIGHT:"ArrowRight",DOWN:"ArrowDown",DELETE:"Delete"}:L.keys=x;const q=window.Quill||n(),C=q.import("parchment");class w{constructor(t,e={}){this.modules=[],this.selectedBlots=[],t.resizer=this,this.quill=t;let i=!1;e.modules&&(i=e.modules.slice()),this.options=Object.assign({},o,e),!1!==i&&(this.options.modules=i),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.embedTags&&this.initializeEmbed()}initializeModules(){this.removeModules(),this.modules=this.moduleClasses.map((t=>new(w.Modules[t]||t)(this))),this.modules.forEach((t=>{t.onCreate(this)})),this.onUpdate()}initializeEmbed(){if(!this.options.embedTags.length)return;this.embedClassName=`ql-${function(t=8){const e="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";return Array.from({length:t},(()=>e[Math.floor(62*Math.random())])).join("")}()}`;let t=[""].concat(this.options.embedTags).join(`, .${this.embedClassName} `).slice(2);t+="{pointer-events: none;}";const e=document.createElement("style");e.textContent=t,this.quill.container.appendChild(e),this.quill.root.classList.add(this.embedClassName)}onUpdate(t){this.updateFromModule=t,this.repositionElements(),this.modules.forEach((t=>{t.onUpdate()}))}removeModules(){this.modules.forEach((t=>{t.onDestroy()})),this.modules=[]}handleEdit(){if(!this.blot)return;const t=this.blot.offset(this.quill.scroll);this.hide(),this.quill.focus(),this.quill.setSelection(t,1)}handleClick(t){var e;let i,s=!1,l=t.target;const o=null===(e=this.options.embedTags)||void 0===e?void 0:e.join();if(o){const e=this.quill.root;(l===e||l.querySelectorAll(o).length)&&(e.classList.remove(this.embedClassName),l=document.elementFromPoint(t.clientX,t.clientY),e.classList.add(this.embedClassName))}l&&l.tagName&&(i=q.find(l),i&&(s=this.judgeShow(i,l))),s?t.preventDefault():this.activeEle&&this.hide()}judgeShow(t,e){let i=!1;if(!t)return i;!e&&t.domNode&&(e=t.domNode);const s=this.options.parchment[t.statics.blotName];if(!s)return i;if(this.activeEle===e)return!0;const l=s.limit||{};return(!l.minWidth||l.minWidth&&e.offsetWidth>=l.minWidth)&&(i=!0,this.activeEle&&this.hide(),this.activeEle=e,this.blot=t,this.show()),i}handleChange(t,e,i){this.updateFromModule?this.updateFromModule=!1:"user"===i&&this.overlay&&this.activeEle&&this.onUpdate()}show(){var t;this.showOverlay(),this.initializeModules(),this.options.activeClass&&this.activeEle.classList.add(this.options.activeClass),null===(t=this.options.onActive)||void 0===t||t.call(this,this.blot,this.activeEle)}showOverlay(){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=()=>{this.activeEle&&this.hide()},this.quill.root.addEventListener("input",this.hideProxy,!0),this.updateOverlayPositionProxy=this.updateOverlayPosition.bind(this),this.quill.root.addEventListener("scroll",this.updateOverlayPositionProxy),this.repositionElements()}hideOverlay(){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(""))}repositionElements(){if(!this.overlay||!this.activeEle)return;const t=this.quill.container,e=this.activeEle.getBoundingClientRect(),i=t.getBoundingClientRect();Object.assign(this.overlay.style,{left:`${e.left-i.left-1+t.scrollLeft}px`,top:`${e.top-i.top+this.quill.root.scrollTop}px`,width:`${e.width}px`,height:`${e.height}px`,marginTop:-1*this.quill.root.scrollTop+"px"})}updateOverlayPosition(){this.overlay.style.marginTop=-1*this.quill.root.scrollTop+"px"}addBlotsSelectedClass(t){if(!t)return this.removeBlotsSelectedClass(),void(this.selectedBlots=[]);const e=C.Leaf||C.LeafBlot,i=this.quill.scroll.descendants(e,t.index,t.length).filter((t=>{const e=!!this.options.parchment[t.statics.blotName];return e&&t.domNode.classList.add(this.options.selectedClass),e}));this.removeBlotsSelectedClass(i),this.selectedBlots=i}removeBlotsSelectedClass(t=[]){Array.isArray(t)||(t=[t]),this.selectedBlots.forEach((e=>{-1===t.indexOf(e)&&e.domNode.classList.remove(this.options.selectedClass)}))}hide(){var t;this.hideOverlay(),this.removeModules(),this.activeEle&&this.options.activeClass&&this.activeEle.classList.remove(this.options.activeClass),null===(t=this.options.onInactive)||void 0===t||t.call(this,this.blot,this.activeEle),this.activeEle=void 0,this.blot=void 0}setUserSelect(t){["userSelect","mozUserSelect","webkitUserSelect","msUserSelect"].forEach((e=>{this.quill.root.style[e]=t,document.documentElement.style[e]=t}))}}w.Modules={Base:a,DisplaySize:class extends a{constructor(){super(...arguments),this.display=null}onCreate(){this.display=document.createElement("div"),this.display.className="ql-resize-display",this.overlay.appendChild(this.display)}onUpdate(){if(!this.display||!this.activeEle)return;const t=this.getCurrentSize();if(this.display.innerHTML=t.join(" × "),t[0]>120&&t[1]>30)Object.assign(this.display.style,{right:"4px",bottom:"4px",left:"auto"});else if("right"===this.activeEle.style.float){const t=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"auto",bottom:`-${t.height+4}px`,left:`-${t.width+4}px`})}else{const t=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:`-${t.width+4}px`,bottom:`-${t.height+4}px`,left:"auto"})}}getCurrentSize(){return[this.activeEle.offsetWidth,this.activeEle.offsetHeight]}},Toolbar:y,Resize:class extends a{constructor(){super(...arguments),this.boxes=[]}onCreate(){this.blotOptions=this.options.parchment[this.blot.statics.blotName],this.boxes=[],this.addBox("tl"),this.addBox("tr"),this.addBox("br"),this.addBox("bl")}onDestroy(){this.setCursor("")}addBox(t){const e=document.createElement("div");e.className=`ql-resize-handle ${t}`,e.addEventListener("mousedown",this.handleMousedown.bind(this),!1),e.addEventListener("touchstart",this.handleMousedown.bind(this),{passive:!1}),this.overlay.appendChild(e),this.boxes.push(e)}handleMousedown(t){this.dragBox=t.target,t instanceof TouchEvent?(this.dragStartX=t.changedTouches[0].clientX,this.dragStartY=t.changedTouches[0].clientY):(this.dragStartX=t.clientX,this.dragStartY=t.clientY),this.preDragSize={width:this.activeEle.offsetWidth,height:this.activeEle.offsetHeight},this.naturalSize=this.getNaturalSize();const e=window.getComputedStyle(this.dragBox).cursor;this.setCursor(e),this.handleDragProxy=t=>this.handleDrag(t),this.handleMouseupProxy=t=>this.handleMouseup(t),document.addEventListener("mousemove",this.handleDragProxy),document.addEventListener("touchmove",this.handleDragProxy,{passive:!1}),document.addEventListener("mouseup",this.handleMouseupProxy,!0),document.addEventListener("touchend",this.handleMouseupProxy,!0),document.addEventListener("touchcancel",this.handleMouseupProxy,!0)}handleMouseup(t){var e;t.stopPropagation();const i=this.calcSize(t,this.blotOptions.limit);Object.assign(this.activeEle,i),Object.assign(this.activeEle.style,{width:null,height:null}),null===(e=this.options.onChangeSize)||void 0===e||e.call(this,this.blot,this.activeEle,i),this.setCursor(""),document.removeEventListener("mousemove",this.handleDragProxy),document.removeEventListener("touchmove",this.handleDragProxy),document.removeEventListener("mouseup",this.handleMouseupProxy,!0),document.removeEventListener("touchend",this.handleMouseupProxy,!0),document.removeEventListener("touchcancel",this.handleMouseupProxy,!0)}handleDrag(t){if(!this.activeEle||!this.blot)return;t instanceof TouchEvent&&t.cancelable&&t.preventDefault();const e=Object.assign(Object.assign({},this.blotOptions.limit),{unit:!0});Object.assign(this.activeEle.style,this.calcSize(t,e)),this.requestUpdate()}calcSize(t,e={}){let i,s;t instanceof TouchEvent?(i=t.changedTouches[0].clientX,s=t.changedTouches[0].clientY):(i=t.clientX,s=t.clientY);const l=i-this.dragStartX,o=s-this.dragStartY,a={};let h=1;(this.blotOptions.attribute||["width"]).forEach((t=>{a[t]=this.preDragSize[t]})),this.dragBox!==this.boxes[0]&&this.dragBox!==this.boxes[3]||(h=-1),void 0!==a.width&&(a.width=Math.round(this.preDragSize.width+l*h)),void 0!==a.height&&(a.height=Math.round(this.preDragSize.height+o*h));let{width:n,height:r}=a;if(e.ratio){let t;e.minWidth&&(n=Math.max(e.minWidth,n)),e.maxWidth&&(n=Math.min(e.maxWidth,n)),r=n*e.ratio,e.minHeight&&r<e.minHeight&&(t=!0,r=e.minHeight),e.maxHeight&&r>e.maxHeight&&(t=!0,r=e.maxHeight),t&&(n=r/e.ratio)}else void 0!==a.width&&(e.minWidth&&(n=Math.max(e.minWidth,n)),e.maxWidth&&(n=Math.min(e.maxWidth,n))),void 0!==a.height&&(e.minHeight&&(r=Math.max(e.minHeight,r)),e.maxHeight&&(r=Math.min(e.maxHeight,r)));e.unit&&(n&&(n+="px"),r&&(r+="px"));const d={};return n&&(d.width=n),r&&(d.height=r),d}getNaturalSize(){const t=this.activeEle;let e=[0,0];if(t.getAttribute("data-size")){const i=t.getAttribute("data-size").split(",");e=[parseInt(i[0]),parseInt(i[1])]}else e=[t.naturalWidth||t.offsetWidth,t.naturalHeight||t.offsetHeight],t.setAttribute("data-size",e[0]+","+e[1]);return{width:e[0],height:e[1]}}setCursor(t){[document.body,this.activeEle].forEach((e=>{e.style.cursor=`${t} !important`}))}},Keyboard:L};const T=w;window.Quill&&window.Quill.register("modules/resize",w);const S=T;return l})()));
|
|
5
|
+
!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)}(this,(t=>(()=>{"use strict";var e={912:e=>{e.exports=t}},i={};function s(t){var l=i[t];if(void 0!==l)return l.exports;var o=i[t]={exports:{}};return e[t](o,o.exports,s),o.exports}s.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return s.d(e,{a:e}),e},s.d=(t,e)=>{for(var i in e)s.o(e,i)&&!s.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},s.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),s.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var l={};s.r(l),s.d(l,{default:()=>S});const o={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}}}};class a{constructor(t){this.resizer=t,this.quill=t.quill,this.overlay=t.overlay,this.activeEle=t.activeEle,this.blot=t.blot,this.options=t.options,this.requestUpdate=()=>{t.onUpdate(!0)}}onCreate(){}onDestroy(){}onUpdate(){}}var n=s(912),h=s.n(n);const r=window.Quill||h(),d=r.import("parchment"),c={LEFT:"left",RIGHT:"right",CENTER:"center",FULL:"full"},u=d.ClassAttributor?d.ClassAttributor:d.Attributor.Class,p="resize-inline",m=new u(p,"ql-resize-style",{scope:d.Scope.INLINE,whitelist:Object.values(c)}),v="resize-block",g=new u(v,"ql-resize-style",{scope:d.Scope.BLOCK,whitelist:Object.values(c)});r.register(m,!0),r.register(g,!0);class f extends a{onCreate(){this.toolbar=document.createElement("div"),this.toolbar.className="ql-resize-toolbar",this.overlay.appendChild(this.toolbar),this._addToolbarButtons()}_addToolbarButtons(){const t=this.constructor.Icons,e=this.constructor.Tools,i=[];this.options.tools.forEach((s=>{const l="string"==typeof s?e[s]:s;if(l.verify&&!1===l.verify.call(this,this.activeEle,this.blot))return;const o=document.createElement("button");o.type="button",i.push(o),o.innerHTML=(l.icon||"")+(l.text||"")||("string"==typeof s?t[s]:""),"string"==typeof s&&(o.className=`ql-resize-toolbar-${s}`),l.attrs&&Object.keys(l.attrs).forEach((t=>{o.setAttribute(t,l.attrs[t])})),o.addEventListener("click",(t=>{l.handler&&!0!==l.handler.call(this,t,o,this.activeEle,this.blot)||(i.forEach((t=>t.classList.remove("active"))),l.isApplied&&l.isApplied.call(this,this.activeEle,this.blot)?this._applyToolFormatting(""):(o.classList.add("active"),l.toolClass&&this._applyToolFormatting(l.toolClass)),this.requestUpdate())})),l.isApplied&&l.isApplied.call(this,this.activeEle,this.blot)&&o.classList.add("active"),this.toolbar.appendChild(o)}))}_getFormatValue(t,e){if(e.statics.scope===d.Scope.INLINE_BLOT){const t=this.quill.getIndex(e);return this.quill.getFormat(t,1)[p]||""}return e.statics.scope===d.Scope.BLOCK_BLOT&&g.value(t)||""}_applyToolFormatting(t){const e=this.quill.getIndex(this.blot);this.blot.statics.scope===d.Scope.INLINE_BLOT?this.quill.formatText(e,1,p,t):this.blot.statics.scope===d.Scope.BLOCK_BLOT&&this.quill.formatLine(e,1,v,t)}}f.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'},f.Tools={left:{toolClass:c.LEFT,isApplied(t,e){return this._getFormatValue(t,e)===c.LEFT}},center:{toolClass:c.CENTER,isApplied(t,e){return this._getFormatValue(t,e)===c.CENTER}},right:{toolClass:c.RIGHT,isApplied(t,e){return this._getFormatValue(t,e)===c.RIGHT}},full:{toolClass:c.FULL,isApplied(t,e){return this._getFormatValue(t,e)===c.FULL}},edit:{handler(t,e,i,s){this.quill.emitter.emit("resize-edit",i,s)}}};const y=f;const b=window.Quill||h(),E=b.import("parchment"),x={BACKSPACE:8,TAB:9,ENTER:13,ESCAPE:27,LEFT:37,UP:38,RIGHT:39,DOWN:40,DELETE:46};class L extends a{static injectInit(t){const 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))}static makeArrowHandler(t,e){const i=t===L.keys.LEFT?"prefix":"suffix";return{key:t,shiftKey:e,altKey:null,[i]:/^$/,handler:function(e){if(!this.quill.resizer)return!0;let i=e.index;const s=t===L.keys.LEFT,l=t===L.keys.RIGHT,[o]=this.quill.getLine(i+(s?-1:0));if(this.quill.resizer.judgeShow(o))return!1;const a=this.quill.getIndex(o);if(l&&a+o.length()-1===i)return!0;l&&(i+=e.length+1);let[n]=this.quill.getLeaf(i);const h=n.offset(n.parent),r=n.constructor.scope===E.Scope.BLOCK_BLOT;return!(!s||!(r&&i===h||0===i||i===a))||(s&&0===h&&(i-=1,n=this.quill.getLeaf(i)[0]),!this.quill.resizer.judgeShow(n))}}}onCreate(){this.options.keyboardSelect&&L.injectInit(this.quill),this.keyboardProxy=t=>this.keyboardHandle(t),document.addEventListener("keydown",this.keyboardProxy,!0)}onDestroy(){document.removeEventListener("keydown",this.keyboardProxy,!0)}keyboardHandle(t){if(t.defaultPrevented)return;if(t.shiftKey||t.ctrlKey||t.altKey)return;if(!this.activeEle||t.fromResize||t.ctrlKey)return;const e=t.keyCode;let i,s=this.blot.offset(this.quill.scroll),l=!1;e===x.BACKSPACE||e===x.DELETE?(this.blot.deleteAt(0),this.blot.parent.optimize(),l=!0):e>=x.LEFT&&e<=x.DOWN&&(e===x.RIGHT?s+=this.blot.length()||1:e===x.UP?(s=this.getOtherLineIndex(-1),i=this.quill.getLeaf(s)[0]):e===x.DOWN&&(s=this.getOtherLineIndex(1),i=this.quill.getLeaf(s)[0]),l=!0),l&&(t.stopPropagation(),t.preventDefault()),i&&this.resizer.judgeShow(i,i.domNode)||(this.quill.setSelection(s),this.resizer.hide())}getOtherLineIndex(t){let e=this.blot.offset(this.quill.scroll);const[i]=this.quill.getLine(e),s=this.blot.offset(i)+1,l=t>0?i.next:i.prev;if(l){let t=l.length();"block"===l.statics.blotName&&t--,e=l.offset(this.quill.scroll)+Math.min(t,s)}return e}dispatchEvent(t){const e=new t.constructor(t);e.fromResize=!0,this.quill.root.dispatchEvent(e)}}/^2\./.test(b.version)?L.keys={BACKSPACE:"Backspace",TAB:"Tab",ENTER:"Enter",ESCAPE:"Escape",LEFT:"ArrowLeft",UP:"ArrowUp",RIGHT:"ArrowRight",DOWN:"ArrowDown",DELETE:"Delete"}:L.keys=x;const q=window.Quill||h(),C=q.import("parchment");class w{constructor(t,e={}){this.modules=[],this.selectedBlots=[],t.resizer=this,this.quill=t;let i=!1;e.modules&&(i=e.modules.slice()),this.options=Object.assign({},o,e),!1!==i&&(this.options.modules=i),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.embedTags&&this.initializeEmbed()}initializeModules(){this.removeModules(),this.modules=this.moduleClasses.map((t=>new(w.Modules[t]||t)(this))),this.modules.forEach((t=>{t.onCreate(this)})),this.onUpdate()}initializeEmbed(){if(!this.options.embedTags.length)return;this.embedClassName=`ql-${function(t=8){const e="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";return Array.from({length:t},(()=>e[Math.floor(62*Math.random())])).join("")}()}`;let t=[""].concat(this.options.embedTags).join(`, .${this.embedClassName} `).slice(2);t+="{pointer-events: none;}";const e=document.createElement("style");e.textContent=t,this.quill.container.appendChild(e),this.quill.root.classList.add(this.embedClassName)}onUpdate(t){this.updateFromModule=t,this.repositionElements(),this.modules.forEach((t=>{t.onUpdate()}))}removeModules(){this.modules.forEach((t=>{t.onDestroy()})),this.modules=[]}handleEdit(){if(!this.blot)return;const t=this.blot.offset(this.quill.scroll);this.hide(),this.quill.focus(),this.quill.setSelection(t,1)}handleClick(t){var e;let i,s=!1,l=t.target;const o=null===(e=this.options.embedTags)||void 0===e?void 0:e.join();if(o){const e=this.quill.root;(l===e||l.querySelectorAll(o).length)&&(e.classList.remove(this.embedClassName),l=document.elementFromPoint(t.clientX,t.clientY),e.classList.add(this.embedClassName))}l&&l.tagName&&(i=q.find(l),i&&(s=this.judgeShow(i,l))),s?t.preventDefault():this.activeEle&&this.hide()}judgeShow(t,e){let i=!1;if(!t)return i;!e&&t.domNode&&(e=t.domNode);const s=this.options.parchment[t.statics.blotName];if(!s)return i;if(this.activeEle===e)return!0;const l=s.limit||{};return(!l.minWidth||l.minWidth&&e.offsetWidth>=l.minWidth)&&(i=!0,this.activeEle&&this.hide(),this.activeEle=e,this.blot=t,this.show()),i}handleChange(t,e,i){this.updateFromModule?this.updateFromModule=!1:"user"===i&&this.overlay&&this.activeEle&&this.onUpdate()}show(){var t;this.showOverlay(),this.initializeModules(),this.options.activeClass&&this.activeEle.classList.add(this.options.activeClass),null===(t=this.options.onActive)||void 0===t||t.call(this,this.blot,this.activeEle)}showOverlay(){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=()=>{this.activeEle&&this.hide()},this.quill.root.addEventListener("input",this.hideProxy,!0),this.updateOverlayPositionProxy=this.updateOverlayPosition.bind(this),this.quill.root.addEventListener("scroll",this.updateOverlayPositionProxy),this.repositionElements()}hideOverlay(){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(""))}repositionElements(){if(!this.overlay||!this.activeEle)return;const t=this.quill.container,e=this.activeEle.getBoundingClientRect(),i=t.getBoundingClientRect();Object.assign(this.overlay.style,{left:`${e.left-i.left-1+t.scrollLeft}px`,top:`${e.top-i.top+this.quill.root.scrollTop}px`,width:`${e.width}px`,height:`${e.height}px`,marginTop:-1*this.quill.root.scrollTop+"px"})}updateOverlayPosition(){this.overlay.style.marginTop=-1*this.quill.root.scrollTop+"px"}addBlotsSelectedClass(t){if(!t)return this.removeBlotsSelectedClass(),void(this.selectedBlots=[]);const e=C.Leaf||C.LeafBlot,i=this.quill.scroll.descendants(e,t.index,t.length).filter((t=>{const e=!!this.options.parchment[t.statics.blotName];return e&&t.domNode.classList.add(this.options.selectedClass),e}));this.removeBlotsSelectedClass(i),this.selectedBlots=i}removeBlotsSelectedClass(t=[]){Array.isArray(t)||(t=[t]),this.selectedBlots.forEach((e=>{-1===t.indexOf(e)&&e.domNode.classList.remove(this.options.selectedClass)}))}hide(){var t;this.hideOverlay(),this.removeModules(),this.activeEle&&this.options.activeClass&&this.activeEle.classList.remove(this.options.activeClass),null===(t=this.options.onInactive)||void 0===t||t.call(this,this.blot,this.activeEle),this.activeEle=void 0,this.blot=void 0}setUserSelect(t){["userSelect","mozUserSelect","webkitUserSelect","msUserSelect"].forEach((e=>{this.quill.root.style[e]=t,document.documentElement.style[e]=t}))}}w.Modules={Base:a,DisplaySize:class extends a{constructor(){super(...arguments),this.display=null}onCreate(){this.display=document.createElement("div"),this.display.className="ql-resize-display",this.overlay.appendChild(this.display)}onUpdate(){if(!this.display||!this.activeEle)return;const t=this.getCurrentSize();if(this.display.innerHTML=t.join(" × "),t[0]>120&&t[1]>30)Object.assign(this.display.style,{right:"4px",bottom:"4px",left:"auto"});else if("right"===this.activeEle.style.float){const t=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:"auto",bottom:`-${t.height+4}px`,left:`-${t.width+4}px`})}else{const t=this.display.getBoundingClientRect();Object.assign(this.display.style,{right:`-${t.width+4}px`,bottom:`-${t.height+4}px`,left:"auto"})}}getCurrentSize(){return[this.activeEle.offsetWidth,this.activeEle.offsetHeight]}},Toolbar:y,Resize:class extends a{constructor(){super(...arguments),this.boxes=[]}onCreate(){this.blotOptions=this.options.parchment[this.blot.statics.blotName],this.boxes=[],this.addBox("tl"),this.addBox("tr"),this.addBox("br"),this.addBox("bl")}onDestroy(){this.setCursor("")}addBox(t){const e=document.createElement("div");e.className=`ql-resize-handle ${t}`,e.addEventListener("mousedown",this.handleMousedown.bind(this),!1),e.addEventListener("touchstart",this.handleMousedown.bind(this),{passive:!1}),this.overlay.appendChild(e),this.boxes.push(e)}handleMousedown(t){this.dragBox=t.target,window.TouchEvent&&t instanceof TouchEvent?(this.dragStartX=t.changedTouches[0].clientX,this.dragStartY=t.changedTouches[0].clientY):(this.dragStartX=t.clientX,this.dragStartY=t.clientY),this.preDragSize={width:this.activeEle.offsetWidth,height:this.activeEle.offsetHeight},this.naturalSize=this.getNaturalSize();const e=window.getComputedStyle(this.dragBox).cursor;this.setCursor(e),this.handleDragProxy=t=>this.handleDrag(t),this.handleMouseupProxy=t=>this.handleMouseup(t),document.addEventListener("mousemove",this.handleDragProxy),document.addEventListener("touchmove",this.handleDragProxy,{passive:!1}),document.addEventListener("mouseup",this.handleMouseupProxy,!0),document.addEventListener("touchend",this.handleMouseupProxy,!0),document.addEventListener("touchcancel",this.handleMouseupProxy,!0)}handleMouseup(t){var e;t.stopPropagation();const i=this.calcSize(t,this.blotOptions.limit);Object.assign(this.activeEle,i),Object.assign(this.activeEle.style,{width:null,height:null}),null===(e=this.options.onChangeSize)||void 0===e||e.call(this,this.blot,this.activeEle,i),this.setCursor(""),document.removeEventListener("mousemove",this.handleDragProxy),document.removeEventListener("touchmove",this.handleDragProxy),document.removeEventListener("mouseup",this.handleMouseupProxy,!0),document.removeEventListener("touchend",this.handleMouseupProxy,!0),document.removeEventListener("touchcancel",this.handleMouseupProxy,!0)}handleDrag(t){if(!this.activeEle||!this.blot)return;window.TouchEvent&&t instanceof TouchEvent&&t.cancelable&&t.preventDefault();const e=Object.assign(Object.assign({},this.blotOptions.limit),{unit:!0});Object.assign(this.activeEle.style,this.calcSize(t,e)),this.requestUpdate()}calcSize(t,e={}){let i,s;window.TouchEvent&&t instanceof TouchEvent?(i=t.changedTouches[0].clientX,s=t.changedTouches[0].clientY):(i=t.clientX,s=t.clientY);const l=i-this.dragStartX,o=s-this.dragStartY,a={};let n=1;(this.blotOptions.attribute||["width"]).forEach((t=>{a[t]=this.preDragSize[t]})),this.dragBox!==this.boxes[0]&&this.dragBox!==this.boxes[3]||(n=-1),void 0!==a.width&&(a.width=Math.round(this.preDragSize.width+l*n)),void 0!==a.height&&(a.height=Math.round(this.preDragSize.height+o*n));let{width:h,height:r}=a;if(e.ratio){let t;e.minWidth&&(h=Math.max(e.minWidth,h)),e.maxWidth&&(h=Math.min(e.maxWidth,h)),r=h*e.ratio,e.minHeight&&r<e.minHeight&&(t=!0,r=e.minHeight),e.maxHeight&&r>e.maxHeight&&(t=!0,r=e.maxHeight),t&&(h=r/e.ratio)}else void 0!==a.width&&(e.minWidth&&(h=Math.max(e.minWidth,h)),e.maxWidth&&(h=Math.min(e.maxWidth,h))),void 0!==a.height&&(e.minHeight&&(r=Math.max(e.minHeight,r)),e.maxHeight&&(r=Math.min(e.maxHeight,r)));e.unit&&(h&&(h+="px"),r&&(r+="px"));const d={};return h&&(d.width=h),r&&(d.height=r),d}getNaturalSize(){const t=this.activeEle;let e=[0,0];if(t.getAttribute("data-size")){const i=t.getAttribute("data-size").split(",");e=[parseInt(i[0]),parseInt(i[1])]}else e=[t.naturalWidth||t.offsetWidth,t.naturalHeight||t.offsetHeight],t.setAttribute("data-size",e[0]+","+e[1]);return{width:e[0],height:e[1]}}setCursor(t){[document.body,this.activeEle].forEach((e=>{e.style.cursor=`${t} !important`}))}},Keyboard:L},w.version="2.1.3";const T=w;window.Quill&&window.Quill.register("modules/resize",w);const S=T;return l})()));
|
package/package.json
CHANGED
package/src/QuillResize.ts
CHANGED
package/src/modules/Resize.ts
CHANGED
|
@@ -57,12 +57,12 @@ export default class Resize extends BaseModule {
|
|
|
57
57
|
// note which box
|
|
58
58
|
this.dragBox = evt.target as HTMLElement
|
|
59
59
|
// note starting mousedown position
|
|
60
|
-
if (evt instanceof TouchEvent) {
|
|
60
|
+
if (window.TouchEvent && evt instanceof TouchEvent) {
|
|
61
61
|
this.dragStartX = evt.changedTouches[0].clientX
|
|
62
62
|
this.dragStartY = evt.changedTouches[0].clientY
|
|
63
63
|
} else {
|
|
64
|
-
this.dragStartX = evt.clientX
|
|
65
|
-
this.dragStartY = evt.clientY
|
|
64
|
+
this.dragStartX = (evt as MouseEvent).clientX
|
|
65
|
+
this.dragStartY = (evt as MouseEvent).clientY
|
|
66
66
|
}
|
|
67
67
|
// store the width before the drag
|
|
68
68
|
this.preDragSize = {
|
|
@@ -110,7 +110,7 @@ export default class Resize extends BaseModule {
|
|
|
110
110
|
return
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
-
if (evt instanceof TouchEvent && evt.cancelable) {
|
|
113
|
+
if (window.TouchEvent && evt instanceof TouchEvent && evt.cancelable) {
|
|
114
114
|
evt.preventDefault()
|
|
115
115
|
}
|
|
116
116
|
|
|
@@ -126,12 +126,12 @@ export default class Resize extends BaseModule {
|
|
|
126
126
|
calcSize (evt: MouseEvent | TouchEvent, limit: SizeLimit & { unit?: boolean } = {}): SizeResult {
|
|
127
127
|
let clientX: number, clientY: number
|
|
128
128
|
|
|
129
|
-
if (evt instanceof TouchEvent) {
|
|
129
|
+
if (window.TouchEvent && evt instanceof TouchEvent) {
|
|
130
130
|
clientX = evt.changedTouches[0].clientX
|
|
131
131
|
clientY = evt.changedTouches[0].clientY
|
|
132
132
|
} else {
|
|
133
|
-
clientX = evt.clientX
|
|
134
|
-
clientY = evt.clientY
|
|
133
|
+
clientX = (evt as MouseEvent).clientX
|
|
134
|
+
clientY = (evt as MouseEvent).clientY
|
|
135
135
|
}
|
|
136
136
|
|
|
137
137
|
const deltaX = clientX - this.dragStartX
|