@leafer-editor/worker 1.5.3 → 1.6.0

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.
Files changed (9) hide show
  1. package/dist/worker.js +461 -279
  2. package/dist/worker.js.map +1 -1
  3. package/dist/worker.min.js +1 -1
  4. package/dist/worker.min.js.map +1 -1
  5. package/dist/worker.module.js +461 -279
  6. package/dist/worker.module.js.map +1 -1
  7. package/dist/worker.module.min.js +1 -1
  8. package/dist/worker.module.min.js.map +1 -1
  9. package/package.json +15 -15
package/dist/worker.js CHANGED
@@ -48,7 +48,7 @@ var LeaferUI = (function (exports) {
48
48
  };
49
49
  const I$2 = IncrementId;
50
50
 
51
- const { round, pow: pow$1, PI: PI$4 } = Math;
51
+ const { round: round$3, pow: pow$1, PI: PI$4 } = Math;
52
52
  const MathHelper = {
53
53
  within(value, min, max) {
54
54
  if (typeof min === 'object')
@@ -112,7 +112,7 @@ var LeaferUI = (function (exports) {
112
112
  },
113
113
  float(num, maxLength) {
114
114
  const a = maxLength !== undefined ? pow$1(10, maxLength) : 1000000000000;
115
- num = round(num * a) / a;
115
+ num = round$3(num * a) / a;
116
116
  return num === -0 ? 0 : num;
117
117
  },
118
118
  getScaleData(scale, size, originSize, scaleData) {
@@ -135,8 +135,15 @@ var LeaferUI = (function (exports) {
135
135
  scaleData.scaleX = scale.x;
136
136
  scaleData.scaleY = scale.y;
137
137
  }
138
+ },
139
+ randInt,
140
+ randColor(opacity) {
141
+ return `rgba(${randInt(255)},${randInt(255)},${randInt(255)},${opacity || 1})`;
138
142
  }
139
143
  };
144
+ function randInt(num) {
145
+ return Math.round(Math.random() * num);
146
+ }
140
147
  const OneRadian = PI$4 / 180;
141
148
  const PI2 = PI$4 * 2;
142
149
  const PI_2 = PI$4 / 2;
@@ -434,7 +441,7 @@ var LeaferUI = (function (exports) {
434
441
  const M$9 = MatrixHelper;
435
442
 
436
443
  const { toInnerPoint: toInnerPoint$2, toOuterPoint: toOuterPoint$3 } = MatrixHelper;
437
- const { sin: sin$4, cos: cos$4, abs: abs$6, sqrt: sqrt$2, atan2: atan2$2, min: min$1, PI: PI$3 } = Math;
444
+ const { sin: sin$4, cos: cos$4, abs: abs$6, sqrt: sqrt$2, atan2: atan2$2, min: min$1, round: round$2, PI: PI$3 } = Math;
438
445
  const PointHelper = {
439
446
  defaultPoint: getPointData(),
440
447
  tempPoint: {},
@@ -455,6 +462,10 @@ var LeaferUI = (function (exports) {
455
462
  t.x = x;
456
463
  t.y = y;
457
464
  },
465
+ round(t, halfPixel) {
466
+ t.x = halfPixel ? round$2(t.x - 0.5) + 0.5 : round$2(t.x);
467
+ t.y = halfPixel ? round$2(t.y - 0.5) + 0.5 : round$2(t.y);
468
+ },
458
469
  move(t, x, y) {
459
470
  t.x += x;
460
471
  t.y += y;
@@ -1320,6 +1331,7 @@ var LeaferUI = (function (exports) {
1320
1331
  'E': 1
1321
1332
  };
1322
1333
 
1334
+ const { randColor } = MathHelper;
1323
1335
  class Debug {
1324
1336
  constructor(name) {
1325
1337
  this.repeatMap = {};
@@ -1334,6 +1346,19 @@ var LeaferUI = (function (exports) {
1334
1346
  static set exclude(name) {
1335
1347
  this.excludeList = getNameList(name);
1336
1348
  }
1349
+ static drawRepaint(canvas, bounds) {
1350
+ const color = randColor();
1351
+ canvas.fillWorld(bounds, color.replace('1)', '.1)'));
1352
+ canvas.strokeWorld(bounds, color);
1353
+ }
1354
+ static drawBounds(leaf, canvas, _options) {
1355
+ const showHit = Debug.showBounds === 'hit', w = leaf.__nowWorld, color = randColor();
1356
+ if (showHit)
1357
+ canvas.setWorld(w), leaf.__drawHitPath(canvas), canvas.fillStyle = color.replace('1)', '.2)'), canvas.fill();
1358
+ canvas.resetTransform();
1359
+ canvas.setStroke(color, 2);
1360
+ showHit ? canvas.stroke() : canvas.strokeWorld(w, color);
1361
+ }
1337
1362
  log(...messages) {
1338
1363
  if (D$6.enable) {
1339
1364
  if (D$6.filterList.length && D$6.filterList.every(name => name !== this.name))
@@ -1420,7 +1445,7 @@ var LeaferUI = (function (exports) {
1420
1445
  return rs;
1421
1446
  },
1422
1447
  need(name) {
1423
- console.error('need plugin: ' + (name.includes('-x') ? '' : '@leafer-in/') + name);
1448
+ console.error('please install plugin: ' + (name.includes('-x') ? '' : '@leafer-in/') + name);
1424
1449
  }
1425
1450
  };
1426
1451
  setTimeout(() => check.forEach(name => Plugin.has(name, true)));
@@ -2020,7 +2045,7 @@ var LeaferUI = (function (exports) {
2020
2045
  contextMethod()
2021
2046
  ], Canvas.prototype, "strokeText", null);
2022
2047
 
2023
- const { copy: copy$c } = MatrixHelper;
2048
+ const { copy: copy$c, multiplyParent: multiplyParent$3 } = MatrixHelper, { round: round$1 } = Math;
2024
2049
  const minSize = { width: 1, height: 1, pixelRatio: 1 };
2025
2050
  const canvasSizeAttrs = ['width', 'height', 'pixelRatio'];
2026
2051
  class LeaferCanvasBase extends Canvas {
@@ -2029,6 +2054,8 @@ var LeaferUI = (function (exports) {
2029
2054
  get pixelRatio() { return this.size.pixelRatio; }
2030
2055
  get pixelWidth() { return this.width * this.pixelRatio; }
2031
2056
  get pixelHeight() { return this.height * this.pixelRatio; }
2057
+ get pixelSnap() { return this.config.pixelSnap; }
2058
+ set pixelSnap(value) { this.config.pixelSnap = value; }
2032
2059
  get allowBackgroundColor() { return this.view && this.parentView; }
2033
2060
  constructor(config, manager) {
2034
2061
  super();
@@ -2089,15 +2116,22 @@ var LeaferUI = (function (exports) {
2089
2116
  stopAutoLayout() { }
2090
2117
  setCursor(_cursor) { }
2091
2118
  setWorld(matrix, parentMatrix) {
2092
- const { pixelRatio } = this;
2093
- const w = this.worldTransform;
2094
- if (parentMatrix) {
2095
- const { a, b, c, d, e, f } = parentMatrix;
2096
- this.setTransform(w.a = ((matrix.a * a) + (matrix.b * c)) * pixelRatio, w.b = ((matrix.a * b) + (matrix.b * d)) * pixelRatio, w.c = ((matrix.c * a) + (matrix.d * c)) * pixelRatio, w.d = ((matrix.c * b) + (matrix.d * d)) * pixelRatio, w.e = (((matrix.e * a) + (matrix.f * c) + e)) * pixelRatio, w.f = (((matrix.e * b) + (matrix.f * d) + f)) * pixelRatio);
2097
- }
2098
- else {
2099
- this.setTransform(w.a = matrix.a * pixelRatio, w.b = matrix.b * pixelRatio, w.c = matrix.c * pixelRatio, w.d = matrix.d * pixelRatio, w.e = matrix.e * pixelRatio, w.f = matrix.f * pixelRatio);
2119
+ const { pixelRatio, pixelSnap } = this, w = this.worldTransform;
2120
+ if (parentMatrix)
2121
+ multiplyParent$3(matrix, parentMatrix, w);
2122
+ w.a = matrix.a * pixelRatio;
2123
+ w.b = matrix.b * pixelRatio;
2124
+ w.c = matrix.c * pixelRatio;
2125
+ w.d = matrix.d * pixelRatio;
2126
+ w.e = matrix.e * pixelRatio;
2127
+ w.f = matrix.f * pixelRatio;
2128
+ if (pixelSnap) {
2129
+ if (matrix.half && (matrix.half * pixelRatio) % 2)
2130
+ w.e = round$1(w.e - 0.5) + 0.5, w.f = round$1(w.f - 0.5) + 0.5;
2131
+ else
2132
+ w.e = round$1(w.e), w.f = round$1(w.f);
2100
2133
  }
2134
+ this.setTransform(w.a, w.b, w.c, w.d, w.e, w.f);
2101
2135
  }
2102
2136
  useWorldTransform(worldTransform) {
2103
2137
  if (worldTransform)
@@ -2240,12 +2274,13 @@ var LeaferUI = (function (exports) {
2240
2274
  return this.width === size.width && this.height === size.height && (!size.pixelRatio || this.pixelRatio === size.pixelRatio);
2241
2275
  }
2242
2276
  getSameCanvas(useSameWorldTransform, useSameSmooth) {
2243
- const canvas = this.manager ? this.manager.get(this.size) : Creator.canvas(Object.assign({}, this.size));
2277
+ const { size, pixelSnap } = this, canvas = this.manager ? this.manager.get(size) : Creator.canvas(Object.assign({}, size));
2244
2278
  canvas.save();
2245
2279
  if (useSameWorldTransform)
2246
2280
  copy$c(canvas.worldTransform, this.worldTransform), canvas.useWorldTransform();
2247
2281
  if (useSameSmooth)
2248
2282
  canvas.smooth = this.smooth;
2283
+ canvas.pixelSnap !== pixelSnap && (canvas.pixelSnap = pixelSnap);
2249
2284
  return canvas;
2250
2285
  }
2251
2286
  recycle(clearBounds) {
@@ -3672,7 +3707,7 @@ var LeaferUI = (function (exports) {
3672
3707
  const R = Resource;
3673
3708
 
3674
3709
  const ImageManager = {
3675
- maxRecycled: 100,
3710
+ maxRecycled: 10,
3676
3711
  recycledList: [],
3677
3712
  patternTasker: new TaskProcessor(),
3678
3713
  get(config) {
@@ -4025,9 +4060,8 @@ var LeaferUI = (function (exports) {
4025
4060
  set(value) {
4026
4061
  if (this.__setAttr(key, value)) {
4027
4062
  this.__layout.hitCanvasChanged = true;
4028
- if (Debug.showHitView) {
4063
+ if (Debug.showBounds === 'hit')
4029
4064
  this.__layout.surfaceChanged || this.__layout.surfaceChange();
4030
- }
4031
4065
  if (this.leafer)
4032
4066
  this.leafer.updateCursor();
4033
4067
  }
@@ -4188,7 +4222,7 @@ var LeaferUI = (function (exports) {
4188
4222
  }
4189
4223
 
4190
4224
  const { copy: copy$a, toInnerPoint: toInnerPoint$1, toOuterPoint: toOuterPoint$1, scaleOfOuter: scaleOfOuter$2, rotateOfOuter: rotateOfOuter$2, skewOfOuter, multiplyParent: multiplyParent$2, divideParent, getLayout } = MatrixHelper;
4191
- const matrix$3 = {};
4225
+ const matrix$3 = {}, { round } = Math;
4192
4226
  const LeafHelper = {
4193
4227
  updateAllMatrix(leaf, checkAutoLayout, waitAutoLayout) {
4194
4228
  if (checkAutoLayout && leaf.__hasAutoLayout && leaf.__layout.matrixChanged)
@@ -4262,6 +4296,8 @@ var LeaferUI = (function (exports) {
4262
4296
  y = x.y, x = x.x;
4263
4297
  x += t.x;
4264
4298
  y += t.y;
4299
+ if (t.leafer && t.leafer.config.pointSnap)
4300
+ x = round(x), y = round(y);
4265
4301
  transition ? t.animate({ x, y }, transition) : (t.x = x, t.y = y);
4266
4302
  },
4267
4303
  zoomOfWorld(t, origin, scaleX, scaleY, resize, transition) {
@@ -4500,6 +4536,7 @@ var LeaferUI = (function (exports) {
4500
4536
  set contentBounds(bounds) { this._contentBounds = bounds; }
4501
4537
  get strokeBounds() { return this._strokeBounds || this.boxBounds; }
4502
4538
  get renderBounds() { return this._renderBounds || this.boxBounds; }
4539
+ set renderBounds(bounds) { this._renderBounds = bounds; }
4503
4540
  get localContentBounds() { toOuterOf$2(this.contentBounds, this.leaf.__localMatrix, this[localContent] || (this[localContent] = {})); return this[localContent]; }
4504
4541
  get localStrokeBounds() { return this._localStrokeBounds || this; }
4505
4542
  get localRenderBounds() { return this._localRenderBounds || this; }
@@ -4518,11 +4555,13 @@ var LeaferUI = (function (exports) {
4518
4555
  get height() { return this.boxBounds.height; }
4519
4556
  constructor(leaf) {
4520
4557
  this.leaf = leaf;
4521
- this.boxBounds = { x: 0, y: 0, width: 0, height: 0 };
4522
4558
  if (this.leaf.__local)
4523
4559
  this._localRenderBounds = this._localStrokeBounds = this.leaf.__local;
4524
- this.boxChange();
4525
- this.matrixChange();
4560
+ if (leaf.__world) {
4561
+ this.boxBounds = { x: 0, y: 0, width: 0, height: 0 };
4562
+ this.boxChange();
4563
+ this.matrixChange();
4564
+ }
4526
4565
  }
4527
4566
  createLocal() {
4528
4567
  const local = this.leaf.__local = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0 };
@@ -4854,6 +4893,9 @@ var LeaferUI = (function (exports) {
4854
4893
  }
4855
4894
  this.old = oldSize;
4856
4895
  }
4896
+ static isResizing(leaf) {
4897
+ return this.resizingKeys && this.resizingKeys[leaf.innerId] !== undefined;
4898
+ }
4857
4899
  }
4858
4900
  ResizeEvent.RESIZE = 'resize';
4859
4901
 
@@ -4896,6 +4938,7 @@ var LeaferUI = (function (exports) {
4896
4938
  }
4897
4939
  RenderEvent.REQUEST = 'render.request';
4898
4940
  RenderEvent.CHILD_START = 'render.child_start';
4941
+ RenderEvent.CHILD_END = 'render.child_end';
4899
4942
  RenderEvent.START = 'render.start';
4900
4943
  RenderEvent.BEFORE = 'render.before';
4901
4944
  RenderEvent.RENDER = 'render';
@@ -5275,24 +5318,27 @@ var LeaferUI = (function (exports) {
5275
5318
  const LeafRender = {
5276
5319
  __render(canvas, options) {
5277
5320
  if (this.__worldOpacity) {
5321
+ const data = this.__;
5278
5322
  canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
5279
- canvas.opacity = this.__.opacity;
5323
+ canvas.opacity = options.dimOpacity && !data.dimskip ? data.opacity * options.dimOpacity : data.opacity;
5280
5324
  if (this.__.__single) {
5281
- if (this.__.eraser === 'path')
5325
+ if (data.eraser === 'path')
5282
5326
  return this.__renderEraser(canvas, options);
5283
5327
  const tempCanvas = canvas.getSameCanvas(true, true);
5284
5328
  this.__draw(tempCanvas, options, canvas);
5285
5329
  if (this.__worldFlipped) {
5286
- canvas.copyWorldByReset(tempCanvas, this.__nowWorld, null, this.__.__blendMode, true);
5330
+ canvas.copyWorldByReset(tempCanvas, this.__nowWorld, null, data.__blendMode, true);
5287
5331
  }
5288
5332
  else {
5289
- canvas.copyWorldToInner(tempCanvas, this.__nowWorld, this.__layout.renderBounds, this.__.__blendMode);
5333
+ canvas.copyWorldToInner(tempCanvas, this.__nowWorld, this.__layout.renderBounds, data.__blendMode);
5290
5334
  }
5291
5335
  tempCanvas.recycle(this.__nowWorld);
5292
5336
  }
5293
5337
  else {
5294
5338
  this.__draw(canvas, options);
5295
5339
  }
5340
+ if (Debug.showBounds)
5341
+ Debug.drawBounds(this, canvas, options);
5296
5342
  }
5297
5343
  },
5298
5344
  __clip(canvas, options) {
@@ -5322,14 +5368,19 @@ var LeaferUI = (function (exports) {
5322
5368
  __render(canvas, options) {
5323
5369
  this.__nowWorld = this.__getNowWorld(options);
5324
5370
  if (this.__worldOpacity) {
5325
- if (this.__.__single) {
5326
- if (this.__.eraser === 'path')
5371
+ const data = this.__;
5372
+ if (data.dim)
5373
+ options.dimOpacity = data.dim === true ? 0.2 : data.dim;
5374
+ else if (data.dimskip)
5375
+ options.dimOpacity && (options.dimOpacity = 0);
5376
+ if (data.__single) {
5377
+ if (data.eraser === 'path')
5327
5378
  return this.__renderEraser(canvas, options);
5328
5379
  const tempCanvas = canvas.getSameCanvas(false, true);
5329
5380
  this.__renderBranch(tempCanvas, options);
5330
5381
  const nowWorld = this.__nowWorld;
5331
- canvas.opacity = this.__.opacity;
5332
- canvas.copyWorldByReset(tempCanvas, nowWorld, nowWorld, this.__.__blendMode, true);
5382
+ canvas.opacity = options.dimOpacity ? data.opacity * options.dimOpacity : data.opacity;
5383
+ canvas.copyWorldByReset(tempCanvas, nowWorld, nowWorld, data.__blendMode, true);
5333
5384
  tempCanvas.recycle(nowWorld);
5334
5385
  }
5335
5386
  else {
@@ -5404,9 +5455,11 @@ var LeaferUI = (function (exports) {
5404
5455
  reset(data) {
5405
5456
  if (this.leafer)
5406
5457
  this.leafer.forceRender(this.__world);
5407
- this.__world = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0, scaleX: 1, scaleY: 1 };
5408
- if (data !== null)
5409
- this.__local = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0 };
5458
+ if (data !== 0) {
5459
+ this.__world = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0, scaleX: 1, scaleY: 1 };
5460
+ if (data !== null)
5461
+ this.__local = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0 };
5462
+ }
5410
5463
  this.__worldOpacity = 1;
5411
5464
  this.__ = new this.__DataProcessor(this);
5412
5465
  this.__layout = new this.__LayoutProcessor(this);
@@ -5542,9 +5595,10 @@ var LeaferUI = (function (exports) {
5542
5595
  if (options.matrix) {
5543
5596
  if (!this.__cameraWorld)
5544
5597
  this.__cameraWorld = {};
5545
- const cameraWorld = this.__cameraWorld;
5546
- multiplyParent(this.__world, options.matrix, cameraWorld, undefined, this.__world);
5598
+ const cameraWorld = this.__cameraWorld, world = this.__world;
5599
+ multiplyParent(world, options.matrix, cameraWorld, undefined, world);
5547
5600
  toOuterOf(this.__layout.renderBounds, cameraWorld, cameraWorld);
5601
+ cameraWorld.half !== world.half && (cameraWorld.half = world.half);
5548
5602
  return cameraWorld;
5549
5603
  }
5550
5604
  else {
@@ -5704,7 +5758,7 @@ var LeaferUI = (function (exports) {
5704
5758
  __updateHitCanvas() { }
5705
5759
  __render(_canvas, _options) { }
5706
5760
  __drawFast(_canvas, _options) { }
5707
- __draw(_canvas, _options) { }
5761
+ __draw(_canvas, _options, _originCanvas) { }
5708
5762
  __clip(_canvas, _options) { }
5709
5763
  __renderShape(_canvas, _options, _ignoreFill, _ignoreStroke) { }
5710
5764
  __updateWorldOpacity() { }
@@ -6074,7 +6128,7 @@ var LeaferUI = (function (exports) {
6074
6128
  }
6075
6129
  }
6076
6130
 
6077
- const version = "1.5.3";
6131
+ const version = "1.6.0";
6078
6132
 
6079
6133
  class LeaferCanvas extends LeaferCanvasBase {
6080
6134
  get allowBackgroundColor() { return true; }
@@ -6314,7 +6368,6 @@ var LeaferUI = (function (exports) {
6314
6368
  }
6315
6369
 
6316
6370
  const { worldBounds: worldBounds$1 } = LeafBoundsHelper;
6317
- const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
6318
6371
  class LayoutBlockData {
6319
6372
  constructor(list) {
6320
6373
  this.updatedBounds = new Bounds();
@@ -6328,13 +6381,7 @@ var LeaferUI = (function (exports) {
6328
6381
  this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds$1);
6329
6382
  }
6330
6383
  setAfter() {
6331
- const { list } = this.updatedList;
6332
- if (list.some(leaf => leaf.noBounds)) {
6333
- this.afterBounds.set(bigBounds);
6334
- }
6335
- else {
6336
- this.afterBounds.setListWithFn(list, worldBounds$1);
6337
- }
6384
+ this.afterBounds.setListWithFn(this.updatedList.list, worldBounds$1);
6338
6385
  this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
6339
6386
  }
6340
6387
  merge(data) {
@@ -6536,6 +6583,13 @@ var LeaferUI = (function (exports) {
6536
6583
  requestLayout() {
6537
6584
  this.target.emit(LayoutEvent.REQUEST);
6538
6585
  }
6586
+ checkRender() {
6587
+ if (this.running) {
6588
+ if (this.changed && this.canvas.view)
6589
+ this.render();
6590
+ this.target.emit(RenderEvent.NEXT);
6591
+ }
6592
+ }
6539
6593
  render(callback) {
6540
6594
  if (!(this.running && this.canvas.view))
6541
6595
  return this.update();
@@ -6544,8 +6598,6 @@ var LeaferUI = (function (exports) {
6544
6598
  this.totalBounds = new Bounds();
6545
6599
  debug$6.log(target.innerName, '--->');
6546
6600
  try {
6547
- if (!target.isApp)
6548
- target.app.emit(RenderEvent.CHILD_START, target);
6549
6601
  this.emitRender(RenderEvent.START);
6550
6602
  this.renderOnce(callback);
6551
6603
  this.emitRender(RenderEvent.END, this.totalBounds);
@@ -6613,20 +6665,12 @@ var LeaferUI = (function (exports) {
6613
6665
  }
6614
6666
  clipRender(block) {
6615
6667
  const t = Run.start('PartRender');
6616
- const { canvas } = this;
6617
- const bounds = block.getIntersect(canvas.bounds);
6618
- const includes = block.includes(this.target.__world);
6619
- const realBounds = new Bounds(bounds);
6668
+ const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new Bounds(bounds);
6620
6669
  canvas.save();
6621
- if (includes && !Debug.showRepaint) {
6622
- canvas.clear();
6623
- }
6624
- else {
6625
- bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
6626
- canvas.clearWorld(bounds, true);
6627
- canvas.clipWorld(bounds, true);
6628
- }
6629
- this.__render(bounds, includes, realBounds);
6670
+ bounds.spread(Renderer.clipSpread).ceil();
6671
+ canvas.clearWorld(bounds, true);
6672
+ canvas.clipWorld(bounds, true);
6673
+ this.__render(bounds, block.includes(this.target.__world), realBounds);
6630
6674
  canvas.restore();
6631
6675
  Run.end(t);
6632
6676
  }
@@ -6640,23 +6684,17 @@ var LeaferUI = (function (exports) {
6640
6684
  Run.end(t);
6641
6685
  }
6642
6686
  __render(bounds, includes, realBounds) {
6643
- const options = bounds.includes(this.target.__world) ? { includes } : { bounds, includes };
6687
+ const { canvas } = this, options = includes ? { includes } : { bounds, includes };
6644
6688
  if (this.needFill)
6645
- this.canvas.fillWorld(bounds, this.config.fill);
6689
+ canvas.fillWorld(bounds, this.config.fill);
6646
6690
  if (Debug.showRepaint)
6647
- this.canvas.strokeWorld(bounds, 'red');
6648
- this.target.__render(this.canvas, options);
6691
+ Debug.drawRepaint(canvas, bounds);
6692
+ this.target.__render(canvas, options);
6649
6693
  this.renderBounds = realBounds = realBounds || bounds;
6650
6694
  this.renderOptions = options;
6651
6695
  this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
6652
- if (Debug.showHitView)
6653
- this.renderHitView(options);
6654
- if (Debug.showBoundsView)
6655
- this.renderBoundsView(options);
6656
- this.canvas.updateRender(realBounds);
6657
- }
6658
- renderHitView(_options) { }
6659
- renderBoundsView(_options) { }
6696
+ canvas.updateRender(realBounds);
6697
+ }
6660
6698
  addBlock(block) {
6661
6699
  if (!this.updateBlocks)
6662
6700
  this.updateBlocks = [];
@@ -6672,17 +6710,24 @@ var LeaferUI = (function (exports) {
6672
6710
  }
6673
6711
  }
6674
6712
  __requestRender() {
6713
+ const target = this.target;
6714
+ if (target.parentApp)
6715
+ return target.parentApp.renderer.update(false);
6675
6716
  if (this.requestTime)
6676
6717
  return;
6677
6718
  const requestTime = this.requestTime = Date.now();
6678
6719
  Platform.requestRender(() => {
6679
6720
  this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
6680
6721
  this.requestTime = 0;
6681
- if (this.running) {
6682
- if (this.changed && this.canvas.view)
6683
- this.render();
6684
- this.target.emit(RenderEvent.NEXT);
6722
+ if (target.isApp) {
6723
+ target.emit(RenderEvent.CHILD_START, target);
6724
+ target.children.forEach(leafer => {
6725
+ leafer.renderer.FPS = this.FPS;
6726
+ leafer.renderer.checkRender();
6727
+ });
6728
+ target.emit(RenderEvent.CHILD_END, target);
6685
6729
  }
6730
+ this.checkRender();
6686
6731
  });
6687
6732
  }
6688
6733
  __onResize(e) {
@@ -6740,6 +6785,7 @@ var LeaferUI = (function (exports) {
6740
6785
  }
6741
6786
  }
6742
6787
  }
6788
+ Renderer.clipSpread = 10;
6743
6789
 
6744
6790
  const { hitRadiusPoint } = BoundsHelper;
6745
6791
  class Picker {
@@ -6985,6 +7031,7 @@ var LeaferUI = (function (exports) {
6985
7031
  return strokeWidth;
6986
7032
  }
6987
7033
  get __hasStroke() { return this.stroke && this.strokeWidth; }
7034
+ get __hasHalf() { const t = this; return (t.stroke && t.strokeAlign === 'center' && t.strokeWidth % 2) || undefined; }
6988
7035
  get __hasMultiPaint() {
6989
7036
  const t = this;
6990
7037
  if ((t.__isFills && t.fill.length > 1) || (t.__isStrokes && t.stroke.length > 1) || t.__useEffect)
@@ -7029,14 +7076,14 @@ var LeaferUI = (function (exports) {
7029
7076
  this.__removeInput('fill');
7030
7077
  PaintImage.recycleImage('fill', this);
7031
7078
  this.__isFills = false;
7032
- if (this.__pixelFill)
7033
- this.__pixelFill = false;
7079
+ this.__pixelFill && (this.__pixelFill = false);
7034
7080
  }
7035
7081
  this._fill = value;
7036
7082
  }
7037
7083
  else if (typeof value === 'object') {
7038
7084
  this.__setInput('fill', value);
7039
- this.__leaf.__layout.boxChanged || this.__leaf.__layout.boxChange();
7085
+ const layout = this.__leaf.__layout;
7086
+ layout.boxChanged || layout.boxChange();
7040
7087
  this.__isFills = true;
7041
7088
  this._fill || (this._fill = emptyPaint);
7042
7089
  }
@@ -7047,14 +7094,14 @@ var LeaferUI = (function (exports) {
7047
7094
  this.__removeInput('stroke');
7048
7095
  PaintImage.recycleImage('stroke', this);
7049
7096
  this.__isStrokes = false;
7050
- if (this.__pixelStroke)
7051
- this.__pixelStroke = false;
7097
+ this.__pixelStroke && (this.__pixelStroke = false);
7052
7098
  }
7053
7099
  this._stroke = value;
7054
7100
  }
7055
7101
  else if (typeof value === 'object') {
7056
7102
  this.__setInput('stroke', value);
7057
- this.__leaf.__layout.boxChanged || this.__leaf.__layout.boxChange();
7103
+ const layout = this.__leaf.__layout;
7104
+ layout.boxChanged || layout.boxChange();
7058
7105
  this.__isStrokes = true;
7059
7106
  this._stroke || (this._stroke = emptyPaint);
7060
7107
  }
@@ -7169,6 +7216,31 @@ var LeaferUI = (function (exports) {
7169
7216
  this._fontWeight = value;
7170
7217
  }
7171
7218
  }
7219
+ setBoxStyle(value) {
7220
+ let t = this.__leaf, box = t.__box;
7221
+ if (value) {
7222
+ const { boxStyle } = this;
7223
+ if (box)
7224
+ for (let key in boxStyle)
7225
+ box[key] = undefined;
7226
+ else
7227
+ box = t.__box = UICreator.get('Rect', 0);
7228
+ const layout = t.__layout, boxLayout = box.__layout;
7229
+ if (!boxStyle)
7230
+ box.parent = t, box.__world = t.__world, boxLayout.boxBounds = layout.boxBounds;
7231
+ box.set(value);
7232
+ if (boxLayout.strokeChanged)
7233
+ layout.strokeChange();
7234
+ if (boxLayout.renderChanged)
7235
+ layout.renderChange();
7236
+ box.__updateChange();
7237
+ }
7238
+ else if (box) {
7239
+ t.__box = box.parent = null;
7240
+ box.destroy();
7241
+ }
7242
+ this._boxStyle = value;
7243
+ }
7172
7244
  }
7173
7245
 
7174
7246
  class ImageData extends RectData {
@@ -7206,7 +7278,7 @@ var LeaferUI = (function (exports) {
7206
7278
  const UIBounds = {
7207
7279
  __updateStrokeSpread() {
7208
7280
  let width = 0, boxWidth = 0;
7209
- const data = this.__, { strokeAlign, strokeWidth } = data;
7281
+ const data = this.__, { strokeAlign, strokeWidth } = data, box = this.__box;
7210
7282
  if ((data.stroke || data.hitStroke === 'all') && strokeWidth && strokeAlign !== 'inside') {
7211
7283
  boxWidth = width = strokeAlign === 'center' ? strokeWidth / 2 : strokeWidth;
7212
7284
  if (!data.__boxStroke) {
@@ -7217,6 +7289,10 @@ var LeaferUI = (function (exports) {
7217
7289
  }
7218
7290
  if (data.__useArrow)
7219
7291
  width += strokeWidth * 5;
7292
+ if (box) {
7293
+ width = Math.max(box.__layout.strokeSpread = box.__updateStrokeSpread(), width);
7294
+ boxWidth = box.__layout.strokeBoxSpread;
7295
+ }
7220
7296
  this.__layout.strokeBoxSpread = boxWidth;
7221
7297
  return width;
7222
7298
  },
@@ -7235,25 +7311,26 @@ var LeaferUI = (function (exports) {
7235
7311
  if (backgroundBlur)
7236
7312
  shapeWidth = Math.max(shapeWidth, backgroundBlur);
7237
7313
  this.__layout.renderShapeSpread = shapeWidth;
7238
- return width + (this.__layout.strokeSpread || 0);
7314
+ width += this.__layout.strokeSpread || 0;
7315
+ return this.__box ? Math.max(this.__box.__updateRenderSpread(), width) : width;
7239
7316
  }
7240
7317
  };
7241
7318
 
7242
7319
  const UIRender = {
7243
7320
  __updateChange() {
7244
- const data = this.__;
7321
+ const data = this.__, w = this.__world;
7245
7322
  if (data.__useEffect) {
7246
7323
  const { shadow, innerShadow, blur, backgroundBlur, filter } = this.__;
7247
7324
  data.__useEffect = !!(shadow || innerShadow || blur || backgroundBlur || filter);
7248
7325
  }
7326
+ const half = data.__hasHalf;
7327
+ w.half !== half && (w.half = half);
7249
7328
  data.__checkSingle();
7250
7329
  const complex = data.__isFills || data.__isStrokes || data.cornerRadius || data.__useEffect;
7251
- if (complex) {
7330
+ if (complex)
7252
7331
  data.__complex = true;
7253
- }
7254
- else {
7332
+ else
7255
7333
  data.__complex && (data.__complex = false);
7256
- }
7257
7334
  },
7258
7335
  __drawFast(canvas, options) {
7259
7336
  drawFast(this, canvas, options);
@@ -7340,10 +7417,11 @@ var LeaferUI = (function (exports) {
7340
7417
 
7341
7418
  const RectRender = {
7342
7419
  __drawFast(canvas, options) {
7343
- let { width, height, fill, stroke, __drawAfterFill } = this.__;
7420
+ let { x, y, width, height } = this.__layout.boxBounds;
7421
+ const { fill, stroke, __drawAfterFill } = this.__;
7344
7422
  if (fill) {
7345
7423
  canvas.fillStyle = fill;
7346
- canvas.fillRect(0, 0, width, height);
7424
+ canvas.fillRect(x, y, width, height);
7347
7425
  }
7348
7426
  if (__drawAfterFill)
7349
7427
  this.__drawAfterFill(canvas, options);
@@ -7362,14 +7440,14 @@ var LeaferUI = (function (exports) {
7362
7440
  if (width < 0 || height < 0) {
7363
7441
  canvas.save();
7364
7442
  this.__clip(canvas, options);
7365
- canvas.strokeRect(half, half, width, height);
7443
+ canvas.strokeRect(x + half, y + half, width, height);
7366
7444
  canvas.restore();
7367
7445
  }
7368
7446
  else
7369
- canvas.strokeRect(half, half, width, height);
7447
+ canvas.strokeRect(x + half, y + half, width, height);
7370
7448
  break;
7371
7449
  case 'outside':
7372
- canvas.strokeRect(-half, -half, width + __strokeWidth, height + __strokeWidth);
7450
+ canvas.strokeRect(x - half, y - half, width + __strokeWidth, height + __strokeWidth);
7373
7451
  break;
7374
7452
  }
7375
7453
  }
@@ -7525,6 +7603,12 @@ var LeaferUI = (function (exports) {
7525
7603
  __decorate([
7526
7604
  surfaceType(false)
7527
7605
  ], exports.UI.prototype, "locked", void 0);
7606
+ __decorate([
7607
+ surfaceType(false)
7608
+ ], exports.UI.prototype, "dim", void 0);
7609
+ __decorate([
7610
+ surfaceType(false)
7611
+ ], exports.UI.prototype, "dimskip", void 0);
7528
7612
  __decorate([
7529
7613
  sortType(0)
7530
7614
  ], exports.UI.prototype, "zIndex", void 0);
@@ -7786,7 +7870,7 @@ var LeaferUI = (function (exports) {
7786
7870
  start: true,
7787
7871
  hittable: true,
7788
7872
  smooth: true,
7789
- lazySpeard: 100
7873
+ lazySpeard: 100,
7790
7874
  };
7791
7875
  this.leafs = 0;
7792
7876
  this.__eventIds = [];
@@ -8210,13 +8294,13 @@ var LeaferUI = (function (exports) {
8210
8294
  super.__updateRenderBounds();
8211
8295
  copy$6(childrenRenderBounds, renderBounds);
8212
8296
  this.__updateRectRenderBounds();
8213
- isOverflow = !includes$1(renderBounds, childrenRenderBounds);
8297
+ isOverflow = !includes$1(renderBounds, childrenRenderBounds) || undefined;
8214
8298
  if (isOverflow && this.__.overflow !== 'hide')
8215
8299
  add(renderBounds, childrenRenderBounds);
8216
8300
  }
8217
8301
  else
8218
8302
  this.__updateRectRenderBounds();
8219
- !this.isOverflow !== !isOverflow && (this.isOverflow = isOverflow);
8303
+ this.isOverflow !== isOverflow && (this.isOverflow = isOverflow);
8220
8304
  }
8221
8305
  __updateRectRenderBounds() { }
8222
8306
  __updateRectChange() { }
@@ -8624,33 +8708,13 @@ var LeaferUI = (function (exports) {
8624
8708
  registerUI()
8625
8709
  ], exports.Canvas);
8626
8710
 
8627
- const { copyAndSpread, includes, isSame: isSame$1, spread, setList } = BoundsHelper;
8711
+ const { copyAndSpread, includes, spread, setList } = BoundsHelper;
8628
8712
  exports.Text = class Text extends exports.UI {
8629
8713
  get __tag() { return 'Text'; }
8630
- get textDrawData() {
8631
- this.__layout.update();
8632
- return this.__.__textDrawData;
8633
- }
8714
+ get textDrawData() { this.updateLayout(); return this.__.__textDrawData; }
8634
8715
  constructor(data) {
8635
8716
  super(data);
8636
8717
  }
8637
- __drawHitPath(canvas) {
8638
- const { __lineHeight, fontSize, __baseLine, __textDrawData: data } = this.__;
8639
- canvas.beginPath();
8640
- if (this.__.__letterSpacing < 0) {
8641
- this.__drawPathByData(canvas);
8642
- }
8643
- else {
8644
- data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
8645
- }
8646
- }
8647
- __drawPathByData(drawer, _data) {
8648
- const { x, y, width, height } = this.__layout.boxBounds;
8649
- drawer.rect(x, y, width, height);
8650
- }
8651
- __drawRenderPath(canvas) {
8652
- canvas.font = this.__.__font;
8653
- }
8654
8718
  __updateTextDrawData() {
8655
8719
  const data = this.__;
8656
8720
  const { lineHeight, letterSpacing, fontFamily, fontSize, fontWeight, italic, textCase, textOverflow, padding } = data;
@@ -8667,15 +8731,16 @@ var LeaferUI = (function (exports) {
8667
8731
  const layout = this.__layout;
8668
8732
  const { fontSize, italic, padding, __autoWidth: autoWidth, __autoHeight: autoHeight } = data;
8669
8733
  this.__updateTextDrawData();
8670
- const { bounds } = data.__textDrawData;
8734
+ const { bounds: contentBounds } = data.__textDrawData;
8671
8735
  const b = layout.boxBounds;
8736
+ layout.contentBounds = contentBounds;
8672
8737
  if (data.__lineHeight < fontSize)
8673
- spread(bounds, fontSize / 2);
8738
+ spread(contentBounds, fontSize / 2);
8674
8739
  if (autoWidth || autoHeight) {
8675
- b.x = autoWidth ? bounds.x : 0;
8676
- b.y = autoHeight ? bounds.y : 0;
8677
- b.width = autoWidth ? bounds.width : data.width;
8678
- b.height = autoHeight ? bounds.height : data.height;
8740
+ b.x = autoWidth ? contentBounds.x : 0;
8741
+ b.y = autoHeight ? contentBounds.y : 0;
8742
+ b.width = autoWidth ? contentBounds.width : data.width;
8743
+ b.height = autoHeight ? contentBounds.height : data.height;
8679
8744
  if (padding) {
8680
8745
  const [top, right, bottom, left] = data.__padding;
8681
8746
  if (autoWidth)
@@ -8689,23 +8754,45 @@ var LeaferUI = (function (exports) {
8689
8754
  super.__updateBoxBounds();
8690
8755
  if (italic)
8691
8756
  b.width += fontSize * 0.16;
8692
- const contentBounds = includes(b, bounds) ? b : bounds;
8693
- if (!isSame$1(contentBounds, layout.contentBounds)) {
8694
- layout.contentBounds = contentBounds;
8695
- layout.renderChanged = true;
8696
- setList(data.__textBoxBounds = {}, [b, bounds]);
8697
- }
8757
+ const isOverflow = !includes(b, contentBounds) || undefined;
8758
+ if (isOverflow)
8759
+ setList(data.__textBoxBounds = {}, [b, contentBounds]), layout.renderChanged = true;
8698
8760
  else
8699
- data.__textBoxBounds = contentBounds;
8761
+ data.__textBoxBounds = b;
8762
+ this.isOverflow !== isOverflow && (this.isOverflow = isOverflow);
8763
+ }
8764
+ __onUpdateSize() {
8765
+ if (this.__box)
8766
+ this.__box.__onUpdateSize();
8767
+ super.__onUpdateSize();
8700
8768
  }
8701
8769
  __updateRenderSpread() {
8702
8770
  let width = super.__updateRenderSpread();
8703
8771
  if (!width)
8704
- width = this.__layout.boxBounds === this.__layout.contentBounds ? 0 : 1;
8772
+ width = this.isOverflow ? 1 : 0;
8705
8773
  return width;
8706
8774
  }
8707
8775
  __updateRenderBounds() {
8708
- copyAndSpread(this.__layout.renderBounds, this.__.__textBoxBounds, this.__layout.renderSpread);
8776
+ const { renderBounds, renderSpread } = this.__layout;
8777
+ copyAndSpread(renderBounds, this.__.__textBoxBounds, renderSpread);
8778
+ if (this.__box)
8779
+ this.__box.__layout.renderBounds = renderBounds;
8780
+ }
8781
+ __drawRenderPath(canvas) {
8782
+ canvas.font = this.__.__font;
8783
+ }
8784
+ __draw(canvas, options, originCanvas) {
8785
+ const box = this.__box;
8786
+ if (box)
8787
+ box.__nowWorld = this.__nowWorld, box.__draw(canvas, options, originCanvas);
8788
+ if (this.textEditing && !Export.running)
8789
+ return;
8790
+ super.__draw(canvas, options, originCanvas);
8791
+ }
8792
+ destroy() {
8793
+ if (this.boxStyle)
8794
+ this.boxStyle = null;
8795
+ super.destroy();
8709
8796
  }
8710
8797
  };
8711
8798
  __decorate([
@@ -8717,6 +8804,9 @@ var LeaferUI = (function (exports) {
8717
8804
  __decorate([
8718
8805
  boundsType(0)
8719
8806
  ], exports.Text.prototype, "height", void 0);
8807
+ __decorate([
8808
+ surfaceType()
8809
+ ], exports.Text.prototype, "boxStyle", void 0);
8720
8810
  __decorate([
8721
8811
  dataType(false)
8722
8812
  ], exports.Text.prototype, "resizeFontSize", void 0);
@@ -8880,26 +8970,25 @@ var LeaferUI = (function (exports) {
8880
8970
  this.leafer = this;
8881
8971
  this.watcher.disable();
8882
8972
  this.layouter.disable();
8883
- this.__eventIds.push(this.on_(PropertyEvent.CHANGE, this.__onPropertyChange, this));
8884
8973
  }
8885
8974
  start() {
8886
8975
  super.start();
8887
- this.children.forEach(leafer => leafer.start());
8976
+ this.forEach(leafer => leafer.start());
8888
8977
  }
8889
8978
  stop() {
8890
- this.children.forEach(leafer => leafer.stop());
8979
+ this.forEach(leafer => leafer.stop());
8891
8980
  super.stop();
8892
8981
  }
8893
8982
  unlockLayout() {
8894
8983
  super.unlockLayout();
8895
- this.children.forEach(leafer => leafer.unlockLayout());
8984
+ this.forEach(leafer => leafer.unlockLayout());
8896
8985
  }
8897
8986
  lockLayout() {
8898
8987
  super.lockLayout();
8899
- this.children.forEach(leafer => leafer.lockLayout());
8988
+ this.forEach(leafer => leafer.lockLayout());
8900
8989
  }
8901
8990
  forceRender(bounds, sync) {
8902
- this.children.forEach(leafer => leafer.forceRender(bounds, sync));
8991
+ this.forEach(leafer => leafer.forceRender(bounds, sync));
8903
8992
  }
8904
8993
  addLeafer(merge) {
8905
8994
  const leafer = new exports.Leafer(merge);
@@ -8919,9 +9008,8 @@ var LeaferUI = (function (exports) {
8919
9008
  leafer.canvas.childIndex = index;
8920
9009
  this.__listenChildEvents(leafer);
8921
9010
  }
8922
- __onPropertyChange() {
8923
- if (Debug.showHitView)
8924
- this.children.forEach(leafer => leafer.forceUpdate('surface'));
9011
+ forEach(fn) {
9012
+ this.children.forEach(fn);
8925
9013
  }
8926
9014
  __onCreated() {
8927
9015
  this.created = this.children.every(child => child.created);
@@ -8944,18 +9032,18 @@ var LeaferUI = (function (exports) {
8944
9032
  const m = options.matrix;
8945
9033
  if (m)
8946
9034
  canvas.setTransform(m.a, m.b, m.c, m.d, m.e, m.f);
8947
- this.children.forEach(leafer => canvas.copyWorld(leafer.canvas));
9035
+ this.forEach(leafer => canvas.copyWorld(leafer.canvas));
8948
9036
  }
8949
9037
  }
8950
9038
  __onResize(event) {
8951
- this.children.forEach(leafer => leafer.resize(event));
9039
+ this.forEach(leafer => leafer.resize(event));
8952
9040
  super.__onResize(event);
8953
9041
  }
8954
9042
  updateLayout() {
8955
- this.children.forEach(leafer => leafer.updateLayout());
9043
+ this.forEach(leafer => leafer.updateLayout());
8956
9044
  }
8957
9045
  __getChildConfig(userConfig) {
8958
- let config = Object.assign({}, this.config);
9046
+ const config = Object.assign({}, this.config);
8959
9047
  config.hittable = config.realCanvas = undefined;
8960
9048
  if (userConfig)
8961
9049
  DataHelper.assign(config, userConfig);
@@ -9514,6 +9602,7 @@ var LeaferUI = (function (exports) {
9514
9602
  delta: { x: 80 / 4, y: 8.0 },
9515
9603
  },
9516
9604
  pointer: {
9605
+ snap: true,
9517
9606
  hitRadius: 5,
9518
9607
  tapTime: 120,
9519
9608
  longPressTime: 800,
@@ -9608,7 +9697,7 @@ var LeaferUI = (function (exports) {
9608
9697
  if (this.downData) {
9609
9698
  const canDrag = PointHelper.getDistance(this.downData, data) > this.p.dragDistance;
9610
9699
  if (canDrag) {
9611
- if (this.waitTap)
9700
+ if (this.waitTap || this.longPressTimer)
9612
9701
  this.pointerWaitCancel();
9613
9702
  this.waitRightTap = false;
9614
9703
  }
@@ -9869,7 +9958,10 @@ var LeaferUI = (function (exports) {
9869
9958
  }
9870
9959
  getLocal(clientPoint, updateClient) {
9871
9960
  const clientBounds = this.canvas.getClientBounds(updateClient);
9872
- return { x: clientPoint.clientX - clientBounds.x, y: clientPoint.clientY - clientBounds.y };
9961
+ const point = { x: clientPoint.clientX - clientBounds.x, y: clientPoint.clientY - clientBounds.y };
9962
+ if (this.p.snap)
9963
+ PointHelper.round(point);
9964
+ return point;
9873
9965
  }
9874
9966
  emitTap(data) {
9875
9967
  this.emit(exports.PointerEvent.TAP, data);
@@ -10001,25 +10093,26 @@ var LeaferUI = (function (exports) {
10001
10093
  const inner = {};
10002
10094
  const leaf$1 = exports.Leaf.prototype;
10003
10095
  leaf$1.__hitWorld = function (point) {
10004
- if (!this.__.hitSelf)
10096
+ const data = this.__;
10097
+ if (!data.hitSelf)
10005
10098
  return false;
10006
- if (this.__.hitRadius) {
10099
+ const world = this.__world, layout = this.__layout;
10100
+ const isSmall = world.width < 10 && world.height < 10;
10101
+ if (data.hitRadius) {
10007
10102
  copy$5(inner, point), point = inner;
10008
- setRadius(point, this.__.hitRadius);
10103
+ setRadius(point, data.hitRadius);
10009
10104
  }
10010
- toInnerRadiusPointOf(point, this.__world, inner);
10011
- const { width, height } = this.__world;
10012
- const isSmall = width < 10 && height < 10;
10013
- if (this.__.hitBox || isSmall) {
10014
- if (BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner))
10105
+ toInnerRadiusPointOf(point, world, inner);
10106
+ if (data.hitBox || isSmall) {
10107
+ if (BoundsHelper.hitRadiusPoint(layout.boxBounds, inner))
10015
10108
  return true;
10016
10109
  if (isSmall)
10017
10110
  return false;
10018
10111
  }
10019
- if (this.__layout.hitCanvasChanged || !this.__hitCanvas) {
10112
+ if (layout.hitCanvasChanged || !this.__hitCanvas) {
10020
10113
  this.__updateHitCanvas();
10021
- if (!this.__layout.boundsChanged)
10022
- this.__layout.hitCanvasChanged = false;
10114
+ if (!layout.boundsChanged)
10115
+ layout.hitCanvasChanged = false;
10023
10116
  }
10024
10117
  return this.__hit(inner);
10025
10118
  };
@@ -10032,7 +10125,9 @@ var LeaferUI = (function (exports) {
10032
10125
  const matrix$2 = new Matrix();
10033
10126
  const ui$2 = exports.UI.prototype;
10034
10127
  ui$2.__updateHitCanvas = function () {
10035
- const data = this.__, { hitCanvasManager } = this.leafer;
10128
+ if (this.__box)
10129
+ this.__box.__updateHitCanvas();
10130
+ const data = this.__, { hitCanvasManager } = this.leafer || this.parent.leafer;
10036
10131
  const isHitPixelFill = (data.__pixelFill || data.__isCanvas) && data.hitFill === 'pixel';
10037
10132
  const isHitPixelStroke = data.__pixelStroke && data.hitStroke === 'pixel';
10038
10133
  const isHitPixel = isHitPixelFill || isHitPixelStroke;
@@ -10059,6 +10154,8 @@ var LeaferUI = (function (exports) {
10059
10154
  h.setStrokeOptions(data);
10060
10155
  };
10061
10156
  ui$2.__hit = function (inner) {
10157
+ if (this.__box && this.__box.__hit(inner))
10158
+ return true;
10062
10159
  const data = this.__;
10063
10160
  if (data.__isHitPixel && this.__hitPixel(inner))
10064
10161
  return true;
@@ -10107,6 +10204,15 @@ var LeaferUI = (function (exports) {
10107
10204
  return this.__hitCanvas ? ui$1.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
10108
10205
  };
10109
10206
 
10207
+ exports.Text.prototype.__drawHitPath = function (canvas) {
10208
+ const { __lineHeight, fontSize, __baseLine, __letterSpacing, __textDrawData: data } = this.__;
10209
+ canvas.beginPath();
10210
+ if (__letterSpacing < 0)
10211
+ this.__drawPathByBox(canvas);
10212
+ else
10213
+ data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
10214
+ };
10215
+
10110
10216
  function getSelector$1(ui) {
10111
10217
  return ui.leafer ? ui.leafer.selector : (Platform.selector || (Platform.selector = Creator.selector()));
10112
10218
  }
@@ -10489,9 +10595,11 @@ var LeaferUI = (function (exports) {
10489
10595
  const tempPoint = {};
10490
10596
  const tempScaleData = {};
10491
10597
  function createData(leafPaint, image, paint, box) {
10492
- const { blendMode, sync } = paint;
10598
+ const { blendMode, changeful, sync } = paint;
10493
10599
  if (blendMode)
10494
10600
  leafPaint.blendMode = blendMode;
10601
+ if (changeful)
10602
+ leafPaint.changeful = changeful;
10495
10603
  if (sync)
10496
10604
  leafPaint.sync = sync;
10497
10605
  leafPaint.data = getPatternData(paint, box, image);
@@ -10724,40 +10832,32 @@ var LeaferUI = (function (exports) {
10724
10832
  }
10725
10833
 
10726
10834
  const { abs: abs$2 } = Math;
10727
- function checkImage(ui, canvas, paint, allowPaint) {
10835
+ function checkImage(ui, canvas, paint, allowDraw) {
10728
10836
  const { scaleX, scaleY } = ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
10729
- const { pixelRatio } = canvas;
10730
- if (!paint.data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !Export.running)) {
10837
+ const { pixelRatio } = canvas, { data } = paint;
10838
+ if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !Export.running)) {
10731
10839
  return false;
10732
10840
  }
10733
10841
  else {
10734
- const { data } = paint;
10735
- if (allowPaint) {
10736
- if (!data.repeat) {
10737
- let { width, height } = data;
10738
- width *= abs$2(scaleX) * pixelRatio;
10739
- height *= abs$2(scaleY) * pixelRatio;
10740
- if (data.scaleX) {
10741
- width *= data.scaleX;
10742
- height *= data.scaleY;
10743
- }
10744
- allowPaint = (width * height > Platform.image.maxCacheSize) || Export.running;
10842
+ if (allowDraw) {
10843
+ if (data.repeat) {
10844
+ allowDraw = false;
10745
10845
  }
10746
10846
  else {
10747
- allowPaint = false;
10847
+ if (!(paint.changeful || ResizeEvent.isResizing(ui) || Export.running)) {
10848
+ let { width, height } = data;
10849
+ width *= abs$2(scaleX) * pixelRatio;
10850
+ height *= abs$2(scaleY) * pixelRatio;
10851
+ if (data.scaleX) {
10852
+ width *= data.scaleX;
10853
+ height *= data.scaleY;
10854
+ }
10855
+ allowDraw = (width * height > Platform.image.maxCacheSize);
10856
+ }
10748
10857
  }
10749
10858
  }
10750
- if (allowPaint) {
10751
- canvas.save();
10752
- ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
10753
- if (paint.blendMode)
10754
- canvas.blendMode = paint.blendMode;
10755
- if (data.opacity)
10756
- canvas.opacity *= data.opacity;
10757
- if (data.transform)
10758
- canvas.transform(data.transform);
10759
- canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
10760
- canvas.restore();
10859
+ if (allowDraw) {
10860
+ drawImage(ui, canvas, paint, data);
10761
10861
  return true;
10762
10862
  }
10763
10863
  else {
@@ -10778,13 +10878,26 @@ var LeaferUI = (function (exports) {
10778
10878
  }
10779
10879
  }
10780
10880
  }
10881
+ function drawImage(ui, canvas, paint, data) {
10882
+ canvas.save();
10883
+ ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
10884
+ if (paint.blendMode)
10885
+ canvas.blendMode = paint.blendMode;
10886
+ if (data.opacity)
10887
+ canvas.opacity *= data.opacity;
10888
+ if (data.transform)
10889
+ canvas.transform(data.transform);
10890
+ canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
10891
+ canvas.restore();
10892
+ }
10781
10893
 
10782
10894
  function recycleImage(attrName, data) {
10783
10895
  const paints = data['_' + attrName];
10784
10896
  if (paints instanceof Array) {
10785
- let image, recycleMap, input, url;
10897
+ let paint, image, recycleMap, input, url;
10786
10898
  for (let i = 0, len = paints.length; i < len; i++) {
10787
- image = paints[i].image;
10899
+ paint = paints[i];
10900
+ image = paint.image;
10788
10901
  url = image && image.url;
10789
10902
  if (url) {
10790
10903
  if (!recycleMap)
@@ -10799,8 +10912,6 @@ var LeaferUI = (function (exports) {
10799
10912
  }
10800
10913
  image.unload(paints[i].loadId, !input.some((item) => item.url === url));
10801
10914
  }
10802
- else
10803
- paints[i].style = null;
10804
10915
  }
10805
10916
  }
10806
10917
  return recycleMap;
@@ -10979,7 +11090,7 @@ var LeaferUI = (function (exports) {
10979
11090
  const offsetOutBounds = {};
10980
11091
  function innerShadow(ui, current, shape) {
10981
11092
  let copyBounds, spreadScale;
10982
- const { __nowWorld: nowWorld, __layout: __layout } = ui;
11093
+ const { __nowWorld: nowWorld, __layout } = ui;
10983
11094
  const { innerShadow } = ui.__;
10984
11095
  const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
10985
11096
  const other = current.getSameCanvas();
@@ -11733,6 +11844,28 @@ var LeaferUI = (function (exports) {
11733
11844
  });
11734
11845
  };
11735
11846
  }
11847
+ function mergeConfigAttr() {
11848
+ return (target, key) => {
11849
+ defineKey(target, key, {
11850
+ get() {
11851
+ const { config, element, dragPoint } = this, mergeConfig = Object.assign({}, config);
11852
+ if (element && element.editConfig)
11853
+ Object.assign(mergeConfig, element.editConfig);
11854
+ if (dragPoint) {
11855
+ if (dragPoint.editConfig)
11856
+ Object.assign(mergeConfig, dragPoint.editConfig);
11857
+ if (mergeConfig.editSize === 'font-size')
11858
+ mergeConfig.lockRatio = true;
11859
+ if (dragPoint.pointType === 'resize-rotate') {
11860
+ mergeConfig.around || (mergeConfig.around = 'center');
11861
+ isNull(mergeConfig.lockRatio) && (mergeConfig.lockRatio = true);
11862
+ }
11863
+ }
11864
+ return this.mergedConfig = mergeConfig;
11865
+ }
11866
+ });
11867
+ };
11868
+ }
11736
11869
 
11737
11870
  const { abs: abs$1 } = Math;
11738
11871
  const { copy: copy$2, scale: scale$1 } = MatrixHelper;
@@ -11744,6 +11877,7 @@ var LeaferUI = (function (exports) {
11744
11877
  constructor() {
11745
11878
  super();
11746
11879
  this.list = [];
11880
+ this.visible = 0;
11747
11881
  this.hittable = false;
11748
11882
  this.strokeAlign = 'center';
11749
11883
  }
@@ -11757,10 +11891,10 @@ var LeaferUI = (function (exports) {
11757
11891
  if (list.length) {
11758
11892
  setListWithFn(bounds$2, list, worldBounds);
11759
11893
  this.set(bounds$2);
11894
+ this.visible = true;
11760
11895
  }
11761
- else {
11762
- this.width = this.height = 1;
11763
- }
11896
+ else
11897
+ this.visible = 0;
11764
11898
  }
11765
11899
  __draw(canvas, options) {
11766
11900
  const { list } = this;
@@ -11772,8 +11906,9 @@ var LeaferUI = (function (exports) {
11772
11906
  const { worldTransform, worldRenderBounds } = leaf;
11773
11907
  if (worldRenderBounds.width && worldRenderBounds.height && (!bounds || bounds.hit(worldRenderBounds, options.matrix))) {
11774
11908
  const aScaleX = abs$1(worldTransform.scaleX), aScaleY = abs$1(worldTransform.scaleY);
11909
+ copy$2(matrix$1, worldTransform);
11910
+ matrix$1.half = strokeWidth % 2;
11775
11911
  if (aScaleX !== aScaleY) {
11776
- copy$2(matrix$1, worldTransform);
11777
11912
  scale$1(matrix$1, 1 / aScaleX, 1 / aScaleY);
11778
11913
  canvas.setWorld(matrix$1, options.matrix);
11779
11914
  canvas.beginPath();
@@ -11782,7 +11917,7 @@ var LeaferUI = (function (exports) {
11782
11917
  canvas.rect(x * aScaleX, y * aScaleY, width * aScaleX, height * aScaleY);
11783
11918
  }
11784
11919
  else {
11785
- canvas.setWorld(worldTransform, options.matrix);
11920
+ canvas.setWorld(matrix$1, options.matrix);
11786
11921
  canvas.beginPath();
11787
11922
  if (leaf.__.__useArrow)
11788
11923
  leaf.__drawPath(canvas);
@@ -11817,7 +11952,8 @@ var LeaferUI = (function (exports) {
11817
11952
  super(data);
11818
11953
  this.strokeArea = new exports.Rect({ strokeAlign: 'center' });
11819
11954
  this.fillArea = new exports.Rect();
11820
- this.visible = this.hittable = false;
11955
+ this.visible = 0;
11956
+ this.hittable = false;
11821
11957
  this.addMany(this.fillArea, this.strokeArea);
11822
11958
  }
11823
11959
  setStyle(style, userStyle) {
@@ -12014,7 +12150,7 @@ var LeaferUI = (function (exports) {
12014
12150
  if (e.multiTouch)
12015
12151
  return;
12016
12152
  if (this.dragging)
12017
- this.originList = null, this.selectArea.visible = false;
12153
+ this.originList = null, this.selectArea.visible = 0;
12018
12154
  }
12019
12155
  onAutoMove(e) {
12020
12156
  if (this.dragging) {
@@ -12162,8 +12298,11 @@ var LeaferUI = (function (exports) {
12162
12298
  scaleY = scaleY < 0 ? -scale : scale;
12163
12299
  }
12164
12300
  }
12165
- scaleX /= changedScaleX;
12166
- scaleY /= changedScaleY;
12301
+ const useScaleX = scaleX !== 1, useScaleY = scaleY !== 1;
12302
+ if (useScaleX)
12303
+ scaleX /= changedScaleX;
12304
+ if (useScaleY)
12305
+ scaleY /= changedScaleY;
12167
12306
  if (!flipable) {
12168
12307
  const { worldTransform } = element;
12169
12308
  if (scaleX < 0)
@@ -12178,22 +12317,27 @@ var LeaferUI = (function (exports) {
12178
12317
  localBounds.scaleOf(element.getLocalPointByInner(origin), scaleX, scaleY);
12179
12318
  if (!BoundsHelper.includes(allowBounds, localBounds)) {
12180
12319
  const realBounds = localBounds.getIntersect(allowBounds);
12181
- scaleX *= realBounds.width / localBounds.width;
12182
- scaleY *= realBounds.height / localBounds.height;
12320
+ const fitScaleX = realBounds.width / localBounds.width, fitScaleY = realBounds.height / localBounds.height;
12321
+ if (useScaleX)
12322
+ scaleX *= fitScaleX;
12323
+ if (useScaleY)
12324
+ scaleY *= fitScaleY;
12183
12325
  }
12184
12326
  }
12185
- if (widthRange) {
12327
+ if (useScaleX && widthRange) {
12186
12328
  const nowWidth = boxBounds.width * element.scaleX;
12187
12329
  scaleX = within(nowWidth * scaleX, widthRange) / nowWidth;
12188
12330
  }
12189
- if (heightRange) {
12331
+ if (useScaleY && heightRange) {
12190
12332
  const nowHeight = boxBounds.height * element.scaleY;
12191
12333
  scaleY = within(nowHeight * scaleY, heightRange) / nowHeight;
12192
12334
  }
12193
- if (Math.abs(scaleX * worldBoxBounds.width) < 1)
12335
+ if (useScaleX && Math.abs(scaleX * worldBoxBounds.width) < 1)
12194
12336
  scaleX = (scaleX < 0 ? -1 : 1) / worldBoxBounds.width;
12195
- if (Math.abs(scaleY * worldBoxBounds.height) < 1)
12337
+ if (useScaleY && Math.abs(scaleY * worldBoxBounds.height) < 1)
12196
12338
  scaleY = (scaleY < 0 ? -1 : 1) / worldBoxBounds.height;
12339
+ if (lockRatio && scaleX !== scaleY)
12340
+ scaleY = scaleX = Math.min(scaleX, scaleY);
12197
12341
  return { origin, scaleX, scaleY, direction, lockRatio, around };
12198
12342
  },
12199
12343
  getRotateData(bounds, direction, current, last, around) {
@@ -12364,7 +12508,7 @@ var LeaferUI = (function (exports) {
12364
12508
  this.view = new exports.Group();
12365
12509
  this.rect = new exports.Box({ name: 'rect', hitFill: 'all', hitStroke: 'none', strokeAlign: 'center', hitRadius: 5 });
12366
12510
  this.circle = new EditPoint({ name: 'circle', strokeAlign: 'center', around: 'center', cursor: 'crosshair', hitRadius: 5 });
12367
- this.buttons = new exports.Group({ around: 'center', hitSelf: false });
12511
+ this.buttons = new exports.Group({ around: 'center', hitSelf: false, visible: 0 });
12368
12512
  this.resizePoints = [];
12369
12513
  this.rotatePoints = [];
12370
12514
  this.resizeLines = [];
@@ -12419,12 +12563,13 @@ var LeaferUI = (function (exports) {
12419
12563
  }
12420
12564
  }
12421
12565
  update(bounds) {
12422
- const { mergeConfig, element, multiple } = this.editor;
12423
- const { middlePoint, resizeable, rotateable, hideOnSmall, editBox } = mergeConfig;
12566
+ const { rect, circle, buttons, resizePoints, rotatePoints, resizeLines, editor } = this;
12567
+ const { mergeConfig, element, multiple, editMask } = editor;
12568
+ const { middlePoint, resizeable, rotateable, hideOnSmall, editBox, mask } = mergeConfig;
12424
12569
  this.visible = !element.locked;
12570
+ editMask.visible = mask ? true : 0;
12425
12571
  if (this.view.worldOpacity) {
12426
12572
  const { width, height } = bounds;
12427
- const { rect, circle, buttons, resizePoints, rotatePoints, resizeLines } = this;
12428
12573
  const smallSize = typeof hideOnSmall === 'number' ? hideOnSmall : 10;
12429
12574
  const showPoints = editBox && !(hideOnSmall && width < smallSize && height < smallSize);
12430
12575
  let point = {}, rotateP, resizeP, resizeL;
@@ -12459,10 +12604,12 @@ var LeaferUI = (function (exports) {
12459
12604
  if (rect.path)
12460
12605
  rect.path = null;
12461
12606
  rect.set(Object.assign(Object.assign({}, bounds), { visible: multiple ? true : editBox }));
12462
- buttons.visible = showPoints && buttons.children.length > 0;
12607
+ buttons.visible = showPoints && buttons.children.length > 0 || 0;
12463
12608
  if (buttons.visible)
12464
12609
  this.layoutButtons(mergeConfig);
12465
12610
  }
12611
+ else
12612
+ rect.set(bounds);
12466
12613
  }
12467
12614
  layoutCircle(config) {
12468
12615
  const { circleDirection, circleMargin, buttonsMargin, buttonsDirection, middlePoint } = config;
@@ -12525,7 +12672,7 @@ var LeaferUI = (function (exports) {
12525
12672
  }
12526
12673
  onDragStart(e) {
12527
12674
  this.dragging = true;
12528
- const point = this.dragPoint = e.current;
12675
+ const point = this.dragPoint = e.current, { pointType } = point;
12529
12676
  const { editor, dragStartData } = this, { element } = editor;
12530
12677
  if (point.name === 'rect') {
12531
12678
  this.moving = true;
@@ -12536,43 +12683,53 @@ var LeaferUI = (function (exports) {
12536
12683
  dragStartData.point = { x: element.x, y: element.y };
12537
12684
  dragStartData.bounds = Object.assign({}, element.getLayoutBounds('box', 'local'));
12538
12685
  dragStartData.rotation = element.rotation;
12686
+ if (pointType && pointType.includes('resize'))
12687
+ ResizeEvent.resizingKeys = editor.leafList.keys;
12539
12688
  }
12540
12689
  onDragEnd(e) {
12541
12690
  this.dragging = false;
12542
12691
  this.dragPoint = null;
12543
12692
  this.moving = false;
12544
- if (e.current.name === 'rect')
12693
+ const { name, pointType } = e.current;
12694
+ if (name === 'rect')
12545
12695
  this.editor.opacity = 1;
12696
+ if (pointType && pointType.includes('resize'))
12697
+ ResizeEvent.resizingKeys = null;
12546
12698
  }
12547
12699
  onDrag(e) {
12548
12700
  const { editor } = this;
12549
12701
  const { pointType } = this.enterPoint = e.current;
12550
- if (pointType.includes('rotate') || e.metaKey || e.ctrlKey || !editor.mergeConfig.resizeable)
12702
+ if (pointType.includes('rotate') || e.metaKey || e.ctrlKey || !editor.mergeConfig.resizeable) {
12551
12703
  editor.onRotate(e);
12552
- if (pointType.includes('resize'))
12704
+ if (pointType === 'resize-rotate')
12705
+ editor.onScale(e);
12706
+ }
12707
+ else if (pointType === 'resize')
12553
12708
  editor.onScale(e);
12554
12709
  if (pointType === 'skew')
12555
12710
  editor.onSkew(e);
12556
12711
  updateCursor(editor, e);
12557
12712
  }
12558
12713
  onArrow(e) {
12559
- if (this.editor.editing && this.editor.mergeConfig.keyEvent) {
12560
- const move = { x: 0, y: 0 };
12714
+ const { editor } = this;
12715
+ if (editor.editing && editor.mergeConfig.keyEvent) {
12716
+ let x = 0, y = 0;
12561
12717
  const distance = e.shiftKey ? 10 : 1;
12562
12718
  switch (e.code) {
12563
12719
  case 'ArrowDown':
12564
- move.y = distance;
12720
+ y = distance;
12565
12721
  break;
12566
12722
  case 'ArrowUp':
12567
- move.y = -distance;
12723
+ y = -distance;
12568
12724
  break;
12569
12725
  case 'ArrowLeft':
12570
- move.x = -distance;
12726
+ x = -distance;
12571
12727
  break;
12572
12728
  case 'ArrowRight':
12573
- move.x = distance;
12729
+ x = distance;
12574
12730
  }
12575
- this.editor.move(move);
12731
+ if (x || y)
12732
+ editor.move(x, y);
12576
12733
  }
12577
12734
  }
12578
12735
  onDoubleTap(e) {
@@ -12638,22 +12795,32 @@ var LeaferUI = (function (exports) {
12638
12795
  }
12639
12796
  }
12640
12797
 
12798
+ const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
12641
12799
  class EditMask extends exports.UI {
12642
12800
  constructor(editor) {
12643
12801
  super();
12644
12802
  this.editor = editor;
12645
12803
  this.hittable = false;
12804
+ this.visible = 0;
12805
+ }
12806
+ __updateWorldBounds() {
12807
+ Object.assign(this.__local, bigBounds);
12808
+ Object.assign(this.__world, bigBounds);
12646
12809
  }
12647
12810
  __draw(canvas, options) {
12648
- const { editor } = this;
12649
- const { mask } = editor.mergeConfig;
12650
- if (mask && editor.list.length) {
12651
- const { rect } = editor.editBox;
12652
- const { width, height } = rect.__;
12653
- canvas.resetTransform();
12811
+ const { editor } = this, { mask } = editor.mergedConfig;
12812
+ if (mask && editor.editing) {
12654
12813
  canvas.fillWorld(canvas.bounds, mask === true ? 'rgba(0,0,0,0.8)' : mask);
12655
- canvas.setWorld(rect.__world, options.matrix);
12656
- canvas.clearRect(0, 0, width, height);
12814
+ if (options.bounds && !options.bounds.hit(editor.editBox.rect.__world, options.matrix))
12815
+ return;
12816
+ canvas.saveBlendMode('destination-out');
12817
+ editor.list.forEach(item => {
12818
+ item.__renderShape(canvas, options);
12819
+ const { __box, parent } = item;
12820
+ if ((item = __box) || ((item = parent) && parent.textBox))
12821
+ item.__renderShape(canvas, options);
12822
+ });
12823
+ canvas.restoreBlendMode();
12657
12824
  }
12658
12825
  }
12659
12826
  destroy() {
@@ -12956,22 +13123,6 @@ ${filterStyle}
12956
13123
  }
12957
13124
 
12958
13125
  class Editor extends exports.Group {
12959
- get mergeConfig() {
12960
- const { config, element, dragPoint } = this, mergeConfig = Object.assign({}, config);
12961
- if (element && element.editConfig)
12962
- Object.assign(mergeConfig, element.editConfig);
12963
- if (dragPoint) {
12964
- if (dragPoint.editConfig)
12965
- Object.assign(mergeConfig, dragPoint.editConfig);
12966
- if (mergeConfig.editSize === 'font-size')
12967
- mergeConfig.lockRatio = true;
12968
- if (dragPoint.pointType === 'resize-rotate') {
12969
- mergeConfig.around || (mergeConfig.around = 'center');
12970
- isNull(mergeConfig.lockRatio) && (mergeConfig.lockRatio = true);
12971
- }
12972
- }
12973
- return mergeConfig;
12974
- }
12975
13126
  get list() { return this.leafList.list; }
12976
13127
  get dragHoverExclude() { return [this.editBox.rect]; }
12977
13128
  get editing() { return !!this.list.length; }
@@ -12985,7 +13136,6 @@ ${filterStyle}
12985
13136
  get buttons() { return this.editBox.buttons; }
12986
13137
  constructor(userConfig, data) {
12987
13138
  super(data);
12988
- this.config = DataHelper.clone(config);
12989
13139
  this.leafList = new LeafList();
12990
13140
  this.openedGroupList = new LeafList();
12991
13141
  this.simulateTarget = new SimulateElement(this);
@@ -12994,8 +13144,10 @@ ${filterStyle}
12994
13144
  this.selector = new EditSelect(this);
12995
13145
  this.editMask = new EditMask(this);
12996
13146
  this.targetEventIds = [];
13147
+ let mergedConfig = DataHelper.clone(config);
12997
13148
  if (userConfig)
12998
- this.config = DataHelper.default(userConfig, this.config);
13149
+ mergedConfig = DataHelper.default(userConfig, mergedConfig);
13150
+ this.mergedConfig = this.config = mergedConfig;
12999
13151
  this.addMany(this.editMask, this.selector, this.editBox);
13000
13152
  if (!Plugin.has('resize'))
13001
13153
  this.config.editSize = 'scale';
@@ -13335,8 +13487,7 @@ ${filterStyle}
13335
13487
  }
13336
13488
  }
13337
13489
  emitInnerEvent(type) {
13338
- const { innerEditor } = this;
13339
- const { editTarget } = innerEditor;
13490
+ const { innerEditor } = this, { editTarget } = innerEditor;
13340
13491
  const event = new InnerEditorEvent(type, { editTarget, innerEditor });
13341
13492
  this.emitEvent(event);
13342
13493
  editTarget.emitEvent(event);
@@ -13361,25 +13512,40 @@ ${filterStyle}
13361
13512
  this.leafList.update();
13362
13513
  }
13363
13514
  }
13515
+ onAppRenderStart(app) {
13516
+ if (this.targetChanged = app.children.some(leafer => leafer !== this.leafer && leafer.renderer.changed))
13517
+ this.editBox.forceRender();
13518
+ }
13519
+ onRenderStart() {
13520
+ if (this.targetChanged)
13521
+ this.update();
13522
+ }
13523
+ onKey(e) {
13524
+ updateCursor(this, e);
13525
+ }
13364
13526
  listenTargetEvents() {
13365
13527
  if (!this.targetEventIds.length) {
13366
- const { app, leafer } = this;
13528
+ const { app, leafer, editBox, editMask } = this;
13367
13529
  this.targetEventIds = [
13368
- leafer.on_(RenderEvent.START, this.update, this),
13369
- app.on_(RenderEvent.CHILD_START, this.forceRender, this),
13530
+ leafer.on_(RenderEvent.START, this.onRenderStart, this),
13531
+ app.on_(RenderEvent.CHILD_START, this.onAppRenderStart, this),
13370
13532
  app.on_(exports.MoveEvent.BEFORE_MOVE, this.onMove, this, true),
13371
13533
  app.on_(exports.ZoomEvent.BEFORE_ZOOM, this.onScale, this, true),
13372
13534
  app.on_(exports.RotateEvent.BEFORE_ROTATE, this.onRotate, this, true),
13373
- app.on_([exports.KeyEvent.HOLD, exports.KeyEvent.UP], (e) => { updateCursor(this, e); }),
13374
- app.on_(exports.KeyEvent.DOWN, this.editBox.onArrow, this.editBox)
13535
+ app.on_([exports.KeyEvent.HOLD, exports.KeyEvent.UP], this.onKey, this),
13536
+ app.on_(exports.KeyEvent.DOWN, editBox.onArrow, editBox)
13375
13537
  ];
13538
+ if (editMask.visible)
13539
+ editMask.forceRender();
13376
13540
  }
13377
13541
  }
13378
13542
  removeTargetEvents() {
13379
- const { targetEventIds } = this;
13543
+ const { targetEventIds, editMask } = this;
13380
13544
  if (targetEventIds.length) {
13381
13545
  this.off_(targetEventIds);
13382
13546
  targetEventIds.length = 0;
13547
+ if (editMask.visible)
13548
+ editMask.forceRender();
13383
13549
  }
13384
13550
  }
13385
13551
  destroy() {
@@ -13393,6 +13559,9 @@ ${filterStyle}
13393
13559
  }
13394
13560
  }
13395
13561
  }
13562
+ __decorate([
13563
+ mergeConfigAttr()
13564
+ ], Editor.prototype, "mergeConfig", void 0);
13396
13565
  __decorate([
13397
13566
  targetAttr(onHover)
13398
13567
  ], Editor.prototype, "hoverTarget", void 0);
@@ -13457,9 +13626,7 @@ ${filterStyle}
13457
13626
  const { moveX, moveY, editor } = e;
13458
13627
  const { app, list } = editor;
13459
13628
  app.lockLayout();
13460
- list.forEach(target => {
13461
- target.moveWorld(moveX, moveY);
13462
- });
13629
+ list.forEach(target => { target.moveWorld(moveX, moveY); });
13463
13630
  app.unlockLayout();
13464
13631
  }
13465
13632
  onScale(e) {
@@ -13468,12 +13635,10 @@ ${filterStyle}
13468
13635
  app.lockLayout();
13469
13636
  list.forEach(target => {
13470
13637
  const resize = editor.getEditSize(target) !== 'scale';
13471
- if (transform) {
13638
+ if (transform)
13472
13639
  target.transformWorld(transform, resize);
13473
- }
13474
- else {
13640
+ else
13475
13641
  target.scaleOfWorld(worldOrigin, scaleX, scaleY, resize);
13476
- }
13477
13642
  });
13478
13643
  app.unlockLayout();
13479
13644
  }
@@ -13483,12 +13648,10 @@ ${filterStyle}
13483
13648
  app.lockLayout();
13484
13649
  list.forEach(target => {
13485
13650
  const resize = editor.getEditSize(target) !== 'scale';
13486
- if (transform) {
13651
+ if (transform)
13487
13652
  target.transformWorld(transform, resize);
13488
- }
13489
- else {
13653
+ else
13490
13654
  target.rotateOfWorld(worldOrigin, rotation);
13491
- }
13492
13655
  });
13493
13656
  app.unlockLayout();
13494
13657
  }
@@ -13498,12 +13661,10 @@ ${filterStyle}
13498
13661
  app.lockLayout();
13499
13662
  list.forEach(target => {
13500
13663
  const resize = editor.getEditSize(target) !== 'scale';
13501
- if (transform) {
13664
+ if (transform)
13502
13665
  target.transformWorld(transform, resize);
13503
- }
13504
- else {
13666
+ else
13505
13667
  target.skewOfWorld(worldOrigin, skewX, skewY, resize);
13506
- }
13507
13668
  });
13508
13669
  app.unlockLayout();
13509
13670
  }
@@ -13791,16 +13952,21 @@ ${filterStyle}
13791
13952
  scaleResize(this, scaleX, scaleY);
13792
13953
  };
13793
13954
  leaf.resizeWidth = function (width) {
13794
- const scale = width / this.getBounds('box', 'local').width;
13955
+ const scale = width / this.getBounds('box', 'local').width || 1;
13795
13956
  this.scaleOf(this.__layout.boxBounds, scale, this.__.lockRatio ? scale : 1, true);
13796
13957
  };
13797
13958
  leaf.resizeHeight = function (height) {
13798
- const scale = height / this.getBounds('box', 'local').height;
13959
+ const scale = height / this.getBounds('box', 'local').height || 1;
13799
13960
  this.scaleOf(this.__layout.boxBounds, this.__.lockRatio ? scale : 1, scale, true);
13800
13961
  };
13801
13962
  exports.Text.prototype.__scaleResize = function (scaleX, scaleY) {
13802
13963
  const { app, editConfig } = this, editor = app && app.editor, dragPoint = editor && editor.dragPoint;
13803
- if (this.__.resizeFontSize || (editConfig && editConfig.editSize === 'font-size') || (dragPoint && editor.mergeConfig.editSize === 'font-size')) {
13964
+ const { __autoWidth, __autoHeight, textAlign, verticalAlign } = this.__, { boxBounds } = this.__layout;
13965
+ if (__autoWidth && textAlign !== 'left' && scaleX !== 1)
13966
+ this.x += boxBounds.x;
13967
+ if (__autoHeight && verticalAlign !== 'top' && scaleY !== 1)
13968
+ this.y += boxBounds.y;
13969
+ if (this.__.resizeFontSize || (editConfig && editConfig.editSize === 'font-size') || (dragPoint && editor.mergedConfig.editSize === 'font-size')) {
13804
13970
  scaleResizeFontSize(this, scaleX, scaleY, dragPoint && dragPoint.direction);
13805
13971
  }
13806
13972
  else {
@@ -14123,11 +14289,26 @@ ${filterStyle}
14123
14289
  this.transformer.transformEnd();
14124
14290
  };
14125
14291
  interaction.wheel = function (data) {
14126
- const { wheel } = this.config;
14292
+ const { wheel, pointer } = this.config, { posDeltaSpeed, negDeltaSpeed } = wheel;
14127
14293
  if (wheel.disabled)
14128
14294
  return;
14295
+ if (data.deltaX > 0)
14296
+ posDeltaSpeed && (data.deltaX *= posDeltaSpeed);
14297
+ else
14298
+ negDeltaSpeed && (data.deltaX *= negDeltaSpeed);
14299
+ if (data.deltaY > 0)
14300
+ posDeltaSpeed && (data.deltaY *= posDeltaSpeed);
14301
+ else
14302
+ negDeltaSpeed && (data.deltaY *= negDeltaSpeed);
14129
14303
  const scale = wheel.getScale ? wheel.getScale(data, wheel) : WheelEventHelper.getScale(data, wheel);
14130
- scale !== 1 ? this.zoom(getZoomEventData(scale, data)) : this.move(getMoveEventData(wheel.getMove ? wheel.getMove(data, wheel) : WheelEventHelper.getMove(data, wheel), data));
14304
+ if (scale !== 1)
14305
+ this.zoom(getZoomEventData(scale, data));
14306
+ else {
14307
+ const move = wheel.getMove ? wheel.getMove(data, wheel) : WheelEventHelper.getMove(data, wheel);
14308
+ if (pointer.snap)
14309
+ PointHelper.round(move);
14310
+ this.move(getMoveEventData(move, data));
14311
+ }
14131
14312
  };
14132
14313
  interaction.multiTouch = function (data, list) {
14133
14314
  if (this.config.multiTouch.disabled)
@@ -15122,7 +15303,7 @@ ${filterStyle}
15122
15303
  const { editor } = this;
15123
15304
  const { config } = editor.app;
15124
15305
  const text = this.editTarget;
15125
- text.visible = false;
15306
+ text.textEditing = true;
15126
15307
  this.isHTMLText = !(text instanceof exports.Text);
15127
15308
  this._keyEvent = config.keyEvent;
15128
15309
  config.keyEvent = false;
@@ -15239,7 +15420,7 @@ ${filterStyle}
15239
15420
  const { editTarget: text, editor, editDom: dom } = this;
15240
15421
  if (text) {
15241
15422
  this.onInput();
15242
- text.visible = true;
15423
+ text.textEditing = undefined;
15243
15424
  if (editor.app)
15244
15425
  editor.app.config.keyEvent = this._keyEvent;
15245
15426
  editor.off_(this.eventIds);
@@ -15257,6 +15438,7 @@ ${filterStyle}
15257
15438
  ], exports.TextEditor);
15258
15439
 
15259
15440
  Plugin.add('text-editor', 'editor');
15441
+ exports.Text.addAttr('textEditing', false, surfaceType);
15260
15442
 
15261
15443
  class HTMLTextData extends ImageData {
15262
15444
  setText(value) {