pxx-vue-quill 1.0.162 → 1.0.163
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/dist/vue-quill.umd.js +188 -219
- package/dist/vue-quill.umd.prod.js +2 -2
- package/package.json +1 -1
package/dist/vue-quill.umd.js
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*
|
|
8
8
|
* Copyright (c) 2025 Pxx-Team
|
|
9
9
|
* Released under the MIT license
|
|
10
|
-
* Date: 2025-09-
|
|
10
|
+
* Date: 2025-09-15T03:56:15.666Z
|
|
11
11
|
*/
|
|
12
12
|
(function (global, factory) {
|
|
13
13
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
|
|
@@ -18994,11 +18994,11 @@
|
|
|
18994
18994
|
value: true
|
|
18995
18995
|
});
|
|
18996
18996
|
|
|
18997
|
-
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
18997
|
+
var _createClass$1 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
18998
18998
|
|
|
18999
18999
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
19000
19000
|
|
|
19001
|
-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19001
|
+
function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19002
19002
|
|
|
19003
19003
|
var LEFT_ALIGN = 'left';
|
|
19004
19004
|
var CENTER_ALIGN = 'center';
|
|
@@ -19009,7 +19009,7 @@
|
|
|
19009
19009
|
var _this = this,
|
|
19010
19010
|
_alignments;
|
|
19011
19011
|
|
|
19012
|
-
_classCallCheck(this, DefaultAligner);
|
|
19012
|
+
_classCallCheck$1(this, DefaultAligner);
|
|
19013
19013
|
|
|
19014
19014
|
this.applyStyle = options.aligner.applyStyle;
|
|
19015
19015
|
this.alignAttribute = options.attribute;
|
|
@@ -19037,7 +19037,7 @@
|
|
|
19037
19037
|
}), _alignments);
|
|
19038
19038
|
}
|
|
19039
19039
|
|
|
19040
|
-
_createClass(DefaultAligner, [{
|
|
19040
|
+
_createClass$1(DefaultAligner, [{
|
|
19041
19041
|
key: 'getAlignments',
|
|
19042
19042
|
value: function getAlignments() {
|
|
19043
19043
|
var _this2 = this;
|
|
@@ -19340,190 +19340,182 @@
|
|
|
19340
19340
|
return AlignAction;
|
|
19341
19341
|
}
|
|
19342
19342
|
|
|
19343
|
-
var ResizeAction = {};
|
|
19343
|
+
var ResizeAction$1 = {};
|
|
19344
19344
|
|
|
19345
|
-
|
|
19345
|
+
Object.defineProperty(ResizeAction$1, "__esModule", {
|
|
19346
|
+
value: true
|
|
19347
|
+
});
|
|
19346
19348
|
|
|
19347
|
-
function
|
|
19348
|
-
if (hasRequiredResizeAction) return ResizeAction;
|
|
19349
|
-
hasRequiredResizeAction = 1;
|
|
19349
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
19350
19350
|
|
|
19351
|
-
|
|
19352
|
-
value: true
|
|
19353
|
-
});
|
|
19351
|
+
var _Action2 = requireAction();
|
|
19354
19352
|
|
|
19355
|
-
|
|
19353
|
+
var _Action3 = _interopRequireDefault(_Action2);
|
|
19356
19354
|
|
|
19357
|
-
|
|
19355
|
+
var _BlotFormatter = requireBlotFormatter();
|
|
19358
19356
|
|
|
19359
|
-
|
|
19357
|
+
_interopRequireDefault(_BlotFormatter);
|
|
19360
19358
|
|
|
19361
|
-
|
|
19359
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19362
19360
|
|
|
19363
|
-
|
|
19361
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19364
19362
|
|
|
19365
|
-
|
|
19363
|
+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
19366
19364
|
|
|
19367
|
-
|
|
19365
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
19368
19366
|
|
|
19369
|
-
|
|
19367
|
+
var ResizeAction = function (_Action) {
|
|
19368
|
+
_inherits(ResizeAction, _Action);
|
|
19370
19369
|
|
|
19371
|
-
|
|
19370
|
+
function ResizeAction(formatter) {
|
|
19371
|
+
_classCallCheck(this, ResizeAction);
|
|
19372
19372
|
|
|
19373
|
-
|
|
19374
|
-
_inherits(ResizeAction, _Action);
|
|
19373
|
+
var _this = _possibleConstructorReturn(this, (ResizeAction.__proto__ || Object.getPrototypeOf(ResizeAction)).call(this, formatter));
|
|
19375
19374
|
|
|
19376
|
-
|
|
19377
|
-
|
|
19378
|
-
|
|
19379
|
-
|
|
19380
|
-
|
|
19381
|
-
|
|
19382
|
-
if (!(event.target instanceof HTMLElement)) {
|
|
19383
|
-
return;
|
|
19384
|
-
}
|
|
19385
|
-
_this.dragHandle = event.target;
|
|
19386
|
-
_this.setCursor(_this.dragHandle.style.cursor);
|
|
19375
|
+
_this.onMouseDown = function (event) {
|
|
19376
|
+
if (!(event.target instanceof HTMLElement)) {
|
|
19377
|
+
return;
|
|
19378
|
+
}
|
|
19379
|
+
_this.dragHandle = event.target;
|
|
19380
|
+
_this.setCursor(_this.dragHandle.style.cursor);
|
|
19387
19381
|
|
|
19388
|
-
|
|
19389
|
-
|
|
19390
|
-
|
|
19382
|
+
if (!_this.formatter.currentSpec) {
|
|
19383
|
+
return;
|
|
19384
|
+
}
|
|
19391
19385
|
|
|
19392
|
-
|
|
19393
|
-
|
|
19394
|
-
|
|
19395
|
-
|
|
19386
|
+
var target = _this.formatter.currentSpec.getTargetElement();
|
|
19387
|
+
if (!target) {
|
|
19388
|
+
return;
|
|
19389
|
+
}
|
|
19396
19390
|
|
|
19397
|
-
|
|
19391
|
+
var rect = target.getBoundingClientRect();
|
|
19398
19392
|
|
|
19399
|
-
|
|
19400
|
-
|
|
19401
|
-
|
|
19393
|
+
_this.dragStartX = event.clientX;
|
|
19394
|
+
_this.preDragWidth = rect.width;
|
|
19395
|
+
_this.targetRatio = rect.height / rect.width;
|
|
19402
19396
|
|
|
19403
|
-
|
|
19404
|
-
|
|
19405
|
-
|
|
19397
|
+
document.addEventListener('mousemove', _this.onDrag);
|
|
19398
|
+
document.addEventListener('mouseup', _this.onMouseUp);
|
|
19399
|
+
};
|
|
19406
19400
|
|
|
19407
|
-
|
|
19408
|
-
|
|
19409
|
-
|
|
19410
|
-
|
|
19401
|
+
_this.onDrag = function (event) {
|
|
19402
|
+
if (!_this.formatter.currentSpec) {
|
|
19403
|
+
return;
|
|
19404
|
+
}
|
|
19411
19405
|
|
|
19412
|
-
|
|
19413
|
-
|
|
19414
|
-
|
|
19415
|
-
|
|
19406
|
+
var target = _this.formatter.currentSpec.getTargetElement();
|
|
19407
|
+
if (!target) {
|
|
19408
|
+
return;
|
|
19409
|
+
}
|
|
19416
19410
|
|
|
19417
|
-
|
|
19418
|
-
|
|
19411
|
+
var deltaX = event.clientX - _this.dragStartX;
|
|
19412
|
+
var newWidth = 0;
|
|
19419
19413
|
|
|
19420
|
-
|
|
19421
|
-
|
|
19422
|
-
|
|
19423
|
-
|
|
19424
|
-
|
|
19414
|
+
if (_this.dragHandle === _this.topLeftHandle || _this.dragHandle === _this.bottomLeftHandle) {
|
|
19415
|
+
newWidth = Math.round(_this.preDragWidth - deltaX);
|
|
19416
|
+
} else {
|
|
19417
|
+
newWidth = Math.round(_this.preDragWidth + deltaX);
|
|
19418
|
+
}
|
|
19425
19419
|
|
|
19426
|
-
|
|
19420
|
+
var newHeight = _this.targetRatio * newWidth;
|
|
19427
19421
|
|
|
19428
|
-
|
|
19429
|
-
|
|
19422
|
+
target.setAttribute('width', '' + newWidth);
|
|
19423
|
+
target.setAttribute('height', '' + newHeight);
|
|
19430
19424
|
|
|
19431
|
-
|
|
19432
|
-
|
|
19425
|
+
_this.formatter.update();
|
|
19426
|
+
};
|
|
19433
19427
|
|
|
19434
|
-
|
|
19435
|
-
|
|
19436
|
-
|
|
19437
|
-
|
|
19438
|
-
|
|
19428
|
+
_this.onMouseUp = function () {
|
|
19429
|
+
_this.setCursor('');
|
|
19430
|
+
document.removeEventListener('mousemove', _this.onDrag);
|
|
19431
|
+
document.removeEventListener('mouseup', _this.onMouseUp);
|
|
19432
|
+
};
|
|
19439
19433
|
|
|
19440
|
-
|
|
19441
|
-
|
|
19442
|
-
|
|
19443
|
-
|
|
19444
|
-
|
|
19445
|
-
|
|
19446
|
-
|
|
19447
|
-
|
|
19448
|
-
|
|
19449
|
-
|
|
19434
|
+
_this.topLeftHandle = _this.createHandle('top-left', 'nwse-resize');
|
|
19435
|
+
_this.topRightHandle = _this.createHandle('top-right', 'nesw-resize');
|
|
19436
|
+
_this.bottomRightHandle = _this.createHandle('bottom-right', 'nwse-resize');
|
|
19437
|
+
_this.bottomLeftHandle = _this.createHandle('bottom-left', 'nesw-resize');
|
|
19438
|
+
_this.dragHandle = null;
|
|
19439
|
+
_this.dragStartX = 0;
|
|
19440
|
+
_this.preDragWidth = 0;
|
|
19441
|
+
_this.targetRatio = 0;
|
|
19442
|
+
return _this;
|
|
19443
|
+
}
|
|
19450
19444
|
|
|
19451
|
-
|
|
19452
|
-
|
|
19453
|
-
|
|
19454
|
-
|
|
19455
|
-
|
|
19456
|
-
|
|
19457
|
-
|
|
19445
|
+
_createClass(ResizeAction, [{
|
|
19446
|
+
key: 'onCreate',
|
|
19447
|
+
value: function onCreate() {
|
|
19448
|
+
this.formatter.overlay.appendChild(this.topLeftHandle);
|
|
19449
|
+
this.formatter.overlay.appendChild(this.topRightHandle);
|
|
19450
|
+
this.formatter.overlay.appendChild(this.bottomRightHandle);
|
|
19451
|
+
this.formatter.overlay.appendChild(this.bottomLeftHandle);
|
|
19458
19452
|
|
|
19459
|
-
|
|
19460
|
-
|
|
19461
|
-
|
|
19462
|
-
|
|
19463
|
-
|
|
19464
|
-
|
|
19465
|
-
|
|
19466
|
-
|
|
19467
|
-
|
|
19468
|
-
|
|
19469
|
-
|
|
19470
|
-
|
|
19471
|
-
|
|
19472
|
-
|
|
19473
|
-
|
|
19474
|
-
|
|
19475
|
-
|
|
19476
|
-
|
|
19477
|
-
|
|
19478
|
-
|
|
19479
|
-
|
|
19480
|
-
|
|
19453
|
+
this.repositionHandles(this.formatter.options.resize.handleStyle);
|
|
19454
|
+
}
|
|
19455
|
+
}, {
|
|
19456
|
+
key: 'onDestroy',
|
|
19457
|
+
value: function onDestroy() {
|
|
19458
|
+
this.setCursor('');
|
|
19459
|
+
this.formatter.overlay.removeChild(this.topLeftHandle);
|
|
19460
|
+
this.formatter.overlay.removeChild(this.topRightHandle);
|
|
19461
|
+
this.formatter.overlay.removeChild(this.bottomRightHandle);
|
|
19462
|
+
this.formatter.overlay.removeChild(this.bottomLeftHandle);
|
|
19463
|
+
}
|
|
19464
|
+
}, {
|
|
19465
|
+
key: 'createHandle',
|
|
19466
|
+
value: function createHandle(position, cursor) {
|
|
19467
|
+
var box = document.createElement('div');
|
|
19468
|
+
box.classList.add(this.formatter.options.resize.handleClassName);
|
|
19469
|
+
box.setAttribute('data-position', position);
|
|
19470
|
+
box.style.cursor = cursor;
|
|
19471
|
+
|
|
19472
|
+
if (this.formatter.options.resize.handleStyle) {
|
|
19473
|
+
Object.assign(box.style, this.formatter.options.resize.handleStyle);
|
|
19474
|
+
}
|
|
19481
19475
|
|
|
19482
|
-
|
|
19476
|
+
box.addEventListener('mousedown', this.onMouseDown);
|
|
19483
19477
|
|
|
19484
|
-
|
|
19485
|
-
|
|
19486
|
-
|
|
19487
|
-
|
|
19488
|
-
|
|
19489
|
-
|
|
19490
|
-
|
|
19491
|
-
|
|
19492
|
-
|
|
19493
|
-
|
|
19494
|
-
|
|
19495
|
-
|
|
19496
|
-
|
|
19497
|
-
|
|
19498
|
-
|
|
19478
|
+
return box;
|
|
19479
|
+
}
|
|
19480
|
+
}, {
|
|
19481
|
+
key: 'repositionHandles',
|
|
19482
|
+
value: function repositionHandles(handleStyle) {
|
|
19483
|
+
var handleXOffset = '0px';
|
|
19484
|
+
var handleYOffset = '0px';
|
|
19485
|
+
if (handleStyle) {
|
|
19486
|
+
if (handleStyle.width) {
|
|
19487
|
+
handleXOffset = -parseFloat(handleStyle.width) / 2 + 'px';
|
|
19488
|
+
}
|
|
19489
|
+
if (handleStyle.height) {
|
|
19490
|
+
handleYOffset = -parseFloat(handleStyle.height) / 2 + 'px';
|
|
19491
|
+
}
|
|
19492
|
+
}
|
|
19499
19493
|
|
|
19500
|
-
|
|
19501
|
-
|
|
19502
|
-
|
|
19503
|
-
|
|
19504
|
-
|
|
19505
|
-
|
|
19506
|
-
|
|
19507
|
-
|
|
19508
|
-
|
|
19509
|
-
|
|
19510
|
-
|
|
19494
|
+
Object.assign(this.topLeftHandle.style, { left: handleXOffset, top: handleYOffset });
|
|
19495
|
+
Object.assign(this.topRightHandle.style, { right: handleXOffset, top: handleYOffset });
|
|
19496
|
+
Object.assign(this.bottomRightHandle.style, { right: handleXOffset, bottom: handleYOffset });
|
|
19497
|
+
Object.assign(this.bottomLeftHandle.style, { left: handleXOffset, bottom: handleYOffset });
|
|
19498
|
+
}
|
|
19499
|
+
}, {
|
|
19500
|
+
key: 'setCursor',
|
|
19501
|
+
value: function setCursor(value) {
|
|
19502
|
+
if (document.body) {
|
|
19503
|
+
document.body.style.cursor = value;
|
|
19504
|
+
}
|
|
19511
19505
|
|
|
19512
|
-
|
|
19513
|
-
|
|
19514
|
-
|
|
19515
|
-
|
|
19516
|
-
|
|
19517
|
-
|
|
19518
|
-
|
|
19519
|
-
|
|
19506
|
+
if (this.formatter.currentSpec) {
|
|
19507
|
+
var target = this.formatter.currentSpec.getOverlayElement();
|
|
19508
|
+
if (target) {
|
|
19509
|
+
target.style.cursor = value;
|
|
19510
|
+
}
|
|
19511
|
+
}
|
|
19512
|
+
}
|
|
19513
|
+
}]);
|
|
19520
19514
|
|
|
19521
|
-
|
|
19522
|
-
|
|
19515
|
+
return ResizeAction;
|
|
19516
|
+
}(_Action3.default);
|
|
19523
19517
|
|
|
19524
|
-
|
|
19525
|
-
return ResizeAction;
|
|
19526
|
-
}
|
|
19518
|
+
ResizeAction$1.default = ResizeAction;
|
|
19527
19519
|
|
|
19528
19520
|
var DeleteAction = {};
|
|
19529
19521
|
|
|
@@ -19630,7 +19622,7 @@
|
|
|
19630
19622
|
|
|
19631
19623
|
var _AlignAction2 = _interopRequireDefault(_AlignAction);
|
|
19632
19624
|
|
|
19633
|
-
var _ResizeAction =
|
|
19625
|
+
var _ResizeAction = ResizeAction$1;
|
|
19634
19626
|
|
|
19635
19627
|
var _ResizeAction2 = _interopRequireDefault(_ResizeAction);
|
|
19636
19628
|
|
|
@@ -20123,7 +20115,7 @@
|
|
|
20123
20115
|
}
|
|
20124
20116
|
});
|
|
20125
20117
|
|
|
20126
|
-
var _ResizeAction =
|
|
20118
|
+
var _ResizeAction = ResizeAction$1;
|
|
20127
20119
|
|
|
20128
20120
|
Object.defineProperty(exports, 'ResizeAction', {
|
|
20129
20121
|
enumerable: true,
|
|
@@ -20283,9 +20275,9 @@
|
|
|
20283
20275
|
};
|
|
20284
20276
|
}
|
|
20285
20277
|
|
|
20286
|
-
function
|
|
20278
|
+
function useCustomLink(editor) {
|
|
20287
20279
|
const quillRef = vue.ref(null);
|
|
20288
|
-
const handleCustomLinkRef = vue.ref(
|
|
20280
|
+
const handleCustomLinkRef = vue.ref(null);
|
|
20289
20281
|
const handleLinkClick = (event) => {
|
|
20290
20282
|
if (!quillRef.value || !handleCustomLinkRef.value)
|
|
20291
20283
|
return;
|
|
@@ -20332,12 +20324,43 @@
|
|
|
20332
20324
|
const setHandleCustomLink = (fn) => {
|
|
20333
20325
|
handleCustomLinkRef.value = fn;
|
|
20334
20326
|
};
|
|
20327
|
+
const calculateSelectionPosition = (range) => {
|
|
20328
|
+
var _a;
|
|
20329
|
+
if (!quillRef.value)
|
|
20330
|
+
return { top: 0, left: 0 };
|
|
20331
|
+
const selectionRange = range || quillRef.value.getSelection();
|
|
20332
|
+
if (!selectionRange || selectionRange.length === 0)
|
|
20333
|
+
return { top: 0, left: 0 };
|
|
20334
|
+
try {
|
|
20335
|
+
const bounds = quillRef.value.getBounds(selectionRange.index, selectionRange.length);
|
|
20336
|
+
const editorElement = (_a = editor.value) === null || _a === void 0 ? void 0 : _a.querySelector('.ql-editor');
|
|
20337
|
+
const editorContainer = editorElement === null || editorElement === void 0 ? void 0 : editorElement.closest('.quill-editor-container');
|
|
20338
|
+
const editorWidth = editorContainer ? editorContainer.clientWidth : ((editorElement === null || editorElement === void 0 ? void 0 : editorElement.clientWidth) || 0);
|
|
20339
|
+
const customLinkWidth = 310;
|
|
20340
|
+
const maxLeft = editorWidth - customLinkWidth - 16;
|
|
20341
|
+
const left = Math.min(bounds.left, Math.max(0, maxLeft));
|
|
20342
|
+
const editorRect = editorElement === null || editorElement === void 0 ? void 0 : editorElement.getBoundingClientRect();
|
|
20343
|
+
const containerRect = editorContainer === null || editorContainer === void 0 ? void 0 : editorContainer.getBoundingClientRect();
|
|
20344
|
+
if (!editorRect || !containerRect) {
|
|
20345
|
+
return { top: bounds.top + bounds.height + 5, left: left };
|
|
20346
|
+
}
|
|
20347
|
+
const editorOffsetTop = editorRect.top - containerRect.top;
|
|
20348
|
+
const top = editorOffsetTop + bounds.top + bounds.height + 5;
|
|
20349
|
+
return {
|
|
20350
|
+
top: top,
|
|
20351
|
+
left: left
|
|
20352
|
+
};
|
|
20353
|
+
}
|
|
20354
|
+
catch (error) {
|
|
20355
|
+
console.warn('计算选中位置时出错:', error);
|
|
20356
|
+
return { top: 0, left: 0 };
|
|
20357
|
+
}
|
|
20358
|
+
};
|
|
20335
20359
|
return {
|
|
20336
|
-
quillRef,
|
|
20337
20360
|
setQuill,
|
|
20338
20361
|
setHandleCustomLink,
|
|
20339
|
-
|
|
20340
|
-
|
|
20362
|
+
addLinkClickListener,
|
|
20363
|
+
calculateSelectionPosition
|
|
20341
20364
|
};
|
|
20342
20365
|
}
|
|
20343
20366
|
|
|
@@ -20532,7 +20555,7 @@
|
|
|
20532
20555
|
const { addClickHandler } = useGlobalClick(props.clickTargetSelector);
|
|
20533
20556
|
const { isIPadBool, handleIPadNewline } = useIPadScene();
|
|
20534
20557
|
const { setQuill, handleBlotFormatterClick, configureBlotFormatter, applyImageStyle, registerBlotFormatter, getBlotFormatterConfig } = useBlotFormatter(editor, props.enableImageResize);
|
|
20535
|
-
const { setQuill: setLinkQuill, setHandleCustomLink, addLinkClickListener } =
|
|
20558
|
+
const { setQuill: setLinkQuill, setHandleCustomLink, addLinkClickListener, calculateSelectionPosition } = useCustomLink(editor);
|
|
20536
20559
|
vue.onMounted(() => {
|
|
20537
20560
|
initialize();
|
|
20538
20561
|
});
|
|
@@ -20872,8 +20895,8 @@
|
|
|
20872
20895
|
vue.nextTick(() => {
|
|
20873
20896
|
applyImageStyle();
|
|
20874
20897
|
});
|
|
20875
|
-
updateHistoryState();
|
|
20876
20898
|
ctx.emit('textChange', { delta, oldContents, source });
|
|
20899
|
+
updateHistoryState();
|
|
20877
20900
|
};
|
|
20878
20901
|
const controlToolbarVisible = (visible) => {
|
|
20879
20902
|
var _a;
|
|
@@ -20892,6 +20915,7 @@
|
|
|
20892
20915
|
controlToolbarVisible(true);
|
|
20893
20916
|
}
|
|
20894
20917
|
ctx.emit('selectionChange', { range, oldRange, source });
|
|
20918
|
+
updateHistoryState();
|
|
20895
20919
|
};
|
|
20896
20920
|
vue.watch(isEditorFocus, (focus) => {
|
|
20897
20921
|
if (focus)
|
|
@@ -20900,7 +20924,6 @@
|
|
|
20900
20924
|
ctx.emit('blur', editor);
|
|
20901
20925
|
});
|
|
20902
20926
|
const handleEditorChange = (...args) => {
|
|
20903
|
-
updateHistoryState();
|
|
20904
20927
|
if (args[0] === 'text-change')
|
|
20905
20928
|
ctx.emit('editorChange', {
|
|
20906
20929
|
name: args[0],
|
|
@@ -20916,19 +20939,6 @@
|
|
|
20916
20939
|
source: args[3],
|
|
20917
20940
|
});
|
|
20918
20941
|
};
|
|
20919
|
-
const getEditor = () => {
|
|
20920
|
-
return editor.value;
|
|
20921
|
-
};
|
|
20922
|
-
const getToolbar = () => {
|
|
20923
|
-
var _a;
|
|
20924
|
-
return (_a = quill === null || quill === void 0 ? void 0 : quill.getModule('toolbar')) === null || _a === void 0 ? void 0 : _a.container;
|
|
20925
|
-
};
|
|
20926
|
-
const getQuill = () => {
|
|
20927
|
-
if (quill)
|
|
20928
|
-
return quill;
|
|
20929
|
-
else
|
|
20930
|
-
throw `The quill editor hasn't been instantiated`;
|
|
20931
|
-
};
|
|
20932
20942
|
const getContents = (index, length) => {
|
|
20933
20943
|
if (props.contentType === 'html') {
|
|
20934
20944
|
return getHTML();
|
|
@@ -20939,20 +20949,14 @@
|
|
|
20939
20949
|
return quill === null || quill === void 0 ? void 0 : quill.getContents(index, length);
|
|
20940
20950
|
};
|
|
20941
20951
|
const setContents = (content, source = 'api') => {
|
|
20952
|
+
var _a;
|
|
20942
20953
|
const normalizedContent = !content
|
|
20943
20954
|
? props.contentType === 'delta'
|
|
20944
20955
|
? new Delta$1()
|
|
20945
20956
|
: ''
|
|
20946
20957
|
: content;
|
|
20947
20958
|
if (props.contentType === 'html') {
|
|
20948
|
-
|
|
20949
|
-
if (quill) {
|
|
20950
|
-
quill.root.innerHTML = '';
|
|
20951
|
-
}
|
|
20952
|
-
}
|
|
20953
|
-
else {
|
|
20954
|
-
setHTML(normalizedContent);
|
|
20955
|
-
}
|
|
20959
|
+
setHTML((_a = normalizedContent) !== null && _a !== void 0 ? _a : '');
|
|
20956
20960
|
}
|
|
20957
20961
|
else if (props.contentType === 'text') {
|
|
20958
20962
|
setText(normalizedContent, source);
|
|
@@ -21032,38 +21036,6 @@
|
|
|
21032
21036
|
handleCustomLink(true);
|
|
21033
21037
|
}
|
|
21034
21038
|
};
|
|
21035
|
-
const calculateSelectionPosition = (range) => {
|
|
21036
|
-
var _a;
|
|
21037
|
-
if (!quill)
|
|
21038
|
-
return { top: 0, left: 0 };
|
|
21039
|
-
const selectionRange = range || quill.getSelection();
|
|
21040
|
-
if (!selectionRange || selectionRange.length === 0)
|
|
21041
|
-
return { top: 0, left: 0 };
|
|
21042
|
-
try {
|
|
21043
|
-
const bounds = quill.getBounds(selectionRange.index, selectionRange.length);
|
|
21044
|
-
const editorElement = (_a = editor.value) === null || _a === void 0 ? void 0 : _a.querySelector('.ql-editor');
|
|
21045
|
-
const editorContainer = editorElement === null || editorElement === void 0 ? void 0 : editorElement.closest('.quill-editor-container');
|
|
21046
|
-
const editorWidth = editorContainer ? editorContainer.clientWidth : ((editorElement === null || editorElement === void 0 ? void 0 : editorElement.clientWidth) || 0);
|
|
21047
|
-
const customLinkWidth = 310;
|
|
21048
|
-
const maxLeft = editorWidth - customLinkWidth - 16;
|
|
21049
|
-
const left = Math.min(bounds.left, Math.max(0, maxLeft));
|
|
21050
|
-
const editorRect = editorElement === null || editorElement === void 0 ? void 0 : editorElement.getBoundingClientRect();
|
|
21051
|
-
const containerRect = editorContainer === null || editorContainer === void 0 ? void 0 : editorContainer.getBoundingClientRect();
|
|
21052
|
-
if (!editorRect || !containerRect) {
|
|
21053
|
-
return { top: bounds.top + bounds.height + 5, left: left };
|
|
21054
|
-
}
|
|
21055
|
-
const editorOffsetTop = editorRect.top - containerRect.top;
|
|
21056
|
-
const top = editorOffsetTop + bounds.top + bounds.height + 5;
|
|
21057
|
-
return {
|
|
21058
|
-
top: top,
|
|
21059
|
-
left: left
|
|
21060
|
-
};
|
|
21061
|
-
}
|
|
21062
|
-
catch (error) {
|
|
21063
|
-
console.warn('计算选中位置时出错:', error);
|
|
21064
|
-
return { top: 0, left: 0 };
|
|
21065
|
-
}
|
|
21066
|
-
};
|
|
21067
21039
|
const handleCustomLink = (bool, linkInfo) => {
|
|
21068
21040
|
if (!quill)
|
|
21069
21041
|
return;
|
|
@@ -21156,9 +21128,6 @@
|
|
|
21156
21128
|
linkUrl,
|
|
21157
21129
|
linkText,
|
|
21158
21130
|
linkPosition,
|
|
21159
|
-
getEditor,
|
|
21160
|
-
getToolbar,
|
|
21161
|
-
getQuill,
|
|
21162
21131
|
getContents,
|
|
21163
21132
|
setContents,
|
|
21164
21133
|
getHTML,
|