@leafer-ui/worker 1.0.4 → 1.0.6

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.
@@ -552,6 +552,12 @@ const PointHelper = {
552
552
  to.y = t.y + sin$4(r) * distance;
553
553
  return to;
554
554
  },
555
+ toNumberPoints(originPoints) {
556
+ let points = originPoints;
557
+ if (typeof originPoints[0] === 'object')
558
+ points = [], originPoints.forEach(p => points.push(p.x, p.y));
559
+ return points;
560
+ },
555
561
  reset(t) {
556
562
  P$5.reset(t);
557
563
  }
@@ -1542,7 +1548,10 @@ const { assign } = DataHelper;
1542
1548
 
1543
1549
  class LeafData {
1544
1550
  get __useNaturalRatio() { return true; }
1545
- get __isLinePath() { return this.path && this.path.length === 6; }
1551
+ get __isLinePath() {
1552
+ const { path } = this;
1553
+ return path && path.length === 6 && path[0] === 1;
1554
+ }
1546
1555
  get __blendMode() {
1547
1556
  if (this.eraser && this.eraser !== 'path')
1548
1557
  return 'destination-out';
@@ -2305,11 +2314,12 @@ const RectHelper = {
2305
2314
 
2306
2315
  const { sin: sin$3, cos: cos$3, atan2: atan2$1, ceil: ceil$1, abs: abs$3, PI: PI$2, sqrt: sqrt$1, pow } = Math;
2307
2316
  const { setPoint: setPoint$2, addPoint: addPoint$2 } = TwoPointBoundsHelper;
2308
- const { set } = PointHelper;
2317
+ const { set, toNumberPoints } = PointHelper;
2309
2318
  const { M: M$5, L: L$6, C: C$5, Q: Q$4, Z: Z$5 } = PathCommandMap;
2310
2319
  const tempPoint$2 = {};
2311
2320
  const BezierHelper = {
2312
- points(data, points, curve, close) {
2321
+ points(data, originPoints, curve, close) {
2322
+ let points = toNumberPoints(originPoints);
2313
2323
  data.push(M$5, points[0], points[1]);
2314
2324
  if (curve && points.length > 5) {
2315
2325
  let aX, aY, bX, bY, cX, cY, c1X, c1Y, c2X, c2Y;
@@ -2818,6 +2828,27 @@ const PathConvert = {
2818
2828
  }
2819
2829
  return data;
2820
2830
  },
2831
+ objectToCanvasData(list) {
2832
+ const data = [];
2833
+ list.forEach(item => {
2834
+ switch (item.name) {
2835
+ case 'M':
2836
+ data.push(M$4, item.x, item.y);
2837
+ break;
2838
+ case 'L':
2839
+ data.push(L$5, item.x, item.y);
2840
+ break;
2841
+ case 'C':
2842
+ data.push(C$4, item.x1, item.y1, item.x2, item.y2, item.x, item.y);
2843
+ break;
2844
+ case 'Q':
2845
+ data.push(Q$3, item.x1, item.y1, item.x, item.y);
2846
+ break;
2847
+ case 'Z': data.push(Z$4);
2848
+ }
2849
+ });
2850
+ return data;
2851
+ },
2821
2852
  copyData(data, old, index, count) {
2822
2853
  for (let i = index, end = index + count; i < end; i++) {
2823
2854
  data.push(old[i]);
@@ -4755,6 +4786,7 @@ class RenderEvent extends Event {
4755
4786
  }
4756
4787
  }
4757
4788
  RenderEvent.REQUEST = 'render.request';
4789
+ RenderEvent.CHILD_START = 'render.child_start';
4758
4790
  RenderEvent.START = 'render.start';
4759
4791
  RenderEvent.BEFORE = 'render.before';
4760
4792
  RenderEvent.RENDER = 'render';
@@ -4930,7 +4962,7 @@ const { isFinite } = Number;
4930
4962
  const debug$7 = Debug.get('setAttr');
4931
4963
  const LeafDataProxy = {
4932
4964
  __setAttr(name, newValue, checkFiniteNumber) {
4933
- if (this.leafer && this.leafer.created) {
4965
+ if (this.leaferIsCreated) {
4934
4966
  const oldValue = this.__.__getInput(name);
4935
4967
  if (checkFiniteNumber && !isFinite(newValue) && newValue !== undefined) {
4936
4968
  debug$7.warn(this.innerName, name, newValue);
@@ -5002,7 +5034,7 @@ const LeafMatrix = {
5002
5034
 
5003
5035
  const { updateMatrix: updateMatrix$1, updateAllMatrix: updateAllMatrix$2 } = LeafHelper;
5004
5036
  const { updateBounds: updateBounds$1 } = BranchHelper;
5005
- const { toOuterOf: toOuterOf$1, copyAndSpread: copyAndSpread$2, copy: copy$5 } = BoundsHelper;
5037
+ const { toOuterOf: toOuterOf$1, copyAndSpread: copyAndSpread$1, copy: copy$5 } = BoundsHelper;
5006
5038
  const { toBounds: toBounds$2 } = PathBounds;
5007
5039
  const LeafBounds = {
5008
5040
  __updateWorldBounds() {
@@ -5085,7 +5117,7 @@ const LeafBounds = {
5085
5117
  const b = this.__layout.boxBounds;
5086
5118
  const data = this.__;
5087
5119
  if (data.__pathInputed) {
5088
- toBounds$2(data.__pathForRender, b);
5120
+ toBounds$2(data.path, b);
5089
5121
  }
5090
5122
  else {
5091
5123
  b.x = 0;
@@ -5097,7 +5129,7 @@ const LeafBounds = {
5097
5129
  __updateAutoLayout() {
5098
5130
  this.__layout.matrixChanged = true;
5099
5131
  if (this.isBranch) {
5100
- if (this.leafer && this.leafer.ready)
5132
+ if (this.leaferIsReady)
5101
5133
  this.leafer.layouter.addExtra(this);
5102
5134
  if (this.__.flow) {
5103
5135
  if (this.__layout.boxChanged)
@@ -5123,11 +5155,11 @@ const LeafBounds = {
5123
5155
  },
5124
5156
  __updateStrokeBounds() {
5125
5157
  const layout = this.__layout;
5126
- copyAndSpread$2(layout.strokeBounds, layout.boxBounds, layout.strokeBoxSpread);
5158
+ copyAndSpread$1(layout.strokeBounds, layout.boxBounds, layout.strokeBoxSpread);
5127
5159
  },
5128
5160
  __updateRenderBounds() {
5129
5161
  const layout = this.__layout;
5130
- layout.renderSpread > 0 ? copyAndSpread$2(layout.renderBounds, layout.boxBounds, layout.renderSpread) : copy$5(layout.renderBounds, layout.strokeBounds);
5162
+ layout.renderSpread > 0 ? copyAndSpread$1(layout.renderBounds, layout.boxBounds, layout.renderSpread) : copy$5(layout.renderBounds, layout.strokeBounds);
5131
5163
  }
5132
5164
  };
5133
5165
 
@@ -5158,7 +5190,7 @@ const LeafRender = {
5158
5190
  if (this.__worldOpacity) {
5159
5191
  canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
5160
5192
  this.__drawRenderPath(canvas);
5161
- this.__.windingRule ? canvas.clip(this.__.windingRule) : canvas.clip();
5193
+ this.windingRule ? canvas.clip(this.windingRule) : canvas.clip();
5162
5194
  }
5163
5195
  },
5164
5196
  __updateWorldOpacity() {
@@ -5232,6 +5264,8 @@ let Leaf = class Leaf {
5232
5264
  get innerName() { return this.__.name || this.tag + this.innerId; }
5233
5265
  get __DataProcessor() { return LeafData; }
5234
5266
  get __LayoutProcessor() { return LeafLayout; }
5267
+ get leaferIsCreated() { return this.leafer && this.leafer.created; }
5268
+ get leaferIsReady() { return this.leafer && this.leafer.ready; }
5235
5269
  get isLeafer() { return false; }
5236
5270
  get isBranch() { return false; }
5237
5271
  get isBranchLeaf() { return false; }
@@ -5673,10 +5707,17 @@ let Branch = class Branch extends Leaf {
5673
5707
  add(child, index) {
5674
5708
  if (child === this)
5675
5709
  return;
5710
+ const noIndex = index === undefined;
5711
+ if (!child.__) {
5712
+ if (child instanceof Array)
5713
+ return child.forEach(item => { this.add(item, index); noIndex || index++; });
5714
+ else
5715
+ child = UICreator.get(child.tag, child);
5716
+ }
5676
5717
  if (child.parent)
5677
5718
  child.parent.remove(child);
5678
5719
  child.parent = this;
5679
- index === undefined ? this.children.push(child) : this.children.splice(index, 0, child);
5720
+ noIndex ? this.children.push(child) : this.children.splice(index, 0, child);
5680
5721
  if (child.isBranch)
5681
5722
  this.__.__childBranchNumber = (this.__.__childBranchNumber || 0) + 1;
5682
5723
  child.__layout.boxChanged || child.__layout.boxChange();
@@ -5690,15 +5731,17 @@ let Branch = class Branch extends Leaf {
5690
5731
  }
5691
5732
  this.__layout.affectChildrenSort && this.__layout.childrenSortChange();
5692
5733
  }
5693
- addMany(...children) {
5694
- children.forEach(child => this.add(child));
5695
- }
5734
+ addMany(...children) { this.add(children); }
5696
5735
  remove(child, destroy) {
5697
5736
  if (child) {
5698
- if (child.animationOut)
5699
- child.__runAnimation('out', () => this.__remove(child, destroy));
5737
+ if (child.__) {
5738
+ if (child.animationOut)
5739
+ child.__runAnimation('out', () => this.__remove(child, destroy));
5740
+ else
5741
+ this.__remove(child, destroy);
5742
+ }
5700
5743
  else
5701
- this.__remove(child, destroy);
5744
+ this.find(child).forEach(item => this.remove(item, destroy));
5702
5745
  }
5703
5746
  else if (child === undefined) {
5704
5747
  super.remove(null, destroy);
@@ -5916,7 +5959,7 @@ class LeafLevelList {
5916
5959
  }
5917
5960
  }
5918
5961
 
5919
- const version = "1.0.4";
5962
+ const version = "1.0.6";
5920
5963
 
5921
5964
  class LeaferCanvas extends LeaferCanvasBase {
5922
5965
  get allowBackgroundColor() { return true; }
@@ -6385,6 +6428,7 @@ class Renderer {
6385
6428
  this.totalBounds = new Bounds();
6386
6429
  debug$5.log(target.innerName, '--->');
6387
6430
  try {
6431
+ target.app.emit(RenderEvent.CHILD_START, target);
6388
6432
  this.emitRender(RenderEvent.START);
6389
6433
  this.renderOnce(callback);
6390
6434
  this.emitRender(RenderEvent.END, this.totalBounds);
@@ -6682,7 +6726,7 @@ class Picker {
6682
6726
  if (child.isBranch) {
6683
6727
  if (hit || child.__ignoreHitWorld) {
6684
6728
  this.eachFind(child.children, child.__onlyHitMask);
6685
- if (child.isBranchLeaf && !this.findList.length)
6729
+ if (child.isBranchLeaf)
6686
6730
  this.hitChild(child, point);
6687
6731
  }
6688
6732
  }
@@ -6895,6 +6939,13 @@ function zoomLayerType() {
6895
6939
 
6896
6940
  const TextConvert = {};
6897
6941
  const ColorConvert = {};
6942
+ const UnitConvert = {
6943
+ number(value, percentRefer) {
6944
+ if (typeof value === 'object')
6945
+ return value.type === 'percent' ? value.value * percentRefer : value.value;
6946
+ return value;
6947
+ }
6948
+ };
6898
6949
  const PathArrow = {};
6899
6950
  const Paint = {};
6900
6951
  const PaintImage = {};
@@ -6915,7 +6966,7 @@ const Transition = {
6915
6966
  }
6916
6967
  };
6917
6968
 
6918
- const { parse } = PathConvert;
6969
+ const { parse, objectToCanvasData } = PathConvert;
6919
6970
  const emptyPaint = {};
6920
6971
  const debug$4 = Debug.get('UIData');
6921
6972
  class UIData extends LeafData {
@@ -6929,10 +6980,11 @@ class UIData extends LeafData {
6929
6980
  scaleX = -scaleX;
6930
6981
  return scaleX > 1 ? strokeWidth / scaleX : strokeWidth;
6931
6982
  }
6932
- else {
6983
+ else
6933
6984
  return strokeWidth;
6934
- }
6935
6985
  }
6986
+ get __hasStroke() { return this.stroke && this.strokeWidth; }
6987
+ get __clipAfterFill() { return (this.cornerRadius || this.__pathInputed); }
6936
6988
  get __autoWidth() { return !this._width; }
6937
6989
  get __autoHeight() { return !this._height; }
6938
6990
  get __autoSide() { return !this._width || !this._height; }
@@ -6949,9 +7001,8 @@ class UIData extends LeafData {
6949
7001
  this.__leaf.scaleX *= -1;
6950
7002
  debug$4.warn('width < 0, instead -scaleX ', this);
6951
7003
  }
6952
- else {
7004
+ else
6953
7005
  this._width = value;
6954
- }
6955
7006
  }
6956
7007
  setHeight(value) {
6957
7008
  if (value < 0) {
@@ -6959,9 +7010,8 @@ class UIData extends LeafData {
6959
7010
  this.__leaf.scaleY *= -1;
6960
7011
  debug$4.warn('height < 0, instead -scaleY', this);
6961
7012
  }
6962
- else {
7013
+ else
6963
7014
  this._height = value;
6964
- }
6965
7015
  }
6966
7016
  setFill(value) {
6967
7017
  if (this.__naturalWidth)
@@ -7002,9 +7052,10 @@ class UIData extends LeafData {
7002
7052
  }
7003
7053
  }
7004
7054
  setPath(value) {
7005
- if (typeof value === 'string') {
7055
+ const isString = typeof value === 'string';
7056
+ if (isString || (value && typeof value[0] === 'object')) {
7006
7057
  this.__setInput('path', value);
7007
- this._path = parse(value);
7058
+ this._path = isString ? parse(value) : objectToCanvasData(value);
7008
7059
  }
7009
7060
  else {
7010
7061
  if (this.__input)
@@ -7019,12 +7070,8 @@ class UIData extends LeafData {
7019
7070
  value = value.filter((item) => item.visible !== false);
7020
7071
  this._shadow = value.length ? value : null;
7021
7072
  }
7022
- else if (value) {
7023
- this._shadow = value.visible === false ? null : [value];
7024
- }
7025
- else {
7026
- this._shadow = null;
7027
- }
7073
+ else
7074
+ this._shadow = value && value.visible !== false ? [value] : null;
7028
7075
  }
7029
7076
  setInnerShadow(value) {
7030
7077
  this.__setInput('innerShadow', value);
@@ -7033,12 +7080,8 @@ class UIData extends LeafData {
7033
7080
  value = value.filter((item) => item.visible !== false);
7034
7081
  this._innerShadow = value.length ? value : null;
7035
7082
  }
7036
- else if (value) {
7037
- this._innerShadow = value.visible === false ? null : [value];
7038
- }
7039
- else {
7040
- this._innerShadow = null;
7041
- }
7083
+ else
7084
+ this._innerShadow = value && value.visible !== false ? [value] : null;
7042
7085
  }
7043
7086
  __computePaint() {
7044
7087
  const { fill, stroke } = this.__input;
@@ -7049,24 +7092,19 @@ class UIData extends LeafData {
7049
7092
  this.__needComputePaint = false;
7050
7093
  }
7051
7094
  }
7052
- const UnitConvert = {
7053
- number(value, percentRefer) {
7054
- if (typeof value === 'object')
7055
- return value.type === 'percent' ? value.value * percentRefer : value.value;
7056
- return value;
7057
- }
7058
- };
7059
7095
 
7060
7096
  class GroupData extends UIData {
7061
7097
  }
7062
7098
 
7063
7099
  class BoxData extends GroupData {
7064
7100
  get __boxStroke() { return !this.__pathInputed; }
7101
+ get __drawAfterFill() { return this.overflow === 'hide' && this.__clipAfterFill && this.__leaf.children.length; }
7102
+ get __clipAfterFill() { return this.__leaf.isOverflow || super.__clipAfterFill; }
7065
7103
  }
7066
7104
 
7067
7105
  class LeaferData extends GroupData {
7068
- __getInputData() {
7069
- const data = super.__getInputData();
7106
+ __getInputData(names, options) {
7107
+ const data = super.__getInputData(names, options);
7070
7108
  canvasSizeAttrs.forEach(key => delete data[key]);
7071
7109
  return data;
7072
7110
  }
@@ -7093,6 +7131,7 @@ class StarData extends UIData {
7093
7131
  }
7094
7132
 
7095
7133
  class PathData extends UIData {
7134
+ get __pathInputed() { return 2; }
7096
7135
  }
7097
7136
 
7098
7137
  class PenData extends GroupData {
@@ -7139,16 +7178,18 @@ class ImageData extends RectData {
7139
7178
  delete data.fill;
7140
7179
  return data;
7141
7180
  }
7142
- __getInputData() {
7143
- const data = super.__getInputData();
7181
+ __getInputData(names, options) {
7182
+ const data = super.__getInputData(names, options);
7144
7183
  delete data.fill;
7145
7184
  return data;
7146
7185
  }
7147
7186
  }
7148
7187
 
7149
7188
  class CanvasData extends RectData {
7150
- __getInputData() {
7151
- const data = super.__getInputData();
7189
+ get __isCanvas() { return true; }
7190
+ get __drawAfterFill() { return true; }
7191
+ __getInputData(names, options) {
7192
+ const data = super.__getInputData(names, options);
7152
7193
  data.url = this.__leaf.canvas.toDataURL('image/png');
7153
7194
  return data;
7154
7195
  }
@@ -7175,16 +7216,12 @@ const UIBounds = {
7175
7216
  let width = 0;
7176
7217
  const { shadow, innerShadow, blur, backgroundBlur } = this.__;
7177
7218
  if (shadow)
7178
- shadow.forEach(item => {
7179
- width = Math.max(width, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread > 0 ? item.spread : 0) + item.blur * 1.5);
7180
- });
7219
+ shadow.forEach(item => width = Math.max(width, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread > 0 ? item.spread : 0) + item.blur * 1.5));
7181
7220
  if (blur)
7182
7221
  width = Math.max(width, blur);
7183
7222
  let shapeWidth = width = Math.ceil(width);
7184
7223
  if (innerShadow)
7185
- innerShadow.forEach(item => {
7186
- shapeWidth = Math.max(shapeWidth, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread < 0 ? -item.spread : 0) + item.blur * 1.5);
7187
- });
7224
+ innerShadow.forEach(item => shapeWidth = Math.max(shapeWidth, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread < 0 ? -item.spread : 0) + item.blur * 1.5));
7188
7225
  if (backgroundBlur)
7189
7226
  shapeWidth = Math.max(shapeWidth, backgroundBlur);
7190
7227
  this.__layout.renderShapeSpread = shapeWidth;
@@ -7266,6 +7303,16 @@ const UIRender = {
7266
7303
  if (stroke && !ignoreStroke)
7267
7304
  this.__.__pixelStroke ? Paint.strokes(stroke, this, canvas) : Paint.stroke('#000000', this, canvas);
7268
7305
  }
7306
+ },
7307
+ __drawAfterFill(canvas, options) {
7308
+ if (this.__.__clipAfterFill) {
7309
+ canvas.save();
7310
+ this.windingRule ? canvas.clip(this.windingRule) : canvas.clip();
7311
+ this.__drawContent(canvas, options);
7312
+ canvas.restore();
7313
+ }
7314
+ else
7315
+ this.__drawContent(canvas, options);
7269
7316
  }
7270
7317
  };
7271
7318
  function drawFast(ui, canvas, options) {
@@ -7332,8 +7379,8 @@ let UI = UI_1 = class UI extends Leaf {
7332
7379
  return pen;
7333
7380
  }
7334
7381
  get editConfig() { return undefined; }
7335
- get editOuter() { return this.__.__isLinePath ? 'LineEditTool' : 'EditTool'; }
7336
- get editInner() { return 'PathEditor'; }
7382
+ get editOuter() { return ''; }
7383
+ get editInner() { return ''; }
7337
7384
  constructor(data) {
7338
7385
  super(data);
7339
7386
  }
@@ -7344,9 +7391,8 @@ let UI = UI_1 = class UI extends Leaf {
7344
7391
  Object.assign(this, data);
7345
7392
  this.lockNormalStyle = false;
7346
7393
  }
7347
- else {
7394
+ else
7348
7395
  Object.assign(this, data);
7349
- }
7350
7396
  }
7351
7397
  get(name) {
7352
7398
  return typeof name === 'string' ? this.__.__getInput(name) : this.__.__getInputData(name);
@@ -7392,12 +7438,7 @@ let UI = UI_1 = class UI extends Leaf {
7392
7438
  this.__drawPathByData(canvas, this.__.path);
7393
7439
  }
7394
7440
  __drawPathByData(drawer, data) {
7395
- if (data) {
7396
- PathDrawer.drawPathByData(drawer, data);
7397
- }
7398
- else {
7399
- this.__drawPathByBox(drawer);
7400
- }
7441
+ data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer);
7401
7442
  }
7402
7443
  __drawPathByBox(drawer) {
7403
7444
  const { x, y, width, height } = this.__layout.boxBounds;
@@ -7405,9 +7446,8 @@ let UI = UI_1 = class UI extends Leaf {
7405
7446
  const { cornerRadius } = this.__;
7406
7447
  drawer.roundRect(x, y, width, height, typeof cornerRadius === 'number' ? [cornerRadius] : cornerRadius);
7407
7448
  }
7408
- else {
7449
+ else
7409
7450
  drawer.rect(x, y, width, height);
7410
- }
7411
7451
  }
7412
7452
  animate(_keyframe, _options, _type, _isTemp) {
7413
7453
  return needPlugin('animate');
@@ -7654,23 +7694,13 @@ let Group = class Group extends UI {
7654
7694
  if (data.children) {
7655
7695
  const { children } = data;
7656
7696
  delete data.children;
7657
- if (!this.children) {
7658
- this.__setBranch();
7659
- }
7660
- else {
7661
- this.clear();
7662
- }
7697
+ this.children ? this.clear() : this.__setBranch();
7663
7698
  super.set(data, isTemp);
7664
- let child;
7665
- children.forEach(childData => {
7666
- child = childData.__ ? childData : UICreator.get(childData.tag, childData);
7667
- this.add(child);
7668
- });
7699
+ children.forEach(child => this.add(child));
7669
7700
  data.children = children;
7670
7701
  }
7671
- else {
7702
+ else
7672
7703
  super.set(data, isTemp);
7673
- }
7674
7704
  }
7675
7705
  toJSON(options) {
7676
7706
  const data = super.toJSON(options);
@@ -8090,10 +8120,9 @@ Rect = __decorate([
8090
8120
  registerUI()
8091
8121
  ], Rect);
8092
8122
 
8093
- const rect$1 = Rect.prototype;
8094
- const group$1 = Group.prototype;
8123
+ const { copy: copy$3, add, includes: includes$1 } = BoundsHelper;
8124
+ const rect$1 = Rect.prototype, group$1 = Group.prototype;
8095
8125
  const childrenRenderBounds = {};
8096
- const { copy: copy$3, add, includes: includes$1, copyAndSpread: copyAndSpread$1 } = BoundsHelper;
8097
8126
  let Box = class Box extends Group {
8098
8127
  get __tag() { return 'Box'; }
8099
8128
  get isBranchLeaf() { return true; }
@@ -8103,37 +8132,31 @@ let Box = class Box extends Group {
8103
8132
  }
8104
8133
  __updateStrokeSpread() { return 0; }
8105
8134
  __updateRectRenderSpread() { return 0; }
8106
- __updateRenderSpread() {
8107
- return this.__updateRectRenderSpread() || -1;
8108
- }
8135
+ __updateRenderSpread() { return this.__updateRectRenderSpread() || -1; }
8109
8136
  __updateRectBoxBounds() { }
8110
- __updateBoxBounds(secondLayout) {
8137
+ __updateBoxBounds(_secondLayout) {
8111
8138
  const data = this.__;
8112
8139
  if (this.children.length) {
8113
8140
  if (data.__autoSide) {
8114
- if (this.leafer && this.leafer.ready)
8115
- this.leafer.layouter.addExtra(this);
8116
8141
  super.__updateBoxBounds();
8117
8142
  const { boxBounds } = this.__layout;
8118
8143
  if (!data.__autoSize) {
8119
- if (data.__autoWidth)
8120
- boxBounds.width += boxBounds.x, boxBounds.height = data.height, boxBounds.y = boxBounds.x = 0;
8121
- else
8122
- boxBounds.height += boxBounds.y, boxBounds.width = data.width, boxBounds.x = boxBounds.y = 0;
8144
+ if (data.__autoWidth) {
8145
+ boxBounds.width += boxBounds.x, boxBounds.x = 0;
8146
+ boxBounds.height = data.height, boxBounds.y = 0;
8147
+ }
8148
+ else {
8149
+ boxBounds.height += boxBounds.y, boxBounds.y = 0;
8150
+ boxBounds.width = data.width, boxBounds.x = 0;
8151
+ }
8123
8152
  }
8124
- if (secondLayout && data.flow && data.padding)
8125
- copyAndSpread$1(boxBounds, boxBounds, data.padding, false, data.__autoSize ? null : (data.__autoWidth ? 'width' : 'height'));
8126
8153
  this.__updateNaturalSize();
8127
8154
  }
8128
- else {
8155
+ else
8129
8156
  this.__updateRectBoxBounds();
8130
- }
8131
- if (data.flow)
8132
- this.__updateContentBounds();
8133
8157
  }
8134
- else {
8158
+ else
8135
8159
  this.__updateRectBoxBounds();
8136
- }
8137
8160
  }
8138
8161
  __updateStrokeBounds() { }
8139
8162
  __updateRenderBounds() {
@@ -8143,14 +8166,13 @@ let Box = class Box extends Group {
8143
8166
  super.__updateRenderBounds();
8144
8167
  copy$3(childrenRenderBounds, renderBounds);
8145
8168
  this.__updateRectRenderBounds();
8146
- isOverflow = !includes$1(renderBounds, childrenRenderBounds) || !this.pathInputed || !this.__.cornerRadius;
8169
+ isOverflow = !includes$1(renderBounds, childrenRenderBounds);
8170
+ if (isOverflow && this.__.overflow !== 'hide')
8171
+ add(renderBounds, childrenRenderBounds);
8147
8172
  }
8148
- else {
8173
+ else
8149
8174
  this.__updateRectRenderBounds();
8150
- }
8151
- this.isOverflow !== isOverflow && (this.isOverflow = isOverflow);
8152
- if (!(this.__.__drawAfterFill = this.__.overflow === 'hide') && isOverflow)
8153
- add(renderBounds, childrenRenderBounds);
8175
+ !this.isOverflow !== !isOverflow && (this.isOverflow = isOverflow);
8154
8176
  }
8155
8177
  __updateRectRenderBounds() { }
8156
8178
  __updateRectChange() { }
@@ -8170,20 +8192,9 @@ let Box = class Box extends Group {
8170
8192
  this.__renderGroup(canvas, options);
8171
8193
  }
8172
8194
  }
8173
- __drawAfterFill(canvas, options) {
8174
- const { length } = this.children;
8175
- if (this.isOverflow) {
8176
- canvas.save();
8177
- canvas.clip();
8178
- if (length)
8179
- this.__renderGroup(canvas, options);
8180
- canvas.restore();
8181
- }
8182
- else {
8183
- if (length)
8184
- this.__renderGroup(canvas, options);
8185
- }
8186
- if (this.__.stroke && length) {
8195
+ __drawContent(canvas, options) {
8196
+ this.__renderGroup(canvas, options);
8197
+ if (this.__.__hasStroke) {
8187
8198
  canvas.setWorld(this.__nowWorld);
8188
8199
  this.__drawRenderPath(canvas);
8189
8200
  }
@@ -8195,6 +8206,9 @@ __decorate([
8195
8206
  __decorate([
8196
8207
  dataType(false)
8197
8208
  ], Box.prototype, "resizeChildren", void 0);
8209
+ __decorate([
8210
+ dataType(false)
8211
+ ], Box.prototype, "textBox", void 0);
8198
8212
  __decorate([
8199
8213
  affectRenderBoundsType('show')
8200
8214
  ], Box.prototype, "overflow", void 0);
@@ -8344,17 +8358,15 @@ let Line = class Line extends UI {
8344
8358
  if (data.__useArrow)
8345
8359
  PathArrow.addArrows(this, false);
8346
8360
  }
8347
- else {
8361
+ else
8348
8362
  super.__updateRenderPath();
8349
- }
8350
8363
  }
8351
8364
  __updateBoxBounds() {
8352
8365
  if (this.points) {
8353
8366
  toBounds$1(this.__.__pathForRender, this.__layout.boxBounds);
8354
8367
  }
8355
- else {
8368
+ else
8356
8369
  super.__updateBoxBounds();
8357
- }
8358
8370
  }
8359
8371
  };
8360
8372
  __decorate([
@@ -8492,7 +8504,6 @@ let Canvas = class Canvas extends Rect {
8492
8504
  super(data);
8493
8505
  this.canvas = Creator.canvas(this.__);
8494
8506
  this.context = this.canvas.context;
8495
- this.__.__isCanvas = this.__.__drawAfterFill = true;
8496
8507
  if (data && data.url)
8497
8508
  this.drawImage(data.url);
8498
8509
  }
@@ -8505,8 +8516,7 @@ let Canvas = class Canvas extends Rect {
8505
8516
  });
8506
8517
  }
8507
8518
  draw(ui, offset, scale, rotation) {
8508
- ui.__layout.update();
8509
- const matrix = new Matrix(ui.__world).invert();
8519
+ const matrix = new Matrix(ui.worldTransform).invert();
8510
8520
  const m = new Matrix();
8511
8521
  if (offset)
8512
8522
  m.translate(offset.x, offset.y);
@@ -8521,17 +8531,9 @@ let Canvas = class Canvas extends Rect {
8521
8531
  paint() {
8522
8532
  this.forceRender();
8523
8533
  }
8524
- __drawAfterFill(canvas, _options) {
8525
- const { width, height, cornerRadius } = this.__, { view } = this.canvas;
8526
- if (cornerRadius || this.pathInputed) {
8527
- canvas.save();
8528
- canvas.clip();
8529
- canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
8530
- canvas.restore();
8531
- }
8532
- else {
8533
- canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
8534
- }
8534
+ __drawContent(canvas, _options) {
8535
+ const { width, height } = this.__, { view } = this.canvas;
8536
+ canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
8535
8537
  }
8536
8538
  __updateSize() {
8537
8539
  const { canvas } = this;
@@ -8575,7 +8577,6 @@ Canvas = __decorate([
8575
8577
  const { copyAndSpread, includes, isSame: isSame$1, spread, setList } = BoundsHelper;
8576
8578
  let Text = class Text extends UI {
8577
8579
  get __tag() { return 'Text'; }
8578
- get editInner() { return 'TextEditor'; }
8579
8580
  get textDrawData() {
8580
8581
  this.__layout.update();
8581
8582
  return this.__.__textDrawData;
@@ -8724,6 +8725,9 @@ __decorate([
8724
8725
  __decorate([
8725
8726
  boundsType('top')
8726
8727
  ], Text.prototype, "verticalAlign", void 0);
8728
+ __decorate([
8729
+ boundsType(true)
8730
+ ], Text.prototype, "autoSizeAlign", void 0);
8727
8731
  __decorate([
8728
8732
  boundsType('normal')
8729
8733
  ], Text.prototype, "textWrap", void 0);
@@ -8738,7 +8742,6 @@ let Path = class Path extends UI {
8738
8742
  get __tag() { return 'Path'; }
8739
8743
  constructor(data) {
8740
8744
  super(data);
8741
- this.__.__pathInputed = 2;
8742
8745
  }
8743
8746
  };
8744
8747
  __decorate([
@@ -8821,21 +8824,17 @@ let App = class App extends Leafer {
8821
8824
  this.tree = this.addLeafer(tree);
8822
8825
  if (sky || editor)
8823
8826
  this.sky = this.addLeafer(sky || { type: 'draw', usePartRender: false });
8824
- if (editor) {
8825
- this.editor = Creator.editor(editor);
8826
- this.sky.add(this.editor);
8827
- }
8827
+ if (editor)
8828
+ this.sky.add(this.editor = Creator.editor(editor));
8828
8829
  }
8829
8830
  }
8830
8831
  __setApp() {
8831
8832
  const { canvas } = this;
8832
8833
  const { realCanvas, view } = this.config;
8833
- if (realCanvas || view === this.canvas.view || !canvas.parentView) {
8834
+ if (realCanvas || view === this.canvas.view || !canvas.parentView)
8834
8835
  this.realCanvas = true;
8835
- }
8836
- else {
8836
+ else
8837
8837
  canvas.unrealCanvas();
8838
- }
8839
8838
  this.leafer = this;
8840
8839
  this.watcher.disable();
8841
8840
  this.layouter.disable();
@@ -9241,10 +9240,7 @@ leafer.initType = function (type) {
9241
9240
  leafer.getValidMove = function (moveX, moveY) {
9242
9241
  const { scroll, disabled } = this.app.config.move;
9243
9242
  if (scroll) {
9244
- if (Math.abs(moveX) > Math.abs(moveY))
9245
- moveY = 0;
9246
- else
9247
- moveX = 0;
9243
+ Math.abs(moveX) > Math.abs(moveY) ? moveY = 0 : moveX = 0;
9248
9244
  if (scroll === 'limit') {
9249
9245
  const { x, y, width, height } = new Bounds(this.__world).addPoint(this.zoomLayer);
9250
9246
  const right = x + width - this.width, bottom = y + height - this.height;
@@ -9444,9 +9440,10 @@ class Dragger {
9444
9440
  this.dragData = getDragEventData(data, data, data);
9445
9441
  this.canAnimate = this.canDragOut = true;
9446
9442
  }
9447
- getList() {
9443
+ getList(realDraggable, hover) {
9448
9444
  const { proxy } = this.interaction.selector;
9449
- return this.dragging && (!proxy || !proxy.list.length) ? (DragEvent.list || this.dragableList || emptyList) : emptyList;
9445
+ const hasProxyList = proxy && proxy.list.length, dragList = DragEvent.list || this.draggableList || emptyList;
9446
+ return this.dragging && (hasProxyList ? (realDraggable ? emptyList : new LeafList(hover ? [...proxy.list, ...proxy.dragHoverExclude] : proxy.list)) : dragList);
9450
9447
  }
9451
9448
  checkDrag(data, canDrag) {
9452
9449
  const { interaction } = this;
@@ -9471,8 +9468,8 @@ class Dragger {
9471
9468
  this.dragging = canDrag && PointerButton.left(data);
9472
9469
  if (this.dragging) {
9473
9470
  this.interaction.emit(DragEvent.START, this.dragData);
9474
- this.getDragableList(this.dragData.path);
9475
- this.setDragStartPoints(this.realDragableList = this.getList());
9471
+ this.getDraggableList(this.dragData.path);
9472
+ this.setDragStartPoints(this.realDraggableList = this.getList(true));
9476
9473
  }
9477
9474
  }
9478
9475
  }
@@ -9480,12 +9477,12 @@ class Dragger {
9480
9477
  this.dragStartPoints = {};
9481
9478
  list.forEach(leaf => this.dragStartPoints[leaf.innerId] = { x: leaf.x, y: leaf.y });
9482
9479
  }
9483
- getDragableList(path) {
9480
+ getDraggableList(path) {
9484
9481
  let leaf;
9485
9482
  for (let i = 0, len = path.length; i < len; i++) {
9486
9483
  leaf = path.list[i];
9487
- if ((leaf.__.draggable || leaf.__.editable) && leaf.__.hitSelf && !leaf.__.locked) {
9488
- this.dragableList = new LeafList(leaf);
9484
+ if ((leaf.draggable || leaf.editable) && leaf.hitSelf && !leaf.locked) {
9485
+ this.draggableList = new LeafList(leaf);
9489
9486
  break;
9490
9487
  }
9491
9488
  }
@@ -9510,7 +9507,7 @@ class Dragger {
9510
9507
  }
9511
9508
  dragReal() {
9512
9509
  const { running } = this.interaction;
9513
- const list = this.realDragableList;
9510
+ const list = this.realDraggableList;
9514
9511
  if (list.length && running) {
9515
9512
  const { totalX, totalY } = this.dragData;
9516
9513
  list.forEach(leaf => leaf.draggable && leaf.move(DragEvent.getValidMove(leaf, this.dragStartPoints[leaf.innerId], { x: totalX, y: totalY })));
@@ -9599,7 +9596,7 @@ class Dragger {
9599
9596
  this.interaction.emit(DragEvent.LEAVE, data, dragEnterPath);
9600
9597
  }
9601
9598
  dragReset() {
9602
- DragEvent.list = DragEvent.data = this.dragableList = this.dragData = this.downData = this.dragOverPath = this.dragEnterPath = null;
9599
+ DragEvent.list = DragEvent.data = this.draggableList = this.dragData = this.downData = this.dragOverPath = this.dragEnterPath = null;
9603
9600
  }
9604
9601
  checkDragOut(data) {
9605
9602
  const { interaction } = this;
@@ -9740,6 +9737,7 @@ const config = {
9740
9737
  touch: {
9741
9738
  preventDefault: true
9742
9739
  },
9740
+ multiTouch: {},
9743
9741
  cursor: true,
9744
9742
  keyEvent: true
9745
9743
  };
@@ -9866,6 +9864,8 @@ class InteractionBase {
9866
9864
  this.pointerUp(data);
9867
9865
  }
9868
9866
  multiTouch(data, list) {
9867
+ if (this.config.multiTouch.disabled)
9868
+ return;
9869
9869
  const { move, angle, scale, center } = MultiTouchHelper.getData(list);
9870
9870
  this.rotate(getRotateEventData(center, angle, data));
9871
9871
  this.zoom(getZoomEventData(center, scale, data));
@@ -10055,7 +10055,7 @@ class InteractionBase {
10055
10055
  data = this.hoverData;
10056
10056
  if (!data)
10057
10057
  return;
10058
- this.findPath(data, { exclude: this.dragger.getList(), name: PointerEvent.MOVE });
10058
+ this.findPath(data, { exclude: this.dragger.getList(false, true), name: PointerEvent.MOVE });
10059
10059
  this.hoverData = data;
10060
10060
  }
10061
10061
  updateCursor(data) {
@@ -10077,7 +10077,7 @@ class InteractionBase {
10077
10077
  const { path } = data;
10078
10078
  for (let i = 0, len = path.length; i < len; i++) {
10079
10079
  leaf = path.list[i];
10080
- cursor = leaf.syncEventer ? leaf.syncEventer.cursor : leaf.cursor;
10080
+ cursor = (leaf.syncEventer && leaf.syncEventer.cursor) || leaf.cursor;
10081
10081
  if (cursor)
10082
10082
  break;
10083
10083
  }
@@ -10259,7 +10259,7 @@ ui$2.__updateHitCanvas = function () {
10259
10259
  if (isHitPixel) {
10260
10260
  const { renderBounds } = this.__layout;
10261
10261
  const size = Platform.image.hitCanvasSize;
10262
- const scale = h.hitScale = tempBounds$1.set(0, 0, size, size).getFitMatrix(renderBounds, 0.5).a;
10262
+ const scale = h.hitScale = tempBounds$1.set(0, 0, size, size).getFitMatrix(renderBounds).a;
10263
10263
  const { x, y, width, height } = tempBounds$1.set(renderBounds).scale(scale);
10264
10264
  h.resize({ width, height, pixelRatio: 1 });
10265
10265
  h.clear();
@@ -10315,15 +10315,14 @@ ui$2.__hit = function (inner) {
10315
10315
  return hitWidth ? this.__hitStroke(inner, hitWidth) : false;
10316
10316
  };
10317
10317
 
10318
- const ui$1 = new UI();
10319
- const rect = Rect.prototype;
10320
- rect.__updateHitCanvas = function () {
10318
+ const ui$1 = UI.prototype, rect = Rect.prototype, box$1 = Box.prototype;
10319
+ rect.__updateHitCanvas = box$1.__updateHitCanvas = function () {
10321
10320
  if (this.stroke || this.cornerRadius || ((this.fill || this.__.__isCanvas) && this.hitFill === 'pixel') || this.hitStroke === 'all')
10322
10321
  ui$1.__updateHitCanvas.call(this);
10323
10322
  else if (this.__hitCanvas)
10324
10323
  this.__hitCanvas = null;
10325
10324
  };
10326
- rect.__hitFill = function (inner) {
10325
+ rect.__hitFill = box$1.__hitFill = function (inner) {
10327
10326
  return this.__hitCanvas ? ui$1.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
10328
10327
  };
10329
10328
 
@@ -10822,9 +10821,10 @@ function image(ui, attrName, paint, boxBounds, firstUse) {
10822
10821
  onLoadError(ui, event, image.error);
10823
10822
  }
10824
10823
  else {
10825
- ignoreRender(ui, true);
10826
- if (firstUse)
10824
+ if (firstUse) {
10825
+ ignoreRender(ui, true);
10827
10826
  onLoad(ui, event);
10827
+ }
10828
10828
  leafPaint.loadId = image.load(() => {
10829
10829
  ignoreRender(ui, false);
10830
10830
  if (!ui.destroyed) {
@@ -10972,7 +10972,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
10972
10972
  }
10973
10973
  if (allowPaint) {
10974
10974
  canvas.save();
10975
- canvas.clip();
10975
+ ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
10976
10976
  if (paint.blendMode)
10977
10977
  canvas.blendMode = paint.blendMode;
10978
10978
  if (data.opacity)
@@ -11436,11 +11436,12 @@ const { trimRight } = TextRowHelper;
11436
11436
  const { Letter, Single, Before, After, Symbol, Break } = CharType;
11437
11437
  let word, row, wordWidth, rowWidth, realWidth;
11438
11438
  let char, charWidth, startCharSize, charSize, charType, lastCharType, langBreak, afterBreak, paraStart;
11439
- let textDrawData, rows = [], bounds;
11439
+ let textDrawData, rows = [], bounds, findMaxWidth;
11440
11440
  function createRows(drawData, content, style) {
11441
11441
  textDrawData = drawData;
11442
11442
  rows = drawData.rows;
11443
11443
  bounds = drawData.bounds;
11444
+ findMaxWidth = !bounds.width && !style.autoSizeAlign;
11444
11445
  const { __letterSpacing, paraIndent, textCase } = style;
11445
11446
  const { canvas } = Platform;
11446
11447
  const { width, height } = bounds;
@@ -11525,7 +11526,10 @@ function createRows(drawData, content, style) {
11525
11526
  else {
11526
11527
  content.split('\n').forEach(content => {
11527
11528
  textDrawData.paraNumber++;
11528
- rows.push({ x: paraIndent || 0, text: content, width: canvas.measureText(content).width, paraStart: true });
11529
+ rowWidth = canvas.measureText(content).width;
11530
+ rows.push({ x: paraIndent || 0, text: content, width: rowWidth, paraStart: true });
11531
+ if (findMaxWidth)
11532
+ setMaxWidth();
11529
11533
  });
11530
11534
  }
11531
11535
  }
@@ -11556,10 +11560,16 @@ function addRow() {
11556
11560
  row.width = rowWidth;
11557
11561
  if (bounds.width)
11558
11562
  trimRight(row);
11563
+ else if (findMaxWidth)
11564
+ setMaxWidth();
11559
11565
  rows.push(row);
11560
11566
  row = { words: [] };
11561
11567
  rowWidth = 0;
11562
11568
  }
11569
+ function setMaxWidth() {
11570
+ if (rowWidth > (textDrawData.maxWidth || 0))
11571
+ textDrawData.maxWidth = rowWidth;
11572
+ }
11563
11573
 
11564
11574
  const CharMode = 0;
11565
11575
  const WordMode = 1;
@@ -11631,34 +11641,32 @@ function toChar(data, charX, rowData, isOverflow) {
11631
11641
 
11632
11642
  function layoutText(drawData, style) {
11633
11643
  const { rows, bounds } = drawData;
11634
- const { __lineHeight, __baseLine, __letterSpacing, __clipText, textAlign, verticalAlign, paraSpacing } = style;
11644
+ const { __lineHeight, __baseLine, __letterSpacing, __clipText, textAlign, verticalAlign, paraSpacing, autoSizeAlign } = style;
11635
11645
  let { x, y, width, height } = bounds, realHeight = __lineHeight * rows.length + (paraSpacing ? paraSpacing * (drawData.paraNumber - 1) : 0);
11636
11646
  let starY = __baseLine;
11637
11647
  if (__clipText && realHeight > height) {
11638
11648
  realHeight = Math.max(height, __lineHeight);
11639
11649
  drawData.overflow = rows.length;
11640
11650
  }
11641
- else {
11651
+ else if (height || autoSizeAlign) {
11642
11652
  switch (verticalAlign) {
11643
11653
  case 'middle':
11644
11654
  y += (height - realHeight) / 2;
11645
11655
  break;
11646
- case 'bottom':
11647
- y += (height - realHeight);
11656
+ case 'bottom': y += (height - realHeight);
11648
11657
  }
11649
11658
  }
11650
11659
  starY += y;
11651
- let row, rowX, rowWidth;
11660
+ let row, rowX, rowWidth, layoutWidth = (width || autoSizeAlign) ? width : drawData.maxWidth;
11652
11661
  for (let i = 0, len = rows.length; i < len; i++) {
11653
11662
  row = rows[i];
11654
11663
  row.x = x;
11655
11664
  if (row.width < width || (row.width > width && !__clipText)) {
11656
11665
  switch (textAlign) {
11657
11666
  case 'center':
11658
- row.x += (width - row.width) / 2;
11667
+ row.x += (layoutWidth - row.width) / 2;
11659
11668
  break;
11660
- case 'right':
11661
- row.x += width - row.width;
11669
+ case 'right': row.x += layoutWidth - row.width;
11662
11670
  }
11663
11671
  }
11664
11672
  if (row.paraStart && paraSpacing && i > 0)
@@ -11763,14 +11771,14 @@ function getDrawData(content, style) {
11763
11771
  let height = style.__getInput('height') || 0;
11764
11772
  const { textDecoration, __font, __padding: padding } = style;
11765
11773
  if (padding) {
11766
- if (width) {
11774
+ if (width)
11775
+ x = padding[left], width -= (padding[right] + padding[left]);
11776
+ else if (!style.autoSizeAlign)
11767
11777
  x = padding[left];
11768
- width -= (padding[right] + padding[left]);
11769
- }
11770
- if (height) {
11778
+ if (height)
11779
+ y = padding[top], height -= (padding[top] + padding[bottom]);
11780
+ else if (!style.autoSizeAlign)
11771
11781
  y = padding[top];
11772
- height -= (padding[top] + padding[bottom]);
11773
- }
11774
11782
  }
11775
11783
  const drawData = {
11776
11784
  bounds: { x, y, width, height },
@@ -11790,22 +11798,20 @@ function getDrawData(content, style) {
11790
11798
  return drawData;
11791
11799
  }
11792
11800
  function padAutoText(padding, drawData, style, width, height) {
11793
- if (!width) {
11801
+ if (!width && style.autoSizeAlign) {
11794
11802
  switch (style.textAlign) {
11795
11803
  case 'left':
11796
11804
  offsetText(drawData, 'x', padding[left]);
11797
11805
  break;
11798
- case 'right':
11799
- offsetText(drawData, 'x', -padding[right]);
11806
+ case 'right': offsetText(drawData, 'x', -padding[right]);
11800
11807
  }
11801
11808
  }
11802
- if (!height) {
11809
+ if (!height && style.autoSizeAlign) {
11803
11810
  switch (style.verticalAlign) {
11804
11811
  case 'top':
11805
11812
  offsetText(drawData, 'y', padding[top]);
11806
11813
  break;
11807
- case 'bottom':
11808
- offsetText(drawData, 'y', -padding[bottom]);
11814
+ case 'bottom': offsetText(drawData, 'y', -padding[bottom]);
11809
11815
  }
11810
11816
  }
11811
11817
  }