@leafer-ui/draw 1.3.1 → 1.3.3

package/lib/draw.esm.js

@@ -15,7 +15,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
 
 
 function __decorate(decorators, target, key, desc) {
@@ -114,6 +114,7 @@ class UIData extends LeafData {
         return t.fill && this.__hasStroke;
     }
     get __clipAfterFill() { const t = this; return (t.cornerRadius || t.innerShadow || t.__pathInputed); }
+    get __hasSurface() { const t = this; return (t.fill || t.stroke); }
     get __autoWidth() { return !this._width; }
     get __autoHeight() { return !this._height; }
     get __autoSide() { return !this._width || !this._height; }
@@ -586,7 +587,7 @@ let UI = UI_1 = class UI extends Leaf {
     animate(_keyframe, _options, _type, _isTemp) {
         return Plugin.need('animate');
     }
-    killAnimate(_type, _killStyle) { }
+    killAnimate(_type, _nextStyle) { }
     export(_filename, _options) {
         return Plugin.need('export');
     }
@@ -617,199 +618,199 @@ let UI = UI_1 = class UI extends Leaf {
 };
 __decorate([
     dataProcessor(UIData)
-], UI.prototype, "__", void 0);
+], UI.prototype, "__", undefined);
 __decorate([
     zoomLayerType()
-], UI.prototype, "zoomLayer", void 0);
+], UI.prototype, "zoomLayer", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "id", void 0);
+], UI.prototype, "id", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "name", void 0);
+], UI.prototype, "name", undefined);
 __decorate([
     dataType('')
-], UI.prototype, "className", void 0);
+], UI.prototype, "className", undefined);
 __decorate([
     surfaceType('pass-through')
-], UI.prototype, "blendMode", void 0);
+], UI.prototype, "blendMode", undefined);
 __decorate([
     opacityType(1)
-], UI.prototype, "opacity", void 0);
+], UI.prototype, "opacity", undefined);
 __decorate([
     visibleType(true)
-], UI.prototype, "visible", void 0);
+], UI.prototype, "visible", undefined);
 __decorate([
     surfaceType(false)
-], UI.prototype, "locked", void 0);
+], UI.prototype, "locked", undefined);
 __decorate([
     sortType(0)
-], UI.prototype, "zIndex", void 0);
+], UI.prototype, "zIndex", undefined);
 __decorate([
     maskType(false)
-], UI.prototype, "mask", void 0);
+], UI.prototype, "mask", undefined);
 __decorate([
     eraserType(false)
-], UI.prototype, "eraser", void 0);
+], UI.prototype, "eraser", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "x", void 0);
+], UI.prototype, "x", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "y", void 0);
+], UI.prototype, "y", undefined);
 __decorate([
     boundsType(100, true)
-], UI.prototype, "width", void 0);
+], UI.prototype, "width", undefined);
 __decorate([
     boundsType(100, true)
-], UI.prototype, "height", void 0);
+], UI.prototype, "height", undefined);
 __decorate([
     scaleType(1, true)
-], UI.prototype, "scaleX", void 0);
+], UI.prototype, "scaleX", undefined);
 __decorate([
     scaleType(1, true)
-], UI.prototype, "scaleY", void 0);
+], UI.prototype, "scaleY", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "rotation", void 0);
+], UI.prototype, "rotation", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "skewX", void 0);
+], UI.prototype, "skewX", undefined);
 __decorate([
     rotationType(0, true)
-], UI.prototype, "skewY", void 0);
+], UI.prototype, "skewY", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "offsetX", void 0);
+], UI.prototype, "offsetX", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "offsetY", void 0);
+], UI.prototype, "offsetY", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "scrollX", void 0);
+], UI.prototype, "scrollX", undefined);
 __decorate([
     positionType(0, true)
-], UI.prototype, "scrollY", void 0);
+], UI.prototype, "scrollY", undefined);
 __decorate([
     autoLayoutType()
-], UI.prototype, "origin", void 0);
+], UI.prototype, "origin", undefined);
 __decorate([
     autoLayoutType()
-], UI.prototype, "around", void 0);
+], UI.prototype, "around", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "lazy", void 0);
+], UI.prototype, "lazy", undefined);
 __decorate([
     naturalBoundsType(1)
-], UI.prototype, "pixelRatio", void 0);
+], UI.prototype, "pixelRatio", undefined);
 __decorate([
     pathInputType()
-], UI.prototype, "path", void 0);
+], UI.prototype, "path", undefined);
 __decorate([
     pathType()
-], UI.prototype, "windingRule", void 0);
+], UI.prototype, "windingRule", undefined);
 __decorate([
     pathType(true)
-], UI.prototype, "closed", void 0);
+], UI.prototype, "closed", undefined);
 __decorate([
     boundsType(0)
-], UI.prototype, "padding", void 0);
+], UI.prototype, "padding", undefined);
 __decorate([
     boundsType(false)
-], UI.prototype, "lockRatio", void 0);
+], UI.prototype, "lockRatio", undefined);
 __decorate([
     boundsType()
-], UI.prototype, "widthRange", void 0);
+], UI.prototype, "widthRange", undefined);
 __decorate([
     boundsType()
-], UI.prototype, "heightRange", void 0);
+], UI.prototype, "heightRange", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "draggable", void 0);
+], UI.prototype, "draggable", undefined);
 __decorate([
     dataType()
-], UI.prototype, "dragBounds", void 0);
+], UI.prototype, "dragBounds", undefined);
 __decorate([
     dataType(false)
-], UI.prototype, "editable", void 0);
+], UI.prototype, "editable", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hittable", void 0);
+], UI.prototype, "hittable", undefined);
 __decorate([
     hitType('path')
-], UI.prototype, "hitFill", void 0);
+], UI.prototype, "hitFill", undefined);
 __decorate([
     strokeType('path')
-], UI.prototype, "hitStroke", void 0);
+], UI.prototype, "hitStroke", undefined);
 __decorate([
     hitType(false)
-], UI.prototype, "hitBox", void 0);
+], UI.prototype, "hitBox", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hitChildren", void 0);
+], UI.prototype, "hitChildren", undefined);
 __decorate([
     hitType(true)
-], UI.prototype, "hitSelf", void 0);
+], UI.prototype, "hitSelf", undefined);
 __decorate([
     hitType()
-], UI.prototype, "hitRadius", void 0);
+], UI.prototype, "hitRadius", undefined);
 __decorate([
     cursorType('')
-], UI.prototype, "cursor", void 0);
+], UI.prototype, "cursor", undefined);
 __decorate([
     surfaceType()
-], UI.prototype, "fill", void 0);
+], UI.prototype, "fill", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "stroke", void 0);
+], UI.prototype, "stroke", undefined);
 __decorate([
     strokeType('inside')
-], UI.prototype, "strokeAlign", void 0);
+], UI.prototype, "strokeAlign", undefined);
 __decorate([
     strokeType(1)
-], UI.prototype, "strokeWidth", void 0);
+], UI.prototype, "strokeWidth", undefined);
 __decorate([
     strokeType(false)
-], UI.prototype, "strokeWidthFixed", void 0);
+], UI.prototype, "strokeWidthFixed", undefined);
 __decorate([
     strokeType('none')
-], UI.prototype, "strokeCap", void 0);
+], UI.prototype, "strokeCap", undefined);
 __decorate([
     strokeType('miter')
-], UI.prototype, "strokeJoin", void 0);
+], UI.prototype, "strokeJoin", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "dashPattern", void 0);
+], UI.prototype, "dashPattern", undefined);
 __decorate([
     strokeType()
-], UI.prototype, "dashOffset", void 0);
+], UI.prototype, "dashOffset", undefined);
 __decorate([
     strokeType(10)
-], UI.prototype, "miterLimit", void 0);
+], UI.prototype, "miterLimit", undefined);
 __decorate([
     pathType(0)
-], UI.prototype, "cornerRadius", void 0);
+], UI.prototype, "cornerRadius", undefined);
 __decorate([
     pathType()
-], UI.prototype, "cornerSmoothing", void 0);
+], UI.prototype, "cornerSmoothing", undefined);
 __decorate([
     effectType()
-], UI.prototype, "shadow", void 0);
+], UI.prototype, "shadow", undefined);
 __decorate([
     effectType()
-], UI.prototype, "innerShadow", void 0);
+], UI.prototype, "innerShadow", undefined);
 __decorate([
     effectType()
-], UI.prototype, "blur", void 0);
+], UI.prototype, "blur", undefined);
 __decorate([
     effectType()
-], UI.prototype, "backgroundBlur", void 0);
+], UI.prototype, "backgroundBlur", undefined);
 __decorate([
     effectType()
-], UI.prototype, "grayscale", void 0);
+], UI.prototype, "grayscale", undefined);
 __decorate([
     dataType({})
-], UI.prototype, "data", void 0);
+], UI.prototype, "data", undefined);
 __decorate([
     rewrite(Leaf.prototype.reset)
 ], UI.prototype, "reset", null);
@@ -870,7 +871,7 @@ let Group = class Group extends UI {
 };
 __decorate([
     dataProcessor(GroupData)
-], Group.prototype, "__", void 0);
+], Group.prototype, "__", undefined);
 Group = __decorate([
     useModule(Branch),
     registerUI()
@@ -1041,8 +1042,6 @@ let Leafer = Leafer_1 = class Leafer extends Group {
     __setAttr(attrName, newValue) {
         if (this.canvas) {
             if (canvasSizeAttrs.includes(attrName)) {
-                if (!newValue)
-                    debug.warn(attrName + ' is 0');
                 this.__changeCanvasSize(attrName, newValue);
             }
             else if (attrName === 'fill') {
@@ -1082,8 +1081,6 @@ let Leafer = Leafer_1 = class Leafer extends Group {
         this.created = true;
     }
     __onReady() {
-        if (this.ready)
-            return;
         this.ready = true;
         this.emitLeafer(LeaferEvent.BEFORE_READY);
         this.emitLeafer(LeaferEvent.READY);
@@ -1097,6 +1094,20 @@ let Leafer = Leafer_1 = class Leafer extends Group {
         this.emitLeafer(LeaferEvent.VIEW_READY);
         WaitHelper.run(this.__viewReadyWait);
     }
+    __onLayoutEnd() {
+        const { grow, growWidth, growHeight } = this.config;
+        if (grow) {
+            let { width, height, pixelRatio } = this;
+            const bounds = grow === 'box' ? this.worldBoxBounds : this.__world;
+            if (growWidth !== false)
+                width = Math.max(1, bounds.x + bounds.width);
+            if (growHeight !== false)
+                height = Math.max(1, bounds.y + bounds.height);
+            this.__doResize({ width, height, pixelRatio });
+        }
+        if (!this.ready)
+            this.__onReady();
+    }
     __onNextRender() {
         if (this.viewReady) {
             WaitHelper.run(this.__nextRenderWait);
@@ -1190,10 +1201,9 @@ let Leafer = Leafer_1 = class Leafer extends Group {
         const runId = Run.start('FirstCreate ' + this.innerName);
         this.once(LeaferEvent.START, () => Run.end(runId));
         this.once(LayoutEvent.START, () => this.updateLazyBounds());
-        this.once(LayoutEvent.END, () => this.__onReady());
         this.once(RenderEvent.START, () => this.__onCreated());
         this.once(RenderEvent.END, () => this.__onViewReady());
-        this.__eventIds.push(this.on_(WatchEvent.DATA, this.__onWatchData, this), this.on_(RenderEvent.NEXT, this.__onNextRender, this));
+        this.__eventIds.push(this.on_(WatchEvent.DATA, this.__onWatchData, this), this.on_(LayoutEvent.END, this.__onLayoutEnd, this), this.on_(RenderEvent.NEXT, this.__onNextRender, this));
     }
     __removeListenEvents() {
         this.off_(this.__eventIds);
@@ -1234,10 +1244,10 @@ let Leafer = Leafer_1 = class Leafer extends Group {
 Leafer.list = new LeafList();
 __decorate([
     dataProcessor(LeaferData)
-], Leafer.prototype, "__", void 0);
+], Leafer.prototype, "__", undefined);
 __decorate([
     boundsType()
-], Leafer.prototype, "pixelRatio", void 0);
+], Leafer.prototype, "pixelRatio", undefined);
 Leafer = Leafer_1 = __decorate([
     registerUI()
 ], Leafer);
@@ -1250,7 +1260,7 @@ let Rect = class Rect extends UI {
 };
 __decorate([
     dataProcessor(RectData)
-], Rect.prototype, "__", void 0);
+], Rect.prototype, "__", undefined);
 Rect = __decorate([
     useModule(RectRender),
     rewriteAble(),
@@ -1275,6 +1285,8 @@ let Box = class Box extends Group {
         const data = this.__;
         if (this.children.length) {
             if (data.__autoSide) {
+                if (data.__hasSurface)
+                    this.__extraUpdate();
                 super.__updateBoxBounds();
                 const { boxBounds } = this.__layout;
                 if (!data.__autoSize) {
@@ -1339,13 +1351,13 @@ let Box = class Box extends Group {
 };
 __decorate([
     dataProcessor(BoxData)
-], Box.prototype, "__", void 0);
+], Box.prototype, "__", undefined);
 __decorate([
     dataType(false)
-], Box.prototype, "resizeChildren", void 0);
+], Box.prototype, "resizeChildren", undefined);
 __decorate([
     affectRenderBoundsType('show')
-], Box.prototype, "overflow", void 0);
+], Box.prototype, "overflow", undefined);
 __decorate([
     rewrite(rect.__updateStrokeSpread)
 ], Box.prototype, "__updateStrokeSpread", null);
@@ -1384,13 +1396,13 @@ let Frame = class Frame extends Box {
 };
 __decorate([
     dataProcessor(FrameData)
-], Frame.prototype, "__", void 0);
+], Frame.prototype, "__", undefined);
 __decorate([
     surfaceType('#FFFFFF')
-], Frame.prototype, "fill", void 0);
+], Frame.prototype, "fill", undefined);
 __decorate([
     affectRenderBoundsType('hide')
-], Frame.prototype, "overflow", void 0);
+], Frame.prototype, "overflow", undefined);
 Frame = __decorate([
     registerUI()
 ], Frame);
@@ -1437,16 +1449,16 @@ let Ellipse = class Ellipse extends UI {
 };
 __decorate([
     dataProcessor(EllipseData)
-], Ellipse.prototype, "__", void 0);
+], Ellipse.prototype, "__", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "innerRadius", void 0);
+], Ellipse.prototype, "innerRadius", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "startAngle", void 0);
+], Ellipse.prototype, "startAngle", undefined);
 __decorate([
     pathType(0)
-], Ellipse.prototype, "endAngle", void 0);
+], Ellipse.prototype, "endAngle", undefined);
 Ellipse = __decorate([
     registerUI()
 ], Ellipse);
@@ -1505,22 +1517,22 @@ let Line = class Line extends UI {
 };
 __decorate([
     dataProcessor(LineData)
-], Line.prototype, "__", void 0);
+], Line.prototype, "__", undefined);
 __decorate([
     affectStrokeBoundsType('center')
-], Line.prototype, "strokeAlign", void 0);
+], Line.prototype, "strokeAlign", undefined);
 __decorate([
     boundsType(0)
-], Line.prototype, "height", void 0);
+], Line.prototype, "height", undefined);
 __decorate([
     pathType()
-], Line.prototype, "points", void 0);
+], Line.prototype, "points", undefined);
 __decorate([
     pathType(0)
-], Line.prototype, "curve", void 0);
+], Line.prototype, "curve", undefined);
 __decorate([
     pathType(false)
-], Line.prototype, "closed", void 0);
+], Line.prototype, "closed", undefined);
 Line = __decorate([
     registerUI()
 ], Line);
@@ -1553,16 +1565,16 @@ let Polygon = class Polygon extends UI {
 };
 __decorate([
     dataProcessor(PolygonData)
-], Polygon.prototype, "__", void 0);
+], Polygon.prototype, "__", undefined);
 __decorate([
     pathType(3)
-], Polygon.prototype, "sides", void 0);
+], Polygon.prototype, "sides", undefined);
 __decorate([
     pathType()
-], Polygon.prototype, "points", void 0);
+], Polygon.prototype, "points", undefined);
 __decorate([
     pathType(0)
-], Polygon.prototype, "curve", void 0);
+], Polygon.prototype, "curve", undefined);
 __decorate([
     rewrite(line.__updateRenderPath)
 ], Polygon.prototype, "__updateRenderPath", null);
@@ -1594,13 +1606,13 @@ let Star = class Star extends UI {
 };
 __decorate([
     dataProcessor(StarData)
-], Star.prototype, "__", void 0);
+], Star.prototype, "__", undefined);
 __decorate([
     pathType(5)
-], Star.prototype, "corners", void 0);
+], Star.prototype, "corners", undefined);
 __decorate([
     pathType(0.382)
-], Star.prototype, "innerRadius", void 0);
+], Star.prototype, "innerRadius", undefined);
 Star = __decorate([
     registerUI()
 ], Star);
@@ -1622,10 +1634,10 @@ let Image = class Image extends Rect {
 };
 __decorate([
     dataProcessor(ImageData)
-], Image.prototype, "__", void 0);
+], Image.prototype, "__", undefined);
 __decorate([
     boundsType('')
-], Image.prototype, "url", void 0);
+], Image.prototype, "url", undefined);
 Image = __decorate([
     registerUI()
 ], Image);
@@ -1688,25 +1700,25 @@ let Canvas = class Canvas extends Rect {
 };
 __decorate([
     dataProcessor(CanvasData)
-], Canvas.prototype, "__", void 0);
+], Canvas.prototype, "__", undefined);
 __decorate([
     resizeType(100)
-], Canvas.prototype, "width", void 0);
+], Canvas.prototype, "width", undefined);
 __decorate([
     resizeType(100)
-], Canvas.prototype, "height", void 0);
+], Canvas.prototype, "height", undefined);
 __decorate([
     resizeType(1)
-], Canvas.prototype, "pixelRatio", void 0);
+], Canvas.prototype, "pixelRatio", undefined);
 __decorate([
     resizeType(true)
-], Canvas.prototype, "smooth", void 0);
+], Canvas.prototype, "smooth", undefined);
 __decorate([
     dataType(false)
-], Canvas.prototype, "safeResize", void 0);
+], Canvas.prototype, "safeResize", undefined);
 __decorate([
     resizeType()
-], Canvas.prototype, "contextSettings", void 0);
+], Canvas.prototype, "contextSettings", undefined);
 Canvas = __decorate([
     registerUI()
 ], Canvas);
@@ -1797,76 +1809,76 @@ let Text = class Text extends UI {
 };
 __decorate([
     dataProcessor(TextData)
-], Text.prototype, "__", void 0);
+], Text.prototype, "__", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "width", void 0);
+], Text.prototype, "width", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "height", void 0);
+], Text.prototype, "height", undefined);
 __decorate([
     dataType(false)
-], Text.prototype, "resizeFontSize", void 0);
+], Text.prototype, "resizeFontSize", undefined);
 __decorate([
     surfaceType('#000000')
-], Text.prototype, "fill", void 0);
+], Text.prototype, "fill", undefined);
 __decorate([
     affectStrokeBoundsType('outside')
-], Text.prototype, "strokeAlign", void 0);
+], Text.prototype, "strokeAlign", undefined);
 __decorate([
     hitType('all')
-], Text.prototype, "hitFill", void 0);
+], Text.prototype, "hitFill", undefined);
 __decorate([
     boundsType('')
-], Text.prototype, "text", void 0);
+], Text.prototype, "text", undefined);
 __decorate([
-    boundsType('L')
-], Text.prototype, "fontFamily", void 0);
+    boundsType('caption')
+], Text.prototype, "fontFamily", undefined);
 __decorate([
     boundsType(12)
-], Text.prototype, "fontSize", void 0);
+], Text.prototype, "fontSize", undefined);
 __decorate([
     boundsType('normal')
-], Text.prototype, "fontWeight", void 0);
+], Text.prototype, "fontWeight", undefined);
 __decorate([
     boundsType(false)
-], Text.prototype, "italic", void 0);
+], Text.prototype, "italic", undefined);
 __decorate([
     boundsType('none')
-], Text.prototype, "textCase", void 0);
+], Text.prototype, "textCase", undefined);
 __decorate([
     boundsType('none')
-], Text.prototype, "textDecoration", void 0);
+], Text.prototype, "textDecoration", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "letterSpacing", void 0);
+], Text.prototype, "letterSpacing", undefined);
 __decorate([
     boundsType({ type: 'percent', value: 1.5 })
-], Text.prototype, "lineHeight", void 0);
+], Text.prototype, "lineHeight", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "paraIndent", void 0);
+], Text.prototype, "paraIndent", undefined);
 __decorate([
     boundsType(0)
-], Text.prototype, "paraSpacing", void 0);
+], Text.prototype, "paraSpacing", undefined);
 __decorate([
     boundsType('x')
-], Text.prototype, "writingMode", void 0);
+], Text.prototype, "writingMode", undefined);
 __decorate([
     boundsType('left')
-], Text.prototype, "textAlign", void 0);
+], Text.prototype, "textAlign", undefined);
 __decorate([
     boundsType('top')
-], Text.prototype, "verticalAlign", void 0);
+], Text.prototype, "verticalAlign", undefined);
 __decorate([
     boundsType(true)
-], Text.prototype, "autoSizeAlign", void 0);
+], Text.prototype, "autoSizeAlign", undefined);
 __decorate([
     boundsType('normal')
-], Text.prototype, "textWrap", void 0);
+], Text.prototype, "textWrap", undefined);
 __decorate([
     boundsType('show')
-], Text.prototype, "textOverflow", void 0);
+], Text.prototype, "textOverflow", undefined);
 Text = __decorate([
     registerUI()
 ], Text);
@@ -1879,10 +1891,10 @@ let Path = class Path extends UI {
 };
 __decorate([
     dataProcessor(PathData)
-], Path.prototype, "__", void 0);
+], Path.prototype, "__", undefined);
 __decorate([
     affectStrokeBoundsType('center')
-], Path.prototype, "strokeAlign", void 0);
+], Path.prototype, "strokeAlign", undefined);
 Path = __decorate([
     registerUI()
 ], Path);
@@ -1921,10 +1933,10 @@ let Pen = class Pen extends Group {
 };
 __decorate([
     dataProcessor(PenData)
-], Pen.prototype, "__", void 0);
+], Pen.prototype, "__", undefined);
 __decorate([
     penPathType()
-], Pen.prototype, "path", void 0);
+], Pen.prototype, "path", undefined);
 Pen = __decorate([
     useModule(PathCreator, ['set', 'path', 'paint']),
     registerUI()