@leafer-ui/miniapp 1.0.0-rc.3 → 1.0.0-rc.4
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/miniapp.esm.js +43 -28
- package/dist/miniapp.esm.min.js +1 -1
- package/dist/miniapp.module.js +76 -54
- package/dist/miniapp.module.min.js +1 -1
- package/package.json +6 -6
package/dist/miniapp.module.js
CHANGED
|
@@ -647,7 +647,7 @@ const BoundsHelper = {
|
|
|
647
647
|
},
|
|
648
648
|
getFitMatrix(t, put) {
|
|
649
649
|
const scale = Math.min(1, Math.min(t.width / put.width, t.height / put.height));
|
|
650
|
-
return new Matrix(scale, 0, 0, scale, -put.x * scale, -put.y * scale);
|
|
650
|
+
return new Matrix(scale, 0, 0, scale, -Math.ceil(put.x * scale), -Math.ceil(put.y * scale));
|
|
651
651
|
},
|
|
652
652
|
getSpread(t, spreadX, spreadY) {
|
|
653
653
|
const n = {};
|
|
@@ -4591,7 +4591,8 @@ class InteractionBase {
|
|
|
4591
4591
|
dragDistance: 2,
|
|
4592
4592
|
swipeDistance: 20,
|
|
4593
4593
|
ignoreMove: false
|
|
4594
|
-
}
|
|
4594
|
+
},
|
|
4595
|
+
cursor: {}
|
|
4595
4596
|
};
|
|
4596
4597
|
this.tapCount = 0;
|
|
4597
4598
|
this.downKeyMap = {};
|
|
@@ -4817,6 +4818,8 @@ class InteractionBase {
|
|
|
4817
4818
|
this.hoverData = data;
|
|
4818
4819
|
}
|
|
4819
4820
|
updateCursor(data) {
|
|
4821
|
+
if (this.config.cursor.stop)
|
|
4822
|
+
return;
|
|
4820
4823
|
if (!data) {
|
|
4821
4824
|
this.updateHoverData();
|
|
4822
4825
|
data = this.hoverData;
|
|
@@ -4829,17 +4832,16 @@ class InteractionBase {
|
|
|
4829
4832
|
}
|
|
4830
4833
|
else if (!data || this.dragger.dragging)
|
|
4831
4834
|
return;
|
|
4832
|
-
const path = data.path;
|
|
4833
4835
|
let leaf;
|
|
4836
|
+
let cursor;
|
|
4837
|
+
const { path } = data;
|
|
4834
4838
|
for (let i = 0, len = path.length; i < len; i++) {
|
|
4835
4839
|
leaf = path.list[i];
|
|
4836
|
-
|
|
4837
|
-
|
|
4838
|
-
|
|
4839
|
-
return;
|
|
4840
|
-
}
|
|
4840
|
+
cursor = leaf.cursor;
|
|
4841
|
+
if (cursor)
|
|
4842
|
+
break;
|
|
4841
4843
|
}
|
|
4842
|
-
this.setCursor(
|
|
4844
|
+
this.setCursor(cursor);
|
|
4843
4845
|
}
|
|
4844
4846
|
setCursor(cursor) {
|
|
4845
4847
|
this.cursor = cursor;
|
|
@@ -5457,7 +5459,7 @@ const LeafRender = {
|
|
|
5457
5459
|
const tempCanvas = canvas.getSameCanvas(true);
|
|
5458
5460
|
this.__draw(tempCanvas, options);
|
|
5459
5461
|
const blendMode = this.__.isEraser ? 'destination-out' : this.__.blendMode;
|
|
5460
|
-
if (
|
|
5462
|
+
if (this.__hasMirror || options.matrix) {
|
|
5461
5463
|
canvas.copyWorldByReset(tempCanvas, null, null, blendMode);
|
|
5462
5464
|
}
|
|
5463
5465
|
else {
|
|
@@ -5526,7 +5528,12 @@ const BranchRender = {
|
|
|
5526
5528
|
this.__renderBranch(tempCanvas, options);
|
|
5527
5529
|
canvas.opacity = this.__worldOpacity;
|
|
5528
5530
|
const blendMode = this.__.isEraser ? 'destination-out' : this.__.blendMode;
|
|
5529
|
-
|
|
5531
|
+
if (this.__hasMirror || options.matrix) {
|
|
5532
|
+
canvas.copyWorld(tempCanvas, null, null, blendMode);
|
|
5533
|
+
}
|
|
5534
|
+
else {
|
|
5535
|
+
canvas.copyWorld(tempCanvas, this.__world, this.__world, blendMode);
|
|
5536
|
+
}
|
|
5530
5537
|
tempCanvas.recycle();
|
|
5531
5538
|
}
|
|
5532
5539
|
else {
|
|
@@ -7186,7 +7193,7 @@ class UIData extends LeafData {
|
|
|
7186
7193
|
if (typeof value === 'string' || !value) {
|
|
7187
7194
|
if (this.__isFills) {
|
|
7188
7195
|
this.__removeInput('fill');
|
|
7189
|
-
Paint.recycleImage(
|
|
7196
|
+
Paint.recycleImage('fill', this);
|
|
7190
7197
|
this.__isFills = false;
|
|
7191
7198
|
}
|
|
7192
7199
|
this._fill = value;
|
|
@@ -7202,7 +7209,7 @@ class UIData extends LeafData {
|
|
|
7202
7209
|
if (typeof value === 'string' || !value) {
|
|
7203
7210
|
if (this.__isStrokes) {
|
|
7204
7211
|
this.__removeInput('stroke');
|
|
7205
|
-
Paint.recycleImage(
|
|
7212
|
+
Paint.recycleImage('stroke', this);
|
|
7206
7213
|
this.__isStrokes = false;
|
|
7207
7214
|
}
|
|
7208
7215
|
this._stroke = value;
|
|
@@ -7454,11 +7461,11 @@ const UIRender = {
|
|
|
7454
7461
|
const { fill, stroke, __drawAfterFill } = this.__;
|
|
7455
7462
|
this.__drawRenderPath(canvas);
|
|
7456
7463
|
if (fill)
|
|
7457
|
-
Paint.fill(this, canvas
|
|
7464
|
+
Paint.fill(fill, this, canvas);
|
|
7458
7465
|
if (__drawAfterFill)
|
|
7459
7466
|
this.__drawAfterFill(canvas, options);
|
|
7460
7467
|
if (stroke)
|
|
7461
|
-
Paint.stroke(this, canvas,
|
|
7468
|
+
Paint.stroke(stroke, this, canvas, options);
|
|
7462
7469
|
},
|
|
7463
7470
|
__draw(canvas, options) {
|
|
7464
7471
|
if (this.__.__complex) {
|
|
@@ -7470,40 +7477,40 @@ const UIRender = {
|
|
|
7470
7477
|
if (shadow)
|
|
7471
7478
|
Effect.shadow(this, canvas, shape, options);
|
|
7472
7479
|
if (fill)
|
|
7473
|
-
this.__.__isFills ? Paint.fills(this, canvas
|
|
7480
|
+
this.__.__isFills ? Paint.fills(fill, this, canvas) : Paint.fill(fill, this, canvas);
|
|
7474
7481
|
if (__drawAfterFill)
|
|
7475
7482
|
this.__drawAfterFill(canvas, options);
|
|
7476
7483
|
if (innerShadow)
|
|
7477
7484
|
Effect.innerShadow(this, canvas, shape, options);
|
|
7478
7485
|
if (stroke)
|
|
7479
|
-
this.__.__isStrokes ? Paint.strokes(this, canvas,
|
|
7486
|
+
this.__.__isStrokes ? Paint.strokes(stroke, this, canvas, options) : Paint.stroke(stroke, this, canvas, options);
|
|
7480
7487
|
if (shape.worldCanvas)
|
|
7481
7488
|
shape.worldCanvas.recycle();
|
|
7482
7489
|
shape.canvas.recycle();
|
|
7483
7490
|
}
|
|
7484
7491
|
else {
|
|
7485
7492
|
if (fill)
|
|
7486
|
-
this.__.__isFills ? Paint.fills(this, canvas
|
|
7493
|
+
this.__.__isFills ? Paint.fills(fill, this, canvas) : Paint.fill(fill, this, canvas);
|
|
7487
7494
|
if (__drawAfterFill)
|
|
7488
7495
|
this.__drawAfterFill(canvas, options);
|
|
7489
7496
|
if (stroke)
|
|
7490
|
-
this.__.__isStrokes ? Paint.strokes(this, canvas,
|
|
7497
|
+
this.__.__isStrokes ? Paint.strokes(stroke, this, canvas, options) : Paint.stroke(stroke, this, canvas, options);
|
|
7491
7498
|
}
|
|
7492
7499
|
}
|
|
7493
7500
|
else {
|
|
7494
7501
|
this.__drawFast(canvas, options);
|
|
7495
7502
|
}
|
|
7496
7503
|
},
|
|
7497
|
-
__renderShape(canvas,
|
|
7504
|
+
__renderShape(canvas, renderOptions) {
|
|
7498
7505
|
if (!this.__worldOpacity)
|
|
7499
7506
|
return;
|
|
7500
|
-
canvas.setWorld(this.__world,
|
|
7507
|
+
canvas.setWorld(this.__world, renderOptions.matrix);
|
|
7501
7508
|
const { fill, stroke } = this.__;
|
|
7502
7509
|
this.__drawRenderPath(canvas);
|
|
7503
7510
|
if (fill)
|
|
7504
|
-
Paint.fill(this, canvas
|
|
7511
|
+
Paint.fill('#000000', this, canvas);
|
|
7505
7512
|
if (stroke)
|
|
7506
|
-
Paint.stroke(this, canvas,
|
|
7513
|
+
Paint.stroke('#000000', this, canvas, renderOptions);
|
|
7507
7514
|
}
|
|
7508
7515
|
};
|
|
7509
7516
|
|
|
@@ -7572,9 +7579,9 @@ let UI = UI_1 = class UI extends Leaf {
|
|
|
7572
7579
|
if (this.__.__input) {
|
|
7573
7580
|
const { fill, stroke } = this.__.__input;
|
|
7574
7581
|
if (fill)
|
|
7575
|
-
Paint.compute(
|
|
7582
|
+
Paint.compute('fill', this);
|
|
7576
7583
|
if (stroke)
|
|
7577
|
-
Paint.compute(
|
|
7584
|
+
Paint.compute('stroke', this);
|
|
7578
7585
|
}
|
|
7579
7586
|
}
|
|
7580
7587
|
__updateRenderPath() {
|
|
@@ -7691,7 +7698,7 @@ __decorate([
|
|
|
7691
7698
|
hitType()
|
|
7692
7699
|
], UI.prototype, "hitRadius", void 0);
|
|
7693
7700
|
__decorate([
|
|
7694
|
-
cursorType('
|
|
7701
|
+
cursorType('')
|
|
7695
7702
|
], UI.prototype, "cursor", void 0);
|
|
7696
7703
|
__decorate([
|
|
7697
7704
|
surfaceType()
|
|
@@ -9154,7 +9161,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
9154
9161
|
}
|
|
9155
9162
|
}
|
|
9156
9163
|
|
|
9157
|
-
function recycleImage(
|
|
9164
|
+
function recycleImage(attrName, data) {
|
|
9158
9165
|
const paints = (attrName === 'fill' ? data._fill : data._stroke);
|
|
9159
9166
|
if (paints instanceof Array) {
|
|
9160
9167
|
let image, recycleMap, input, url;
|
|
@@ -9199,11 +9206,11 @@ function fillText(ui, canvas) {
|
|
|
9199
9206
|
}
|
|
9200
9207
|
}
|
|
9201
9208
|
|
|
9202
|
-
function fill(ui, canvas
|
|
9209
|
+
function fill(fill, ui, canvas) {
|
|
9203
9210
|
canvas.fillStyle = fill;
|
|
9204
9211
|
ui.__.__font ? fillText(ui, canvas) : (ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill());
|
|
9205
9212
|
}
|
|
9206
|
-
function fills(ui, canvas
|
|
9213
|
+
function fills(fills, ui, canvas) {
|
|
9207
9214
|
let item;
|
|
9208
9215
|
const { windingRule, __font } = ui.__;
|
|
9209
9216
|
for (let i = 0, len = fills.length; i < len; i++) {
|
|
@@ -9234,32 +9241,37 @@ function fills(ui, canvas, fills) {
|
|
|
9234
9241
|
}
|
|
9235
9242
|
}
|
|
9236
9243
|
|
|
9237
|
-
function strokeText(ui, canvas,
|
|
9244
|
+
function strokeText(stroke, ui, canvas, renderOptions) {
|
|
9238
9245
|
const { strokeAlign } = ui.__;
|
|
9239
9246
|
const isStrokes = typeof stroke !== 'string';
|
|
9240
9247
|
switch (strokeAlign) {
|
|
9241
9248
|
case 'center':
|
|
9242
9249
|
canvas.setStroke(isStrokes ? undefined : stroke, ui.__.strokeWidth, ui.__);
|
|
9243
|
-
isStrokes ? drawStrokesStyle(
|
|
9250
|
+
isStrokes ? drawStrokesStyle(stroke, true, ui, canvas) : drawTextStroke(ui, canvas);
|
|
9244
9251
|
break;
|
|
9245
9252
|
case 'inside':
|
|
9246
|
-
drawAlignStroke(
|
|
9253
|
+
drawAlignStroke('inside', stroke, isStrokes, ui, canvas, renderOptions);
|
|
9247
9254
|
break;
|
|
9248
9255
|
case 'outside':
|
|
9249
|
-
drawAlignStroke(
|
|
9256
|
+
drawAlignStroke('outside', stroke, isStrokes, ui, canvas, renderOptions);
|
|
9250
9257
|
break;
|
|
9251
9258
|
}
|
|
9252
9259
|
}
|
|
9253
|
-
function drawAlignStroke(
|
|
9260
|
+
function drawAlignStroke(align, stroke, isStrokes, ui, canvas, renderOptions) {
|
|
9254
9261
|
const { strokeWidth, __font } = ui.__;
|
|
9255
9262
|
const out = canvas.getSameCanvas(true);
|
|
9256
9263
|
out.setStroke(isStrokes ? undefined : stroke, strokeWidth * 2, ui.__);
|
|
9257
9264
|
out.font = __font;
|
|
9258
|
-
isStrokes ? drawStrokesStyle(
|
|
9265
|
+
isStrokes ? drawStrokesStyle(stroke, true, ui, out) : drawTextStroke(ui, out);
|
|
9259
9266
|
out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
|
|
9260
9267
|
fillText(ui, out);
|
|
9261
9268
|
out.blendMode = 'normal';
|
|
9262
|
-
|
|
9269
|
+
if (ui.__hasMirror || renderOptions.matrix) {
|
|
9270
|
+
canvas.copyWorldByReset(out);
|
|
9271
|
+
}
|
|
9272
|
+
else {
|
|
9273
|
+
canvas.copyWorldToInner(out, ui.__world, ui.__layout.renderBounds);
|
|
9274
|
+
}
|
|
9263
9275
|
out.recycle();
|
|
9264
9276
|
}
|
|
9265
9277
|
function drawTextStroke(ui, canvas) {
|
|
@@ -9279,7 +9291,7 @@ function drawTextStroke(ui, canvas) {
|
|
|
9279
9291
|
canvas.strokeRect(row.x, row.y + decorationY, row.width, decorationHeight);
|
|
9280
9292
|
}
|
|
9281
9293
|
}
|
|
9282
|
-
function drawStrokesStyle(
|
|
9294
|
+
function drawStrokesStyle(strokes, isText, ui, canvas) {
|
|
9283
9295
|
let item;
|
|
9284
9296
|
for (let i = 0, len = strokes.length; i < len; i++) {
|
|
9285
9297
|
item = strokes[i];
|
|
@@ -9299,13 +9311,13 @@ function drawStrokesStyle(ui, strokes, canvas, isText) {
|
|
|
9299
9311
|
}
|
|
9300
9312
|
}
|
|
9301
9313
|
|
|
9302
|
-
function stroke(ui, canvas,
|
|
9314
|
+
function stroke(stroke, ui, canvas, renderOptions) {
|
|
9303
9315
|
const options = ui.__;
|
|
9304
9316
|
const { strokeWidth, strokeAlign, __font } = options;
|
|
9305
9317
|
if (!strokeWidth)
|
|
9306
9318
|
return;
|
|
9307
9319
|
if (__font) {
|
|
9308
|
-
strokeText(ui, canvas,
|
|
9320
|
+
strokeText(stroke, ui, canvas, renderOptions);
|
|
9309
9321
|
}
|
|
9310
9322
|
else {
|
|
9311
9323
|
switch (strokeAlign) {
|
|
@@ -9327,31 +9339,36 @@ function stroke(ui, canvas, stroke) {
|
|
|
9327
9339
|
out.stroke();
|
|
9328
9340
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
9329
9341
|
out.clearWorld(ui.__layout.renderBounds);
|
|
9330
|
-
|
|
9342
|
+
if (ui.__hasMirror || renderOptions.matrix) {
|
|
9343
|
+
canvas.copyWorldByReset(out);
|
|
9344
|
+
}
|
|
9345
|
+
else {
|
|
9346
|
+
canvas.copyWorldToInner(out, ui.__world, ui.__layout.renderBounds);
|
|
9347
|
+
}
|
|
9331
9348
|
out.recycle();
|
|
9332
9349
|
break;
|
|
9333
9350
|
}
|
|
9334
9351
|
}
|
|
9335
9352
|
}
|
|
9336
|
-
function strokes(ui, canvas,
|
|
9353
|
+
function strokes(strokes, ui, canvas, renderOptions) {
|
|
9337
9354
|
const options = ui.__;
|
|
9338
9355
|
const { strokeWidth, strokeAlign, __font } = options;
|
|
9339
9356
|
if (!strokeWidth)
|
|
9340
9357
|
return;
|
|
9341
9358
|
if (__font) {
|
|
9342
|
-
strokeText(ui, canvas,
|
|
9359
|
+
strokeText(strokes, ui, canvas, renderOptions);
|
|
9343
9360
|
}
|
|
9344
9361
|
else {
|
|
9345
9362
|
switch (strokeAlign) {
|
|
9346
9363
|
case 'center':
|
|
9347
9364
|
canvas.setStroke(undefined, strokeWidth, options);
|
|
9348
|
-
drawStrokesStyle(
|
|
9365
|
+
drawStrokesStyle(strokes, false, ui, canvas);
|
|
9349
9366
|
break;
|
|
9350
9367
|
case 'inside':
|
|
9351
9368
|
canvas.save();
|
|
9352
9369
|
canvas.setStroke(undefined, strokeWidth * 2, options);
|
|
9353
9370
|
options.windingRule ? canvas.clip(options.windingRule) : canvas.clip();
|
|
9354
|
-
drawStrokesStyle(
|
|
9371
|
+
drawStrokesStyle(strokes, false, ui, canvas);
|
|
9355
9372
|
canvas.restore();
|
|
9356
9373
|
break;
|
|
9357
9374
|
case 'outside':
|
|
@@ -9359,10 +9376,15 @@ function strokes(ui, canvas, strokes) {
|
|
|
9359
9376
|
const out = canvas.getSameCanvas(true);
|
|
9360
9377
|
ui.__drawRenderPath(out);
|
|
9361
9378
|
out.setStroke(undefined, strokeWidth * 2, ui.__);
|
|
9362
|
-
drawStrokesStyle(
|
|
9379
|
+
drawStrokesStyle(strokes, false, ui, out);
|
|
9363
9380
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
9364
9381
|
out.clearWorld(renderBounds);
|
|
9365
|
-
|
|
9382
|
+
if (ui.__hasMirror || renderOptions.matrix) {
|
|
9383
|
+
canvas.copyWorldByReset(out);
|
|
9384
|
+
}
|
|
9385
|
+
else {
|
|
9386
|
+
canvas.copyWorldToInner(out, ui.__world, renderBounds);
|
|
9387
|
+
}
|
|
9366
9388
|
out.recycle();
|
|
9367
9389
|
break;
|
|
9368
9390
|
}
|
|
@@ -9494,21 +9516,21 @@ function conicGradient(paint, box) {
|
|
|
9494
9516
|
}
|
|
9495
9517
|
|
|
9496
9518
|
let recycleMap;
|
|
9497
|
-
function compute(
|
|
9519
|
+
function compute(attrName, ui) {
|
|
9498
9520
|
const value = [];
|
|
9499
9521
|
let item;
|
|
9500
9522
|
let paints = ui.__.__input[attrName];
|
|
9501
9523
|
if (!(paints instanceof Array))
|
|
9502
9524
|
paints = [paints];
|
|
9503
|
-
recycleMap = recycleImage(ui.__
|
|
9525
|
+
recycleMap = recycleImage(attrName, ui.__);
|
|
9504
9526
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
9505
|
-
item = getLeafPaint(
|
|
9527
|
+
item = getLeafPaint(attrName, paints[i], ui);
|
|
9506
9528
|
if (item)
|
|
9507
9529
|
value.push(item);
|
|
9508
9530
|
}
|
|
9509
9531
|
ui.__['_' + attrName] = value.length ? value : undefined;
|
|
9510
9532
|
}
|
|
9511
|
-
function getLeafPaint(
|
|
9533
|
+
function getLeafPaint(attrName, paint, ui) {
|
|
9512
9534
|
if (typeof paint !== 'object' || paint.visible === false || paint.opacity === 0)
|
|
9513
9535
|
return undefined;
|
|
9514
9536
|
const { boxBounds } = ui.__layout;
|
|
@@ -9546,7 +9568,7 @@ var UIPaint = /*#__PURE__*/Object.freeze({
|
|
|
9546
9568
|
const { copy, toOffsetOutBounds: toOffsetOutBounds$1 } = BoundsHelper;
|
|
9547
9569
|
const tempBounds = {};
|
|
9548
9570
|
const offsetOutBounds$1 = {};
|
|
9549
|
-
function shadow(ui, current, shape,
|
|
9571
|
+
function shadow(ui, current, shape, renderOptions) {
|
|
9550
9572
|
let copyBounds, spreadScale;
|
|
9551
9573
|
const { __world, __layout } = ui;
|
|
9552
9574
|
const { shadow } = ui.__;
|
|
@@ -9568,7 +9590,7 @@ function shadow(ui, current, shape, _options) {
|
|
|
9568
9590
|
}
|
|
9569
9591
|
worldCanvas ? other.copyWorld(worldCanvas, __world, __world, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
9570
9592
|
}
|
|
9571
|
-
if (ui.__hasMirror) {
|
|
9593
|
+
if (ui.__hasMirror || renderOptions.matrix) {
|
|
9572
9594
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
9573
9595
|
}
|
|
9574
9596
|
else {
|
|
@@ -9608,7 +9630,7 @@ function drawWorldShadow(canvas, outBounds, spreadScale, shape) {
|
|
|
9608
9630
|
|
|
9609
9631
|
const { toOffsetOutBounds } = BoundsHelper;
|
|
9610
9632
|
const offsetOutBounds = {};
|
|
9611
|
-
function innerShadow(ui, current, shape,
|
|
9633
|
+
function innerShadow(ui, current, shape, renderOptions) {
|
|
9612
9634
|
let copyBounds, spreadScale;
|
|
9613
9635
|
const { __world, __layout: __layout } = ui;
|
|
9614
9636
|
const { innerShadow } = ui.__;
|
|
@@ -9632,7 +9654,7 @@ function innerShadow(ui, current, shape, _options) {
|
|
|
9632
9654
|
copyBounds = bounds;
|
|
9633
9655
|
}
|
|
9634
9656
|
other.fillWorld(copyBounds, item.color, 'source-in');
|
|
9635
|
-
if (ui.__hasMirror) {
|
|
9657
|
+
if (ui.__hasMirror || renderOptions.matrix) {
|
|
9636
9658
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
9637
9659
|
}
|
|
9638
9660
|
else {
|