@leafer-ui/core 1.5.3 → 1.6.1

package/lib/core.esm.js

@@ -1,6 +1,6 @@
-import { Leafer, State, UI, ImageManager, Rect, Box, Group, Platform as Platform$1, Creator as Creator$1, emptyData } from '@leafer-ui/draw';
+import { Leafer, State, UI, Rect, Box, Text, Group, Platform as Platform$1, Creator as Creator$1, emptyData } from '@leafer-ui/draw';
 export * from '@leafer-ui/draw';
-import { registerUI, Creator, PropertyEvent, Debug, DataHelper, canvasSizeAttrs, LayoutEvent, RenderEvent, Event, EventCreator, registerUIEvent, LeafList, PointHelper, BoundsHelper, Platform, Bounds, ResizeEvent, LeaferEvent, CanvasManager, Leaf, Matrix, tempBounds, LeaferCanvasBase } from '@leafer/core';
+import { registerUI, Creator, DataHelper, canvasSizeAttrs, LayoutEvent, RenderEvent, Event, EventCreator, registerUIEvent, LeafList, PointHelper, BoundsHelper, Debug, Platform, Bounds, ResizeEvent, LeaferEvent, CanvasManager, Leaf, Matrix, tempBounds, ImageManager, LeaferCanvasBase } from '@leafer/core';
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -61,26 +61,25 @@ let App = class App extends Leafer {
         this.leafer = this;
         this.watcher.disable();
         this.layouter.disable();
-        this.__eventIds.push(this.on_(PropertyEvent.CHANGE, this.__onPropertyChange, this));
     }
     start() {
         super.start();
-        this.children.forEach(leafer => leafer.start());
+        this.forEach(leafer => leafer.start());
     }
     stop() {
-        this.children.forEach(leafer => leafer.stop());
+        this.forEach(leafer => leafer.stop());
         super.stop();
     }
     unlockLayout() {
         super.unlockLayout();
-        this.children.forEach(leafer => leafer.unlockLayout());
+        this.forEach(leafer => leafer.unlockLayout());
     }
     lockLayout() {
         super.lockLayout();
-        this.children.forEach(leafer => leafer.lockLayout());
+        this.forEach(leafer => leafer.lockLayout());
     }
     forceRender(bounds, sync) {
-        this.children.forEach(leafer => leafer.forceRender(bounds, sync));
+        this.forEach(leafer => leafer.forceRender(bounds, sync));
     }
     addLeafer(merge) {
         const leafer = new Leafer(merge);
@@ -100,9 +99,8 @@ let App = class App extends Leafer {
             leafer.canvas.childIndex = index;
         this.__listenChildEvents(leafer);
     }
-    __onPropertyChange() {
-        if (Debug.showHitView)
-            this.children.forEach(leafer => leafer.forceUpdate('surface'));
+    forEach(fn) {
+        this.children.forEach(fn);
     }
     __onCreated() {
         this.created = this.children.every(child => child.created);
@@ -125,18 +123,18 @@ let App = class App extends Leafer {
             const m = options.matrix;
             if (m)
                 canvas.setTransform(m.a, m.b, m.c, m.d, m.e, m.f);
-            this.children.forEach(leafer => canvas.copyWorld(leafer.canvas));
+            this.forEach(leafer => canvas.copyWorld(leafer.canvas));
         }
     }
     __onResize(event) {
-        this.children.forEach(leafer => leafer.resize(event));
+        this.forEach(leafer => leafer.resize(event));
         super.__onResize(event);
     }
     updateLayout() {
-        this.children.forEach(leafer => leafer.updateLayout());
+        this.forEach(leafer => leafer.updateLayout());
     }
     __getChildConfig(userConfig) {
-        let config = Object.assign({}, this.config);
+        const config = Object.assign({}, this.config);
         config.hittable = config.realCanvas = undefined;
         if (userConfig)
             DataHelper.assign(config, userConfig);
@@ -695,6 +693,7 @@ const config = {
         delta: { x: 80 / 4, y: 8.0 },
     },
     pointer: {
+        snap: true,
         hitRadius: 5,
         tapTime: 120,
         longPressTime: 800,
@@ -789,8 +788,7 @@ class InteractionBase {
         if (this.downData) {
             const canDrag = PointHelper.getDistance(this.downData, data) > this.p.dragDistance;
             if (canDrag) {
-                if (this.waitTap)
-                    this.pointerWaitCancel();
+                this.pointerWaitCancel();
                 this.waitRightTap = false;
             }
             this.dragger.checkDrag(data, canDrag);
@@ -1050,7 +1048,10 @@ class InteractionBase {
     }
     getLocal(clientPoint, updateClient) {
         const clientBounds = this.canvas.getClientBounds(updateClient);
-        return { x: clientPoint.clientX - clientBounds.x, y: clientPoint.clientY - clientBounds.y };
+        const point = { x: clientPoint.clientX - clientBounds.x, y: clientPoint.clientY - clientBounds.y };
+        if (this.p.snap)
+            PointHelper.round(point);
+        return point;
     }
     emitTap(data) {
         this.emit(PointerEvent.TAP, data);
@@ -1069,9 +1070,11 @@ class InteractionBase {
         this.waitTap = true;
     }
     tapWaitCancel() {
-        clearTimeout(this.tapTimer);
-        this.waitTap = false;
-        this.tapCount = 0;
+        if (this.waitTap) {
+            clearTimeout(this.tapTimer);
+            this.waitTap = false;
+            this.tapCount = 0;
+        }
     }
     longPressWait(data) {
         clearTimeout(this.longPressTimer);
@@ -1091,8 +1094,10 @@ class InteractionBase {
         return hasLong;
     }
     longPressWaitCancel() {
-        clearTimeout(this.longPressTimer);
-        this.longPressed = false;
+        if (this.longPressTimer) {
+            clearTimeout(this.longPressTimer);
+            this.longPressed = false;
+        }
     }
     __onResize() {
         const { dragOut } = this.m;
@@ -1182,25 +1187,26 @@ const { toInnerRadiusPointOf, copy, setRadius } = PointHelper;
 const inner = {};
 const leaf = Leaf.prototype;
 leaf.__hitWorld = function (point) {
-    if (!this.__.hitSelf)
+    const data = this.__;
+    if (!data.hitSelf)
         return false;
-    if (this.__.hitRadius) {
+    const world = this.__world, layout = this.__layout;
+    const isSmall = world.width < 10 && world.height < 10;
+    if (data.hitRadius) {
         copy(inner, point), point = inner;
-        setRadius(point, this.__.hitRadius);
+        setRadius(point, data.hitRadius);
     }
-    toInnerRadiusPointOf(point, this.__world, inner);
-    const { width, height } = this.__world;
-    const isSmall = width < 10 && height < 10;
-    if (this.__.hitBox || isSmall) {
-        if (BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner))
+    toInnerRadiusPointOf(point, world, inner);
+    if (data.hitBox || isSmall) {
+        if (BoundsHelper.hitRadiusPoint(layout.boxBounds, inner))
             return true;
         if (isSmall)
             return false;
     }
-    if (this.__layout.hitCanvasChanged || !this.__hitCanvas) {
+    if (layout.hitCanvasChanged || !this.__hitCanvas) {
         this.__updateHitCanvas();
-        if (!this.__layout.boundsChanged)
-            this.__layout.hitCanvasChanged = false;
+        if (!layout.boundsChanged)
+            layout.hitCanvasChanged = false;
     }
     return this.__hit(inner);
 };
@@ -1213,7 +1219,9 @@ leaf.__drawHitPath = function (canvas) { if (canvas)
 const matrix = new Matrix();
 const ui$1 = UI.prototype;
 ui$1.__updateHitCanvas = function () {
-    const data = this.__, { hitCanvasManager } = this.leafer;
+    if (this.__box)
+        this.__box.__updateHitCanvas();
+    const data = this.__, { hitCanvasManager } = this.leafer || this.parent.leafer;
     const isHitPixelFill = (data.__pixelFill || data.__isCanvas) && data.hitFill === 'pixel';
     const isHitPixelStroke = data.__pixelStroke && data.hitStroke === 'pixel';
     const isHitPixel = isHitPixelFill || isHitPixelStroke;
@@ -1240,6 +1248,8 @@ ui$1.__updateHitCanvas = function () {
     h.setStrokeOptions(data);
 };
 ui$1.__hit = function (inner) {
+    if (this.__box && this.__box.__hit(inner))
+        return true;
     const data = this.__;
     if (data.__isHitPixel && this.__hitPixel(inner))
         return true;
@@ -1288,6 +1298,15 @@ rect.__hitFill = box.__hitFill = function (inner) {
     return this.__hitCanvas ? ui.__hitFill.call(this, inner) : BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
 };
 
+Text.prototype.__drawHitPath = function (canvas) {
+    const { __lineHeight, fontSize, __baseLine, __letterSpacing, __textDrawData: data } = this.__;
+    canvas.beginPath();
+    if (__letterSpacing < 0)
+        this.__drawPathByBox(canvas);
+    else
+        data.rows.forEach(row => canvas.rect(row.x, row.y - __baseLine, row.width, __lineHeight < fontSize ? fontSize : __lineHeight));
+};
+
 function getSelector(ui) {
     return ui.leafer ? ui.leafer.selector : (Platform$1.selector || (Platform$1.selector = Creator$1.selector()));
 }