@hufe921/canvas-editor 0.9.82 → 0.9.83
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/CHANGELOG.md +17 -0
- package/dist/canvas-editor.es.js +154 -19
- package/dist/canvas-editor.es.js.map +1 -1
- package/dist/canvas-editor.umd.js +36 -36
- package/dist/canvas-editor.umd.js.map +1 -1
- package/dist/src/editor/core/command/Command.d.ts +1 -0
- package/dist/src/editor/core/command/CommandAdapt.d.ts +3 -1
- package/dist/src/editor/core/observer/MouseObserver.d.ts +10 -0
- package/dist/src/editor/core/range/RangeManager.d.ts +1 -0
- package/dist/src/editor/interface/Event.d.ts +7 -0
- package/dist/src/editor/interface/EventBus.d.ts +4 -1
- package/dist/src/editor/interface/Listener.d.ts +1 -0
- package/dist/src/editor/interface/table/Td.d.ts +1 -0
- package/dist/src/editor/utils/index.d.ts +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,20 @@
|
|
|
1
|
+
## [0.9.83](https://github.com/Hufe921/canvas-editor/compare/v0.9.82...v0.9.83) (2024-06-21)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Bug Fixes
|
|
5
|
+
|
|
6
|
+
* executeSetControlProperties api invalid in table #653 ([fdcf639](https://github.com/Hufe921/canvas-editor/commit/fdcf6397e1ce62ef1ed18a526a0642c3f120df3b)), closes [#653](https://github.com/Hufe921/canvas-editor/issues/653)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* add clear format attributes ([e21533a](https://github.com/Hufe921/canvas-editor/commit/e21533a3d1cfeecde562aaa6c52ee306e5063a01))
|
|
12
|
+
* add conceptId attribute to table td #654 ([959a062](https://github.com/Hufe921/canvas-editor/commit/959a062f830042b78af498e2d6cbc4e5f82fa3d4)), closes [#654](https://github.com/Hufe921/canvas-editor/issues/654)
|
|
13
|
+
* add mouse event listener #603 ([a2978bd](https://github.com/Hufe921/canvas-editor/commit/a2978bd1f507e9417b995bbb0b7ff756dbe5d2c4)), closes [#603](https://github.com/Hufe921/canvas-editor/issues/603)
|
|
14
|
+
* copy table structure and data #516 ([76c20a6](https://github.com/Hufe921/canvas-editor/commit/76c20a6b44914396ae7dd69a7c97db1b179937c2)), closes [#516](https://github.com/Hufe921/canvas-editor/issues/516)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
1
18
|
## [0.9.82](https://github.com/Hufe921/canvas-editor/compare/v0.9.81...v0.9.82) (2024-06-14)
|
|
2
19
|
|
|
3
20
|
|
package/dist/canvas-editor.es.js
CHANGED
|
@@ -23,7 +23,7 @@ var __publicField = (obj, key, value) => {
|
|
|
23
23
|
return value;
|
|
24
24
|
};
|
|
25
25
|
var index = "";
|
|
26
|
-
const version = "0.9.
|
|
26
|
+
const version = "0.9.83";
|
|
27
27
|
var MaxHeightRatio;
|
|
28
28
|
(function(MaxHeightRatio2) {
|
|
29
29
|
MaxHeightRatio2["HALF"] = "half";
|
|
@@ -471,6 +471,7 @@ const EDITOR_ELEMENT_ZIP_ATTR = [
|
|
|
471
471
|
"externalId"
|
|
472
472
|
];
|
|
473
473
|
const TABLE_TD_ZIP_ATTR = [
|
|
474
|
+
"conceptId",
|
|
474
475
|
"verticalAlign",
|
|
475
476
|
"backgroundColor",
|
|
476
477
|
"borderTypes",
|
|
@@ -5189,9 +5190,10 @@ class CursorAgent {
|
|
|
5189
5190
|
this.canvasEvent.keydown(evt);
|
|
5190
5191
|
}
|
|
5191
5192
|
_input(evt) {
|
|
5192
|
-
|
|
5193
|
+
const data2 = evt.data;
|
|
5194
|
+
if (!data2)
|
|
5193
5195
|
return;
|
|
5194
|
-
this.canvasEvent.input(
|
|
5196
|
+
this.canvasEvent.input(data2);
|
|
5195
5197
|
}
|
|
5196
5198
|
_paste(evt) {
|
|
5197
5199
|
const isReadonly = this.draw.isReadonly();
|
|
@@ -6978,7 +6980,45 @@ function copy(host) {
|
|
|
6978
6980
|
return;
|
|
6979
6981
|
}
|
|
6980
6982
|
const rangeManager = draw.getRange();
|
|
6981
|
-
|
|
6983
|
+
let copyElementList = null;
|
|
6984
|
+
const range = rangeManager.getRange();
|
|
6985
|
+
if (range.isCrossRowCol) {
|
|
6986
|
+
const tableElement = rangeManager.getRangeTableElement();
|
|
6987
|
+
if (!tableElement)
|
|
6988
|
+
return;
|
|
6989
|
+
const rowCol = draw.getTableParticle().getRangeRowCol();
|
|
6990
|
+
if (!rowCol)
|
|
6991
|
+
return;
|
|
6992
|
+
const copyTableElement = {
|
|
6993
|
+
type: ElementType.TABLE,
|
|
6994
|
+
value: "",
|
|
6995
|
+
colgroup: [],
|
|
6996
|
+
trList: []
|
|
6997
|
+
};
|
|
6998
|
+
const firstRow = rowCol[0];
|
|
6999
|
+
const colStartIndex = firstRow[0].colIndex;
|
|
7000
|
+
const lastCol = firstRow[firstRow.length - 1];
|
|
7001
|
+
const colEndIndex = lastCol.colIndex + lastCol.colspan - 1;
|
|
7002
|
+
for (let c = colStartIndex; c <= colEndIndex; c++) {
|
|
7003
|
+
copyTableElement.colgroup.push(tableElement.colgroup[c]);
|
|
7004
|
+
}
|
|
7005
|
+
for (let r = 0; r < rowCol.length; r++) {
|
|
7006
|
+
const row = rowCol[r];
|
|
7007
|
+
const tr = tableElement.trList[row[0].rowIndex];
|
|
7008
|
+
const coptTr = {
|
|
7009
|
+
tdList: [],
|
|
7010
|
+
height: tr.height,
|
|
7011
|
+
minHeight: tr.minHeight
|
|
7012
|
+
};
|
|
7013
|
+
for (let c = 0; c < row.length; c++) {
|
|
7014
|
+
coptTr.tdList.push(row[c]);
|
|
7015
|
+
}
|
|
7016
|
+
copyTableElement.trList.push(coptTr);
|
|
7017
|
+
}
|
|
7018
|
+
copyElementList = zipElementList([copyTableElement]);
|
|
7019
|
+
} else {
|
|
7020
|
+
copyElementList = rangeManager.getIsCollapsed() ? rangeManager.getRangeRowElementList() : rangeManager.getSelectionElementList();
|
|
7021
|
+
}
|
|
6982
7022
|
if (!(copyElementList == null ? void 0 : copyElementList.length))
|
|
6983
7023
|
return;
|
|
6984
7024
|
writeElementList(copyElementList, draw.getOptions());
|
|
@@ -7824,6 +7864,7 @@ class Position {
|
|
|
7824
7864
|
x,
|
|
7825
7865
|
y,
|
|
7826
7866
|
td,
|
|
7867
|
+
pageNo: curPageNo,
|
|
7827
7868
|
tablePosition: positionList[j],
|
|
7828
7869
|
isTable: true,
|
|
7829
7870
|
elementList: td.value,
|
|
@@ -7884,6 +7925,7 @@ class Position {
|
|
|
7884
7925
|
}
|
|
7885
7926
|
}
|
|
7886
7927
|
return {
|
|
7928
|
+
isDirectHit: true,
|
|
7887
7929
|
hitLineStartIndex: hitLineStartIndex2,
|
|
7888
7930
|
index: curPositionIndex2,
|
|
7889
7931
|
isControl: !!element.controlId
|
|
@@ -8287,6 +8329,13 @@ class RangeManager {
|
|
|
8287
8329
|
var _a;
|
|
8288
8330
|
return ((_a = this.getRangeParagraphInfo()) == null ? void 0 : _a.elementList) || null;
|
|
8289
8331
|
}
|
|
8332
|
+
getRangeTableElement() {
|
|
8333
|
+
const positionContext = this.position.getPositionContext();
|
|
8334
|
+
if (!positionContext.isTable)
|
|
8335
|
+
return null;
|
|
8336
|
+
const originalElementList = this.draw.getOriginalElementList();
|
|
8337
|
+
return originalElementList[positionContext.index];
|
|
8338
|
+
}
|
|
8290
8339
|
getIsSelectAll() {
|
|
8291
8340
|
const elementList = this.draw.getElementList();
|
|
8292
8341
|
const { startIndex, endIndex } = this.range;
|
|
@@ -12251,23 +12300,27 @@ class Control {
|
|
|
12251
12300
|
}
|
|
12252
12301
|
}
|
|
12253
12302
|
setPropertiesByConceptId(payload) {
|
|
12254
|
-
var _a;
|
|
12255
12303
|
const isReadonly = this.draw.isReadonly();
|
|
12256
12304
|
if (isReadonly)
|
|
12257
12305
|
return;
|
|
12258
12306
|
const { conceptId, properties } = payload;
|
|
12259
12307
|
let isExistUpdate = false;
|
|
12260
|
-
|
|
12261
|
-
|
|
12262
|
-
main: this.draw.getOriginalMainElementList(),
|
|
12263
|
-
footer: this.draw.getFooterElementList()
|
|
12264
|
-
};
|
|
12265
|
-
for (const key in pageComponentData) {
|
|
12266
|
-
const elementList = pageComponentData[key];
|
|
12308
|
+
function setProperties(elementList) {
|
|
12309
|
+
var _a;
|
|
12267
12310
|
let i = 0;
|
|
12268
12311
|
while (i < elementList.length) {
|
|
12269
12312
|
const element = elementList[i];
|
|
12270
12313
|
i++;
|
|
12314
|
+
if (element.type === ElementType.TABLE) {
|
|
12315
|
+
const trList = element.trList;
|
|
12316
|
+
for (let r = 0; r < trList.length; r++) {
|
|
12317
|
+
const tr = trList[r];
|
|
12318
|
+
for (let d = 0; d < tr.tdList.length; d++) {
|
|
12319
|
+
const td = tr.tdList[d];
|
|
12320
|
+
setProperties(td.value);
|
|
12321
|
+
}
|
|
12322
|
+
}
|
|
12323
|
+
}
|
|
12271
12324
|
if (((_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId) !== conceptId)
|
|
12272
12325
|
continue;
|
|
12273
12326
|
isExistUpdate = true;
|
|
@@ -12284,6 +12337,15 @@ class Control {
|
|
|
12284
12337
|
i = newEndIndex;
|
|
12285
12338
|
}
|
|
12286
12339
|
}
|
|
12340
|
+
const pageComponentData = {
|
|
12341
|
+
header: this.draw.getHeaderElementList(),
|
|
12342
|
+
main: this.draw.getOriginalMainElementList(),
|
|
12343
|
+
footer: this.draw.getFooterElementList()
|
|
12344
|
+
};
|
|
12345
|
+
for (const key in pageComponentData) {
|
|
12346
|
+
const elementList = pageComponentData[key];
|
|
12347
|
+
setProperties(elementList);
|
|
12348
|
+
}
|
|
12287
12349
|
if (!isExistUpdate)
|
|
12288
12350
|
return;
|
|
12289
12351
|
for (const key in pageComponentData) {
|
|
@@ -14372,6 +14434,34 @@ class Group {
|
|
|
14372
14434
|
this.clearFillInfo();
|
|
14373
14435
|
}
|
|
14374
14436
|
}
|
|
14437
|
+
class MouseObserver {
|
|
14438
|
+
constructor(draw) {
|
|
14439
|
+
__publicField(this, "draw");
|
|
14440
|
+
__publicField(this, "eventBus");
|
|
14441
|
+
__publicField(this, "pageContainer");
|
|
14442
|
+
this.draw = draw;
|
|
14443
|
+
this.eventBus = this.draw.getEventBus();
|
|
14444
|
+
this.pageContainer = this.draw.getPageContainer();
|
|
14445
|
+
this.pageContainer.addEventListener("mousemove", this._mousemove.bind(this));
|
|
14446
|
+
this.pageContainer.addEventListener("mouseenter", this._mouseenter.bind(this));
|
|
14447
|
+
this.pageContainer.addEventListener("mouseleave", this._mouseleave.bind(this));
|
|
14448
|
+
}
|
|
14449
|
+
_mousemove(evt) {
|
|
14450
|
+
if (!this.eventBus.isSubscribe("mousemove"))
|
|
14451
|
+
return;
|
|
14452
|
+
this.eventBus.emit("mousemove", evt);
|
|
14453
|
+
}
|
|
14454
|
+
_mouseenter(evt) {
|
|
14455
|
+
if (!this.eventBus.isSubscribe("mouseenter"))
|
|
14456
|
+
return;
|
|
14457
|
+
this.eventBus.emit("mouseenter", evt);
|
|
14458
|
+
}
|
|
14459
|
+
_mouseleave(evt) {
|
|
14460
|
+
if (!this.eventBus.isSubscribe("mouseleave"))
|
|
14461
|
+
return;
|
|
14462
|
+
this.eventBus.emit("mouseleave", evt);
|
|
14463
|
+
}
|
|
14464
|
+
}
|
|
14375
14465
|
class Draw {
|
|
14376
14466
|
constructor(rootContainer, options, data2, listener, eventBus, override) {
|
|
14377
14467
|
__publicField(this, "container");
|
|
@@ -14490,6 +14580,7 @@ class Draw {
|
|
|
14490
14580
|
this.scrollObserver = new ScrollObserver(this);
|
|
14491
14581
|
this.selectionObserver = new SelectionObserver(this);
|
|
14492
14582
|
this.imageObserver = new ImageObserver();
|
|
14583
|
+
new MouseObserver(this);
|
|
14493
14584
|
this.canvasEvent = new CanvasEvent(this);
|
|
14494
14585
|
this.cursor = new Cursor(this, this.canvasEvent);
|
|
14495
14586
|
this.canvasEvent.register();
|
|
@@ -16237,6 +16328,7 @@ class Command {
|
|
|
16237
16328
|
__publicField(this, "getControlList");
|
|
16238
16329
|
__publicField(this, "getContainer");
|
|
16239
16330
|
__publicField(this, "getTitleValue");
|
|
16331
|
+
__publicField(this, "getPositionContextByEvent");
|
|
16240
16332
|
this.executeMode = adapt.mode.bind(adapt);
|
|
16241
16333
|
this.executeCut = adapt.cut.bind(adapt);
|
|
16242
16334
|
this.executeCopy = adapt.copy.bind(adapt);
|
|
@@ -16343,6 +16435,7 @@ class Command {
|
|
|
16343
16435
|
this.getGroupIds = adapt.getGroupIds.bind(adapt);
|
|
16344
16436
|
this.getContainer = adapt.getContainer.bind(adapt);
|
|
16345
16437
|
this.getTitleValue = adapt.getTitleValue.bind(adapt);
|
|
16438
|
+
this.getPositionContextByEvent = adapt.getPositionContextByEvent.bind(adapt);
|
|
16346
16439
|
this.executeSetControlValue = adapt.setControlValue.bind(adapt);
|
|
16347
16440
|
this.executeSetControlExtension = adapt.setControlExtension.bind(adapt);
|
|
16348
16441
|
this.executeSetControlProperties = adapt.setControlProperties.bind(adapt);
|
|
@@ -16576,6 +16669,7 @@ class CommandAdapt {
|
|
|
16576
16669
|
__publicField(this, "workerManager");
|
|
16577
16670
|
__publicField(this, "searchManager");
|
|
16578
16671
|
__publicField(this, "i18n");
|
|
16672
|
+
__publicField(this, "zone");
|
|
16579
16673
|
this.draw = draw;
|
|
16580
16674
|
this.range = draw.getRange();
|
|
16581
16675
|
this.position = draw.getPosition();
|
|
@@ -16587,6 +16681,7 @@ class CommandAdapt {
|
|
|
16587
16681
|
this.workerManager = draw.getWorkerManager();
|
|
16588
16682
|
this.searchManager = draw.getSearch();
|
|
16589
16683
|
this.i18n = draw.getI18n();
|
|
16684
|
+
this.zone = draw.getZone();
|
|
16590
16685
|
}
|
|
16591
16686
|
mode(payload) {
|
|
16592
16687
|
this.draw.setMode(payload);
|
|
@@ -16740,13 +16835,9 @@ class CommandAdapt {
|
|
|
16740
16835
|
if (!changeElementList.length)
|
|
16741
16836
|
return;
|
|
16742
16837
|
changeElementList.forEach((el) => {
|
|
16743
|
-
|
|
16744
|
-
|
|
16745
|
-
|
|
16746
|
-
delete el.bold;
|
|
16747
|
-
delete el.italic;
|
|
16748
|
-
delete el.underline;
|
|
16749
|
-
delete el.strikeout;
|
|
16838
|
+
EDITOR_ELEMENT_STYLE_ATTR.forEach((attr) => {
|
|
16839
|
+
delete el[attr];
|
|
16840
|
+
});
|
|
16750
16841
|
});
|
|
16751
16842
|
this.draw.render(renderOption);
|
|
16752
16843
|
}
|
|
@@ -18840,6 +18931,50 @@ class CommandAdapt {
|
|
|
18840
18931
|
}
|
|
18841
18932
|
return result;
|
|
18842
18933
|
}
|
|
18934
|
+
getPositionContextByEvent(evt) {
|
|
18935
|
+
var _a, _b, _c;
|
|
18936
|
+
const pageIndex = (_a = evt.target) == null ? void 0 : _a.dataset.index;
|
|
18937
|
+
if (!pageIndex)
|
|
18938
|
+
return null;
|
|
18939
|
+
const pageNo = Number(pageIndex);
|
|
18940
|
+
const positionContext = this.position.getPositionByXY({
|
|
18941
|
+
x: evt.offsetX,
|
|
18942
|
+
y: evt.offsetY,
|
|
18943
|
+
pageNo
|
|
18944
|
+
});
|
|
18945
|
+
const { isDirectHit, isTable, index: index2, trIndex, tdIndex, tdValueIndex, zone: zone2 } = positionContext;
|
|
18946
|
+
if (!isDirectHit || zone2 && zone2 !== this.zone.getZone())
|
|
18947
|
+
return null;
|
|
18948
|
+
let element = null;
|
|
18949
|
+
const elementList = this.draw.getOriginalElementList();
|
|
18950
|
+
let position = null;
|
|
18951
|
+
const positionList = this.position.getOriginalPositionList();
|
|
18952
|
+
if (isTable) {
|
|
18953
|
+
const td = (_b = elementList[index2].trList) == null ? void 0 : _b[trIndex].tdList[tdIndex];
|
|
18954
|
+
element = (td == null ? void 0 : td.value[tdValueIndex]) || null;
|
|
18955
|
+
position = ((_c = td == null ? void 0 : td.positionList) == null ? void 0 : _c[tdValueIndex]) || null;
|
|
18956
|
+
} else {
|
|
18957
|
+
element = elementList[index2] || null;
|
|
18958
|
+
position = positionList[index2] || null;
|
|
18959
|
+
}
|
|
18960
|
+
let rangeRect = null;
|
|
18961
|
+
if (position) {
|
|
18962
|
+
const { pageNo: pageNo2, coordinate: { leftTop, rightTop }, lineHeight } = position;
|
|
18963
|
+
const height = this.draw.getOriginalHeight();
|
|
18964
|
+
const pageGap = this.draw.getOriginalPageGap();
|
|
18965
|
+
rangeRect = {
|
|
18966
|
+
x: leftTop[0],
|
|
18967
|
+
y: leftTop[1] + pageNo2 * (height + pageGap),
|
|
18968
|
+
width: rightTop[0] - leftTop[0],
|
|
18969
|
+
height: lineHeight
|
|
18970
|
+
};
|
|
18971
|
+
}
|
|
18972
|
+
return {
|
|
18973
|
+
pageNo,
|
|
18974
|
+
element,
|
|
18975
|
+
rangeRect
|
|
18976
|
+
};
|
|
18977
|
+
}
|
|
18843
18978
|
insertTitle(payload) {
|
|
18844
18979
|
var _a;
|
|
18845
18980
|
const isReadonly = this.draw.isReadonly();
|