@leafer-ui/display 1.0.0-rc.12 → 1.0.0-rc.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer-ui/display",
-  "version": "1.0.0-rc.12",
+  "version": "1.0.0-rc.17",
   "description": "@leafer-ui/display",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -22,14 +22,14 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/core": "1.0.0-rc.12",
-    "@leafer-ui/data": "1.0.0-rc.12",
-    "@leafer-ui/display-module": "1.0.0-rc.12",
-    "@leafer-ui/decorator": "1.0.0-rc.12",
-    "@leafer-ui/external": "1.0.0-rc.12"
+    "@leafer/core": "1.0.0-rc.17",
+    "@leafer-ui/data": "1.0.0-rc.17",
+    "@leafer-ui/display-module": "1.0.0-rc.17",
+    "@leafer-ui/decorator": "1.0.0-rc.17",
+    "@leafer-ui/external": "1.0.0-rc.17"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-rc.12",
-    "@leafer-ui/interface": "1.0.0-rc.12"
+    "@leafer/interface": "1.0.0-rc.17",
+    "@leafer-ui/interface": "1.0.0-rc.17"
   }
 }

package/src/Box.ts

@@ -1,4 +1,4 @@
-import { ILeaferCanvas, IRenderOptions, IPathDrawer, IBoundsData, IPathCommandData } from '@leafer/interface'
+import { ILeaferCanvas, IRenderOptions, IBoundsData } from '@leafer/interface'
 import { rewrite, rewriteAble, registerUI, BoundsHelper, dataProcessor, affectRenderBoundsType } from '@leafer/core'
 
 import { IBox, IBoxData, IBoxInputData, IOverflow } from '@leafer-ui/interface'
@@ -18,6 +18,8 @@ export class Box extends Group implements IBox {
 
     public get __tag() { return 'Box' }
 
+    public get isBranchLeaf(): boolean { return true }
+
     @dataProcessor(BoxData)
     declare public __: IBoxData
 
@@ -26,7 +28,6 @@ export class Box extends Group implements IBox {
 
     constructor(data?: IBoxInputData) {
         super(data)
-        this.isBranchLeaf = true
         this.__layout.renderChanged || this.__layout.renderChange()
     }
 
@@ -48,8 +49,15 @@ export class Box extends Group implements IBox {
     public __updateRectBoxBounds(): void { }
 
     public __updateBoxBounds(): void {
-        if (this.__.__autoBounds && this.children.length) {
+        const data = this.__
+        if (data.__autoSide && this.children.length) {
+            if (this.leafer) this.leafer.layouter.addExtra(this)
             super.__updateBoxBounds()
+            if (!data.__autoSize) {
+                const b = this.__layout.boxBounds
+                if (!data.__autoWidth) b.x = 0, b.width = data.width
+                if (!data.__autoHeight) b.y = 0, b.height = data.height
+            }
         } else {
             this.__updateRectBoxBounds()
         }
@@ -68,7 +76,6 @@ export class Box extends Group implements IBox {
         }
     }
 
-
     @rewrite(rect.__updateRenderBounds)
     public __updateRectRenderBounds(): void { }
 
@@ -81,10 +88,6 @@ export class Box extends Group implements IBox {
     }
 
 
-    @rewrite(rect.__drawPathByData)
-    public __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void { }
-
-
     @rewrite(rect.__render)
     public __renderRect(_canvas: ILeaferCanvas, _options: IRenderOptions): void { }
 

package/src/Canvas.ts

@@ -2,10 +2,10 @@ import { ILeaferCanvas, ILeaferCanvasConfig, INumber, IRenderOptions, IPointData
 import { Creator, Matrix, Platform, dataProcessor, registerUI, hitType } from '@leafer/core'
 
 import { ICanvas, ICanvasData, ICanvasInputData, IUI } from '@leafer-ui/interface'
-import { ImageData } from '@leafer-ui/data'
+import { CanvasData } from '@leafer-ui/data'
+import { resizeType } from '@leafer-ui/decorator'
 
 import { Rect } from './Rect'
-import { resizeType } from '@leafer-ui/decorator'
 
 
 @registerUI()
@@ -13,7 +13,7 @@ export class Canvas extends Rect implements ICanvas {
 
     public get __tag() { return 'Canvas' }
 
-    @dataProcessor(ImageData)
+    @dataProcessor(CanvasData)
     declare public __: ICanvasData
 
     @resizeType(100)
@@ -23,7 +23,7 @@ export class Canvas extends Rect implements ICanvas {
     declare public height: INumber
 
     @resizeType(Platform.devicePixelRatio)
-    public pixelRatio: INumber
+    declare public pixelRatio: INumber
 
     @resizeType(true)
     public smooth: boolean

package/src/Frame.ts

@@ -11,6 +11,8 @@ export class Frame extends Box implements IFrame {
 
     public get __tag() { return 'Frame' }
 
+    public get isFrame(): boolean { return true }
+
     @dataProcessor(FrameData)
     declare public __: IFrameData
 
@@ -22,6 +24,5 @@ export class Frame extends Box implements IFrame {
 
     constructor(data?: IFrameInputData) {
         super(data)
-        this.isFrame = true
     }
 }

package/src/Group.ts

@@ -13,6 +13,8 @@ export class Group extends UI implements IGroup {
 
     public get __tag() { return 'Group' }
 
+    public get isBranch(): boolean { return true }
+
     @dataProcessor(GroupData)
     declare public __: IGroupData
 
@@ -20,14 +22,18 @@ export class Group extends UI implements IGroup {
 
     constructor(data?: IGroupInputData) {
         super(data)
+    }
+
+    public reset(data?: IGroupInputData): void {
         this.__setBranch()
+        super.reset(data)
     }
 
     public __setBranch(): void {
-        this.isBranch = true
         if (!this.children) this.children = []
     }
 
+
     // data
 
     public set(data: IUIInputData): void {
@@ -38,7 +44,7 @@ export class Group extends UI implements IGroup {
             if (!this.children) {
                 this.__setBranch()
             } else {
-                this.removeAll(true)
+                this.clear()
             }
 
             super.set(data)

package/src/Leafer.ts

@@ -1,4 +1,4 @@
-import { ILeaferCanvas, IRenderer, ILayouter, ISelector, IWatcher, IInteraction, ILeaferConfig, ICanvasManager, IHitCanvasManager, IAutoBounds, IScreenSizeData, IResizeEvent, ILeaf, IEventListenerId, ITimer, IValue, IObject, IControl, IPointData, ILeaferType, ICursorType, IBoundsData } from '@leafer/interface'
+import { ILeaferCanvas, IRenderer, ILayouter, ISelector, IWatcher, IInteraction, ILeaferConfig, ICanvasManager, IHitCanvasManager, IAutoBounds, IScreenSizeData, IResizeEvent, ILeaf, IEventListenerId, ITimer, IValue, IObject, IControl, IPointData, ILeaferType, ICursorType, IBoundsData, INumber } from '@leafer/interface'
 import { AutoBounds, LayoutEvent, ResizeEvent, LeaferEvent, CanvasManager, ImageManager, DataHelper, Creator, Run, Debug, RenderEvent, registerUI, boundsType, canvasSizeAttrs, dataProcessor, WaitHelper, WatchEvent, Bounds } from '@leafer/core'
 
 import { ILeaferInputData, ILeaferData, IFunction, IUIInputData, ILeafer, IGroup, IApp, IEditorBase } from '@leafer-ui/interface'
@@ -17,11 +17,13 @@ export class Leafer extends Group implements ILeafer {
     declare public __: ILeaferData
 
     @boundsType()
-    public pixelRatio: number
+    declare public pixelRatio: INumber
 
     public get isApp(): boolean { return false }
     public get app(): ILeafer { return this.parent || this }
 
+    public get isLeafer(): boolean { return true }
+
     declare public parent?: IApp
 
     public running: boolean
@@ -197,7 +199,7 @@ export class Leafer extends Group implements ILeafer {
     }
 
     public forceRender(bounds?: IBoundsData): void {
-        this.renderer.addBlock(new Bounds(bounds) || this.canvas.bounds)
+        this.renderer.addBlock(bounds ? new Bounds(bounds) : this.canvas.bounds)
         if (this.viewReady) this.renderer.update()
     }
 
@@ -231,7 +233,6 @@ export class Leafer extends Group implements ILeafer {
 
     public __setLeafer(leafer: ILeafer): void {
         this.leafer = leafer
-        this.isLeafer = !!leafer
         this.__level = 1
     }
 

package/src/Line.ts

@@ -5,6 +5,7 @@ import { ILine, ILineData, ILineInputData, IStrokeAlign } from '@leafer-ui/inter
 import { LineData } from '@leafer-ui/data'
 
 import { UI } from './UI'
+import { PathArrow } from '@leafer-ui/external'
 
 
 const { moveTo, lineTo, drawPoints } = PathCommandDataHelper
@@ -70,8 +71,10 @@ export class Line extends UI implements ILine {
     }
 
     public __updateRenderPath(): void {
-        if (this.__.points && this.__.curve) {
-            drawPoints(this.__.__pathForRender = [], this.__.points, this.__.curve, this.__tag !== 'Line')
+        const data = this.__
+        if (!this.pathInputed && data.points && data.curve) {
+            drawPoints(data.__pathForRender = [], data.points, data.curve, this.pathClosed)
+            if (data.__useArrow) PathArrow.addArrows(this, false)
         } else {
             super.__updateRenderPath()
         }

package/src/Path.ts

@@ -1,14 +1,11 @@
-import { IPathCommandData, IWindingRule } from '@leafer/interface'
-import { PathBounds, dataProcessor, pathType, affectStrokeBoundsType, registerUI } from '@leafer/core'
+import { dataProcessor, affectStrokeBoundsType, registerUI } from '@leafer/core'
 
-import { IPath, IPathData, IPathInputData, IPathString, IStrokeAlign } from '@leafer-ui/interface'
+import { IPath, IPathData, IPathInputData, IStrokeAlign } from '@leafer-ui/interface'
 import { PathData } from '@leafer-ui/data'
 
 import { UI } from './UI'
 
 
-const { toBounds } = PathBounds
-
 @registerUI()
 export class Path extends UI implements IPath {
 
@@ -17,21 +14,12 @@ export class Path extends UI implements IPath {
     @dataProcessor(PathData)
     declare public __: IPathData
 
-    @pathType()
-    public path: IPathCommandData | IPathString
-
-    @pathType()
-    public windingRule: IWindingRule
-
     @affectStrokeBoundsType('center')
     declare public strokeAlign: IStrokeAlign
 
     constructor(data?: IPathInputData) {
         super(data)
-    }
-
-    public __updateBoxBounds(): void {
-        toBounds(this.__.path, this.__layout.boxBounds)
+        this.__.__pathInputed = 2
     }
 
 }

package/src/Pen.ts

@@ -1,4 +1,4 @@
-import { PathCreator, dataProcessor, registerUI, useModule } from '@leafer/core'
+import { PathCreator, dataProcessor, defineKey, registerUI, useModule } from '@leafer/core'
 
 import { IPenData, IPenInputData, IPathInputData, IPathCommandData, IPath, IPen } from '@leafer-ui/interface'
 import { PenData } from '@leafer-ui/data'
@@ -7,7 +7,7 @@ import { Group } from './Group'
 import { Path } from './Path'
 
 
-@useModule(PathCreator, ['beginPath'])
+@useModule(PathCreator, ['beginPath', 'path'])
 @registerUI()
 export class Pen extends Group implements IPen {
 
@@ -18,7 +18,11 @@ export class Pen extends Group implements IPen {
 
     public pathElement: IPath
     public pathStyle: IPathInputData
-    public path: IPathCommandData
+
+    @penPathType()
+    declare public path: IPathCommandData // use __path, readonly
+
+    public __path: IPathCommandData
 
     constructor(data?: IPenInputData) {
         super(data)
@@ -27,13 +31,13 @@ export class Pen extends Group implements IPen {
     public setStyle(data: IPathInputData): Pen {
         const path = this.pathElement = new Path(data)
         this.pathStyle = data
-        this.path = path.path as IPathCommandData || (path.path = [])
+        this.__path = path.path as IPathCommandData || (path.path = [])
         this.add(path)
         return this
     }
 
     public beginPath(): Pen {
-        this.path.length = 0
+        this.__path.length = 0
         this.paint()
         return this
     }
@@ -77,4 +81,12 @@ export class Pen extends Group implements IPen {
         this.pathElement.forceUpdate('path')
     }
 
+}
+
+function penPathType() {
+    return (target: IPen, key: string) => {
+        defineKey(target, key, {
+            get() { return this.__path }
+        })
+    }
 }

package/src/Polygon.ts

@@ -32,6 +32,7 @@ export class Polygon extends UI implements IPolygon {
 
     constructor(data?: IPolygonInputData) {
         super(data)
+        this.pathClosed = true
     }
 
     public __updatePath(): void {

package/src/Rect.ts

@@ -1,5 +1,4 @@
-import { IPathDrawer, IPathCommandData } from '@leafer/interface'
-import { dataProcessor, registerUI, rewrite, rewriteAble, useModule } from '@leafer/core'
+import { dataProcessor, registerUI, rewriteAble, useModule } from '@leafer/core'
 
 import { IRect, IRectInputData, IRectData } from '@leafer-ui/interface'
 import { RectData } from '@leafer-ui/data'
@@ -22,7 +21,4 @@ export class Rect extends UI implements IRect {
         super(data)
     }
 
-    @rewrite(UI.prototype.__drawPathByBox)
-    public __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void { }
-
 }

package/src/Text.ts

@@ -135,7 +135,7 @@ export class Text extends UI implements IText {
         data.__padding = padding ? MathHelper.fourNumber(padding) : undefined
         data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2
         data.__font = `${italic ? 'italic ' : ''}${textCase === 'small-caps' ? 'small-caps ' : ''}${fontWeight !== 'normal' ? fontWeight + ' ' : ''}${fontSize}px ${fontFamily}`
-        data.__clipText = textOverflow !== 'show' && !data.__autoBounds
+        data.__clipText = textOverflow !== 'show' && !data.__autoSize
 
         this.__updateTextDrawData()
 

package/src/UI.ts

@@ -1,13 +1,13 @@
-import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IAround } from '@leafer/interface'
-import { Leaf, PathDrawer, surfaceType, dataType, positionType, boundsType, pathType, scaleType, rotationType, opacityType, sortType, maskType, dataProcessor, useModule, rewrite, rewriteAble, UICreator, PathCorner, hitType, strokeType, PathConvert, eraserType, cursorType, autoLayoutType, PathCreator } from '@leafer/core'
+import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IAround, IValue, IWindingRule } from '@leafer/interface'
+import { Leaf, PathDrawer, surfaceType, dataType, positionType, boundsType, pathType, scaleType, rotationType, opacityType, sortType, maskType, dataProcessor, registerUI, useModule, rewrite, rewriteAble, UICreator, PathCorner, hitType, strokeType, PathConvert, eraserType, cursorType, autoLayoutType, PathCreator, naturalBoundsType, pathInputType } from '@leafer/core'
 
 import { IUI, IShadowEffect, IBlurEffect, IStrokeAlign, IStrokeJoin, IStrokeCap, IBlendMode, IDashPatternString, IShadowString, IGrayscaleEffect, IUIData, IGroup, IStrokeWidthString, ICornerRadiusString, IUIInputData, IExportOptions, IExportResult, IFill, IStroke, IArrowType, IFindUIMethod, IEditSize, ILeafer } from '@leafer-ui/interface'
-import { effectType } from '@leafer-ui/decorator'
+import { arrowType, effectType } from '@leafer-ui/decorator'
 
 import { UIData } from '@leafer-ui/data'
 import { UIBounds, UIRender } from '@leafer-ui/display-module'
 
-import { Export } from '@leafer-ui/external'
+import { Export, PathArrow } from '@leafer-ui/external'
 
 
 @useModule(UIBounds)
@@ -26,7 +26,7 @@ export class UI extends Leaf implements IUI {
     declare public leafer?: ILeafer
     declare public parent?: IGroup
 
-    public isFrame?: boolean
+    public get isFrame(): boolean { return false }
 
     declare public children?: IUI[]
 
@@ -180,17 +180,29 @@ export class UI extends Leaf implements IUI {
     @strokeType(10)
     public miterLimit: INumber
 
-    // load 
+    // image
 
     @dataType(false)
     public lazy: IBoolean  // load image / compute paint
 
+    @naturalBoundsType(1)
+    public pixelRatio: INumber
+
+    // path
+
+    @pathInputType()
+    public path: IPathCommandData | IPathString
+
+    @pathType()
+    public windingRule: IWindingRule
+
+
     // arrow
 
-    @strokeType('none')
+    @arrowType('none')
     public startArrow: IArrowType
 
-    @strokeType('none')
+    @arrowType('none')
     public endArrow: IArrowType
 
     // corner
@@ -249,8 +261,8 @@ export class UI extends Leaf implements IUI {
         Object.assign(this, data)
     }
 
-    public get(): IUIInputData {
-        return this.__.__getInputData()
+    public get(name?: string): IUIInputData | IValue {
+        return name ? this.__.__getInput(name) : this.__.__getInputData()
     }
 
     public createProxyData(): IUIInputData { return undefined }
@@ -294,6 +306,7 @@ export class UI extends Leaf implements IUI {
         if (this.__.path) {
             const data = this.__
             data.__pathForRender = data.cornerRadius ? PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path
+            if (data.__useArrow) PathArrow.addArrows(this, !data.cornerRadius)
         }
     }
 
@@ -307,8 +320,13 @@ export class UI extends Leaf implements IUI {
         this.__drawPathByData(canvas, this.__.path)
     }
 
-    @rewrite(PathDrawer.drawPathByData)
-    public __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void { }
+    public __drawPathByData(drawer: IPathDrawer, data: IPathCommandData): void {
+        if (data) {
+            PathDrawer.drawPathByData(drawer, data)
+        } else {
+            this.__drawPathByBox(drawer)
+        }
+    }
 
     public __drawPathByBox(drawer: IPathDrawer): void {
         const { x, y, width, height } = this.__layout.boxBounds
@@ -334,6 +352,13 @@ export class UI extends Leaf implements IUI {
         return UICreator.get(data.tag || this.prototype.__tag, data, x, y, width, height) as IUI
     }
 
+    static registerUI(): void {
+        registerUI()(this)
+    }
+
+    static registerData(data: IUIData): void {
+        dataProcessor(data)(this.prototype)
+    }
 
     public destroy(): void {
         this.fill = this.stroke = null

package/types/index.d.ts

@@ -1,6 +1,6 @@
-import { IString, INumber, IBoolean, IMaskType, IAround, IHitType, ICursorType, IPointData, IPathCommandData, IPathString, ILeaferCanvas, IPathDrawer, IExportFileType, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IBoundsData, IResizeEvent, ILeaf, IValue, IRenderOptions, ILeaferImage, ICanvasContext2D, IWindingRule } from '@leafer/interface';
+import { IString, INumber, IBoolean, IMaskType, IAround, IHitType, ICursorType, IPathCommandData, IPathString, IWindingRule, IPointData, IValue, ILeaferCanvas, IPathDrawer, IExportFileType, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IBoundsData, IResizeEvent, ILeaf, IRenderOptions, ILeaferImage, ICanvasContext2D } from '@leafer/interface';
 import { Leaf } from '@leafer/core';
-import { IUI, IUIData, IUIInputData, ILeafer, IGroup, IBlendMode, IEditSize, IFill, IStroke, IStrokeAlign, IStrokeWidthString, IStrokeCap, IStrokeJoin, IDashPatternString, IArrowType, ICornerRadiusString, IShadowEffect, IShadowString, IBlurEffect, IGrayscaleEffect, IFindUIMethod, IExportOptions, IExportResult, IGroupData, IGroupInputData, ILeaferData, IApp, IEditorBase, IFunction, ILeaferInputData, IBox, IBoxData, IOverflow, IBoxInputData, IFrame, IFrameData, IFrameInputData, IRect, IRectData, IRectInputData, IEllipse, IEllipseData, IEllipseInputData, IPolygon, IPolygonData, IPolygonInputData, IStar, IStarData, IStarInputData, ILine, ILineData, ILineInputData, IImage, IImageData, IImageInputData, ICanvas, ICanvasData, ICanvasInputData, IText, ITextData, IHitType as IHitType$1, IFontWeight, ITextCase, ITextDecoration, IUnitData, ITextAlign, IVerticalAlign, ITextWrap, ITextDrawData, ITextInputData, IPath, IPathData, IPathString as IPathString$1, IPathInputData, IPen, IPenData, IPathCommandData as IPathCommandData$1, IPenInputData } from '@leafer-ui/interface';
+import { IUI, IUIData, IUIInputData, ILeafer, IGroup, IBlendMode, IEditSize, IFill, IStroke, IStrokeAlign, IStrokeWidthString, IStrokeCap, IStrokeJoin, IDashPatternString, IArrowType, ICornerRadiusString, IShadowEffect, IShadowString, IBlurEffect, IGrayscaleEffect, IFindUIMethod, IExportOptions, IExportResult, IGroupData, IGroupInputData, ILeaferData, IApp, IEditorBase, IFunction, ILeaferInputData, IBox, IBoxData, IOverflow, IBoxInputData, IFrame, IFrameData, IFrameInputData, IRect, IRectData, IRectInputData, IEllipse, IEllipseData, IEllipseInputData, IPolygon, IPolygonData, IPolygonInputData, IStar, IStarData, IStarInputData, ILine, ILineData, ILineInputData, IImage, IImageData, IImageInputData, ICanvas, ICanvasData, ICanvasInputData, IText, ITextData, IHitType as IHitType$1, IFontWeight, ITextCase, ITextDecoration, IUnitData, ITextAlign, IVerticalAlign, ITextWrap, ITextDrawData, ITextInputData, IPath, IPathData, IPathInputData, IPen, IPenData, IPathCommandData as IPathCommandData$1, IPenInputData } from '@leafer-ui/interface';
 
 declare class UI extends Leaf implements IUI {
     __: IUIData;
@@ -9,7 +9,7 @@ declare class UI extends Leaf implements IUI {
     get app(): ILeafer;
     leafer?: ILeafer;
     parent?: IGroup;
-    isFrame?: boolean;
+    get isFrame(): boolean;
     children?: IUI[];
     id: IString;
     name: IString;
@@ -54,6 +54,9 @@ declare class UI extends Leaf implements IUI {
     dashOffset: INumber;
     miterLimit: INumber;
     lazy: IBoolean;
+    pixelRatio: INumber;
+    path: IPathCommandData | IPathString;
+    windingRule: IWindingRule;
     startArrow: IArrowType;
     endArrow: IArrowType;
     cornerRadius: number | number[] | ICornerRadiusString;
@@ -68,7 +71,7 @@ declare class UI extends Leaf implements IUI {
     constructor(data?: IUIInputData);
     reset(_data?: IUIInputData): void;
     set(data: IUIInputData): void;
-    get(): IUIInputData;
+    get(name?: string): IUIInputData | IValue;
     createProxyData(): IUIInputData;
     find(_condition: number | string | IFindUIMethod, _options?: any): IUI[];
     findOne(_condition: number | string | IFindUIMethod, _options?: any): IUI;
@@ -78,19 +81,23 @@ declare class UI extends Leaf implements IUI {
     __updateRenderPath(): void;
     __drawRenderPath(canvas: ILeaferCanvas): void;
     __drawPath(canvas: ILeaferCanvas): void;
-    __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void;
+    __drawPathByData(drawer: IPathDrawer, data: IPathCommandData): void;
     __drawPathByBox(drawer: IPathDrawer): void;
     export(filename: IExportFileType | string, options?: IExportOptions | number | boolean): Promise<IExportResult>;
     clone(): IUI;
     static one(data: IUIInputData, x?: number, y?: number, width?: number, height?: number): IUI;
+    static registerUI(): void;
+    static registerData(data: IUIData): void;
     destroy(): void;
 }
 
 declare class Group extends UI implements IGroup {
     get __tag(): string;
+    get isBranch(): boolean;
     __: IGroupData;
     children: IUI[];
     constructor(data?: IGroupInputData);
+    reset(data?: IGroupInputData): void;
     __setBranch(): void;
     set(data: IUIInputData): void;
     toJSON(): IUIInputData;
@@ -108,9 +115,10 @@ declare class Group extends UI implements IGroup {
 declare class Leafer extends Group implements ILeafer {
     get __tag(): string;
     __: ILeaferData;
-    pixelRatio: number;
+    pixelRatio: INumber;
     get isApp(): boolean;
     get app(): ILeafer;
+    get isLeafer(): boolean;
     parent?: IApp;
     running: boolean;
     created: boolean;
@@ -186,6 +194,7 @@ declare class Leafer extends Group implements ILeafer {
 
 declare class Box extends Group implements IBox {
     get __tag(): string;
+    get isBranchLeaf(): boolean;
     __: IBoxData;
     overflow: IOverflow;
     constructor(data?: IBoxInputData);
@@ -199,7 +208,6 @@ declare class Box extends Group implements IBox {
     __updateRectRenderBounds(): void;
     __updateRectChange(): void;
     __updateChange(): void;
-    __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void;
     __renderRect(_canvas: ILeaferCanvas, _options: IRenderOptions): void;
     __renderGroup(_canvas: ILeaferCanvas, _options: IRenderOptions): void;
     __render(canvas: ILeaferCanvas, options: IRenderOptions): void;
@@ -208,6 +216,7 @@ declare class Box extends Group implements IBox {
 
 declare class Frame extends Box implements IFrame {
     get __tag(): string;
+    get isFrame(): boolean;
     __: IFrameData;
     fill: IFill;
     overflow: IOverflow;
@@ -218,7 +227,6 @@ declare class Rect extends UI implements IRect {
     get __tag(): string;
     __: IRectData;
     constructor(data?: IRectInputData);
-    __drawPathByData(_drawer: IPathDrawer, _data: IPathCommandData): void;
 }
 
 declare class Ellipse extends UI implements IEllipse {
@@ -333,11 +341,8 @@ declare class Text extends UI implements IText {
 declare class Path extends UI implements IPath {
     get __tag(): string;
     __: IPathData;
-    path: IPathCommandData | IPathString$1;
-    windingRule: IWindingRule;
     strokeAlign: IStrokeAlign;
     constructor(data?: IPathInputData);
-    __updateBoxBounds(): void;
 }
 
 declare class Pen extends Group implements IPen {
@@ -346,6 +351,7 @@ declare class Pen extends Group implements IPen {
     pathElement: IPath;
     pathStyle: IPathInputData;
     path: IPathCommandData$1;
+    __path: IPathCommandData$1;
     constructor(data?: IPenInputData);
     setStyle(data: IPathInputData): Pen;
     beginPath(): Pen;

package/src/Arrow.ts

@@ -1,27 +0,0 @@
-import { registerUI, strokeType, dataProcessor } from '@leafer/core'
-
-import { IArrow, IArrowData, IArrowInputData, IArrowType } from '@leafer-ui/interface'
-import { ArrowData } from '@leafer-ui/data'
-
-import { Line } from './Line'
-
-
-@registerUI()
-export class Arrow extends Line implements IArrow {
-
-    public get __tag() { return 'Arrow' }
-
-    @dataProcessor(ArrowData)
-    declare public __: IArrowData
-
-    @strokeType('none')
-    declare public startArrow: IArrowType
-
-    @strokeType('lines')
-    declare public endArrow: IArrowType
-
-    constructor(data?: IArrowInputData) {
-        super(data)
-    }
-
-}