@leafer-ui/draw 1.0.1 → 1.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.
- package/lib/draw.cjs +107 -142
- package/lib/draw.esm.js +107 -142
- package/lib/draw.esm.min.js +1 -1
- package/lib/draw.min.cjs +1 -1
- package/package.json +6 -6
package/lib/draw.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { decorateLeafAttr, attr,
|
|
1
|
+
import { decorateLeafAttr, attr, defineKey, needPlugin, Debug, LeafData, PathConvert, canvasSizeAttrs, dataProcessor, dataType, surfaceType, opacityType, visibleType, sortType, maskType, eraserType, positionType, boundsType, scaleType, rotationType, autoLayoutType, naturalBoundsType, pathInputType, pathType, hitType, strokeType, cursorType, rewrite, Leaf, useModule, rewriteAble, MathHelper, pen, PathCorner, PathDrawer, UICreator, registerUI, Branch, LeafList, ImageManager, DataHelper, Creator, CanvasManager, WaitHelper, LeaferEvent, Bounds, ResizeEvent, AutoBounds, Run, LayoutEvent, RenderEvent, WatchEvent, affectRenderBoundsType, BoundsHelper, Platform, PathCommandDataHelper, affectStrokeBoundsType, getPointData, PointHelper, PathBounds, ImageEvent, LeaferImage, Matrix, PathCreator } from '@leafer/core';
|
|
2
2
|
export * from '@leafer/core';
|
|
3
3
|
|
|
4
4
|
/******************************************************************************
|
|
@@ -30,36 +30,6 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
30
30
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
31
31
|
};
|
|
32
32
|
|
|
33
|
-
const TextConvert = {};
|
|
34
|
-
const ColorConvert = {};
|
|
35
|
-
const PathArrow = {};
|
|
36
|
-
const Paint = {};
|
|
37
|
-
const PaintImage = {};
|
|
38
|
-
const PaintGradient = {};
|
|
39
|
-
const Effect = {};
|
|
40
|
-
const Export = {};
|
|
41
|
-
const State = {};
|
|
42
|
-
|
|
43
|
-
function stateType(defaultValue) {
|
|
44
|
-
return decorateLeafAttr(defaultValue, (key) => attr({
|
|
45
|
-
set(value) {
|
|
46
|
-
this.__setAttr(key, value);
|
|
47
|
-
this.waitLeafer(() => { if (State.setStyle)
|
|
48
|
-
State.setStyle(this, key + 'Style', value); });
|
|
49
|
-
}
|
|
50
|
-
}));
|
|
51
|
-
}
|
|
52
|
-
function arrowType(defaultValue) {
|
|
53
|
-
return decorateLeafAttr(defaultValue, (key) => attr({
|
|
54
|
-
set(value) {
|
|
55
|
-
if (this.__setAttr(key, value)) {
|
|
56
|
-
const data = this.__;
|
|
57
|
-
data.__useArrow = data.startArrow !== 'none' || data.endArrow !== 'none';
|
|
58
|
-
doStrokeType(this);
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
}));
|
|
62
|
-
}
|
|
63
33
|
function effectType(defaultValue) {
|
|
64
34
|
return decorateLeafAttr(defaultValue, (key) => attr({
|
|
65
35
|
set(value) {
|
|
@@ -94,10 +64,33 @@ function zoomLayerType() {
|
|
|
94
64
|
};
|
|
95
65
|
}
|
|
96
66
|
|
|
67
|
+
const TextConvert = {};
|
|
68
|
+
const ColorConvert = {};
|
|
69
|
+
const PathArrow = {};
|
|
70
|
+
const Paint = {};
|
|
71
|
+
const PaintImage = {};
|
|
72
|
+
const PaintGradient = {};
|
|
73
|
+
const Effect = {};
|
|
74
|
+
const Export = {};
|
|
75
|
+
const State = {
|
|
76
|
+
setStyleName(_leaf, _styleName, _value) { return needPlugin('state'); },
|
|
77
|
+
set(_leaf, _stateName) { return needPlugin('state'); }
|
|
78
|
+
};
|
|
79
|
+
const Transition = {
|
|
80
|
+
list: {},
|
|
81
|
+
register(attrName, fn) {
|
|
82
|
+
Transition.list[attrName] = fn;
|
|
83
|
+
},
|
|
84
|
+
get(attrName) {
|
|
85
|
+
return Transition.list[attrName];
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
|
|
97
89
|
const { parse } = PathConvert;
|
|
98
90
|
const emptyPaint = {};
|
|
99
91
|
const debug$1 = Debug.get('UIData');
|
|
100
92
|
class UIData extends LeafData {
|
|
93
|
+
get scale() { const { scaleX, scaleY } = this; return scaleX !== scaleY ? { x: scaleX, y: scaleY } : scaleX; }
|
|
101
94
|
get __strokeWidth() {
|
|
102
95
|
const { strokeWidth, strokeWidthFixed } = this;
|
|
103
96
|
if (strokeWidthFixed) {
|
|
@@ -116,9 +109,10 @@ class UIData extends LeafData {
|
|
|
116
109
|
get __autoSide() { return !this._width || !this._height; }
|
|
117
110
|
get __autoSize() { return !this._width && !this._height; }
|
|
118
111
|
setVisible(value) {
|
|
119
|
-
if (this.__leaf.leafer)
|
|
120
|
-
this.__leaf.leafer.watcher.hasVisible = true;
|
|
121
112
|
this._visible = value;
|
|
113
|
+
const { leafer } = this.__leaf;
|
|
114
|
+
if (leafer)
|
|
115
|
+
leafer.watcher.hasVisible = true;
|
|
122
116
|
}
|
|
123
117
|
setWidth(value) {
|
|
124
118
|
if (value < 0) {
|
|
@@ -242,6 +236,11 @@ class BoxData extends GroupData {
|
|
|
242
236
|
}
|
|
243
237
|
|
|
244
238
|
class LeaferData extends GroupData {
|
|
239
|
+
__getInputData() {
|
|
240
|
+
const data = super.__getInputData();
|
|
241
|
+
canvasSizeAttrs.forEach(key => delete data[key]);
|
|
242
|
+
return data;
|
|
243
|
+
}
|
|
245
244
|
}
|
|
246
245
|
|
|
247
246
|
class FrameData extends BoxData {
|
|
@@ -304,7 +303,7 @@ class ImageData extends RectData {
|
|
|
304
303
|
__setImageFill(value) {
|
|
305
304
|
if (this.__leaf.image)
|
|
306
305
|
this.__leaf.image = null;
|
|
307
|
-
this.fill = value ? { type: 'image', mode: '
|
|
306
|
+
this.fill = value ? { type: 'image', mode: 'stretch', url: value } : undefined;
|
|
308
307
|
}
|
|
309
308
|
__getData() {
|
|
310
309
|
const data = super.__getData();
|
|
@@ -319,6 +318,11 @@ class ImageData extends RectData {
|
|
|
319
318
|
}
|
|
320
319
|
|
|
321
320
|
class CanvasData extends RectData {
|
|
321
|
+
__getInputData() {
|
|
322
|
+
const data = super.__getInputData();
|
|
323
|
+
data.url = this.__leaf.canvas.toDataURL('image/png');
|
|
324
|
+
return data;
|
|
325
|
+
}
|
|
322
326
|
}
|
|
323
327
|
|
|
324
328
|
const UIBounds = {
|
|
@@ -489,19 +493,8 @@ var UI_1;
|
|
|
489
493
|
let UI = UI_1 = class UI extends Leaf {
|
|
490
494
|
get app() { return this.leafer && this.leafer.app; }
|
|
491
495
|
get isFrame() { return false; }
|
|
492
|
-
set scale(value) {
|
|
493
|
-
|
|
494
|
-
this.scaleX = this.scaleY = value;
|
|
495
|
-
}
|
|
496
|
-
else {
|
|
497
|
-
this.scaleX = value.x;
|
|
498
|
-
this.scaleY = value.y;
|
|
499
|
-
}
|
|
500
|
-
}
|
|
501
|
-
get scale() {
|
|
502
|
-
const { scaleX, scaleY } = this;
|
|
503
|
-
return scaleX !== scaleY ? { x: scaleX, y: scaleY } : scaleX;
|
|
504
|
-
}
|
|
496
|
+
set scale(value) { MathHelper.assignScale(this, value); }
|
|
497
|
+
get scale() { return this.__.scale; }
|
|
505
498
|
get pen() {
|
|
506
499
|
const { path } = this.__;
|
|
507
500
|
pen.set(this.path = path || []);
|
|
@@ -516,8 +509,15 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
516
509
|
super(data);
|
|
517
510
|
}
|
|
518
511
|
reset(_data) { }
|
|
519
|
-
set(data) {
|
|
520
|
-
|
|
512
|
+
set(data, isTemp) {
|
|
513
|
+
if (isTemp) {
|
|
514
|
+
this.lockNormalStyle = true;
|
|
515
|
+
Object.assign(this, data);
|
|
516
|
+
this.lockNormalStyle = false;
|
|
517
|
+
}
|
|
518
|
+
else {
|
|
519
|
+
Object.assign(this, data);
|
|
520
|
+
}
|
|
521
521
|
}
|
|
522
522
|
get(name) {
|
|
523
523
|
return typeof name === 'string' ? this.__.__getInput(name) : this.__.__getInputData(name);
|
|
@@ -580,11 +580,18 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
580
580
|
drawer.rect(x, y, width, height);
|
|
581
581
|
}
|
|
582
582
|
}
|
|
583
|
+
animate(_keyframe, _options, _type, _isTemp) {
|
|
584
|
+
return needPlugin('animate');
|
|
585
|
+
}
|
|
586
|
+
killAnimate(_type) { }
|
|
583
587
|
export(filename, options) {
|
|
584
588
|
return Export.export(this, filename, options);
|
|
585
589
|
}
|
|
586
|
-
clone() {
|
|
587
|
-
|
|
590
|
+
clone(newData) {
|
|
591
|
+
const json = this.toJSON();
|
|
592
|
+
if (newData)
|
|
593
|
+
Object.assign(json, newData);
|
|
594
|
+
return UI_1.one(json);
|
|
588
595
|
}
|
|
589
596
|
static one(data, x, y, width, height) {
|
|
590
597
|
return UICreator.get(data.tag || this.prototype.__tag, data, x, y, width, height);
|
|
@@ -600,6 +607,8 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
600
607
|
static setEditInner(_editorName) { }
|
|
601
608
|
destroy() {
|
|
602
609
|
this.fill = this.stroke = null;
|
|
610
|
+
if (this.__animate)
|
|
611
|
+
this.killAnimate();
|
|
603
612
|
super.destroy();
|
|
604
613
|
}
|
|
605
614
|
};
|
|
@@ -627,12 +636,6 @@ __decorate([
|
|
|
627
636
|
__decorate([
|
|
628
637
|
visibleType(true)
|
|
629
638
|
], UI.prototype, "visible", void 0);
|
|
630
|
-
__decorate([
|
|
631
|
-
stateType(false)
|
|
632
|
-
], UI.prototype, "selected", void 0);
|
|
633
|
-
__decorate([
|
|
634
|
-
stateType(false)
|
|
635
|
-
], UI.prototype, "disabled", void 0);
|
|
636
639
|
__decorate([
|
|
637
640
|
surfaceType(false)
|
|
638
641
|
], UI.prototype, "locked", void 0);
|
|
@@ -705,45 +708,9 @@ __decorate([
|
|
|
705
708
|
__decorate([
|
|
706
709
|
pathType(true)
|
|
707
710
|
], UI.prototype, "closed", void 0);
|
|
708
|
-
__decorate([
|
|
709
|
-
autoLayoutType(false)
|
|
710
|
-
], UI.prototype, "flow", void 0);
|
|
711
711
|
__decorate([
|
|
712
712
|
boundsType(0)
|
|
713
713
|
], UI.prototype, "padding", void 0);
|
|
714
|
-
__decorate([
|
|
715
|
-
boundsType(0)
|
|
716
|
-
], UI.prototype, "gap", void 0);
|
|
717
|
-
__decorate([
|
|
718
|
-
boundsType('top-left')
|
|
719
|
-
], UI.prototype, "flowAlign", void 0);
|
|
720
|
-
__decorate([
|
|
721
|
-
boundsType(false)
|
|
722
|
-
], UI.prototype, "flowWrap", void 0);
|
|
723
|
-
__decorate([
|
|
724
|
-
boundsType('box')
|
|
725
|
-
], UI.prototype, "itemBox", void 0);
|
|
726
|
-
__decorate([
|
|
727
|
-
boundsType(true)
|
|
728
|
-
], UI.prototype, "inFlow", void 0);
|
|
729
|
-
__decorate([
|
|
730
|
-
boundsType()
|
|
731
|
-
], UI.prototype, "autoWidth", void 0);
|
|
732
|
-
__decorate([
|
|
733
|
-
boundsType()
|
|
734
|
-
], UI.prototype, "autoHeight", void 0);
|
|
735
|
-
__decorate([
|
|
736
|
-
boundsType()
|
|
737
|
-
], UI.prototype, "lockRatio", void 0);
|
|
738
|
-
__decorate([
|
|
739
|
-
boundsType()
|
|
740
|
-
], UI.prototype, "autoBox", void 0);
|
|
741
|
-
__decorate([
|
|
742
|
-
boundsType()
|
|
743
|
-
], UI.prototype, "widthRange", void 0);
|
|
744
|
-
__decorate([
|
|
745
|
-
boundsType()
|
|
746
|
-
], UI.prototype, "heightRange", void 0);
|
|
747
714
|
__decorate([
|
|
748
715
|
dataType(false)
|
|
749
716
|
], UI.prototype, "draggable", void 0);
|
|
@@ -807,12 +774,6 @@ __decorate([
|
|
|
807
774
|
__decorate([
|
|
808
775
|
strokeType(10)
|
|
809
776
|
], UI.prototype, "miterLimit", void 0);
|
|
810
|
-
__decorate([
|
|
811
|
-
arrowType('none')
|
|
812
|
-
], UI.prototype, "startArrow", void 0);
|
|
813
|
-
__decorate([
|
|
814
|
-
arrowType('none')
|
|
815
|
-
], UI.prototype, "endArrow", void 0);
|
|
816
777
|
__decorate([
|
|
817
778
|
pathType(0)
|
|
818
779
|
], UI.prototype, "cornerRadius", void 0);
|
|
@@ -834,24 +795,6 @@ __decorate([
|
|
|
834
795
|
__decorate([
|
|
835
796
|
effectType()
|
|
836
797
|
], UI.prototype, "grayscale", void 0);
|
|
837
|
-
__decorate([
|
|
838
|
-
dataType()
|
|
839
|
-
], UI.prototype, "normalStyle", void 0);
|
|
840
|
-
__decorate([
|
|
841
|
-
dataType()
|
|
842
|
-
], UI.prototype, "hoverStyle", void 0);
|
|
843
|
-
__decorate([
|
|
844
|
-
dataType()
|
|
845
|
-
], UI.prototype, "pressStyle", void 0);
|
|
846
|
-
__decorate([
|
|
847
|
-
dataType()
|
|
848
|
-
], UI.prototype, "focusStyle", void 0);
|
|
849
|
-
__decorate([
|
|
850
|
-
dataType()
|
|
851
|
-
], UI.prototype, "selectedStyle", void 0);
|
|
852
|
-
__decorate([
|
|
853
|
-
dataType()
|
|
854
|
-
], UI.prototype, "disabledStyle", void 0);
|
|
855
798
|
__decorate([
|
|
856
799
|
dataType({})
|
|
857
800
|
], UI.prototype, "data", void 0);
|
|
@@ -878,7 +821,7 @@ let Group = class Group extends UI {
|
|
|
878
821
|
if (!this.children)
|
|
879
822
|
this.children = [];
|
|
880
823
|
}
|
|
881
|
-
set(data) {
|
|
824
|
+
set(data, isTemp) {
|
|
882
825
|
if (data.children) {
|
|
883
826
|
const { children } = data;
|
|
884
827
|
delete data.children;
|
|
@@ -888,7 +831,7 @@ let Group = class Group extends UI {
|
|
|
888
831
|
else {
|
|
889
832
|
this.clear();
|
|
890
833
|
}
|
|
891
|
-
super.set(data);
|
|
834
|
+
super.set(data, isTemp);
|
|
892
835
|
let child;
|
|
893
836
|
children.forEach(childData => {
|
|
894
837
|
child = childData.__ ? childData : UICreator.get(childData.tag, childData);
|
|
@@ -897,7 +840,7 @@ let Group = class Group extends UI {
|
|
|
897
840
|
data.children = children;
|
|
898
841
|
}
|
|
899
842
|
else {
|
|
900
|
-
super.set(data);
|
|
843
|
+
super.set(data, isTemp);
|
|
901
844
|
}
|
|
902
845
|
}
|
|
903
846
|
toJSON(options) {
|
|
@@ -1224,13 +1167,20 @@ let Leafer = Leafer_1 = class Leafer extends Group {
|
|
|
1224
1167
|
}
|
|
1225
1168
|
}
|
|
1226
1169
|
zoom(_zoomType, _padding, _fixedScale) {
|
|
1227
|
-
return
|
|
1170
|
+
return needPlugin('view');
|
|
1228
1171
|
}
|
|
1229
1172
|
getValidMove(moveX, moveY) { return { x: moveX, y: moveY }; }
|
|
1230
1173
|
getValidScale(changeScale) { return changeScale; }
|
|
1231
1174
|
getWorldPointByClient(clientPoint, updateClient) {
|
|
1232
1175
|
return this.interaction && this.interaction.getLocal(clientPoint, updateClient);
|
|
1233
1176
|
}
|
|
1177
|
+
getPagePointByClient(clientPoint, updateClient) {
|
|
1178
|
+
return this.getPagePoint(this.getWorldPointByClient(clientPoint, updateClient));
|
|
1179
|
+
}
|
|
1180
|
+
updateClientBounds() {
|
|
1181
|
+
this.canvas && this.canvas.updateClientBounds();
|
|
1182
|
+
}
|
|
1183
|
+
receiveEvent(_event) { }
|
|
1234
1184
|
__checkUpdateLayout() {
|
|
1235
1185
|
this.__layout.update();
|
|
1236
1186
|
}
|
|
@@ -1314,7 +1264,7 @@ Rect = __decorate([
|
|
|
1314
1264
|
const rect = Rect.prototype;
|
|
1315
1265
|
const group = Group.prototype;
|
|
1316
1266
|
const childrenRenderBounds = {};
|
|
1317
|
-
const { copy, add, includes: includes$1 } = BoundsHelper;
|
|
1267
|
+
const { copy, add, includes: includes$1, copyAndSpread: copyAndSpread$1 } = BoundsHelper;
|
|
1318
1268
|
let Box = class Box extends Group {
|
|
1319
1269
|
get __tag() { return 'Box'; }
|
|
1320
1270
|
get isBranchLeaf() { return true; }
|
|
@@ -1328,20 +1278,23 @@ let Box = class Box extends Group {
|
|
|
1328
1278
|
return this.__updateRectRenderSpread() || -1;
|
|
1329
1279
|
}
|
|
1330
1280
|
__updateRectBoxBounds() { }
|
|
1331
|
-
__updateBoxBounds() {
|
|
1281
|
+
__updateBoxBounds(secondLayout) {
|
|
1332
1282
|
const data = this.__;
|
|
1333
1283
|
if (this.children.length) {
|
|
1334
1284
|
if (data.__autoSide) {
|
|
1335
1285
|
if (this.leafer && this.leafer.ready)
|
|
1336
1286
|
this.leafer.layouter.addExtra(this);
|
|
1337
1287
|
super.__updateBoxBounds();
|
|
1288
|
+
const { boxBounds } = this.__layout;
|
|
1338
1289
|
if (!data.__autoSize) {
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
b.width += b.x, b.height = data.height, b.y = b.x = 0;
|
|
1290
|
+
if (data.__autoWidth)
|
|
1291
|
+
boxBounds.width += boxBounds.x, boxBounds.height = data.height, boxBounds.y = boxBounds.x = 0;
|
|
1292
|
+
else
|
|
1293
|
+
boxBounds.height += boxBounds.y, boxBounds.width = data.width, boxBounds.x = boxBounds.y = 0;
|
|
1344
1294
|
}
|
|
1295
|
+
if (secondLayout && data.flow && data.padding)
|
|
1296
|
+
copyAndSpread$1(boxBounds, boxBounds, data.padding, false, data.__autoSize ? null : (data.__autoWidth ? 'width' : 'height'));
|
|
1297
|
+
this.__updateNaturalSize();
|
|
1345
1298
|
}
|
|
1346
1299
|
else {
|
|
1347
1300
|
this.__updateRectBoxBounds();
|
|
@@ -1361,13 +1314,13 @@ let Box = class Box extends Group {
|
|
|
1361
1314
|
super.__updateRenderBounds();
|
|
1362
1315
|
copy(childrenRenderBounds, renderBounds);
|
|
1363
1316
|
this.__updateRectRenderBounds();
|
|
1364
|
-
isOverflow = !includes$1(renderBounds, childrenRenderBounds) ||
|
|
1317
|
+
isOverflow = !includes$1(renderBounds, childrenRenderBounds) || !this.pathInputed || !this.__.cornerRadius;
|
|
1365
1318
|
}
|
|
1366
1319
|
else {
|
|
1367
1320
|
this.__updateRectRenderBounds();
|
|
1368
1321
|
}
|
|
1369
1322
|
this.isOverflow !== isOverflow && (this.isOverflow = isOverflow);
|
|
1370
|
-
if (
|
|
1323
|
+
if (!(this.__.__drawAfterFill = this.__.overflow === 'hide') && isOverflow)
|
|
1371
1324
|
add(renderBounds, childrenRenderBounds);
|
|
1372
1325
|
}
|
|
1373
1326
|
__updateRectRenderBounds() { }
|
|
@@ -1701,14 +1654,26 @@ __decorate([
|
|
|
1701
1654
|
Image = __decorate([
|
|
1702
1655
|
registerUI()
|
|
1703
1656
|
], Image);
|
|
1657
|
+
const MyImage = Image;
|
|
1704
1658
|
|
|
1705
1659
|
let Canvas = class Canvas extends Rect {
|
|
1706
1660
|
get __tag() { return 'Canvas'; }
|
|
1661
|
+
get ready() { return !this.url; }
|
|
1707
1662
|
constructor(data) {
|
|
1708
1663
|
super(data);
|
|
1709
1664
|
this.canvas = Creator.canvas(this.__);
|
|
1710
1665
|
this.context = this.canvas.context;
|
|
1711
1666
|
this.__.__isCanvas = this.__.__drawAfterFill = true;
|
|
1667
|
+
if (data && data.url)
|
|
1668
|
+
this.drawImage(data.url);
|
|
1669
|
+
}
|
|
1670
|
+
drawImage(url) {
|
|
1671
|
+
new LeaferImage({ url }).load((image) => {
|
|
1672
|
+
this.context.drawImage(image.view, 0, 0);
|
|
1673
|
+
this.url = undefined;
|
|
1674
|
+
this.paint();
|
|
1675
|
+
this.emitEvent(new ImageEvent(ImageEvent.LOADED, { image }));
|
|
1676
|
+
});
|
|
1712
1677
|
}
|
|
1713
1678
|
draw(ui, offset, scale, rotation) {
|
|
1714
1679
|
ui.__layout.update();
|
|
@@ -1725,19 +1690,18 @@ let Canvas = class Canvas extends Rect {
|
|
|
1725
1690
|
this.paint();
|
|
1726
1691
|
}
|
|
1727
1692
|
paint() {
|
|
1728
|
-
this.
|
|
1693
|
+
this.forceRender();
|
|
1729
1694
|
}
|
|
1730
1695
|
__drawAfterFill(canvas, _options) {
|
|
1731
|
-
const
|
|
1732
|
-
|
|
1733
|
-
if (this.__.cornerRadius || this.pathInputed) {
|
|
1696
|
+
const { width, height, cornerRadius } = this.__, { view } = this.canvas;
|
|
1697
|
+
if (cornerRadius || this.pathInputed) {
|
|
1734
1698
|
canvas.save();
|
|
1735
1699
|
canvas.clip();
|
|
1736
|
-
canvas.drawImage(
|
|
1700
|
+
canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
|
|
1737
1701
|
canvas.restore();
|
|
1738
1702
|
}
|
|
1739
1703
|
else {
|
|
1740
|
-
canvas.drawImage(
|
|
1704
|
+
canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
|
|
1741
1705
|
}
|
|
1742
1706
|
}
|
|
1743
1707
|
__updateSize() {
|
|
@@ -1767,7 +1731,7 @@ __decorate([
|
|
|
1767
1731
|
resizeType(100)
|
|
1768
1732
|
], Canvas.prototype, "height", void 0);
|
|
1769
1733
|
__decorate([
|
|
1770
|
-
resizeType(
|
|
1734
|
+
resizeType(1)
|
|
1771
1735
|
], Canvas.prototype, "pixelRatio", void 0);
|
|
1772
1736
|
__decorate([
|
|
1773
1737
|
resizeType(true)
|
|
@@ -1791,13 +1755,13 @@ let Text = class Text extends UI {
|
|
|
1791
1755
|
super(data);
|
|
1792
1756
|
}
|
|
1793
1757
|
__drawHitPath(canvas) {
|
|
1794
|
-
const { __lineHeight, __baseLine, __textDrawData: data } = this.__;
|
|
1758
|
+
const { __lineHeight, fontSize, __baseLine, __textDrawData: data } = this.__;
|
|
1795
1759
|
canvas.beginPath();
|
|
1796
1760
|
if (this.__.__letterSpacing < 0) {
|
|
1797
1761
|
this.__drawPathByData(canvas);
|
|
1798
1762
|
}
|
|
1799
1763
|
else {
|
|
1800
|
-
data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight));
|
|
1764
|
+
data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
|
|
1801
1765
|
}
|
|
1802
1766
|
}
|
|
1803
1767
|
__drawPathByData(drawer, _data) {
|
|
@@ -1990,7 +1954,8 @@ let Pen = class Pen extends Group {
|
|
|
1990
1954
|
drawPoints(_points, _curve, _close) { return this; }
|
|
1991
1955
|
clearPath() { return this; }
|
|
1992
1956
|
paint() {
|
|
1993
|
-
this.pathElement.
|
|
1957
|
+
if (!this.pathElement.__layout.boxChanged)
|
|
1958
|
+
this.pathElement.forceUpdate('path');
|
|
1994
1959
|
}
|
|
1995
1960
|
};
|
|
1996
1961
|
__decorate([
|
|
@@ -2000,7 +1965,7 @@ __decorate([
|
|
|
2000
1965
|
penPathType()
|
|
2001
1966
|
], Pen.prototype, "path", void 0);
|
|
2002
1967
|
Pen = __decorate([
|
|
2003
|
-
useModule(PathCreator, ['set', 'beginPath', 'path']),
|
|
1968
|
+
useModule(PathCreator, ['set', 'beginPath', 'path', 'paint']),
|
|
2004
1969
|
registerUI()
|
|
2005
1970
|
], Pen);
|
|
2006
1971
|
function penPathType() {
|
|
@@ -2011,4 +1976,4 @@ function penPathType() {
|
|
|
2011
1976
|
};
|
|
2012
1977
|
}
|
|
2013
1978
|
|
|
2014
|
-
export { Box, BoxData, Canvas, CanvasData, ColorConvert, Effect, Ellipse, EllipseData, Export, Frame, FrameData, Group, GroupData, Image, ImageData, Leafer, LeaferData, Line, LineData, Paint, PaintGradient, PaintImage, Path, PathArrow, PathData, Pen, PenData, Polygon, PolygonData, Rect, RectData, RectRender, Star, StarData, State, Text, TextConvert, TextData, UI, UIBounds, UIData, UIRender, UnitConvert,
|
|
1979
|
+
export { Box, BoxData, Canvas, CanvasData, ColorConvert, Effect, Ellipse, EllipseData, Export, Frame, FrameData, Group, GroupData, Image, ImageData, Leafer, LeaferData, Line, LineData, MyImage, Paint, PaintGradient, PaintImage, Path, PathArrow, PathData, Pen, PenData, Polygon, PolygonData, Rect, RectData, RectRender, Star, StarData, State, Text, TextConvert, TextData, Transition, UI, UIBounds, UIData, UIRender, UnitConvert, effectType, resizeType, zoomLayerType };
|
package/lib/draw.esm.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{decorateLeafAttr as t,attr as e,doStrokeType as i,defineKey as s,Debug as o,LeafData as r,PathConvert as a,dataProcessor as n,dataType as _,surfaceType as h,opacityType as d,visibleType as p,sortType as l,maskType as u,eraserType as c,positionType as y,boundsType as v,scaleType as g,rotationType as f,autoLayoutType as w,naturalBoundsType as x,pathInputType as m,pathType as R,hitType as S,strokeType as B,cursorType as k,rewrite as b,Leaf as A,useModule as C,rewriteAble as P,pen as F,PathCorner as E,PathDrawer as L,UICreator as I,registerUI as W,Branch as D,LeafList as T,ImageManager as z,DataHelper as M,Creator as O,CanvasManager as N,WaitHelper as H,LeaferEvent as V,canvasSizeAttrs as Y,Bounds as X,ResizeEvent as U,AutoBounds as j,Run as G,LayoutEvent as J,RenderEvent as $,WatchEvent as K,affectRenderBoundsType as q,BoundsHelper as Q,Platform as Z,PathCommandDataHelper as tt,affectStrokeBoundsType as et,getPointData as it,PointHelper as st,PathBounds as ot,ImageEvent as rt,Matrix as at,MathHelper as nt,PathCreator as _t}from"@leafer/core";export*from"@leafer/core";function ht(t,e,i,s){var o,r=arguments.length,a=r<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,s);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(a=(r<3?o(a):r>3?o(e,i,a):o(e,i))||a);return r>3&&a&&Object.defineProperty(e,i,a),a}"function"==typeof SuppressedError&&SuppressedError;const dt={},pt={},lt={},ut={},ct={},yt={},vt={},gt={},ft={};function wt(i){return t(i,(t=>e({set(e){this.__setAttr(t,e),this.waitLeafer((()=>{ft.setStyle&&ft.setStyle(this,t+"Style",e)}))}})))}function xt(s){return t(s,(t=>e({set(e){if(this.__setAttr(t,e)){const t=this.__;t.__useArrow="none"!==t.startArrow||"none"!==t.endArrow,i(this)}}})))}function mt(i){return t(i,(t=>e({set(e){this.__setAttr(t,e),e&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})))}function Rt(i){return t(i,(t=>e({set(e){this.__setAttr(t,e),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})))}function St(){return(t,e)=>{const i="_"+e;s(t,e,{set(t){this.isLeafer&&(this[i]=t)},get(){return this.isApp?this.tree.zoomLayer:this.isLeafer?this[i]||this:this.leafer&&this.leafer.zoomLayer}})}}const{parse:Bt}=a,kt={},bt=o.get("UIData");class At extends r{get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){const e=this.__leaf;let{scaleX:i}=e.__nowWorld||e.__world;return i<0&&(i=-i),i>1?t/i:t}return t}get __autoWidth(){return!this._width}get __autoHeight(){return!this._height}get __autoSide(){return!this._width||!this._height}get __autoSize(){return!this._width&&!this._height}setVisible(t){this.__leaf.leafer&&(this.__leaf.leafer.watcher.hasVisible=!0),this._visible=t}setWidth(t){t<0?(this._width=-t,this.__leaf.scaleX*=-1,bt.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,bt.warn("height < 0, instead -scaleY",this)):this._height=t}setFill(t){this.__naturalWidth&&this.__removeNaturalSize(),"string"!=typeof t&&t?"object"==typeof t&&(this.__setInput("fill",t),this.__leaf.__layout.boxChanged||this.__leaf.__layout.boxChange(),this.__isFills=!0,this._fill||(this._fill=kt)):(this.__isFills&&(this.__removeInput("fill"),ct.recycleImage("fill",this),this.__isFills=!1,this.__pixelFill&&(this.__pixelFill=!1)),this._fill=t)}setStroke(t){"string"!=typeof t&&t?"object"==typeof t&&(this.__setInput("stroke",t),this.__leaf.__layout.boxChanged||this.__leaf.__layout.boxChange(),this.__isStrokes=!0,this._stroke||(this._stroke=kt)):(this.__isStrokes&&(this.__removeInput("stroke"),ct.recycleImage("stroke",this),this.__isStrokes=!1,this.__pixelStroke&&(this.__pixelStroke=!1)),this._stroke=t)}setPath(t){"string"==typeof t?(this.__setInput("path",t),this._path=Bt(t)):(this.__input&&this.__removeInput("path"),this._path=t)}setShadow(t){this.__setInput("shadow",t),t instanceof Array?(t.some((t=>!1===t.visible))&&(t=t.filter((t=>!1!==t.visible))),this._shadow=t.length?t:null):this._shadow=t?!1===t.visible?null:[t]:null}setInnerShadow(t){this.__setInput("innerShadow",t),t instanceof Array?(t.some((t=>!1===t.visible))&&(t=t.filter((t=>!1!==t.visible))),this._innerShadow=t.length?t:null):this._innerShadow=t?!1===t.visible?null:[t]:null}__computePaint(){const{fill:t,stroke:e}=this.__input;t&&ut.compute("fill",this.__leaf),e&&ut.compute("stroke",this.__leaf),this.__needComputePaint=!1}}const Ct={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value*e:t.value:t};class Pt extends At{}class Ft extends Pt{get __boxStroke(){return!this.__pathInputed}}class Et extends Pt{}class Lt extends Ft{}class It extends At{}class Wt extends At{get __boxStroke(){return!this.__pathInputed}}class Dt extends At{get __boxStroke(){return!this.__pathInputed}}class Tt extends At{}class zt extends At{}class Mt extends At{}class Ot extends Pt{}const Nt={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class Ht extends At{get __useNaturalRatio(){return!1}setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=Nt[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class Vt extends Wt{setUrl(t){this.__setImageFill(t),this._url=t}__setImageFill(t){this.__leaf.image&&(this.__leaf.image=null),this.fill=t?{type:"image",mode:"strench",url:t}:void 0}__getData(){const t=super.__getData();return delete t.fill,t}__getInputData(){const t=super.__getInputData();return delete t.fill,t}}class Yt extends Wt{}const Xt={__updateStrokeSpread(){let t=0,e=0;const i=this.__,{strokeAlign:s,strokeWidth:o}=i;if((i.stroke||"all"===i.hitStroke)&&o&&"inside"!==s&&(e=t="center"===s?o/2:o,!i.__boxStroke)){const e=i.__isLinePath?0:10*t,s="none"===i.strokeCap?0:o;t+=Math.max(e,s)}return i.__useArrow&&(t+=5*o),this.__layout.strokeBoxSpread=e,t},__updateRenderSpread(){let t=0;const{shadow:e,innerShadow:i,blur:s,backgroundBlur:o}=this.__;e&&e.forEach((e=>{t=Math.max(t,Math.max(Math.abs(e.y),Math.abs(e.x))+(e.spread>0?e.spread:0)+1.5*e.blur)})),s&&(t=Math.max(t,s));let r=t=Math.ceil(t);return i&&i.forEach((t=>{r=Math.max(r,Math.max(Math.abs(t.y),Math.abs(t.x))+(t.spread<0?-t.spread:0)+1.5*t.blur)})),o&&(r=Math.max(r,o)),this.__layout.renderShapeSpread=r,t+(this.__layout.strokeSpread||0)}},Ut={__updateChange(){const t=this.__;if(t.__useEffect){const{shadow:e,innerShadow:i,blur:s,backgroundBlur:o}=this.__;t.__useEffect=!!(e||i||s||o)}t.__checkSingle();t.__isFills||t.__isStrokes||t.cornerRadius||t.__useEffect?t.__complex=!0:t.__complex&&(t.__complex=!1)},__drawFast(t,e){jt(this,t,e)},__draw(t,e){const i=this.__;if(i.__complex){i.__needComputePaint&&i.__computePaint();const{fill:s,stroke:o,__drawAfterFill:r}=i;if(this.__drawRenderPath(t),i.__useEffect){const a=ut.shape(this,t,e);this.__nowWorld=this.__getNowWorld(e);const{shadow:n,innerShadow:_}=i;n&&vt.shadow(this,t,a),s&&(i.__isFills?ut.fills(s,this,t):ut.fill(s,this,t)),r&&this.__drawAfterFill(t,e),_&&vt.innerShadow(this,t,a),o&&(i.__isStrokes?ut.strokes(o,this,t):ut.stroke(o,this,t)),a.worldCanvas&&a.worldCanvas.recycle(),a.canvas.recycle()}else s&&(i.__isFills?ut.fills(s,this,t):ut.fill(s,this,t)),r&&this.__drawAfterFill(t,e),o&&(i.__isStrokes?ut.strokes(o,this,t):ut.stroke(o,this,t))}else i.__pathInputed?jt(this,t,e):this.__drawFast(t,e)},__renderShape(t,e,i,s){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:o,stroke:r}=this.__;this.__drawRenderPath(t),o&&!i&&(this.__.__pixelFill?ut.fills(o,this,t):ut.fill("#000000",this,t)),this.__.__isCanvas&&this.__drawAfterFill(t,e),r&&!s&&(this.__.__pixelStroke?ut.strokes(r,this,t):ut.stroke("#000000",this,t))}}};function jt(t,e,i){const{fill:s,stroke:o,__drawAfterFill:r}=t.__;t.__drawRenderPath(e),s&&ut.fill(s,t,e),r&&t.__drawAfterFill(e,i),o&&ut.stroke(o,t,e)}const Gt={__drawFast(t,e){let{width:i,height:s,fill:o,stroke:r,__drawAfterFill:a}=this.__;if(o&&(t.fillStyle=o,t.fillRect(0,0,i,s)),a&&this.__drawAfterFill(t,e),r){const{strokeAlign:o,__strokeWidth:a}=this.__;if(!a)return;t.setStroke(r,a,this.__);const n=a/2;switch(o){case"center":t.strokeRect(0,0,i,s);break;case"inside":i-=a,s-=a,i<0||s<0?(t.save(),this.__clip(t,e),t.strokeRect(n,n,i,s),t.restore()):t.strokeRect(n,n,i,s);break;case"outside":t.strokeRect(-n,-n,i+a,s+a)}}}};var Jt;let $t=Jt=class extends A{get app(){return this.leafer&&this.leafer.app}get isFrame(){return!1}set scale(t){"number"==typeof t?this.scaleX=this.scaleY=t:(this.scaleX=t.x,this.scaleY=t.y)}get scale(){const{scaleX:t,scaleY:e}=this;return t!==e?{x:t,y:e}:t}get pen(){const{path:t}=this.__;return F.set(this.path=t||[]),t||this.__drawPathByBox(F),F}get editConfig(){}get editOuter(){return this.__.__isLinePath?"LineEditTool":"EditTool"}get editInner(){return"PathEditor"}constructor(t){super(t)}reset(t){}set(t){Object.assign(this,t)}get(t){return"string"==typeof t?this.__.__getInput(t):this.__.__getInputData(t)}createProxyData(){}find(t,e){}findTag(t){return this.find({tag:t})}findOne(t,e){}findId(t){return this.findOne({id:t})}getPath(t,e){this.__layout.update();let i=e?this.__.__pathForRender:this.__.path;return i||(F.set(i=[]),this.__drawPathByBox(F)),t?a.toCanvasData(i,!0):i}getPathString(t,e){return a.stringify(this.getPath(t,e))}load(){this.__.__computePaint()}__onUpdateSize(){if(this.__.__input){const t=this.__;!t.lazy||this.__inLazyBounds||gt.running?t.__computePaint():t.__needComputePaint=!0}}__updateRenderPath(){if(this.__.path){const t=this.__;t.__pathForRender=t.cornerRadius?E.smooth(t.path,t.cornerRadius,t.cornerSmoothing):t.path,t.__useArrow&<.addArrows(this,!t.cornerRadius)}}__drawRenderPath(t){t.beginPath(),this.__drawPathByData(t,this.__.__pathForRender)}__drawPath(t){t.beginPath(),this.__drawPathByData(t,this.__.path)}__drawPathByData(t,e){e?L.drawPathByData(t,e):this.__drawPathByBox(t)}__drawPathByBox(t){const{x:e,y:i,width:s,height:o}=this.__layout.boxBounds;if(this.__.cornerRadius){const{cornerRadius:r}=this.__;t.roundRect(e,i,s,o,"number"==typeof r?[r]:r)}else t.rect(e,i,s,o)}export(t,e){return gt.export(this,t,e)}clone(){return Jt.one(this.toJSON())}static one(t,e,i,s,o){return I.get(t.tag||this.prototype.__tag,t,e,i,s,o)}static registerUI(){W()(this)}static registerData(t){n(t)(this.prototype)}static setEditConfig(t){}static setEditOuter(t){}static setEditInner(t){}destroy(){this.fill=this.stroke=null,super.destroy()}};ht([n(At)],$t.prototype,"__",void 0),ht([St()],$t.prototype,"zoomLayer",void 0),ht([_("")],$t.prototype,"id",void 0),ht([_("")],$t.prototype,"name",void 0),ht([_("")],$t.prototype,"className",void 0),ht([h("pass-through")],$t.prototype,"blendMode",void 0),ht([d(1)],$t.prototype,"opacity",void 0),ht([p(!0)],$t.prototype,"visible",void 0),ht([wt(!1)],$t.prototype,"selected",void 0),ht([wt(!1)],$t.prototype,"disabled",void 0),ht([h(!1)],$t.prototype,"locked",void 0),ht([l(0)],$t.prototype,"zIndex",void 0),ht([u(!1)],$t.prototype,"mask",void 0),ht([c(!1)],$t.prototype,"eraser",void 0),ht([y(0,!0)],$t.prototype,"x",void 0),ht([y(0,!0)],$t.prototype,"y",void 0),ht([v(100,!0)],$t.prototype,"width",void 0),ht([v(100,!0)],$t.prototype,"height",void 0),ht([g(1,!0)],$t.prototype,"scaleX",void 0),ht([g(1,!0)],$t.prototype,"scaleY",void 0),ht([f(0,!0)],$t.prototype,"rotation",void 0),ht([f(0,!0)],$t.prototype,"skewX",void 0),ht([f(0,!0)],$t.prototype,"skewY",void 0),ht([y(0,!0)],$t.prototype,"offsetX",void 0),ht([y(0,!0)],$t.prototype,"offsetY",void 0),ht([y(0,!0)],$t.prototype,"scrollX",void 0),ht([y(0,!0)],$t.prototype,"scrollY",void 0),ht([w()],$t.prototype,"origin",void 0),ht([w()],$t.prototype,"around",void 0),ht([_(!1)],$t.prototype,"lazy",void 0),ht([x(1)],$t.prototype,"pixelRatio",void 0),ht([m()],$t.prototype,"path",void 0),ht([R()],$t.prototype,"windingRule",void 0),ht([R(!0)],$t.prototype,"closed",void 0),ht([w(!1)],$t.prototype,"flow",void 0),ht([v(0)],$t.prototype,"padding",void 0),ht([v(0)],$t.prototype,"gap",void 0),ht([v("top-left")],$t.prototype,"flowAlign",void 0),ht([v(!1)],$t.prototype,"flowWrap",void 0),ht([v("box")],$t.prototype,"itemBox",void 0),ht([v(!0)],$t.prototype,"inFlow",void 0),ht([v()],$t.prototype,"autoWidth",void 0),ht([v()],$t.prototype,"autoHeight",void 0),ht([v()],$t.prototype,"lockRatio",void 0),ht([v()],$t.prototype,"autoBox",void 0),ht([v()],$t.prototype,"widthRange",void 0),ht([v()],$t.prototype,"heightRange",void 0),ht([_(!1)],$t.prototype,"draggable",void 0),ht([_()],$t.prototype,"dragBounds",void 0),ht([_(!1)],$t.prototype,"editable",void 0),ht([S(!0)],$t.prototype,"hittable",void 0),ht([S("path")],$t.prototype,"hitFill",void 0),ht([B("path")],$t.prototype,"hitStroke",void 0),ht([S(!1)],$t.prototype,"hitBox",void 0),ht([S(!0)],$t.prototype,"hitChildren",void 0),ht([S(!0)],$t.prototype,"hitSelf",void 0),ht([S()],$t.prototype,"hitRadius",void 0),ht([k("")],$t.prototype,"cursor",void 0),ht([h()],$t.prototype,"fill",void 0),ht([B()],$t.prototype,"stroke",void 0),ht([B("inside")],$t.prototype,"strokeAlign",void 0),ht([B(1)],$t.prototype,"strokeWidth",void 0),ht([B(!1)],$t.prototype,"strokeWidthFixed",void 0),ht([B("none")],$t.prototype,"strokeCap",void 0),ht([B("miter")],$t.prototype,"strokeJoin",void 0),ht([B()],$t.prototype,"dashPattern",void 0),ht([B()],$t.prototype,"dashOffset",void 0),ht([B(10)],$t.prototype,"miterLimit",void 0),ht([xt("none")],$t.prototype,"startArrow",void 0),ht([xt("none")],$t.prototype,"endArrow",void 0),ht([R(0)],$t.prototype,"cornerRadius",void 0),ht([R()],$t.prototype,"cornerSmoothing",void 0),ht([mt()],$t.prototype,"shadow",void 0),ht([mt()],$t.prototype,"innerShadow",void 0),ht([mt()],$t.prototype,"blur",void 0),ht([mt()],$t.prototype,"backgroundBlur",void 0),ht([mt()],$t.prototype,"grayscale",void 0),ht([_()],$t.prototype,"normalStyle",void 0),ht([_()],$t.prototype,"hoverStyle",void 0),ht([_()],$t.prototype,"pressStyle",void 0),ht([_()],$t.prototype,"focusStyle",void 0),ht([_()],$t.prototype,"selectedStyle",void 0),ht([_()],$t.prototype,"disabledStyle",void 0),ht([_({})],$t.prototype,"data",void 0),ht([b(A.prototype.reset)],$t.prototype,"reset",null),$t=Jt=ht([C(Xt),C(Ut),P()],$t);let Kt=class extends $t{get __tag(){return"Group"}get isBranch(){return!0}constructor(t){super(t)}reset(t){this.__setBranch(),super.reset(t)}__setBranch(){this.children||(this.children=[])}set(t){if(t.children){const{children:e}=t;let i;delete t.children,this.children?this.clear():this.__setBranch(),super.set(t),e.forEach((t=>{i=t.__?t:I.get(t.tag,t),this.add(i)})),t.children=e}else super.set(t)}toJSON(t){const e=super.toJSON(t);return e.children=this.children.map((e=>e.toJSON(t))),e}pick(t,e){}addAt(t,e){this.add(t,e)}addAfter(t,e){this.add(t,this.children.indexOf(e)+1)}addBefore(t,e){this.add(t,this.children.indexOf(e))}add(t,e){}addMany(...t){}remove(t,e){}removeAll(t){}clear(){}};var qt;ht([n(Pt)],Kt.prototype,"__",void 0),Kt=ht([C(D),W()],Kt);const Qt=o.get("Leafer");let Zt=qt=class extends Kt{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get isLeafer(){return!0}get imageReady(){return this.viewReady&&z.isComplete}get layoutLocked(){return!this.layouter.running}get FPS(){return this.renderer?this.renderer.FPS:60}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}get clientBounds(){return this.canvas&&this.canvas.getClientBounds()}constructor(t,e){super(e),this.config={type:"design",start:!0,hittable:!0,smooth:!0,lazySpeard:100,zoom:{min:.01,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,autoDistance:2}},this.leafs=0,this.__eventIds=[],this.__controllers=[],this.__readyWait=[],this.__viewReadyWait=[],this.__viewCompletedWait=[],this.__nextRenderWait=[],this.userConfig=t,t&&(t.view||t.width)&&this.init(t),qt.list.add(this)}init(t,e){if(this.canvas)return;let i;this.__setLeafer(this),t&&M.assign(this.config,t);const{config:s}=this;this.initType(s.type);const o=this.canvas=O.canvas(s);this.__controllers.push(this.renderer=O.renderer(this,o,s),this.watcher=O.watcher(this,s),this.layouter=O.layouter(this,s)),this.isApp&&this.__setApp(),this.__checkAutoLayout(s,e),this.view=o.view,e?(this.__bindApp(e),i=e.running):(this.selector=O.selector(this),this.interaction=O.interaction(this,o,this.selector,s),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=O.hitCanvasManager()),this.canvasManager=new N,i=s.start),this.hittable=s.hittable,this.fill=s.fill,this.canvasManager.add(o),this.__listenEvents(),i&&(this.__startTimer=setTimeout(this.start.bind(this))),H.run(this.__initWait),this.onInit()}onInit(){}initType(t){}set(t){this.waitInit((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(V.RESTART):this.emitLeafer(V.START),this.__controllers.forEach((t=>t.start())),this.isApp||this.renderer.render(),this.running=!0)}stop(){clearTimeout(this.__startTimer),this.running&&this.canvas&&(this.__controllers.forEach((t=>t.stop())),this.running=!1,this.emitLeafer(V.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(t){const e=M.copyAttrs({},t,Y);Object.keys(e).forEach((t=>this[t]=e[t]))}forceRender(t){this.renderer.addBlock(t?new X(t):this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}updateLazyBounds(){this.lazyBounds=this.canvas.bounds.clone().spread(this.config.lazySpeard)}__doResize(t){const{canvas:e}=this;if(!e||e.isSameSize(t))return;const i=M.copyAttrs({},this.canvas,Y);e.resize(t),this.updateLazyBounds(),this.__onResize(new U(t,i))}__onResize(t){this.emitEvent(t),M.copyAttrs(this.__,t,Y),t.width&&t.height||Qt.warn("w = 0 or h = 0"),setTimeout((()=>{this.canvasManager&&this.canvasManager.clearRecycled()}),0)}__setApp(){}__bindApp(t){this.selector=t.selector,this.interaction=t.interaction,this.canvasManager=t.canvasManager,this.hitCanvasManager=t.hitCanvasManager}__setLeafer(t){this.leafer=t,this.__level=1}__checkAutoLayout(t,e){e||(t.width&&t.height||(this.autoLayout=new j(t)),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(t,e){return this.canvas&&(Y.includes(t)?(e||Qt.warn(t+" is 0"),this.__changeCanvasSize(t,e)):"fill"===t?this.__changeFill(e):"hittable"===t?this.parent||(this.canvas.hittable=e):"zIndex"===t&&(this.canvas.zIndex=e,setTimeout((()=>this.parent&&this.parent.__updateSortChildren())))),super.__setAttr(t,e)}__getAttr(t){return this.canvas&&Y.includes(t)?this.canvas[t]:super.__getAttr(t)}__changeCanvasSize(t,e){const i=M.copyAttrs({},this.canvas,Y);i[t]=this.config[t]=e,e&&this.canvas.stopAutoLayout(),this.__doResize(i)}__changeFill(t){this.config.fill=t,this.canvas.allowBackgroundColor?this.canvas.backgroundColor=t:this.forceRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(V.BEFORE_READY),this.emitLeafer(V.READY),this.emitLeafer(V.AFTER_READY),H.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(V.VIEW_READY),H.run(this.__viewReadyWait))}__onNextRender(){if(this.viewReady){H.run(this.__nextRenderWait);const{imageReady:t}=this;t&&!this.viewCompleted&&this.__checkViewCompleted(),t||(this.viewCompleted=!1)}}__checkViewCompleted(t=!0){this.nextRender((()=>{this.imageReady&&(t&&this.emitLeafer(V.VIEW_COMPLETED),H.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitInit(t,e){e&&(t=t.bind(e)),this.__initWait||(this.__initWait=[]),this.canvas?t():this.__initWait.push(t)}waitReady(t,e){e&&(t=t.bind(e)),this.ready?t():this.__readyWait.push(t)}waitViewReady(t,e){e&&(t=t.bind(e)),this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t,e){e&&(t=t.bind(e)),this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e,i){e&&(t=t.bind(e));const s=this.__nextRenderWait;if(i){for(let e=0;e<s.length;e++)if(s[e]===t){s.splice(e,1);break}}else s.push(t)}zoom(t,e,i){return Qt.error("need @leafer-in/view")}getValidMove(t,e){return{x:t,y:e}}getValidScale(t){return t}getWorldPointByClient(t,e){return this.interaction&&this.interaction.getLocal(t,e)}__checkUpdateLayout(){this.__layout.update()}emitLeafer(t){this.emitEvent(new V(t,this))}__listenEvents(){const t=G.start("FirstCreate "+this.innerName);this.once(V.START,(()=>G.end(t))),this.once(J.START,(()=>this.updateLazyBounds())),this.once(J.END,(()=>this.__onReady())),this.once($.START,(()=>this.__onCreated())),this.once($.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(K.DATA,this.__onWatchData,this),this.on_($.NEXT,this.__onNextRender,this),this.on_(J.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(t){const e=()=>{if(!this.destroyed){qt.list.remove(this);try{this.stop(),this.emitEvent(new V(V.END,this)),this.__removeListenEvents(),this.__controllers.forEach((t=>{this.parent&&t===this.interaction||t.destroy()})),this.__controllers.length=0,this.parent||(this.selector&&this.selector.destroy(),this.hitCanvasManager&&this.hitCanvasManager.destroy(),this.canvasManager.destroy()),this.canvas.destroy(),this.config.view=this.view=null,this.userConfig&&(this.userConfig.view=null),super.destroy(),setTimeout((()=>{z.clearRecycled()}),100)}catch(t){Qt.error(t)}}};t?e():setTimeout(e)}};Zt.list=new T,ht([n(Et)],Zt.prototype,"__",void 0),ht([v()],Zt.prototype,"pixelRatio",void 0),Zt=qt=ht([W()],Zt);let te=class extends $t{get __tag(){return"Rect"}constructor(t){super(t)}};ht([n(Wt)],te.prototype,"__",void 0),te=ht([C(Gt),P(),W()],te);const ee=te.prototype,ie=Kt.prototype,se={},{copy:oe,add:re,includes:ae}=Q;let ne=class extends Kt{get __tag(){return"Box"}get isBranchLeaf(){return!0}constructor(t){super(t),this.__layout.renderChanged||this.__layout.renderChange()}__updateStrokeSpread(){return 0}__updateRectRenderSpread(){return 0}__updateRenderSpread(){return this.__updateRectRenderSpread()||-1}__updateRectBoxBounds(){}__updateBoxBounds(){const t=this.__;if(this.children.length){if(t.__autoSide){if(this.leafer&&this.leafer.ready&&this.leafer.layouter.addExtra(this),super.__updateBoxBounds(),!t.__autoSize){const e=this.__layout.boxBounds;t.__autoWidth||(e.height+=e.y,e.width=t.width,e.x=e.y=0),t.__autoHeight||(e.width+=e.x,e.height=t.height,e.y=e.x=0)}}else this.__updateRectBoxBounds();t.flow&&this.__updateContentBounds()}else this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){let t;const{renderBounds:e}=this.__layout;this.children.length?(super.__updateRenderBounds(),oe(se,e),this.__updateRectRenderBounds(),t=!ae(e,se)||void 0):this.__updateRectRenderBounds(),this.isOverflow!==t&&(this.isOverflow=t),t&&!(this.__.__drawAfterFill="hide"===this.__.overflow)&&re(e,se)}__updateRectRenderBounds(){}__updateRectChange(){}__updateChange(){super.__updateChange(),this.__updateRectChange()}__renderRect(t,e){}__renderGroup(t,e){}__render(t,e){this.__.__drawAfterFill?this.__renderRect(t,e):(this.__renderRect(t,e),this.children.length&&this.__renderGroup(t,e))}__drawAfterFill(t,e){const{length:i}=this.children;this.isOverflow?(t.save(),t.clip(),i&&this.__renderGroup(t,e),t.restore()):i&&this.__renderGroup(t,e),this.__.stroke&&i&&(t.setWorld(this.__nowWorld),this.__drawRenderPath(t))}};ht([n(Ft)],ne.prototype,"__",void 0),ht([_(!1)],ne.prototype,"resizeChildren",void 0),ht([q("show")],ne.prototype,"overflow",void 0),ht([b(ee.__updateStrokeSpread)],ne.prototype,"__updateStrokeSpread",null),ht([b(ee.__updateRenderSpread)],ne.prototype,"__updateRectRenderSpread",null),ht([b(ee.__updateBoxBounds)],ne.prototype,"__updateRectBoxBounds",null),ht([b(ee.__updateStrokeBounds)],ne.prototype,"__updateStrokeBounds",null),ht([b(ee.__updateRenderBounds)],ne.prototype,"__updateRectRenderBounds",null),ht([b(ee.__updateChange)],ne.prototype,"__updateRectChange",null),ht([b(ee.__render)],ne.prototype,"__renderRect",null),ht([b(ie.__render)],ne.prototype,"__renderGroup",null),ne=ht([P(),W()],ne);let _e=class extends ne{get __tag(){return"Frame"}get isFrame(){return!0}constructor(t){super(t)}};ht([n(Lt)],_e.prototype,"__",void 0),ht([h("#FFFFFF")],_e.prototype,"fill",void 0),ht([q("hide")],_e.prototype,"overflow",void 0),_e=ht([W()],_e);const{moveTo:he,closePath:de,ellipse:pe}=tt;let le=class extends $t{get __tag(){return"Ellipse"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,innerRadius:i,startAngle:s,endAngle:o}=this.__,r=t/2,a=e/2,n=this.__.path=[];i?(s||o?(i<1&&pe(n,r,a,r*i,a*i,0,s,o,!1),pe(n,r,a,r,a,0,o,s,!0),i<1&&de(n)):(i<1&&(pe(n,r,a,r*i,a*i),he(n,t,a)),pe(n,r,a,r,a,0,360,0,!0)),Z.ellipseToCurve&&(this.__.path=this.getPath(!0))):s||o?(he(n,r,a),pe(n,r,a,r,a,0,s,o,!1),de(n)):pe(n,r,a,r,a)}};ht([n(Dt)],le.prototype,"__",void 0),ht([R(0)],le.prototype,"innerRadius",void 0),ht([R(0)],le.prototype,"startAngle",void 0),ht([R(0)],le.prototype,"endAngle",void 0),le=ht([W()],le);const{moveTo:ue,lineTo:ce,drawPoints:ye}=tt,{rotate:ve,getAngle:ge,getDistance:fe,defaultPoint:we}=st,{toBounds:xe}=ot;let me=class extends $t{get __tag(){return"Line"}get toPoint(){const{width:t,rotation:e}=this.__,i=it();return t&&(i.x=t),e&&ve(i,e),i}set toPoint(t){this.width=fe(we,t),this.rotation=ge(we,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__,e=t.path=[];t.points?ye(e,t.points,!1,t.closed):(ue(e,0,0),ce(e,this.width,0))}__updateRenderPath(){const t=this.__;!this.pathInputed&&t.points&&t.curve?(ye(t.__pathForRender=[],t.points,t.curve,t.closed),t.__useArrow&<.addArrows(this,!1)):super.__updateRenderPath()}__updateBoxBounds(){this.points?xe(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}};ht([n(It)],me.prototype,"__",void 0),ht([et("center")],me.prototype,"strokeAlign",void 0),ht([v(0)],me.prototype,"height",void 0),ht([R()],me.prototype,"points",void 0),ht([R(0)],me.prototype,"curve",void 0),ht([R(!1)],me.prototype,"closed",void 0),me=ht([W()],me);const{sin:Re,cos:Se,PI:Be}=Math,{moveTo:ke,lineTo:be,closePath:Ae,drawPoints:Ce}=tt,Pe=me.prototype;let Fe=class extends $t{get __tag(){return"Polygon"}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];if(this.__.points)Ce(t,this.__.points,!1,!0);else{const{width:e,height:i,sides:s}=this.__,o=e/2,r=i/2;ke(t,o,0);for(let e=1;e<s;e++)be(t,o+o*Re(2*e*Be/s),r-r*Se(2*e*Be/s))}Ae(t)}__updateRenderPath(){}__updateBoxBounds(){}};ht([n(Tt)],Fe.prototype,"__",void 0),ht([R(3)],Fe.prototype,"sides",void 0),ht([R()],Fe.prototype,"points",void 0),ht([R(0)],Fe.prototype,"curve",void 0),ht([b(Pe.__updateRenderPath)],Fe.prototype,"__updateRenderPath",null),ht([b(Pe.__updateBoxBounds)],Fe.prototype,"__updateBoxBounds",null),Fe=ht([P(),W()],Fe);const{sin:Ee,cos:Le,PI:Ie}=Math,{moveTo:We,lineTo:De,closePath:Te}=tt;let ze=class extends $t{get __tag(){return"Star"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,corners:i,innerRadius:s}=this.__,o=t/2,r=e/2,a=this.__.path=[];We(a,o,0);for(let t=1;t<2*i;t++)De(a,o+(t%2==0?o:o*s)*Ee(t*Ie/i),r-(t%2==0?r:r*s)*Le(t*Ie/i));Te(a)}};ht([n(zt)],ze.prototype,"__",void 0),ht([R(5)],ze.prototype,"corners",void 0),ht([R(.382)],ze.prototype,"innerRadius",void 0),ze=ht([W()],ze);let Me=class extends te{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(t){super(t),this.on(rt.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}};ht([n(Vt)],Me.prototype,"__",void 0),ht([v("")],Me.prototype,"url",void 0),Me=ht([W()],Me);let Oe=class extends te{get __tag(){return"Canvas"}constructor(t){super(t),this.canvas=O.canvas(this.__),this.context=this.canvas.context,this.__.__isCanvas=this.__.__drawAfterFill=!0}draw(t,e,i,s){t.__layout.update();const o=new at(t.__world).invert(),r=new at;e&&r.translate(e.x,e.y),i&&("number"==typeof i?r.scale(i):r.scale(i.x,i.y)),s&&r.rotate(s),o.multiplyParent(r),t.__render(this.canvas,{matrix:o.withScale()}),this.paint()}paint(){this.forceUpdate("fill")}__drawAfterFill(t,e){const i=this.canvas.view,{width:s,height:o}=this;this.__.cornerRadius||this.pathInputed?(t.save(),t.clip(),t.drawImage(this.canvas.view,0,0,i.width,i.height,0,0,s,o),t.restore()):t.drawImage(this.canvas.view,0,0,i.width,i.height,0,0,s,o)}__updateSize(){const{canvas:t}=this;if(t){const{smooth:e}=this.__;t.smooth!==e&&(t.smooth=e),t.resize(this.__)}}destroy(){this.canvas&&(this.canvas.destroy(),this.canvas=this.context=null),super.destroy()}};ht([n(Yt)],Oe.prototype,"__",void 0),ht([Rt(100)],Oe.prototype,"width",void 0),ht([Rt(100)],Oe.prototype,"height",void 0),ht([Rt(Z.devicePixelRatio)],Oe.prototype,"pixelRatio",void 0),ht([Rt(!0)],Oe.prototype,"smooth",void 0),ht([Rt()],Oe.prototype,"contextSettings",void 0),Oe=ht([W()],Oe);const{copyAndSpread:Ne,includes:He,isSame:Ve,spread:Ye,setList:Xe}=Q;let Ue=class extends $t{get __tag(){return"Text"}get editInner(){return"TextEditor"}get textDrawData(){return this.__layout.update(),this.__.__textDrawData}constructor(t){super(t)}__drawHitPath(t){const{__lineHeight:e,__baseLine:i,__textDrawData:s}=this.__;t.beginPath(),this.__.__letterSpacing<0?this.__drawPathByData(t):s.rows.forEach((s=>t.rect(s.x,s.y-i,s.width,e)))}__drawPathByData(t,e){const{x:i,y:s,width:o,height:r}=this.__layout.boxBounds;t.rect(i,s,o,r)}__drawRenderPath(t){t.font=this.__.__font}__updateTextDrawData(){const t=this.__;t.__textDrawData=dt.getDrawData(t.text,this.__)}__updateBoxBounds(){const t=this.__,e=this.__layout,{lineHeight:i,letterSpacing:s,fontFamily:o,fontSize:r,fontWeight:a,italic:n,textCase:_,textOverflow:h,padding:d}=t,p=t.__autoWidth,l=t.__autoHeight;t.__lineHeight=Ct.number(i,r),t.__letterSpacing=Ct.number(s,r),t.__padding=d?nt.fourNumber(d):void 0,t.__baseLine=t.__lineHeight-(t.__lineHeight-.7*r)/2,t.__font=`${n?"italic ":""}${"small-caps"===_?"small-caps ":""}${"normal"!==a?a+" ":""}${r}px ${o}`,t.__clipText="show"!==h&&!t.__autoSize,this.__updateTextDrawData();const{bounds:u}=t.__textDrawData,c=e.boxBounds;if(t.__lineHeight<r&&Ye(u,r/2),p||l){if(c.x=p?u.x:0,c.y=l?u.y:0,c.width=p?u.width:t.width,c.height=l?u.height:t.height,d){const[e,i,s,o]=t.__padding;p&&(c.x-=o,c.width+=i+o),l&&(c.y-=e,c.height+=s+e)}this.__updateNaturalSize()}else super.__updateBoxBounds();n&&(c.width+=.16*r);const y=He(c,u)?c:u;Ve(y,e.contentBounds)?t.__textBoxBounds=y:(e.contentBounds=y,e.renderChanged=!0,Xe(t.__textBoxBounds={},[c,u]))}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){Ne(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}};ht([n(Ht)],Ue.prototype,"__",void 0),ht([v(0)],Ue.prototype,"width",void 0),ht([v(0)],Ue.prototype,"height",void 0),ht([_(!1)],Ue.prototype,"resizeFontSize",void 0),ht([h("#000000")],Ue.prototype,"fill",void 0),ht([et("outside")],Ue.prototype,"strokeAlign",void 0),ht([S("all")],Ue.prototype,"hitFill",void 0),ht([v("")],Ue.prototype,"text",void 0),ht([v("L")],Ue.prototype,"fontFamily",void 0),ht([v(12)],Ue.prototype,"fontSize",void 0),ht([v("normal")],Ue.prototype,"fontWeight",void 0),ht([v(!1)],Ue.prototype,"italic",void 0),ht([v("none")],Ue.prototype,"textCase",void 0),ht([v("none")],Ue.prototype,"textDecoration",void 0),ht([v(0)],Ue.prototype,"letterSpacing",void 0),ht([v({type:"percent",value:1.5})],Ue.prototype,"lineHeight",void 0),ht([v(0)],Ue.prototype,"paraIndent",void 0),ht([v(0)],Ue.prototype,"paraSpacing",void 0),ht([v("left")],Ue.prototype,"textAlign",void 0),ht([v("top")],Ue.prototype,"verticalAlign",void 0),ht([v("normal")],Ue.prototype,"textWrap",void 0),ht([v("show")],Ue.prototype,"textOverflow",void 0),Ue=ht([W()],Ue);let je=class extends $t{get __tag(){return"Path"}constructor(t){super(t),this.__.__pathInputed=2}};ht([n(Mt)],je.prototype,"__",void 0),ht([et("center")],je.prototype,"strokeAlign",void 0),je=ht([W()],je);let Ge=class extends Kt{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new je(t);return this.pathStyle=t,this.__path=e.path||(e.path=[]),this.add(e),this}beginPath(){return this.__path.length=0,this.paint(),this}moveTo(t,e){return this}lineTo(t,e){return this}bezierCurveTo(t,e,i,s,o,r){return this}quadraticCurveTo(t,e,i,s){return this}closePath(){return this}rect(t,e,i,s){return this}roundRect(t,e,i,s,o){return this}ellipse(t,e,i,s,o,r,a,n){return this}arc(t,e,i,s,o,r){return this}arcTo(t,e,i,s,o){return this}drawEllipse(t,e,i,s,o,r,a,n){return this}drawArc(t,e,i,s,o,r){return this}drawPoints(t,e,i){return this}clearPath(){return this}paint(){this.pathElement.forceUpdate("path")}};ht([n(Ot)],Ge.prototype,"__",void 0),ht([(t,e)=>{s(t,e,{get(){return this.__path}})}],Ge.prototype,"path",void 0),Ge=ht([C(_t,["set","beginPath","path"]),W()],Ge);export{ne as Box,Ft as BoxData,Oe as Canvas,Yt as CanvasData,pt as ColorConvert,vt as Effect,le as Ellipse,Dt as EllipseData,gt as Export,_e as Frame,Lt as FrameData,Kt as Group,Pt as GroupData,Me as Image,Vt as ImageData,Zt as Leafer,Et as LeaferData,me as Line,It as LineData,ut as Paint,yt as PaintGradient,ct as PaintImage,je as Path,lt as PathArrow,Mt as PathData,Ge as Pen,Ot as PenData,Fe as Polygon,Tt as PolygonData,te as Rect,Wt as RectData,Gt as RectRender,ze as Star,zt as StarData,ft as State,Ue as Text,dt as TextConvert,Ht as TextData,$t as UI,Xt as UIBounds,At as UIData,Ut as UIRender,Ct as UnitConvert,xt as arrowType,mt as effectType,Rt as resizeType,wt as stateType,St as zoomLayerType};
|
|
1
|
+
import{decorateLeafAttr as t,attr as e,defineKey as i,needPlugin as s,Debug as o,LeafData as r,PathConvert as a,canvasSizeAttrs as n,dataProcessor as _,dataType as h,surfaceType as d,opacityType as p,visibleType as l,sortType as u,maskType as c,eraserType as y,positionType as g,boundsType as v,scaleType as f,rotationType as w,autoLayoutType as x,naturalBoundsType as m,pathInputType as R,pathType as S,hitType as k,strokeType as B,cursorType as b,rewrite as C,Leaf as P,useModule as A,rewriteAble as I,MathHelper as E,pen as D,PathCorner as F,PathDrawer as L,UICreator as W,registerUI as T,Branch as z,LeafList as M,ImageManager as O,DataHelper as N,Creator as V,CanvasManager as H,WaitHelper as Y,LeaferEvent as j,Bounds as U,ResizeEvent as X,AutoBounds as G,Run as J,LayoutEvent as $,RenderEvent as K,WatchEvent as q,affectRenderBoundsType as Q,BoundsHelper as Z,Platform as tt,PathCommandDataHelper as et,affectStrokeBoundsType as it,getPointData as st,PointHelper as ot,PathBounds as rt,ImageEvent as at,LeaferImage as nt,Matrix as _t,PathCreator as ht}from"@leafer/core";export*from"@leafer/core";function dt(t,e,i,s){var o,r=arguments.length,a=r<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,s);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(a=(r<3?o(a):r>3?o(e,i,a):o(e,i))||a);return r>3&&a&&Object.defineProperty(e,i,a),a}function pt(i){return t(i,(t=>e({set(e){this.__setAttr(t,e),e&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})))}function lt(i){return t(i,(t=>e({set(e){this.__setAttr(t,e),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})))}function ut(){return(t,e)=>{const s="_"+e;i(t,e,{set(t){this.isLeafer&&(this[s]=t)},get(){return this.isApp?this.tree.zoomLayer:this.isLeafer?this[s]||this:this.leafer&&this.leafer.zoomLayer}})}}"function"==typeof SuppressedError&&SuppressedError;const ct={},yt={},gt={},vt={},ft={},wt={},xt={},mt={},Rt={setStyleName:(t,e,i)=>s("state"),set:(t,e)=>s("state")},St={list:{},register(t,e){St.list[t]=e},get:t=>St.list[t]},{parse:kt}=a,Bt={},bt=o.get("UIData");class Ct extends r{get scale(){const{scaleX:t,scaleY:e}=this;return t!==e?{x:t,y:e}:t}get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){const e=this.__leaf;let{scaleX:i}=e.__nowWorld||e.__world;return i<0&&(i=-i),i>1?t/i:t}return t}get __autoWidth(){return!this._width}get __autoHeight(){return!this._height}get __autoSide(){return!this._width||!this._height}get __autoSize(){return!this._width&&!this._height}setVisible(t){this._visible=t;const{leafer:e}=this.__leaf;e&&(e.watcher.hasVisible=!0)}setWidth(t){t<0?(this._width=-t,this.__leaf.scaleX*=-1,bt.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,bt.warn("height < 0, instead -scaleY",this)):this._height=t}setFill(t){this.__naturalWidth&&this.__removeNaturalSize(),"string"!=typeof t&&t?"object"==typeof t&&(this.__setInput("fill",t),this.__leaf.__layout.boxChanged||this.__leaf.__layout.boxChange(),this.__isFills=!0,this._fill||(this._fill=Bt)):(this.__isFills&&(this.__removeInput("fill"),ft.recycleImage("fill",this),this.__isFills=!1,this.__pixelFill&&(this.__pixelFill=!1)),this._fill=t)}setStroke(t){"string"!=typeof t&&t?"object"==typeof t&&(this.__setInput("stroke",t),this.__leaf.__layout.boxChanged||this.__leaf.__layout.boxChange(),this.__isStrokes=!0,this._stroke||(this._stroke=Bt)):(this.__isStrokes&&(this.__removeInput("stroke"),ft.recycleImage("stroke",this),this.__isStrokes=!1,this.__pixelStroke&&(this.__pixelStroke=!1)),this._stroke=t)}setPath(t){"string"==typeof t?(this.__setInput("path",t),this._path=kt(t)):(this.__input&&this.__removeInput("path"),this._path=t)}setShadow(t){this.__setInput("shadow",t),t instanceof Array?(t.some((t=>!1===t.visible))&&(t=t.filter((t=>!1!==t.visible))),this._shadow=t.length?t:null):this._shadow=t?!1===t.visible?null:[t]:null}setInnerShadow(t){this.__setInput("innerShadow",t),t instanceof Array?(t.some((t=>!1===t.visible))&&(t=t.filter((t=>!1!==t.visible))),this._innerShadow=t.length?t:null):this._innerShadow=t?!1===t.visible?null:[t]:null}__computePaint(){const{fill:t,stroke:e}=this.__input;t&&vt.compute("fill",this.__leaf),e&&vt.compute("stroke",this.__leaf),this.__needComputePaint=!1}}const Pt={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value*e:t.value:t};class At extends Ct{}class It extends At{get __boxStroke(){return!this.__pathInputed}}class Et extends At{__getInputData(){const t=super.__getInputData();return n.forEach((e=>delete t[e])),t}}class Dt extends It{}class Ft extends Ct{}class Lt extends Ct{get __boxStroke(){return!this.__pathInputed}}class Wt extends Ct{get __boxStroke(){return!this.__pathInputed}}class Tt extends Ct{}class zt extends Ct{}class Mt extends Ct{}class Ot extends At{}const Nt={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class Vt extends Ct{get __useNaturalRatio(){return!1}setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=Nt[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class Ht extends Lt{setUrl(t){this.__setImageFill(t),this._url=t}__setImageFill(t){this.__leaf.image&&(this.__leaf.image=null),this.fill=t?{type:"image",mode:"stretch",url:t}:void 0}__getData(){const t=super.__getData();return delete t.fill,t}__getInputData(){const t=super.__getInputData();return delete t.fill,t}}class Yt extends Lt{__getInputData(){const t=super.__getInputData();return t.url=this.__leaf.canvas.toDataURL("image/png"),t}}const jt={__updateStrokeSpread(){let t=0,e=0;const i=this.__,{strokeAlign:s,strokeWidth:o}=i;if((i.stroke||"all"===i.hitStroke)&&o&&"inside"!==s&&(e=t="center"===s?o/2:o,!i.__boxStroke)){const e=i.__isLinePath?0:10*t,s="none"===i.strokeCap?0:o;t+=Math.max(e,s)}return i.__useArrow&&(t+=5*o),this.__layout.strokeBoxSpread=e,t},__updateRenderSpread(){let t=0;const{shadow:e,innerShadow:i,blur:s,backgroundBlur:o}=this.__;e&&e.forEach((e=>{t=Math.max(t,Math.max(Math.abs(e.y),Math.abs(e.x))+(e.spread>0?e.spread:0)+1.5*e.blur)})),s&&(t=Math.max(t,s));let r=t=Math.ceil(t);return i&&i.forEach((t=>{r=Math.max(r,Math.max(Math.abs(t.y),Math.abs(t.x))+(t.spread<0?-t.spread:0)+1.5*t.blur)})),o&&(r=Math.max(r,o)),this.__layout.renderShapeSpread=r,t+(this.__layout.strokeSpread||0)}},Ut={__updateChange(){const t=this.__;if(t.__useEffect){const{shadow:e,innerShadow:i,blur:s,backgroundBlur:o}=this.__;t.__useEffect=!!(e||i||s||o)}t.__checkSingle();t.__isFills||t.__isStrokes||t.cornerRadius||t.__useEffect?t.__complex=!0:t.__complex&&(t.__complex=!1)},__drawFast(t,e){Xt(this,t,e)},__draw(t,e){const i=this.__;if(i.__complex){i.__needComputePaint&&i.__computePaint();const{fill:s,stroke:o,__drawAfterFill:r}=i;if(this.__drawRenderPath(t),i.__useEffect){const a=vt.shape(this,t,e);this.__nowWorld=this.__getNowWorld(e);const{shadow:n,innerShadow:_}=i;n&&xt.shadow(this,t,a),s&&(i.__isFills?vt.fills(s,this,t):vt.fill(s,this,t)),r&&this.__drawAfterFill(t,e),_&&xt.innerShadow(this,t,a),o&&(i.__isStrokes?vt.strokes(o,this,t):vt.stroke(o,this,t)),a.worldCanvas&&a.worldCanvas.recycle(),a.canvas.recycle()}else s&&(i.__isFills?vt.fills(s,this,t):vt.fill(s,this,t)),r&&this.__drawAfterFill(t,e),o&&(i.__isStrokes?vt.strokes(o,this,t):vt.stroke(o,this,t))}else i.__pathInputed?Xt(this,t,e):this.__drawFast(t,e)},__renderShape(t,e,i,s){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:o,stroke:r}=this.__;this.__drawRenderPath(t),o&&!i&&(this.__.__pixelFill?vt.fills(o,this,t):vt.fill("#000000",this,t)),this.__.__isCanvas&&this.__drawAfterFill(t,e),r&&!s&&(this.__.__pixelStroke?vt.strokes(r,this,t):vt.stroke("#000000",this,t))}}};function Xt(t,e,i){const{fill:s,stroke:o,__drawAfterFill:r}=t.__;t.__drawRenderPath(e),s&&vt.fill(s,t,e),r&&t.__drawAfterFill(e,i),o&&vt.stroke(o,t,e)}const Gt={__drawFast(t,e){let{width:i,height:s,fill:o,stroke:r,__drawAfterFill:a}=this.__;if(o&&(t.fillStyle=o,t.fillRect(0,0,i,s)),a&&this.__drawAfterFill(t,e),r){const{strokeAlign:o,__strokeWidth:a}=this.__;if(!a)return;t.setStroke(r,a,this.__);const n=a/2;switch(o){case"center":t.strokeRect(0,0,i,s);break;case"inside":i-=a,s-=a,i<0||s<0?(t.save(),this.__clip(t,e),t.strokeRect(n,n,i,s),t.restore()):t.strokeRect(n,n,i,s);break;case"outside":t.strokeRect(-n,-n,i+a,s+a)}}}};var Jt;let $t=Jt=class extends P{get app(){return this.leafer&&this.leafer.app}get isFrame(){return!1}set scale(t){E.assignScale(this,t)}get scale(){return this.__.scale}get pen(){const{path:t}=this.__;return D.set(this.path=t||[]),t||this.__drawPathByBox(D),D}get editConfig(){}get editOuter(){return this.__.__isLinePath?"LineEditTool":"EditTool"}get editInner(){return"PathEditor"}constructor(t){super(t)}reset(t){}set(t,e){e?(this.lockNormalStyle=!0,Object.assign(this,t),this.lockNormalStyle=!1):Object.assign(this,t)}get(t){return"string"==typeof t?this.__.__getInput(t):this.__.__getInputData(t)}createProxyData(){}find(t,e){}findTag(t){return this.find({tag:t})}findOne(t,e){}findId(t){return this.findOne({id:t})}getPath(t,e){this.__layout.update();let i=e?this.__.__pathForRender:this.__.path;return i||(D.set(i=[]),this.__drawPathByBox(D)),t?a.toCanvasData(i,!0):i}getPathString(t,e){return a.stringify(this.getPath(t,e))}load(){this.__.__computePaint()}__onUpdateSize(){if(this.__.__input){const t=this.__;!t.lazy||this.__inLazyBounds||mt.running?t.__computePaint():t.__needComputePaint=!0}}__updateRenderPath(){if(this.__.path){const t=this.__;t.__pathForRender=t.cornerRadius?F.smooth(t.path,t.cornerRadius,t.cornerSmoothing):t.path,t.__useArrow&>.addArrows(this,!t.cornerRadius)}}__drawRenderPath(t){t.beginPath(),this.__drawPathByData(t,this.__.__pathForRender)}__drawPath(t){t.beginPath(),this.__drawPathByData(t,this.__.path)}__drawPathByData(t,e){e?L.drawPathByData(t,e):this.__drawPathByBox(t)}__drawPathByBox(t){const{x:e,y:i,width:s,height:o}=this.__layout.boxBounds;if(this.__.cornerRadius){const{cornerRadius:r}=this.__;t.roundRect(e,i,s,o,"number"==typeof r?[r]:r)}else t.rect(e,i,s,o)}animate(t,e,i,o){return s("animate")}killAnimate(t){}export(t,e){return mt.export(this,t,e)}clone(t){const e=this.toJSON();return t&&Object.assign(e,t),Jt.one(e)}static one(t,e,i,s,o){return W.get(t.tag||this.prototype.__tag,t,e,i,s,o)}static registerUI(){T()(this)}static registerData(t){_(t)(this.prototype)}static setEditConfig(t){}static setEditOuter(t){}static setEditInner(t){}destroy(){this.fill=this.stroke=null,this.__animate&&this.killAnimate(),super.destroy()}};dt([_(Ct)],$t.prototype,"__",void 0),dt([ut()],$t.prototype,"zoomLayer",void 0),dt([h("")],$t.prototype,"id",void 0),dt([h("")],$t.prototype,"name",void 0),dt([h("")],$t.prototype,"className",void 0),dt([d("pass-through")],$t.prototype,"blendMode",void 0),dt([p(1)],$t.prototype,"opacity",void 0),dt([l(!0)],$t.prototype,"visible",void 0),dt([d(!1)],$t.prototype,"locked",void 0),dt([u(0)],$t.prototype,"zIndex",void 0),dt([c(!1)],$t.prototype,"mask",void 0),dt([y(!1)],$t.prototype,"eraser",void 0),dt([g(0,!0)],$t.prototype,"x",void 0),dt([g(0,!0)],$t.prototype,"y",void 0),dt([v(100,!0)],$t.prototype,"width",void 0),dt([v(100,!0)],$t.prototype,"height",void 0),dt([f(1,!0)],$t.prototype,"scaleX",void 0),dt([f(1,!0)],$t.prototype,"scaleY",void 0),dt([w(0,!0)],$t.prototype,"rotation",void 0),dt([w(0,!0)],$t.prototype,"skewX",void 0),dt([w(0,!0)],$t.prototype,"skewY",void 0),dt([g(0,!0)],$t.prototype,"offsetX",void 0),dt([g(0,!0)],$t.prototype,"offsetY",void 0),dt([g(0,!0)],$t.prototype,"scrollX",void 0),dt([g(0,!0)],$t.prototype,"scrollY",void 0),dt([x()],$t.prototype,"origin",void 0),dt([x()],$t.prototype,"around",void 0),dt([h(!1)],$t.prototype,"lazy",void 0),dt([m(1)],$t.prototype,"pixelRatio",void 0),dt([R()],$t.prototype,"path",void 0),dt([S()],$t.prototype,"windingRule",void 0),dt([S(!0)],$t.prototype,"closed",void 0),dt([v(0)],$t.prototype,"padding",void 0),dt([h(!1)],$t.prototype,"draggable",void 0),dt([h()],$t.prototype,"dragBounds",void 0),dt([h(!1)],$t.prototype,"editable",void 0),dt([k(!0)],$t.prototype,"hittable",void 0),dt([k("path")],$t.prototype,"hitFill",void 0),dt([B("path")],$t.prototype,"hitStroke",void 0),dt([k(!1)],$t.prototype,"hitBox",void 0),dt([k(!0)],$t.prototype,"hitChildren",void 0),dt([k(!0)],$t.prototype,"hitSelf",void 0),dt([k()],$t.prototype,"hitRadius",void 0),dt([b("")],$t.prototype,"cursor",void 0),dt([d()],$t.prototype,"fill",void 0),dt([B()],$t.prototype,"stroke",void 0),dt([B("inside")],$t.prototype,"strokeAlign",void 0),dt([B(1)],$t.prototype,"strokeWidth",void 0),dt([B(!1)],$t.prototype,"strokeWidthFixed",void 0),dt([B("none")],$t.prototype,"strokeCap",void 0),dt([B("miter")],$t.prototype,"strokeJoin",void 0),dt([B()],$t.prototype,"dashPattern",void 0),dt([B()],$t.prototype,"dashOffset",void 0),dt([B(10)],$t.prototype,"miterLimit",void 0),dt([S(0)],$t.prototype,"cornerRadius",void 0),dt([S()],$t.prototype,"cornerSmoothing",void 0),dt([pt()],$t.prototype,"shadow",void 0),dt([pt()],$t.prototype,"innerShadow",void 0),dt([pt()],$t.prototype,"blur",void 0),dt([pt()],$t.prototype,"backgroundBlur",void 0),dt([pt()],$t.prototype,"grayscale",void 0),dt([h({})],$t.prototype,"data",void 0),dt([C(P.prototype.reset)],$t.prototype,"reset",null),$t=Jt=dt([A(jt),A(Ut),I()],$t);let Kt=class extends $t{get __tag(){return"Group"}get isBranch(){return!0}constructor(t){super(t)}reset(t){this.__setBranch(),super.reset(t)}__setBranch(){this.children||(this.children=[])}set(t,e){if(t.children){const{children:i}=t;let s;delete t.children,this.children?this.clear():this.__setBranch(),super.set(t,e),i.forEach((t=>{s=t.__?t:W.get(t.tag,t),this.add(s)})),t.children=i}else super.set(t,e)}toJSON(t){const e=super.toJSON(t);return e.children=this.children.map((e=>e.toJSON(t))),e}pick(t,e){}addAt(t,e){this.add(t,e)}addAfter(t,e){this.add(t,this.children.indexOf(e)+1)}addBefore(t,e){this.add(t,this.children.indexOf(e))}add(t,e){}addMany(...t){}remove(t,e){}removeAll(t){}clear(){}};var qt;dt([_(At)],Kt.prototype,"__",void 0),Kt=dt([A(z),T()],Kt);const Qt=o.get("Leafer");let Zt=qt=class extends Kt{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get isLeafer(){return!0}get imageReady(){return this.viewReady&&O.isComplete}get layoutLocked(){return!this.layouter.running}get FPS(){return this.renderer?this.renderer.FPS:60}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}get clientBounds(){return this.canvas&&this.canvas.getClientBounds()}constructor(t,e){super(e),this.config={type:"design",start:!0,hittable:!0,smooth:!0,lazySpeard:100,zoom:{min:.01,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,autoDistance:2}},this.leafs=0,this.__eventIds=[],this.__controllers=[],this.__readyWait=[],this.__viewReadyWait=[],this.__viewCompletedWait=[],this.__nextRenderWait=[],this.userConfig=t,t&&(t.view||t.width)&&this.init(t),qt.list.add(this)}init(t,e){if(this.canvas)return;let i;this.__setLeafer(this),t&&N.assign(this.config,t);const{config:s}=this;this.initType(s.type);const o=this.canvas=V.canvas(s);this.__controllers.push(this.renderer=V.renderer(this,o,s),this.watcher=V.watcher(this,s),this.layouter=V.layouter(this,s)),this.isApp&&this.__setApp(),this.__checkAutoLayout(s,e),this.view=o.view,e?(this.__bindApp(e),i=e.running):(this.selector=V.selector(this),this.interaction=V.interaction(this,o,this.selector,s),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=V.hitCanvasManager()),this.canvasManager=new H,i=s.start),this.hittable=s.hittable,this.fill=s.fill,this.canvasManager.add(o),this.__listenEvents(),i&&(this.__startTimer=setTimeout(this.start.bind(this))),Y.run(this.__initWait),this.onInit()}onInit(){}initType(t){}set(t){this.waitInit((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(j.RESTART):this.emitLeafer(j.START),this.__controllers.forEach((t=>t.start())),this.isApp||this.renderer.render(),this.running=!0)}stop(){clearTimeout(this.__startTimer),this.running&&this.canvas&&(this.__controllers.forEach((t=>t.stop())),this.running=!1,this.emitLeafer(j.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(t){const e=N.copyAttrs({},t,n);Object.keys(e).forEach((t=>this[t]=e[t]))}forceRender(t){this.renderer.addBlock(t?new U(t):this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}updateLazyBounds(){this.lazyBounds=this.canvas.bounds.clone().spread(this.config.lazySpeard)}__doResize(t){const{canvas:e}=this;if(!e||e.isSameSize(t))return;const i=N.copyAttrs({},this.canvas,n);e.resize(t),this.updateLazyBounds(),this.__onResize(new X(t,i))}__onResize(t){this.emitEvent(t),N.copyAttrs(this.__,t,n),t.width&&t.height||Qt.warn("w = 0 or h = 0"),setTimeout((()=>{this.canvasManager&&this.canvasManager.clearRecycled()}),0)}__setApp(){}__bindApp(t){this.selector=t.selector,this.interaction=t.interaction,this.canvasManager=t.canvasManager,this.hitCanvasManager=t.hitCanvasManager}__setLeafer(t){this.leafer=t,this.__level=1}__checkAutoLayout(t,e){e||(t.width&&t.height||(this.autoLayout=new G(t)),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(t,e){return this.canvas&&(n.includes(t)?(e||Qt.warn(t+" is 0"),this.__changeCanvasSize(t,e)):"fill"===t?this.__changeFill(e):"hittable"===t?this.parent||(this.canvas.hittable=e):"zIndex"===t&&(this.canvas.zIndex=e,setTimeout((()=>this.parent&&this.parent.__updateSortChildren())))),super.__setAttr(t,e)}__getAttr(t){return this.canvas&&n.includes(t)?this.canvas[t]:super.__getAttr(t)}__changeCanvasSize(t,e){const i=N.copyAttrs({},this.canvas,n);i[t]=this.config[t]=e,e&&this.canvas.stopAutoLayout(),this.__doResize(i)}__changeFill(t){this.config.fill=t,this.canvas.allowBackgroundColor?this.canvas.backgroundColor=t:this.forceRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(j.BEFORE_READY),this.emitLeafer(j.READY),this.emitLeafer(j.AFTER_READY),Y.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(j.VIEW_READY),Y.run(this.__viewReadyWait))}__onNextRender(){if(this.viewReady){Y.run(this.__nextRenderWait);const{imageReady:t}=this;t&&!this.viewCompleted&&this.__checkViewCompleted(),t||(this.viewCompleted=!1)}}__checkViewCompleted(t=!0){this.nextRender((()=>{this.imageReady&&(t&&this.emitLeafer(j.VIEW_COMPLETED),Y.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitInit(t,e){e&&(t=t.bind(e)),this.__initWait||(this.__initWait=[]),this.canvas?t():this.__initWait.push(t)}waitReady(t,e){e&&(t=t.bind(e)),this.ready?t():this.__readyWait.push(t)}waitViewReady(t,e){e&&(t=t.bind(e)),this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t,e){e&&(t=t.bind(e)),this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e,i){e&&(t=t.bind(e));const s=this.__nextRenderWait;if(i){for(let e=0;e<s.length;e++)if(s[e]===t){s.splice(e,1);break}}else s.push(t)}zoom(t,e,i){return s("view")}getValidMove(t,e){return{x:t,y:e}}getValidScale(t){return t}getWorldPointByClient(t,e){return this.interaction&&this.interaction.getLocal(t,e)}getPagePointByClient(t,e){return this.getPagePoint(this.getWorldPointByClient(t,e))}updateClientBounds(){this.canvas&&this.canvas.updateClientBounds()}receiveEvent(t){}__checkUpdateLayout(){this.__layout.update()}emitLeafer(t){this.emitEvent(new j(t,this))}__listenEvents(){const t=J.start("FirstCreate "+this.innerName);this.once(j.START,(()=>J.end(t))),this.once($.START,(()=>this.updateLazyBounds())),this.once($.END,(()=>this.__onReady())),this.once(K.START,(()=>this.__onCreated())),this.once(K.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(q.DATA,this.__onWatchData,this),this.on_(K.NEXT,this.__onNextRender,this),this.on_($.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(t){const e=()=>{if(!this.destroyed){qt.list.remove(this);try{this.stop(),this.emitEvent(new j(j.END,this)),this.__removeListenEvents(),this.__controllers.forEach((t=>{this.parent&&t===this.interaction||t.destroy()})),this.__controllers.length=0,this.parent||(this.selector&&this.selector.destroy(),this.hitCanvasManager&&this.hitCanvasManager.destroy(),this.canvasManager.destroy()),this.canvas.destroy(),this.config.view=this.view=null,this.userConfig&&(this.userConfig.view=null),super.destroy(),setTimeout((()=>{O.clearRecycled()}),100)}catch(t){Qt.error(t)}}};t?e():setTimeout(e)}};Zt.list=new M,dt([_(Et)],Zt.prototype,"__",void 0),dt([v()],Zt.prototype,"pixelRatio",void 0),Zt=qt=dt([T()],Zt);let te=class extends $t{get __tag(){return"Rect"}constructor(t){super(t)}};dt([_(Lt)],te.prototype,"__",void 0),te=dt([A(Gt),I(),T()],te);const ee=te.prototype,ie=Kt.prototype,se={},{copy:oe,add:re,includes:ae,copyAndSpread:ne}=Z;let _e=class extends Kt{get __tag(){return"Box"}get isBranchLeaf(){return!0}constructor(t){super(t),this.__layout.renderChanged||this.__layout.renderChange()}__updateStrokeSpread(){return 0}__updateRectRenderSpread(){return 0}__updateRenderSpread(){return this.__updateRectRenderSpread()||-1}__updateRectBoxBounds(){}__updateBoxBounds(t){const e=this.__;if(this.children.length){if(e.__autoSide){this.leafer&&this.leafer.ready&&this.leafer.layouter.addExtra(this),super.__updateBoxBounds();const{boxBounds:i}=this.__layout;e.__autoSize||(e.__autoWidth?(i.width+=i.x,i.height=e.height,i.y=i.x=0):(i.height+=i.y,i.width=e.width,i.x=i.y=0)),t&&e.flow&&e.padding&&ne(i,i,e.padding,!1,e.__autoSize?null:e.__autoWidth?"width":"height"),this.__updateNaturalSize()}else this.__updateRectBoxBounds();e.flow&&this.__updateContentBounds()}else this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){let t;const{renderBounds:e}=this.__layout;this.children.length?(super.__updateRenderBounds(),oe(se,e),this.__updateRectRenderBounds(),t=!ae(e,se)||!this.pathInputed||!this.__.cornerRadius):this.__updateRectRenderBounds(),this.isOverflow!==t&&(this.isOverflow=t),!(this.__.__drawAfterFill="hide"===this.__.overflow)&&t&&re(e,se)}__updateRectRenderBounds(){}__updateRectChange(){}__updateChange(){super.__updateChange(),this.__updateRectChange()}__renderRect(t,e){}__renderGroup(t,e){}__render(t,e){this.__.__drawAfterFill?this.__renderRect(t,e):(this.__renderRect(t,e),this.children.length&&this.__renderGroup(t,e))}__drawAfterFill(t,e){const{length:i}=this.children;this.isOverflow?(t.save(),t.clip(),i&&this.__renderGroup(t,e),t.restore()):i&&this.__renderGroup(t,e),this.__.stroke&&i&&(t.setWorld(this.__nowWorld),this.__drawRenderPath(t))}};dt([_(It)],_e.prototype,"__",void 0),dt([h(!1)],_e.prototype,"resizeChildren",void 0),dt([Q("show")],_e.prototype,"overflow",void 0),dt([C(ee.__updateStrokeSpread)],_e.prototype,"__updateStrokeSpread",null),dt([C(ee.__updateRenderSpread)],_e.prototype,"__updateRectRenderSpread",null),dt([C(ee.__updateBoxBounds)],_e.prototype,"__updateRectBoxBounds",null),dt([C(ee.__updateStrokeBounds)],_e.prototype,"__updateStrokeBounds",null),dt([C(ee.__updateRenderBounds)],_e.prototype,"__updateRectRenderBounds",null),dt([C(ee.__updateChange)],_e.prototype,"__updateRectChange",null),dt([C(ee.__render)],_e.prototype,"__renderRect",null),dt([C(ie.__render)],_e.prototype,"__renderGroup",null),_e=dt([I(),T()],_e);let he=class extends _e{get __tag(){return"Frame"}get isFrame(){return!0}constructor(t){super(t)}};dt([_(Dt)],he.prototype,"__",void 0),dt([d("#FFFFFF")],he.prototype,"fill",void 0),dt([Q("hide")],he.prototype,"overflow",void 0),he=dt([T()],he);const{moveTo:de,closePath:pe,ellipse:le}=et;let ue=class extends $t{get __tag(){return"Ellipse"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,innerRadius:i,startAngle:s,endAngle:o}=this.__,r=t/2,a=e/2,n=this.__.path=[];i?(s||o?(i<1&&le(n,r,a,r*i,a*i,0,s,o,!1),le(n,r,a,r,a,0,o,s,!0),i<1&&pe(n)):(i<1&&(le(n,r,a,r*i,a*i),de(n,t,a)),le(n,r,a,r,a,0,360,0,!0)),tt.ellipseToCurve&&(this.__.path=this.getPath(!0))):s||o?(de(n,r,a),le(n,r,a,r,a,0,s,o,!1),pe(n)):le(n,r,a,r,a)}};dt([_(Wt)],ue.prototype,"__",void 0),dt([S(0)],ue.prototype,"innerRadius",void 0),dt([S(0)],ue.prototype,"startAngle",void 0),dt([S(0)],ue.prototype,"endAngle",void 0),ue=dt([T()],ue);const{moveTo:ce,lineTo:ye,drawPoints:ge}=et,{rotate:ve,getAngle:fe,getDistance:we,defaultPoint:xe}=ot,{toBounds:me}=rt;let Re=class extends $t{get __tag(){return"Line"}get toPoint(){const{width:t,rotation:e}=this.__,i=st();return t&&(i.x=t),e&&ve(i,e),i}set toPoint(t){this.width=we(xe,t),this.rotation=fe(xe,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__,e=t.path=[];t.points?ge(e,t.points,!1,t.closed):(ce(e,0,0),ye(e,this.width,0))}__updateRenderPath(){const t=this.__;!this.pathInputed&&t.points&&t.curve?(ge(t.__pathForRender=[],t.points,t.curve,t.closed),t.__useArrow&>.addArrows(this,!1)):super.__updateRenderPath()}__updateBoxBounds(){this.points?me(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}};dt([_(Ft)],Re.prototype,"__",void 0),dt([it("center")],Re.prototype,"strokeAlign",void 0),dt([v(0)],Re.prototype,"height",void 0),dt([S()],Re.prototype,"points",void 0),dt([S(0)],Re.prototype,"curve",void 0),dt([S(!1)],Re.prototype,"closed",void 0),Re=dt([T()],Re);const{sin:Se,cos:ke,PI:Be}=Math,{moveTo:be,lineTo:Ce,closePath:Pe,drawPoints:Ae}=et,Ie=Re.prototype;let Ee=class extends $t{get __tag(){return"Polygon"}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];if(this.__.points)Ae(t,this.__.points,!1,!0);else{const{width:e,height:i,sides:s}=this.__,o=e/2,r=i/2;be(t,o,0);for(let e=1;e<s;e++)Ce(t,o+o*Se(2*e*Be/s),r-r*ke(2*e*Be/s))}Pe(t)}__updateRenderPath(){}__updateBoxBounds(){}};dt([_(Tt)],Ee.prototype,"__",void 0),dt([S(3)],Ee.prototype,"sides",void 0),dt([S()],Ee.prototype,"points",void 0),dt([S(0)],Ee.prototype,"curve",void 0),dt([C(Ie.__updateRenderPath)],Ee.prototype,"__updateRenderPath",null),dt([C(Ie.__updateBoxBounds)],Ee.prototype,"__updateBoxBounds",null),Ee=dt([I(),T()],Ee);const{sin:De,cos:Fe,PI:Le}=Math,{moveTo:We,lineTo:Te,closePath:ze}=et;let Me=class extends $t{get __tag(){return"Star"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,corners:i,innerRadius:s}=this.__,o=t/2,r=e/2,a=this.__.path=[];We(a,o,0);for(let t=1;t<2*i;t++)Te(a,o+(t%2==0?o:o*s)*De(t*Le/i),r-(t%2==0?r:r*s)*Fe(t*Le/i));ze(a)}};dt([_(zt)],Me.prototype,"__",void 0),dt([S(5)],Me.prototype,"corners",void 0),dt([S(.382)],Me.prototype,"innerRadius",void 0),Me=dt([T()],Me);let Oe=class extends te{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(t){super(t),this.on(at.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}};dt([_(Ht)],Oe.prototype,"__",void 0),dt([v("")],Oe.prototype,"url",void 0),Oe=dt([T()],Oe);const Ne=Oe;let Ve=class extends te{get __tag(){return"Canvas"}get ready(){return!this.url}constructor(t){super(t),this.canvas=V.canvas(this.__),this.context=this.canvas.context,this.__.__isCanvas=this.__.__drawAfterFill=!0,t&&t.url&&this.drawImage(t.url)}drawImage(t){new nt({url:t}).load((t=>{this.context.drawImage(t.view,0,0),this.url=void 0,this.paint(),this.emitEvent(new at(at.LOADED,{image:t}))}))}draw(t,e,i,s){t.__layout.update();const o=new _t(t.__world).invert(),r=new _t;e&&r.translate(e.x,e.y),i&&("number"==typeof i?r.scale(i):r.scale(i.x,i.y)),s&&r.rotate(s),o.multiplyParent(r),t.__render(this.canvas,{matrix:o.withScale()}),this.paint()}paint(){this.forceRender()}__drawAfterFill(t,e){const{width:i,height:s,cornerRadius:o}=this.__,{view:r}=this.canvas;o||this.pathInputed?(t.save(),t.clip(),t.drawImage(r,0,0,r.width,r.height,0,0,i,s),t.restore()):t.drawImage(r,0,0,r.width,r.height,0,0,i,s)}__updateSize(){const{canvas:t}=this;if(t){const{smooth:e}=this.__;t.smooth!==e&&(t.smooth=e),t.resize(this.__)}}destroy(){this.canvas&&(this.canvas.destroy(),this.canvas=this.context=null),super.destroy()}};dt([_(Yt)],Ve.prototype,"__",void 0),dt([lt(100)],Ve.prototype,"width",void 0),dt([lt(100)],Ve.prototype,"height",void 0),dt([lt(1)],Ve.prototype,"pixelRatio",void 0),dt([lt(!0)],Ve.prototype,"smooth",void 0),dt([lt()],Ve.prototype,"contextSettings",void 0),Ve=dt([T()],Ve);const{copyAndSpread:He,includes:Ye,isSame:je,spread:Ue,setList:Xe}=Z;let Ge=class extends $t{get __tag(){return"Text"}get editInner(){return"TextEditor"}get textDrawData(){return this.__layout.update(),this.__.__textDrawData}constructor(t){super(t)}__drawHitPath(t){const{__lineHeight:e,fontSize:i,__baseLine:s,__textDrawData:o}=this.__;t.beginPath(),this.__.__letterSpacing<0?this.__drawPathByData(t):o.rows.forEach((o=>t.rect(o.x,o.y-s,o.width,e<i?i:e)))}__drawPathByData(t,e){const{x:i,y:s,width:o,height:r}=this.__layout.boxBounds;t.rect(i,s,o,r)}__drawRenderPath(t){t.font=this.__.__font}__updateTextDrawData(){const t=this.__;t.__textDrawData=ct.getDrawData(t.text,this.__)}__updateBoxBounds(){const t=this.__,e=this.__layout,{lineHeight:i,letterSpacing:s,fontFamily:o,fontSize:r,fontWeight:a,italic:n,textCase:_,textOverflow:h,padding:d}=t,p=t.__autoWidth,l=t.__autoHeight;t.__lineHeight=Pt.number(i,r),t.__letterSpacing=Pt.number(s,r),t.__padding=d?E.fourNumber(d):void 0,t.__baseLine=t.__lineHeight-(t.__lineHeight-.7*r)/2,t.__font=`${n?"italic ":""}${"small-caps"===_?"small-caps ":""}${"normal"!==a?a+" ":""}${r}px ${o}`,t.__clipText="show"!==h&&!t.__autoSize,this.__updateTextDrawData();const{bounds:u}=t.__textDrawData,c=e.boxBounds;if(t.__lineHeight<r&&Ue(u,r/2),p||l){if(c.x=p?u.x:0,c.y=l?u.y:0,c.width=p?u.width:t.width,c.height=l?u.height:t.height,d){const[e,i,s,o]=t.__padding;p&&(c.x-=o,c.width+=i+o),l&&(c.y-=e,c.height+=s+e)}this.__updateNaturalSize()}else super.__updateBoxBounds();n&&(c.width+=.16*r);const y=Ye(c,u)?c:u;je(y,e.contentBounds)?t.__textBoxBounds=y:(e.contentBounds=y,e.renderChanged=!0,Xe(t.__textBoxBounds={},[c,u]))}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){He(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}};dt([_(Vt)],Ge.prototype,"__",void 0),dt([v(0)],Ge.prototype,"width",void 0),dt([v(0)],Ge.prototype,"height",void 0),dt([h(!1)],Ge.prototype,"resizeFontSize",void 0),dt([d("#000000")],Ge.prototype,"fill",void 0),dt([it("outside")],Ge.prototype,"strokeAlign",void 0),dt([k("all")],Ge.prototype,"hitFill",void 0),dt([v("")],Ge.prototype,"text",void 0),dt([v("L")],Ge.prototype,"fontFamily",void 0),dt([v(12)],Ge.prototype,"fontSize",void 0),dt([v("normal")],Ge.prototype,"fontWeight",void 0),dt([v(!1)],Ge.prototype,"italic",void 0),dt([v("none")],Ge.prototype,"textCase",void 0),dt([v("none")],Ge.prototype,"textDecoration",void 0),dt([v(0)],Ge.prototype,"letterSpacing",void 0),dt([v({type:"percent",value:1.5})],Ge.prototype,"lineHeight",void 0),dt([v(0)],Ge.prototype,"paraIndent",void 0),dt([v(0)],Ge.prototype,"paraSpacing",void 0),dt([v("left")],Ge.prototype,"textAlign",void 0),dt([v("top")],Ge.prototype,"verticalAlign",void 0),dt([v("normal")],Ge.prototype,"textWrap",void 0),dt([v("show")],Ge.prototype,"textOverflow",void 0),Ge=dt([T()],Ge);let Je=class extends $t{get __tag(){return"Path"}constructor(t){super(t),this.__.__pathInputed=2}};dt([_(Mt)],Je.prototype,"__",void 0),dt([it("center")],Je.prototype,"strokeAlign",void 0),Je=dt([T()],Je);let $e=class extends Kt{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new Je(t);return this.pathStyle=t,this.__path=e.path||(e.path=[]),this.add(e),this}beginPath(){return this.__path.length=0,this.paint(),this}moveTo(t,e){return this}lineTo(t,e){return this}bezierCurveTo(t,e,i,s,o,r){return this}quadraticCurveTo(t,e,i,s){return this}closePath(){return this}rect(t,e,i,s){return this}roundRect(t,e,i,s,o){return this}ellipse(t,e,i,s,o,r,a,n){return this}arc(t,e,i,s,o,r){return this}arcTo(t,e,i,s,o){return this}drawEllipse(t,e,i,s,o,r,a,n){return this}drawArc(t,e,i,s,o,r){return this}drawPoints(t,e,i){return this}clearPath(){return this}paint(){this.pathElement.__layout.boxChanged||this.pathElement.forceUpdate("path")}};dt([_(Ot)],$e.prototype,"__",void 0),dt([(t,e)=>{i(t,e,{get(){return this.__path}})}],$e.prototype,"path",void 0),$e=dt([A(ht,["set","beginPath","path","paint"]),T()],$e);export{_e as Box,It as BoxData,Ve as Canvas,Yt as CanvasData,yt as ColorConvert,xt as Effect,ue as Ellipse,Wt as EllipseData,mt as Export,he as Frame,Dt as FrameData,Kt as Group,At as GroupData,Oe as Image,Ht as ImageData,Zt as Leafer,Et as LeaferData,Re as Line,Ft as LineData,Ne as MyImage,vt as Paint,wt as PaintGradient,ft as PaintImage,Je as Path,gt as PathArrow,Mt as PathData,$e as Pen,Ot as PenData,Ee as Polygon,Tt as PolygonData,te as Rect,Lt as RectData,Gt as RectRender,Me as Star,zt as StarData,Rt as State,Ge as Text,ct as TextConvert,Vt as TextData,St as Transition,$t as UI,jt as UIBounds,Ct as UIData,Ut as UIRender,Pt as UnitConvert,pt as effectType,lt as resizeType,ut as zoomLayerType};
|