@leafer-ui/draw 1.0.0-rc.12 → 1.0.0-rc.16
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 +106 -60
- package/lib/draw.esm.js +106 -61
- package/lib/draw.esm.min.js +1 -1
- package/lib/draw.min.cjs +1 -1
- package/package.json +6 -6
package/lib/draw.cjs
CHANGED
|
@@ -31,6 +31,18 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
31
31
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
32
32
|
};
|
|
33
33
|
|
|
34
|
+
function arrowType(defaultValue) {
|
|
35
|
+
return (target, key) => {
|
|
36
|
+
core.defineLeafAttr(target, key, defaultValue, {
|
|
37
|
+
set(value) {
|
|
38
|
+
this.__setAttr(key, value);
|
|
39
|
+
core.doStrokeType(this);
|
|
40
|
+
const data = this.__;
|
|
41
|
+
data.__useArrow = data.startArrow !== 'none' || data.endArrow !== 'none';
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
}
|
|
34
46
|
function effectType(defaultValue) {
|
|
35
47
|
return (target, key) => {
|
|
36
48
|
core.defineLeafAttr(target, key, defaultValue, {
|
|
@@ -57,12 +69,14 @@ function resizeType(defaultValue) {
|
|
|
57
69
|
|
|
58
70
|
const TextConvert = {};
|
|
59
71
|
const ColorConvert = {};
|
|
72
|
+
const PathArrow = {};
|
|
60
73
|
const Paint = {};
|
|
61
74
|
const PaintImage = {};
|
|
62
75
|
const PaintGradient = {};
|
|
63
76
|
const Effect = {};
|
|
64
77
|
const Export = {};
|
|
65
78
|
|
|
79
|
+
const { parse } = core.PathConvert;
|
|
66
80
|
const emptyPaint = {};
|
|
67
81
|
const debug$1 = core.Debug.get('UIData');
|
|
68
82
|
class UIData extends core.LeafData {
|
|
@@ -80,7 +94,8 @@ class UIData extends core.LeafData {
|
|
|
80
94
|
}
|
|
81
95
|
get __autoWidth() { return !this._width; }
|
|
82
96
|
get __autoHeight() { return !this._height; }
|
|
83
|
-
get
|
|
97
|
+
get __autoSide() { return !this._width || !this._height; }
|
|
98
|
+
get __autoSize() { return !this._width && !this._height; }
|
|
84
99
|
setVisible(value) {
|
|
85
100
|
if (this.__leaf.leafer)
|
|
86
101
|
this.__leaf.leafer.watcher.hasVisible = true;
|
|
@@ -108,7 +123,7 @@ class UIData extends core.LeafData {
|
|
|
108
123
|
}
|
|
109
124
|
setFill(value) {
|
|
110
125
|
if (this.__naturalWidth)
|
|
111
|
-
this.
|
|
126
|
+
this.__removeNaturalSize();
|
|
112
127
|
if (typeof value === 'string' || !value) {
|
|
113
128
|
if (this.__isFills) {
|
|
114
129
|
this.__removeInput('fill');
|
|
@@ -144,6 +159,17 @@ class UIData extends core.LeafData {
|
|
|
144
159
|
this._stroke || (this._stroke = emptyPaint);
|
|
145
160
|
}
|
|
146
161
|
}
|
|
162
|
+
setPath(value) {
|
|
163
|
+
if (typeof value === 'string') {
|
|
164
|
+
this.__setInput('path', value);
|
|
165
|
+
this._path = parse(value);
|
|
166
|
+
}
|
|
167
|
+
else {
|
|
168
|
+
if (this.__input)
|
|
169
|
+
this.__removeInput('path');
|
|
170
|
+
this._path = value;
|
|
171
|
+
}
|
|
172
|
+
}
|
|
147
173
|
setShadow(value) {
|
|
148
174
|
this.__setInput('shadow', value);
|
|
149
175
|
if (value instanceof Array) {
|
|
@@ -205,9 +231,6 @@ class FrameData extends BoxData {
|
|
|
205
231
|
class LineData extends UIData {
|
|
206
232
|
}
|
|
207
233
|
|
|
208
|
-
class ArrowData extends LineData {
|
|
209
|
-
}
|
|
210
|
-
|
|
211
234
|
class RectData extends UIData {
|
|
212
235
|
get __boxStroke() { return true; }
|
|
213
236
|
}
|
|
@@ -222,19 +245,7 @@ class PolygonData extends UIData {
|
|
|
222
245
|
class StarData extends UIData {
|
|
223
246
|
}
|
|
224
247
|
|
|
225
|
-
const { parse } = core.PathConvert;
|
|
226
248
|
class PathData extends UIData {
|
|
227
|
-
setPath(value) {
|
|
228
|
-
if (typeof value === 'string') {
|
|
229
|
-
this.__setInput('path', value);
|
|
230
|
-
this._path = parse(value);
|
|
231
|
-
}
|
|
232
|
-
else {
|
|
233
|
-
if (this.__input)
|
|
234
|
-
this.__removeInput('path');
|
|
235
|
-
this._path = value;
|
|
236
|
-
}
|
|
237
|
-
}
|
|
238
249
|
}
|
|
239
250
|
|
|
240
251
|
class PenData extends GroupData {
|
|
@@ -304,6 +315,8 @@ const UIBounds = {
|
|
|
304
315
|
}
|
|
305
316
|
}
|
|
306
317
|
this.__layout.strokeBoxSpread = boxWidth;
|
|
318
|
+
if (this.__.__useArrow)
|
|
319
|
+
width += strokeWidth * 5;
|
|
307
320
|
return width;
|
|
308
321
|
},
|
|
309
322
|
__updateRenderSpread() {
|
|
@@ -437,6 +450,7 @@ const RectRender = {
|
|
|
437
450
|
var UI_1;
|
|
438
451
|
exports.UI = UI_1 = class UI extends core.Leaf {
|
|
439
452
|
get app() { return this.leafer && this.leafer.app; }
|
|
453
|
+
get isFrame() { return false; }
|
|
440
454
|
set scale(value) {
|
|
441
455
|
if (typeof value === 'number') {
|
|
442
456
|
this.scaleX = this.scaleY = value;
|
|
@@ -457,8 +471,8 @@ exports.UI = UI_1 = class UI extends core.Leaf {
|
|
|
457
471
|
set(data) {
|
|
458
472
|
Object.assign(this, data);
|
|
459
473
|
}
|
|
460
|
-
get() {
|
|
461
|
-
return this.__.__getInputData();
|
|
474
|
+
get(name) {
|
|
475
|
+
return name ? this.__.__getInput(name) : this.__.__getInputData();
|
|
462
476
|
}
|
|
463
477
|
createProxyData() { return undefined; }
|
|
464
478
|
find(_condition, _options) { return undefined; }
|
|
@@ -490,6 +504,8 @@ exports.UI = UI_1 = class UI extends core.Leaf {
|
|
|
490
504
|
if (this.__.path) {
|
|
491
505
|
const data = this.__;
|
|
492
506
|
data.__pathForRender = data.cornerRadius ? core.PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path;
|
|
507
|
+
if (data.__useArrow)
|
|
508
|
+
PathArrow.addArrows(this, !data.cornerRadius);
|
|
493
509
|
}
|
|
494
510
|
}
|
|
495
511
|
__drawRenderPath(canvas) {
|
|
@@ -500,7 +516,14 @@ exports.UI = UI_1 = class UI extends core.Leaf {
|
|
|
500
516
|
canvas.beginPath();
|
|
501
517
|
this.__drawPathByData(canvas, this.__.path);
|
|
502
518
|
}
|
|
503
|
-
__drawPathByData(
|
|
519
|
+
__drawPathByData(drawer, data) {
|
|
520
|
+
if (data) {
|
|
521
|
+
core.PathDrawer.drawPathByData(drawer, data);
|
|
522
|
+
}
|
|
523
|
+
else {
|
|
524
|
+
this.__drawPathByBox(drawer);
|
|
525
|
+
}
|
|
526
|
+
}
|
|
504
527
|
__drawPathByBox(drawer) {
|
|
505
528
|
const { x, y, width, height } = this.__layout.boxBounds;
|
|
506
529
|
if (this.__.cornerRadius) {
|
|
@@ -519,6 +542,12 @@ exports.UI = UI_1 = class UI extends core.Leaf {
|
|
|
519
542
|
static one(data, x, y, width, height) {
|
|
520
543
|
return core.UICreator.get(data.tag || this.prototype.__tag, data, x, y, width, height);
|
|
521
544
|
}
|
|
545
|
+
static registerUI() {
|
|
546
|
+
core.registerUI()(this);
|
|
547
|
+
}
|
|
548
|
+
static registerData(data) {
|
|
549
|
+
core.dataProcessor(data)(this.prototype);
|
|
550
|
+
}
|
|
522
551
|
destroy() {
|
|
523
552
|
this.fill = this.stroke = null;
|
|
524
553
|
super.destroy();
|
|
@@ -657,10 +686,19 @@ __decorate([
|
|
|
657
686
|
core.dataType(false)
|
|
658
687
|
], exports.UI.prototype, "lazy", void 0);
|
|
659
688
|
__decorate([
|
|
660
|
-
core.
|
|
689
|
+
core.naturalBoundsType(1)
|
|
690
|
+
], exports.UI.prototype, "pixelRatio", void 0);
|
|
691
|
+
__decorate([
|
|
692
|
+
core.pathInputType()
|
|
693
|
+
], exports.UI.prototype, "path", void 0);
|
|
694
|
+
__decorate([
|
|
695
|
+
core.pathType()
|
|
696
|
+
], exports.UI.prototype, "windingRule", void 0);
|
|
697
|
+
__decorate([
|
|
698
|
+
arrowType('none')
|
|
661
699
|
], exports.UI.prototype, "startArrow", void 0);
|
|
662
700
|
__decorate([
|
|
663
|
-
|
|
701
|
+
arrowType('none')
|
|
664
702
|
], exports.UI.prototype, "endArrow", void 0);
|
|
665
703
|
__decorate([
|
|
666
704
|
core.pathType(0)
|
|
@@ -686,9 +724,6 @@ __decorate([
|
|
|
686
724
|
__decorate([
|
|
687
725
|
core.rewrite(core.Leaf.prototype.reset)
|
|
688
726
|
], exports.UI.prototype, "reset", null);
|
|
689
|
-
__decorate([
|
|
690
|
-
core.rewrite(core.PathDrawer.drawPathByData)
|
|
691
|
-
], exports.UI.prototype, "__drawPathByData", null);
|
|
692
727
|
exports.UI = UI_1 = __decorate([
|
|
693
728
|
core.useModule(UIBounds),
|
|
694
729
|
core.useModule(UIRender),
|
|
@@ -697,12 +732,15 @@ exports.UI = UI_1 = __decorate([
|
|
|
697
732
|
|
|
698
733
|
exports.Group = class Group extends exports.UI {
|
|
699
734
|
get __tag() { return 'Group'; }
|
|
735
|
+
get isBranch() { return true; }
|
|
700
736
|
constructor(data) {
|
|
701
737
|
super(data);
|
|
738
|
+
}
|
|
739
|
+
reset(data) {
|
|
702
740
|
this.__setBranch();
|
|
741
|
+
super.reset(data);
|
|
703
742
|
}
|
|
704
743
|
__setBranch() {
|
|
705
|
-
this.isBranch = true;
|
|
706
744
|
if (!this.children)
|
|
707
745
|
this.children = [];
|
|
708
746
|
}
|
|
@@ -714,7 +752,7 @@ exports.Group = class Group extends exports.UI {
|
|
|
714
752
|
this.__setBranch();
|
|
715
753
|
}
|
|
716
754
|
else {
|
|
717
|
-
this.
|
|
755
|
+
this.clear();
|
|
718
756
|
}
|
|
719
757
|
super.set(data);
|
|
720
758
|
let child;
|
|
@@ -762,6 +800,7 @@ exports.Leafer = class Leafer extends exports.Group {
|
|
|
762
800
|
get __tag() { return 'Leafer'; }
|
|
763
801
|
get isApp() { return false; }
|
|
764
802
|
get app() { return this.parent || this; }
|
|
803
|
+
get isLeafer() { return true; }
|
|
765
804
|
get imageReady() { return this.viewReady && core.ImageManager.isComplete; }
|
|
766
805
|
get layoutLocked() { return !this.layouter.running; }
|
|
767
806
|
get cursorPoint() { return (this.interaction && this.interaction.hoverData) || { x: this.width / 2, y: this.height / 2 }; }
|
|
@@ -878,7 +917,7 @@ exports.Leafer = class Leafer extends exports.Group {
|
|
|
878
917
|
this.forceRender();
|
|
879
918
|
}
|
|
880
919
|
forceRender(bounds) {
|
|
881
|
-
this.renderer.addBlock(new core.Bounds(bounds)
|
|
920
|
+
this.renderer.addBlock(bounds ? new core.Bounds(bounds) : this.canvas.bounds);
|
|
882
921
|
if (this.viewReady)
|
|
883
922
|
this.renderer.update();
|
|
884
923
|
}
|
|
@@ -909,7 +948,6 @@ exports.Leafer = class Leafer extends exports.Group {
|
|
|
909
948
|
}
|
|
910
949
|
__setLeafer(leafer) {
|
|
911
950
|
this.leafer = leafer;
|
|
912
|
-
this.isLeafer = !!leafer;
|
|
913
951
|
this.__level = 1;
|
|
914
952
|
}
|
|
915
953
|
setZoomLayer(zoomLayer) {
|
|
@@ -1096,14 +1134,10 @@ exports.Rect = class Rect extends exports.UI {
|
|
|
1096
1134
|
constructor(data) {
|
|
1097
1135
|
super(data);
|
|
1098
1136
|
}
|
|
1099
|
-
__drawPathByData(_drawer, _data) { }
|
|
1100
1137
|
};
|
|
1101
1138
|
__decorate([
|
|
1102
1139
|
core.dataProcessor(RectData)
|
|
1103
1140
|
], exports.Rect.prototype, "__", void 0);
|
|
1104
|
-
__decorate([
|
|
1105
|
-
core.rewrite(exports.UI.prototype.__drawPathByBox)
|
|
1106
|
-
], exports.Rect.prototype, "__drawPathByData", null);
|
|
1107
1141
|
exports.Rect = __decorate([
|
|
1108
1142
|
core.useModule(RectRender),
|
|
1109
1143
|
core.rewriteAble(),
|
|
@@ -1116,9 +1150,9 @@ const bounds = {};
|
|
|
1116
1150
|
const { copy, add } = core.BoundsHelper;
|
|
1117
1151
|
exports.Box = class Box extends exports.Group {
|
|
1118
1152
|
get __tag() { return 'Box'; }
|
|
1153
|
+
get isBranchLeaf() { return true; }
|
|
1119
1154
|
constructor(data) {
|
|
1120
1155
|
super(data);
|
|
1121
|
-
this.isBranchLeaf = true;
|
|
1122
1156
|
this.__layout.renderChanged || this.__layout.renderChange();
|
|
1123
1157
|
}
|
|
1124
1158
|
__updateStrokeSpread() { return 0; }
|
|
@@ -1132,8 +1166,18 @@ exports.Box = class Box extends exports.Group {
|
|
|
1132
1166
|
}
|
|
1133
1167
|
__updateRectBoxBounds() { }
|
|
1134
1168
|
__updateBoxBounds() {
|
|
1135
|
-
|
|
1169
|
+
const data = this.__;
|
|
1170
|
+
if (data.__autoSide && this.children.length) {
|
|
1171
|
+
if (this.leafer)
|
|
1172
|
+
this.leafer.layouter.addExtra(this);
|
|
1136
1173
|
super.__updateBoxBounds();
|
|
1174
|
+
if (!data.__autoSize) {
|
|
1175
|
+
const b = this.__layout.boxBounds;
|
|
1176
|
+
if (!data.__autoWidth)
|
|
1177
|
+
b.x = 0, b.width = data.width;
|
|
1178
|
+
if (!data.__autoHeight)
|
|
1179
|
+
b.y = 0, b.height = data.height;
|
|
1180
|
+
}
|
|
1137
1181
|
}
|
|
1138
1182
|
else {
|
|
1139
1183
|
this.__updateRectBoxBounds();
|
|
@@ -1155,7 +1199,6 @@ exports.Box = class Box extends exports.Group {
|
|
|
1155
1199
|
super.__updateChange();
|
|
1156
1200
|
this.__updateRectChange();
|
|
1157
1201
|
}
|
|
1158
|
-
__drawPathByData(_drawer, _data) { }
|
|
1159
1202
|
__renderRect(_canvas, _options) { }
|
|
1160
1203
|
__renderGroup(_canvas, _options) { }
|
|
1161
1204
|
__render(canvas, options) {
|
|
@@ -1200,9 +1243,6 @@ __decorate([
|
|
|
1200
1243
|
__decorate([
|
|
1201
1244
|
core.rewrite(rect.__updateChange)
|
|
1202
1245
|
], exports.Box.prototype, "__updateRectChange", null);
|
|
1203
|
-
__decorate([
|
|
1204
|
-
core.rewrite(rect.__drawPathByData)
|
|
1205
|
-
], exports.Box.prototype, "__drawPathByData", null);
|
|
1206
1246
|
__decorate([
|
|
1207
1247
|
core.rewrite(rect.__render)
|
|
1208
1248
|
], exports.Box.prototype, "__renderRect", null);
|
|
@@ -1216,9 +1256,9 @@ exports.Box = __decorate([
|
|
|
1216
1256
|
|
|
1217
1257
|
exports.Frame = class Frame extends exports.Box {
|
|
1218
1258
|
get __tag() { return 'Frame'; }
|
|
1259
|
+
get isFrame() { return true; }
|
|
1219
1260
|
constructor(data) {
|
|
1220
1261
|
super(data);
|
|
1221
|
-
this.isFrame = true;
|
|
1222
1262
|
}
|
|
1223
1263
|
};
|
|
1224
1264
|
__decorate([
|
|
@@ -1292,7 +1332,7 @@ exports.Ellipse = __decorate([
|
|
|
1292
1332
|
|
|
1293
1333
|
const { moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1 } = core.PathCommandDataHelper;
|
|
1294
1334
|
const { rotate, getAngle, getDistance, defaultPoint } = core.PointHelper;
|
|
1295
|
-
const { toBounds
|
|
1335
|
+
const { toBounds } = core.PathBounds;
|
|
1296
1336
|
exports.Line = class Line extends exports.UI {
|
|
1297
1337
|
get __tag() { return 'Line'; }
|
|
1298
1338
|
get toPoint() {
|
|
@@ -1324,8 +1364,11 @@ exports.Line = class Line extends exports.UI {
|
|
|
1324
1364
|
}
|
|
1325
1365
|
}
|
|
1326
1366
|
__updateRenderPath() {
|
|
1327
|
-
|
|
1328
|
-
|
|
1367
|
+
const data = this.__;
|
|
1368
|
+
if (!this.pathInputed && data.points && data.curve) {
|
|
1369
|
+
drawPoints$1(data.__pathForRender = [], data.points, data.curve, this.pathClosed);
|
|
1370
|
+
if (data.__useArrow)
|
|
1371
|
+
PathArrow.addArrows(this, false);
|
|
1329
1372
|
}
|
|
1330
1373
|
else {
|
|
1331
1374
|
super.__updateRenderPath();
|
|
@@ -1333,7 +1376,7 @@ exports.Line = class Line extends exports.UI {
|
|
|
1333
1376
|
}
|
|
1334
1377
|
__updateBoxBounds() {
|
|
1335
1378
|
if (this.points) {
|
|
1336
|
-
toBounds
|
|
1379
|
+
toBounds(this.__.__pathForRender, this.__layout.boxBounds);
|
|
1337
1380
|
}
|
|
1338
1381
|
else {
|
|
1339
1382
|
super.__updateBoxBounds();
|
|
@@ -1366,6 +1409,7 @@ exports.Polygon = class Polygon extends exports.UI {
|
|
|
1366
1409
|
get __tag() { return 'Polygon'; }
|
|
1367
1410
|
constructor(data) {
|
|
1368
1411
|
super(data);
|
|
1412
|
+
this.pathClosed = true;
|
|
1369
1413
|
}
|
|
1370
1414
|
__updatePath() {
|
|
1371
1415
|
const path = this.__.path = [];
|
|
@@ -1521,7 +1565,7 @@ exports.Canvas = class Canvas extends exports.Rect {
|
|
|
1521
1565
|
}
|
|
1522
1566
|
};
|
|
1523
1567
|
__decorate([
|
|
1524
|
-
core.dataProcessor(
|
|
1568
|
+
core.dataProcessor(CanvasData)
|
|
1525
1569
|
], exports.Canvas.prototype, "__", void 0);
|
|
1526
1570
|
__decorate([
|
|
1527
1571
|
resizeType(100)
|
|
@@ -1584,7 +1628,7 @@ exports.Text = class Text extends exports.UI {
|
|
|
1584
1628
|
data.__padding = padding ? core.MathHelper.fourNumber(padding) : undefined;
|
|
1585
1629
|
data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2;
|
|
1586
1630
|
data.__font = `${italic ? 'italic ' : ''}${textCase === 'small-caps' ? 'small-caps ' : ''}${fontWeight !== 'normal' ? fontWeight + ' ' : ''}${fontSize}px ${fontFamily}`;
|
|
1587
|
-
data.__clipText = textOverflow !== 'show' && !data.
|
|
1631
|
+
data.__clipText = textOverflow !== 'show' && !data.__autoSize;
|
|
1588
1632
|
this.__updateTextDrawData();
|
|
1589
1633
|
const { bounds } = data.__textDrawData;
|
|
1590
1634
|
const b = layout.boxBounds;
|
|
@@ -1701,25 +1745,16 @@ exports.Text = __decorate([
|
|
|
1701
1745
|
core.registerUI()
|
|
1702
1746
|
], exports.Text);
|
|
1703
1747
|
|
|
1704
|
-
const { toBounds } = core.PathBounds;
|
|
1705
1748
|
exports.Path = class Path extends exports.UI {
|
|
1706
1749
|
get __tag() { return 'Path'; }
|
|
1707
1750
|
constructor(data) {
|
|
1708
1751
|
super(data);
|
|
1709
|
-
|
|
1710
|
-
__updateBoxBounds() {
|
|
1711
|
-
toBounds(this.__.path, this.__layout.boxBounds);
|
|
1752
|
+
this.__.__pathInputed = 2;
|
|
1712
1753
|
}
|
|
1713
1754
|
};
|
|
1714
1755
|
__decorate([
|
|
1715
1756
|
core.dataProcessor(PathData)
|
|
1716
1757
|
], exports.Path.prototype, "__", void 0);
|
|
1717
|
-
__decorate([
|
|
1718
|
-
core.pathType()
|
|
1719
|
-
], exports.Path.prototype, "path", void 0);
|
|
1720
|
-
__decorate([
|
|
1721
|
-
core.pathType()
|
|
1722
|
-
], exports.Path.prototype, "windingRule", void 0);
|
|
1723
1758
|
__decorate([
|
|
1724
1759
|
core.affectStrokeBoundsType('center')
|
|
1725
1760
|
], exports.Path.prototype, "strokeAlign", void 0);
|
|
@@ -1735,12 +1770,12 @@ exports.Pen = class Pen extends exports.Group {
|
|
|
1735
1770
|
setStyle(data) {
|
|
1736
1771
|
const path = this.pathElement = new exports.Path(data);
|
|
1737
1772
|
this.pathStyle = data;
|
|
1738
|
-
this.
|
|
1773
|
+
this.__path = path.path || (path.path = []);
|
|
1739
1774
|
this.add(path);
|
|
1740
1775
|
return this;
|
|
1741
1776
|
}
|
|
1742
1777
|
beginPath() {
|
|
1743
|
-
this.
|
|
1778
|
+
this.__path.length = 0;
|
|
1744
1779
|
this.paint();
|
|
1745
1780
|
return this;
|
|
1746
1781
|
}
|
|
@@ -1764,12 +1799,21 @@ exports.Pen = class Pen extends exports.Group {
|
|
|
1764
1799
|
__decorate([
|
|
1765
1800
|
core.dataProcessor(PenData)
|
|
1766
1801
|
], exports.Pen.prototype, "__", void 0);
|
|
1802
|
+
__decorate([
|
|
1803
|
+
penPathType()
|
|
1804
|
+
], exports.Pen.prototype, "path", void 0);
|
|
1767
1805
|
exports.Pen = __decorate([
|
|
1768
|
-
core.useModule(core.PathCreator, ['beginPath']),
|
|
1806
|
+
core.useModule(core.PathCreator, ['beginPath', 'path']),
|
|
1769
1807
|
core.registerUI()
|
|
1770
1808
|
], exports.Pen);
|
|
1809
|
+
function penPathType() {
|
|
1810
|
+
return (target, key) => {
|
|
1811
|
+
core.defineKey(target, key, {
|
|
1812
|
+
get() { return this.__path; }
|
|
1813
|
+
});
|
|
1814
|
+
};
|
|
1815
|
+
}
|
|
1771
1816
|
|
|
1772
|
-
exports.ArrowData = ArrowData;
|
|
1773
1817
|
exports.BoxData = BoxData;
|
|
1774
1818
|
exports.CanvasData = CanvasData;
|
|
1775
1819
|
exports.ColorConvert = ColorConvert;
|
|
@@ -1784,6 +1828,7 @@ exports.LineData = LineData;
|
|
|
1784
1828
|
exports.Paint = Paint;
|
|
1785
1829
|
exports.PaintGradient = PaintGradient;
|
|
1786
1830
|
exports.PaintImage = PaintImage;
|
|
1831
|
+
exports.PathArrow = PathArrow;
|
|
1787
1832
|
exports.PathData = PathData;
|
|
1788
1833
|
exports.PenData = PenData;
|
|
1789
1834
|
exports.PolygonData = PolygonData;
|
|
@@ -1796,6 +1841,7 @@ exports.UIBounds = UIBounds;
|
|
|
1796
1841
|
exports.UIData = UIData;
|
|
1797
1842
|
exports.UIRender = UIRender;
|
|
1798
1843
|
exports.UnitConvert = UnitConvert;
|
|
1844
|
+
exports.arrowType = arrowType;
|
|
1799
1845
|
exports.effectType = effectType;
|
|
1800
1846
|
exports.resizeType = resizeType;
|
|
1801
1847
|
Object.keys(core).forEach(function (k) {
|
package/lib/draw.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineLeafAttr, Debug, LeafData, PathConvert, OneRadian, dataProcessor, dataType, surfaceType, opacityType, sortType, maskType, eraserType, positionType, boundsType, scaleType, rotationType, autoLayoutType, hitType, strokeType, cursorType, pathType, rewrite, Leaf,
|
|
1
|
+
import { defineLeafAttr, doStrokeType, Debug, LeafData, PathConvert, OneRadian, dataProcessor, dataType, surfaceType, opacityType, sortType, maskType, eraserType, positionType, boundsType, scaleType, rotationType, autoLayoutType, hitType, strokeType, cursorType, naturalBoundsType, pathInputType, pathType, rewrite, Leaf, useModule, rewriteAble, PathCreator, PathCorner, PathDrawer, UICreator, registerUI, Branch, ImageManager, DataHelper, Creator, CanvasManager, LeaferEvent, canvasSizeAttrs, Bounds, ResizeEvent, AutoBounds, WaitHelper, Run, LayoutEvent, RenderEvent, WatchEvent, affectRenderBoundsType, BoundsHelper, Platform, PathCommandDataHelper, affectStrokeBoundsType, getPointData, PointHelper, PathBounds, ImageEvent, Matrix, MathHelper, defineKey } from '@leafer/core';
|
|
2
2
|
export * from '@leafer/core';
|
|
3
3
|
|
|
4
4
|
/******************************************************************************
|
|
@@ -30,6 +30,18 @@ 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
|
+
function arrowType(defaultValue) {
|
|
34
|
+
return (target, key) => {
|
|
35
|
+
defineLeafAttr(target, key, defaultValue, {
|
|
36
|
+
set(value) {
|
|
37
|
+
this.__setAttr(key, value);
|
|
38
|
+
doStrokeType(this);
|
|
39
|
+
const data = this.__;
|
|
40
|
+
data.__useArrow = data.startArrow !== 'none' || data.endArrow !== 'none';
|
|
41
|
+
}
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
}
|
|
33
45
|
function effectType(defaultValue) {
|
|
34
46
|
return (target, key) => {
|
|
35
47
|
defineLeafAttr(target, key, defaultValue, {
|
|
@@ -56,12 +68,14 @@ function resizeType(defaultValue) {
|
|
|
56
68
|
|
|
57
69
|
const TextConvert = {};
|
|
58
70
|
const ColorConvert = {};
|
|
71
|
+
const PathArrow = {};
|
|
59
72
|
const Paint = {};
|
|
60
73
|
const PaintImage = {};
|
|
61
74
|
const PaintGradient = {};
|
|
62
75
|
const Effect = {};
|
|
63
76
|
const Export = {};
|
|
64
77
|
|
|
78
|
+
const { parse } = PathConvert;
|
|
65
79
|
const emptyPaint = {};
|
|
66
80
|
const debug$1 = Debug.get('UIData');
|
|
67
81
|
class UIData extends LeafData {
|
|
@@ -79,7 +93,8 @@ class UIData extends LeafData {
|
|
|
79
93
|
}
|
|
80
94
|
get __autoWidth() { return !this._width; }
|
|
81
95
|
get __autoHeight() { return !this._height; }
|
|
82
|
-
get
|
|
96
|
+
get __autoSide() { return !this._width || !this._height; }
|
|
97
|
+
get __autoSize() { return !this._width && !this._height; }
|
|
83
98
|
setVisible(value) {
|
|
84
99
|
if (this.__leaf.leafer)
|
|
85
100
|
this.__leaf.leafer.watcher.hasVisible = true;
|
|
@@ -107,7 +122,7 @@ class UIData extends LeafData {
|
|
|
107
122
|
}
|
|
108
123
|
setFill(value) {
|
|
109
124
|
if (this.__naturalWidth)
|
|
110
|
-
this.
|
|
125
|
+
this.__removeNaturalSize();
|
|
111
126
|
if (typeof value === 'string' || !value) {
|
|
112
127
|
if (this.__isFills) {
|
|
113
128
|
this.__removeInput('fill');
|
|
@@ -143,6 +158,17 @@ class UIData extends LeafData {
|
|
|
143
158
|
this._stroke || (this._stroke = emptyPaint);
|
|
144
159
|
}
|
|
145
160
|
}
|
|
161
|
+
setPath(value) {
|
|
162
|
+
if (typeof value === 'string') {
|
|
163
|
+
this.__setInput('path', value);
|
|
164
|
+
this._path = parse(value);
|
|
165
|
+
}
|
|
166
|
+
else {
|
|
167
|
+
if (this.__input)
|
|
168
|
+
this.__removeInput('path');
|
|
169
|
+
this._path = value;
|
|
170
|
+
}
|
|
171
|
+
}
|
|
146
172
|
setShadow(value) {
|
|
147
173
|
this.__setInput('shadow', value);
|
|
148
174
|
if (value instanceof Array) {
|
|
@@ -204,9 +230,6 @@ class FrameData extends BoxData {
|
|
|
204
230
|
class LineData extends UIData {
|
|
205
231
|
}
|
|
206
232
|
|
|
207
|
-
class ArrowData extends LineData {
|
|
208
|
-
}
|
|
209
|
-
|
|
210
233
|
class RectData extends UIData {
|
|
211
234
|
get __boxStroke() { return true; }
|
|
212
235
|
}
|
|
@@ -221,19 +244,7 @@ class PolygonData extends UIData {
|
|
|
221
244
|
class StarData extends UIData {
|
|
222
245
|
}
|
|
223
246
|
|
|
224
|
-
const { parse } = PathConvert;
|
|
225
247
|
class PathData extends UIData {
|
|
226
|
-
setPath(value) {
|
|
227
|
-
if (typeof value === 'string') {
|
|
228
|
-
this.__setInput('path', value);
|
|
229
|
-
this._path = parse(value);
|
|
230
|
-
}
|
|
231
|
-
else {
|
|
232
|
-
if (this.__input)
|
|
233
|
-
this.__removeInput('path');
|
|
234
|
-
this._path = value;
|
|
235
|
-
}
|
|
236
|
-
}
|
|
237
248
|
}
|
|
238
249
|
|
|
239
250
|
class PenData extends GroupData {
|
|
@@ -303,6 +314,8 @@ const UIBounds = {
|
|
|
303
314
|
}
|
|
304
315
|
}
|
|
305
316
|
this.__layout.strokeBoxSpread = boxWidth;
|
|
317
|
+
if (this.__.__useArrow)
|
|
318
|
+
width += strokeWidth * 5;
|
|
306
319
|
return width;
|
|
307
320
|
},
|
|
308
321
|
__updateRenderSpread() {
|
|
@@ -436,6 +449,7 @@ const RectRender = {
|
|
|
436
449
|
var UI_1;
|
|
437
450
|
let UI = UI_1 = class UI extends Leaf {
|
|
438
451
|
get app() { return this.leafer && this.leafer.app; }
|
|
452
|
+
get isFrame() { return false; }
|
|
439
453
|
set scale(value) {
|
|
440
454
|
if (typeof value === 'number') {
|
|
441
455
|
this.scaleX = this.scaleY = value;
|
|
@@ -456,8 +470,8 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
456
470
|
set(data) {
|
|
457
471
|
Object.assign(this, data);
|
|
458
472
|
}
|
|
459
|
-
get() {
|
|
460
|
-
return this.__.__getInputData();
|
|
473
|
+
get(name) {
|
|
474
|
+
return name ? this.__.__getInput(name) : this.__.__getInputData();
|
|
461
475
|
}
|
|
462
476
|
createProxyData() { return undefined; }
|
|
463
477
|
find(_condition, _options) { return undefined; }
|
|
@@ -489,6 +503,8 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
489
503
|
if (this.__.path) {
|
|
490
504
|
const data = this.__;
|
|
491
505
|
data.__pathForRender = data.cornerRadius ? PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path;
|
|
506
|
+
if (data.__useArrow)
|
|
507
|
+
PathArrow.addArrows(this, !data.cornerRadius);
|
|
492
508
|
}
|
|
493
509
|
}
|
|
494
510
|
__drawRenderPath(canvas) {
|
|
@@ -499,7 +515,14 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
499
515
|
canvas.beginPath();
|
|
500
516
|
this.__drawPathByData(canvas, this.__.path);
|
|
501
517
|
}
|
|
502
|
-
__drawPathByData(
|
|
518
|
+
__drawPathByData(drawer, data) {
|
|
519
|
+
if (data) {
|
|
520
|
+
PathDrawer.drawPathByData(drawer, data);
|
|
521
|
+
}
|
|
522
|
+
else {
|
|
523
|
+
this.__drawPathByBox(drawer);
|
|
524
|
+
}
|
|
525
|
+
}
|
|
503
526
|
__drawPathByBox(drawer) {
|
|
504
527
|
const { x, y, width, height } = this.__layout.boxBounds;
|
|
505
528
|
if (this.__.cornerRadius) {
|
|
@@ -518,6 +541,12 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
518
541
|
static one(data, x, y, width, height) {
|
|
519
542
|
return UICreator.get(data.tag || this.prototype.__tag, data, x, y, width, height);
|
|
520
543
|
}
|
|
544
|
+
static registerUI() {
|
|
545
|
+
registerUI()(this);
|
|
546
|
+
}
|
|
547
|
+
static registerData(data) {
|
|
548
|
+
dataProcessor(data)(this.prototype);
|
|
549
|
+
}
|
|
521
550
|
destroy() {
|
|
522
551
|
this.fill = this.stroke = null;
|
|
523
552
|
super.destroy();
|
|
@@ -656,10 +685,19 @@ __decorate([
|
|
|
656
685
|
dataType(false)
|
|
657
686
|
], UI.prototype, "lazy", void 0);
|
|
658
687
|
__decorate([
|
|
659
|
-
|
|
688
|
+
naturalBoundsType(1)
|
|
689
|
+
], UI.prototype, "pixelRatio", void 0);
|
|
690
|
+
__decorate([
|
|
691
|
+
pathInputType()
|
|
692
|
+
], UI.prototype, "path", void 0);
|
|
693
|
+
__decorate([
|
|
694
|
+
pathType()
|
|
695
|
+
], UI.prototype, "windingRule", void 0);
|
|
696
|
+
__decorate([
|
|
697
|
+
arrowType('none')
|
|
660
698
|
], UI.prototype, "startArrow", void 0);
|
|
661
699
|
__decorate([
|
|
662
|
-
|
|
700
|
+
arrowType('none')
|
|
663
701
|
], UI.prototype, "endArrow", void 0);
|
|
664
702
|
__decorate([
|
|
665
703
|
pathType(0)
|
|
@@ -685,9 +723,6 @@ __decorate([
|
|
|
685
723
|
__decorate([
|
|
686
724
|
rewrite(Leaf.prototype.reset)
|
|
687
725
|
], UI.prototype, "reset", null);
|
|
688
|
-
__decorate([
|
|
689
|
-
rewrite(PathDrawer.drawPathByData)
|
|
690
|
-
], UI.prototype, "__drawPathByData", null);
|
|
691
726
|
UI = UI_1 = __decorate([
|
|
692
727
|
useModule(UIBounds),
|
|
693
728
|
useModule(UIRender),
|
|
@@ -696,12 +731,15 @@ UI = UI_1 = __decorate([
|
|
|
696
731
|
|
|
697
732
|
let Group = class Group extends UI {
|
|
698
733
|
get __tag() { return 'Group'; }
|
|
734
|
+
get isBranch() { return true; }
|
|
699
735
|
constructor(data) {
|
|
700
736
|
super(data);
|
|
737
|
+
}
|
|
738
|
+
reset(data) {
|
|
701
739
|
this.__setBranch();
|
|
740
|
+
super.reset(data);
|
|
702
741
|
}
|
|
703
742
|
__setBranch() {
|
|
704
|
-
this.isBranch = true;
|
|
705
743
|
if (!this.children)
|
|
706
744
|
this.children = [];
|
|
707
745
|
}
|
|
@@ -713,7 +751,7 @@ let Group = class Group extends UI {
|
|
|
713
751
|
this.__setBranch();
|
|
714
752
|
}
|
|
715
753
|
else {
|
|
716
|
-
this.
|
|
754
|
+
this.clear();
|
|
717
755
|
}
|
|
718
756
|
super.set(data);
|
|
719
757
|
let child;
|
|
@@ -761,6 +799,7 @@ let Leafer = class Leafer extends Group {
|
|
|
761
799
|
get __tag() { return 'Leafer'; }
|
|
762
800
|
get isApp() { return false; }
|
|
763
801
|
get app() { return this.parent || this; }
|
|
802
|
+
get isLeafer() { return true; }
|
|
764
803
|
get imageReady() { return this.viewReady && ImageManager.isComplete; }
|
|
765
804
|
get layoutLocked() { return !this.layouter.running; }
|
|
766
805
|
get cursorPoint() { return (this.interaction && this.interaction.hoverData) || { x: this.width / 2, y: this.height / 2 }; }
|
|
@@ -877,7 +916,7 @@ let Leafer = class Leafer extends Group {
|
|
|
877
916
|
this.forceRender();
|
|
878
917
|
}
|
|
879
918
|
forceRender(bounds) {
|
|
880
|
-
this.renderer.addBlock(new Bounds(bounds)
|
|
919
|
+
this.renderer.addBlock(bounds ? new Bounds(bounds) : this.canvas.bounds);
|
|
881
920
|
if (this.viewReady)
|
|
882
921
|
this.renderer.update();
|
|
883
922
|
}
|
|
@@ -908,7 +947,6 @@ let Leafer = class Leafer extends Group {
|
|
|
908
947
|
}
|
|
909
948
|
__setLeafer(leafer) {
|
|
910
949
|
this.leafer = leafer;
|
|
911
|
-
this.isLeafer = !!leafer;
|
|
912
950
|
this.__level = 1;
|
|
913
951
|
}
|
|
914
952
|
setZoomLayer(zoomLayer) {
|
|
@@ -1095,14 +1133,10 @@ let Rect = class Rect extends UI {
|
|
|
1095
1133
|
constructor(data) {
|
|
1096
1134
|
super(data);
|
|
1097
1135
|
}
|
|
1098
|
-
__drawPathByData(_drawer, _data) { }
|
|
1099
1136
|
};
|
|
1100
1137
|
__decorate([
|
|
1101
1138
|
dataProcessor(RectData)
|
|
1102
1139
|
], Rect.prototype, "__", void 0);
|
|
1103
|
-
__decorate([
|
|
1104
|
-
rewrite(UI.prototype.__drawPathByBox)
|
|
1105
|
-
], Rect.prototype, "__drawPathByData", null);
|
|
1106
1140
|
Rect = __decorate([
|
|
1107
1141
|
useModule(RectRender),
|
|
1108
1142
|
rewriteAble(),
|
|
@@ -1115,9 +1149,9 @@ const bounds = {};
|
|
|
1115
1149
|
const { copy, add } = BoundsHelper;
|
|
1116
1150
|
let Box = class Box extends Group {
|
|
1117
1151
|
get __tag() { return 'Box'; }
|
|
1152
|
+
get isBranchLeaf() { return true; }
|
|
1118
1153
|
constructor(data) {
|
|
1119
1154
|
super(data);
|
|
1120
|
-
this.isBranchLeaf = true;
|
|
1121
1155
|
this.__layout.renderChanged || this.__layout.renderChange();
|
|
1122
1156
|
}
|
|
1123
1157
|
__updateStrokeSpread() { return 0; }
|
|
@@ -1131,8 +1165,18 @@ let Box = class Box extends Group {
|
|
|
1131
1165
|
}
|
|
1132
1166
|
__updateRectBoxBounds() { }
|
|
1133
1167
|
__updateBoxBounds() {
|
|
1134
|
-
|
|
1168
|
+
const data = this.__;
|
|
1169
|
+
if (data.__autoSide && this.children.length) {
|
|
1170
|
+
if (this.leafer)
|
|
1171
|
+
this.leafer.layouter.addExtra(this);
|
|
1135
1172
|
super.__updateBoxBounds();
|
|
1173
|
+
if (!data.__autoSize) {
|
|
1174
|
+
const b = this.__layout.boxBounds;
|
|
1175
|
+
if (!data.__autoWidth)
|
|
1176
|
+
b.x = 0, b.width = data.width;
|
|
1177
|
+
if (!data.__autoHeight)
|
|
1178
|
+
b.y = 0, b.height = data.height;
|
|
1179
|
+
}
|
|
1136
1180
|
}
|
|
1137
1181
|
else {
|
|
1138
1182
|
this.__updateRectBoxBounds();
|
|
@@ -1154,7 +1198,6 @@ let Box = class Box extends Group {
|
|
|
1154
1198
|
super.__updateChange();
|
|
1155
1199
|
this.__updateRectChange();
|
|
1156
1200
|
}
|
|
1157
|
-
__drawPathByData(_drawer, _data) { }
|
|
1158
1201
|
__renderRect(_canvas, _options) { }
|
|
1159
1202
|
__renderGroup(_canvas, _options) { }
|
|
1160
1203
|
__render(canvas, options) {
|
|
@@ -1199,9 +1242,6 @@ __decorate([
|
|
|
1199
1242
|
__decorate([
|
|
1200
1243
|
rewrite(rect.__updateChange)
|
|
1201
1244
|
], Box.prototype, "__updateRectChange", null);
|
|
1202
|
-
__decorate([
|
|
1203
|
-
rewrite(rect.__drawPathByData)
|
|
1204
|
-
], Box.prototype, "__drawPathByData", null);
|
|
1205
1245
|
__decorate([
|
|
1206
1246
|
rewrite(rect.__render)
|
|
1207
1247
|
], Box.prototype, "__renderRect", null);
|
|
@@ -1215,9 +1255,9 @@ Box = __decorate([
|
|
|
1215
1255
|
|
|
1216
1256
|
let Frame = class Frame extends Box {
|
|
1217
1257
|
get __tag() { return 'Frame'; }
|
|
1258
|
+
get isFrame() { return true; }
|
|
1218
1259
|
constructor(data) {
|
|
1219
1260
|
super(data);
|
|
1220
|
-
this.isFrame = true;
|
|
1221
1261
|
}
|
|
1222
1262
|
};
|
|
1223
1263
|
__decorate([
|
|
@@ -1291,7 +1331,7 @@ Ellipse = __decorate([
|
|
|
1291
1331
|
|
|
1292
1332
|
const { moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1 } = PathCommandDataHelper;
|
|
1293
1333
|
const { rotate, getAngle, getDistance, defaultPoint } = PointHelper;
|
|
1294
|
-
const { toBounds
|
|
1334
|
+
const { toBounds } = PathBounds;
|
|
1295
1335
|
let Line = class Line extends UI {
|
|
1296
1336
|
get __tag() { return 'Line'; }
|
|
1297
1337
|
get toPoint() {
|
|
@@ -1323,8 +1363,11 @@ let Line = class Line extends UI {
|
|
|
1323
1363
|
}
|
|
1324
1364
|
}
|
|
1325
1365
|
__updateRenderPath() {
|
|
1326
|
-
|
|
1327
|
-
|
|
1366
|
+
const data = this.__;
|
|
1367
|
+
if (!this.pathInputed && data.points && data.curve) {
|
|
1368
|
+
drawPoints$1(data.__pathForRender = [], data.points, data.curve, this.pathClosed);
|
|
1369
|
+
if (data.__useArrow)
|
|
1370
|
+
PathArrow.addArrows(this, false);
|
|
1328
1371
|
}
|
|
1329
1372
|
else {
|
|
1330
1373
|
super.__updateRenderPath();
|
|
@@ -1332,7 +1375,7 @@ let Line = class Line extends UI {
|
|
|
1332
1375
|
}
|
|
1333
1376
|
__updateBoxBounds() {
|
|
1334
1377
|
if (this.points) {
|
|
1335
|
-
toBounds
|
|
1378
|
+
toBounds(this.__.__pathForRender, this.__layout.boxBounds);
|
|
1336
1379
|
}
|
|
1337
1380
|
else {
|
|
1338
1381
|
super.__updateBoxBounds();
|
|
@@ -1365,6 +1408,7 @@ let Polygon = class Polygon extends UI {
|
|
|
1365
1408
|
get __tag() { return 'Polygon'; }
|
|
1366
1409
|
constructor(data) {
|
|
1367
1410
|
super(data);
|
|
1411
|
+
this.pathClosed = true;
|
|
1368
1412
|
}
|
|
1369
1413
|
__updatePath() {
|
|
1370
1414
|
const path = this.__.path = [];
|
|
@@ -1520,7 +1564,7 @@ let Canvas = class Canvas extends Rect {
|
|
|
1520
1564
|
}
|
|
1521
1565
|
};
|
|
1522
1566
|
__decorate([
|
|
1523
|
-
dataProcessor(
|
|
1567
|
+
dataProcessor(CanvasData)
|
|
1524
1568
|
], Canvas.prototype, "__", void 0);
|
|
1525
1569
|
__decorate([
|
|
1526
1570
|
resizeType(100)
|
|
@@ -1583,7 +1627,7 @@ let Text = class Text extends UI {
|
|
|
1583
1627
|
data.__padding = padding ? MathHelper.fourNumber(padding) : undefined;
|
|
1584
1628
|
data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2;
|
|
1585
1629
|
data.__font = `${italic ? 'italic ' : ''}${textCase === 'small-caps' ? 'small-caps ' : ''}${fontWeight !== 'normal' ? fontWeight + ' ' : ''}${fontSize}px ${fontFamily}`;
|
|
1586
|
-
data.__clipText = textOverflow !== 'show' && !data.
|
|
1630
|
+
data.__clipText = textOverflow !== 'show' && !data.__autoSize;
|
|
1587
1631
|
this.__updateTextDrawData();
|
|
1588
1632
|
const { bounds } = data.__textDrawData;
|
|
1589
1633
|
const b = layout.boxBounds;
|
|
@@ -1700,25 +1744,16 @@ Text = __decorate([
|
|
|
1700
1744
|
registerUI()
|
|
1701
1745
|
], Text);
|
|
1702
1746
|
|
|
1703
|
-
const { toBounds } = PathBounds;
|
|
1704
1747
|
let Path = class Path extends UI {
|
|
1705
1748
|
get __tag() { return 'Path'; }
|
|
1706
1749
|
constructor(data) {
|
|
1707
1750
|
super(data);
|
|
1708
|
-
|
|
1709
|
-
__updateBoxBounds() {
|
|
1710
|
-
toBounds(this.__.path, this.__layout.boxBounds);
|
|
1751
|
+
this.__.__pathInputed = 2;
|
|
1711
1752
|
}
|
|
1712
1753
|
};
|
|
1713
1754
|
__decorate([
|
|
1714
1755
|
dataProcessor(PathData)
|
|
1715
1756
|
], Path.prototype, "__", void 0);
|
|
1716
|
-
__decorate([
|
|
1717
|
-
pathType()
|
|
1718
|
-
], Path.prototype, "path", void 0);
|
|
1719
|
-
__decorate([
|
|
1720
|
-
pathType()
|
|
1721
|
-
], Path.prototype, "windingRule", void 0);
|
|
1722
1757
|
__decorate([
|
|
1723
1758
|
affectStrokeBoundsType('center')
|
|
1724
1759
|
], Path.prototype, "strokeAlign", void 0);
|
|
@@ -1734,12 +1769,12 @@ let Pen = class Pen extends Group {
|
|
|
1734
1769
|
setStyle(data) {
|
|
1735
1770
|
const path = this.pathElement = new Path(data);
|
|
1736
1771
|
this.pathStyle = data;
|
|
1737
|
-
this.
|
|
1772
|
+
this.__path = path.path || (path.path = []);
|
|
1738
1773
|
this.add(path);
|
|
1739
1774
|
return this;
|
|
1740
1775
|
}
|
|
1741
1776
|
beginPath() {
|
|
1742
|
-
this.
|
|
1777
|
+
this.__path.length = 0;
|
|
1743
1778
|
this.paint();
|
|
1744
1779
|
return this;
|
|
1745
1780
|
}
|
|
@@ -1763,9 +1798,19 @@ let Pen = class Pen extends Group {
|
|
|
1763
1798
|
__decorate([
|
|
1764
1799
|
dataProcessor(PenData)
|
|
1765
1800
|
], Pen.prototype, "__", void 0);
|
|
1801
|
+
__decorate([
|
|
1802
|
+
penPathType()
|
|
1803
|
+
], Pen.prototype, "path", void 0);
|
|
1766
1804
|
Pen = __decorate([
|
|
1767
|
-
useModule(PathCreator, ['beginPath']),
|
|
1805
|
+
useModule(PathCreator, ['beginPath', 'path']),
|
|
1768
1806
|
registerUI()
|
|
1769
1807
|
], Pen);
|
|
1808
|
+
function penPathType() {
|
|
1809
|
+
return (target, key) => {
|
|
1810
|
+
defineKey(target, key, {
|
|
1811
|
+
get() { return this.__path; }
|
|
1812
|
+
});
|
|
1813
|
+
};
|
|
1814
|
+
}
|
|
1770
1815
|
|
|
1771
|
-
export {
|
|
1816
|
+
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, Text, TextConvert, TextData, UI, UIBounds, UIData, UIRender, UnitConvert, arrowType, effectType, resizeType };
|
package/lib/draw.esm.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{defineLeafAttr as t,Debug as e,LeafData as i,PathConvert as s,OneRadian as o,dataProcessor as r,dataType as a,surfaceType as _,opacityType as h,sortType as n,maskType as d,eraserType as p,positionType as l,boundsType as u,scaleType as c,rotationType as y,autoLayoutType as v,hitType as g,strokeType as f,cursorType as w,pathType as x,rewrite as m,Leaf as R,PathDrawer as k,useModule as B,rewriteAble as S,PathCreator as b,PathCorner as P,UICreator as A,Branch as C,registerUI as F,ImageManager as D,DataHelper as E,Creator as L,CanvasManager as T,LeaferEvent as W,canvasSizeAttrs as I,Bounds as M,ResizeEvent as z,AutoBounds as O,WaitHelper as N,Run as H,LayoutEvent as V,RenderEvent as Y,WatchEvent as X,affectRenderBoundsType as j,BoundsHelper as U,Platform as G,PathCommandDataHelper as J,affectStrokeBoundsType as $,getPointData as K,PointHelper as q,PathBounds as Z,ImageEvent as Q,Matrix as tt,MathHelper as et}from"@leafer/core";export*from"@leafer/core";function it(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 _=t.length-1;_>=0;_--)(o=t[_])&&(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 st(e){return(i,s)=>{t(i,s,e,{set(t){this.__setAttr(s,t),t&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})}}function ot(e){return(i,s)=>{t(i,s,e,{set(t){this.__setAttr(s,t),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})}}"function"==typeof SuppressedError&&SuppressedError;const rt={},at={},_t={},ht={},nt={},dt={},pt={},lt={},ut=e.get("UIData");class ct extends i{get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){let{scaleX:e}=this.__leaf.__world;return e<0&&(e=-e),e>1?t/e:t}return t}get __autoWidth(){return!this._width}get __autoHeight(){return!this._height}get __autoBounds(){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,ut.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,ut.warn("height < 0, instead -scaleY",this)):this._height=t}setFill(t){this.__naturalWidth&&(this.__naturalWidth=this.__naturalHeight=void 0),"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=lt)):(this.__isFills&&(this.__removeInput("fill"),ht.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=lt)):(this.__isStrokes&&(this.__removeInput("stroke"),ht.recycleImage("stroke",this),this.__isStrokes=!1,this.__pixelStroke&&(this.__pixelStroke=!1)),this._stroke=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&&_t.compute("fill",this.__leaf),e&&_t.compute("stroke",this.__leaf),this.__needComputePaint=!1}}const yt={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value/100*e:t.value:t};class vt extends ct{}class gt extends vt{get __boxStroke(){return!0}}class ft extends vt{}class wt extends gt{}class xt extends ct{}class mt extends xt{}class Rt extends ct{get __boxStroke(){return!0}}class kt extends ct{get __boxStroke(){return!0}}class Bt extends ct{}class St extends ct{}const{parse:bt}=s;class Pt extends ct{setPath(t){"string"==typeof t?(this.__setInput("path",t),this._path=bt(t)):(this.__input&&this.__removeInput("path"),this._path=t)}}class At extends vt{}const Ct={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class Ft extends ct{setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=Ct[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class Dt extends Rt{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 Et extends Rt{}const Lt={__updateStrokeSpread(){let t=0,e=0;const{stroke:i,hitStroke:s,strokeAlign:r,strokeWidth:a}=this.__;if((i||"all"===s)&&a&&"inside"!==r&&(e=t="center"===r?a/2:a,!this.__.__boxStroke)){const{miterLimit:e,strokeCap:i}=this.__,s="Line"!==this.__tag?1/Math.sin(e*o/2)*Math.sqrt(a)-t:0,r="none"===i?0:a;t+=Math.max(s,r)}return 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}},Tt={__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){const{fill:i,stroke:s,__drawAfterFill:o}=this.__;this.__drawRenderPath(t),i&&_t.fill(i,this,t),o&&this.__drawAfterFill(t,e),s&&_t.stroke(s,this,t)},__draw(t,e){if(this.__.__complex){const i=this.__;i.__needComputePaint&&i.__computePaint();const{fill:s,stroke:o,__drawAfterFill:r}=i;if(this.__drawRenderPath(t),i.__useEffect){const a=_t.shape(this,t,e);this.__nowWorld=this.__getNowWorld(e);const{shadow:_,innerShadow:h}=i;_&&dt.shadow(this,t,a),s&&(i.__isFills?_t.fills(s,this,t):_t.fill(s,this,t)),r&&this.__drawAfterFill(t,e),h&&dt.innerShadow(this,t,a),o&&(i.__isStrokes?_t.strokes(o,this,t):_t.stroke(o,this,t)),a.worldCanvas&&a.worldCanvas.recycle(),a.canvas.recycle()}else s&&(i.__isFills?_t.fills(s,this,t):_t.fill(s,this,t)),r&&this.__drawAfterFill(t,e),o&&(i.__isStrokes?_t.strokes(o,this,t):_t.stroke(o,this,t))}else this.__drawFast(t,e)},__renderShape(t,e){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:i,stroke:s}=this.__;this.__drawRenderPath(t),i&&(this.__.__pixelFill?_t.fills(i,this,t):_t.fill("#000000",this,t)),s&&(this.__.__pixelStroke?_t.strokes(s,this,t):_t.stroke("#000000",this,t))}}},Wt={__drawFast(t,e){const{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:e,__strokeWidth:o}=this.__;if(!o)return;t.setStroke(r,o,this.__);const a=o/2;switch(e){case"center":t.strokeRect(0,0,i,s);break;case"inside":t.strokeRect(a,a,i-o,s-o);break;case"outside":t.strokeRect(-a,-a,i+o,s+o)}}}};var It;let Mt=It=class extends R{get app(){return this.leafer&&this.leafer.app}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}constructor(t){super(t)}reset(t){}set(t){Object.assign(this,t)}get(){return this.__.__getInputData()}createProxyData(){}find(t,e){}findOne(t,e){}getPath(t,e){this.__layout.update();let i=e?this.__.__pathForRender:this.__.path;if(!i){i=[];const{width:t,height:e}=this.boxBounds;(t||e)&&this.__drawPathByBox(new b(i))}return t?s.toCanvasData(i,!0):i}getPathString(t,e){return s.stringify(this.getPath(t,e))}__onUpdateSize(){if(this.__.__input){const t=this.__;if(t.__needComputePaint=!0,t.lazy&&this.leafer&&!this.leafer.canvas.bounds.hit(this.__world))return;t.__computePaint()}}__updateRenderPath(){if(this.__.path){const t=this.__;t.__pathForRender=t.cornerRadius?P.smooth(t.path,t.cornerRadius,t.cornerSmoothing):t.path}}__drawRenderPath(t){t.beginPath(),this.__drawPathByData(t,this.__.__pathForRender)}__drawPath(t){t.beginPath(),this.__drawPathByData(t,this.__.path)}__drawPathByData(t,e){}__drawPathByBox(t){const{x:e,y:i,width:s,height:o}=this.__layout.boxBounds;this.__.cornerRadius?t.roundRect(e,i,s,o,this.__.cornerRadius):t.rect(e,i,s,o)}export(t,e){return pt.export(this,t,e)}clone(){return It.one(this.toJSON())}static one(t,e,i,s,o){return A.get(t.tag||this.prototype.__tag,t,e,i,s,o)}destroy(){this.fill=this.stroke=null,super.destroy()}};it([r(ct)],Mt.prototype,"__",void 0),it([a("")],Mt.prototype,"id",void 0),it([a("")],Mt.prototype,"name",void 0),it([a("")],Mt.prototype,"className",void 0),it([_("pass-through")],Mt.prototype,"blendMode",void 0),it([h(1)],Mt.prototype,"opacity",void 0),it([h(!0)],Mt.prototype,"visible",void 0),it([a(!1)],Mt.prototype,"locked",void 0),it([n(0)],Mt.prototype,"zIndex",void 0),it([d(!1)],Mt.prototype,"mask",void 0),it([_("pixel")],Mt.prototype,"maskType",void 0),it([p(!1)],Mt.prototype,"eraser",void 0),it([l(0)],Mt.prototype,"x",void 0),it([l(0)],Mt.prototype,"y",void 0),it([u(100)],Mt.prototype,"width",void 0),it([u(100)],Mt.prototype,"height",void 0),it([c(1)],Mt.prototype,"scaleX",void 0),it([c(1)],Mt.prototype,"scaleY",void 0),it([y(0)],Mt.prototype,"rotation",void 0),it([y(0)],Mt.prototype,"skewX",void 0),it([y(0)],Mt.prototype,"skewY",void 0),it([v()],Mt.prototype,"around",void 0),it([a(!1)],Mt.prototype,"draggable",void 0),it([a(!1)],Mt.prototype,"editable",void 0),it([a("size")],Mt.prototype,"editSize",void 0),it([g(!0)],Mt.prototype,"hittable",void 0),it([g("path")],Mt.prototype,"hitFill",void 0),it([f("path")],Mt.prototype,"hitStroke",void 0),it([g(!1)],Mt.prototype,"hitBox",void 0),it([g(!0)],Mt.prototype,"hitChildren",void 0),it([g(!0)],Mt.prototype,"hitSelf",void 0),it([g()],Mt.prototype,"hitRadius",void 0),it([w("")],Mt.prototype,"cursor",void 0),it([_()],Mt.prototype,"fill",void 0),it([f()],Mt.prototype,"stroke",void 0),it([f("inside")],Mt.prototype,"strokeAlign",void 0),it([f(1)],Mt.prototype,"strokeWidth",void 0),it([f(!1)],Mt.prototype,"strokeWidthFixed",void 0),it([f("none")],Mt.prototype,"strokeCap",void 0),it([f("miter")],Mt.prototype,"strokeJoin",void 0),it([f()],Mt.prototype,"dashPattern",void 0),it([f()],Mt.prototype,"dashOffset",void 0),it([f(10)],Mt.prototype,"miterLimit",void 0),it([a(!1)],Mt.prototype,"lazy",void 0),it([f("none")],Mt.prototype,"startArrow",void 0),it([f("none")],Mt.prototype,"endArrow",void 0),it([x(0)],Mt.prototype,"cornerRadius",void 0),it([x()],Mt.prototype,"cornerSmoothing",void 0),it([st()],Mt.prototype,"shadow",void 0),it([st()],Mt.prototype,"innerShadow",void 0),it([st()],Mt.prototype,"blur",void 0),it([st()],Mt.prototype,"backgroundBlur",void 0),it([st()],Mt.prototype,"grayscale",void 0),it([m(R.prototype.reset)],Mt.prototype,"reset",null),it([m(k.drawPathByData)],Mt.prototype,"__drawPathByData",null),Mt=It=it([B(Lt),B(Tt),S()],Mt);let zt=class extends Mt{get __tag(){return"Group"}constructor(t){super(t),this.__setBranch()}__setBranch(){this.isBranch=!0,this.children||(this.children=[])}set(t){if(t.children){const{children:e}=t;let i;delete t.children,this.children?this.removeAll(!0):this.__setBranch(),super.set(t),e.forEach((t=>{i=A.get(t.tag,t),this.add(i)})),t.children=e}else super.set(t)}toJSON(){const t=super.toJSON();return t.children=this.children.map((t=>t.toJSON())),t}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(){}};it([r(vt)],zt.prototype,"__",void 0),zt=it([B(C),F()],zt);const Ot=e.get("Leafer");let Nt=class extends zt{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get imageReady(){return this.viewReady&&D.isComplete}get layoutLocked(){return!this.layouter.running}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}constructor(t,e){super(e),this.zoomLayer=this,this.config={type:"design",start:!0,hittable:!0,smooth:!0,zoom:{min:.02,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,dragOut:!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)}init(t,e){if(this.canvas)return;let i;this.__setLeafer(this),t&&E.assign(this.config,t);const{config:s}=this;this.initType(s.type),this.canvas=L.canvas(s),this.__controllers.push(this.renderer=L.renderer(this,this.canvas,s),this.watcher=L.watcher(this,s),this.layouter=L.layouter(this,s)),this.isApp&&this.__setApp(),this.__checkAutoLayout(s),this.view=this.canvas.view,e?(this.__bindApp(e),i=e.running):(this.selector=L.selector(this),this.interaction=L.interaction(this,this.canvas,this.selector,s),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=L.hitCanvasManager()),this.canvasManager=new T,i=s.start),this.hittable=s.hittable,this.fill=s.fill,this.canvasManager.add(this.canvas),this.__listenEvents(),i&&(this.__startTimer=setTimeout(this.start.bind(this))),this.onInit()}onInit(){}initType(t){}set(t){this.children?super.set(t):setTimeout((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(W.RESTART):this.emitLeafer(W.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(W.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(t){const e=E.copyAttrs({},t,I);Object.keys(e).forEach((t=>this[t]=e[t]))}forceFullRender(){this.forceRender()}forceRender(t){this.renderer.addBlock(new M(t)||this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}__doResize(t){if(!this.canvas||this.canvas.isSameSize(t))return;const e=E.copyAttrs({},this.canvas,I);this.canvas.resize(t),this.__onResize(new z(t,e))}__onResize(t){this.emitEvent(t),E.copyAttrs(this.__,t,I),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.isLeafer=!!t,this.__level=1}setZoomLayer(t){this.zoomLayer=t}__checkAutoLayout(t){t.width&&t.height||(this.autoLayout=new O(t),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(t,e){this.canvas&&(I.includes(t)?this.__changeCanvasSize(t,e):"fill"===t?this.__changeFill(e):"hittable"===t&&(this.canvas.hittable=e)),super.__setAttr(t,e)}__getAttr(t){return this.canvas&&I.includes(t)?this.canvas[t]:super.__getAttr(t)}__changeCanvasSize(t,e){const i=E.copyAttrs({},this.canvas,I);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.forceFullRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(W.BEFORE_READY),this.emitLeafer(W.READY),this.emitLeafer(W.AFTER_READY),N.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(W.VIEW_READY),N.run(this.__viewReadyWait))}__onNextRender(){if(this.viewReady){N.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(W.VIEW_COMPLETED),N.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitReady(t){this.ready?t():this.__readyWait.push(t)}waitViewReady(t){this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t){this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e){const i=this.__nextRenderWait;if(e){for(let e=0;e<i.length;e++)if(i[e]===t){i.splice(e,1);break}}else i.push(t)}__checkUpdateLayout(){this.__layout.update()}emitLeafer(t){this.emitEvent(new W(t,this))}__listenEvents(){const t=H.start("FirstCreate "+this.innerName);this.once(W.START,(()=>H.end(t))),this.once(V.END,(()=>this.__onReady())),this.once(Y.START,(()=>this.__onCreated())),this.once(Y.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(X.DATA,this.__onWatchData,this),this.on_(Y.NEXT,this.__onNextRender,this),this.on_(V.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){setTimeout((()=>{if(!this.destroyed)try{this.stop(),this.emitEvent(new W(W.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((()=>{D.clearRecycled()}),100)}catch(t){Ot.error(t)}}))}};it([r(ft)],Nt.prototype,"__",void 0),it([u()],Nt.prototype,"pixelRatio",void 0),Nt=it([F()],Nt);let Ht=class extends Mt{get __tag(){return"Rect"}constructor(t){super(t)}__drawPathByData(t,e){}};it([r(Rt)],Ht.prototype,"__",void 0),it([m(Mt.prototype.__drawPathByBox)],Ht.prototype,"__drawPathByData",null),Ht=it([B(Wt),S(),F()],Ht);const Vt=Ht.prototype,Yt=zt.prototype,Xt={},{copy:jt,add:Ut}=U;let Gt=class extends zt{get __tag(){return"Box"}constructor(t){super(t),this.isBranchLeaf=!0,this.__layout.renderChanged||this.__layout.renderChange()}__updateStrokeSpread(){return 0}__updateRectRenderSpread(){return 0}__updateRenderSpread(){let t=this.__updateRectRenderSpread()||super.__updateRenderSpread();return this.__.__drawAfterFill="hide"===this.__.overflow,t||(t=this.__.__drawAfterFill?0:1),t}__updateRectBoxBounds(){}__updateBoxBounds(){this.__.__autoBounds&&this.children.length?super.__updateBoxBounds():this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){if(this.__updateRectRenderBounds(),!this.__.__drawAfterFill){const{renderBounds:t}=this.__layout;jt(Xt,t),super.__updateRenderBounds(),Ut(t,Xt)}}__updateRectRenderBounds(){}__updateRectChange(){}__updateChange(){super.__updateChange(),this.__updateRectChange()}__drawPathByData(t,e){}__renderRect(t,e){}__renderGroup(t,e){}__render(t,e){this.__.__drawAfterFill?this.__renderRect(t,e):(this.__renderRect(t,e),this.__renderGroup(t,e))}__drawAfterFill(t,e){t.save(),t.clip(),this.__renderGroup(t,e),t.restore(),this.__.stroke&&this.__drawRenderPath(t)}};it([r(gt)],Gt.prototype,"__",void 0),it([j("show")],Gt.prototype,"overflow",void 0),it([m(Vt.__updateStrokeSpread)],Gt.prototype,"__updateStrokeSpread",null),it([m(Vt.__updateRenderSpread)],Gt.prototype,"__updateRectRenderSpread",null),it([m(Vt.__updateBoxBounds)],Gt.prototype,"__updateRectBoxBounds",null),it([m(Vt.__updateStrokeBounds)],Gt.prototype,"__updateStrokeBounds",null),it([m(Vt.__updateRenderBounds)],Gt.prototype,"__updateRectRenderBounds",null),it([m(Vt.__updateChange)],Gt.prototype,"__updateRectChange",null),it([m(Vt.__drawPathByData)],Gt.prototype,"__drawPathByData",null),it([m(Vt.__render)],Gt.prototype,"__renderRect",null),it([m(Yt.__render)],Gt.prototype,"__renderGroup",null),Gt=it([S(),F()],Gt);let Jt=class extends Gt{get __tag(){return"Frame"}constructor(t){super(t),this.isFrame=!0}};it([r(wt)],Jt.prototype,"__",void 0),it([_("#FFFFFF")],Jt.prototype,"fill",void 0),it([j("hide")],Jt.prototype,"overflow",void 0),Jt=it([F()],Jt);const{moveTo:$t,closePath:Kt,ellipse:qt}=J;let Zt=class extends Mt{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,_=this.__.path=[];i?(s||o?(i<1&&qt(_,r,a,r*i,a*i,0,s,o,!1),qt(_,r,a,r,a,0,o,s,!0),i<1&&Kt(_)):(i<1&&(qt(_,r,a,r*i,a*i),$t(_,t,a)),qt(_,r,a,r,a,0,360,0,!0)),G.ellipseToCurve&&(this.__.path=this.getPath(!0))):s||o?($t(_,r,a),qt(_,r,a,r,a,0,s,o,!1),Kt(_)):qt(_,r,a,r,a)}};it([r(kt)],Zt.prototype,"__",void 0),it([x(0)],Zt.prototype,"innerRadius",void 0),it([x(0)],Zt.prototype,"startAngle",void 0),it([x(0)],Zt.prototype,"endAngle",void 0),Zt=it([F()],Zt);const{moveTo:Qt,lineTo:te,drawPoints:ee}=J,{rotate:ie,getAngle:se,getDistance:oe,defaultPoint:re}=q,{toBounds:ae}=Z;let _e=class extends Mt{get __tag(){return"Line"}get toPoint(){const{width:t,rotation:e}=this.__,i=K();return t&&(i.x=t),e&&ie(i,e),i}set toPoint(t){this.width=oe(re,t),this.rotation=se(re,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];this.__.points?ee(t,this.__.points,!1):(Qt(t,0,0),te(t,this.width,0))}__updateRenderPath(){this.__.points&&this.__.curve?ee(this.__.__pathForRender=[],this.__.points,this.__.curve,"Line"!==this.__tag):super.__updateRenderPath()}__updateBoxBounds(){this.points?ae(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}};it([r(xt)],_e.prototype,"__",void 0),it([$("center")],_e.prototype,"strokeAlign",void 0),it([u(0)],_e.prototype,"height",void 0),it([x()],_e.prototype,"points",void 0),it([x(0)],_e.prototype,"curve",void 0),_e=it([F()],_e);const{sin:he,cos:ne,PI:de}=Math,{moveTo:pe,lineTo:le,closePath:ue,drawPoints:ce}=J,ye=_e.prototype;let ve=class extends Mt{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;pe(t,o,0);for(let e=1;e<s;e++)le(t,o+o*he(2*e*de/s),r-r*ne(2*e*de/s))}ue(t)}__updateRenderPath(){}__updateBoxBounds(){}};it([r(Bt)],ve.prototype,"__",void 0),it([x(3)],ve.prototype,"sides",void 0),it([x()],ve.prototype,"points",void 0),it([x(0)],ve.prototype,"curve",void 0),it([m(ye.__updateRenderPath)],ve.prototype,"__updateRenderPath",null),it([m(ye.__updateBoxBounds)],ve.prototype,"__updateBoxBounds",null),ve=it([S(),F()],ve);const{sin:ge,cos:fe,PI:we}=Math,{moveTo:xe,lineTo:me,closePath:Re}=J;let ke=class extends Mt{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=[];xe(a,o,0);for(let t=1;t<2*i;t++)me(a,o+(t%2==0?o:o*s)*ge(t*we/i),r-(t%2==0?r:r*s)*fe(t*we/i));Re(a)}};it([r(St)],ke.prototype,"__",void 0),it([x(5)],ke.prototype,"corners",void 0),it([x(.382)],ke.prototype,"innerRadius",void 0),ke=it([F()],ke);let Be=class extends Ht{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(t){super(t),this.on(Q.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}};it([r(Dt)],Be.prototype,"__",void 0),it([u("")],Be.prototype,"url",void 0),Be=it([F()],Be);let Se=class extends Ht{get __tag(){return"Canvas"}constructor(t){super(t),this.canvas=L.canvas(this.__),this.context=this.canvas.context,this.__.__drawAfterFill=!0}draw(t,e,i,s){t.__layout.update();const o=new tt(t.__world).invert(),r=new tt;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?(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=null,this.context=null),super.destroy()}};it([r(Dt)],Se.prototype,"__",void 0),it([ot(100)],Se.prototype,"width",void 0),it([ot(100)],Se.prototype,"height",void 0),it([ot(G.devicePixelRatio)],Se.prototype,"pixelRatio",void 0),it([ot(!0)],Se.prototype,"smooth",void 0),it([g("all")],Se.prototype,"hitFill",void 0),Se=it([F()],Se);const{copyAndSpread:be,includes:Pe,spread:Ae,setList:Ce}=U;let Fe=class extends Mt{get __tag(){return"Text"}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=rt.getDrawData(t.text,this.__)}__updateBoxBounds(){const t=this.__,e=this.__layout,{lineHeight:i,letterSpacing:s,fontFamily:o,fontSize:r,fontWeight:a,italic:_,textCase:h,textOverflow:n,padding:d}=t,p=t.__autoWidth,l=t.__autoHeight;t.__lineHeight=yt.number(i,r),t.__letterSpacing=yt.number(s,r),t.__padding=d?et.fourNumber(d):void 0,t.__baseLine=t.__lineHeight-(t.__lineHeight-.7*r)/2,t.__font=`${_?"italic ":""}${"small-caps"===h?"small-caps ":""}${"normal"!==a?a+" ":""}${r}px ${o}`,t.__clipText="show"!==n&&!t.__autoBounds,this.__updateTextDrawData();const{bounds:u}=t.__textDrawData,c=e.boxBounds;if(t.__lineHeight<r&&Ae(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();const y=Pe(c,u)?c:u;y!==e.contentBounds?(e.contentBounds=y,e.renderChanged=!0,Ce(t.__textBoxBounds={},[c,u])):t.__textBoxBounds=y}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){be(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}};it([r(Ft)],Fe.prototype,"__",void 0),it([u(0)],Fe.prototype,"width",void 0),it([u(0)],Fe.prototype,"height",void 0),it([u(0)],Fe.prototype,"padding",void 0),it([_("#000000")],Fe.prototype,"fill",void 0),it([$("outside")],Fe.prototype,"strokeAlign",void 0),it([g("all")],Fe.prototype,"hitFill",void 0),it([u("")],Fe.prototype,"text",void 0),it([u("L")],Fe.prototype,"fontFamily",void 0),it([u(12)],Fe.prototype,"fontSize",void 0),it([u("normal")],Fe.prototype,"fontWeight",void 0),it([u(!1)],Fe.prototype,"italic",void 0),it([u("none")],Fe.prototype,"textCase",void 0),it([u("none")],Fe.prototype,"textDecoration",void 0),it([u(0)],Fe.prototype,"letterSpacing",void 0),it([u({type:"percent",value:150})],Fe.prototype,"lineHeight",void 0),it([u(0)],Fe.prototype,"paraIndent",void 0),it([u(0)],Fe.prototype,"paraSpacing",void 0),it([u("left")],Fe.prototype,"textAlign",void 0),it([u("top")],Fe.prototype,"verticalAlign",void 0),it([u("normal")],Fe.prototype,"textWrap",void 0),it([u("show")],Fe.prototype,"textOverflow",void 0),Fe=it([F()],Fe);const{toBounds:De}=Z;let Ee=class extends Mt{get __tag(){return"Path"}constructor(t){super(t)}__updateBoxBounds(){De(this.__.path,this.__layout.boxBounds)}};it([r(Pt)],Ee.prototype,"__",void 0),it([x()],Ee.prototype,"path",void 0),it([x()],Ee.prototype,"windingRule",void 0),it([$("center")],Ee.prototype,"strokeAlign",void 0),Ee=it([F()],Ee);let Le=class extends zt{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new Ee(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,_){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,_){return this}drawArc(t,e,i,s,o,r){return this}drawPoints(t,e,i){return this}paint(){this.pathElement.forceUpdate("path")}};it([r(At)],Le.prototype,"__",void 0),Le=it([B(b,["beginPath"]),F()],Le);export{mt as ArrowData,Gt as Box,gt as BoxData,Se as Canvas,Et as CanvasData,at as ColorConvert,dt as Effect,Zt as Ellipse,kt as EllipseData,pt as Export,Jt as Frame,wt as FrameData,zt as Group,vt as GroupData,Be as Image,Dt as ImageData,Nt as Leafer,ft as LeaferData,_e as Line,xt as LineData,_t as Paint,nt as PaintGradient,ht as PaintImage,Ee as Path,Pt as PathData,Le as Pen,At as PenData,ve as Polygon,Bt as PolygonData,Ht as Rect,Rt as RectData,Wt as RectRender,ke as Star,St as StarData,Fe as Text,rt as TextConvert,Ft as TextData,Mt as UI,Lt as UIBounds,ct as UIData,Tt as UIRender,yt as UnitConvert,st as effectType,ot as resizeType};
|
|
1
|
+
import{defineLeafAttr as t,doStrokeType as e,Debug as i,LeafData as s,PathConvert as o,OneRadian as r,dataProcessor as a,dataType as _,surfaceType as h,opacityType as n,sortType as d,maskType as p,eraserType as l,positionType as u,boundsType as c,scaleType as y,rotationType as g,autoLayoutType as v,hitType as f,strokeType as w,cursorType as x,naturalBoundsType as m,pathInputType as R,pathType as S,rewrite as k,Leaf as b,useModule as B,rewriteAble as A,PathCreator as C,PathCorner as P,PathDrawer as F,UICreator as D,registerUI as E,Branch as T,ImageManager as L,DataHelper as W,Creator as I,CanvasManager as M,LeaferEvent as z,canvasSizeAttrs as O,Bounds as N,ResizeEvent as H,AutoBounds as V,WaitHelper as Y,Run as U,LayoutEvent as X,RenderEvent as j,WatchEvent as G,affectRenderBoundsType as J,BoundsHelper as $,Platform as K,PathCommandDataHelper as q,affectStrokeBoundsType as Z,getPointData as Q,PointHelper as tt,PathBounds as et,ImageEvent as it,Matrix as st,MathHelper as ot,defineKey as rt}from"@leafer/core";export*from"@leafer/core";function at(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 _=t.length-1;_>=0;_--)(o=t[_])&&(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 _t(i){return(s,o)=>{t(s,o,i,{set(t){this.__setAttr(o,t),e(this);const i=this.__;i.__useArrow="none"!==i.startArrow||"none"!==i.endArrow}})}}function ht(e){return(i,s)=>{t(i,s,e,{set(t){this.__setAttr(s,t),t&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})}}function nt(e){return(i,s)=>{t(i,s,e,{set(t){this.__setAttr(s,t),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})}}"function"==typeof SuppressedError&&SuppressedError;const dt={},pt={},lt={},ut={},ct={},yt={},gt={},vt={},{parse:ft}=o,wt={},xt=i.get("UIData");class mt extends s{get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){let{scaleX:e}=this.__leaf.__world;return e<0&&(e=-e),e>1?t/e: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,xt.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,xt.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=wt)):(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=wt)):(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=ft(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 Rt={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value/100*e:t.value:t};class St extends mt{}class kt extends St{get __boxStroke(){return!0}}class bt extends St{}class Bt extends kt{}class At extends mt{}class Ct extends mt{get __boxStroke(){return!0}}class Pt extends mt{get __boxStroke(){return!0}}class Ft extends mt{}class Dt extends mt{}class Et extends mt{}class Tt extends St{}const Lt={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class Wt extends mt{setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=Lt[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class It extends Ct{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 Mt extends Ct{}const zt={__updateStrokeSpread(){let t=0,e=0;const{stroke:i,hitStroke:s,strokeAlign:o,strokeWidth:a}=this.__;if((i||"all"===s)&&a&&"inside"!==o&&(e=t="center"===o?a/2:a,!this.__.__boxStroke)){const{miterLimit:e,strokeCap:i}=this.__,s="Line"!==this.__tag?1/Math.sin(e*r/2)*Math.sqrt(a)-t:0,o="none"===i?0:a;t+=Math.max(s,o)}return this.__layout.strokeBoxSpread=e,this.__.__useArrow&&(t+=5*a),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}},Ot={__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){const{fill:i,stroke:s,__drawAfterFill:o}=this.__;this.__drawRenderPath(t),i&&ut.fill(i,this,t),o&&this.__drawAfterFill(t,e),s&&ut.stroke(s,this,t)},__draw(t,e){if(this.__.__complex){const i=this.__;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:_,innerShadow:h}=i;_&>.shadow(this,t,a),s&&(i.__isFills?ut.fills(s,this,t):ut.fill(s,this,t)),r&&this.__drawAfterFill(t,e),h&>.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 this.__drawFast(t,e)},__renderShape(t,e){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:i,stroke:s}=this.__;this.__drawRenderPath(t),i&&(this.__.__pixelFill?ut.fills(i,this,t):ut.fill("#000000",this,t)),s&&(this.__.__pixelStroke?ut.strokes(s,this,t):ut.stroke("#000000",this,t))}}},Nt={__drawFast(t,e){const{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:e,__strokeWidth:o}=this.__;if(!o)return;t.setStroke(r,o,this.__);const a=o/2;switch(e){case"center":t.strokeRect(0,0,i,s);break;case"inside":t.strokeRect(a,a,i-o,s-o);break;case"outside":t.strokeRect(-a,-a,i+o,s+o)}}}};var Ht;let Vt=Ht=class extends b{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}constructor(t){super(t)}reset(t){}set(t){Object.assign(this,t)}get(t){return t?this.__.__getInput(t):this.__.__getInputData()}createProxyData(){}find(t,e){}findOne(t,e){}getPath(t,e){this.__layout.update();let i=e?this.__.__pathForRender:this.__.path;if(!i){i=[];const{width:t,height:e}=this.boxBounds;(t||e)&&this.__drawPathByBox(new C(i))}return t?o.toCanvasData(i,!0):i}getPathString(t,e){return o.stringify(this.getPath(t,e))}__onUpdateSize(){if(this.__.__input){const t=this.__;if(t.__needComputePaint=!0,t.lazy&&this.leafer&&!this.leafer.canvas.bounds.hit(this.__world))return;t.__computePaint()}}__updateRenderPath(){if(this.__.path){const t=this.__;t.__pathForRender=t.cornerRadius?P.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?F.drawPathByData(t,e):this.__drawPathByBox(t)}__drawPathByBox(t){const{x:e,y:i,width:s,height:o}=this.__layout.boxBounds;this.__.cornerRadius?t.roundRect(e,i,s,o,this.__.cornerRadius):t.rect(e,i,s,o)}export(t,e){return vt.export(this,t,e)}clone(){return Ht.one(this.toJSON())}static one(t,e,i,s,o){return D.get(t.tag||this.prototype.__tag,t,e,i,s,o)}static registerUI(){E()(this)}static registerData(t){a(t)(this.prototype)}destroy(){this.fill=this.stroke=null,super.destroy()}};at([a(mt)],Vt.prototype,"__",void 0),at([_("")],Vt.prototype,"id",void 0),at([_("")],Vt.prototype,"name",void 0),at([_("")],Vt.prototype,"className",void 0),at([h("pass-through")],Vt.prototype,"blendMode",void 0),at([n(1)],Vt.prototype,"opacity",void 0),at([n(!0)],Vt.prototype,"visible",void 0),at([_(!1)],Vt.prototype,"locked",void 0),at([d(0)],Vt.prototype,"zIndex",void 0),at([p(!1)],Vt.prototype,"mask",void 0),at([h("pixel")],Vt.prototype,"maskType",void 0),at([l(!1)],Vt.prototype,"eraser",void 0),at([u(0)],Vt.prototype,"x",void 0),at([u(0)],Vt.prototype,"y",void 0),at([c(100)],Vt.prototype,"width",void 0),at([c(100)],Vt.prototype,"height",void 0),at([y(1)],Vt.prototype,"scaleX",void 0),at([y(1)],Vt.prototype,"scaleY",void 0),at([g(0)],Vt.prototype,"rotation",void 0),at([g(0)],Vt.prototype,"skewX",void 0),at([g(0)],Vt.prototype,"skewY",void 0),at([v()],Vt.prototype,"around",void 0),at([_(!1)],Vt.prototype,"draggable",void 0),at([_(!1)],Vt.prototype,"editable",void 0),at([_("size")],Vt.prototype,"editSize",void 0),at([f(!0)],Vt.prototype,"hittable",void 0),at([f("path")],Vt.prototype,"hitFill",void 0),at([w("path")],Vt.prototype,"hitStroke",void 0),at([f(!1)],Vt.prototype,"hitBox",void 0),at([f(!0)],Vt.prototype,"hitChildren",void 0),at([f(!0)],Vt.prototype,"hitSelf",void 0),at([f()],Vt.prototype,"hitRadius",void 0),at([x("")],Vt.prototype,"cursor",void 0),at([h()],Vt.prototype,"fill",void 0),at([w()],Vt.prototype,"stroke",void 0),at([w("inside")],Vt.prototype,"strokeAlign",void 0),at([w(1)],Vt.prototype,"strokeWidth",void 0),at([w(!1)],Vt.prototype,"strokeWidthFixed",void 0),at([w("none")],Vt.prototype,"strokeCap",void 0),at([w("miter")],Vt.prototype,"strokeJoin",void 0),at([w()],Vt.prototype,"dashPattern",void 0),at([w()],Vt.prototype,"dashOffset",void 0),at([w(10)],Vt.prototype,"miterLimit",void 0),at([_(!1)],Vt.prototype,"lazy",void 0),at([m(1)],Vt.prototype,"pixelRatio",void 0),at([R()],Vt.prototype,"path",void 0),at([S()],Vt.prototype,"windingRule",void 0),at([_t("none")],Vt.prototype,"startArrow",void 0),at([_t("none")],Vt.prototype,"endArrow",void 0),at([S(0)],Vt.prototype,"cornerRadius",void 0),at([S()],Vt.prototype,"cornerSmoothing",void 0),at([ht()],Vt.prototype,"shadow",void 0),at([ht()],Vt.prototype,"innerShadow",void 0),at([ht()],Vt.prototype,"blur",void 0),at([ht()],Vt.prototype,"backgroundBlur",void 0),at([ht()],Vt.prototype,"grayscale",void 0),at([k(b.prototype.reset)],Vt.prototype,"reset",null),Vt=Ht=at([B(zt),B(Ot),A()],Vt);let Yt=class extends Vt{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=D.get(t.tag,t),this.add(i)})),t.children=e}else super.set(t)}toJSON(){const t=super.toJSON();return t.children=this.children.map((t=>t.toJSON())),t}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(){}};at([a(St)],Yt.prototype,"__",void 0),Yt=at([B(T),E()],Yt);const Ut=i.get("Leafer");let Xt=class extends Yt{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get isLeafer(){return!0}get imageReady(){return this.viewReady&&L.isComplete}get layoutLocked(){return!this.layouter.running}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}constructor(t,e){super(e),this.zoomLayer=this,this.config={type:"design",start:!0,hittable:!0,smooth:!0,zoom:{min:.02,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,dragOut:!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)}init(t,e){if(this.canvas)return;let i;this.__setLeafer(this),t&&W.assign(this.config,t);const{config:s}=this;this.initType(s.type),this.canvas=I.canvas(s),this.__controllers.push(this.renderer=I.renderer(this,this.canvas,s),this.watcher=I.watcher(this,s),this.layouter=I.layouter(this,s)),this.isApp&&this.__setApp(),this.__checkAutoLayout(s),this.view=this.canvas.view,e?(this.__bindApp(e),i=e.running):(this.selector=I.selector(this),this.interaction=I.interaction(this,this.canvas,this.selector,s),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=I.hitCanvasManager()),this.canvasManager=new M,i=s.start),this.hittable=s.hittable,this.fill=s.fill,this.canvasManager.add(this.canvas),this.__listenEvents(),i&&(this.__startTimer=setTimeout(this.start.bind(this))),this.onInit()}onInit(){}initType(t){}set(t){this.children?super.set(t):setTimeout((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(z.RESTART):this.emitLeafer(z.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(z.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(t){const e=W.copyAttrs({},t,O);Object.keys(e).forEach((t=>this[t]=e[t]))}forceFullRender(){this.forceRender()}forceRender(t){this.renderer.addBlock(t?new N(t):this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}__doResize(t){if(!this.canvas||this.canvas.isSameSize(t))return;const e=W.copyAttrs({},this.canvas,O);this.canvas.resize(t),this.__onResize(new H(t,e))}__onResize(t){this.emitEvent(t),W.copyAttrs(this.__,t,O),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}setZoomLayer(t){this.zoomLayer=t}__checkAutoLayout(t){t.width&&t.height||(this.autoLayout=new V(t),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(t,e){this.canvas&&(O.includes(t)?this.__changeCanvasSize(t,e):"fill"===t?this.__changeFill(e):"hittable"===t&&(this.canvas.hittable=e)),super.__setAttr(t,e)}__getAttr(t){return this.canvas&&O.includes(t)?this.canvas[t]:super.__getAttr(t)}__changeCanvasSize(t,e){const i=W.copyAttrs({},this.canvas,O);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.forceFullRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(z.BEFORE_READY),this.emitLeafer(z.READY),this.emitLeafer(z.AFTER_READY),Y.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(z.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(z.VIEW_COMPLETED),Y.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitReady(t){this.ready?t():this.__readyWait.push(t)}waitViewReady(t){this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t){this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e){const i=this.__nextRenderWait;if(e){for(let e=0;e<i.length;e++)if(i[e]===t){i.splice(e,1);break}}else i.push(t)}__checkUpdateLayout(){this.__layout.update()}emitLeafer(t){this.emitEvent(new z(t,this))}__listenEvents(){const t=U.start("FirstCreate "+this.innerName);this.once(z.START,(()=>U.end(t))),this.once(X.END,(()=>this.__onReady())),this.once(j.START,(()=>this.__onCreated())),this.once(j.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(G.DATA,this.__onWatchData,this),this.on_(j.NEXT,this.__onNextRender,this),this.on_(X.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){setTimeout((()=>{if(!this.destroyed)try{this.stop(),this.emitEvent(new z(z.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((()=>{L.clearRecycled()}),100)}catch(t){Ut.error(t)}}))}};at([a(bt)],Xt.prototype,"__",void 0),at([c()],Xt.prototype,"pixelRatio",void 0),Xt=at([E()],Xt);let jt=class extends Vt{get __tag(){return"Rect"}constructor(t){super(t)}};at([a(Ct)],jt.prototype,"__",void 0),jt=at([B(Nt),A(),E()],jt);const Gt=jt.prototype,Jt=Yt.prototype,$t={},{copy:Kt,add:qt}=$;let Zt=class extends Yt{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(){let t=this.__updateRectRenderSpread()||super.__updateRenderSpread();return this.__.__drawAfterFill="hide"===this.__.overflow,t||(t=this.__.__drawAfterFill?0:1),t}__updateRectBoxBounds(){}__updateBoxBounds(){const t=this.__;if(t.__autoSide&&this.children.length){if(this.leafer&&this.leafer.layouter.addExtra(this),super.__updateBoxBounds(),!t.__autoSize){const e=this.__layout.boxBounds;t.__autoWidth||(e.x=0,e.width=t.width),t.__autoHeight||(e.y=0,e.height=t.height)}}else this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){if(this.__updateRectRenderBounds(),!this.__.__drawAfterFill){const{renderBounds:t}=this.__layout;Kt($t,t),super.__updateRenderBounds(),qt(t,$t)}}__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.__renderGroup(t,e))}__drawAfterFill(t,e){t.save(),t.clip(),this.__renderGroup(t,e),t.restore(),this.__.stroke&&this.__drawRenderPath(t)}};at([a(kt)],Zt.prototype,"__",void 0),at([J("show")],Zt.prototype,"overflow",void 0),at([k(Gt.__updateStrokeSpread)],Zt.prototype,"__updateStrokeSpread",null),at([k(Gt.__updateRenderSpread)],Zt.prototype,"__updateRectRenderSpread",null),at([k(Gt.__updateBoxBounds)],Zt.prototype,"__updateRectBoxBounds",null),at([k(Gt.__updateStrokeBounds)],Zt.prototype,"__updateStrokeBounds",null),at([k(Gt.__updateRenderBounds)],Zt.prototype,"__updateRectRenderBounds",null),at([k(Gt.__updateChange)],Zt.prototype,"__updateRectChange",null),at([k(Gt.__render)],Zt.prototype,"__renderRect",null),at([k(Jt.__render)],Zt.prototype,"__renderGroup",null),Zt=at([A(),E()],Zt);let Qt=class extends Zt{get __tag(){return"Frame"}get isFrame(){return!0}constructor(t){super(t)}};at([a(Bt)],Qt.prototype,"__",void 0),at([h("#FFFFFF")],Qt.prototype,"fill",void 0),at([J("hide")],Qt.prototype,"overflow",void 0),Qt=at([E()],Qt);const{moveTo:te,closePath:ee,ellipse:ie}=q;let se=class extends Vt{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,_=this.__.path=[];i?(s||o?(i<1&&ie(_,r,a,r*i,a*i,0,s,o,!1),ie(_,r,a,r,a,0,o,s,!0),i<1&&ee(_)):(i<1&&(ie(_,r,a,r*i,a*i),te(_,t,a)),ie(_,r,a,r,a,0,360,0,!0)),K.ellipseToCurve&&(this.__.path=this.getPath(!0))):s||o?(te(_,r,a),ie(_,r,a,r,a,0,s,o,!1),ee(_)):ie(_,r,a,r,a)}};at([a(Pt)],se.prototype,"__",void 0),at([S(0)],se.prototype,"innerRadius",void 0),at([S(0)],se.prototype,"startAngle",void 0),at([S(0)],se.prototype,"endAngle",void 0),se=at([E()],se);const{moveTo:oe,lineTo:re,drawPoints:ae}=q,{rotate:_e,getAngle:he,getDistance:ne,defaultPoint:de}=tt,{toBounds:pe}=et;let le=class extends Vt{get __tag(){return"Line"}get toPoint(){const{width:t,rotation:e}=this.__,i=Q();return t&&(i.x=t),e&&_e(i,e),i}set toPoint(t){this.width=ne(de,t),this.rotation=he(de,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];this.__.points?ae(t,this.__.points,!1):(oe(t,0,0),re(t,this.width,0))}__updateRenderPath(){const t=this.__;!this.pathInputed&&t.points&&t.curve?(ae(t.__pathForRender=[],t.points,t.curve,this.pathClosed),t.__useArrow&<.addArrows(this,!1)):super.__updateRenderPath()}__updateBoxBounds(){this.points?pe(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}};at([a(At)],le.prototype,"__",void 0),at([Z("center")],le.prototype,"strokeAlign",void 0),at([c(0)],le.prototype,"height",void 0),at([S()],le.prototype,"points",void 0),at([S(0)],le.prototype,"curve",void 0),le=at([E()],le);const{sin:ue,cos:ce,PI:ye}=Math,{moveTo:ge,lineTo:ve,closePath:fe,drawPoints:we}=q,xe=le.prototype;let me=class extends Vt{get __tag(){return"Polygon"}constructor(t){super(t),this.pathClosed=!0}__updatePath(){const t=this.__.path=[];if(this.__.points)we(t,this.__.points,!1,!0);else{const{width:e,height:i,sides:s}=this.__,o=e/2,r=i/2;ge(t,o,0);for(let e=1;e<s;e++)ve(t,o+o*ue(2*e*ye/s),r-r*ce(2*e*ye/s))}fe(t)}__updateRenderPath(){}__updateBoxBounds(){}};at([a(Ft)],me.prototype,"__",void 0),at([S(3)],me.prototype,"sides",void 0),at([S()],me.prototype,"points",void 0),at([S(0)],me.prototype,"curve",void 0),at([k(xe.__updateRenderPath)],me.prototype,"__updateRenderPath",null),at([k(xe.__updateBoxBounds)],me.prototype,"__updateBoxBounds",null),me=at([A(),E()],me);const{sin:Re,cos:Se,PI:ke}=Math,{moveTo:be,lineTo:Be,closePath:Ae}=q;let Ce=class extends Vt{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=[];be(a,o,0);for(let t=1;t<2*i;t++)Be(a,o+(t%2==0?o:o*s)*Re(t*ke/i),r-(t%2==0?r:r*s)*Se(t*ke/i));Ae(a)}};at([a(Dt)],Ce.prototype,"__",void 0),at([S(5)],Ce.prototype,"corners",void 0),at([S(.382)],Ce.prototype,"innerRadius",void 0),Ce=at([E()],Ce);let Pe=class extends jt{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(t){super(t),this.on(it.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}};at([a(It)],Pe.prototype,"__",void 0),at([c("")],Pe.prototype,"url",void 0),Pe=at([E()],Pe);let Fe=class extends jt{get __tag(){return"Canvas"}constructor(t){super(t),this.canvas=I.canvas(this.__),this.context=this.canvas.context,this.__.__drawAfterFill=!0}draw(t,e,i,s){t.__layout.update();const o=new st(t.__world).invert(),r=new st;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?(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=null,this.context=null),super.destroy()}};at([a(Mt)],Fe.prototype,"__",void 0),at([nt(100)],Fe.prototype,"width",void 0),at([nt(100)],Fe.prototype,"height",void 0),at([nt(K.devicePixelRatio)],Fe.prototype,"pixelRatio",void 0),at([nt(!0)],Fe.prototype,"smooth",void 0),at([f("all")],Fe.prototype,"hitFill",void 0),Fe=at([E()],Fe);const{copyAndSpread:De,includes:Ee,spread:Te,setList:Le}=$;let We=class extends Vt{get __tag(){return"Text"}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:_,textCase:h,textOverflow:n,padding:d}=t,p=t.__autoWidth,l=t.__autoHeight;t.__lineHeight=Rt.number(i,r),t.__letterSpacing=Rt.number(s,r),t.__padding=d?ot.fourNumber(d):void 0,t.__baseLine=t.__lineHeight-(t.__lineHeight-.7*r)/2,t.__font=`${_?"italic ":""}${"small-caps"===h?"small-caps ":""}${"normal"!==a?a+" ":""}${r}px ${o}`,t.__clipText="show"!==n&&!t.__autoSize,this.__updateTextDrawData();const{bounds:u}=t.__textDrawData,c=e.boxBounds;if(t.__lineHeight<r&&Te(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();const y=Ee(c,u)?c:u;y!==e.contentBounds?(e.contentBounds=y,e.renderChanged=!0,Le(t.__textBoxBounds={},[c,u])):t.__textBoxBounds=y}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){De(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}};at([a(Wt)],We.prototype,"__",void 0),at([c(0)],We.prototype,"width",void 0),at([c(0)],We.prototype,"height",void 0),at([c(0)],We.prototype,"padding",void 0),at([h("#000000")],We.prototype,"fill",void 0),at([Z("outside")],We.prototype,"strokeAlign",void 0),at([f("all")],We.prototype,"hitFill",void 0),at([c("")],We.prototype,"text",void 0),at([c("L")],We.prototype,"fontFamily",void 0),at([c(12)],We.prototype,"fontSize",void 0),at([c("normal")],We.prototype,"fontWeight",void 0),at([c(!1)],We.prototype,"italic",void 0),at([c("none")],We.prototype,"textCase",void 0),at([c("none")],We.prototype,"textDecoration",void 0),at([c(0)],We.prototype,"letterSpacing",void 0),at([c({type:"percent",value:150})],We.prototype,"lineHeight",void 0),at([c(0)],We.prototype,"paraIndent",void 0),at([c(0)],We.prototype,"paraSpacing",void 0),at([c("left")],We.prototype,"textAlign",void 0),at([c("top")],We.prototype,"verticalAlign",void 0),at([c("normal")],We.prototype,"textWrap",void 0),at([c("show")],We.prototype,"textOverflow",void 0),We=at([E()],We);let Ie=class extends Vt{get __tag(){return"Path"}constructor(t){super(t),this.__.__pathInputed=2}};at([a(Et)],Ie.prototype,"__",void 0),at([Z("center")],Ie.prototype,"strokeAlign",void 0),Ie=at([E()],Ie);let Me=class extends Yt{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new Ie(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,_){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,_){return this}drawArc(t,e,i,s,o,r){return this}drawPoints(t,e,i){return this}paint(){this.pathElement.forceUpdate("path")}};at([a(Tt)],Me.prototype,"__",void 0),at([(t,e)=>{rt(t,e,{get(){return this.__path}})}],Me.prototype,"path",void 0),Me=at([B(C,["beginPath","path"]),E()],Me);export{Zt as Box,kt as BoxData,Fe as Canvas,Mt as CanvasData,pt as ColorConvert,gt as Effect,se as Ellipse,Pt as EllipseData,vt as Export,Qt as Frame,Bt as FrameData,Yt as Group,St as GroupData,Pe as Image,It as ImageData,Xt as Leafer,bt as LeaferData,le as Line,At as LineData,ut as Paint,yt as PaintGradient,ct as PaintImage,Ie as Path,lt as PathArrow,Et as PathData,Me as Pen,Tt as PenData,me as Polygon,Ft as PolygonData,jt as Rect,Ct as RectData,Nt as RectRender,Ce as Star,Dt as StarData,We as Text,dt as TextConvert,Wt as TextData,Vt as UI,zt as UIBounds,mt as UIData,Ot as UIRender,Rt as UnitConvert,_t as arrowType,ht as effectType,nt as resizeType};
|
package/lib/draw.min.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var t=require("@leafer/core");function e(t,e,s,r){var o,i=arguments.length,a=i<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,s):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,s,r);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(a=(i<3?o(a):i>3?o(e,s,a):o(e,s))||a);return i>3&&a&&Object.defineProperty(e,s,a),a}function s(e){return(s,r)=>{t.defineLeafAttr(s,r,e,{set(t){this.__setAttr(r,t),t&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})}}function r(e){return(s,r)=>{t.defineLeafAttr(s,r,e,{set(t){this.__setAttr(r,t),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})}}"function"==typeof SuppressedError&&SuppressedError;const o={},i={},a={},n={},p={},h={},_=t.Debug.get("UIData");class d extends t.LeafData{get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){let{scaleX:e}=this.__leaf.__world;return e<0&&(e=-e),e>1?t/e:t}return t}get __autoWidth(){return!this._width}get __autoHeight(){return!this._height}get __autoBounds(){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,_.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,_.warn("height < 0, instead -scaleY",this)):this._height=t}setFill(t){this.__naturalWidth&&(this.__naturalWidth=this.__naturalHeight=void 0),"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=h)):(this.__isFills&&(this.__removeInput("fill"),a.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=h)):(this.__isStrokes&&(this.__removeInput("stroke"),a.recycleImage("stroke",this),this.__isStrokes=!1,this.__pixelStroke&&(this.__pixelStroke=!1)),this._stroke=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&&i.compute("fill",this.__leaf),e&&i.compute("stroke",this.__leaf),this.__needComputePaint=!1}}const l={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value/100*e:t.value:t};class u extends d{}class c extends u{get __boxStroke(){return!0}}class x extends u{}class y extends c{}class v extends d{}class g extends d{get __boxStroke(){return!0}}class f extends d{get __boxStroke(){return!0}}class w extends d{}class m extends d{}const{parse:T}=t.PathConvert;class R extends d{setPath(t){"string"==typeof t?(this.__setInput("path",t),this._path=T(t)):(this.__input&&this.__removeInput("path"),this._path=t)}}class P extends u{}const I={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class B extends d{setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=I[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class b extends g{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}}const k={__updateStrokeSpread(){let e=0,s=0;const{stroke:r,hitStroke:o,strokeAlign:i,strokeWidth:a}=this.__;if((r||"all"===o)&&a&&"inside"!==i&&(s=e="center"===i?a/2:a,!this.__.__boxStroke)){const{miterLimit:s,strokeCap:r}=this.__,o="Line"!==this.__tag?1/Math.sin(s*t.OneRadian/2)*Math.sqrt(a)-e:0,i="none"===r?0:a;e+=Math.max(o,i)}return this.__layout.strokeBoxSpread=s,e},__updateRenderSpread(){let t=0;const{shadow:e,innerShadow:s,blur:r,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)})),r&&(t=Math.max(t,r));let i=t=Math.ceil(t);return s&&s.forEach((t=>{i=Math.max(i,Math.max(Math.abs(t.y),Math.abs(t.x))+(t.spread<0?-t.spread:0)+1.5*t.blur)})),o&&(i=Math.max(i,o)),this.__layout.renderShapeSpread=i,t}},S={__updateChange(){const t=this.__;if(t.__useEffect){const{shadow:e,innerShadow:s,blur:r,backgroundBlur:o}=this.__;t.__useEffect=!!(e||s||r||o)}t.__checkSingle();t.__isFills||t.__isStrokes||t.cornerRadius||t.__useEffect?t.__complex=!0:t.__complex&&(t.__complex=!1)},__drawFast(t,e){const{fill:s,stroke:r,__drawAfterFill:o}=this.__;this.__drawRenderPath(t),s&&i.fill(s,this,t),o&&this.__drawAfterFill(t,e),r&&i.stroke(r,this,t)},__draw(t,e){if(this.__.__complex){const s=this.__;s.__needComputePaint&&s.__computePaint();const{fill:r,stroke:o,__drawAfterFill:a}=s;if(this.__drawRenderPath(t),s.__useEffect){const p=i.shape(this,t,e);this.__nowWorld=this.__getNowWorld(e);const{shadow:h,innerShadow:_}=s;h&&n.shadow(this,t,p),r&&(s.__isFills?i.fills(r,this,t):i.fill(r,this,t)),a&&this.__drawAfterFill(t,e),_&&n.innerShadow(this,t,p),o&&(s.__isStrokes?i.strokes(o,this,t):i.stroke(o,this,t)),p.worldCanvas&&p.worldCanvas.recycle(),p.canvas.recycle()}else r&&(s.__isFills?i.fills(r,this,t):i.fill(r,this,t)),a&&this.__drawAfterFill(t,e),o&&(s.__isStrokes?i.strokes(o,this,t):i.stroke(o,this,t))}else this.__drawFast(t,e)},__renderShape(t,e){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:s,stroke:r}=this.__;this.__drawRenderPath(t),s&&(this.__.__pixelFill?i.fills(s,this,t):i.fill("#000000",this,t)),r&&(this.__.__pixelStroke?i.strokes(r,this,t):i.stroke("#000000",this,t))}}},C={__drawFast(t,e){const{width:s,height:r,fill:o,stroke:i,__drawAfterFill:a}=this.__;if(o&&(t.fillStyle=o,t.fillRect(0,0,s,r)),a&&this.__drawAfterFill(t,e),i){const{strokeAlign:e,__strokeWidth:o}=this.__;if(!o)return;t.setStroke(i,o,this.__);const a=o/2;switch(e){case"center":t.strokeRect(0,0,s,r);break;case"inside":t.strokeRect(a,a,s-o,r-o);break;case"outside":t.strokeRect(-a,-a,s+o,r+o)}}}};var U;exports.UI=U=class extends t.Leaf{get app(){return this.leafer&&this.leafer.app}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}constructor(t){super(t)}reset(t){}set(t){Object.assign(this,t)}get(){return this.__.__getInputData()}createProxyData(){}find(t,e){}findOne(t,e){}getPath(e,s){this.__layout.update();let r=s?this.__.__pathForRender:this.__.path;if(!r){r=[];const{width:e,height:s}=this.boxBounds;(e||s)&&this.__drawPathByBox(new t.PathCreator(r))}return e?t.PathConvert.toCanvasData(r,!0):r}getPathString(e,s){return t.PathConvert.stringify(this.getPath(e,s))}__onUpdateSize(){if(this.__.__input){const t=this.__;if(t.__needComputePaint=!0,t.lazy&&this.leafer&&!this.leafer.canvas.bounds.hit(this.__world))return;t.__computePaint()}}__updateRenderPath(){if(this.__.path){const e=this.__;e.__pathForRender=e.cornerRadius?t.PathCorner.smooth(e.path,e.cornerRadius,e.cornerSmoothing):e.path}}__drawRenderPath(t){t.beginPath(),this.__drawPathByData(t,this.__.__pathForRender)}__drawPath(t){t.beginPath(),this.__drawPathByData(t,this.__.path)}__drawPathByData(t,e){}__drawPathByBox(t){const{x:e,y:s,width:r,height:o}=this.__layout.boxBounds;this.__.cornerRadius?t.roundRect(e,s,r,o,this.__.cornerRadius):t.rect(e,s,r,o)}export(t,e){return p.export(this,t,e)}clone(){return U.one(this.toJSON())}static one(e,s,r,o,i){return t.UICreator.get(e.tag||this.prototype.__tag,e,s,r,o,i)}destroy(){this.fill=this.stroke=null,super.destroy()}},e([t.dataProcessor(d)],exports.UI.prototype,"__",void 0),e([t.dataType("")],exports.UI.prototype,"id",void 0),e([t.dataType("")],exports.UI.prototype,"name",void 0),e([t.dataType("")],exports.UI.prototype,"className",void 0),e([t.surfaceType("pass-through")],exports.UI.prototype,"blendMode",void 0),e([t.opacityType(1)],exports.UI.prototype,"opacity",void 0),e([t.opacityType(!0)],exports.UI.prototype,"visible",void 0),e([t.dataType(!1)],exports.UI.prototype,"locked",void 0),e([t.sortType(0)],exports.UI.prototype,"zIndex",void 0),e([t.maskType(!1)],exports.UI.prototype,"mask",void 0),e([t.surfaceType("pixel")],exports.UI.prototype,"maskType",void 0),e([t.eraserType(!1)],exports.UI.prototype,"eraser",void 0),e([t.positionType(0)],exports.UI.prototype,"x",void 0),e([t.positionType(0)],exports.UI.prototype,"y",void 0),e([t.boundsType(100)],exports.UI.prototype,"width",void 0),e([t.boundsType(100)],exports.UI.prototype,"height",void 0),e([t.scaleType(1)],exports.UI.prototype,"scaleX",void 0),e([t.scaleType(1)],exports.UI.prototype,"scaleY",void 0),e([t.rotationType(0)],exports.UI.prototype,"rotation",void 0),e([t.rotationType(0)],exports.UI.prototype,"skewX",void 0),e([t.rotationType(0)],exports.UI.prototype,"skewY",void 0),e([t.autoLayoutType()],exports.UI.prototype,"around",void 0),e([t.dataType(!1)],exports.UI.prototype,"draggable",void 0),e([t.dataType(!1)],exports.UI.prototype,"editable",void 0),e([t.dataType("size")],exports.UI.prototype,"editSize",void 0),e([t.hitType(!0)],exports.UI.prototype,"hittable",void 0),e([t.hitType("path")],exports.UI.prototype,"hitFill",void 0),e([t.strokeType("path")],exports.UI.prototype,"hitStroke",void 0),e([t.hitType(!1)],exports.UI.prototype,"hitBox",void 0),e([t.hitType(!0)],exports.UI.prototype,"hitChildren",void 0),e([t.hitType(!0)],exports.UI.prototype,"hitSelf",void 0),e([t.hitType()],exports.UI.prototype,"hitRadius",void 0),e([t.cursorType("")],exports.UI.prototype,"cursor",void 0),e([t.surfaceType()],exports.UI.prototype,"fill",void 0),e([t.strokeType()],exports.UI.prototype,"stroke",void 0),e([t.strokeType("inside")],exports.UI.prototype,"strokeAlign",void 0),e([t.strokeType(1)],exports.UI.prototype,"strokeWidth",void 0),e([t.strokeType(!1)],exports.UI.prototype,"strokeWidthFixed",void 0),e([t.strokeType("none")],exports.UI.prototype,"strokeCap",void 0),e([t.strokeType("miter")],exports.UI.prototype,"strokeJoin",void 0),e([t.strokeType()],exports.UI.prototype,"dashPattern",void 0),e([t.strokeType()],exports.UI.prototype,"dashOffset",void 0),e([t.strokeType(10)],exports.UI.prototype,"miterLimit",void 0),e([t.dataType(!1)],exports.UI.prototype,"lazy",void 0),e([t.strokeType("none")],exports.UI.prototype,"startArrow",void 0),e([t.strokeType("none")],exports.UI.prototype,"endArrow",void 0),e([t.pathType(0)],exports.UI.prototype,"cornerRadius",void 0),e([t.pathType()],exports.UI.prototype,"cornerSmoothing",void 0),e([s()],exports.UI.prototype,"shadow",void 0),e([s()],exports.UI.prototype,"innerShadow",void 0),e([s()],exports.UI.prototype,"blur",void 0),e([s()],exports.UI.prototype,"backgroundBlur",void 0),e([s()],exports.UI.prototype,"grayscale",void 0),e([t.rewrite(t.Leaf.prototype.reset)],exports.UI.prototype,"reset",null),e([t.rewrite(t.PathDrawer.drawPathByData)],exports.UI.prototype,"__drawPathByData",null),exports.UI=U=e([t.useModule(k),t.useModule(S),t.rewriteAble()],exports.UI),exports.Group=class extends exports.UI{get __tag(){return"Group"}constructor(t){super(t),this.__setBranch()}__setBranch(){this.isBranch=!0,this.children||(this.children=[])}set(e){if(e.children){const{children:s}=e;let r;delete e.children,this.children?this.removeAll(!0):this.__setBranch(),super.set(e),s.forEach((e=>{r=t.UICreator.get(e.tag,e),this.add(r)})),e.children=s}else super.set(e)}toJSON(){const t=super.toJSON();return t.children=this.children.map((t=>t.toJSON())),t}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(){}},e([t.dataProcessor(u)],exports.Group.prototype,"__",void 0),exports.Group=e([t.useModule(t.Branch),t.registerUI()],exports.Group);const A=t.Debug.get("Leafer");exports.Leafer=class extends exports.Group{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get imageReady(){return this.viewReady&&t.ImageManager.isComplete}get layoutLocked(){return!this.layouter.running}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}constructor(t,e){super(e),this.zoomLayer=this,this.config={type:"design",start:!0,hittable:!0,smooth:!0,zoom:{min:.02,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,dragOut:!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)}init(e,s){if(this.canvas)return;let r;this.__setLeafer(this),e&&t.DataHelper.assign(this.config,e);const{config:o}=this;this.initType(o.type),this.canvas=t.Creator.canvas(o),this.__controllers.push(this.renderer=t.Creator.renderer(this,this.canvas,o),this.watcher=t.Creator.watcher(this,o),this.layouter=t.Creator.layouter(this,o)),this.isApp&&this.__setApp(),this.__checkAutoLayout(o),this.view=this.canvas.view,s?(this.__bindApp(s),r=s.running):(this.selector=t.Creator.selector(this),this.interaction=t.Creator.interaction(this,this.canvas,this.selector,o),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=t.Creator.hitCanvasManager()),this.canvasManager=new t.CanvasManager,r=o.start),this.hittable=o.hittable,this.fill=o.fill,this.canvasManager.add(this.canvas),this.__listenEvents(),r&&(this.__startTimer=setTimeout(this.start.bind(this))),this.onInit()}onInit(){}initType(t){}set(t){this.children?super.set(t):setTimeout((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(t.LeaferEvent.RESTART):this.emitLeafer(t.LeaferEvent.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(t.LeaferEvent.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(e){const s=t.DataHelper.copyAttrs({},e,t.canvasSizeAttrs);Object.keys(s).forEach((t=>this[t]=s[t]))}forceFullRender(){this.forceRender()}forceRender(e){this.renderer.addBlock(new t.Bounds(e)||this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}__doResize(e){if(!this.canvas||this.canvas.isSameSize(e))return;const s=t.DataHelper.copyAttrs({},this.canvas,t.canvasSizeAttrs);this.canvas.resize(e),this.__onResize(new t.ResizeEvent(e,s))}__onResize(e){this.emitEvent(e),t.DataHelper.copyAttrs(this.__,e,t.canvasSizeAttrs),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.isLeafer=!!t,this.__level=1}setZoomLayer(t){this.zoomLayer=t}__checkAutoLayout(e){e.width&&e.height||(this.autoLayout=new t.AutoBounds(e),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(e,s){this.canvas&&(t.canvasSizeAttrs.includes(e)?this.__changeCanvasSize(e,s):"fill"===e?this.__changeFill(s):"hittable"===e&&(this.canvas.hittable=s)),super.__setAttr(e,s)}__getAttr(e){return this.canvas&&t.canvasSizeAttrs.includes(e)?this.canvas[e]:super.__getAttr(e)}__changeCanvasSize(e,s){const r=t.DataHelper.copyAttrs({},this.canvas,t.canvasSizeAttrs);r[e]=this.config[e]=s,s&&this.canvas.stopAutoLayout(),this.__doResize(r)}__changeFill(t){this.config.fill=t,this.canvas.allowBackgroundColor?this.canvas.backgroundColor=t:this.forceFullRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(t.LeaferEvent.BEFORE_READY),this.emitLeafer(t.LeaferEvent.READY),this.emitLeafer(t.LeaferEvent.AFTER_READY),t.WaitHelper.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(t.LeaferEvent.VIEW_READY),t.WaitHelper.run(this.__viewReadyWait))}__onNextRender(){if(this.viewReady){t.WaitHelper.run(this.__nextRenderWait);const{imageReady:e}=this;e&&!this.viewCompleted&&this.__checkViewCompleted(),e||(this.viewCompleted=!1)}}__checkViewCompleted(e=!0){this.nextRender((()=>{this.imageReady&&(e&&this.emitLeafer(t.LeaferEvent.VIEW_COMPLETED),t.WaitHelper.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitReady(t){this.ready?t():this.__readyWait.push(t)}waitViewReady(t){this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t){this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e){const s=this.__nextRenderWait;if(e){for(let e=0;e<s.length;e++)if(s[e]===t){s.splice(e,1);break}}else s.push(t)}__checkUpdateLayout(){this.__layout.update()}emitLeafer(e){this.emitEvent(new t.LeaferEvent(e,this))}__listenEvents(){const e=t.Run.start("FirstCreate "+this.innerName);this.once(t.LeaferEvent.START,(()=>t.Run.end(e))),this.once(t.LayoutEvent.END,(()=>this.__onReady())),this.once(t.RenderEvent.START,(()=>this.__onCreated())),this.once(t.RenderEvent.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(t.WatchEvent.DATA,this.__onWatchData,this),this.on_(t.RenderEvent.NEXT,this.__onNextRender,this),this.on_(t.LayoutEvent.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){setTimeout((()=>{if(!this.destroyed)try{this.stop(),this.emitEvent(new t.LeaferEvent(t.LeaferEvent.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((()=>{t.ImageManager.clearRecycled()}),100)}catch(t){A.error(t)}}))}},e([t.dataProcessor(x)],exports.Leafer.prototype,"__",void 0),e([t.boundsType()],exports.Leafer.prototype,"pixelRatio",void 0),exports.Leafer=e([t.registerUI()],exports.Leafer),exports.Rect=class extends exports.UI{get __tag(){return"Rect"}constructor(t){super(t)}__drawPathByData(t,e){}},e([t.dataProcessor(g)],exports.Rect.prototype,"__",void 0),e([t.rewrite(exports.UI.prototype.__drawPathByBox)],exports.Rect.prototype,"__drawPathByData",null),exports.Rect=e([t.useModule(C),t.rewriteAble(),t.registerUI()],exports.Rect);const D=exports.Rect.prototype,L=exports.Group.prototype,E={},{copy:F,add:W}=t.BoundsHelper;exports.Box=class extends exports.Group{get __tag(){return"Box"}constructor(t){super(t),this.isBranchLeaf=!0,this.__layout.renderChanged||this.__layout.renderChange()}__updateStrokeSpread(){return 0}__updateRectRenderSpread(){return 0}__updateRenderSpread(){let t=this.__updateRectRenderSpread()||super.__updateRenderSpread();return this.__.__drawAfterFill="hide"===this.__.overflow,t||(t=this.__.__drawAfterFill?0:1),t}__updateRectBoxBounds(){}__updateBoxBounds(){this.__.__autoBounds&&this.children.length?super.__updateBoxBounds():this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){if(this.__updateRectRenderBounds(),!this.__.__drawAfterFill){const{renderBounds:t}=this.__layout;F(E,t),super.__updateRenderBounds(),W(t,E)}}__updateRectRenderBounds(){}__updateRectChange(){}__updateChange(){super.__updateChange(),this.__updateRectChange()}__drawPathByData(t,e){}__renderRect(t,e){}__renderGroup(t,e){}__render(t,e){this.__.__drawAfterFill?this.__renderRect(t,e):(this.__renderRect(t,e),this.__renderGroup(t,e))}__drawAfterFill(t,e){t.save(),t.clip(),this.__renderGroup(t,e),t.restore(),this.__.stroke&&this.__drawRenderPath(t)}},e([t.dataProcessor(c)],exports.Box.prototype,"__",void 0),e([t.affectRenderBoundsType("show")],exports.Box.prototype,"overflow",void 0),e([t.rewrite(D.__updateStrokeSpread)],exports.Box.prototype,"__updateStrokeSpread",null),e([t.rewrite(D.__updateRenderSpread)],exports.Box.prototype,"__updateRectRenderSpread",null),e([t.rewrite(D.__updateBoxBounds)],exports.Box.prototype,"__updateRectBoxBounds",null),e([t.rewrite(D.__updateStrokeBounds)],exports.Box.prototype,"__updateStrokeBounds",null),e([t.rewrite(D.__updateRenderBounds)],exports.Box.prototype,"__updateRectRenderBounds",null),e([t.rewrite(D.__updateChange)],exports.Box.prototype,"__updateRectChange",null),e([t.rewrite(D.__drawPathByData)],exports.Box.prototype,"__drawPathByData",null),e([t.rewrite(D.__render)],exports.Box.prototype,"__renderRect",null),e([t.rewrite(L.__render)],exports.Box.prototype,"__renderGroup",null),exports.Box=e([t.rewriteAble(),t.registerUI()],exports.Box),exports.Frame=class extends exports.Box{get __tag(){return"Frame"}constructor(t){super(t),this.isFrame=!0}},e([t.dataProcessor(y)],exports.Frame.prototype,"__",void 0),e([t.surfaceType("#FFFFFF")],exports.Frame.prototype,"fill",void 0),e([t.affectRenderBoundsType("hide")],exports.Frame.prototype,"overflow",void 0),exports.Frame=e([t.registerUI()],exports.Frame);const{moveTo:M,closePath:z,ellipse:H}=t.PathCommandDataHelper;exports.Ellipse=class extends exports.UI{get __tag(){return"Ellipse"}constructor(t){super(t)}__updatePath(){const{width:e,height:s,innerRadius:r,startAngle:o,endAngle:i}=this.__,a=e/2,n=s/2,p=this.__.path=[];r?(o||i?(r<1&&H(p,a,n,a*r,n*r,0,o,i,!1),H(p,a,n,a,n,0,i,o,!0),r<1&&z(p)):(r<1&&(H(p,a,n,a*r,n*r),M(p,e,n)),H(p,a,n,a,n,0,360,0,!0)),t.Platform.ellipseToCurve&&(this.__.path=this.getPath(!0))):o||i?(M(p,a,n),H(p,a,n,a,n,0,o,i,!1),z(p)):H(p,a,n,a,n)}},e([t.dataProcessor(f)],exports.Ellipse.prototype,"__",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"innerRadius",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"startAngle",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"endAngle",void 0),exports.Ellipse=e([t.registerUI()],exports.Ellipse);const{moveTo:O,lineTo:N,drawPoints:G}=t.PathCommandDataHelper,{rotate:V,getAngle:j,getDistance:Y,defaultPoint:X}=t.PointHelper,{toBounds:J}=t.PathBounds;exports.Line=class extends exports.UI{get __tag(){return"Line"}get toPoint(){const{width:e,rotation:s}=this.__,r=t.getPointData();return e&&(r.x=e),s&&V(r,s),r}set toPoint(t){this.width=Y(X,t),this.rotation=j(X,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];this.__.points?G(t,this.__.points,!1):(O(t,0,0),N(t,this.width,0))}__updateRenderPath(){this.__.points&&this.__.curve?G(this.__.__pathForRender=[],this.__.points,this.__.curve,"Line"!==this.__tag):super.__updateRenderPath()}__updateBoxBounds(){this.points?J(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}},e([t.dataProcessor(v)],exports.Line.prototype,"__",void 0),e([t.affectStrokeBoundsType("center")],exports.Line.prototype,"strokeAlign",void 0),e([t.boundsType(0)],exports.Line.prototype,"height",void 0),e([t.pathType()],exports.Line.prototype,"points",void 0),e([t.pathType(0)],exports.Line.prototype,"curve",void 0),exports.Line=e([t.registerUI()],exports.Line);const{sin:$,cos:q,PI:K}=Math,{moveTo:Z,lineTo:Q,closePath:tt,drawPoints:et}=t.PathCommandDataHelper,st=exports.Line.prototype;exports.Polygon=class extends exports.UI{get __tag(){return"Polygon"}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];if(this.__.points)et(t,this.__.points,!1,!0);else{const{width:e,height:s,sides:r}=this.__,o=e/2,i=s/2;Z(t,o,0);for(let e=1;e<r;e++)Q(t,o+o*$(2*e*K/r),i-i*q(2*e*K/r))}tt(t)}__updateRenderPath(){}__updateBoxBounds(){}},e([t.dataProcessor(w)],exports.Polygon.prototype,"__",void 0),e([t.pathType(3)],exports.Polygon.prototype,"sides",void 0),e([t.pathType()],exports.Polygon.prototype,"points",void 0),e([t.pathType(0)],exports.Polygon.prototype,"curve",void 0),e([t.rewrite(st.__updateRenderPath)],exports.Polygon.prototype,"__updateRenderPath",null),e([t.rewrite(st.__updateBoxBounds)],exports.Polygon.prototype,"__updateBoxBounds",null),exports.Polygon=e([t.rewriteAble(),t.registerUI()],exports.Polygon);const{sin:rt,cos:ot,PI:it}=Math,{moveTo:at,lineTo:nt,closePath:pt}=t.PathCommandDataHelper;exports.Star=class extends exports.UI{get __tag(){return"Star"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,corners:s,innerRadius:r}=this.__,o=t/2,i=e/2,a=this.__.path=[];at(a,o,0);for(let t=1;t<2*s;t++)nt(a,o+(t%2==0?o:o*r)*rt(t*it/s),i-(t%2==0?i:i*r)*ot(t*it/s));pt(a)}},e([t.dataProcessor(m)],exports.Star.prototype,"__",void 0),e([t.pathType(5)],exports.Star.prototype,"corners",void 0),e([t.pathType(.382)],exports.Star.prototype,"innerRadius",void 0),exports.Star=e([t.registerUI()],exports.Star),exports.Image=class extends exports.Rect{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(e){super(e),this.on(t.ImageEvent.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}},e([t.dataProcessor(b)],exports.Image.prototype,"__",void 0),e([t.boundsType("")],exports.Image.prototype,"url",void 0),exports.Image=e([t.registerUI()],exports.Image),exports.Canvas=class extends exports.Rect{get __tag(){return"Canvas"}constructor(e){super(e),this.canvas=t.Creator.canvas(this.__),this.context=this.canvas.context,this.__.__drawAfterFill=!0}draw(e,s,r,o){e.__layout.update();const i=new t.Matrix(e.__world).invert(),a=new t.Matrix;s&&a.translate(s.x,s.y),r&&("number"==typeof r?a.scale(r):a.scale(r.x,r.y)),o&&a.rotate(o),i.multiplyParent(a),e.__render(this.canvas,{matrix:i.withScale()}),this.paint()}paint(){this.forceUpdate("fill")}__drawAfterFill(t,e){const s=this.canvas.view,{width:r,height:o}=this;this.__.cornerRadius?(t.save(),t.clip(),t.drawImage(this.canvas.view,0,0,s.width,s.height,0,0,r,o),t.restore()):t.drawImage(this.canvas.view,0,0,s.width,s.height,0,0,r,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=null,this.context=null),super.destroy()}},e([t.dataProcessor(b)],exports.Canvas.prototype,"__",void 0),e([r(100)],exports.Canvas.prototype,"width",void 0),e([r(100)],exports.Canvas.prototype,"height",void 0),e([r(t.Platform.devicePixelRatio)],exports.Canvas.prototype,"pixelRatio",void 0),e([r(!0)],exports.Canvas.prototype,"smooth",void 0),e([t.hitType("all")],exports.Canvas.prototype,"hitFill",void 0),exports.Canvas=e([t.registerUI()],exports.Canvas);const{copyAndSpread:ht,includes:_t,spread:dt,setList:lt}=t.BoundsHelper;exports.Text=class extends exports.UI{get __tag(){return"Text"}get textDrawData(){return this.__layout.update(),this.__.__textDrawData}constructor(t){super(t)}__drawHitPath(t){const{__lineHeight:e,__baseLine:s,__textDrawData:r}=this.__;t.beginPath(),this.__.__letterSpacing<0?this.__drawPathByData(t):r.rows.forEach((r=>t.rect(r.x,r.y-s,r.width,e)))}__drawPathByData(t,e){const{x:s,y:r,width:o,height:i}=this.__layout.boxBounds;t.rect(s,r,o,i)}__drawRenderPath(t){t.font=this.__.__font}__updateTextDrawData(){const t=this.__;t.__textDrawData=o.getDrawData(t.text,this.__)}__updateBoxBounds(){const e=this.__,s=this.__layout,{lineHeight:r,letterSpacing:o,fontFamily:i,fontSize:a,fontWeight:n,italic:p,textCase:h,textOverflow:_,padding:d}=e,u=e.__autoWidth,c=e.__autoHeight;e.__lineHeight=l.number(r,a),e.__letterSpacing=l.number(o,a),e.__padding=d?t.MathHelper.fourNumber(d):void 0,e.__baseLine=e.__lineHeight-(e.__lineHeight-.7*a)/2,e.__font=`${p?"italic ":""}${"small-caps"===h?"small-caps ":""}${"normal"!==n?n+" ":""}${a}px ${i}`,e.__clipText="show"!==_&&!e.__autoBounds,this.__updateTextDrawData();const{bounds:x}=e.__textDrawData,y=s.boxBounds;if(e.__lineHeight<a&&dt(x,a/2),u||c){if(y.x=u?x.x:0,y.y=c?x.y:0,y.width=u?x.width:e.width,y.height=c?x.height:e.height,d){const[t,s,r,o]=e.__padding;u&&(y.x-=o,y.width+=s+o),c&&(y.y-=t,y.height+=r+t)}this.__updateNaturalSize()}else super.__updateBoxBounds();const v=_t(y,x)?y:x;v!==s.contentBounds?(s.contentBounds=v,s.renderChanged=!0,lt(e.__textBoxBounds={},[y,x])):e.__textBoxBounds=v}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){ht(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}},e([t.dataProcessor(B)],exports.Text.prototype,"__",void 0),e([t.boundsType(0)],exports.Text.prototype,"width",void 0),e([t.boundsType(0)],exports.Text.prototype,"height",void 0),e([t.boundsType(0)],exports.Text.prototype,"padding",void 0),e([t.surfaceType("#000000")],exports.Text.prototype,"fill",void 0),e([t.affectStrokeBoundsType("outside")],exports.Text.prototype,"strokeAlign",void 0),e([t.hitType("all")],exports.Text.prototype,"hitFill",void 0),e([t.boundsType("")],exports.Text.prototype,"text",void 0),e([t.boundsType("L")],exports.Text.prototype,"fontFamily",void 0),e([t.boundsType(12)],exports.Text.prototype,"fontSize",void 0),e([t.boundsType("normal")],exports.Text.prototype,"fontWeight",void 0),e([t.boundsType(!1)],exports.Text.prototype,"italic",void 0),e([t.boundsType("none")],exports.Text.prototype,"textCase",void 0),e([t.boundsType("none")],exports.Text.prototype,"textDecoration",void 0),e([t.boundsType(0)],exports.Text.prototype,"letterSpacing",void 0),e([t.boundsType({type:"percent",value:150})],exports.Text.prototype,"lineHeight",void 0),e([t.boundsType(0)],exports.Text.prototype,"paraIndent",void 0),e([t.boundsType(0)],exports.Text.prototype,"paraSpacing",void 0),e([t.boundsType("left")],exports.Text.prototype,"textAlign",void 0),e([t.boundsType("top")],exports.Text.prototype,"verticalAlign",void 0),e([t.boundsType("normal")],exports.Text.prototype,"textWrap",void 0),e([t.boundsType("show")],exports.Text.prototype,"textOverflow",void 0),exports.Text=e([t.registerUI()],exports.Text);const{toBounds:ut}=t.PathBounds;exports.Path=class extends exports.UI{get __tag(){return"Path"}constructor(t){super(t)}__updateBoxBounds(){ut(this.__.path,this.__layout.boxBounds)}},e([t.dataProcessor(R)],exports.Path.prototype,"__",void 0),e([t.pathType()],exports.Path.prototype,"path",void 0),e([t.pathType()],exports.Path.prototype,"windingRule",void 0),e([t.affectStrokeBoundsType("center")],exports.Path.prototype,"strokeAlign",void 0),exports.Path=e([t.registerUI()],exports.Path),exports.Pen=class extends exports.Group{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new exports.Path(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,s,r,o,i){return this}quadraticCurveTo(t,e,s,r){return this}closePath(){return this}rect(t,e,s,r){return this}roundRect(t,e,s,r,o){return this}ellipse(t,e,s,r,o,i,a,n){return this}arc(t,e,s,r,o,i){return this}arcTo(t,e,s,r,o){return this}drawEllipse(t,e,s,r,o,i,a,n){return this}drawArc(t,e,s,r,o,i){return this}drawPoints(t,e,s){return this}paint(){this.pathElement.forceUpdate("path")}},e([t.dataProcessor(P)],exports.Pen.prototype,"__",void 0),exports.Pen=e([t.useModule(t.PathCreator,["beginPath"]),t.registerUI()],exports.Pen),exports.ArrowData=class extends v{},exports.BoxData=c,exports.CanvasData=class extends g{},exports.ColorConvert={},exports.Effect=n,exports.EllipseData=f,exports.Export=p,exports.FrameData=y,exports.GroupData=u,exports.ImageData=b,exports.LeaferData=x,exports.LineData=v,exports.Paint=i,exports.PaintGradient={},exports.PaintImage=a,exports.PathData=R,exports.PenData=P,exports.PolygonData=w,exports.RectData=g,exports.RectRender=C,exports.StarData=m,exports.TextConvert=o,exports.TextData=B,exports.UIBounds=k,exports.UIData=d,exports.UIRender=S,exports.UnitConvert=l,exports.effectType=s,exports.resizeType=r,Object.keys(t).forEach((function(e){"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return t[e]}})}));
|
|
1
|
+
"use strict";var t=require("@leafer/core");function e(t,e,s,r){var o,i=arguments.length,a=i<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,s):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,s,r);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(a=(i<3?o(a):i>3?o(e,s,a):o(e,s))||a);return i>3&&a&&Object.defineProperty(e,s,a),a}function s(e){return(s,r)=>{t.defineLeafAttr(s,r,e,{set(e){this.__setAttr(r,e),t.doStrokeType(this);const s=this.__;s.__useArrow="none"!==s.startArrow||"none"!==s.endArrow}})}}function r(e){return(s,r)=>{t.defineLeafAttr(s,r,e,{set(t){this.__setAttr(r,t),t&&(this.__.__useEffect=!0),this.__layout.renderChanged||this.__layout.renderChange()}})}}function o(e){return(s,r)=>{t.defineLeafAttr(s,r,e,{set(t){this.__setAttr(r,t),this.__layout.boxChanged||this.__layout.boxChange(),this.__updateSize()}})}}"function"==typeof SuppressedError&&SuppressedError;const i={},a={},n={},p={},h={},_={},{parse:d}=t.PathConvert,l={},u=t.Debug.get("UIData");class c extends t.LeafData{get __strokeWidth(){const{strokeWidth:t,strokeWidthFixed:e}=this;if(e){let{scaleX:e}=this.__leaf.__world;return e<0&&(e=-e),e>1?t/e: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,u.warn("width < 0, instead -scaleX ",this)):this._width=t}setHeight(t){t<0?(this._height=-t,this.__leaf.scaleY*=-1,u.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=l)):(this.__isFills&&(this.__removeInput("fill"),p.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=l)):(this.__isStrokes&&(this.__removeInput("stroke"),p.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=d(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&&n.compute("fill",this.__leaf),e&&n.compute("stroke",this.__leaf),this.__needComputePaint=!1}}const x={number:(t,e)=>"object"==typeof t?"percent"===t.type?t.value/100*e:t.value:t};class y extends c{}class g extends y{get __boxStroke(){return!0}}class v extends y{}class f extends g{}class w extends c{}class m extends c{get __boxStroke(){return!0}}class T extends c{get __boxStroke(){return!0}}class R extends c{}class I extends c{}class P extends c{}class b extends y{}const S={thin:100,"extra-light":200,light:300,normal:400,medium:500,"semi-bold":600,bold:700,"extra-bold":800,black:900};class k extends c{setFontWeight(t){"string"==typeof t?(this.__setInput("fontWeight",t),this._fontWeight=S[t]||400):(this.__input&&this.__removeInput("fontWeight"),this._fontWeight=t)}}class B extends m{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 C extends m{}const U={__updateStrokeSpread(){let e=0,s=0;const{stroke:r,hitStroke:o,strokeAlign:i,strokeWidth:a}=this.__;if((r||"all"===o)&&a&&"inside"!==i&&(s=e="center"===i?a/2:a,!this.__.__boxStroke)){const{miterLimit:s,strokeCap:r}=this.__,o="Line"!==this.__tag?1/Math.sin(s*t.OneRadian/2)*Math.sqrt(a)-e:0,i="none"===r?0:a;e+=Math.max(o,i)}return this.__layout.strokeBoxSpread=s,this.__.__useArrow&&(e+=5*a),e},__updateRenderSpread(){let t=0;const{shadow:e,innerShadow:s,blur:r,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)})),r&&(t=Math.max(t,r));let i=t=Math.ceil(t);return s&&s.forEach((t=>{i=Math.max(i,Math.max(Math.abs(t.y),Math.abs(t.x))+(t.spread<0?-t.spread:0)+1.5*t.blur)})),o&&(i=Math.max(i,o)),this.__layout.renderShapeSpread=i,t}},A={__updateChange(){const t=this.__;if(t.__useEffect){const{shadow:e,innerShadow:s,blur:r,backgroundBlur:o}=this.__;t.__useEffect=!!(e||s||r||o)}t.__checkSingle();t.__isFills||t.__isStrokes||t.cornerRadius||t.__useEffect?t.__complex=!0:t.__complex&&(t.__complex=!1)},__drawFast(t,e){const{fill:s,stroke:r,__drawAfterFill:o}=this.__;this.__drawRenderPath(t),s&&n.fill(s,this,t),o&&this.__drawAfterFill(t,e),r&&n.stroke(r,this,t)},__draw(t,e){if(this.__.__complex){const s=this.__;s.__needComputePaint&&s.__computePaint();const{fill:r,stroke:o,__drawAfterFill:i}=s;if(this.__drawRenderPath(t),s.__useEffect){const a=n.shape(this,t,e);this.__nowWorld=this.__getNowWorld(e);const{shadow:p,innerShadow:_}=s;p&&h.shadow(this,t,a),r&&(s.__isFills?n.fills(r,this,t):n.fill(r,this,t)),i&&this.__drawAfterFill(t,e),_&&h.innerShadow(this,t,a),o&&(s.__isStrokes?n.strokes(o,this,t):n.stroke(o,this,t)),a.worldCanvas&&a.worldCanvas.recycle(),a.canvas.recycle()}else r&&(s.__isFills?n.fills(r,this,t):n.fill(r,this,t)),i&&this.__drawAfterFill(t,e),o&&(s.__isStrokes?n.strokes(o,this,t):n.stroke(o,this,t))}else this.__drawFast(t,e)},__renderShape(t,e){if(this.__worldOpacity){t.setWorld(this.__nowWorld=this.__getNowWorld(e));const{fill:s,stroke:r}=this.__;this.__drawRenderPath(t),s&&(this.__.__pixelFill?n.fills(s,this,t):n.fill("#000000",this,t)),r&&(this.__.__pixelStroke?n.strokes(r,this,t):n.stroke("#000000",this,t))}}},L={__drawFast(t,e){const{width:s,height:r,fill:o,stroke:i,__drawAfterFill:a}=this.__;if(o&&(t.fillStyle=o,t.fillRect(0,0,s,r)),a&&this.__drawAfterFill(t,e),i){const{strokeAlign:e,__strokeWidth:o}=this.__;if(!o)return;t.setStroke(i,o,this.__);const a=o/2;switch(e){case"center":t.strokeRect(0,0,s,r);break;case"inside":t.strokeRect(a,a,s-o,r-o);break;case"outside":t.strokeRect(-a,-a,s+o,r+o)}}}};var D;exports.UI=D=class extends t.Leaf{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}constructor(t){super(t)}reset(t){}set(t){Object.assign(this,t)}get(t){return t?this.__.__getInput(t):this.__.__getInputData()}createProxyData(){}find(t,e){}findOne(t,e){}getPath(e,s){this.__layout.update();let r=s?this.__.__pathForRender:this.__.path;if(!r){r=[];const{width:e,height:s}=this.boxBounds;(e||s)&&this.__drawPathByBox(new t.PathCreator(r))}return e?t.PathConvert.toCanvasData(r,!0):r}getPathString(e,s){return t.PathConvert.stringify(this.getPath(e,s))}__onUpdateSize(){if(this.__.__input){const t=this.__;if(t.__needComputePaint=!0,t.lazy&&this.leafer&&!this.leafer.canvas.bounds.hit(this.__world))return;t.__computePaint()}}__updateRenderPath(){if(this.__.path){const e=this.__;e.__pathForRender=e.cornerRadius?t.PathCorner.smooth(e.path,e.cornerRadius,e.cornerSmoothing):e.path,e.__useArrow&&a.addArrows(this,!e.cornerRadius)}}__drawRenderPath(t){t.beginPath(),this.__drawPathByData(t,this.__.__pathForRender)}__drawPath(t){t.beginPath(),this.__drawPathByData(t,this.__.path)}__drawPathByData(e,s){s?t.PathDrawer.drawPathByData(e,s):this.__drawPathByBox(e)}__drawPathByBox(t){const{x:e,y:s,width:r,height:o}=this.__layout.boxBounds;this.__.cornerRadius?t.roundRect(e,s,r,o,this.__.cornerRadius):t.rect(e,s,r,o)}export(t,e){return _.export(this,t,e)}clone(){return D.one(this.toJSON())}static one(e,s,r,o,i){return t.UICreator.get(e.tag||this.prototype.__tag,e,s,r,o,i)}static registerUI(){t.registerUI()(this)}static registerData(e){t.dataProcessor(e)(this.prototype)}destroy(){this.fill=this.stroke=null,super.destroy()}},e([t.dataProcessor(c)],exports.UI.prototype,"__",void 0),e([t.dataType("")],exports.UI.prototype,"id",void 0),e([t.dataType("")],exports.UI.prototype,"name",void 0),e([t.dataType("")],exports.UI.prototype,"className",void 0),e([t.surfaceType("pass-through")],exports.UI.prototype,"blendMode",void 0),e([t.opacityType(1)],exports.UI.prototype,"opacity",void 0),e([t.opacityType(!0)],exports.UI.prototype,"visible",void 0),e([t.dataType(!1)],exports.UI.prototype,"locked",void 0),e([t.sortType(0)],exports.UI.prototype,"zIndex",void 0),e([t.maskType(!1)],exports.UI.prototype,"mask",void 0),e([t.surfaceType("pixel")],exports.UI.prototype,"maskType",void 0),e([t.eraserType(!1)],exports.UI.prototype,"eraser",void 0),e([t.positionType(0)],exports.UI.prototype,"x",void 0),e([t.positionType(0)],exports.UI.prototype,"y",void 0),e([t.boundsType(100)],exports.UI.prototype,"width",void 0),e([t.boundsType(100)],exports.UI.prototype,"height",void 0),e([t.scaleType(1)],exports.UI.prototype,"scaleX",void 0),e([t.scaleType(1)],exports.UI.prototype,"scaleY",void 0),e([t.rotationType(0)],exports.UI.prototype,"rotation",void 0),e([t.rotationType(0)],exports.UI.prototype,"skewX",void 0),e([t.rotationType(0)],exports.UI.prototype,"skewY",void 0),e([t.autoLayoutType()],exports.UI.prototype,"around",void 0),e([t.dataType(!1)],exports.UI.prototype,"draggable",void 0),e([t.dataType(!1)],exports.UI.prototype,"editable",void 0),e([t.dataType("size")],exports.UI.prototype,"editSize",void 0),e([t.hitType(!0)],exports.UI.prototype,"hittable",void 0),e([t.hitType("path")],exports.UI.prototype,"hitFill",void 0),e([t.strokeType("path")],exports.UI.prototype,"hitStroke",void 0),e([t.hitType(!1)],exports.UI.prototype,"hitBox",void 0),e([t.hitType(!0)],exports.UI.prototype,"hitChildren",void 0),e([t.hitType(!0)],exports.UI.prototype,"hitSelf",void 0),e([t.hitType()],exports.UI.prototype,"hitRadius",void 0),e([t.cursorType("")],exports.UI.prototype,"cursor",void 0),e([t.surfaceType()],exports.UI.prototype,"fill",void 0),e([t.strokeType()],exports.UI.prototype,"stroke",void 0),e([t.strokeType("inside")],exports.UI.prototype,"strokeAlign",void 0),e([t.strokeType(1)],exports.UI.prototype,"strokeWidth",void 0),e([t.strokeType(!1)],exports.UI.prototype,"strokeWidthFixed",void 0),e([t.strokeType("none")],exports.UI.prototype,"strokeCap",void 0),e([t.strokeType("miter")],exports.UI.prototype,"strokeJoin",void 0),e([t.strokeType()],exports.UI.prototype,"dashPattern",void 0),e([t.strokeType()],exports.UI.prototype,"dashOffset",void 0),e([t.strokeType(10)],exports.UI.prototype,"miterLimit",void 0),e([t.dataType(!1)],exports.UI.prototype,"lazy",void 0),e([t.naturalBoundsType(1)],exports.UI.prototype,"pixelRatio",void 0),e([t.pathInputType()],exports.UI.prototype,"path",void 0),e([t.pathType()],exports.UI.prototype,"windingRule",void 0),e([s("none")],exports.UI.prototype,"startArrow",void 0),e([s("none")],exports.UI.prototype,"endArrow",void 0),e([t.pathType(0)],exports.UI.prototype,"cornerRadius",void 0),e([t.pathType()],exports.UI.prototype,"cornerSmoothing",void 0),e([r()],exports.UI.prototype,"shadow",void 0),e([r()],exports.UI.prototype,"innerShadow",void 0),e([r()],exports.UI.prototype,"blur",void 0),e([r()],exports.UI.prototype,"backgroundBlur",void 0),e([r()],exports.UI.prototype,"grayscale",void 0),e([t.rewrite(t.Leaf.prototype.reset)],exports.UI.prototype,"reset",null),exports.UI=D=e([t.useModule(U),t.useModule(A),t.rewriteAble()],exports.UI),exports.Group=class extends exports.UI{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(e){if(e.children){const{children:s}=e;let r;delete e.children,this.children?this.clear():this.__setBranch(),super.set(e),s.forEach((e=>{r=t.UICreator.get(e.tag,e),this.add(r)})),e.children=s}else super.set(e)}toJSON(){const t=super.toJSON();return t.children=this.children.map((t=>t.toJSON())),t}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(){}},e([t.dataProcessor(y)],exports.Group.prototype,"__",void 0),exports.Group=e([t.useModule(t.Branch),t.registerUI()],exports.Group);const E=t.Debug.get("Leafer");exports.Leafer=class extends exports.Group{get __tag(){return"Leafer"}get isApp(){return!1}get app(){return this.parent||this}get isLeafer(){return!0}get imageReady(){return this.viewReady&&t.ImageManager.isComplete}get layoutLocked(){return!this.layouter.running}get cursorPoint(){return this.interaction&&this.interaction.hoverData||{x:this.width/2,y:this.height/2}}constructor(t,e){super(e),this.zoomLayer=this,this.config={type:"design",start:!0,hittable:!0,smooth:!0,zoom:{min:.02,max:256},move:{holdSpaceKey:!0,holdMiddleKey:!0,dragOut:!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)}init(e,s){if(this.canvas)return;let r;this.__setLeafer(this),e&&t.DataHelper.assign(this.config,e);const{config:o}=this;this.initType(o.type),this.canvas=t.Creator.canvas(o),this.__controllers.push(this.renderer=t.Creator.renderer(this,this.canvas,o),this.watcher=t.Creator.watcher(this,o),this.layouter=t.Creator.layouter(this,o)),this.isApp&&this.__setApp(),this.__checkAutoLayout(o),this.view=this.canvas.view,s?(this.__bindApp(s),r=s.running):(this.selector=t.Creator.selector(this),this.interaction=t.Creator.interaction(this,this.canvas,this.selector,o),this.interaction&&(this.__controllers.unshift(this.interaction),this.hitCanvasManager=t.Creator.hitCanvasManager()),this.canvasManager=new t.CanvasManager,r=o.start),this.hittable=o.hittable,this.fill=o.fill,this.canvasManager.add(this.canvas),this.__listenEvents(),r&&(this.__startTimer=setTimeout(this.start.bind(this))),this.onInit()}onInit(){}initType(t){}set(t){this.children?super.set(t):setTimeout((()=>{super.set(t)}))}start(){clearTimeout(this.__startTimer),!this.running&&this.canvas&&(this.ready?this.emitLeafer(t.LeaferEvent.RESTART):this.emitLeafer(t.LeaferEvent.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(t.LeaferEvent.STOP))}unlockLayout(){this.layouter.start(),this.updateLayout()}lockLayout(){this.updateLayout(),this.layouter.stop()}resize(e){const s=t.DataHelper.copyAttrs({},e,t.canvasSizeAttrs);Object.keys(s).forEach((t=>this[t]=s[t]))}forceFullRender(){this.forceRender()}forceRender(e){this.renderer.addBlock(e?new t.Bounds(e):this.canvas.bounds),this.viewReady&&this.renderer.update()}updateCursor(t){const e=this.interaction;e&&(t?e.setCursor(t):e.updateCursor())}__doResize(e){if(!this.canvas||this.canvas.isSameSize(e))return;const s=t.DataHelper.copyAttrs({},this.canvas,t.canvasSizeAttrs);this.canvas.resize(e),this.__onResize(new t.ResizeEvent(e,s))}__onResize(e){this.emitEvent(e),t.DataHelper.copyAttrs(this.__,e,t.canvasSizeAttrs),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}setZoomLayer(t){this.zoomLayer=t}__checkAutoLayout(e){e.width&&e.height||(this.autoLayout=new t.AutoBounds(e),this.canvas.startAutoLayout(this.autoLayout,this.__onResize.bind(this)))}__setAttr(e,s){this.canvas&&(t.canvasSizeAttrs.includes(e)?this.__changeCanvasSize(e,s):"fill"===e?this.__changeFill(s):"hittable"===e&&(this.canvas.hittable=s)),super.__setAttr(e,s)}__getAttr(e){return this.canvas&&t.canvasSizeAttrs.includes(e)?this.canvas[e]:super.__getAttr(e)}__changeCanvasSize(e,s){const r=t.DataHelper.copyAttrs({},this.canvas,t.canvasSizeAttrs);r[e]=this.config[e]=s,s&&this.canvas.stopAutoLayout(),this.__doResize(r)}__changeFill(t){this.config.fill=t,this.canvas.allowBackgroundColor?this.canvas.backgroundColor=t:this.forceFullRender()}__onCreated(){this.created=!0}__onReady(){this.ready||(this.ready=!0,this.emitLeafer(t.LeaferEvent.BEFORE_READY),this.emitLeafer(t.LeaferEvent.READY),this.emitLeafer(t.LeaferEvent.AFTER_READY),t.WaitHelper.run(this.__readyWait))}__onViewReady(){this.viewReady||(this.viewReady=!0,this.emitLeafer(t.LeaferEvent.VIEW_READY),t.WaitHelper.run(this.__viewReadyWait))}__onNextRender(){if(this.viewReady){t.WaitHelper.run(this.__nextRenderWait);const{imageReady:e}=this;e&&!this.viewCompleted&&this.__checkViewCompleted(),e||(this.viewCompleted=!1)}}__checkViewCompleted(e=!0){this.nextRender((()=>{this.imageReady&&(e&&this.emitLeafer(t.LeaferEvent.VIEW_COMPLETED),t.WaitHelper.run(this.__viewCompletedWait),this.viewCompleted=!0)}))}__onWatchData(){this.watcher.childrenChanged&&this.interaction&&this.nextRender((()=>this.interaction.updateCursor()))}waitReady(t){this.ready?t():this.__readyWait.push(t)}waitViewReady(t){this.viewReady?t():this.__viewReadyWait.push(t)}waitViewCompleted(t){this.__viewCompletedWait.push(t),this.viewCompleted?this.__checkViewCompleted(!1):this.running||this.start()}nextRender(t,e){const s=this.__nextRenderWait;if(e){for(let e=0;e<s.length;e++)if(s[e]===t){s.splice(e,1);break}}else s.push(t)}__checkUpdateLayout(){this.__layout.update()}emitLeafer(e){this.emitEvent(new t.LeaferEvent(e,this))}__listenEvents(){const e=t.Run.start("FirstCreate "+this.innerName);this.once(t.LeaferEvent.START,(()=>t.Run.end(e))),this.once(t.LayoutEvent.END,(()=>this.__onReady())),this.once(t.RenderEvent.START,(()=>this.__onCreated())),this.once(t.RenderEvent.END,(()=>this.__onViewReady())),this.__eventIds.push(this.on_(t.WatchEvent.DATA,this.__onWatchData,this),this.on_(t.RenderEvent.NEXT,this.__onNextRender,this),this.on_(t.LayoutEvent.CHECK_UPDATE,this.__checkUpdateLayout,this))}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){setTimeout((()=>{if(!this.destroyed)try{this.stop(),this.emitEvent(new t.LeaferEvent(t.LeaferEvent.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((()=>{t.ImageManager.clearRecycled()}),100)}catch(t){E.error(t)}}))}},e([t.dataProcessor(v)],exports.Leafer.prototype,"__",void 0),e([t.boundsType()],exports.Leafer.prototype,"pixelRatio",void 0),exports.Leafer=e([t.registerUI()],exports.Leafer),exports.Rect=class extends exports.UI{get __tag(){return"Rect"}constructor(t){super(t)}},e([t.dataProcessor(m)],exports.Rect.prototype,"__",void 0),exports.Rect=e([t.useModule(L),t.rewriteAble(),t.registerUI()],exports.Rect);const F=exports.Rect.prototype,W=exports.Group.prototype,M={},{copy:z,add:H}=t.BoundsHelper;exports.Box=class extends exports.Group{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(){let t=this.__updateRectRenderSpread()||super.__updateRenderSpread();return this.__.__drawAfterFill="hide"===this.__.overflow,t||(t=this.__.__drawAfterFill?0:1),t}__updateRectBoxBounds(){}__updateBoxBounds(){const t=this.__;if(t.__autoSide&&this.children.length){if(this.leafer&&this.leafer.layouter.addExtra(this),super.__updateBoxBounds(),!t.__autoSize){const e=this.__layout.boxBounds;t.__autoWidth||(e.x=0,e.width=t.width),t.__autoHeight||(e.y=0,e.height=t.height)}}else this.__updateRectBoxBounds()}__updateStrokeBounds(){}__updateRenderBounds(){if(this.__updateRectRenderBounds(),!this.__.__drawAfterFill){const{renderBounds:t}=this.__layout;z(M,t),super.__updateRenderBounds(),H(t,M)}}__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.__renderGroup(t,e))}__drawAfterFill(t,e){t.save(),t.clip(),this.__renderGroup(t,e),t.restore(),this.__.stroke&&this.__drawRenderPath(t)}},e([t.dataProcessor(g)],exports.Box.prototype,"__",void 0),e([t.affectRenderBoundsType("show")],exports.Box.prototype,"overflow",void 0),e([t.rewrite(F.__updateStrokeSpread)],exports.Box.prototype,"__updateStrokeSpread",null),e([t.rewrite(F.__updateRenderSpread)],exports.Box.prototype,"__updateRectRenderSpread",null),e([t.rewrite(F.__updateBoxBounds)],exports.Box.prototype,"__updateRectBoxBounds",null),e([t.rewrite(F.__updateStrokeBounds)],exports.Box.prototype,"__updateStrokeBounds",null),e([t.rewrite(F.__updateRenderBounds)],exports.Box.prototype,"__updateRectRenderBounds",null),e([t.rewrite(F.__updateChange)],exports.Box.prototype,"__updateRectChange",null),e([t.rewrite(F.__render)],exports.Box.prototype,"__renderRect",null),e([t.rewrite(W.__render)],exports.Box.prototype,"__renderGroup",null),exports.Box=e([t.rewriteAble(),t.registerUI()],exports.Box),exports.Frame=class extends exports.Box{get __tag(){return"Frame"}get isFrame(){return!0}constructor(t){super(t)}},e([t.dataProcessor(f)],exports.Frame.prototype,"__",void 0),e([t.surfaceType("#FFFFFF")],exports.Frame.prototype,"fill",void 0),e([t.affectRenderBoundsType("hide")],exports.Frame.prototype,"overflow",void 0),exports.Frame=e([t.registerUI()],exports.Frame);const{moveTo:O,closePath:N,ellipse:G}=t.PathCommandDataHelper;exports.Ellipse=class extends exports.UI{get __tag(){return"Ellipse"}constructor(t){super(t)}__updatePath(){const{width:e,height:s,innerRadius:r,startAngle:o,endAngle:i}=this.__,a=e/2,n=s/2,p=this.__.path=[];r?(o||i?(r<1&&G(p,a,n,a*r,n*r,0,o,i,!1),G(p,a,n,a,n,0,i,o,!0),r<1&&N(p)):(r<1&&(G(p,a,n,a*r,n*r),O(p,e,n)),G(p,a,n,a,n,0,360,0,!0)),t.Platform.ellipseToCurve&&(this.__.path=this.getPath(!0))):o||i?(O(p,a,n),G(p,a,n,a,n,0,o,i,!1),N(p)):G(p,a,n,a,n)}},e([t.dataProcessor(T)],exports.Ellipse.prototype,"__",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"innerRadius",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"startAngle",void 0),e([t.pathType(0)],exports.Ellipse.prototype,"endAngle",void 0),exports.Ellipse=e([t.registerUI()],exports.Ellipse);const{moveTo:V,lineTo:j,drawPoints:Y}=t.PathCommandDataHelper,{rotate:X,getAngle:J,getDistance:$,defaultPoint:K}=t.PointHelper,{toBounds:q}=t.PathBounds;exports.Line=class extends exports.UI{get __tag(){return"Line"}get toPoint(){const{width:e,rotation:s}=this.__,r=t.getPointData();return e&&(r.x=e),s&&X(r,s),r}set toPoint(t){this.width=$(K,t),this.rotation=J(K,t),this.height&&(this.height=0)}constructor(t){super(t)}__updatePath(){const t=this.__.path=[];this.__.points?Y(t,this.__.points,!1):(V(t,0,0),j(t,this.width,0))}__updateRenderPath(){const t=this.__;!this.pathInputed&&t.points&&t.curve?(Y(t.__pathForRender=[],t.points,t.curve,this.pathClosed),t.__useArrow&&a.addArrows(this,!1)):super.__updateRenderPath()}__updateBoxBounds(){this.points?q(this.__.__pathForRender,this.__layout.boxBounds):super.__updateBoxBounds()}},e([t.dataProcessor(w)],exports.Line.prototype,"__",void 0),e([t.affectStrokeBoundsType("center")],exports.Line.prototype,"strokeAlign",void 0),e([t.boundsType(0)],exports.Line.prototype,"height",void 0),e([t.pathType()],exports.Line.prototype,"points",void 0),e([t.pathType(0)],exports.Line.prototype,"curve",void 0),exports.Line=e([t.registerUI()],exports.Line);const{sin:Z,cos:Q,PI:tt}=Math,{moveTo:et,lineTo:st,closePath:rt,drawPoints:ot}=t.PathCommandDataHelper,it=exports.Line.prototype;exports.Polygon=class extends exports.UI{get __tag(){return"Polygon"}constructor(t){super(t),this.pathClosed=!0}__updatePath(){const t=this.__.path=[];if(this.__.points)ot(t,this.__.points,!1,!0);else{const{width:e,height:s,sides:r}=this.__,o=e/2,i=s/2;et(t,o,0);for(let e=1;e<r;e++)st(t,o+o*Z(2*e*tt/r),i-i*Q(2*e*tt/r))}rt(t)}__updateRenderPath(){}__updateBoxBounds(){}},e([t.dataProcessor(R)],exports.Polygon.prototype,"__",void 0),e([t.pathType(3)],exports.Polygon.prototype,"sides",void 0),e([t.pathType()],exports.Polygon.prototype,"points",void 0),e([t.pathType(0)],exports.Polygon.prototype,"curve",void 0),e([t.rewrite(it.__updateRenderPath)],exports.Polygon.prototype,"__updateRenderPath",null),e([t.rewrite(it.__updateBoxBounds)],exports.Polygon.prototype,"__updateBoxBounds",null),exports.Polygon=e([t.rewriteAble(),t.registerUI()],exports.Polygon);const{sin:at,cos:nt,PI:pt}=Math,{moveTo:ht,lineTo:_t,closePath:dt}=t.PathCommandDataHelper;exports.Star=class extends exports.UI{get __tag(){return"Star"}constructor(t){super(t)}__updatePath(){const{width:t,height:e,corners:s,innerRadius:r}=this.__,o=t/2,i=e/2,a=this.__.path=[];ht(a,o,0);for(let t=1;t<2*s;t++)_t(a,o+(t%2==0?o:o*r)*at(t*pt/s),i-(t%2==0?i:i*r)*nt(t*pt/s));dt(a)}},e([t.dataProcessor(I)],exports.Star.prototype,"__",void 0),e([t.pathType(5)],exports.Star.prototype,"corners",void 0),e([t.pathType(.382)],exports.Star.prototype,"innerRadius",void 0),exports.Star=e([t.registerUI()],exports.Star),exports.Image=class extends exports.Rect{get __tag(){return"Image"}get ready(){return!!this.image&&this.image.ready}constructor(e){super(e),this.on(t.ImageEvent.LOADED,(t=>{"fill"===t.attrName&&t.attrValue.url===this.url&&(this.image=t.image)}))}destroy(){this.image=null,super.destroy()}},e([t.dataProcessor(B)],exports.Image.prototype,"__",void 0),e([t.boundsType("")],exports.Image.prototype,"url",void 0),exports.Image=e([t.registerUI()],exports.Image),exports.Canvas=class extends exports.Rect{get __tag(){return"Canvas"}constructor(e){super(e),this.canvas=t.Creator.canvas(this.__),this.context=this.canvas.context,this.__.__drawAfterFill=!0}draw(e,s,r,o){e.__layout.update();const i=new t.Matrix(e.__world).invert(),a=new t.Matrix;s&&a.translate(s.x,s.y),r&&("number"==typeof r?a.scale(r):a.scale(r.x,r.y)),o&&a.rotate(o),i.multiplyParent(a),e.__render(this.canvas,{matrix:i.withScale()}),this.paint()}paint(){this.forceUpdate("fill")}__drawAfterFill(t,e){const s=this.canvas.view,{width:r,height:o}=this;this.__.cornerRadius?(t.save(),t.clip(),t.drawImage(this.canvas.view,0,0,s.width,s.height,0,0,r,o),t.restore()):t.drawImage(this.canvas.view,0,0,s.width,s.height,0,0,r,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=null,this.context=null),super.destroy()}},e([t.dataProcessor(C)],exports.Canvas.prototype,"__",void 0),e([o(100)],exports.Canvas.prototype,"width",void 0),e([o(100)],exports.Canvas.prototype,"height",void 0),e([o(t.Platform.devicePixelRatio)],exports.Canvas.prototype,"pixelRatio",void 0),e([o(!0)],exports.Canvas.prototype,"smooth",void 0),e([t.hitType("all")],exports.Canvas.prototype,"hitFill",void 0),exports.Canvas=e([t.registerUI()],exports.Canvas);const{copyAndSpread:lt,includes:ut,spread:ct,setList:xt}=t.BoundsHelper;exports.Text=class extends exports.UI{get __tag(){return"Text"}get textDrawData(){return this.__layout.update(),this.__.__textDrawData}constructor(t){super(t)}__drawHitPath(t){const{__lineHeight:e,__baseLine:s,__textDrawData:r}=this.__;t.beginPath(),this.__.__letterSpacing<0?this.__drawPathByData(t):r.rows.forEach((r=>t.rect(r.x,r.y-s,r.width,e)))}__drawPathByData(t,e){const{x:s,y:r,width:o,height:i}=this.__layout.boxBounds;t.rect(s,r,o,i)}__drawRenderPath(t){t.font=this.__.__font}__updateTextDrawData(){const t=this.__;t.__textDrawData=i.getDrawData(t.text,this.__)}__updateBoxBounds(){const e=this.__,s=this.__layout,{lineHeight:r,letterSpacing:o,fontFamily:i,fontSize:a,fontWeight:n,italic:p,textCase:h,textOverflow:_,padding:d}=e,l=e.__autoWidth,u=e.__autoHeight;e.__lineHeight=x.number(r,a),e.__letterSpacing=x.number(o,a),e.__padding=d?t.MathHelper.fourNumber(d):void 0,e.__baseLine=e.__lineHeight-(e.__lineHeight-.7*a)/2,e.__font=`${p?"italic ":""}${"small-caps"===h?"small-caps ":""}${"normal"!==n?n+" ":""}${a}px ${i}`,e.__clipText="show"!==_&&!e.__autoSize,this.__updateTextDrawData();const{bounds:c}=e.__textDrawData,y=s.boxBounds;if(e.__lineHeight<a&&ct(c,a/2),l||u){if(y.x=l?c.x:0,y.y=u?c.y:0,y.width=l?c.width:e.width,y.height=u?c.height:e.height,d){const[t,s,r,o]=e.__padding;l&&(y.x-=o,y.width+=s+o),u&&(y.y-=t,y.height+=r+t)}this.__updateNaturalSize()}else super.__updateBoxBounds();const g=ut(y,c)?y:c;g!==s.contentBounds?(s.contentBounds=g,s.renderChanged=!0,xt(e.__textBoxBounds={},[y,c])):e.__textBoxBounds=g}__updateRenderSpread(){let t=super.__updateRenderSpread();return t||(t=this.__layout.boxBounds===this.__layout.contentBounds?0:1),t}__updateRenderBounds(){lt(this.__layout.renderBounds,this.__.__textBoxBounds,this.__layout.renderSpread)}},e([t.dataProcessor(k)],exports.Text.prototype,"__",void 0),e([t.boundsType(0)],exports.Text.prototype,"width",void 0),e([t.boundsType(0)],exports.Text.prototype,"height",void 0),e([t.boundsType(0)],exports.Text.prototype,"padding",void 0),e([t.surfaceType("#000000")],exports.Text.prototype,"fill",void 0),e([t.affectStrokeBoundsType("outside")],exports.Text.prototype,"strokeAlign",void 0),e([t.hitType("all")],exports.Text.prototype,"hitFill",void 0),e([t.boundsType("")],exports.Text.prototype,"text",void 0),e([t.boundsType("L")],exports.Text.prototype,"fontFamily",void 0),e([t.boundsType(12)],exports.Text.prototype,"fontSize",void 0),e([t.boundsType("normal")],exports.Text.prototype,"fontWeight",void 0),e([t.boundsType(!1)],exports.Text.prototype,"italic",void 0),e([t.boundsType("none")],exports.Text.prototype,"textCase",void 0),e([t.boundsType("none")],exports.Text.prototype,"textDecoration",void 0),e([t.boundsType(0)],exports.Text.prototype,"letterSpacing",void 0),e([t.boundsType({type:"percent",value:150})],exports.Text.prototype,"lineHeight",void 0),e([t.boundsType(0)],exports.Text.prototype,"paraIndent",void 0),e([t.boundsType(0)],exports.Text.prototype,"paraSpacing",void 0),e([t.boundsType("left")],exports.Text.prototype,"textAlign",void 0),e([t.boundsType("top")],exports.Text.prototype,"verticalAlign",void 0),e([t.boundsType("normal")],exports.Text.prototype,"textWrap",void 0),e([t.boundsType("show")],exports.Text.prototype,"textOverflow",void 0),exports.Text=e([t.registerUI()],exports.Text),exports.Path=class extends exports.UI{get __tag(){return"Path"}constructor(t){super(t),this.__.__pathInputed=2}},e([t.dataProcessor(P)],exports.Path.prototype,"__",void 0),e([t.affectStrokeBoundsType("center")],exports.Path.prototype,"strokeAlign",void 0),exports.Path=e([t.registerUI()],exports.Path),exports.Pen=class extends exports.Group{get __tag(){return"Pen"}constructor(t){super(t)}setStyle(t){const e=this.pathElement=new exports.Path(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,s,r,o,i){return this}quadraticCurveTo(t,e,s,r){return this}closePath(){return this}rect(t,e,s,r){return this}roundRect(t,e,s,r,o){return this}ellipse(t,e,s,r,o,i,a,n){return this}arc(t,e,s,r,o,i){return this}arcTo(t,e,s,r,o){return this}drawEllipse(t,e,s,r,o,i,a,n){return this}drawArc(t,e,s,r,o,i){return this}drawPoints(t,e,s){return this}paint(){this.pathElement.forceUpdate("path")}},e([t.dataProcessor(b)],exports.Pen.prototype,"__",void 0),e([(e,s)=>{t.defineKey(e,s,{get(){return this.__path}})}],exports.Pen.prototype,"path",void 0),exports.Pen=e([t.useModule(t.PathCreator,["beginPath","path"]),t.registerUI()],exports.Pen),exports.BoxData=g,exports.CanvasData=C,exports.ColorConvert={},exports.Effect=h,exports.EllipseData=T,exports.Export=_,exports.FrameData=f,exports.GroupData=y,exports.ImageData=B,exports.LeaferData=v,exports.LineData=w,exports.Paint=n,exports.PaintGradient={},exports.PaintImage=p,exports.PathArrow=a,exports.PathData=P,exports.PenData=b,exports.PolygonData=R,exports.RectData=m,exports.RectRender=L,exports.StarData=I,exports.TextConvert=i,exports.TextData=k,exports.UIBounds=U,exports.UIData=c,exports.UIRender=A,exports.UnitConvert=x,exports.arrowType=s,exports.effectType=r,exports.resizeType=o,Object.keys(t).forEach((function(e){"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return t[e]}})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@leafer-ui/draw",
|
|
3
|
-
"version": "1.0.0-rc.
|
|
3
|
+
"version": "1.0.0-rc.16",
|
|
4
4
|
"description": "@leafer-ui/draw",
|
|
5
5
|
"author": "Chao (Leafer) Wan",
|
|
6
6
|
"license": "MIT",
|
|
@@ -29,10 +29,10 @@
|
|
|
29
29
|
"leaferjs"
|
|
30
30
|
],
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@leafer/core": "1.0.0-rc.
|
|
33
|
-
"@leafer-ui/display": "1.0.0-rc.
|
|
34
|
-
"@leafer-ui/display-module": "1.0.0-rc.
|
|
35
|
-
"@leafer-ui/decorator": "1.0.0-rc.
|
|
36
|
-
"@leafer-ui/external": "1.0.0-rc.
|
|
32
|
+
"@leafer/core": "1.0.0-rc.16",
|
|
33
|
+
"@leafer-ui/display": "1.0.0-rc.16",
|
|
34
|
+
"@leafer-ui/display-module": "1.0.0-rc.16",
|
|
35
|
+
"@leafer-ui/decorator": "1.0.0-rc.16",
|
|
36
|
+
"@leafer-ui/external": "1.0.0-rc.16"
|
|
37
37
|
}
|
|
38
38
|
}
|