leafer-ui 1.8.0 → 1.9.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.
package/dist/web.cjs CHANGED
@@ -1,68 +1,76 @@
1
- 'use strict';
1
+ "use strict";
2
2
 
3
- var core = require('@leafer/core');
4
- var core$1 = require('@leafer-ui/core');
5
- var draw = require('@leafer-ui/draw');
3
+ var core = require("@leafer/core");
4
+
5
+ var core$1 = require("@leafer-ui/core");
6
+
7
+ var draw = require("@leafer-ui/draw");
8
+
9
+ const debug$2 = core.Debug.get("LeaferCanvas");
6
10
 
7
- const debug$2 = core.Debug.get('LeaferCanvas');
8
11
  class LeaferCanvas extends core.LeaferCanvasBase {
9
12
  set zIndex(zIndex) {
10
- const { style } = this.view;
13
+ const {style: style} = this.view;
11
14
  style.zIndex = zIndex;
12
15
  this.setAbsolute(this.view);
13
16
  }
14
17
  set childIndex(index) {
15
- const { view, parentView } = this;
18
+ const {view: view, parentView: parentView} = this;
16
19
  if (view && parentView) {
17
20
  const beforeNode = parentView.children[index];
18
21
  if (beforeNode) {
19
22
  this.setAbsolute(beforeNode);
20
23
  parentView.insertBefore(view, beforeNode);
21
- }
22
- else {
24
+ } else {
23
25
  parentView.appendChild(beforeNode);
24
26
  }
25
27
  }
26
28
  }
27
29
  init() {
28
- const { config } = this;
30
+ const {config: config} = this;
29
31
  const view = config.view || config.canvas;
30
32
  view ? this.__createViewFrom(view) : this.__createView();
31
- const { style } = this.view;
32
- style.display || (style.display = 'block');
33
+ const {style: style} = this.view;
34
+ style.display || (style.display = "block");
33
35
  this.parentView = this.view.parentElement;
34
36
  if (this.parentView) {
35
37
  const pStyle = this.parentView.style;
36
- pStyle.webkitUserSelect = pStyle.userSelect = 'none';
38
+ pStyle.webkitUserSelect = pStyle.userSelect = "none";
37
39
  }
38
40
  if (core.Platform.syncDomFont && !this.parentView) {
39
- style.display = 'none';
41
+ style.display = "none";
40
42
  document.body.appendChild(this.view);
41
43
  }
42
44
  this.__createContext();
43
- if (!this.autoLayout)
44
- this.resize(config);
45
+ if (!this.autoLayout) this.resize(config);
46
+ }
47
+ set backgroundColor(color) {
48
+ this.view.style.backgroundColor = color;
49
+ }
50
+ get backgroundColor() {
51
+ return this.view.style.backgroundColor;
52
+ }
53
+ set hittable(hittable) {
54
+ this.view.style.pointerEvents = hittable ? "auto" : "none";
55
+ }
56
+ get hittable() {
57
+ return this.view.style.pointerEvents !== "none";
45
58
  }
46
- set backgroundColor(color) { this.view.style.backgroundColor = color; }
47
- get backgroundColor() { return this.view.style.backgroundColor; }
48
- set hittable(hittable) { this.view.style.pointerEvents = hittable ? 'auto' : 'none'; }
49
- get hittable() { return this.view.style.pointerEvents !== 'none'; }
50
59
  __createView() {
51
- this.view = document.createElement('canvas');
60
+ this.view = document.createElement("canvas");
52
61
  }
53
62
  __createViewFrom(inputView) {
54
- let find = (typeof inputView === 'string') ? document.getElementById(inputView) : inputView;
63
+ let find = core.isString(inputView) ? document.getElementById(inputView) : inputView;
55
64
  if (find) {
56
65
  if (find instanceof HTMLCanvasElement) {
57
66
  this.view = find;
58
- }
59
- else {
67
+ } else {
60
68
  let parent = find;
61
69
  if (find === window || find === document) {
62
- const div = document.createElement('div');
63
- const { style } = div;
64
- style.position = 'absolute';
65
- style.top = style.bottom = style.left = style.right = '0px';
70
+ const div = document.createElement("div");
71
+ const {style: style} = div;
72
+ style.position = "absolute";
73
+ style.top = style.bottom = style.left = style.right = "0px";
66
74
  document.body.appendChild(div);
67
75
  parent = div;
68
76
  }
@@ -70,103 +78,101 @@ class LeaferCanvas extends core.LeaferCanvasBase {
70
78
  const view = this.view;
71
79
  if (parent.hasChildNodes()) {
72
80
  this.setAbsolute(view);
73
- parent.style.position || (parent.style.position = 'relative');
81
+ parent.style.position || (parent.style.position = "relative");
74
82
  }
75
83
  parent.appendChild(view);
76
84
  }
77
- }
78
- else {
85
+ } else {
79
86
  debug$2.error(`no id: ${inputView}`);
80
87
  this.__createView();
81
88
  }
82
89
  }
83
90
  setAbsolute(view) {
84
- const { style } = view;
85
- style.position = 'absolute';
86
- style.top = style.left = '0px';
91
+ const {style: style} = view;
92
+ style.position = "absolute";
93
+ style.top = style.left = "0px";
87
94
  }
88
95
  updateViewSize() {
89
- const { width, height, pixelRatio } = this;
90
- const { style } = this.view;
91
- style.width = width + 'px';
92
- style.height = height + 'px';
96
+ const {width: width, height: height, pixelRatio: pixelRatio} = this;
97
+ const {style: style} = this.view;
98
+ style.width = width + "px";
99
+ style.height = height + "px";
93
100
  this.view.width = Math.ceil(width * pixelRatio);
94
101
  this.view.height = Math.ceil(height * pixelRatio);
95
102
  }
96
103
  updateClientBounds() {
97
- if (this.view.parentElement)
98
- this.clientBounds = this.view.getBoundingClientRect();
104
+ if (this.view.parentElement) this.clientBounds = this.view.getBoundingClientRect();
99
105
  }
100
106
  startAutoLayout(autoBounds, listener) {
101
107
  this.resizeListener = listener;
102
108
  if (autoBounds) {
103
109
  this.autoBounds = autoBounds;
104
110
  try {
105
- this.resizeObserver = new ResizeObserver((entries) => {
111
+ this.resizeObserver = new ResizeObserver(entries => {
106
112
  this.updateClientBounds();
107
- for (const entry of entries)
108
- this.checkAutoBounds(entry.contentRect);
113
+ for (const entry of entries) this.checkAutoBounds(entry.contentRect);
109
114
  });
110
115
  const parent = this.parentView;
111
116
  if (parent) {
112
117
  this.resizeObserver.observe(parent);
113
118
  this.checkAutoBounds(parent.getBoundingClientRect());
114
- }
115
- else {
119
+ } else {
116
120
  this.checkAutoBounds(this.view);
117
- debug$2.warn('no parent');
121
+ debug$2.warn("no parent");
118
122
  }
119
- }
120
- catch (_a) {
123
+ } catch (_a) {
121
124
  this.imitateResizeObserver();
122
125
  }
123
- }
124
- else {
125
- window.addEventListener('resize', this.windowListener = () => {
126
+ } else {
127
+ window.addEventListener("resize", this.windowListener = () => {
126
128
  const pixelRatio = core.Platform.devicePixelRatio;
127
129
  if (!this.config.pixelRatio && this.pixelRatio !== pixelRatio) {
128
- const { width, height } = this;
129
- this.emitResize({ width, height, pixelRatio });
130
+ const {width: width, height: height} = this;
131
+ this.emitResize({
132
+ width: width,
133
+ height: height,
134
+ pixelRatio: pixelRatio
135
+ });
130
136
  }
131
137
  });
132
138
  }
133
139
  }
134
140
  imitateResizeObserver() {
135
141
  if (this.autoLayout) {
136
- if (this.parentView)
137
- this.checkAutoBounds(this.parentView.getBoundingClientRect());
142
+ if (this.parentView) this.checkAutoBounds(this.parentView.getBoundingClientRect());
138
143
  core.Platform.requestRender(this.imitateResizeObserver.bind(this));
139
144
  }
140
145
  }
141
146
  checkAutoBounds(parentSize) {
142
147
  const view = this.view;
143
- const { x, y, width, height } = this.autoBounds.getBoundsFrom(parentSize);
144
- const size = { width, height, pixelRatio: this.config.pixelRatio ? this.pixelRatio : core.Platform.devicePixelRatio };
148
+ const {x: x, y: y, width: width, height: height} = this.autoBounds.getBoundsFrom(parentSize);
149
+ const size = {
150
+ width: width,
151
+ height: height,
152
+ pixelRatio: this.config.pixelRatio ? this.pixelRatio : core.Platform.devicePixelRatio
153
+ };
145
154
  if (!this.isSameSize(size)) {
146
- const { style } = view;
147
- style.marginLeft = x + 'px';
148
- style.marginTop = y + 'px';
155
+ const {style: style} = view;
156
+ style.marginLeft = x + "px";
157
+ style.marginTop = y + "px";
149
158
  this.emitResize(size);
150
159
  }
151
160
  }
152
161
  stopAutoLayout() {
153
162
  this.autoLayout = false;
154
- if (this.resizeObserver)
155
- this.resizeObserver.disconnect();
163
+ if (this.resizeObserver) this.resizeObserver.disconnect();
156
164
  this.resizeListener = this.resizeObserver = null;
157
165
  }
158
166
  emitResize(size) {
159
167
  const oldSize = {};
160
168
  core.DataHelper.copyAttrs(oldSize, this, core.canvasSizeAttrs);
161
169
  this.resize(size);
162
- if (this.resizeListener && this.width !== undefined)
163
- this.resizeListener(new core.ResizeEvent(size, oldSize));
170
+ if (this.resizeListener && !core.isUndefined(this.width)) this.resizeListener(new core.ResizeEvent(size, oldSize));
164
171
  }
165
172
  unrealCanvas() {
166
173
  if (!this.unreal && this.parentView) {
167
174
  const view = this.view;
168
- if (view)
169
- view.remove();
175
+ if (view) view.remove();
170
176
  this.view = this.parentView;
171
177
  this.unreal = true;
172
178
  }
@@ -175,13 +181,12 @@ class LeaferCanvas extends core.LeaferCanvasBase {
175
181
  if (this.view) {
176
182
  this.stopAutoLayout();
177
183
  if (this.windowListener) {
178
- window.removeEventListener('resize', this.windowListener);
184
+ window.removeEventListener("resize", this.windowListener);
179
185
  this.windowListener = null;
180
186
  }
181
187
  if (!this.unreal) {
182
188
  const view = this.view;
183
- if (view.parentElement)
184
- view.remove();
189
+ if (view.parentElement) view.remove();
185
190
  }
186
191
  super.destroy();
187
192
  }
@@ -189,33 +194,36 @@ class LeaferCanvas extends core.LeaferCanvasBase {
189
194
  }
190
195
 
191
196
  core.canvasPatch(CanvasRenderingContext2D.prototype);
197
+
192
198
  core.canvasPatch(Path2D.prototype);
193
199
 
194
- const { mineType, fileType } = core.FileHelper;
200
+ const {mineType: mineType, fileType: fileType} = core.FileHelper;
201
+
195
202
  Object.assign(core.Creator, {
196
203
  canvas: (options, manager) => new LeaferCanvas(options, manager),
197
- image: (options) => new core.LeaferImage(options)
204
+ image: options => new core.LeaferImage(options)
198
205
  });
206
+
199
207
  function useCanvas(_canvasType, _power) {
200
208
  core.Platform.origin = {
201
209
  createCanvas(width, height) {
202
- const canvas = document.createElement('canvas');
210
+ const canvas = document.createElement("canvas");
203
211
  canvas.width = width;
204
212
  canvas.height = height;
205
213
  return canvas;
206
214
  },
207
215
  canvasToDataURL: (canvas, type, quality) => {
208
216
  const imageType = mineType(type), url = canvas.toDataURL(imageType, quality);
209
- return imageType === 'image/bmp' ? url.replace('image/png;', 'image/bmp;') : url;
217
+ return imageType === "image/bmp" ? url.replace("image/png;", "image/bmp;") : url;
210
218
  },
211
- canvasToBolb: (canvas, type, quality) => new Promise((resolve) => canvas.toBlob(resolve, mineType(type), quality)),
219
+ canvasToBolb: (canvas, type, quality) => new Promise(resolve => canvas.toBlob(resolve, mineType(type), quality)),
212
220
  canvasSaveAs: (canvas, filename, quality) => {
213
221
  const url = canvas.toDataURL(mineType(fileType(filename)), quality);
214
222
  return core.Platform.origin.download(url, filename);
215
223
  },
216
224
  download(url, filename) {
217
- return new Promise((resolve) => {
218
- let el = document.createElement('a');
225
+ return new Promise(resolve => {
226
+ let el = document.createElement("a");
219
227
  el.href = url;
220
228
  el.download = filename;
221
229
  document.body.appendChild(el);
@@ -226,78 +234,98 @@ function useCanvas(_canvasType, _power) {
226
234
  },
227
235
  loadImage(src) {
228
236
  return new Promise((resolve, reject) => {
229
- const img = new core.Platform.origin.Image();
230
- const { crossOrigin } = core.Platform.image;
237
+ const img = new core.Platform.origin.Image;
238
+ const {crossOrigin: crossOrigin} = core.Platform.image;
231
239
  if (crossOrigin) {
232
- img.setAttribute('crossOrigin', crossOrigin);
240
+ img.setAttribute("crossOrigin", crossOrigin);
233
241
  img.crossOrigin = crossOrigin;
234
242
  }
235
- img.onload = () => { resolve(img); };
236
- img.onerror = (e) => { reject(e); };
243
+ img.onload = () => {
244
+ resolve(img);
245
+ };
246
+ img.onerror = e => {
247
+ reject(e);
248
+ };
237
249
  img.src = core.Platform.image.getRealURL(src);
238
250
  });
239
251
  },
240
- Image,
241
- PointerEvent,
242
- DragEvent
252
+ Image: Image,
253
+ PointerEvent: PointerEvent,
254
+ DragEvent: DragEvent
243
255
  };
244
256
  core.Platform.event = {
245
- stopDefault(origin) { origin.preventDefault(); },
246
- stopNow(origin) { origin.stopImmediatePropagation(); },
247
- stop(origin) { origin.stopPropagation(); }
257
+ stopDefault(origin) {
258
+ origin.preventDefault();
259
+ },
260
+ stopNow(origin) {
261
+ origin.stopImmediatePropagation();
262
+ },
263
+ stop(origin) {
264
+ origin.stopPropagation();
265
+ }
248
266
  };
249
267
  core.Platform.canvas = core.Creator.canvas();
250
268
  core.Platform.conicGradientSupport = !!core.Platform.canvas.context.createConicGradient;
251
269
  }
252
- core.Platform.name = 'web';
253
- core.Platform.isMobile = 'ontouchstart' in window;
254
- core.Platform.requestRender = function (render) { window.requestAnimationFrame(render); };
255
- core.defineKey(core.Platform, 'devicePixelRatio', { get() { return devicePixelRatio; } });
256
- const { userAgent } = navigator;
270
+
271
+ core.Platform.name = "web";
272
+
273
+ core.Platform.isMobile = "ontouchstart" in window;
274
+
275
+ core.Platform.requestRender = function(render) {
276
+ window.requestAnimationFrame(render);
277
+ };
278
+
279
+ core.defineKey(core.Platform, "devicePixelRatio", {
280
+ get() {
281
+ return devicePixelRatio;
282
+ }
283
+ });
284
+
285
+ const {userAgent: userAgent} = navigator;
286
+
257
287
  if (userAgent.indexOf("Firefox") > -1) {
258
288
  core.Platform.conicGradientRotate90 = true;
259
289
  core.Platform.intWheelDeltaY = true;
260
290
  core.Platform.syncDomFont = true;
261
- }
262
- else if (userAgent.indexOf("AppleWebKit") > -1) {
291
+ } else if (/iPhone|iPad|iPod/.test(navigator.userAgent) || /Macintosh/.test(navigator.userAgent) && /Version\/[\d.]+.*Safari/.test(navigator.userAgent)) {
263
292
  core.Platform.fullImageShadow = true;
264
293
  }
265
- if (userAgent.indexOf('Windows') > -1) {
266
- core.Platform.os = 'Windows';
294
+
295
+ if (userAgent.indexOf("Windows") > -1) {
296
+ core.Platform.os = "Windows";
267
297
  core.Platform.intWheelDeltaY = true;
268
- }
269
- else if (userAgent.indexOf('Mac') > -1) {
270
- core.Platform.os = 'Mac';
271
- }
272
- else if (userAgent.indexOf('Linux') > -1) {
273
- core.Platform.os = 'Linux';
298
+ } else if (userAgent.indexOf("Mac") > -1) {
299
+ core.Platform.os = "Mac";
300
+ } else if (userAgent.indexOf("Linux") > -1) {
301
+ core.Platform.os = "Linux";
274
302
  }
275
303
 
276
304
  class Watcher {
277
- get childrenChanged() { return this.hasAdd || this.hasRemove || this.hasVisible; }
305
+ get childrenChanged() {
306
+ return this.hasAdd || this.hasRemove || this.hasVisible;
307
+ }
278
308
  get updatedList() {
279
309
  if (this.hasRemove) {
280
- const updatedList = new core.LeafList();
281
- this.__updatedList.list.forEach(item => { if (item.leafer)
282
- updatedList.add(item); });
310
+ const updatedList = new core.LeafList;
311
+ this.__updatedList.list.forEach(item => {
312
+ if (item.leafer) updatedList.add(item);
313
+ });
283
314
  return updatedList;
284
- }
285
- else {
315
+ } else {
286
316
  return this.__updatedList;
287
317
  }
288
318
  }
289
319
  constructor(target, userConfig) {
290
320
  this.totalTimes = 0;
291
321
  this.config = {};
292
- this.__updatedList = new core.LeafList();
322
+ this.__updatedList = new core.LeafList;
293
323
  this.target = target;
294
- if (userConfig)
295
- this.config = core.DataHelper.default(userConfig, this.config);
324
+ if (userConfig) this.config = core.DataHelper.default(userConfig, this.config);
296
325
  this.__listenEvents();
297
326
  }
298
327
  start() {
299
- if (this.disabled)
300
- return;
328
+ if (this.disabled) return;
301
329
  this.running = true;
302
330
  }
303
331
  stop() {
@@ -310,8 +338,7 @@ class Watcher {
310
338
  }
311
339
  update() {
312
340
  this.changed = true;
313
- if (this.running)
314
- this.target.emit(core.RenderEvent.REQUEST);
341
+ if (this.running) this.target.emit(core.RenderEvent.REQUEST);
315
342
  }
316
343
  __onAttrChange(event) {
317
344
  this.__updatedList.add(event.target);
@@ -321,8 +348,7 @@ class Watcher {
321
348
  if (event.type === core.ChildEvent.ADD) {
322
349
  this.hasAdd = true;
323
350
  this.__pushChild(event.child);
324
- }
325
- else {
351
+ } else {
326
352
  this.hasRemove = true;
327
353
  this.__updatedList.add(event.parent);
328
354
  }
@@ -330,28 +356,22 @@ class Watcher {
330
356
  }
331
357
  __pushChild(child) {
332
358
  this.__updatedList.add(child);
333
- if (child.isBranch)
334
- this.__loopChildren(child);
359
+ if (child.isBranch) this.__loopChildren(child);
335
360
  }
336
361
  __loopChildren(parent) {
337
- const { children } = parent;
338
- for (let i = 0, len = children.length; i < len; i++)
339
- this.__pushChild(children[i]);
362
+ const {children: children} = parent;
363
+ for (let i = 0, len = children.length; i < len; i++) this.__pushChild(children[i]);
340
364
  }
341
365
  __onRquestData() {
342
- this.target.emitEvent(new core.WatchEvent(core.WatchEvent.DATA, { updatedList: this.updatedList }));
343
- this.__updatedList = new core.LeafList();
366
+ this.target.emitEvent(new core.WatchEvent(core.WatchEvent.DATA, {
367
+ updatedList: this.updatedList
368
+ }));
369
+ this.__updatedList = new core.LeafList;
344
370
  this.totalTimes++;
345
371
  this.changed = this.hasVisible = this.hasRemove = this.hasAdd = false;
346
372
  }
347
373
  __listenEvents() {
348
- this.__eventIds = [
349
- this.target.on_([
350
- [core.PropertyEvent.CHANGE, this.__onAttrChange, this],
351
- [[core.ChildEvent.ADD, core.ChildEvent.REMOVE], this.__onChildEvent, this],
352
- [core.WatchEvent.REQUEST, this.__onRquestData, this]
353
- ])
354
- ];
374
+ this.__eventIds = [ this.target.on_([ [ core.PropertyEvent.CHANGE, this.__onAttrChange, this ], [ [ core.ChildEvent.ADD, core.ChildEvent.REMOVE ], this.__onChildEvent, this ], [ core.WatchEvent.REQUEST, this.__onRquestData, this ] ]) ];
355
375
  }
356
376
  __removeListenEvents() {
357
377
  this.target.off_(this.__eventIds);
@@ -365,8 +385,10 @@ class Watcher {
365
385
  }
366
386
  }
367
387
 
368
- const { updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, updateChange: updateOneChange } = core.LeafHelper;
369
- const { pushAllChildBranch, pushAllParent } = core.BranchHelper;
388
+ const {updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, updateChange: updateOneChange} = core.LeafHelper;
389
+
390
+ const {pushAllChildBranch: pushAllChildBranch, pushAllParent: pushAllParent} = core.BranchHelper;
391
+
370
392
  function updateMatrix(updateList, levelList) {
371
393
  let layout;
372
394
  updateList.list.forEach(leaf => {
@@ -375,19 +397,17 @@ function updateMatrix(updateList, levelList) {
375
397
  if (layout.matrixChanged) {
376
398
  updateAllMatrix$1(leaf, true);
377
399
  levelList.add(leaf);
378
- if (leaf.isBranch)
379
- pushAllChildBranch(leaf, levelList);
400
+ if (leaf.isBranch) pushAllChildBranch(leaf, levelList);
380
401
  pushAllParent(leaf, levelList);
381
- }
382
- else if (layout.boundsChanged) {
402
+ } else if (layout.boundsChanged) {
383
403
  levelList.add(leaf);
384
- if (leaf.isBranch)
385
- leaf.__tempNumber = 0;
404
+ if (leaf.isBranch) leaf.__tempNumber = 0;
386
405
  pushAllParent(leaf, levelList);
387
406
  }
388
407
  }
389
408
  });
390
409
  }
410
+
391
411
  function updateBounds(boundsList) {
392
412
  let list, branch, children;
393
413
  boundsList.sort(true);
@@ -407,18 +427,19 @@ function updateBounds(boundsList) {
407
427
  }
408
428
  });
409
429
  }
430
+
410
431
  function updateChange(updateList) {
411
432
  updateList.list.forEach(updateOneChange);
412
433
  }
413
434
 
414
- const { worldBounds } = core.LeafBoundsHelper;
435
+ const {worldBounds: worldBounds} = core.LeafBoundsHelper;
436
+
415
437
  class LayoutBlockData {
416
438
  constructor(list) {
417
- this.updatedBounds = new core.Bounds();
418
- this.beforeBounds = new core.Bounds();
419
- this.afterBounds = new core.Bounds();
420
- if (list instanceof Array)
421
- list = new core.LeafList(list);
439
+ this.updatedBounds = new core.Bounds;
440
+ this.beforeBounds = new core.Bounds;
441
+ this.afterBounds = new core.Bounds;
442
+ if (core.isArray(list)) list = new core.LeafList(list);
422
443
  this.updatedList = list;
423
444
  }
424
445
  setBefore() {
@@ -426,7 +447,7 @@ class LayoutBlockData {
426
447
  }
427
448
  setAfter() {
428
449
  this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
429
- this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
450
+ this.updatedBounds.setList([ this.beforeBounds, this.afterBounds ]);
430
451
  }
431
452
  merge(data) {
432
453
  this.updatedList.addList(data.updatedList.list);
@@ -439,21 +460,21 @@ class LayoutBlockData {
439
460
  }
440
461
  }
441
462
 
442
- const { updateAllMatrix, updateAllChange } = core.LeafHelper;
443
- const debug$1 = core.Debug.get('Layouter');
463
+ const {updateAllMatrix: updateAllMatrix, updateAllChange: updateAllChange} = core.LeafHelper;
464
+
465
+ const debug$1 = core.Debug.get("Layouter");
466
+
444
467
  class Layouter {
445
468
  constructor(target, userConfig) {
446
469
  this.totalTimes = 0;
447
470
  this.config = {};
448
- this.__levelList = new core.LeafLevelList();
471
+ this.__levelList = new core.LeafLevelList;
449
472
  this.target = target;
450
- if (userConfig)
451
- this.config = core.DataHelper.default(userConfig, this.config);
473
+ if (userConfig) this.config = core.DataHelper.default(userConfig, this.config);
452
474
  this.__listenEvents();
453
475
  }
454
476
  start() {
455
- if (this.disabled)
456
- return;
477
+ if (this.disabled) return;
457
478
  this.running = true;
458
479
  }
459
480
  stop() {
@@ -465,16 +486,14 @@ class Layouter {
465
486
  this.disabled = true;
466
487
  }
467
488
  layout() {
468
- if (this.layouting || !this.running)
469
- return;
470
- const { target } = this;
489
+ if (this.layouting || !this.running) return;
490
+ const {target: target} = this;
471
491
  this.times = 0;
472
492
  try {
473
493
  target.emit(core.LayoutEvent.START);
474
494
  this.layoutOnce();
475
495
  target.emitEvent(new core.LayoutEvent(core.LayoutEvent.END, this.layoutedBlocks, this.times));
476
- }
477
- catch (e) {
496
+ } catch (e) {
478
497
  debug$1.error(e);
479
498
  }
480
499
  this.layoutedBlocks = null;
@@ -482,24 +501,20 @@ class Layouter {
482
501
  layoutAgain() {
483
502
  if (this.layouting) {
484
503
  this.waitAgain = true;
485
- }
486
- else {
504
+ } else {
487
505
  this.layoutOnce();
488
506
  }
489
507
  }
490
508
  layoutOnce() {
491
- if (this.layouting)
492
- return debug$1.warn('layouting');
493
- if (this.times > 3)
494
- return debug$1.warn('layout max times');
509
+ if (this.layouting) return debug$1.warn("layouting");
510
+ if (this.times > 3) return debug$1.warn("layout max times");
495
511
  this.times++;
496
512
  this.totalTimes++;
497
513
  this.layouting = true;
498
514
  this.target.emit(core.WatchEvent.REQUEST);
499
515
  if (this.totalTimes > 1) {
500
516
  this.partLayout();
501
- }
502
- else {
517
+ } else {
503
518
  this.fullLayout();
504
519
  }
505
520
  this.layouting = false;
@@ -510,11 +525,10 @@ class Layouter {
510
525
  }
511
526
  partLayout() {
512
527
  var _a;
513
- if (!((_a = this.__updatedList) === null || _a === void 0 ? void 0 : _a.length))
514
- return;
515
- const t = core.Run.start('PartLayout');
516
- const { target, __updatedList: updateList } = this;
517
- const { BEFORE, LAYOUT, AFTER } = core.LayoutEvent;
528
+ if (!((_a = this.__updatedList) === null || _a === void 0 ? void 0 : _a.length)) return;
529
+ const t = core.Run.start("PartLayout");
530
+ const {target: target, __updatedList: updateList} = this;
531
+ const {BEFORE: BEFORE, LAYOUT: LAYOUT, AFTER: AFTER} = core.LayoutEvent;
518
532
  const blocks = this.getBlocks(updateList);
519
533
  blocks.forEach(item => item.setBefore());
520
534
  target.emitEvent(new core.LayoutEvent(BEFORE, blocks, this.times));
@@ -523,8 +537,7 @@ class Layouter {
523
537
  updateMatrix(updateList, this.__levelList);
524
538
  updateBounds(this.__levelList);
525
539
  updateChange(updateList);
526
- if (this.extraBlock)
527
- blocks.push(this.extraBlock);
540
+ if (this.extraBlock) blocks.push(this.extraBlock);
528
541
  blocks.forEach(item => item.setAfter());
529
542
  target.emitEvent(new core.LayoutEvent(LAYOUT, blocks, this.times));
530
543
  target.emitEvent(new core.LayoutEvent(AFTER, blocks, this.times));
@@ -534,13 +547,15 @@ class Layouter {
534
547
  core.Run.end(t);
535
548
  }
536
549
  fullLayout() {
537
- const t = core.Run.start('FullLayout');
538
- const { target } = this;
539
- const { BEFORE, LAYOUT, AFTER } = core.LayoutEvent;
550
+ const t = core.Run.start("FullLayout");
551
+ const {target: target} = this;
552
+ const {BEFORE: BEFORE, LAYOUT: LAYOUT, AFTER: AFTER} = core.LayoutEvent;
540
553
  const blocks = this.getBlocks(new core.LeafList(target));
541
554
  target.emitEvent(new core.LayoutEvent(BEFORE, blocks, this.times));
542
555
  Layouter.fullLayout(target);
543
- blocks.forEach(item => { item.setAfter(); });
556
+ blocks.forEach(item => {
557
+ item.setAfter();
558
+ });
544
559
  target.emitEvent(new core.LayoutEvent(LAYOUT, blocks, this.times));
545
560
  target.emitEvent(new core.LayoutEvent(AFTER, blocks, this.times));
546
561
  this.addBlocks(blocks);
@@ -548,15 +563,12 @@ class Layouter {
548
563
  }
549
564
  static fullLayout(target) {
550
565
  updateAllMatrix(target, true);
551
- if (target.isBranch)
552
- core.BranchHelper.updateBounds(target);
553
- else
554
- core.LeafHelper.updateBounds(target);
566
+ if (target.isBranch) core.BranchHelper.updateBounds(target); else core.LeafHelper.updateBounds(target);
555
567
  updateAllChange(target);
556
568
  }
557
569
  addExtra(leaf) {
558
570
  if (!this.__updatedList.has(leaf)) {
559
- const { updatedList, beforeBounds } = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
571
+ const {updatedList: updatedList, beforeBounds: beforeBounds} = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
560
572
  updatedList.length ? beforeBounds.add(leaf.__world) : beforeBounds.set(leaf.__world);
561
573
  updatedList.add(leaf);
562
574
  }
@@ -565,7 +577,7 @@ class Layouter {
565
577
  return new LayoutBlockData(data);
566
578
  }
567
579
  getBlocks(list) {
568
- return [this.createBlock(list)];
580
+ return [ this.createBlock(list) ];
569
581
  }
570
582
  addBlocks(current) {
571
583
  this.layoutedBlocks ? this.layoutedBlocks.push(...current) : this.layoutedBlocks = current;
@@ -574,13 +586,7 @@ class Layouter {
574
586
  this.__updatedList = event.data.updatedList;
575
587
  }
576
588
  __listenEvents() {
577
- this.__eventIds = [
578
- this.target.on_([
579
- [core.LayoutEvent.REQUEST, this.layout, this],
580
- [core.LayoutEvent.AGAIN, this.layoutAgain, this],
581
- [core.WatchEvent.DATA, this.__onReceiveWatchData, this]
582
- ])
583
- ];
589
+ this.__eventIds = [ this.target.on_([ [ core.LayoutEvent.REQUEST, this.layout, this ], [ core.LayoutEvent.AGAIN, this.layoutAgain, this ], [ core.WatchEvent.DATA, this.__onReceiveWatchData, this ] ]) ];
584
590
  }
585
591
  __removeListenEvents() {
586
592
  this.target.off_(this.__eventIds);
@@ -594,9 +600,12 @@ class Layouter {
594
600
  }
595
601
  }
596
602
 
597
- const debug = core.Debug.get('Renderer');
603
+ const debug = core.Debug.get("Renderer");
604
+
598
605
  class Renderer {
599
- get needFill() { return !!(!this.canvas.allowBackgroundColor && this.config.fill); }
606
+ get needFill() {
607
+ return !!(!this.canvas.allowBackgroundColor && this.config.fill);
608
+ }
600
609
  constructor(target, canvas, userConfig) {
601
610
  this.FPS = 60;
602
611
  this.totalTimes = 0;
@@ -607,8 +616,7 @@ class Renderer {
607
616
  };
608
617
  this.target = target;
609
618
  this.canvas = canvas;
610
- if (userConfig)
611
- this.config = core.DataHelper.default(userConfig, this.config);
619
+ if (userConfig) this.config = core.DataHelper.default(userConfig, this.config);
612
620
  this.__listenEvents();
613
621
  }
614
622
  start() {
@@ -619,8 +627,7 @@ class Renderer {
619
627
  this.running = false;
620
628
  }
621
629
  update(change = true) {
622
- if (!this.changed)
623
- this.changed = change;
630
+ if (!this.changed) this.changed = change;
624
631
  this.__requestRender();
625
632
  }
626
633
  requestLayout() {
@@ -628,7 +635,7 @@ class Renderer {
628
635
  }
629
636
  checkRender() {
630
637
  if (this.running) {
631
- const { target } = this;
638
+ const {target: target} = this;
632
639
  if (target.isApp) {
633
640
  target.emit(core.RenderEvent.CHILD_START, target);
634
641
  target.children.forEach(leafer => {
@@ -637,54 +644,47 @@ class Renderer {
637
644
  });
638
645
  target.emit(core.RenderEvent.CHILD_END, target);
639
646
  }
640
- if (this.changed && this.canvas.view)
641
- this.render();
647
+ if (this.changed && this.canvas.view) this.render();
642
648
  this.target.emit(core.RenderEvent.NEXT);
643
649
  }
644
650
  }
645
651
  render(callback) {
646
- if (!(this.running && this.canvas.view))
647
- return this.update();
648
- const { target } = this;
652
+ if (!(this.running && this.canvas.view)) return this.update();
653
+ const {target: target} = this;
649
654
  this.times = 0;
650
- this.totalBounds = new core.Bounds();
651
- debug.log(target.innerName, '--->');
655
+ this.totalBounds = new core.Bounds;
656
+ debug.log(target.innerName, "---\x3e");
652
657
  try {
653
658
  this.emitRender(core.RenderEvent.START);
654
659
  this.renderOnce(callback);
655
660
  this.emitRender(core.RenderEvent.END, this.totalBounds);
656
661
  core.ImageManager.clearRecycled();
657
- }
658
- catch (e) {
662
+ } catch (e) {
659
663
  this.rendering = false;
660
664
  debug.error(e);
661
665
  }
662
- debug.log('-------------|');
666
+ debug.log("-------------|");
663
667
  }
664
668
  renderAgain() {
665
669
  if (this.rendering) {
666
670
  this.waitAgain = true;
667
- }
668
- else {
671
+ } else {
669
672
  this.renderOnce();
670
673
  }
671
674
  }
672
675
  renderOnce(callback) {
673
- if (this.rendering)
674
- return debug.warn('rendering');
675
- if (this.times > 3)
676
- return debug.warn('render max times');
676
+ if (this.rendering) return debug.warn("rendering");
677
+ if (this.times > 3) return debug.warn("render max times");
677
678
  this.times++;
678
679
  this.totalTimes++;
679
680
  this.rendering = true;
680
681
  this.changed = false;
681
- this.renderBounds = new core.Bounds();
682
+ this.renderBounds = new core.Bounds;
682
683
  this.renderOptions = {};
683
684
  if (callback) {
684
685
  this.emitRender(core.RenderEvent.BEFORE);
685
686
  callback();
686
- }
687
- else {
687
+ } else {
688
688
  this.requestLayout();
689
689
  if (this.ignore) {
690
690
  this.ignore = this.rendering = false;
@@ -693,8 +693,7 @@ class Renderer {
693
693
  this.emitRender(core.RenderEvent.BEFORE);
694
694
  if (this.config.usePartRender && this.totalTimes > 1) {
695
695
  this.partRender();
696
- }
697
- else {
696
+ } else {
698
697
  this.fullRender();
699
698
  }
700
699
  }
@@ -708,16 +707,16 @@ class Renderer {
708
707
  }
709
708
  }
710
709
  partRender() {
711
- const { canvas, updateBlocks: list } = this;
712
- if (!list)
713
- return;
710
+ const {canvas: canvas, updateBlocks: list} = this;
711
+ if (!list) return;
714
712
  this.mergeBlocks();
715
- list.forEach(block => { if (canvas.bounds.hit(block) && !block.isEmpty())
716
- this.clipRender(block); });
713
+ list.forEach(block => {
714
+ if (canvas.bounds.hit(block) && !block.isEmpty()) this.clipRender(block);
715
+ });
717
716
  }
718
717
  clipRender(block) {
719
- const t = core.Run.start('PartRender');
720
- const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
718
+ const t = core.Run.start("PartRender");
719
+ const {canvas: canvas} = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
721
720
  canvas.save();
722
721
  bounds.spread(Renderer.clipSpread).ceil();
723
722
  canvas.clearWorld(bounds, true);
@@ -727,8 +726,8 @@ class Renderer {
727
726
  core.Run.end(t);
728
727
  }
729
728
  fullRender() {
730
- const t = core.Run.start('FullRender');
731
- const { canvas } = this;
729
+ const t = core.Run.start("FullRender");
730
+ const {canvas: canvas} = this;
732
731
  canvas.save();
733
732
  canvas.clear();
734
733
  this.__render(canvas.bounds);
@@ -736,11 +735,14 @@ class Renderer {
736
735
  core.Run.end(t);
737
736
  }
738
737
  __render(bounds, realBounds) {
739
- const { canvas } = this, includes = bounds.includes(this.target.__world), options = includes ? { includes } : { bounds, includes };
740
- if (this.needFill)
741
- canvas.fillWorld(bounds, this.config.fill);
742
- if (core.Debug.showRepaint)
743
- core.Debug.drawRepaint(canvas, bounds);
738
+ const {canvas: canvas} = this, includes = bounds.includes(this.target.__world), options = includes ? {
739
+ includes: includes
740
+ } : {
741
+ bounds: bounds,
742
+ includes: includes
743
+ };
744
+ if (this.needFill) canvas.fillWorld(bounds, this.config.fill);
745
+ if (core.Debug.showRepaint) core.Debug.drawRepaint(canvas, bounds);
744
746
  this.target.__render(canvas, options);
745
747
  this.renderBounds = realBounds = realBounds || bounds;
746
748
  this.renderOptions = options;
@@ -748,14 +750,13 @@ class Renderer {
748
750
  canvas.updateRender(realBounds);
749
751
  }
750
752
  addBlock(block) {
751
- if (!this.updateBlocks)
752
- this.updateBlocks = [];
753
+ if (!this.updateBlocks) this.updateBlocks = [];
753
754
  this.updateBlocks.push(block);
754
755
  }
755
756
  mergeBlocks() {
756
- const { updateBlocks: list } = this;
757
+ const {updateBlocks: list} = this;
757
758
  if (list) {
758
- const bounds = new core.Bounds();
759
+ const bounds = new core.Bounds;
759
760
  bounds.setList(list);
760
761
  list.length = 0;
761
762
  list.push(bounds);
@@ -763,26 +764,23 @@ class Renderer {
763
764
  }
764
765
  __requestRender() {
765
766
  const target = this.target;
766
- if (this.requestTime || !target)
767
- return;
768
- if (target.parentApp)
769
- return target.parentApp.requestRender(false);
767
+ if (this.requestTime || !target) return;
768
+ if (target.parentApp) return target.parentApp.requestRender(false);
770
769
  const requestTime = this.requestTime = Date.now();
771
770
  core.Platform.requestRender(() => {
772
- this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
771
+ this.FPS = Math.min(60, Math.ceil(1e3 / (Date.now() - requestTime)));
773
772
  this.requestTime = 0;
774
773
  this.checkRender();
775
774
  });
776
775
  }
777
776
  __onResize(e) {
778
- if (this.canvas.unreal)
779
- return;
777
+ if (this.canvas.unreal) return;
780
778
  if (e.bigger || !e.samePixelRatio) {
781
- const { width, height } = e.old;
779
+ const {width: width, height: height} = e.old;
782
780
  const bounds = new core.Bounds(0, 0, width, height);
783
781
  if (!bounds.includes(this.target.__world) || this.needFill || !e.samePixelRatio) {
784
782
  this.addBlock(this.canvas.bounds);
785
- this.target.forceUpdate('surface');
783
+ this.target.forceUpdate("surface");
786
784
  return;
787
785
  }
788
786
  }
@@ -790,34 +788,24 @@ class Renderer {
790
788
  this.update();
791
789
  }
792
790
  __onLayoutEnd(event) {
793
- if (event.data)
794
- event.data.map(item => {
795
- let empty;
796
- if (item.updatedList)
797
- item.updatedList.list.some(leaf => {
798
- empty = (!leaf.__world.width || !leaf.__world.height);
799
- if (empty) {
800
- if (!leaf.isLeafer)
801
- debug.tip(leaf.innerName, ': empty');
802
- empty = (!leaf.isBranch || leaf.isBranchLeaf);
803
- }
804
- return empty;
805
- });
806
- this.addBlock(empty ? this.canvas.bounds : item.updatedBounds);
791
+ if (event.data) event.data.map(item => {
792
+ let empty;
793
+ if (item.updatedList) item.updatedList.list.some(leaf => {
794
+ empty = !leaf.__world.width || !leaf.__world.height;
795
+ if (empty) {
796
+ if (!leaf.isLeafer) debug.tip(leaf.innerName, ": empty");
797
+ empty = !leaf.isBranch || leaf.isBranchLeaf;
798
+ }
799
+ return empty;
807
800
  });
801
+ this.addBlock(empty ? this.canvas.bounds : item.updatedBounds);
802
+ });
808
803
  }
809
804
  emitRender(type, bounds, options) {
810
805
  this.target.emitEvent(new core.RenderEvent(type, this.times, bounds, options));
811
806
  }
812
807
  __listenEvents() {
813
- this.__eventIds = [
814
- this.target.on_([
815
- [core.RenderEvent.REQUEST, this.update, this],
816
- [core.LayoutEvent.END, this.__onLayoutEnd, this],
817
- [core.RenderEvent.AGAIN, this.renderAgain, this],
818
- [core.ResizeEvent.RESIZE, this.__onResize, this]
819
- ])
820
- ];
808
+ this.__eventIds = [ this.target.on_([ [ core.RenderEvent.REQUEST, this.update, this ], [ core.LayoutEvent.END, this.__onLayoutEnd, this ], [ core.RenderEvent.AGAIN, this.renderAgain, this ], [ core.ResizeEvent.RESIZE, this.__onResize, this ] ]) ];
821
809
  }
822
810
  __removeListenEvents() {
823
811
  this.target.off_(this.__eventIds);
@@ -830,82 +818,104 @@ class Renderer {
830
818
  }
831
819
  }
832
820
  }
821
+
833
822
  Renderer.clipSpread = 10;
834
823
 
835
- const { hitRadiusPoint } = core.BoundsHelper;
824
+ const {hitRadiusPoint: hitRadiusPoint} = core.BoundsHelper;
825
+
836
826
  class Picker {
837
827
  constructor(target, selector) {
838
828
  this.target = target;
839
829
  this.selector = selector;
840
830
  }
841
831
  getByPoint(hitPoint, hitRadius, options) {
842
- if (!hitRadius)
843
- hitRadius = 0;
844
- if (!options)
845
- options = {};
832
+ if (!hitRadius) hitRadius = 0;
833
+ if (!options) options = {};
846
834
  const through = options.through || false;
847
835
  const ignoreHittable = options.ignoreHittable || false;
848
836
  const target = options.target || this.target;
849
837
  this.exclude = options.exclude || null;
850
- this.point = { x: hitPoint.x, y: hitPoint.y, radiusX: hitRadius, radiusY: hitRadius };
838
+ this.point = {
839
+ x: hitPoint.x,
840
+ y: hitPoint.y,
841
+ radiusX: hitRadius,
842
+ radiusY: hitRadius
843
+ };
851
844
  this.findList = new core.LeafList(options.findList);
852
- if (!options.findList)
853
- this.hitBranch(target);
854
- const { list } = this.findList;
845
+ if (!options.findList) this.hitBranch(target.isBranchLeaf ? {
846
+ children: [ target ]
847
+ } : target);
848
+ const {list: list} = this.findList;
855
849
  const leaf = this.getBestMatchLeaf(list, options.bottomList, ignoreHittable);
856
850
  const path = ignoreHittable ? this.getPath(leaf) : this.getHitablePath(leaf);
857
851
  this.clear();
858
- return through ? { path, target: leaf, throughPath: list.length ? this.getThroughPath(list) : path } : { path, target: leaf };
852
+ return through ? {
853
+ path: path,
854
+ target: leaf,
855
+ throughPath: list.length ? this.getThroughPath(list) : path
856
+ } : {
857
+ path: path,
858
+ target: leaf
859
+ };
860
+ }
861
+ hitPoint(hitPoint, hitRadius, options) {
862
+ return !!this.getByPoint(hitPoint, hitRadius, options).target;
859
863
  }
860
864
  getBestMatchLeaf(list, bottomList, ignoreHittable) {
865
+ const findList = this.findList = new core.LeafList;
861
866
  if (list.length) {
862
867
  let find;
863
- this.findList = new core.LeafList();
864
- const { x, y } = this.point;
865
- const point = { x, y, radiusX: 0, radiusY: 0 };
868
+ const {x: x, y: y} = this.point;
869
+ const point = {
870
+ x: x,
871
+ y: y,
872
+ radiusX: 0,
873
+ radiusY: 0
874
+ };
866
875
  for (let i = 0, len = list.length; i < len; i++) {
867
876
  find = list[i];
868
877
  if (ignoreHittable || core.LeafHelper.worldHittable(find)) {
869
878
  this.hitChild(find, point);
870
- if (this.findList.length)
871
- return this.findList.list[0];
879
+ if (findList.length) {
880
+ if (find.isBranchLeaf && list.some(item => item !== find && core.LeafHelper.hasParent(item, find))) {
881
+ findList.reset();
882
+ break;
883
+ }
884
+ return findList.list[0];
885
+ }
872
886
  }
873
887
  }
874
888
  }
875
889
  if (bottomList) {
876
890
  for (let i = 0, len = bottomList.length; i < len; i++) {
877
891
  this.hitChild(bottomList[i].target, this.point, bottomList[i].proxy);
878
- if (this.findList.length)
879
- return this.findList.list[0];
892
+ if (findList.length) return findList.list[0];
880
893
  }
881
894
  }
882
- return list[0];
895
+ return ignoreHittable ? list[0] : list.find(item => core.LeafHelper.worldHittable(item));
883
896
  }
884
897
  getPath(leaf) {
885
- const path = new core.LeafList();
898
+ const path = new core.LeafList;
886
899
  while (leaf) {
887
900
  path.add(leaf);
888
901
  leaf = leaf.parent;
889
902
  }
890
- if (this.target)
891
- path.add(this.target);
903
+ if (this.target) path.add(this.target);
892
904
  return path;
893
905
  }
894
906
  getHitablePath(leaf) {
895
907
  const path = this.getPath(leaf && leaf.hittable ? leaf : null);
896
- let item, hittablePath = new core.LeafList();
908
+ let item, hittablePath = new core.LeafList;
897
909
  for (let i = path.list.length - 1; i > -1; i--) {
898
910
  item = path.list[i];
899
- if (!item.__.hittable)
900
- break;
911
+ if (!item.__.hittable) break;
901
912
  hittablePath.addAt(item, 0);
902
- if (!item.__.hitChildren)
903
- break;
913
+ if (!item.__.hitChildren) break;
904
914
  }
905
915
  return hittablePath;
906
916
  }
907
917
  getThroughPath(list) {
908
- const throughPath = new core.LeafList();
918
+ const throughPath = new core.LeafList;
909
919
  const pathList = [];
910
920
  for (let i = list.length - 1; i > -1; i--) {
911
921
  pathList.push(this.getPath(list[i]));
@@ -915,8 +925,7 @@ class Picker {
915
925
  path = pathList[i], nextPath = pathList[i + 1];
916
926
  for (let j = 0, jLen = path.length; j < jLen; j++) {
917
927
  leaf = path.list[j];
918
- if (nextPath && nextPath.has(leaf))
919
- break;
928
+ if (nextPath && nextPath.has(leaf)) break;
920
929
  throughPath.add(leaf);
921
930
  }
922
931
  }
@@ -927,32 +936,37 @@ class Picker {
927
936
  }
928
937
  eachFind(children, hitMask) {
929
938
  let child, hit;
930
- const { point } = this, len = children.length;
939
+ const {point: point} = this, len = children.length;
931
940
  for (let i = len - 1; i > -1; i--) {
932
941
  child = children[i];
933
- if (!child.__.visible || (hitMask && !child.__.mask))
934
- continue;
942
+ if (!child.__.visible || hitMask && !child.__.mask) continue;
935
943
  hit = child.__.hitRadius ? true : hitRadiusPoint(child.__world, point);
936
944
  if (child.isBranch) {
937
945
  if (hit || child.__ignoreHitWorld) {
938
946
  this.eachFind(child.children, child.__onlyHitMask);
939
- if (child.isBranchLeaf)
940
- this.hitChild(child, point);
947
+ if (child.isBranchLeaf) this.hitChild(child, point);
941
948
  }
942
- }
943
- else {
944
- if (hit)
945
- this.hitChild(child, point);
949
+ } else {
950
+ if (hit) this.hitChild(child, point);
946
951
  }
947
952
  }
948
953
  }
949
954
  hitChild(child, point, proxy) {
950
- if (this.exclude && this.exclude.has(child))
951
- return;
955
+ if (this.exclude && this.exclude.has(child)) return;
952
956
  if (child.__hitWorld(point)) {
953
- const { parent } = child;
954
- if (parent && parent.__hasMask && !child.__.mask && !parent.children.some(item => item.__.mask && item.__hitWorld(point)))
955
- return;
957
+ const {parent: parent} = child;
958
+ if (parent && parent.__hasMask && !child.__.mask) {
959
+ let findMasks = [], item;
960
+ const {children: children} = parent;
961
+ for (let i = 0, len = children.length; i < len; i++) {
962
+ item = children[i];
963
+ if (item.__.mask) findMasks.push(item);
964
+ if (item === child) {
965
+ if (findMasks && !findMasks.every(value => value.__hitWorld(point))) return;
966
+ break;
967
+ }
968
+ }
969
+ }
956
970
  this.findList.add(proxy || child);
957
971
  }
958
972
  }
@@ -969,24 +983,24 @@ class Picker {
969
983
  class Selector {
970
984
  constructor(target, userConfig) {
971
985
  this.config = {};
972
- if (userConfig)
973
- this.config = core.DataHelper.default(userConfig, this.config);
986
+ if (userConfig) this.config = core.DataHelper.default(userConfig, this.config);
974
987
  this.picker = new Picker(this.target = target, this);
975
988
  this.finder = core.Creator.finder && core.Creator.finder();
976
989
  }
977
990
  getByPoint(hitPoint, hitRadius, options) {
978
- const { target, picker } = this;
979
- if (core.Platform.backgrounder)
980
- target && target.updateLayout();
991
+ const {target: target, picker: picker} = this;
992
+ if (core.Platform.backgrounder) target && target.updateLayout();
981
993
  return picker.getByPoint(hitPoint, hitRadius, options);
982
994
  }
995
+ hitPoint(hitPoint, hitRadius, options) {
996
+ return this.picker.hitPoint(hitPoint, hitRadius, options);
997
+ }
983
998
  getBy(condition, branch, one, options) {
984
- return this.finder ? this.finder.getBy(condition, branch, one, options) : core.Plugin.need('find');
999
+ return this.finder ? this.finder.getBy(condition, branch, one, options) : core.Plugin.need("find");
985
1000
  }
986
1001
  destroy() {
987
1002
  this.picker.destroy();
988
- if (this.finder)
989
- this.finder.destroy();
1003
+ if (this.finder) this.finder.destroy();
990
1004
  }
991
1005
  }
992
1006
 
@@ -996,13 +1010,21 @@ Object.assign(core.Creator, {
996
1010
  renderer: (target, canvas, options) => new Renderer(target, canvas, options),
997
1011
  selector: (target, options) => new Selector(target, options)
998
1012
  });
1013
+
999
1014
  core.Platform.layout = Layouter.fullLayout;
1000
1015
 
1001
1016
  const PointerEventHelper = {
1002
1017
  convert(e, local) {
1003
1018
  const base = core$1.InteractionHelper.getBase(e);
1004
- const data = Object.assign(Object.assign({}, base), { x: local.x, y: local.y, width: e.width, height: e.height, pointerType: e.pointerType, pressure: e.pressure });
1005
- if (data.pointerType === 'pen') {
1019
+ const data = Object.assign(Object.assign({}, base), {
1020
+ x: local.x,
1021
+ y: local.y,
1022
+ width: e.width,
1023
+ height: e.height,
1024
+ pointerType: e.pointerType,
1025
+ pressure: e.pressure
1026
+ });
1027
+ if (data.pointerType === "pen") {
1006
1028
  data.tangentialPressure = e.tangentialPressure;
1007
1029
  data.tiltX = e.tiltX;
1008
1030
  data.tiltY = e.tiltY;
@@ -1012,12 +1034,27 @@ const PointerEventHelper = {
1012
1034
  },
1013
1035
  convertMouse(e, local) {
1014
1036
  const base = core$1.InteractionHelper.getBase(e);
1015
- return Object.assign(Object.assign({}, base), { x: local.x, y: local.y, width: 1, height: 1, pointerType: 'mouse', pressure: 0.5 });
1037
+ return Object.assign(Object.assign({}, base), {
1038
+ x: local.x,
1039
+ y: local.y,
1040
+ width: 1,
1041
+ height: 1,
1042
+ pointerType: "mouse",
1043
+ pressure: .5
1044
+ });
1016
1045
  },
1017
1046
  convertTouch(e, local) {
1018
1047
  const touch = PointerEventHelper.getTouch(e);
1019
1048
  const base = core$1.InteractionHelper.getBase(e);
1020
- return Object.assign(Object.assign({}, base), { x: local.x, y: local.y, width: 1, height: 1, pointerType: 'touch', multiTouch: e.touches.length > 1, pressure: touch.force });
1049
+ return Object.assign(Object.assign({}, base), {
1050
+ x: local.x,
1051
+ y: local.y,
1052
+ width: 1,
1053
+ height: 1,
1054
+ pointerType: "touch",
1055
+ multiTouch: e.touches.length > 1,
1056
+ pressure: touch.force
1057
+ });
1021
1058
  },
1022
1059
  getTouch(e) {
1023
1060
  return e.targetTouches[0] || e.changedTouches[0];
@@ -1027,44 +1064,56 @@ const PointerEventHelper = {
1027
1064
  const KeyEventHelper = {
1028
1065
  convert(e) {
1029
1066
  const base = core$1.InteractionHelper.getBase(e);
1030
- const data = Object.assign(Object.assign({}, base), { code: e.code, key: e.key });
1067
+ const data = Object.assign(Object.assign({}, base), {
1068
+ code: e.code,
1069
+ key: e.key
1070
+ });
1031
1071
  return data;
1032
1072
  }
1033
1073
  };
1034
1074
 
1035
- const { pathCanDrag } = core$1.InteractionHelper;
1075
+ const {pathCanDrag: pathCanDrag} = core$1.InteractionHelper;
1076
+
1036
1077
  class Interaction extends core$1.InteractionBase {
1037
- get notPointer() { const { p } = this; return p.type !== 'pointer' || p.touch || this.useMultiTouch; }
1038
- get notTouch() { const { p } = this; return p.type === 'mouse' || this.usePointer; }
1039
- get notMouse() { return this.usePointer || this.useTouch; }
1078
+ get notPointer() {
1079
+ const {p: p} = this;
1080
+ return p.type !== "pointer" || p.touch || this.useMultiTouch;
1081
+ }
1082
+ get notTouch() {
1083
+ const {p: p} = this;
1084
+ return p.type === "mouse" || this.usePointer;
1085
+ }
1086
+ get notMouse() {
1087
+ return this.usePointer || this.useTouch;
1088
+ }
1040
1089
  __listenEvents() {
1041
1090
  super.__listenEvents();
1042
1091
  const view = this.view = this.canvas.view;
1043
1092
  this.viewEvents = {
1044
- 'pointerdown': this.onPointerDown,
1045
- 'mousedown': this.onMouseDown,
1046
- 'touchstart': this.onTouchStart,
1047
- 'pointerleave': this.onPointerLeave,
1048
- 'contextmenu': this.onContextMenu,
1049
- 'wheel': this.onWheel,
1050
- 'gesturestart': this.onGesturestart,
1051
- 'gesturechange': this.onGesturechange,
1052
- 'gestureend': this.onGestureend
1093
+ pointerdown: this.onPointerDown,
1094
+ mousedown: this.onMouseDown,
1095
+ touchstart: this.onTouchStart,
1096
+ pointerleave: this.onPointerLeave,
1097
+ contextmenu: this.onContextMenu,
1098
+ wheel: this.onWheel,
1099
+ gesturestart: this.onGesturestart,
1100
+ gesturechange: this.onGesturechange,
1101
+ gestureend: this.onGestureend
1053
1102
  };
1054
1103
  this.windowEvents = {
1055
- 'pointermove': this.onPointerMove,
1056
- 'pointerup': this.onPointerUp,
1057
- 'pointercancel': this.onPointerCancel,
1058
- 'mousemove': this.onMouseMove,
1059
- 'mouseup': this.onMouseUp,
1060
- 'touchmove': this.onTouchMove,
1061
- 'touchend': this.onTouchEnd,
1062
- 'touchcancel': this.onTouchCancel,
1063
- 'keydown': this.onKeyDown,
1064
- 'keyup': this.onKeyUp,
1065
- 'scroll': this.onScroll
1104
+ pointermove: this.onPointerMove,
1105
+ pointerup: this.onPointerUp,
1106
+ pointercancel: this.onPointerCancel,
1107
+ mousemove: this.onMouseMove,
1108
+ mouseup: this.onMouseUp,
1109
+ touchmove: this.onTouchMove,
1110
+ touchend: this.onTouchEnd,
1111
+ touchcancel: this.onTouchCancel,
1112
+ keydown: this.onKeyDown,
1113
+ keyup: this.onKeyUp,
1114
+ scroll: this.onScroll
1066
1115
  };
1067
- const { viewEvents, windowEvents } = this;
1116
+ const {viewEvents: viewEvents, windowEvents: windowEvents} = this;
1068
1117
  for (let name in viewEvents) {
1069
1118
  viewEvents[name] = viewEvents[name].bind(this);
1070
1119
  view.addEventListener(name, viewEvents[name]);
@@ -1076,7 +1125,7 @@ class Interaction extends core$1.InteractionBase {
1076
1125
  }
1077
1126
  __removeListenEvents() {
1078
1127
  super.__removeListenEvents();
1079
- const { viewEvents, windowEvents } = this;
1128
+ const {viewEvents: viewEvents, windowEvents: windowEvents} = this;
1080
1129
  for (let name in viewEvents) {
1081
1130
  this.view.removeEventListener(name, viewEvents[name]);
1082
1131
  this.viewEvents = {};
@@ -1094,14 +1143,12 @@ class Interaction extends core$1.InteractionBase {
1094
1143
  return list;
1095
1144
  }
1096
1145
  preventDefaultPointer(e) {
1097
- const { pointer } = this.config;
1098
- if (pointer.preventDefault)
1099
- e.preventDefault();
1146
+ const {pointer: pointer} = this.config;
1147
+ if (pointer.preventDefault) e.preventDefault();
1100
1148
  }
1101
1149
  preventDefaultWheel(e) {
1102
- const { wheel } = this.config;
1103
- if (wheel.preventDefault)
1104
- e.preventDefault();
1150
+ const {wheel: wheel} = this.config;
1151
+ if (wheel.preventDefault) e.preventDefault();
1105
1152
  }
1106
1153
  preventWindowPointer(e) {
1107
1154
  return !this.downData && e.target !== this.view;
@@ -1113,8 +1160,7 @@ class Interaction extends core$1.InteractionBase {
1113
1160
  this.keyUp(KeyEventHelper.convert(e));
1114
1161
  }
1115
1162
  onContextMenu(e) {
1116
- if (this.config.pointer.preventDefaultMenu)
1117
- e.preventDefault();
1163
+ if (this.config.pointer.preventDefaultMenu) e.preventDefault();
1118
1164
  this.menu(PointerEventHelper.convert(e, this.getLocal(e)));
1119
1165
  }
1120
1166
  onScroll() {
@@ -1122,14 +1168,12 @@ class Interaction extends core$1.InteractionBase {
1122
1168
  }
1123
1169
  onPointerDown(e) {
1124
1170
  this.preventDefaultPointer(e);
1125
- if (this.notPointer)
1126
- return;
1171
+ if (this.notPointer) return;
1127
1172
  this.usePointer || (this.usePointer = true);
1128
1173
  this.pointerDown(PointerEventHelper.convert(e, this.getLocal(e)));
1129
1174
  }
1130
1175
  onPointerMove(e, isLeave) {
1131
- if (this.notPointer || this.preventWindowPointer(e))
1132
- return;
1176
+ if (this.notPointer || this.preventWindowPointer(e)) return;
1133
1177
  this.usePointer || (this.usePointer = true);
1134
1178
  const data = PointerEventHelper.convert(e, this.getLocal(e, true));
1135
1179
  isLeave ? this.pointerHover(data) : this.pointerMove(data);
@@ -1138,49 +1182,39 @@ class Interaction extends core$1.InteractionBase {
1138
1182
  this.onPointerMove(e, true);
1139
1183
  }
1140
1184
  onPointerUp(e) {
1141
- if (this.downData)
1142
- this.preventDefaultPointer(e);
1143
- if (this.notPointer || this.preventWindowPointer(e))
1144
- return;
1185
+ if (this.downData) this.preventDefaultPointer(e);
1186
+ if (this.notPointer || this.preventWindowPointer(e)) return;
1145
1187
  this.pointerUp(PointerEventHelper.convert(e, this.getLocal(e)));
1146
1188
  }
1147
1189
  onPointerCancel() {
1148
- if (this.useMultiTouch)
1149
- return;
1190
+ if (this.useMultiTouch) return;
1150
1191
  this.pointerCancel();
1151
1192
  }
1152
1193
  onMouseDown(e) {
1153
1194
  this.preventDefaultPointer(e);
1154
- if (this.notMouse)
1155
- return;
1195
+ if (this.notMouse) return;
1156
1196
  this.pointerDown(PointerEventHelper.convertMouse(e, this.getLocal(e)));
1157
1197
  }
1158
1198
  onMouseMove(e) {
1159
- if (this.notMouse || this.preventWindowPointer(e))
1160
- return;
1199
+ if (this.notMouse || this.preventWindowPointer(e)) return;
1161
1200
  this.pointerMove(PointerEventHelper.convertMouse(e, this.getLocal(e, true)));
1162
1201
  }
1163
1202
  onMouseUp(e) {
1164
- if (this.downData)
1165
- this.preventDefaultPointer(e);
1166
- if (this.notMouse || this.preventWindowPointer(e))
1167
- return;
1203
+ if (this.downData) this.preventDefaultPointer(e);
1204
+ if (this.notMouse || this.preventWindowPointer(e)) return;
1168
1205
  this.pointerUp(PointerEventHelper.convertMouse(e, this.getLocal(e)));
1169
1206
  }
1170
1207
  onMouseCancel() {
1171
- if (this.notMouse)
1172
- return;
1208
+ if (this.notMouse) return;
1173
1209
  this.pointerCancel();
1174
1210
  }
1175
1211
  onTouchStart(e) {
1176
1212
  const touch = PointerEventHelper.getTouch(e);
1177
1213
  const local = this.getLocal(touch, true);
1178
- const { preventDefault } = this.config.touch;
1179
- if (preventDefault === true || (preventDefault === 'auto' && pathCanDrag(this.findPath(local))))
1180
- e.preventDefault();
1214
+ const {preventDefault: preventDefault} = this.config.touch;
1215
+ if (preventDefault === true || preventDefault === "auto" && pathCanDrag(this.findPath(local))) e.preventDefault();
1181
1216
  this.multiTouchStart(e);
1182
- if (this.notTouch)
1183
- return;
1217
+ if (this.notTouch) return;
1184
1218
  if (this.touchTimer) {
1185
1219
  window.clearTimeout(this.touchTimer);
1186
1220
  this.touchTimer = 0;
@@ -1190,17 +1224,14 @@ class Interaction extends core$1.InteractionBase {
1190
1224
  }
1191
1225
  onTouchMove(e) {
1192
1226
  this.multiTouchMove(e);
1193
- if (this.notTouch || this.preventWindowPointer(e))
1194
- return;
1227
+ if (this.notTouch || this.preventWindowPointer(e)) return;
1195
1228
  const touch = PointerEventHelper.getTouch(e);
1196
1229
  this.pointerMove(PointerEventHelper.convertTouch(e, this.getLocal(touch)));
1197
1230
  }
1198
1231
  onTouchEnd(e) {
1199
1232
  this.multiTouchEnd();
1200
- if (this.notTouch || this.preventWindowPointer(e))
1201
- return;
1202
- if (this.touchTimer)
1203
- clearTimeout(this.touchTimer);
1233
+ if (this.notTouch || this.preventWindowPointer(e)) return;
1234
+ if (this.touchTimer) clearTimeout(this.touchTimer);
1204
1235
  this.touchTimer = setTimeout(() => {
1205
1236
  this.useTouch = false;
1206
1237
  }, 500);
@@ -1208,19 +1239,16 @@ class Interaction extends core$1.InteractionBase {
1208
1239
  this.pointerUp(PointerEventHelper.convertTouch(e, this.getLocal(touch)));
1209
1240
  }
1210
1241
  onTouchCancel() {
1211
- if (this.notTouch)
1212
- return;
1242
+ if (this.notTouch) return;
1213
1243
  this.pointerCancel();
1214
1244
  }
1215
1245
  multiTouchStart(e) {
1216
- this.useMultiTouch = (e.touches.length > 1);
1246
+ this.useMultiTouch = e.touches.length > 1;
1217
1247
  this.touches = this.useMultiTouch ? this.getTouches(e.touches) : undefined;
1218
- if (this.useMultiTouch)
1219
- this.pointerCancel();
1248
+ if (this.useMultiTouch) this.pointerCancel();
1220
1249
  }
1221
1250
  multiTouchMove(e) {
1222
- if (!this.useMultiTouch)
1223
- return;
1251
+ if (!this.useMultiTouch) return;
1224
1252
  if (e.touches.length > 1) {
1225
1253
  const touches = this.getTouches(e.touches);
1226
1254
  const list = this.getKeepTouchList(this.touches, touches);
@@ -1240,8 +1268,10 @@ class Interaction extends core$1.InteractionBase {
1240
1268
  const list = [];
1241
1269
  old.forEach(from => {
1242
1270
  to = touches.find(touch => touch.identifier === from.identifier);
1243
- if (to)
1244
- list.push({ from: this.getLocal(from), to: this.getLocal(to) });
1271
+ if (to) list.push({
1272
+ from: this.getLocal(from),
1273
+ to: this.getLocal(to)
1274
+ });
1245
1275
  });
1246
1276
  return list;
1247
1277
  }
@@ -1250,31 +1280,35 @@ class Interaction extends core$1.InteractionBase {
1250
1280
  }
1251
1281
  onWheel(e) {
1252
1282
  this.preventDefaultWheel(e);
1253
- this.wheel(Object.assign(Object.assign(Object.assign({}, core$1.InteractionHelper.getBase(e)), this.getLocal(e)), { deltaX: e.deltaX, deltaY: e.deltaY }));
1283
+ this.wheel(Object.assign(Object.assign(Object.assign({}, core$1.InteractionHelper.getBase(e)), this.getLocal(e)), {
1284
+ deltaX: e.deltaX,
1285
+ deltaY: e.deltaY
1286
+ }));
1254
1287
  }
1255
1288
  onGesturestart(e) {
1256
- if (this.useMultiTouch)
1257
- return;
1289
+ if (this.useMultiTouch) return;
1258
1290
  this.preventDefaultWheel(e);
1259
1291
  this.lastGestureScale = 1;
1260
1292
  this.lastGestureRotation = 0;
1261
1293
  }
1262
1294
  onGesturechange(e) {
1263
- if (this.useMultiTouch)
1264
- return;
1295
+ if (this.useMultiTouch) return;
1265
1296
  this.preventDefaultWheel(e);
1266
1297
  const eventBase = core$1.InteractionHelper.getBase(e);
1267
1298
  Object.assign(eventBase, this.getLocal(e));
1268
- const scale = (e.scale / this.lastGestureScale);
1269
- const rotation = (e.rotation - this.lastGestureRotation) / Math.PI * 180 * (core.MathHelper.within(this.config.wheel.rotateSpeed, 0, 1) / 4 + 0.1);
1270
- this.zoom(Object.assign(Object.assign({}, eventBase), { scale: scale * scale }));
1271
- this.rotate(Object.assign(Object.assign({}, eventBase), { rotation }));
1299
+ const scale = e.scale / this.lastGestureScale;
1300
+ const rotation = (e.rotation - this.lastGestureRotation) / Math.PI * 180 * (core.MathHelper.within(this.config.wheel.rotateSpeed, 0, 1) / 4 + .1);
1301
+ this.zoom(Object.assign(Object.assign({}, eventBase), {
1302
+ scale: scale * scale
1303
+ }));
1304
+ this.rotate(Object.assign(Object.assign({}, eventBase), {
1305
+ rotation: rotation
1306
+ }));
1272
1307
  this.lastGestureScale = e.scale;
1273
1308
  this.lastGestureRotation = e.rotation;
1274
1309
  }
1275
1310
  onGestureend(e) {
1276
- if (this.useMultiTouch)
1277
- return;
1311
+ if (this.useMultiTouch) return;
1278
1312
  this.preventDefaultWheel(e);
1279
1313
  this.transformEnd();
1280
1314
  }
@@ -1282,21 +1316,18 @@ class Interaction extends core$1.InteractionBase {
1282
1316
  super.setCursor(cursor);
1283
1317
  const list = [];
1284
1318
  this.eachCursor(cursor, list);
1285
- if (typeof list[list.length - 1] === 'object')
1286
- list.push('default');
1287
- this.canvas.view.style.cursor = list.map(item => (typeof item === 'object') ? `url(${item.url}) ${item.x || 0} ${item.y || 0}` : item).join(',');
1319
+ if (core.isObject(list[list.length - 1])) list.push("default");
1320
+ this.canvas.view.style.cursor = list.map(item => core.isObject(item) ? `url(${item.url}) ${item.x || 0} ${item.y || 0}` : item).join(",");
1288
1321
  }
1289
1322
  eachCursor(cursor, list, level = 0) {
1290
1323
  level++;
1291
- if (cursor instanceof Array) {
1324
+ if (core.isArray(cursor)) {
1292
1325
  cursor.forEach(item => this.eachCursor(item, list, level));
1293
- }
1294
- else {
1295
- const custom = typeof cursor === 'string' && core$1.Cursor.get(cursor);
1326
+ } else {
1327
+ const custom = core.isString(cursor) && core$1.Cursor.get(cursor);
1296
1328
  if (custom && level < 2) {
1297
1329
  this.eachCursor(custom, list, level);
1298
- }
1299
- else {
1330
+ } else {
1300
1331
  list.push(cursor);
1301
1332
  }
1302
1333
  }
@@ -1311,21 +1342,18 @@ class Interaction extends core$1.InteractionBase {
1311
1342
  }
1312
1343
 
1313
1344
  function fillText(ui, canvas) {
1314
- const data = ui.__, { rows, decorationY } = data.__textDrawData;
1315
- if (data.__isPlacehold && data.placeholderColor)
1316
- canvas.fillStyle = data.placeholderColor;
1345
+ const data = ui.__, {rows: rows, decorationY: decorationY} = data.__textDrawData;
1346
+ if (data.__isPlacehold && data.placeholderColor) canvas.fillStyle = data.placeholderColor;
1317
1347
  let row;
1318
1348
  for (let i = 0, len = rows.length; i < len; i++) {
1319
1349
  row = rows[i];
1320
- if (row.text)
1321
- canvas.fillText(row.text, row.x, row.y);
1322
- else if (row.data)
1323
- row.data.forEach(charData => { canvas.fillText(charData.char, charData.x, row.y); });
1350
+ if (row.text) canvas.fillText(row.text, row.x, row.y); else if (row.data) row.data.forEach(charData => {
1351
+ canvas.fillText(charData.char, charData.x, row.y);
1352
+ });
1324
1353
  }
1325
1354
  if (decorationY) {
1326
- const { decorationColor, decorationHeight } = data.__textDrawData;
1327
- if (decorationColor)
1328
- canvas.fillStyle = decorationColor;
1355
+ const {decorationColor: decorationColor, decorationHeight: decorationHeight} = data.__textDrawData;
1356
+ if (decorationColor) canvas.fillStyle = decorationColor;
1329
1357
  rows.forEach(row => decorationY.forEach(value => canvas.fillRect(row.x, row.y + value, row.width, decorationHeight)));
1330
1358
  }
1331
1359
  }
@@ -1334,117 +1362,112 @@ function fill(fill, ui, canvas) {
1334
1362
  canvas.fillStyle = fill;
1335
1363
  fillPathOrText(ui, canvas);
1336
1364
  }
1365
+
1337
1366
  function fills(fills, ui, canvas) {
1338
1367
  let item;
1339
1368
  for (let i = 0, len = fills.length; i < len; i++) {
1340
1369
  item = fills[i];
1341
1370
  if (item.image) {
1342
- if (draw.PaintImage.checkImage(ui, canvas, item, !ui.__.__font))
1343
- continue;
1371
+ if (draw.PaintImage.checkImage(ui, canvas, item, !ui.__.__font)) continue;
1344
1372
  if (!item.style) {
1345
- if (!i && item.image.isPlacehold)
1346
- ui.drawImagePlaceholder(canvas, item.image);
1373
+ if (!i && item.image.isPlacehold) ui.drawImagePlaceholder(canvas, item.image);
1347
1374
  continue;
1348
1375
  }
1349
1376
  }
1350
1377
  canvas.fillStyle = item.style;
1351
1378
  if (item.transform || item.scaleFixed) {
1352
1379
  canvas.save();
1353
- if (item.transform)
1354
- canvas.transform(item.transform);
1380
+ if (item.transform) canvas.transform(item.transform);
1355
1381
  if (item.scaleFixed) {
1356
- const { scaleX, scaleY } = ui.getRenderScaleData(true);
1357
- canvas.scale(1 / scaleX, 1 / scaleY);
1382
+ const {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true);
1383
+ if (item.scaleFixed === true || item.scaleFixed === "zoom-in" && scaleX > 1 && scaleY > 1) canvas.scale(1 / scaleX, 1 / scaleY);
1358
1384
  }
1359
- if (item.blendMode)
1360
- canvas.blendMode = item.blendMode;
1385
+ if (item.blendMode) canvas.blendMode = item.blendMode;
1361
1386
  fillPathOrText(ui, canvas);
1362
1387
  canvas.restore();
1363
- }
1364
- else {
1388
+ } else {
1365
1389
  if (item.blendMode) {
1366
1390
  canvas.saveBlendMode(item.blendMode);
1367
1391
  fillPathOrText(ui, canvas);
1368
1392
  canvas.restoreBlendMode();
1369
- }
1370
- else
1371
- fillPathOrText(ui, canvas);
1393
+ } else fillPathOrText(ui, canvas);
1372
1394
  }
1373
1395
  }
1374
1396
  }
1397
+
1375
1398
  function fillPathOrText(ui, canvas) {
1376
- ui.__.__font ? fillText(ui, canvas) : (ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill());
1399
+ ui.__.__font ? fillText(ui, canvas) : ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill();
1377
1400
  }
1378
1401
 
1379
1402
  function strokeText(stroke, ui, canvas) {
1380
1403
  switch (ui.__.strokeAlign) {
1381
- case 'center':
1382
- drawCenter$1(stroke, 1, ui, canvas);
1383
- break;
1384
- case 'inside':
1385
- drawAlign(stroke, 'inside', ui, canvas);
1386
- break;
1387
- case 'outside':
1388
- ui.__.__fillAfterStroke ? drawCenter$1(stroke, 2, ui, canvas) : drawAlign(stroke, 'outside', ui, canvas);
1389
- break;
1404
+ case "center":
1405
+ drawCenter$1(stroke, 1, ui, canvas);
1406
+ break;
1407
+
1408
+ case "inside":
1409
+ drawAlign(stroke, "inside", ui, canvas);
1410
+ break;
1411
+
1412
+ case "outside":
1413
+ ui.__.__fillAfterStroke ? drawCenter$1(stroke, 2, ui, canvas) : drawAlign(stroke, "outside", ui, canvas);
1414
+ break;
1390
1415
  }
1391
1416
  }
1417
+
1392
1418
  function drawCenter$1(stroke, strokeWidthScale, ui, canvas) {
1393
1419
  const data = ui.__;
1394
- if (typeof stroke === 'object') {
1420
+ if (core.isObject(stroke)) {
1395
1421
  drawStrokesStyle(stroke, strokeWidthScale, true, ui, canvas);
1396
- }
1397
- else {
1422
+ } else {
1398
1423
  canvas.setStroke(stroke, data.__strokeWidth * strokeWidthScale, data);
1399
1424
  drawTextStroke(ui, canvas);
1400
1425
  }
1401
1426
  }
1427
+
1402
1428
  function drawAlign(stroke, align, ui, canvas) {
1403
1429
  const out = canvas.getSameCanvas(true, true);
1404
1430
  out.font = ui.__.__font;
1405
1431
  drawCenter$1(stroke, 2, ui, out);
1406
- out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
1432
+ out.blendMode = align === "outside" ? "destination-out" : "destination-in";
1407
1433
  fillText(ui, out);
1408
- out.blendMode = 'normal';
1434
+ out.blendMode = "normal";
1409
1435
  core.LeafHelper.copyCanvasByWorld(ui, canvas, out);
1410
1436
  out.recycle(ui.__nowWorld);
1411
1437
  }
1438
+
1412
1439
  function drawTextStroke(ui, canvas) {
1413
1440
  let row, data = ui.__.__textDrawData;
1414
- const { rows, decorationY } = data;
1441
+ const {rows: rows, decorationY: decorationY} = data;
1415
1442
  for (let i = 0, len = rows.length; i < len; i++) {
1416
1443
  row = rows[i];
1417
- if (row.text)
1418
- canvas.strokeText(row.text, row.x, row.y);
1419
- else if (row.data)
1420
- row.data.forEach(charData => { canvas.strokeText(charData.char, charData.x, row.y); });
1444
+ if (row.text) canvas.strokeText(row.text, row.x, row.y); else if (row.data) row.data.forEach(charData => {
1445
+ canvas.strokeText(charData.char, charData.x, row.y);
1446
+ });
1421
1447
  }
1422
1448
  if (decorationY) {
1423
- const { decorationHeight } = data;
1449
+ const {decorationHeight: decorationHeight} = data;
1424
1450
  rows.forEach(row => decorationY.forEach(value => canvas.strokeRect(row.x, row.y + value, row.width, decorationHeight)));
1425
1451
  }
1426
1452
  }
1453
+
1427
1454
  function drawStrokesStyle(strokes, strokeWidthScale, isText, ui, canvas) {
1428
1455
  let item;
1429
- const data = ui.__, { __hasMultiStrokeStyle } = data;
1456
+ const data = ui.__, {__hasMultiStrokeStyle: __hasMultiStrokeStyle} = data;
1430
1457
  __hasMultiStrokeStyle || canvas.setStroke(undefined, data.__strokeWidth * strokeWidthScale, data);
1431
1458
  for (let i = 0, len = strokes.length; i < len; i++) {
1432
1459
  item = strokes[i];
1433
- if (item.image && draw.PaintImage.checkImage(ui, canvas, item, false))
1434
- continue;
1460
+ if (item.image && draw.PaintImage.checkImage(ui, canvas, item, false)) continue;
1435
1461
  if (item.style) {
1436
1462
  if (__hasMultiStrokeStyle) {
1437
- const { strokeStyle } = item;
1463
+ const {strokeStyle: strokeStyle} = item;
1438
1464
  strokeStyle ? canvas.setStroke(item.style, data.__getRealStrokeWidth(strokeStyle) * strokeWidthScale, data, strokeStyle) : canvas.setStroke(item.style, data.__strokeWidth * strokeWidthScale, data);
1439
- }
1440
- else
1441
- canvas.strokeStyle = item.style;
1465
+ } else canvas.strokeStyle = item.style;
1442
1466
  if (item.blendMode) {
1443
1467
  canvas.saveBlendMode(item.blendMode);
1444
1468
  isText ? drawTextStroke(ui, canvas) : canvas.stroke();
1445
1469
  canvas.restoreBlendMode();
1446
- }
1447
- else {
1470
+ } else {
1448
1471
  isText ? drawTextStroke(ui, canvas) : canvas.stroke();
1449
1472
  }
1450
1473
  }
@@ -1453,53 +1476,54 @@ function drawStrokesStyle(strokes, strokeWidthScale, isText, ui, canvas) {
1453
1476
 
1454
1477
  function stroke(stroke, ui, canvas) {
1455
1478
  const data = ui.__;
1456
- if (!data.__strokeWidth)
1457
- return;
1479
+ if (!data.__strokeWidth) return;
1458
1480
  if (data.__font) {
1459
1481
  strokeText(stroke, ui, canvas);
1460
- }
1461
- else {
1482
+ } else {
1462
1483
  switch (data.strokeAlign) {
1463
- case 'center':
1464
- drawCenter(stroke, 1, ui, canvas);
1465
- break;
1466
- case 'inside':
1467
- drawInside(stroke, ui, canvas);
1468
- break;
1469
- case 'outside':
1470
- drawOutside(stroke, ui, canvas);
1471
- break;
1484
+ case "center":
1485
+ drawCenter(stroke, 1, ui, canvas);
1486
+ break;
1487
+
1488
+ case "inside":
1489
+ drawInside(stroke, ui, canvas);
1490
+ break;
1491
+
1492
+ case "outside":
1493
+ drawOutside(stroke, ui, canvas);
1494
+ break;
1472
1495
  }
1473
1496
  }
1474
1497
  }
1498
+
1475
1499
  function strokes(strokes, ui, canvas) {
1476
1500
  stroke(strokes, ui, canvas);
1477
1501
  }
1502
+
1478
1503
  function drawCenter(stroke, strokeWidthScale, ui, canvas) {
1479
1504
  const data = ui.__;
1480
- if (typeof stroke === 'object') {
1505
+ if (core.isObject(stroke)) {
1481
1506
  drawStrokesStyle(stroke, strokeWidthScale, false, ui, canvas);
1482
- }
1483
- else {
1507
+ } else {
1484
1508
  canvas.setStroke(stroke, data.__strokeWidth * strokeWidthScale, data);
1485
1509
  canvas.stroke();
1486
1510
  }
1487
- if (data.__useArrow)
1488
- draw.Paint.strokeArrow(stroke, ui, canvas);
1511
+ if (data.__useArrow) draw.Paint.strokeArrow(stroke, ui, canvas);
1489
1512
  }
1513
+
1490
1514
  function drawInside(stroke, ui, canvas) {
1491
1515
  canvas.save();
1492
1516
  canvas.clipUI(ui);
1493
1517
  drawCenter(stroke, 2, ui, canvas);
1494
1518
  canvas.restore();
1495
1519
  }
1520
+
1496
1521
  function drawOutside(stroke, ui, canvas) {
1497
1522
  const data = ui.__;
1498
1523
  if (data.__fillAfterStroke) {
1499
1524
  drawCenter(stroke, 2, ui, canvas);
1500
- }
1501
- else {
1502
- const { renderBounds } = ui.__layout;
1525
+ } else {
1526
+ const {renderBounds: renderBounds} = ui.__layout;
1503
1527
  const out = canvas.getSameCanvas(true, true);
1504
1528
  ui.__drawRenderPath(out);
1505
1529
  drawCenter(stroke, 2, ui, out);
@@ -1510,25 +1534,23 @@ function drawOutside(stroke, ui, canvas) {
1510
1534
  }
1511
1535
  }
1512
1536
 
1513
- const { getSpread, getOuterOf, getByMove, getIntersectData } = core.BoundsHelper;
1537
+ const {getSpread: getSpread, getOuterOf: getOuterOf, getByMove: getByMove, getIntersectData: getIntersectData} = core.BoundsHelper;
1538
+
1514
1539
  function shape(ui, current, options) {
1515
1540
  const canvas = current.getSameCanvas();
1516
1541
  const nowWorld = ui.__nowWorld;
1517
- let bounds, fitMatrix, shapeBounds, worldCanvas;
1518
- let { scaleX, scaleY } = nowWorld;
1519
- if (scaleX < 0)
1520
- scaleX = -scaleX;
1521
- if (scaleY < 0)
1522
- scaleY = -scaleY;
1542
+ let bounds, matrix, fitMatrix, shapeBounds, worldCanvas;
1543
+ let {scaleX: scaleX, scaleY: scaleY} = nowWorld;
1544
+ if (scaleX < 0) scaleX = -scaleX;
1545
+ if (scaleY < 0) scaleY = -scaleY;
1523
1546
  if (current.bounds.includes(nowWorld)) {
1524
1547
  worldCanvas = canvas;
1525
1548
  bounds = shapeBounds = nowWorld;
1526
- }
1527
- else {
1528
- const { renderShapeSpread: spread } = ui.__layout;
1529
- const worldClipBounds = getIntersectData(spread ? getSpread(current.bounds, scaleX === scaleY ? spread * scaleX : [spread * scaleY, spread * scaleX]) : current.bounds, nowWorld);
1549
+ } else {
1550
+ const {renderShapeSpread: spread} = ui.__layout;
1551
+ const worldClipBounds = getIntersectData(spread ? getSpread(current.bounds, scaleX === scaleY ? spread * scaleX : [ spread * scaleY, spread * scaleX ]) : current.bounds, nowWorld);
1530
1552
  fitMatrix = current.bounds.getFitMatrix(worldClipBounds);
1531
- let { a: fitScaleX, d: fitScaleY } = fitMatrix;
1553
+ let {a: fitScaleX, d: fitScaleY} = fitMatrix;
1532
1554
  if (fitMatrix.a < 1) {
1533
1555
  worldCanvas = current.getSameCanvas();
1534
1556
  ui.__renderShape(worldCanvas, options);
@@ -1537,28 +1559,39 @@ function shape(ui, current, options) {
1537
1559
  }
1538
1560
  shapeBounds = getOuterOf(nowWorld, fitMatrix);
1539
1561
  bounds = getByMove(shapeBounds, -fitMatrix.e, -fitMatrix.f);
1540
- if (options.matrix) {
1541
- const { matrix } = options;
1542
- fitMatrix.multiply(matrix);
1543
- fitScaleX *= matrix.scaleX;
1544
- fitScaleY *= matrix.scaleY;
1545
- }
1546
- options = Object.assign(Object.assign({}, options), { matrix: fitMatrix.withScale(fitScaleX, fitScaleY) });
1562
+ const userMatrix = options.matrix;
1563
+ if (userMatrix) {
1564
+ matrix = new core.Matrix(fitMatrix);
1565
+ matrix.multiply(userMatrix);
1566
+ fitScaleX *= userMatrix.scaleX;
1567
+ fitScaleY *= userMatrix.scaleY;
1568
+ } else matrix = fitMatrix;
1569
+ matrix.withScale(fitScaleX, fitScaleY);
1570
+ options = Object.assign(Object.assign({}, options), {
1571
+ matrix: matrix
1572
+ });
1547
1573
  }
1548
1574
  ui.__renderShape(canvas, options);
1549
1575
  return {
1550
- canvas, matrix: fitMatrix, bounds,
1551
- worldCanvas, shapeBounds, scaleX, scaleY
1576
+ canvas: canvas,
1577
+ matrix: matrix,
1578
+ fitMatrix: fitMatrix,
1579
+ bounds: bounds,
1580
+ worldCanvas: worldCanvas,
1581
+ shapeBounds: shapeBounds,
1582
+ scaleX: scaleX,
1583
+ scaleY: scaleY
1552
1584
  };
1553
1585
  }
1554
1586
 
1555
1587
  let recycleMap;
1556
- const { stintSet } = core.DataHelper, { hasTransparent: hasTransparent$1 } = draw.ColorConvert;
1588
+
1589
+ const {stintSet: stintSet} = core.DataHelper, {hasTransparent: hasTransparent$1} = draw.ColorConvert;
1590
+
1557
1591
  function compute(attrName, ui) {
1558
1592
  const data = ui.__, leafPaints = [];
1559
1593
  let paints = data.__input[attrName], isAlphaPixel, isTransparent;
1560
- if (!(paints instanceof Array))
1561
- paints = [paints];
1594
+ if (!core.isArray(paints)) paints = [ paints ];
1562
1595
  recycleMap = draw.PaintImage.recycleImage(attrName, data);
1563
1596
  let maxChildStrokeWidth;
1564
1597
  for (let i = 0, len = paints.length, item; i < len; i++) {
@@ -1566,206 +1599,222 @@ function compute(attrName, ui) {
1566
1599
  leafPaints.push(item);
1567
1600
  if (item.strokeStyle) {
1568
1601
  maxChildStrokeWidth || (maxChildStrokeWidth = 1);
1569
- if (item.strokeStyle.strokeWidth)
1570
- maxChildStrokeWidth = Math.max(maxChildStrokeWidth, item.strokeStyle.strokeWidth);
1602
+ if (item.strokeStyle.strokeWidth) maxChildStrokeWidth = Math.max(maxChildStrokeWidth, item.strokeStyle.strokeWidth);
1571
1603
  }
1572
1604
  }
1573
1605
  }
1574
- data['_' + attrName] = leafPaints.length ? leafPaints : undefined;
1606
+ data["_" + attrName] = leafPaints.length ? leafPaints : undefined;
1575
1607
  if (leafPaints.length) {
1576
1608
  if (leafPaints.every(item => item.isTransparent)) {
1577
- if (leafPaints.some(item => item.image))
1578
- isAlphaPixel = true;
1609
+ if (leafPaints.some(item => item.image)) isAlphaPixel = true;
1579
1610
  isTransparent = true;
1580
1611
  }
1581
1612
  }
1582
- if (attrName === 'fill') {
1583
- stintSet(data, '__isAlphaPixelFill', isAlphaPixel);
1584
- stintSet(data, '__isTransparentFill', isTransparent);
1585
- }
1586
- else {
1587
- stintSet(data, '__isAlphaPixelStroke', isAlphaPixel);
1588
- stintSet(data, '__isTransparentStroke', isTransparent);
1589
- stintSet(data, '__hasMultiStrokeStyle', maxChildStrokeWidth);
1613
+ if (attrName === "fill") {
1614
+ stintSet(data, "__isAlphaPixelFill", isAlphaPixel);
1615
+ stintSet(data, "__isTransparentFill", isTransparent);
1616
+ } else {
1617
+ stintSet(data, "__isAlphaPixelStroke", isAlphaPixel);
1618
+ stintSet(data, "__isTransparentStroke", isTransparent);
1619
+ stintSet(data, "__hasMultiStrokeStyle", maxChildStrokeWidth);
1590
1620
  }
1591
1621
  }
1622
+
1592
1623
  function getLeafPaint(attrName, paint, ui) {
1593
- if (typeof paint !== 'object' || paint.visible === false || paint.opacity === 0)
1594
- return undefined;
1624
+ if (!core.isObject(paint) || paint.visible === false || paint.opacity === 0) return undefined;
1595
1625
  let data;
1596
- const { boxBounds } = ui.__layout;
1626
+ const {boxBounds: boxBounds} = ui.__layout;
1597
1627
  switch (paint.type) {
1598
- case 'image':
1599
- data = draw.PaintImage.image(ui, attrName, paint, boxBounds, !recycleMap || !recycleMap[paint.url]);
1600
- break;
1601
- case 'linear':
1602
- data = draw.PaintGradient.linearGradient(paint, boxBounds);
1603
- break;
1604
- case 'radial':
1605
- data = draw.PaintGradient.radialGradient(paint, boxBounds);
1606
- break;
1607
- case 'angular':
1608
- data = draw.PaintGradient.conicGradient(paint, boxBounds);
1609
- break;
1610
- case 'solid':
1611
- const { type, color, opacity } = paint;
1612
- data = { type, style: draw.ColorConvert.string(color, opacity) };
1613
- break;
1614
- default:
1615
- if (paint.r !== undefined)
1616
- data = { type: 'solid', style: draw.ColorConvert.string(paint) };
1628
+ case "image":
1629
+ data = draw.PaintImage.image(ui, attrName, paint, boxBounds, !recycleMap || !recycleMap[paint.url]);
1630
+ break;
1631
+
1632
+ case "linear":
1633
+ data = draw.PaintGradient.linearGradient(paint, boxBounds);
1634
+ break;
1635
+
1636
+ case "radial":
1637
+ data = draw.PaintGradient.radialGradient(paint, boxBounds);
1638
+ break;
1639
+
1640
+ case "angular":
1641
+ data = draw.PaintGradient.conicGradient(paint, boxBounds);
1642
+ break;
1643
+
1644
+ case "solid":
1645
+ const {type: type, color: color, opacity: opacity} = paint;
1646
+ data = {
1647
+ type: type,
1648
+ style: draw.ColorConvert.string(color, opacity)
1649
+ };
1650
+ break;
1651
+
1652
+ default:
1653
+ if (!core.isUndefined(paint.r)) data = {
1654
+ type: "solid",
1655
+ style: draw.ColorConvert.string(paint)
1656
+ };
1617
1657
  }
1618
1658
  if (data) {
1619
- if (typeof data.style === 'string' && hasTransparent$1(data.style))
1620
- data.isTransparent = true;
1659
+ if (core.isString(data.style) && hasTransparent$1(data.style)) data.isTransparent = true;
1621
1660
  if (paint.style) {
1622
- if (paint.style.strokeWidth === 0)
1623
- return undefined;
1661
+ if (paint.style.strokeWidth === 0) return undefined;
1624
1662
  data.strokeStyle = paint.style;
1625
1663
  }
1626
- if (paint.blendMode)
1627
- data.blendMode = paint.blendMode;
1664
+ if (paint.editing) data.editing = paint.editing;
1665
+ if (paint.blendMode) data.blendMode = paint.blendMode;
1628
1666
  }
1629
1667
  return data;
1630
1668
  }
1631
1669
 
1632
1670
  const PaintModule = {
1633
- compute,
1634
- fill,
1635
- fills,
1636
- fillPathOrText,
1637
- fillText,
1638
- stroke,
1639
- strokes,
1640
- strokeText,
1641
- drawTextStroke,
1642
- shape
1671
+ compute: compute,
1672
+ fill: fill,
1673
+ fills: fills,
1674
+ fillPathOrText: fillPathOrText,
1675
+ fillText: fillText,
1676
+ stroke: stroke,
1677
+ strokes: strokes,
1678
+ strokeText: strokeText,
1679
+ drawTextStroke: drawTextStroke,
1680
+ shape: shape
1643
1681
  };
1644
1682
 
1645
1683
  let origin = {}, tempMatrix = core.getMatrixData();
1646
- const { get: get$3, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, multiplyParent, scale: scaleHelper, rotate, skew: skewHelper } = core.MatrixHelper;
1684
+
1685
+ const {get: get$3, rotateOfOuter: rotateOfOuter$1, translate: translate$1, scaleOfOuter: scaleOfOuter$1, multiplyParent: multiplyParent, scale: scaleHelper, rotate: rotate, skew: skewHelper} = core.MatrixHelper;
1686
+
1647
1687
  function fillOrFitMode(data, box, x, y, scaleX, scaleY, rotation) {
1648
1688
  const transform = get$3();
1649
1689
  translate$1(transform, box.x + x, box.y + y);
1650
1690
  scaleHelper(transform, scaleX, scaleY);
1651
- if (rotation)
1652
- rotateOfOuter$1(transform, { x: box.x + box.width / 2, y: box.y + box.height / 2 }, rotation);
1691
+ if (rotation) rotateOfOuter$1(transform, {
1692
+ x: box.x + box.width / 2,
1693
+ y: box.y + box.height / 2
1694
+ }, rotation);
1653
1695
  data.transform = transform;
1654
1696
  }
1697
+
1655
1698
  function clipMode(data, box, x, y, scaleX, scaleY, rotation, skew, clipSize) {
1656
1699
  const transform = get$3();
1657
- if (rotation)
1658
- rotate(transform, rotation);
1659
- if (skew)
1660
- skewHelper(transform, skew.x, skew.y);
1661
- if (scaleX)
1662
- scaleHelper(transform, scaleX, scaleY);
1663
- translate$1(transform, box.x + x, box.y + y);
1700
+ layout(transform, box, x, y, scaleX, scaleY, rotation, skew);
1664
1701
  if (clipSize) {
1665
1702
  tempMatrix.a = box.width / clipSize.width, tempMatrix.d = box.height / clipSize.height;
1666
1703
  multiplyParent(transform, tempMatrix);
1667
1704
  }
1668
1705
  data.transform = transform;
1669
1706
  }
1670
- function repeatMode(data, box, width, height, x, y, scaleX, scaleY, rotation, align) {
1707
+
1708
+ function repeatMode(data, box, width, height, x, y, scaleX, scaleY, rotation, skew, align, freeTransform) {
1671
1709
  const transform = get$3();
1672
- if (rotation) {
1673
- if (align === 'center') {
1674
- rotateOfOuter$1(transform, { x: width / 2, y: height / 2 }, rotation);
1675
- }
1676
- else {
1677
- rotate(transform, rotation);
1678
- switch (rotation) {
1679
- case 90:
1710
+ if (freeTransform) {
1711
+ layout(transform, box, x, y, scaleX, scaleY, rotation, skew);
1712
+ } else {
1713
+ if (rotation) {
1714
+ if (align === "center") {
1715
+ rotateOfOuter$1(transform, {
1716
+ x: width / 2,
1717
+ y: height / 2
1718
+ }, rotation);
1719
+ } else {
1720
+ rotate(transform, rotation);
1721
+ switch (rotation) {
1722
+ case 90:
1680
1723
  translate$1(transform, height, 0);
1681
1724
  break;
1682
- case 180:
1725
+
1726
+ case 180:
1683
1727
  translate$1(transform, width, height);
1684
1728
  break;
1685
- case 270:
1729
+
1730
+ case 270:
1686
1731
  translate$1(transform, 0, width);
1687
1732
  break;
1733
+ }
1688
1734
  }
1689
1735
  }
1736
+ origin.x = box.x + x;
1737
+ origin.y = box.y + y;
1738
+ translate$1(transform, origin.x, origin.y);
1739
+ if (scaleX) scaleOfOuter$1(transform, origin, scaleX, scaleY);
1690
1740
  }
1691
- origin.x = box.x + x;
1692
- origin.y = box.y + y;
1693
- translate$1(transform, origin.x, origin.y);
1694
- if (scaleX)
1695
- scaleOfOuter$1(transform, origin, scaleX, scaleY);
1696
1741
  data.transform = transform;
1697
1742
  }
1698
1743
 
1699
- const { get: get$2, translate } = core.MatrixHelper;
1700
- const tempBox = new core.Bounds();
1744
+ function layout(transform, box, x, y, scaleX, scaleY, rotation, skew) {
1745
+ if (rotation) rotate(transform, rotation);
1746
+ if (skew) skewHelper(transform, skew.x, skew.y);
1747
+ if (scaleX) scaleHelper(transform, scaleX, scaleY);
1748
+ translate$1(transform, box.x + x, box.y + y);
1749
+ }
1750
+
1751
+ const {get: get$2, translate: translate} = core.MatrixHelper;
1752
+
1753
+ const tempBox = new core.Bounds;
1754
+
1701
1755
  const tempScaleData = {};
1756
+
1702
1757
  const tempImage = {};
1758
+
1703
1759
  function createData(leafPaint, image, paint, box) {
1704
- const { changeful, sync, editing, scaleFixed } = paint;
1705
- if (changeful)
1706
- leafPaint.changeful = changeful;
1707
- if (sync)
1708
- leafPaint.sync = sync;
1709
- if (editing)
1710
- leafPaint.editing = editing;
1711
- if (scaleFixed)
1712
- leafPaint.scaleFixed = scaleFixed;
1760
+ const {changeful: changeful, sync: sync, scaleFixed: scaleFixed} = paint;
1761
+ if (changeful) leafPaint.changeful = changeful;
1762
+ if (sync) leafPaint.sync = sync;
1763
+ if (scaleFixed) leafPaint.scaleFixed = scaleFixed;
1713
1764
  leafPaint.data = getPatternData(paint, box, image);
1714
1765
  }
1766
+
1715
1767
  function getPatternData(paint, box, image) {
1716
- if (paint.padding)
1717
- box = tempBox.set(box).shrink(paint.padding);
1718
- if (paint.mode === 'strench')
1719
- paint.mode = 'stretch';
1720
- let { width, height } = image;
1721
- const { opacity, mode, align, offset, scale, size, rotation, skew, clipSize, repeat, filters } = paint;
1768
+ if (paint.padding) box = tempBox.set(box).shrink(paint.padding);
1769
+ if (paint.mode === "strench") paint.mode = "stretch";
1770
+ let {width: width, height: height} = image;
1771
+ const {opacity: opacity, mode: mode, align: align, offset: offset, scale: scale, size: size, rotation: rotation, skew: skew, clipSize: clipSize, repeat: repeat, gap: gap, filters: filters} = paint;
1722
1772
  const sameBox = box.width === width && box.height === height;
1723
- const data = { mode };
1724
- const swapSize = align !== 'center' && (rotation || 0) % 180 === 90;
1773
+ const data = {
1774
+ mode: mode
1775
+ };
1776
+ const swapSize = align !== "center" && (rotation || 0) % 180 === 90;
1725
1777
  core.BoundsHelper.set(tempImage, 0, 0, swapSize ? height : width, swapSize ? width : height);
1726
1778
  let scaleX, scaleY;
1727
- if (!mode || mode === 'cover' || mode === 'fit') {
1779
+ if (!mode || mode === "cover" || mode === "fit") {
1728
1780
  if (!sameBox || rotation) {
1729
- scaleX = scaleY = core.BoundsHelper.getFitScale(box, tempImage, mode !== 'fit');
1781
+ scaleX = scaleY = core.BoundsHelper.getFitScale(box, tempImage, mode !== "fit");
1730
1782
  core.BoundsHelper.put(box, image, align, scaleX, false, tempImage);
1731
1783
  core.BoundsHelper.scale(tempImage, scaleX, scaleY, true);
1732
1784
  }
1733
- }
1734
- else {
1785
+ } else {
1735
1786
  if (scale || size) {
1736
1787
  core.MathHelper.getScaleData(scale, size, image, tempScaleData);
1737
1788
  scaleX = tempScaleData.scaleX;
1738
1789
  scaleY = tempScaleData.scaleY;
1739
1790
  }
1740
- if (align) {
1741
- if (scaleX)
1742
- core.BoundsHelper.scale(tempImage, scaleX, scaleY, true);
1743
- core.AlignHelper.toPoint(align, tempImage, box, tempImage, true, true);
1791
+ if (align || gap || repeat) {
1792
+ if (scaleX) core.BoundsHelper.scale(tempImage, scaleX, scaleY, true);
1793
+ if (align) core.AlignHelper.toPoint(align, tempImage, box, tempImage, true, true);
1744
1794
  }
1745
1795
  }
1746
- if (offset)
1747
- core.PointHelper.move(tempImage, offset);
1796
+ if (offset) core.PointHelper.move(tempImage, offset);
1748
1797
  switch (mode) {
1749
- case 'stretch':
1750
- if (!sameBox)
1751
- width = box.width, height = box.height;
1752
- break;
1753
- case 'normal':
1754
- case 'clip':
1755
- if (tempImage.x || tempImage.y || scaleX || clipSize || rotation || skew)
1756
- clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, paint.clipSize);
1757
- break;
1758
- case 'repeat':
1759
- if (!sameBox || scaleX || rotation)
1760
- repeatMode(data, box, width, height, tempImage.x, tempImage.y, scaleX, scaleY, rotation, align);
1761
- if (!repeat)
1762
- data.repeat = 'repeat';
1763
- break;
1764
- case 'fit':
1765
- case 'cover':
1766
- default:
1767
- if (scaleX)
1768
- fillOrFitMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation);
1798
+ case "stretch":
1799
+ if (!sameBox) width = box.width, height = box.height;
1800
+ break;
1801
+
1802
+ case "normal":
1803
+ case "clip":
1804
+ if (tempImage.x || tempImage.y || scaleX || clipSize || rotation || skew) clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, paint.clipSize);
1805
+ break;
1806
+
1807
+ case "repeat":
1808
+ if (!sameBox || scaleX || rotation || skew) repeatMode(data, box, width, height, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, align, paint.freeTransform);
1809
+ if (!repeat) data.repeat = "repeat";
1810
+ const count = core.isObject(repeat);
1811
+ if (gap || count) data.gap = getGapData(gap, count && repeat, tempImage.width, tempImage.height, box);
1812
+ break;
1813
+
1814
+ case "fit":
1815
+ case "cover":
1816
+ default:
1817
+ if (scaleX) fillOrFitMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation);
1769
1818
  }
1770
1819
  if (!data.transform) {
1771
1820
  if (box.x || box.y) {
@@ -1773,49 +1822,69 @@ function getPatternData(paint, box, image) {
1773
1822
  translate(data.transform, box.x, box.y);
1774
1823
  }
1775
1824
  }
1776
- if (scaleX && mode !== 'stretch') {
1825
+ if (scaleX && mode !== "stretch") {
1777
1826
  data.scaleX = scaleX;
1778
1827
  data.scaleY = scaleY;
1779
1828
  }
1780
1829
  data.width = width;
1781
1830
  data.height = height;
1782
- if (opacity)
1783
- data.opacity = opacity;
1784
- if (filters)
1785
- data.filters = filters;
1786
- if (repeat)
1787
- data.repeat = typeof repeat === 'string' ? (repeat === 'x' ? 'repeat-x' : 'repeat-y') : 'repeat';
1831
+ if (opacity) data.opacity = opacity;
1832
+ if (filters) data.filters = filters;
1833
+ if (repeat) data.repeat = core.isString(repeat) ? repeat === "x" ? "repeat-x" : "repeat-y" : "repeat";
1788
1834
  return data;
1789
1835
  }
1790
1836
 
1791
- let cache, box = new core.Bounds();
1792
- const { isSame } = core.BoundsHelper;
1837
+ function getGapData(gap, repeat, width, height, box) {
1838
+ let xGap, yGap;
1839
+ if (core.isObject(gap)) xGap = gap.x, yGap = gap.y; else xGap = yGap = gap;
1840
+ return {
1841
+ x: getGapValue(xGap, width, box.width, repeat && repeat.x),
1842
+ y: getGapValue(yGap, height, box.height, repeat && repeat.y)
1843
+ };
1844
+ }
1845
+
1846
+ function getGapValue(gap, size, totalSize, rows) {
1847
+ const auto = core.isString(gap) || rows;
1848
+ const remain = rows ? totalSize - rows * size : totalSize % size;
1849
+ const value = auto ? remain / ((rows || Math.floor(totalSize / size)) - 1) : gap;
1850
+ return gap === "auto" ? value < 0 ? 0 : value : value;
1851
+ }
1852
+
1853
+ let cache, box = new core.Bounds;
1854
+
1855
+ const {isSame: isSame} = core.BoundsHelper;
1856
+
1793
1857
  function image(ui, attrName, paint, boxBounds, firstUse) {
1794
1858
  let leafPaint, event;
1795
1859
  const image = core.ImageManager.get(paint);
1796
1860
  if (cache && paint === cache.paint && isSame(boxBounds, cache.boxBounds)) {
1797
1861
  leafPaint = cache.leafPaint;
1798
- }
1799
- else {
1800
- leafPaint = { type: paint.type, image };
1801
- if (image.hasAlphaPixel)
1802
- leafPaint.isTransparent = true;
1803
- cache = image.use > 1 ? { leafPaint, paint, boxBounds: box.set(boxBounds) } : null;
1804
- }
1805
- if (firstUse || image.loading)
1806
- event = { image, attrName, attrValue: paint };
1862
+ } else {
1863
+ leafPaint = {
1864
+ type: paint.type,
1865
+ image: image
1866
+ };
1867
+ if (image.hasAlphaPixel) leafPaint.isTransparent = true;
1868
+ cache = image.use > 1 ? {
1869
+ leafPaint: leafPaint,
1870
+ paint: paint,
1871
+ boxBounds: box.set(boxBounds)
1872
+ } : null;
1873
+ }
1874
+ if (firstUse || image.loading) event = {
1875
+ image: image,
1876
+ attrName: attrName,
1877
+ attrValue: paint
1878
+ };
1807
1879
  if (image.ready) {
1808
1880
  checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds);
1809
1881
  if (firstUse) {
1810
1882
  onLoad(ui, event);
1811
1883
  onLoadSuccess(ui, event);
1812
1884
  }
1813
- }
1814
- else if (image.error) {
1815
- if (firstUse)
1816
- onLoadError(ui, event, image.error);
1817
- }
1818
- else {
1885
+ } else if (image.error) {
1886
+ if (firstUse) onLoadError(ui, event, image.error);
1887
+ } else {
1819
1888
  if (firstUse) {
1820
1889
  ignoreRender(ui, true);
1821
1890
  onLoad(ui, event);
@@ -1824,79 +1893,84 @@ function image(ui, attrName, paint, boxBounds, firstUse) {
1824
1893
  ignoreRender(ui, false);
1825
1894
  if (!ui.destroyed) {
1826
1895
  if (checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds)) {
1827
- if (image.hasAlphaPixel)
1828
- ui.__layout.hitCanvasChanged = true;
1829
- ui.forceUpdate('surface');
1896
+ if (image.hasAlphaPixel) ui.__layout.hitCanvasChanged = true;
1897
+ ui.forceUpdate("surface");
1830
1898
  }
1831
1899
  onLoadSuccess(ui, event);
1832
1900
  }
1833
1901
  leafPaint.loadId = undefined;
1834
- }, (error) => {
1902
+ }, error => {
1835
1903
  ignoreRender(ui, false);
1836
1904
  onLoadError(ui, event, error);
1837
1905
  leafPaint.loadId = undefined;
1838
1906
  });
1839
1907
  if (ui.placeholderColor) {
1840
- if (!ui.placeholderDelay)
1841
- image.isPlacehold = true;
1842
- else
1843
- setTimeout(() => {
1844
- if (!image.ready) {
1845
- image.isPlacehold = true;
1846
- ui.forceUpdate('surface');
1847
- }
1848
- }, ui.placeholderDelay);
1908
+ if (!ui.placeholderDelay) image.isPlacehold = true; else setTimeout(() => {
1909
+ if (!image.ready) {
1910
+ image.isPlacehold = true;
1911
+ ui.forceUpdate("surface");
1912
+ }
1913
+ }, ui.placeholderDelay);
1849
1914
  }
1850
1915
  }
1851
1916
  return leafPaint;
1852
1917
  }
1918
+
1853
1919
  function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds) {
1854
- if (attrName === 'fill' && !ui.__.__naturalWidth) {
1920
+ if (attrName === "fill" && !ui.__.__naturalWidth) {
1855
1921
  const data = ui.__;
1856
1922
  data.__naturalWidth = image.width / data.pixelRatio;
1857
1923
  data.__naturalHeight = image.height / data.pixelRatio;
1858
1924
  if (data.__autoSide) {
1859
- ui.forceUpdate('width');
1925
+ ui.forceUpdate("width");
1860
1926
  if (ui.__proxyData) {
1861
- ui.setProxyAttr('width', data.width);
1862
- ui.setProxyAttr('height', data.height);
1927
+ ui.setProxyAttr("width", data.width);
1928
+ ui.setProxyAttr("height", data.height);
1863
1929
  }
1864
1930
  return false;
1865
1931
  }
1866
1932
  }
1867
- if (!leafPaint.data)
1868
- createData(leafPaint, image, paint, boxBounds);
1933
+ if (!leafPaint.data) createData(leafPaint, image, paint, boxBounds);
1869
1934
  return true;
1870
1935
  }
1936
+
1871
1937
  function onLoad(ui, event) {
1872
1938
  emit(ui, core.ImageEvent.LOAD, event);
1873
1939
  }
1940
+
1874
1941
  function onLoadSuccess(ui, event) {
1875
1942
  emit(ui, core.ImageEvent.LOADED, event);
1876
1943
  }
1944
+
1877
1945
  function onLoadError(ui, event, error) {
1878
1946
  event.error = error;
1879
- ui.forceUpdate('surface');
1947
+ ui.forceUpdate("surface");
1880
1948
  emit(ui, core.ImageEvent.ERROR, event);
1881
1949
  }
1950
+
1882
1951
  function emit(ui, type, data) {
1883
- if (ui.hasEvent(type))
1884
- ui.emitEvent(new core.ImageEvent(type, data));
1952
+ if (ui.hasEvent(type)) ui.emitEvent(new core.ImageEvent(type, data));
1885
1953
  }
1954
+
1886
1955
  function ignoreRender(ui, value) {
1887
- const { leafer } = ui;
1888
- if (leafer && leafer.viewReady)
1889
- leafer.renderer.ignore = value;
1956
+ const {leafer: leafer} = ui;
1957
+ if (leafer && leafer.viewReady) leafer.renderer.ignore = value;
1890
1958
  }
1891
1959
 
1892
- const { get: get$1, scale, copy: copy$1 } = core.MatrixHelper;
1893
- const { ceil, abs } = Math;
1960
+ const {get: get$1, scale: scale, copy: copy$1} = core.MatrixHelper;
1961
+
1962
+ const {floor: floor, max: max, abs: abs} = Math;
1963
+
1894
1964
  function createPattern(ui, paint, pixelRatio) {
1895
- let { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
1896
- const id = scaleX + '-' + scaleY + '-' + pixelRatio;
1965
+ let {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true, paint.scaleFixed);
1966
+ const id = scaleX + "-" + scaleY + "-" + pixelRatio;
1897
1967
  if (paint.patternId !== id && !ui.destroyed) {
1898
- const { image, data } = paint;
1899
- let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, transform, repeat } = data;
1968
+ const {image: image, data: data} = paint;
1969
+ let imageScale, imageMatrix, {width: width, height: height, scaleX: sx, scaleY: sy, transform: transform, repeat: repeat, gap: gap} = data;
1970
+ scaleX *= pixelRatio;
1971
+ scaleY *= pixelRatio;
1972
+ const xGap = gap && gap.x * scaleX;
1973
+ const yGap = gap && gap.y * scaleY;
1900
1974
  if (sx) {
1901
1975
  sx = abs(sx);
1902
1976
  sy = abs(sy);
@@ -1906,23 +1980,18 @@ function createPattern(ui, paint, pixelRatio) {
1906
1980
  scaleX *= sx;
1907
1981
  scaleY *= sy;
1908
1982
  }
1909
- scaleX *= pixelRatio;
1910
- scaleY *= pixelRatio;
1911
1983
  width *= scaleX;
1912
1984
  height *= scaleY;
1913
1985
  const size = width * height;
1914
1986
  if (!repeat) {
1915
- if (size > core.Platform.image.maxCacheSize)
1916
- return false;
1987
+ if (size > core.Platform.image.maxCacheSize) return false;
1917
1988
  }
1918
1989
  let maxSize = core.Platform.image.maxPatternSize;
1919
1990
  if (!image.isSVG) {
1920
1991
  const imageSize = image.width * image.height;
1921
- if (maxSize > imageSize)
1922
- maxSize = imageSize;
1992
+ if (maxSize > imageSize) maxSize = imageSize;
1923
1993
  }
1924
- if (size > maxSize)
1925
- imageScale = Math.sqrt(size / maxSize);
1994
+ if (size > maxSize) imageScale = Math.sqrt(size / maxSize);
1926
1995
  if (imageScale) {
1927
1996
  scaleX /= imageScale;
1928
1997
  scaleY /= imageScale;
@@ -1936,97 +2005,95 @@ function createPattern(ui, paint, pixelRatio) {
1936
2005
  if (transform || scaleX !== 1 || scaleY !== 1) {
1937
2006
  if (!imageMatrix) {
1938
2007
  imageMatrix = get$1();
1939
- if (transform)
1940
- copy$1(imageMatrix, transform);
2008
+ if (transform) copy$1(imageMatrix, transform);
1941
2009
  }
1942
2010
  scale(imageMatrix, 1 / scaleX, 1 / scaleY);
1943
2011
  }
1944
- const canvas = image.getCanvas(ceil(width) || 1, ceil(height) || 1, data.opacity, data.filters);
1945
- const pattern = image.getPattern(canvas, repeat || (core.Platform.origin.noRepeat || 'no-repeat'), imageMatrix, paint);
2012
+ if (imageMatrix) {
2013
+ const canvasWidth = width + (xGap || 0), canvasHeight = height + (yGap || 0);
2014
+ scale(imageMatrix, canvasWidth / max(floor(canvasWidth), 1), canvasHeight / max(floor(canvasHeight), 1));
2015
+ }
2016
+ const canvas = image.getCanvas(width, height, data.opacity, data.filters, xGap, yGap);
2017
+ const pattern = image.getPattern(canvas, repeat || (core.Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
1946
2018
  paint.style = pattern;
1947
2019
  paint.patternId = id;
1948
2020
  return true;
1949
- }
1950
- else {
2021
+ } else {
1951
2022
  return false;
1952
2023
  }
1953
2024
  }
1954
2025
 
1955
- /******************************************************************************
1956
- Copyright (c) Microsoft Corporation.
1957
-
1958
- Permission to use, copy, modify, and/or distribute this software for any
1959
- purpose with or without fee is hereby granted.
1960
-
1961
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
1962
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
1963
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
1964
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
1965
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
1966
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
1967
- PERFORMANCE OF THIS SOFTWARE.
1968
- ***************************************************************************** */
1969
- /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
1970
-
1971
-
1972
- function __awaiter(thisArg, _arguments, P, generator) {
1973
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
1974
- return new (P || (P = Promise))(function (resolve, reject) {
1975
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
1976
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
1977
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
1978
- step((generator = generator.apply(thisArg, _arguments || [])).next());
1979
- });
1980
- }
1981
-
1982
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
1983
- var e = new Error(message);
1984
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
2026
+ function __awaiter(thisArg, _arguments, P, generator) {
2027
+ function adopt(value) {
2028
+ return value instanceof P ? value : new P(function(resolve) {
2029
+ resolve(value);
2030
+ });
2031
+ }
2032
+ return new (P || (P = Promise))(function(resolve, reject) {
2033
+ function fulfilled(value) {
2034
+ try {
2035
+ step(generator.next(value));
2036
+ } catch (e) {
2037
+ reject(e);
2038
+ }
2039
+ }
2040
+ function rejected(value) {
2041
+ try {
2042
+ step(generator["throw"](value));
2043
+ } catch (e) {
2044
+ reject(e);
2045
+ }
2046
+ }
2047
+ function step(result) {
2048
+ result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
2049
+ }
2050
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
2051
+ });
2052
+ }
2053
+
2054
+ typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) {
2055
+ var e = new Error(message);
2056
+ return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
1985
2057
  };
1986
2058
 
1987
2059
  function checkImage(ui, canvas, paint, allowDraw) {
1988
- const { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed);
1989
- const { pixelRatio } = canvas, { data } = paint;
1990
- if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
2060
+ const {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true, paint.scaleFixed);
2061
+ const {pixelRatio: pixelRatio} = canvas, {data: data} = paint;
2062
+ if (!data || paint.patternId === scaleX + "-" + scaleY + "-" + pixelRatio && !draw.Export.running) {
1991
2063
  return false;
1992
- }
1993
- else {
2064
+ } else {
1994
2065
  if (allowDraw) {
1995
2066
  if (data.repeat) {
1996
2067
  allowDraw = false;
1997
- }
1998
- else {
1999
- if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
2000
- let { width, height } = data;
2068
+ } else {
2069
+ if (!(paint.changeful || core.Platform.name === "miniapp" && core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
2070
+ let {width: width, height: height} = data;
2001
2071
  width *= scaleX * pixelRatio;
2002
2072
  height *= scaleY * pixelRatio;
2003
2073
  if (data.scaleX) {
2004
2074
  width *= data.scaleX;
2005
2075
  height *= data.scaleY;
2006
2076
  }
2007
- allowDraw = (width * height > core.Platform.image.maxCacheSize);
2077
+ allowDraw = width * height > core.Platform.image.maxCacheSize;
2008
2078
  }
2009
2079
  }
2010
2080
  }
2011
2081
  if (allowDraw) {
2012
2082
  if (ui.__.__isFastShadow) {
2013
- canvas.fillStyle = paint.style || '#000';
2083
+ canvas.fillStyle = paint.style || "#000";
2014
2084
  canvas.fill();
2015
2085
  }
2016
2086
  drawImage(ui, canvas, paint, data);
2017
2087
  return true;
2018
- }
2019
- else {
2088
+ } else {
2020
2089
  if (!paint.style || paint.sync || draw.Export.running) {
2021
2090
  createPattern(ui, paint, pixelRatio);
2022
- }
2023
- else {
2091
+ } else {
2024
2092
  if (!paint.patternTask) {
2025
- paint.patternTask = core.ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function* () {
2093
+ paint.patternTask = core.ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function*() {
2026
2094
  paint.patternTask = null;
2027
- if (canvas.bounds.hit(ui.__nowWorld))
2028
- createPattern(ui, paint, pixelRatio);
2029
- ui.forceUpdate('surface');
2095
+ if (canvas.bounds.hit(ui.__nowWorld)) createPattern(ui, paint, pixelRatio);
2096
+ ui.forceUpdate("surface");
2030
2097
  }), 300);
2031
2098
  }
2032
2099
  }
@@ -2034,39 +2101,35 @@ function checkImage(ui, canvas, paint, allowDraw) {
2034
2101
  }
2035
2102
  }
2036
2103
  }
2104
+
2037
2105
  function drawImage(ui, canvas, paint, data) {
2038
2106
  canvas.save();
2039
2107
  canvas.clipUI(ui);
2040
- if (paint.blendMode)
2041
- canvas.blendMode = paint.blendMode;
2042
- if (data.opacity)
2043
- canvas.opacity *= data.opacity;
2044
- if (data.transform)
2045
- canvas.transform(data.transform);
2108
+ if (paint.blendMode) canvas.blendMode = paint.blendMode;
2109
+ if (data.opacity) canvas.opacity *= data.opacity;
2110
+ if (data.transform) canvas.transform(data.transform);
2046
2111
  canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
2047
2112
  canvas.restore();
2048
2113
  }
2049
2114
 
2050
2115
  function recycleImage(attrName, data) {
2051
- const paints = data['_' + attrName];
2052
- if (paints instanceof Array) {
2116
+ const paints = data["_" + attrName];
2117
+ if (core.isArray(paints)) {
2053
2118
  let paint, image, recycleMap, input, url;
2054
2119
  for (let i = 0, len = paints.length; i < len; i++) {
2055
2120
  paint = paints[i];
2056
2121
  image = paint.image;
2057
2122
  url = image && image.url;
2058
2123
  if (url) {
2059
- if (!recycleMap)
2060
- recycleMap = {};
2124
+ if (!recycleMap) recycleMap = {};
2061
2125
  recycleMap[url] = true;
2062
2126
  core.ImageManager.recycle(image);
2063
2127
  if (image.loading) {
2064
2128
  if (!input) {
2065
- input = (data.__input && data.__input[attrName]) || [];
2066
- if (!(input instanceof Array))
2067
- input = [input];
2129
+ input = data.__input && data.__input[attrName] || [];
2130
+ if (!core.isArray(input)) input = [ input ];
2068
2131
  }
2069
- image.unload(paints[i].loadId, !input.some((item) => item.url === url));
2132
+ image.unload(paints[i].loadId, !input.some(item => item.url === url));
2070
2133
  }
2071
2134
  }
2072
2135
  }
@@ -2076,75 +2139,85 @@ function recycleImage(attrName, data) {
2076
2139
  }
2077
2140
 
2078
2141
  const PaintImageModule = {
2079
- image,
2080
- checkImage,
2081
- createPattern,
2082
- recycleImage,
2083
- createData,
2084
- getPatternData,
2085
- fillOrFitMode,
2086
- clipMode,
2087
- repeatMode
2142
+ image: image,
2143
+ checkImage: checkImage,
2144
+ createPattern: createPattern,
2145
+ recycleImage: recycleImage,
2146
+ createData: createData,
2147
+ getPatternData: getPatternData,
2148
+ fillOrFitMode: fillOrFitMode,
2149
+ clipMode: clipMode,
2150
+ repeatMode: repeatMode
2088
2151
  };
2089
2152
 
2090
- const { toPoint: toPoint$2 } = core.AroundHelper, { hasTransparent } = draw.ColorConvert;
2153
+ const {toPoint: toPoint$2} = core.AroundHelper, {hasTransparent: hasTransparent} = draw.ColorConvert;
2154
+
2091
2155
  const realFrom$2 = {};
2156
+
2092
2157
  const realTo$2 = {};
2158
+
2093
2159
  function linearGradient(paint, box) {
2094
- let { from, to, type, opacity } = paint;
2095
- toPoint$2(from || 'top', box, realFrom$2);
2096
- toPoint$2(to || 'bottom', box, realTo$2);
2160
+ let {from: from, to: to, type: type, opacity: opacity} = paint;
2161
+ toPoint$2(from || "top", box, realFrom$2);
2162
+ toPoint$2(to || "bottom", box, realTo$2);
2097
2163
  const style = core.Platform.canvas.createLinearGradient(realFrom$2.x, realFrom$2.y, realTo$2.x, realTo$2.y);
2098
- const data = { type, style };
2164
+ const data = {
2165
+ type: type,
2166
+ style: style
2167
+ };
2099
2168
  applyStops(data, style, paint.stops, opacity);
2100
2169
  return data;
2101
2170
  }
2171
+
2102
2172
  function applyStops(data, gradient, stops, opacity) {
2103
2173
  if (stops) {
2104
2174
  let stop, color, offset, isTransparent;
2105
2175
  for (let i = 0, len = stops.length; i < len; i++) {
2106
2176
  stop = stops[i];
2107
- if (typeof stop === 'string')
2108
- offset = i / (len - 1), color = draw.ColorConvert.string(stop, opacity);
2109
- else
2110
- offset = stop.offset, color = draw.ColorConvert.string(stop.color, opacity);
2177
+ if (core.isString(stop)) offset = i / (len - 1), color = draw.ColorConvert.string(stop, opacity); else offset = stop.offset,
2178
+ color = draw.ColorConvert.string(stop.color, opacity);
2111
2179
  gradient.addColorStop(offset, color);
2112
- if (!isTransparent && hasTransparent(color))
2113
- isTransparent = true;
2180
+ if (!isTransparent && hasTransparent(color)) isTransparent = true;
2114
2181
  }
2115
- if (isTransparent)
2116
- data.isTransparent = true;
2182
+ if (isTransparent) data.isTransparent = true;
2117
2183
  }
2118
2184
  }
2119
2185
 
2120
- const { getAngle, getDistance: getDistance$1 } = core.PointHelper;
2121
- const { get, rotateOfOuter, scaleOfOuter } = core.MatrixHelper;
2122
- const { toPoint: toPoint$1 } = core.AroundHelper;
2186
+ const {getAngle: getAngle, getDistance: getDistance$1} = core.PointHelper;
2187
+
2188
+ const {get: get, rotateOfOuter: rotateOfOuter, scaleOfOuter: scaleOfOuter} = core.MatrixHelper;
2189
+
2190
+ const {toPoint: toPoint$1} = core.AroundHelper;
2191
+
2123
2192
  const realFrom$1 = {};
2193
+
2124
2194
  const realTo$1 = {};
2195
+
2125
2196
  function radialGradient(paint, box) {
2126
- let { from, to, type, opacity, stretch } = paint;
2127
- toPoint$1(from || 'center', box, realFrom$1);
2128
- toPoint$1(to || 'bottom', box, realTo$1);
2197
+ let {from: from, to: to, type: type, opacity: opacity, stretch: stretch} = paint;
2198
+ toPoint$1(from || "center", box, realFrom$1);
2199
+ toPoint$1(to || "bottom", box, realTo$1);
2129
2200
  const style = core.Platform.canvas.createRadialGradient(realFrom$1.x, realFrom$1.y, 0, realFrom$1.x, realFrom$1.y, getDistance$1(realFrom$1, realTo$1));
2130
- const data = { type, style };
2201
+ const data = {
2202
+ type: type,
2203
+ style: style
2204
+ };
2131
2205
  applyStops(data, style, paint.stops, opacity);
2132
2206
  const transform = getTransform(box, realFrom$1, realTo$1, stretch, true);
2133
- if (transform)
2134
- data.transform = transform;
2207
+ if (transform) data.transform = transform;
2135
2208
  return data;
2136
2209
  }
2210
+
2137
2211
  function getTransform(box, from, to, stretch, rotate90) {
2138
2212
  let transform;
2139
- const { width, height } = box;
2213
+ const {width: width, height: height} = box;
2140
2214
  if (width !== height || stretch) {
2141
2215
  const angle = getAngle(from, to);
2142
2216
  transform = get();
2143
2217
  if (rotate90) {
2144
2218
  scaleOfOuter(transform, from, width / height * (stretch || 1), 1);
2145
2219
  rotateOfOuter(transform, from, angle + 90);
2146
- }
2147
- else {
2220
+ } else {
2148
2221
  scaleOfOuter(transform, from, 1, width / height * (stretch || 1));
2149
2222
  rotateOfOuter(transform, from, angle);
2150
2223
  }
@@ -2152,81 +2225,94 @@ function getTransform(box, from, to, stretch, rotate90) {
2152
2225
  return transform;
2153
2226
  }
2154
2227
 
2155
- const { getDistance } = core.PointHelper;
2156
- const { toPoint } = core.AroundHelper;
2228
+ const {getDistance: getDistance} = core.PointHelper;
2229
+
2230
+ const {toPoint: toPoint} = core.AroundHelper;
2231
+
2157
2232
  const realFrom = {};
2233
+
2158
2234
  const realTo = {};
2235
+
2159
2236
  function conicGradient(paint, box) {
2160
- let { from, to, type, opacity, stretch } = paint;
2161
- toPoint(from || 'center', box, realFrom);
2162
- toPoint(to || 'bottom', box, realTo);
2237
+ let {from: from, to: to, type: type, opacity: opacity, stretch: stretch} = paint;
2238
+ toPoint(from || "center", box, realFrom);
2239
+ toPoint(to || "bottom", box, realTo);
2163
2240
  const style = core.Platform.conicGradientSupport ? core.Platform.canvas.createConicGradient(0, realFrom.x, realFrom.y) : core.Platform.canvas.createRadialGradient(realFrom.x, realFrom.y, 0, realFrom.x, realFrom.y, getDistance(realFrom, realTo));
2164
- const data = { type, style };
2241
+ const data = {
2242
+ type: type,
2243
+ style: style
2244
+ };
2165
2245
  applyStops(data, style, paint.stops, opacity);
2166
2246
  const transform = getTransform(box, realFrom, realTo, stretch || 1, core.Platform.conicGradientRotate90);
2167
- if (transform)
2168
- data.transform = transform;
2247
+ if (transform) data.transform = transform;
2169
2248
  return data;
2170
2249
  }
2171
2250
 
2172
2251
  const PaintGradientModule = {
2173
- linearGradient,
2174
- radialGradient,
2175
- conicGradient,
2176
- getTransform
2252
+ linearGradient: linearGradient,
2253
+ radialGradient: radialGradient,
2254
+ conicGradient: conicGradient,
2255
+ getTransform: getTransform
2177
2256
  };
2178
2257
 
2179
- const { copy, toOffsetOutBounds: toOffsetOutBounds$1 } = core.BoundsHelper;
2258
+ const {copy: copy, toOffsetOutBounds: toOffsetOutBounds$1} = core.BoundsHelper;
2259
+
2180
2260
  const tempBounds = {};
2261
+
2181
2262
  const offsetOutBounds$1 = {};
2263
+
2182
2264
  function shadow(ui, current, shape) {
2183
2265
  let copyBounds, spreadScale;
2184
- const { __nowWorld: nowWorld, __layout } = ui;
2185
- const { shadow } = ui.__;
2186
- const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
2266
+ const {__nowWorld: nowWorld, __layout: __layout} = ui;
2267
+ const {shadow: shadow} = ui.__;
2268
+ const {worldCanvas: worldCanvas, bounds: bounds, shapeBounds: shapeBounds, scaleX: scaleX, scaleY: scaleY} = shape;
2187
2269
  const other = current.getSameCanvas();
2188
2270
  const end = shadow.length - 1;
2189
2271
  toOffsetOutBounds$1(bounds, offsetOutBounds$1);
2190
2272
  shadow.forEach((item, index) => {
2191
- other.setWorldShadow((offsetOutBounds$1.offsetX + item.x * scaleX), (offsetOutBounds$1.offsetY + item.y * scaleY), item.blur * scaleX, draw.ColorConvert.string(item.color));
2192
- spreadScale = item.spread ? 1 + item.spread * 2 / (__layout.boxBounds.width + (__layout.strokeBoxSpread || 0) * 2) : 0;
2273
+ let otherScale = 1;
2274
+ if (item.scaleFixed) {
2275
+ const sx = Math.abs(nowWorld.scaleX);
2276
+ if (sx > 1) otherScale = 1 / sx;
2277
+ }
2278
+ other.setWorldShadow(offsetOutBounds$1.offsetX + item.x * scaleX * otherScale, offsetOutBounds$1.offsetY + item.y * scaleY * otherScale, item.blur * scaleX * otherScale, draw.ColorConvert.string(item.color));
2279
+ spreadScale = item.spread ? 1 + item.spread * 2 / (__layout.boxBounds.width + (__layout.strokeBoxSpread || 0) * 2) * otherScale : 0;
2193
2280
  drawWorldShadow(other, offsetOutBounds$1, spreadScale, shape);
2194
2281
  copyBounds = bounds;
2195
2282
  if (item.box) {
2196
2283
  other.restore();
2197
2284
  other.save();
2198
2285
  if (worldCanvas) {
2199
- other.copyWorld(other, bounds, nowWorld, 'copy');
2286
+ other.copyWorld(other, bounds, nowWorld, "copy");
2200
2287
  copyBounds = nowWorld;
2201
2288
  }
2202
- worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
2289
+ worldCanvas ? other.copyWorld(worldCanvas, nowWorld, nowWorld, "destination-out") : other.copyWorld(shape.canvas, shapeBounds, bounds, "destination-out");
2203
2290
  }
2204
2291
  core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
2205
- if (end && index < end)
2206
- other.clearWorld(copyBounds, true);
2292
+ if (end && index < end) other.clearWorld(copyBounds, true);
2207
2293
  });
2208
2294
  other.recycle(copyBounds);
2209
2295
  }
2296
+
2210
2297
  function drawWorldShadow(canvas, outBounds, spreadScale, shape) {
2211
- const { bounds, shapeBounds } = shape;
2298
+ const {bounds: bounds, shapeBounds: shapeBounds} = shape;
2212
2299
  if (core.Platform.fullImageShadow) {
2213
2300
  copy(tempBounds, canvas.bounds);
2214
- tempBounds.x += (outBounds.x - shapeBounds.x);
2215
- tempBounds.y += (outBounds.y - shapeBounds.y);
2301
+ tempBounds.x += outBounds.x - shapeBounds.x;
2302
+ tempBounds.y += outBounds.y - shapeBounds.y;
2216
2303
  if (spreadScale) {
2217
- const { matrix } = shape;
2218
- tempBounds.x -= (bounds.x + (matrix ? matrix.e : 0) + bounds.width / 2) * (spreadScale - 1);
2219
- tempBounds.y -= (bounds.y + (matrix ? matrix.f : 0) + bounds.height / 2) * (spreadScale - 1);
2304
+ const {fitMatrix: fitMatrix} = shape;
2305
+ tempBounds.x -= (bounds.x + (fitMatrix ? fitMatrix.e : 0) + bounds.width / 2) * (spreadScale - 1);
2306
+ tempBounds.y -= (bounds.y + (fitMatrix ? fitMatrix.f : 0) + bounds.height / 2) * (spreadScale - 1);
2220
2307
  tempBounds.width *= spreadScale;
2221
2308
  tempBounds.height *= spreadScale;
2222
2309
  }
2223
2310
  canvas.copyWorld(shape.canvas, canvas.bounds, tempBounds);
2224
- }
2225
- else {
2311
+ } else {
2226
2312
  if (spreadScale) {
2227
2313
  copy(tempBounds, outBounds);
2228
- tempBounds.x -= (outBounds.width / 2) * (spreadScale - 1);
2229
- tempBounds.y -= (outBounds.height / 2) * (spreadScale - 1);
2314
+ tempBounds.x -= outBounds.width / 2 * (spreadScale - 1);
2315
+ tempBounds.y -= outBounds.height / 2 * (spreadScale - 1);
2230
2316
  tempBounds.width *= spreadScale;
2231
2317
  tempBounds.height *= spreadScale;
2232
2318
  }
@@ -2234,174 +2320,184 @@ function drawWorldShadow(canvas, outBounds, spreadScale, shape) {
2234
2320
  }
2235
2321
  }
2236
2322
 
2237
- const { toOffsetOutBounds } = core.BoundsHelper;
2323
+ const {toOffsetOutBounds: toOffsetOutBounds} = core.BoundsHelper;
2324
+
2238
2325
  const offsetOutBounds = {};
2326
+
2239
2327
  function innerShadow(ui, current, shape) {
2240
2328
  let copyBounds, spreadScale;
2241
- const { __nowWorld: nowWorld, __layout } = ui;
2242
- const { innerShadow } = ui.__;
2243
- const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
2329
+ const {__nowWorld: nowWorld, __layout: __layout} = ui;
2330
+ const {innerShadow: innerShadow} = ui.__;
2331
+ const {worldCanvas: worldCanvas, bounds: bounds, shapeBounds: shapeBounds, scaleX: scaleX, scaleY: scaleY} = shape;
2244
2332
  const other = current.getSameCanvas();
2245
2333
  const end = innerShadow.length - 1;
2246
2334
  toOffsetOutBounds(bounds, offsetOutBounds);
2247
2335
  innerShadow.forEach((item, index) => {
2336
+ let otherScale = 1;
2337
+ if (item.scaleFixed) {
2338
+ const sx = Math.abs(nowWorld.scaleX);
2339
+ if (sx > 1) otherScale = 1 / sx;
2340
+ }
2248
2341
  other.save();
2249
- other.setWorldShadow((offsetOutBounds.offsetX + item.x * scaleX), (offsetOutBounds.offsetY + item.y * scaleY), item.blur * scaleX);
2250
- spreadScale = item.spread ? 1 - item.spread * 2 / (__layout.boxBounds.width + (__layout.strokeBoxSpread || 0) * 2) : 0;
2342
+ other.setWorldShadow(offsetOutBounds.offsetX + item.x * scaleX * otherScale, offsetOutBounds.offsetY + item.y * scaleY * otherScale, item.blur * scaleX * otherScale);
2343
+ spreadScale = item.spread ? 1 - item.spread * 2 / (__layout.boxBounds.width + (__layout.strokeBoxSpread || 0) * 2) * otherScale : 0;
2251
2344
  drawWorldShadow(other, offsetOutBounds, spreadScale, shape);
2252
2345
  other.restore();
2253
2346
  if (worldCanvas) {
2254
- other.copyWorld(other, bounds, nowWorld, 'copy');
2255
- other.copyWorld(worldCanvas, nowWorld, nowWorld, 'source-out');
2347
+ other.copyWorld(other, bounds, nowWorld, "copy");
2348
+ other.copyWorld(worldCanvas, nowWorld, nowWorld, "source-out");
2256
2349
  copyBounds = nowWorld;
2257
- }
2258
- else {
2259
- other.copyWorld(shape.canvas, shapeBounds, bounds, 'source-out');
2350
+ } else {
2351
+ other.copyWorld(shape.canvas, shapeBounds, bounds, "source-out");
2260
2352
  copyBounds = bounds;
2261
2353
  }
2262
- other.fillWorld(copyBounds, draw.ColorConvert.string(item.color), 'source-in');
2354
+ other.fillWorld(copyBounds, draw.ColorConvert.string(item.color), "source-in");
2263
2355
  core.LeafHelper.copyCanvasByWorld(ui, current, other, copyBounds, item.blendMode);
2264
- if (end && index < end)
2265
- other.clearWorld(copyBounds, true);
2356
+ if (end && index < end) other.clearWorld(copyBounds, true);
2266
2357
  });
2267
2358
  other.recycle(copyBounds);
2268
2359
  }
2269
2360
 
2270
2361
  function blur(ui, current, origin) {
2271
- const { blur } = ui.__;
2362
+ const {blur: blur} = ui.__;
2272
2363
  origin.setWorldBlur(blur * ui.__nowWorld.a);
2273
2364
  origin.copyWorldToInner(current, ui.__nowWorld, ui.__layout.renderBounds);
2274
- origin.filter = 'none';
2365
+ origin.filter = "none";
2275
2366
  }
2276
2367
 
2277
- function backgroundBlur(_ui, _current, _shape) {
2278
- }
2368
+ function backgroundBlur(_ui, _current, _shape) {}
2279
2369
 
2280
2370
  const EffectModule = {
2281
- shadow,
2282
- innerShadow,
2283
- blur,
2284
- backgroundBlur
2371
+ shadow: shadow,
2372
+ innerShadow: innerShadow,
2373
+ blur: blur,
2374
+ backgroundBlur: backgroundBlur
2285
2375
  };
2286
2376
 
2287
- const { excludeRenderBounds } = core.LeafBoundsHelper;
2288
- draw.Group.prototype.__renderMask = function (canvas, options) {
2377
+ const {excludeRenderBounds: excludeRenderBounds} = core.LeafBoundsHelper;
2378
+
2379
+ let usedGrayscaleAlpha;
2380
+
2381
+ draw.Group.prototype.__renderMask = function(canvas, options) {
2289
2382
  let child, maskCanvas, contentCanvas, maskOpacity, currentMask, mask;
2290
- const { children } = this;
2383
+ const {children: children} = this;
2291
2384
  for (let i = 0, len = children.length; i < len; i++) {
2292
2385
  child = children[i], mask = child.__.mask;
2293
2386
  if (mask) {
2294
2387
  if (currentMask) {
2295
- maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity);
2388
+ maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity, undefined, true);
2296
2389
  maskCanvas = contentCanvas = null;
2297
2390
  }
2298
- if (mask === 'path' || mask === 'clipping-path') {
2299
- if (child.opacity < 1) {
2300
- currentMask = 'opacity-path';
2301
- maskOpacity = child.opacity;
2302
- if (!contentCanvas)
2303
- contentCanvas = getCanvas(canvas);
2304
- }
2305
- else {
2306
- currentMask = 'path';
2391
+ maskOpacity = child.__.opacity;
2392
+ usedGrayscaleAlpha = false;
2393
+ if (mask === "path" || mask === "clipping-path") {
2394
+ if (maskOpacity < 1) {
2395
+ currentMask = "opacity-path";
2396
+ if (!contentCanvas) contentCanvas = getCanvas(canvas);
2397
+ } else {
2398
+ currentMask = "path";
2307
2399
  canvas.save();
2308
2400
  }
2309
2401
  child.__clip(contentCanvas || canvas, options);
2310
- }
2311
- else {
2312
- currentMask = mask === 'grayscale' ? 'grayscale' : 'alpha';
2313
- if (!maskCanvas)
2314
- maskCanvas = getCanvas(canvas);
2315
- if (!contentCanvas)
2316
- contentCanvas = getCanvas(canvas);
2402
+ } else {
2403
+ currentMask = mask === "grayscale" ? "grayscale" : "alpha";
2404
+ if (!maskCanvas) maskCanvas = getCanvas(canvas);
2405
+ if (!contentCanvas) contentCanvas = getCanvas(canvas);
2317
2406
  child.__render(maskCanvas, options);
2318
2407
  }
2319
- if (mask === 'clipping' || mask === 'clipping-path')
2320
- excludeRenderBounds(child, options) || child.__render(canvas, options);
2408
+ if (mask === "clipping" || mask === "clipping-path") excludeRenderBounds(child, options) || child.__render(canvas, options);
2321
2409
  continue;
2322
2410
  }
2411
+ const childBlendMode = maskOpacity === 1 && child.__.__blendMode;
2412
+ if (childBlendMode) maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity, undefined, false);
2323
2413
  excludeRenderBounds(child, options) || child.__render(contentCanvas || canvas, options);
2414
+ if (childBlendMode) maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity, childBlendMode, false);
2324
2415
  }
2325
- maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity);
2416
+ maskEnd(this, currentMask, canvas, contentCanvas, maskCanvas, maskOpacity, undefined, true);
2326
2417
  };
2327
- function maskEnd(leaf, maskMode, canvas, contentCanvas, maskCanvas, maskOpacity) {
2418
+
2419
+ function maskEnd(leaf, maskMode, canvas, contentCanvas, maskCanvas, maskOpacity, blendMode, recycle) {
2328
2420
  switch (maskMode) {
2329
- case 'grayscale':
2330
- maskCanvas.useGrayscaleAlpha(leaf.__nowWorld);
2331
- case 'alpha':
2332
- usePixelMask(leaf, canvas, contentCanvas, maskCanvas);
2333
- break;
2334
- case 'opacity-path':
2335
- copyContent(leaf, canvas, contentCanvas, maskOpacity);
2336
- break;
2337
- case 'path':
2338
- canvas.restore();
2421
+ case "grayscale":
2422
+ if (!usedGrayscaleAlpha) usedGrayscaleAlpha = true, maskCanvas.useGrayscaleAlpha(leaf.__nowWorld);
2423
+
2424
+ case "alpha":
2425
+ usePixelMask(leaf, canvas, contentCanvas, maskCanvas, blendMode, recycle);
2426
+ break;
2427
+
2428
+ case "opacity-path":
2429
+ copyContent(leaf, canvas, contentCanvas, maskOpacity, blendMode, recycle);
2430
+ break;
2431
+
2432
+ case "path":
2433
+ if (recycle) canvas.restore();
2339
2434
  }
2340
2435
  }
2436
+
2341
2437
  function getCanvas(canvas) {
2342
2438
  return canvas.getSameCanvas(false, true);
2343
2439
  }
2344
- function usePixelMask(leaf, canvas, content, mask) {
2440
+
2441
+ function usePixelMask(leaf, canvas, content, mask, blendMode, recycle) {
2345
2442
  const realBounds = leaf.__nowWorld;
2346
2443
  content.resetTransform();
2347
2444
  content.opacity = 1;
2348
2445
  content.useMask(mask, realBounds);
2349
- mask.recycle(realBounds);
2350
- copyContent(leaf, canvas, content, 1);
2446
+ if (recycle) mask.recycle(realBounds);
2447
+ copyContent(leaf, canvas, content, 1, blendMode, recycle);
2351
2448
  }
2352
- function copyContent(leaf, canvas, content, maskOpacity) {
2449
+
2450
+ function copyContent(leaf, canvas, content, maskOpacity, blendMode, recycle) {
2353
2451
  const realBounds = leaf.__nowWorld;
2354
2452
  canvas.resetTransform();
2355
2453
  canvas.opacity = maskOpacity;
2356
- canvas.copyWorld(content, realBounds);
2357
- content.recycle(realBounds);
2358
- }
2359
-
2360
- const money = '¥¥$€££¢¢';
2361
- const letter = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyz';
2362
- const langBefore = '《(「〈『〖【〔{┌<‘“=' + money;
2363
- const langAfter = '》)」〉』〗】〕}┐>’”!?,、。:;‰';
2364
- const langSymbol = '≮≯≈≠=…';
2365
- const langBreak$1 = '—/~|┆·';
2366
- const beforeChar = '{[(<\'"' + langBefore;
2367
- const afterChar = '>)]}%!?,.:;\'"' + langAfter;
2368
- const symbolChar = afterChar + '_#~&*+\\=|' + langSymbol;
2369
- const breakChar = '- ' + langBreak$1;
2370
- const cjkRangeList = [
2371
- [0x4E00, 0x9FFF],
2372
- [0x3400, 0x4DBF],
2373
- [0x20000, 0x2A6DF],
2374
- [0x2A700, 0x2B73F],
2375
- [0x2B740, 0x2B81F],
2376
- [0x2B820, 0x2CEAF],
2377
- [0x2CEB0, 0x2EBEF],
2378
- [0x30000, 0x3134F],
2379
- [0x31350, 0x323AF],
2380
- [0x2E80, 0x2EFF],
2381
- [0x2F00, 0x2FDF],
2382
- [0x2FF0, 0x2FFF],
2383
- [0x3000, 0x303F],
2384
- [0x31C0, 0x31EF],
2385
- [0x3200, 0x32FF],
2386
- [0x3300, 0x33FF],
2387
- [0xF900, 0xFAFF],
2388
- [0xFE30, 0xFE4F],
2389
- [0x1F200, 0x1F2FF],
2390
- [0x2F800, 0x2FA1F],
2391
- ];
2392
- const cjkReg = new RegExp(cjkRangeList.map(([start, end]) => `[\\u${start.toString(16)}-\\u${end.toString(16)}]`).join('|'));
2454
+ canvas.copyWorld(content, realBounds, undefined, blendMode);
2455
+ recycle ? content.recycle(realBounds) : content.clearWorld(realBounds, true);
2456
+ }
2457
+
2458
+ const money = "¥¥$€££¢¢";
2459
+
2460
+ const letter = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyz";
2461
+
2462
+ const langBefore = "《(「〈『〖【〔{┌<‘“=" + money;
2463
+
2464
+ const langAfter = "》)」〉』〗】〕}┐>’”!?,、。:;‰";
2465
+
2466
+ const langSymbol = "≮≯≈≠=…";
2467
+
2468
+ const langBreak$1 = "—/~|┆·";
2469
+
2470
+ const beforeChar = "{[(<'\"" + langBefore;
2471
+
2472
+ const afterChar = ">)]}%!?,.:;'\"" + langAfter;
2473
+
2474
+ const symbolChar = afterChar + "_#~&*+\\=|" + langSymbol;
2475
+
2476
+ const breakChar = "- " + langBreak$1;
2477
+
2478
+ const cjkRangeList = [ [ 19968, 40959 ], [ 13312, 19903 ], [ 131072, 173791 ], [ 173824, 177983 ], [ 177984, 178207 ], [ 178208, 183983 ], [ 183984, 191471 ], [ 196608, 201551 ], [ 201552, 205743 ], [ 11904, 12031 ], [ 12032, 12255 ], [ 12272, 12287 ], [ 12288, 12351 ], [ 12736, 12783 ], [ 12800, 13055 ], [ 13056, 13311 ], [ 63744, 64255 ], [ 65072, 65103 ], [ 127488, 127743 ], [ 194560, 195103 ] ];
2479
+
2480
+ const cjkReg = new RegExp(cjkRangeList.map(([start, end]) => `[\\u${start.toString(16)}-\\u${end.toString(16)}]`).join("|"));
2481
+
2393
2482
  function mapChar(str) {
2394
2483
  const map = {};
2395
- str.split('').forEach(char => map[char] = true);
2484
+ str.split("").forEach(char => map[char] = true);
2396
2485
  return map;
2397
2486
  }
2487
+
2398
2488
  const letterMap = mapChar(letter);
2489
+
2399
2490
  const beforeMap = mapChar(beforeChar);
2491
+
2400
2492
  const afterMap = mapChar(afterChar);
2493
+
2401
2494
  const symbolMap = mapChar(symbolChar);
2495
+
2402
2496
  const breakMap = mapChar(breakChar);
2497
+
2403
2498
  var CharType;
2404
- (function (CharType) {
2499
+
2500
+ (function(CharType) {
2405
2501
  CharType[CharType["Letter"] = 0] = "Letter";
2406
2502
  CharType[CharType["Single"] = 1] = "Single";
2407
2503
  CharType[CharType["Before"] = 2] = "Before";
@@ -2409,179 +2505,175 @@ var CharType;
2409
2505
  CharType[CharType["Symbol"] = 4] = "Symbol";
2410
2506
  CharType[CharType["Break"] = 5] = "Break";
2411
2507
  })(CharType || (CharType = {}));
2412
- const { Letter: Letter$1, Single: Single$1, Before: Before$1, After: After$1, Symbol: Symbol$1, Break: Break$1 } = CharType;
2508
+
2509
+ const {Letter: Letter$1, Single: Single$1, Before: Before$1, After: After$1, Symbol: Symbol$1, Break: Break$1} = CharType;
2510
+
2413
2511
  function getCharType(char) {
2414
2512
  if (letterMap[char]) {
2415
2513
  return Letter$1;
2416
- }
2417
- else if (breakMap[char]) {
2514
+ } else if (breakMap[char]) {
2418
2515
  return Break$1;
2419
- }
2420
- else if (beforeMap[char]) {
2516
+ } else if (beforeMap[char]) {
2421
2517
  return Before$1;
2422
- }
2423
- else if (afterMap[char]) {
2518
+ } else if (afterMap[char]) {
2424
2519
  return After$1;
2425
- }
2426
- else if (symbolMap[char]) {
2520
+ } else if (symbolMap[char]) {
2427
2521
  return Symbol$1;
2428
- }
2429
- else if (cjkReg.test(char)) {
2522
+ } else if (cjkReg.test(char)) {
2430
2523
  return Single$1;
2431
- }
2432
- else {
2524
+ } else {
2433
2525
  return Letter$1;
2434
2526
  }
2435
2527
  }
2436
2528
 
2437
2529
  const TextRowHelper = {
2438
2530
  trimRight(row) {
2439
- const { words } = row;
2531
+ const {words: words} = row;
2440
2532
  let trimRight = 0, len = words.length, char;
2441
2533
  for (let i = len - 1; i > -1; i--) {
2442
2534
  char = words[i].data[0];
2443
- if (char.char === ' ') {
2535
+ if (char.char === " ") {
2444
2536
  trimRight++;
2445
2537
  row.width -= char.width;
2446
- }
2447
- else {
2538
+ } else {
2448
2539
  break;
2449
2540
  }
2450
2541
  }
2451
- if (trimRight)
2452
- words.splice(len - trimRight, trimRight);
2542
+ if (trimRight) words.splice(len - trimRight, trimRight);
2453
2543
  }
2454
2544
  };
2455
2545
 
2456
2546
  function getTextCase(char, textCase, firstChar) {
2457
2547
  switch (textCase) {
2458
- case 'title':
2459
- return firstChar ? char.toUpperCase() : char;
2460
- case 'upper':
2461
- return char.toUpperCase();
2462
- case 'lower':
2463
- return char.toLowerCase();
2464
- default:
2465
- return char;
2548
+ case "title":
2549
+ return firstChar ? char.toUpperCase() : char;
2550
+
2551
+ case "upper":
2552
+ return char.toUpperCase();
2553
+
2554
+ case "lower":
2555
+ return char.toLowerCase();
2556
+
2557
+ default:
2558
+ return char;
2466
2559
  }
2467
2560
  }
2468
2561
 
2469
- const { trimRight } = TextRowHelper;
2470
- const { Letter, Single, Before, After, Symbol, Break } = CharType;
2562
+ const {trimRight: trimRight} = TextRowHelper;
2563
+
2564
+ const {Letter: Letter, Single: Single, Before: Before, After: After, Symbol: Symbol, Break: Break} = CharType;
2565
+
2471
2566
  let word, row, wordWidth, rowWidth, realWidth;
2567
+
2472
2568
  let char, charWidth, startCharSize, charSize, charType, lastCharType, langBreak, afterBreak, paraStart;
2569
+
2473
2570
  let textDrawData, rows = [], bounds, findMaxWidth;
2571
+
2474
2572
  function createRows(drawData, content, style) {
2475
2573
  textDrawData = drawData;
2476
2574
  rows = drawData.rows;
2477
2575
  bounds = drawData.bounds;
2478
2576
  findMaxWidth = !bounds.width && !style.autoSizeAlign;
2479
- const { __letterSpacing, paraIndent, textCase } = style;
2480
- const { canvas } = core.Platform;
2481
- const { width, height } = bounds;
2482
- const charMode = width || height || __letterSpacing || (textCase !== 'none');
2577
+ const {__letterSpacing: __letterSpacing, paraIndent: paraIndent, textCase: textCase} = style;
2578
+ const {canvas: canvas} = core.Platform;
2579
+ const {width: width, height: height} = bounds;
2580
+ const charMode = width || height || __letterSpacing || textCase !== "none";
2483
2581
  if (charMode) {
2484
- const wrap = style.textWrap !== 'none';
2485
- const breakAll = style.textWrap === 'break';
2582
+ const wrap = style.textWrap !== "none";
2583
+ const breakAll = style.textWrap === "break";
2486
2584
  paraStart = true;
2487
2585
  lastCharType = null;
2488
2586
  startCharSize = charWidth = charSize = wordWidth = rowWidth = 0;
2489
- word = { data: [] }, row = { words: [] };
2490
- if (__letterSpacing)
2491
- content = [...content];
2587
+ word = {
2588
+ data: []
2589
+ }, row = {
2590
+ words: []
2591
+ };
2592
+ if (__letterSpacing) content = [ ...content ];
2492
2593
  for (let i = 0, len = content.length; i < len; i++) {
2493
2594
  char = content[i];
2494
- if (char === '\n') {
2495
- if (wordWidth)
2496
- addWord();
2595
+ if (char === "\n") {
2596
+ if (wordWidth) addWord();
2497
2597
  row.paraEnd = true;
2498
2598
  addRow();
2499
2599
  paraStart = true;
2500
- }
2501
- else {
2600
+ } else {
2502
2601
  charType = getCharType(char);
2503
- if (charType === Letter && textCase !== 'none')
2504
- char = getTextCase(char, textCase, !wordWidth);
2602
+ if (charType === Letter && textCase !== "none") char = getTextCase(char, textCase, !wordWidth);
2505
2603
  charWidth = canvas.measureText(char).width;
2506
2604
  if (__letterSpacing) {
2507
- if (__letterSpacing < 0)
2508
- charSize = charWidth;
2605
+ if (__letterSpacing < 0) charSize = charWidth;
2509
2606
  charWidth += __letterSpacing;
2510
2607
  }
2511
- langBreak = (charType === Single && (lastCharType === Single || lastCharType === Letter)) || (lastCharType === Single && charType !== After);
2512
- afterBreak = ((charType === Before || charType === Single) && (lastCharType === Symbol || lastCharType === After));
2608
+ langBreak = charType === Single && (lastCharType === Single || lastCharType === Letter) || lastCharType === Single && charType !== After;
2609
+ afterBreak = (charType === Before || charType === Single) && (lastCharType === Symbol || lastCharType === After);
2513
2610
  realWidth = paraStart && paraIndent ? width - paraIndent : width;
2514
2611
  if (wrap && (width && rowWidth + wordWidth + charWidth > realWidth)) {
2515
2612
  if (breakAll) {
2516
- if (wordWidth)
2517
- addWord();
2518
- if (rowWidth)
2519
- addRow();
2520
- }
2521
- else {
2522
- if (!afterBreak)
2523
- afterBreak = charType === Letter && lastCharType == After;
2524
- if (langBreak || afterBreak || charType === Break || charType === Before || charType === Single || (wordWidth + charWidth > realWidth)) {
2525
- if (wordWidth)
2526
- addWord();
2527
- if (rowWidth)
2528
- addRow();
2529
- }
2530
- else {
2531
- if (rowWidth)
2532
- addRow();
2613
+ if (wordWidth) addWord();
2614
+ if (rowWidth) addRow();
2615
+ } else {
2616
+ if (!afterBreak) afterBreak = charType === Letter && lastCharType == After;
2617
+ if (langBreak || afterBreak || charType === Break || charType === Before || charType === Single || wordWidth + charWidth > realWidth) {
2618
+ if (wordWidth) addWord();
2619
+ if (rowWidth) addRow();
2620
+ } else {
2621
+ if (rowWidth) addRow();
2533
2622
  }
2534
2623
  }
2535
2624
  }
2536
- if (char === ' ' && paraStart !== true && (rowWidth + wordWidth) === 0) ;
2537
- else {
2625
+ if (char === " " && paraStart !== true && rowWidth + wordWidth === 0) ; else {
2538
2626
  if (charType === Break) {
2539
- if (char === ' ' && wordWidth)
2540
- addWord();
2627
+ if (char === " " && wordWidth) addWord();
2541
2628
  addChar(char, charWidth);
2542
2629
  addWord();
2543
- }
2544
- else if (langBreak || afterBreak) {
2545
- if (wordWidth)
2546
- addWord();
2630
+ } else if (langBreak || afterBreak) {
2631
+ if (wordWidth) addWord();
2547
2632
  addChar(char, charWidth);
2548
- }
2549
- else {
2633
+ } else {
2550
2634
  addChar(char, charWidth);
2551
2635
  }
2552
2636
  }
2553
2637
  lastCharType = charType;
2554
2638
  }
2555
2639
  }
2556
- if (wordWidth)
2557
- addWord();
2558
- if (rowWidth)
2559
- addRow();
2640
+ if (wordWidth) addWord();
2641
+ if (rowWidth) addRow();
2560
2642
  rows.length > 0 && (rows[rows.length - 1].paraEnd = true);
2561
- }
2562
- else {
2563
- content.split('\n').forEach(content => {
2643
+ } else {
2644
+ content.split("\n").forEach(content => {
2564
2645
  textDrawData.paraNumber++;
2565
2646
  rowWidth = canvas.measureText(content).width;
2566
- rows.push({ x: paraIndent || 0, text: content, width: rowWidth, paraStart: true });
2567
- if (findMaxWidth)
2568
- setMaxWidth();
2647
+ rows.push({
2648
+ x: paraIndent || 0,
2649
+ text: content,
2650
+ width: rowWidth,
2651
+ paraStart: true
2652
+ });
2653
+ if (findMaxWidth) setMaxWidth();
2569
2654
  });
2570
2655
  }
2571
2656
  }
2657
+
2572
2658
  function addChar(char, width) {
2573
- if (charSize && !startCharSize)
2574
- startCharSize = charSize;
2575
- word.data.push({ char, width });
2659
+ if (charSize && !startCharSize) startCharSize = charSize;
2660
+ word.data.push({
2661
+ char: char,
2662
+ width: width
2663
+ });
2576
2664
  wordWidth += width;
2577
2665
  }
2666
+
2578
2667
  function addWord() {
2579
2668
  rowWidth += wordWidth;
2580
2669
  word.width = wordWidth;
2581
2670
  row.words.push(word);
2582
- word = { data: [] };
2671
+ word = {
2672
+ data: []
2673
+ };
2583
2674
  wordWidth = 0;
2584
2675
  }
2676
+
2585
2677
  function addRow() {
2586
2678
  if (paraStart) {
2587
2679
  textDrawData.paraNumber++;
@@ -2594,52 +2686,53 @@ function addRow() {
2594
2686
  startCharSize = 0;
2595
2687
  }
2596
2688
  row.width = rowWidth;
2597
- if (bounds.width)
2598
- trimRight(row);
2599
- else if (findMaxWidth)
2600
- setMaxWidth();
2689
+ if (bounds.width) trimRight(row); else if (findMaxWidth) setMaxWidth();
2601
2690
  rows.push(row);
2602
- row = { words: [] };
2691
+ row = {
2692
+ words: []
2693
+ };
2603
2694
  rowWidth = 0;
2604
2695
  }
2696
+
2605
2697
  function setMaxWidth() {
2606
- if (rowWidth > (textDrawData.maxWidth || 0))
2607
- textDrawData.maxWidth = rowWidth;
2698
+ if (rowWidth > (textDrawData.maxWidth || 0)) textDrawData.maxWidth = rowWidth;
2608
2699
  }
2609
2700
 
2610
2701
  const CharMode = 0;
2702
+
2611
2703
  const WordMode = 1;
2704
+
2612
2705
  const TextMode = 2;
2706
+
2613
2707
  function layoutChar(drawData, style, width, _height) {
2614
- const { rows } = drawData;
2615
- const { textAlign, paraIndent, letterSpacing } = style;
2708
+ const {rows: rows} = drawData;
2709
+ const {textAlign: textAlign, paraIndent: paraIndent, letterSpacing: letterSpacing} = style;
2616
2710
  let charX, addWordWidth, indentWidth, mode, wordChar, wordsLength;
2617
2711
  rows.forEach(row => {
2618
2712
  if (row.words) {
2619
2713
  indentWidth = paraIndent && row.paraStart ? paraIndent : 0, wordsLength = row.words.length;
2620
- addWordWidth = (width && (textAlign === 'justify' || textAlign === 'both') && wordsLength > 1) ? (width - row.width - indentWidth) / (wordsLength - 1) : 0;
2621
- mode = (letterSpacing || row.isOverflow) ? CharMode : (addWordWidth > 0.01 ? WordMode : TextMode);
2622
- if (row.isOverflow && !letterSpacing)
2623
- row.textMode = true;
2714
+ addWordWidth = width && (textAlign === "justify" || textAlign === "both") && wordsLength > 1 ? (width - row.width - indentWidth) / (wordsLength - 1) : 0;
2715
+ mode = letterSpacing || row.isOverflow ? CharMode : addWordWidth > .01 ? WordMode : TextMode;
2716
+ if (row.isOverflow && !letterSpacing) row.textMode = true;
2624
2717
  if (mode === TextMode) {
2625
2718
  row.x += indentWidth;
2626
2719
  toTextChar$1(row);
2627
- }
2628
- else {
2720
+ } else {
2629
2721
  row.x += indentWidth;
2630
2722
  charX = row.x;
2631
2723
  row.data = [];
2632
2724
  row.words.forEach((word, index) => {
2633
2725
  if (mode === WordMode) {
2634
- wordChar = { char: '', x: charX };
2726
+ wordChar = {
2727
+ char: "",
2728
+ x: charX
2729
+ };
2635
2730
  charX = toWordChar(word.data, charX, wordChar);
2636
- if (row.isOverflow || wordChar.char !== ' ')
2637
- row.data.push(wordChar);
2638
- }
2639
- else {
2731
+ if (row.isOverflow || wordChar.char !== " ") row.data.push(wordChar);
2732
+ } else {
2640
2733
  charX = toChar(word.data, charX, row.data, row.isOverflow);
2641
2734
  }
2642
- if (addWordWidth && (!row.paraEnd || textAlign === 'both') && (index !== wordsLength - 1)) {
2735
+ if (addWordWidth && (!row.paraEnd || textAlign === "both") && index !== wordsLength - 1) {
2643
2736
  charX += addWordWidth;
2644
2737
  row.width += addWordWidth;
2645
2738
  }
@@ -2649,14 +2742,16 @@ function layoutChar(drawData, style, width, _height) {
2649
2742
  }
2650
2743
  });
2651
2744
  }
2745
+
2652
2746
  function toTextChar$1(row) {
2653
- row.text = '';
2747
+ row.text = "";
2654
2748
  row.words.forEach(word => {
2655
2749
  word.data.forEach(char => {
2656
2750
  row.text += char.char;
2657
2751
  });
2658
2752
  });
2659
2753
  }
2754
+
2660
2755
  function toWordChar(data, charX, wordChar) {
2661
2756
  data.forEach(char => {
2662
2757
  wordChar.char += char.char;
@@ -2664,9 +2759,10 @@ function toWordChar(data, charX, wordChar) {
2664
2759
  });
2665
2760
  return charX;
2666
2761
  }
2762
+
2667
2763
  function toChar(data, charX, rowData, isOverflow) {
2668
2764
  data.forEach(char => {
2669
- if (isOverflow || char.char !== ' ') {
2765
+ if (isOverflow || char.char !== " ") {
2670
2766
  char.x = charX;
2671
2767
  rowData.push(char);
2672
2768
  }
@@ -2676,38 +2772,39 @@ function toChar(data, charX, rowData, isOverflow) {
2676
2772
  }
2677
2773
 
2678
2774
  function layoutText(drawData, style) {
2679
- const { rows, bounds } = drawData, countRows = rows.length;
2680
- const { __lineHeight, __baseLine, __letterSpacing, __clipText, textAlign, verticalAlign, paraSpacing, autoSizeAlign } = style;
2681
- let { x, y, width, height } = bounds, realHeight = __lineHeight * countRows + (paraSpacing ? paraSpacing * (drawData.paraNumber - 1) : 0);
2775
+ const {rows: rows, bounds: bounds} = drawData, countRows = rows.length;
2776
+ const {__lineHeight: __lineHeight, __baseLine: __baseLine, __letterSpacing: __letterSpacing, __clipText: __clipText, textAlign: textAlign, verticalAlign: verticalAlign, paraSpacing: paraSpacing, autoSizeAlign: autoSizeAlign} = style;
2777
+ let {x: x, y: y, width: width, height: height} = bounds, realHeight = __lineHeight * countRows + (paraSpacing ? paraSpacing * (drawData.paraNumber - 1) : 0);
2682
2778
  let starY = __baseLine;
2683
2779
  if (__clipText && realHeight > height) {
2684
2780
  realHeight = Math.max(height, __lineHeight);
2685
- if (countRows > 1)
2686
- drawData.overflow = countRows;
2687
- }
2688
- else if (height || autoSizeAlign) {
2781
+ if (countRows > 1) drawData.overflow = countRows;
2782
+ } else if (height || autoSizeAlign) {
2689
2783
  switch (verticalAlign) {
2690
- case 'middle':
2691
- y += (height - realHeight) / 2;
2692
- break;
2693
- case 'bottom': y += (height - realHeight);
2784
+ case "middle":
2785
+ y += (height - realHeight) / 2;
2786
+ break;
2787
+
2788
+ case "bottom":
2789
+ y += height - realHeight;
2694
2790
  }
2695
2791
  }
2696
2792
  starY += y;
2697
- let row, rowX, rowWidth, layoutWidth = (width || autoSizeAlign) ? width : drawData.maxWidth;
2793
+ let row, rowX, rowWidth, layoutWidth = width || autoSizeAlign ? width : drawData.maxWidth;
2698
2794
  for (let i = 0, len = countRows; i < len; i++) {
2699
2795
  row = rows[i];
2700
2796
  row.x = x;
2701
- if (row.width < width || (row.width > width && !__clipText)) {
2797
+ if (row.width < width || row.width > width && !__clipText) {
2702
2798
  switch (textAlign) {
2703
- case 'center':
2704
- row.x += (layoutWidth - row.width) / 2;
2705
- break;
2706
- case 'right': row.x += layoutWidth - row.width;
2799
+ case "center":
2800
+ row.x += (layoutWidth - row.width) / 2;
2801
+ break;
2802
+
2803
+ case "right":
2804
+ row.x += layoutWidth - row.width;
2707
2805
  }
2708
2806
  }
2709
- if (row.paraStart && paraSpacing && i > 0)
2710
- starY += paraSpacing;
2807
+ if (row.paraStart && paraSpacing && i > 0) starY += paraSpacing;
2711
2808
  row.y = starY;
2712
2809
  starY += __lineHeight;
2713
2810
  if (drawData.overflow > i && starY > realHeight) {
@@ -2721,19 +2818,15 @@ function layoutText(drawData, style) {
2721
2818
  rowWidth = -row.width + style.fontSize + __letterSpacing;
2722
2819
  rowX -= rowWidth;
2723
2820
  rowWidth += style.fontSize;
2724
- }
2725
- else {
2821
+ } else {
2726
2822
  rowWidth -= __letterSpacing;
2727
2823
  }
2728
2824
  }
2729
- if (rowX < bounds.x)
2730
- bounds.x = rowX;
2731
- if (rowWidth > bounds.width)
2732
- bounds.width = rowWidth;
2825
+ if (rowX < bounds.x) bounds.x = rowX;
2826
+ if (rowWidth > bounds.width) bounds.width = rowWidth;
2733
2827
  if (__clipText && width && width < rowWidth) {
2734
2828
  row.isOverflow = true;
2735
- if (!drawData.overflow)
2736
- drawData.overflow = rows.length;
2829
+ if (!drawData.overflow) drawData.overflow = rows.length;
2737
2830
  }
2738
2831
  }
2739
2832
  bounds.y = y;
@@ -2741,20 +2834,16 @@ function layoutText(drawData, style) {
2741
2834
  }
2742
2835
 
2743
2836
  function clipText(drawData, style, x, width) {
2744
- if (!width)
2745
- return;
2746
- const { rows, overflow } = drawData;
2747
- let { textOverflow } = style;
2837
+ if (!width) return;
2838
+ const {rows: rows, overflow: overflow} = drawData;
2839
+ let {textOverflow: textOverflow} = style;
2748
2840
  rows.splice(overflow);
2749
- if (textOverflow && textOverflow !== 'show') {
2750
- if (textOverflow === 'hide')
2751
- textOverflow = '';
2752
- else if (textOverflow === 'ellipsis')
2753
- textOverflow = '...';
2841
+ if (textOverflow && textOverflow !== "show") {
2842
+ if (textOverflow === "hide") textOverflow = ""; else if (textOverflow === "ellipsis") textOverflow = "...";
2754
2843
  let char, charRight;
2755
2844
  const ellipsisWidth = textOverflow ? core.Platform.canvas.measureText(textOverflow).width : 0;
2756
2845
  const right = x + width - ellipsisWidth;
2757
- const list = style.textWrap === 'none' ? rows : [rows[overflow - 1]];
2846
+ const list = style.textWrap === "none" ? rows : [ rows[overflow - 1] ];
2758
2847
  list.forEach(row => {
2759
2848
  if (row.isOverflow && row.data) {
2760
2849
  let end = row.data.length - 1;
@@ -2763,8 +2852,7 @@ function clipText(drawData, style, x, width) {
2763
2852
  charRight = char.x + char.width;
2764
2853
  if (i === end && charRight < right) {
2765
2854
  break;
2766
- }
2767
- else if ((charRight < right && char.char !== ' ') || !i) {
2855
+ } else if (charRight < right && char.char !== " " || !i) {
2768
2856
  row.data.splice(i + 1);
2769
2857
  row.width -= char.width;
2770
2858
  break;
@@ -2772,15 +2860,18 @@ function clipText(drawData, style, x, width) {
2772
2860
  row.width -= char.width;
2773
2861
  }
2774
2862
  row.width += ellipsisWidth;
2775
- row.data.push({ char: textOverflow, x: charRight });
2776
- if (row.textMode)
2777
- toTextChar(row);
2863
+ row.data.push({
2864
+ char: textOverflow,
2865
+ x: charRight
2866
+ });
2867
+ if (row.textMode) toTextChar(row);
2778
2868
  }
2779
2869
  });
2780
2870
  }
2781
2871
  }
2872
+
2782
2873
  function toTextChar(row) {
2783
- row.text = '';
2874
+ row.text = "";
2784
2875
  row.data.forEach(char => {
2785
2876
  row.text += char.char;
2786
2877
  });
@@ -2789,145 +2880,163 @@ function toTextChar(row) {
2789
2880
 
2790
2881
  function decorationText(drawData, style) {
2791
2882
  let type;
2792
- const { fontSize, textDecoration } = style;
2883
+ const {fontSize: fontSize, textDecoration: textDecoration} = style;
2793
2884
  drawData.decorationHeight = fontSize / 11;
2794
- if (typeof textDecoration === 'object') {
2885
+ if (core.isObject(textDecoration)) {
2795
2886
  type = textDecoration.type;
2796
- if (textDecoration.color)
2797
- drawData.decorationColor = draw.ColorConvert.string(textDecoration.color);
2798
- }
2799
- else
2800
- type = textDecoration;
2887
+ if (textDecoration.color) drawData.decorationColor = draw.ColorConvert.string(textDecoration.color);
2888
+ } else type = textDecoration;
2801
2889
  switch (type) {
2802
- case 'under':
2803
- drawData.decorationY = [fontSize * 0.15];
2804
- break;
2805
- case 'delete':
2806
- drawData.decorationY = [-fontSize * 0.35];
2807
- break;
2808
- case 'under-delete':
2809
- drawData.decorationY = [fontSize * 0.15, -fontSize * 0.35];
2890
+ case "under":
2891
+ drawData.decorationY = [ fontSize * .15 ];
2892
+ break;
2893
+
2894
+ case "delete":
2895
+ drawData.decorationY = [ -fontSize * .35 ];
2896
+ break;
2897
+
2898
+ case "under-delete":
2899
+ drawData.decorationY = [ fontSize * .15, -fontSize * .35 ];
2810
2900
  }
2811
2901
  }
2812
2902
 
2813
- const { top, right, bottom, left } = core.Direction4;
2903
+ const {top: top, right: right, bottom: bottom, left: left} = core.Direction4;
2904
+
2814
2905
  function getDrawData(content, style) {
2815
- if (typeof content !== 'string')
2816
- content = String(content);
2906
+ if (!core.isString(content)) content = String(content);
2817
2907
  let x = 0, y = 0;
2818
- let width = style.__getInput('width') || 0;
2819
- let height = style.__getInput('height') || 0;
2820
- const { textDecoration, __font, __padding: padding } = style;
2908
+ let width = style.__getInput("width") || 0;
2909
+ let height = style.__getInput("height") || 0;
2910
+ const {textDecoration: textDecoration, __font: __font, __padding: padding} = style;
2821
2911
  if (padding) {
2822
- if (width)
2823
- x = padding[left], width -= (padding[right] + padding[left]);
2824
- else if (!style.autoSizeAlign)
2825
- x = padding[left];
2826
- if (height)
2827
- y = padding[top], height -= (padding[top] + padding[bottom]);
2828
- else if (!style.autoSizeAlign)
2829
- y = padding[top];
2912
+ if (width) x = padding[left], width -= padding[right] + padding[left]; else if (!style.autoSizeAlign) x = padding[left];
2913
+ if (height) y = padding[top], height -= padding[top] + padding[bottom]; else if (!style.autoSizeAlign) y = padding[top];
2830
2914
  }
2831
2915
  const drawData = {
2832
- bounds: { x, y, width, height },
2916
+ bounds: {
2917
+ x: x,
2918
+ y: y,
2919
+ width: width,
2920
+ height: height
2921
+ },
2833
2922
  rows: [],
2834
2923
  paraNumber: 0,
2835
2924
  font: core.Platform.canvas.font = __font
2836
2925
  };
2837
2926
  createRows(drawData, content, style);
2838
- if (padding)
2839
- padAutoText(padding, drawData, style, width, height);
2927
+ if (padding) padAutoText(padding, drawData, style, width, height);
2840
2928
  layoutText(drawData, style);
2841
2929
  layoutChar(drawData, style, width);
2842
- if (drawData.overflow)
2843
- clipText(drawData, style, x, width);
2844
- if (textDecoration !== 'none')
2845
- decorationText(drawData, style);
2930
+ if (drawData.overflow) clipText(drawData, style, x, width);
2931
+ if (textDecoration !== "none") decorationText(drawData, style);
2846
2932
  return drawData;
2847
2933
  }
2934
+
2848
2935
  function padAutoText(padding, drawData, style, width, height) {
2849
2936
  if (!width && style.autoSizeAlign) {
2850
2937
  switch (style.textAlign) {
2851
- case 'left':
2852
- offsetText(drawData, 'x', padding[left]);
2853
- break;
2854
- case 'right': offsetText(drawData, 'x', -padding[right]);
2938
+ case "left":
2939
+ offsetText(drawData, "x", padding[left]);
2940
+ break;
2941
+
2942
+ case "right":
2943
+ offsetText(drawData, "x", -padding[right]);
2855
2944
  }
2856
2945
  }
2857
2946
  if (!height && style.autoSizeAlign) {
2858
2947
  switch (style.verticalAlign) {
2859
- case 'top':
2860
- offsetText(drawData, 'y', padding[top]);
2861
- break;
2862
- case 'bottom': offsetText(drawData, 'y', -padding[bottom]);
2948
+ case "top":
2949
+ offsetText(drawData, "y", padding[top]);
2950
+ break;
2951
+
2952
+ case "bottom":
2953
+ offsetText(drawData, "y", -padding[bottom]);
2863
2954
  }
2864
2955
  }
2865
2956
  }
2957
+
2866
2958
  function offsetText(drawData, attrName, value) {
2867
- const { bounds, rows } = drawData;
2959
+ const {bounds: bounds, rows: rows} = drawData;
2868
2960
  bounds[attrName] += value;
2869
- for (let i = 0; i < rows.length; i++)
2870
- rows[i][attrName] += value;
2961
+ for (let i = 0; i < rows.length; i++) rows[i][attrName] += value;
2871
2962
  }
2872
2963
 
2873
2964
  const TextConvertModule = {
2874
- getDrawData
2965
+ getDrawData: getDrawData
2875
2966
  };
2876
2967
 
2877
2968
  function string(color, opacity) {
2878
- const doOpacity = typeof opacity === 'number' && opacity !== 1;
2879
- if (typeof color === 'string') {
2880
- if (doOpacity && draw.ColorConvert.object)
2881
- color = draw.ColorConvert.object(color);
2882
- else
2883
- return color;
2969
+ const doOpacity = core.isNumber(opacity) && opacity < 1;
2970
+ if (core.isString(color)) {
2971
+ if (doOpacity && draw.ColorConvert.object) color = draw.ColorConvert.object(color); else return color;
2884
2972
  }
2885
- let a = color.a === undefined ? 1 : color.a;
2886
- if (doOpacity)
2887
- a *= opacity;
2888
- const rgb = color.r + ',' + color.g + ',' + color.b;
2889
- return a === 1 ? 'rgb(' + rgb + ')' : 'rgba(' + rgb + ',' + a + ')';
2973
+ let a = core.isUndefined(color.a) ? 1 : color.a;
2974
+ if (doOpacity) a *= opacity;
2975
+ const rgb = color.r + "," + color.g + "," + color.b;
2976
+ return a === 1 ? "rgb(" + rgb + ")" : "rgba(" + rgb + "," + a + ")";
2890
2977
  }
2891
2978
 
2892
2979
  const ColorConvertModule = {
2893
- string
2980
+ string: string
2894
2981
  };
2895
2982
 
2896
2983
  Object.assign(draw.TextConvert, TextConvertModule);
2984
+
2897
2985
  Object.assign(draw.ColorConvert, ColorConvertModule);
2986
+
2898
2987
  Object.assign(draw.Paint, PaintModule);
2988
+
2899
2989
  Object.assign(draw.PaintImage, PaintImageModule);
2990
+
2900
2991
  Object.assign(draw.PaintGradient, PaintGradientModule);
2992
+
2901
2993
  Object.assign(draw.Effect, EffectModule);
2902
2994
 
2903
2995
  Object.assign(core.Creator, {
2904
2996
  interaction: (target, canvas, selector, options) => new Interaction(target, canvas, selector, options),
2905
2997
  hitCanvas: (options, manager) => new LeaferCanvas(options, manager),
2906
- hitCanvasManager: () => new core$1.HitCanvasManager()
2998
+ hitCanvasManager: () => new core$1.HitCanvasManager
2907
2999
  });
3000
+
2908
3001
  useCanvas();
2909
3002
 
2910
3003
  Object.defineProperty(exports, "LeaferImage", {
2911
3004
  enumerable: true,
2912
- get: function () { return core.LeaferImage; }
3005
+ get: function() {
3006
+ return core.LeaferImage;
3007
+ }
2913
3008
  });
3009
+
2914
3010
  exports.Interaction = Interaction;
3011
+
2915
3012
  exports.Layouter = Layouter;
3013
+
2916
3014
  exports.LeaferCanvas = LeaferCanvas;
3015
+
2917
3016
  exports.Picker = Picker;
3017
+
2918
3018
  exports.Renderer = Renderer;
3019
+
2919
3020
  exports.Selector = Selector;
3021
+
2920
3022
  exports.Watcher = Watcher;
3023
+
2921
3024
  exports.useCanvas = useCanvas;
2922
- Object.keys(core).forEach(function (k) {
2923
- if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
3025
+
3026
+ Object.keys(core).forEach(function(k) {
3027
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
2924
3028
  enumerable: true,
2925
- get: function () { return core[k]; }
3029
+ get: function() {
3030
+ return core[k];
3031
+ }
2926
3032
  });
2927
3033
  });
2928
- Object.keys(core$1).forEach(function (k) {
2929
- if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
3034
+
3035
+ Object.keys(core$1).forEach(function(k) {
3036
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
2930
3037
  enumerable: true,
2931
- get: function () { return core$1[k]; }
3038
+ get: function() {
3039
+ return core$1[k];
3040
+ }
2932
3041
  });
2933
3042
  });