@leafer/interface 1.0.0-alpha.21 → 1.0.0-alpha.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer/interface",
-  "version": "1.0.0-alpha.21",
+  "version": "1.0.0-alpha.30",
   "description": "@leafer/interface",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",

package/src/app/IApp.ts

@@ -2,4 +2,5 @@ import { ILeafer } from './ILeafer'
 
 export interface IApp extends ILeafer {
     children: ILeafer[]
+    realCanvas: boolean
 }

package/src/app/ILeafer.ts

@@ -2,36 +2,40 @@ import { ILeaf } from '../display/ILeaf'
 import { IRenderer, IRendererConfig } from '../renderer/IRenderer'
 import { IHitCanvas, ILeaferCanvas, ILeaferCanvasConfig, IHitCanvasConfig } from '../canvas/ILeaferCanvas'
 import { ILayouter, ILayouterConfig } from '../layouter/ILayouter'
-import { ISelector } from '../selector/ISelector'
-import { IInteraction, IInteractionConfig } from '../interaction/IInteraction'
-import { IWatcher } from '../watcher/IWatcher'
+import { ISelector, ISelectorConfig } from '../selector/ISelector'
+import { IInteraction, IInteractionCanvas, IInteractionConfig } from '../interaction/IInteraction'
+import { IWatcher, IWatcherConfig } from '../watcher/IWatcher'
 import { IAutoBounds, IScreenSizeData } from '../math/IMath'
 import { ICanvasManager } from '../canvas/ICanvasManager'
 import { IHitCanvasManager } from '../canvas/IHitCanvasManager'
 import { IImageManager } from '../image/IImageManager'
+import { IEventListenerId } from '../event/IEventer'
 import { IObject } from '../data/IData'
 import { IZoomView } from '../display/IView'
 import { IApp } from './IApp'
 import { ILeaferImage, ILeaferImageConfig } from '../image/ILeaferImage'
-import { IEvent } from '../event/IEvent'
+import { IControl } from '../control/IControl'
 
 
+export type ILeaferType = 'draw' | 'design' | 'board' | 'document' | 'user'
 export interface ILeaferConfig extends IRendererConfig, ILeaferCanvasConfig, IInteractionConfig, ILayouterConfig {
-    autoStart?: boolean
-    useZoom?: boolean
-    useMove?: boolean
+    start?: boolean
+    type?: ILeaferType
+    realCanvas?: boolean
 }
 
-export interface ILeafer extends IZoomView {
-
-    creator: ICreator
+export interface ILeafer extends IZoomView, IControl {
 
     readonly isApp: boolean
     parent?: IApp
 
     running: boolean
+    ready: boolean
+    viewReady: boolean
 
-    autoLayout?: IAutoBounds
+    pixelRatio: number
+
+    view: unknown
 
     canvas: ILeaferCanvas
     renderer: IRenderer
@@ -46,28 +50,39 @@ export interface ILeafer extends IZoomView {
     hitCanvasManager?: IHitCanvasManager
     imageManager: IImageManager
 
+    autoLayout?: IAutoBounds
+
     config: ILeaferConfig
 
-    start(): void
-    stop(): void
+    __eventIds: IEventListenerId[]
+
+    init(userConfig?: ILeaferConfig, parentApp?: IApp): void
+
+    forceFullRender(): void
 
     resize(size: IScreenSizeData): void
 }
 
-export interface ICreator {
-    ui?(tag: string, data?: IObject): ILeaf
-    event?(type: string, event: IEvent): IEvent
+export interface ILeaferTypeFunction {
+    (leafer: ILeafer): void
+}
+
+export interface ILeaferTypeList {
+    [key: string]: ILeaferTypeFunction
+}
+
 
+export interface ICreator {
     image?(options?: ILeaferImageConfig): ILeaferImage
     canvas?(options?: ILeaferCanvasConfig, manager?: ICanvasManager): ILeaferCanvas
     hitCanvas?(options?: IHitCanvasConfig, manager?: ICanvasManager): IHitCanvas
 
-    watcher?(target: ILeaf): IWatcher
-    layouter?(target: ILeaf): ILayouter
-    renderer?(target: ILeaf, canvas: ILeaferCanvas, options: IRendererConfig): IRenderer
-    selector?(target: ILeaf): ISelector
+    watcher?(target: ILeaf, options?: IWatcherConfig): IWatcher
+    layouter?(target: ILeaf, options?: ILayouterConfig): ILayouter
+    renderer?(target: ILeaf, canvas: ILeaferCanvas, options?: IRendererConfig): IRenderer
+    selector?(target: ILeaf, options?: ISelectorConfig): ISelector
 
-    interaction?(target: ILeaf, canvas: ILeaferCanvas, selector: ISelector, options?: IInteractionConfig): IInteraction
+    interaction?(target: ILeaf, canvas: IInteractionCanvas, selector: ISelector, options?: IInteractionConfig): IInteraction
 }
 
 export interface IUICreator {

package/src/canvas/ICanvas.ts

@@ -10,9 +10,7 @@ type CanvasTextAlign = 'center' | 'end' | 'left' | 'right' | 'start'
 type CanvasTextBaseline = 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
 //type CanvasTextRendering = 'auto' | 'geometricPrecision' | 'optimizeLegibility' | 'optimizeSpeed'
 
-/** This Canvas 2D API interface is used to declare a path that can then be used on a CanvasRenderingContext2D object. The path methods of the CanvasRenderingContext2D interface are also present on this interface, which gives you the convenience of being able to retain and replay your path whenever desired. */
 export interface IPath2D extends CanvasPath {
-    /** Adds to the path the path given by the argument. */
     addPath(path: IPath2D, transform?: DOMMatrix2DInit): void
 }
 
@@ -60,13 +58,7 @@ interface CanvasFilters {
     filter: string
 }
 
-/** An opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.createLinearGradient() or CanvasRenderingContext2D.createRadialGradient(). */
 export interface CanvasGradient {
-    /**
-     * Adds a color stop with the given color to the gradient at the given offset. 0.0 is the offset at one end of the gradient, 1.0 is the offset at the other end.
-     *
-     * Throws an 'IndexSizeError' DOMException if the offset is out of range. Throws a 'SyntaxError' DOMException if the color cannot be parsed.
-     */
     addColorStop(offset: number, color: string): void
 }
 
@@ -89,11 +81,11 @@ interface CanvasImageSmoothing {
 }
 
 interface CanvasPath {
-    arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void
+    arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void
     arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
     bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void
     closePath(): void
-    ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void
+    ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void
     lineTo(x: number, y: number): void
     moveTo(x: number, y: number): void
     quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
@@ -111,9 +103,7 @@ interface CanvasPathDrawingStyles {
     setLineDash(segments: number[]): void
 }
 
-/** An opaque object describing a pattern, based on an image, a canvas, or a video, created by the CanvasRenderingContext2D.createPattern() method. */
 export interface CanvasPattern {
-    /** Sets the transformation matrix that will be used when rendering the pattern during a fill or stroke painting operation. */
     setTransform(transform?: DOMMatrix2DInit): void
 }
 
@@ -135,8 +125,6 @@ interface CanvasRenderingContext2DSettings {
     desynchronized?: boolean
     willReadFrequently?: boolean
 }
-
-/** The CanvasRenderingContext2D interface, part of the Canvas API, provides the 2D rendering context for the drawing surface of a <canvas> element. It is used for drawing shapes, text, images, and other objects. */
 export interface ICanvasContext2D extends CanvasCompositing, CanvasDrawImage, CanvasDrawPath, CanvasFillStrokeStyles, CanvasFilters, CanvasImageData, CanvasImageSmoothing, CanvasPath, CanvasPathDrawingStyles, CanvasRect, CanvasShadowStyles, CanvasState, CanvasText, CanvasTextDrawingStyles, CanvasTransform, CanvasUserInterface {
     readonly canvas: HTMLCanvasElement
     getContextAttributes(): CanvasRenderingContext2DSettings
@@ -165,7 +153,6 @@ interface CanvasUserInterface {
 }
 
 
-/** The dimensions of a piece of text in the canvas, as created by the CanvasRenderingContext2D.measureText() method. */
 export interface ITextMetrics {
     /** Returns the measurement described below. */
     readonly actualBoundingBoxAscent: number
@@ -277,7 +264,6 @@ interface DOMMatrixReadOnly {
     rotateFromVector(x?: number, y?: number): DOMMatrix
     scale(scaleX?: number, scaleY?: number, scaleZ?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix
     scale3d(scale?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix
-    /** @deprecated */
     scaleNonUniform(scaleX?: number, scaleY?: number): DOMMatrix
     skewX(sx?: number): DOMMatrix
     skewY(sy?: number): DOMMatrix

package/src/canvas/ILeaferCanvas.ts

@@ -10,6 +10,7 @@ export interface ILeaferCanvasConfig extends IAutoBoundsData {
     view?: string | IObject
     fill?: string
     pixelRatio?: number
+    smooth?: boolean
     hittable?: boolean
     offscreen?: boolean
     webgl?: boolean
@@ -28,7 +29,7 @@ export interface ICanvasStrokeOptions {
     miterLimit?: number
 }
 
-export interface ICanvasAttr extends ICanvasStrokeOptions {
+export interface ICanvasAttr extends ICanvasStrokeOptions, IObject {
 
     smooth: boolean // imageSmoothingEnabled: boolean
     smoothLevel: string // imageSmoothingQuality: string
@@ -73,6 +74,7 @@ interface ICanvasMethod {
     strokeRect(x: number, y: number, width: number, height: number): void
     clearRect(x: number, y: number, width: number, height: number): void
 
+    transform(a: number, b: number, c: number, d: number, e: number, f: number): void
     translate(x: number, y: number): void
     scale(x: number, y: number): void
     rotate(angle: number): void
@@ -98,10 +100,14 @@ interface ICanvasMethod {
 
     // custom
 
-    hitPath(point: IPointData, fillRule?: string): boolean
-    hitStroke(point: IPointData): boolean
+    saveBlendMode(blendMode?: string): void
+    restoreBlendMode(): void
+
+    hitFill(point: IPointData, fillRule?: string): boolean
+    hitStroke(point: IPointData, strokeWidth?: number): boolean
 
     setStroke(strokeStyle: string | object, strokeWidth: number, options?: ICanvasStrokeOptions): void
+    setStrokeOptions(options: ICanvasStrokeOptions): void
 
     setWorld(matrix: IMatrixData, parentMatrix?: IMatrixData): void
 
@@ -109,7 +115,9 @@ interface ICanvasMethod {
     setWorldBlur(blur: number): void
 
     copyWorld(canvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData, blendMode?: string): void
-    copyWorldToLocal(canvas: ILeaferCanvas, fromWorld: IMatrixWithBoundsData, toLocalBounds: IBoundsData, blendMode?: string): void
+    copyWorldToInner(canvas: ILeaferCanvas, fromWorld: IMatrixWithBoundsData, toInnerBounds: IBoundsData, blendMode?: string): void
+    useMask(maskCanvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData): void
+
     fillWorld(bounds: IBoundsData, color: string | object, blendMode?: string): void
     strokeWorld(bounds: IBoundsData, color: string | object, blendMode?: string): void
     clipWorld(bounds: IBoundsData, ceilPixel?: boolean): void
@@ -120,9 +128,10 @@ interface ICanvasMethod {
 
 export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
 
-    manager: ICanvasManager
-
     readonly innerId: InnerId
+    name: string
+
+    manager: ICanvasManager
 
     width: number
     height: number
@@ -130,20 +139,35 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
     pixelRatio: number
     readonly pixelWidth: number
     readonly pixelHeight: number
+    readonly allowBackgroundColor?: boolean
 
     bounds: IBounds
 
+    config: ILeaferCanvasConfig
+
+    autoLayout: boolean
+
     view: unknown
+    parentView: unknown
+
+    unreal?: boolean
+
     offscreen: boolean
+
     context: ICanvasContext2D
 
     recycled?: boolean
 
+    init(): void
+
+    setBackgroundColor(color: string): void
+    setHittable(hittable: boolean): void
+
     startAutoLayout(autoBounds: IAutoBounds, listener: IResizeEventListener): void
     stopAutoLayout(): void
 
     resize(size: IScreenSizeData): void
-    pixel(num: number): number
+    setViewSize(size: IScreenSizeData): void
 
     // other
     isSameSize(options: ILeaferCanvasConfig): boolean
@@ -152,6 +176,7 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
     useSameTransform(canvas: ILeaferCanvas): void
     recycle(): void
 
+    unrealCanvas(): void
     destroy(): void
 }
 

package/src/control/IControl.ts

@@ -0,0 +1,5 @@
+export interface IControl {
+    start(): void
+    stop(): void
+    destroy(): void
+}

package/src/data/IData.ts

@@ -3,8 +3,7 @@ export type __Boolean = boolean // boolean | string  will convert to boolean
 export type __String = string //  string  | other   will convert to string
 export type __Object = IObject // will convert to object
 export type __Value = __Number | __Boolean | __String | __Object  // 
-
-
+export type ITimer = any
 export interface IObject {
     [name: string]: any
 }

package/src/data/ILeafData.ts

@@ -5,8 +5,13 @@ export interface IDataProcessor extends IObject {
     __leaf: ILeaf
     __input: IObject
     __middle: IObject
+    __get(name: string): unknown
+
     __setInput(name: string, value: unknown): void
     __getInput(name: string): unknown
+    __removeInput(name: string): void
+    __getInputData(): IObject
+
     __setMiddle(name: string, value: unknown): void
     __getMiddle(name: string): unknown
     destroy(): void

package/src/display/IBranch.ts

@@ -3,7 +3,7 @@ import { ILeaf } from './ILeaf'
 export interface IBranch extends ILeaf {
     children: ILeaf[]
 
-    __updateSortChildren(): void
-    add(child: ILeaf, index?: number): void
-    remove(child?: ILeaf): void
+    // __updateSortChildren(): void
+    // add(child: ILeaf, index?: number): void
+    // remove(child?: ILeaf): void
 }

package/src/display/ILeaf.ts

@@ -5,15 +5,16 @@ import { ILeaferCanvas, IHitCanvas } from '../canvas/ILeaferCanvas'
 import { IRenderOptions } from '../renderer/IRenderer'
 
 import { IObject, __Number, __Boolean, __Value, __String } from '../data/IData'
-import { IMatrixWithBoundsData, IMatrix, IBoundsData, IRadiusPointData } from '../math/IMath'
+import { IMatrixWithBoundsData, IMatrix, IPointData, IBoundsData, IMatrixData, IRadiusPointData, IMatrixDecompositionAttr } from '../math/IMath'
 import { IFunction } from '../function/IFunction'
 
 import { ILeafDataProxy } from './module/ILeafDataProxy'
 import { ILeafMatrix } from './module/ILeafMatrix'
 import { ILeafBounds } from './module/ILeafBounds'
-import { ILeafLayout } from '../layout/ILeafLayout'
+import { ILeafLayout, ILayoutBoundsType, ILayoutLocationType } from '../layout/ILeafLayout'
 import { ILeafHit } from './module/ILeafHit'
 import { ILeafRender } from './module/ILeafRender'
+import { ILeafMask } from './module/ILeafMask'
 import { ILeafData } from '../data/ILeafData'
 
 
@@ -30,8 +31,10 @@ export interface ILeafAttrData {
     name: __String
     className: __String
 
+    blendMode: IBlendMode
     opacity: __Number
     visible: __Boolean
+    isMask: __Boolean
     zIndex: __Number
 
     // layout data
@@ -48,11 +51,35 @@ export interface ILeafAttrData {
     draggable: __Boolean
 
     hittable: __Boolean
-    hitType: IHitType
+    hitFill: IHitType
+    hitStroke: IHitType
     hitChildren: __Boolean
+    hitSelf: __Boolean
 }
 
-export type IHitType = 'visible' | 'fill-visible' | 'stroke-visible' | 'all' | 'fill' | 'stroke'
+export type IHitType =
+    | 'visible'
+    | 'always'
+    | 'none'
+
+export type IBlendMode =
+    | 'pass-through'
+    | 'normal'
+    | 'multiply'
+    | 'screen'
+    | 'overlay'
+    | 'darken'
+    | 'lighten'
+    | 'color-dodge'
+    | 'color-burn'
+    | 'hard-light'
+    | 'soft-light'
+    | 'difference'
+    | 'exclusion'
+    | 'hue'
+    | 'saturation'
+    | 'color'
+    | 'luminosity'
 
 export interface ILeafInputData {
     // layer data
@@ -60,8 +87,10 @@ export interface ILeafInputData {
     name?: __String
     className?: __String
 
+    blendMode?: IBlendMode
     opacity?: __Number
     visible?: __Boolean
+    isMask?: __Boolean
     zIndex?: __Number
 
     // layout data
@@ -78,8 +107,10 @@ export interface ILeafInputData {
     draggable?: __Boolean
 
     hittable?: __Boolean
-    hitType?: IHitType
+    hitFill?: IHitType
+    hitStroke?: IHitType
     hitChildren?: __Boolean
+    hitSelf?: __Boolean
 }
 export interface ILeafComputedData {
     // layer data
@@ -87,8 +118,10 @@ export interface ILeafComputedData {
     name?: string
     className?: string
 
+    blendMode?: IBlendMode
     opacity?: number
     visible?: boolean
+    isMask?: boolean
     zIndex?: number
 
     // layout data
@@ -105,79 +138,114 @@ export interface ILeafComputedData {
     draggable?: boolean
 
     hittable?: boolean
-    hitType?: IHitType
+    hitFill?: IHitType
+    hitStroke?: IHitType
     hitChildren?: boolean
+    hitSelf?: boolean
 
     // other
     __childBranchNumber?: number // 存在子分支的个数
     __complex?: boolean // 外观是否复杂
 }
 
-export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix, ILeafDataProxy, ILeafInputData, IEventer {
-    readonly tag: string
+export interface ILeaf extends ILeafMask, ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix, ILeafDataProxy, ILeafInputData, IEventer {
+    tag: string
+    readonly __tag: string
+    readonly innerName: string
+
     readonly __DataProcessor: IObject // IDataProcessor
     readonly __LayoutProcessor: IObject // ILeafLayout
 
     leafer?: ILeafer
-    root?: ILeaf
     parent?: ILeaf
 
-    __isRoot?: boolean
-    __isBranch?: boolean
-    __isBranchLeaf?: boolean
+    readonly isApp?: boolean
+    isLeafer?: boolean
+    isBranch?: boolean
+    isBranchLeaf?: boolean
 
     __: ILeafData
     __layout: ILeafLayout
 
-    __relative: IMatrixWithBoundsData
+    __local: IMatrixWithBoundsData
     __world: IMatrixWithBoundsData
-
     __worldOpacity: number
-    __renderTime: number // μs 1000微秒 = 1毫秒
+
+    readonly worldTransform: IMatrixData
+    readonly localTransform: IMatrixData
+
+    readonly worldBoxBounds: IBoundsData
+    readonly worldStrokeBounds: IBoundsData
+    readonly worldRenderBounds: IBoundsData
+
+    readonly worldOpacity: number
+
+    __renderTime?: number // μs 1000微秒 = 1毫秒
 
     __level: number // 图层级别 root(1) -> hight
     __tempNumber?: number // 用于临时运算储存状态
 
+    __hasMask?: boolean
     __hitCanvas?: IHitCanvas
 
+    readonly __onlyHitMask: boolean
+    readonly __ignoreHitWorld: boolean
+
     __parentWait?: IFunction[]
+    __leaferWait?: IFunction[]
 
-    __addParentWait(item: IFunction): void
-    __runParentWait(): void
+    waitParent(item: IFunction): void
+    waitLeafer(item: IFunction): void
 
-    __setAsLeafer(): void
-    __setAsRoot(): void
+    __bindLeafer(leafer: ILeafer | null): void
 
-    __bindRoot(root: ILeaf): void
+    set(data: IObject): void
+    get(attrNames?: string[]): IObject
 
     // ILeafData ->
-    __set(attrName: string, newValue: __Value): void
-    __get(attrName: string): __Value
-    __updateAttr(attrName: string): void
+    __setAttr(attrName: string, newValue: __Value): void
+    __getAttr(attrName: string): __Value
+
+    forceUpdate(attrName?: string): void
 
     // ILeafMatrix ->
     __updateWorldMatrix(): void
-    __updateRelativeMatrix(): void
+    __updateLocalMatrix(): void
 
     // ILeafBounds ->
     __updateWorldBounds(): void
 
-    __updateRelativeBoxBounds(): void
-    __updateRelativeEventBounds(): void
-    __updateRelativeRenderBounds(): void
+    __updateLocalBoxBounds(): void
+    __updateLocalStrokeBounds(): void
+    __updateLocalRenderBounds(): void
 
     __updateBoxBounds(): void
-    __updateEventBounds(): void
+    __updateStrokeBounds(): void
     __updateRenderBounds(): void
 
-    __updateEventBoundsSpreadWidth(): number
+    __updateStrokeBoundsSpreadWidth(): number
     __updateRenderBoundsSpreadWidth(): number
 
     __onUpdateSize(): void
 
+    // IBranchMask ->
+    __updateMask(value?: boolean): void
+    __renderMask(canvas: ILeaferCanvas, content: ILeaferCanvas, mask: ILeaferCanvas): void
+    __removeMask(child?: ILeaf): void
+
+    // convert
+    getWorld(attrName: IMatrixDecompositionAttr): number
+    getBounds(type: ILayoutBoundsType, locationType?: ILayoutLocationType): IBoundsData
+
+    worldToLocal(world: IPointData, to?: IPointData, isMovePoint?: boolean): void
+    localToWorld(local: IPointData, to?: IPointData, isMovePoint?: boolean): void
+    worldToInner(world: IPointData, to?: IPointData, isMovePoint?: boolean): void
+    innerToWorld(inner: IPointData, to?: IPointData, isMovePoint?: boolean): void
+
     // ILeafHit ->
     __hitWorld(point: IRadiusPointData): boolean
     __hit(local: IRadiusPointData): boolean
+    __drawHitPath(canvas: ILeaferCanvas): void
     __updateHitCanvas(): void
 
     // ILeafRender ->
@@ -185,6 +253,8 @@ export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix,
     __drawFast(canvas: ILeaferCanvas, options: IRenderOptions): void
     __draw(canvas: ILeaferCanvas, options: IRenderOptions): void
 
+    __renderShape(canvas: ILeaferCanvas, options: IRenderOptions): void
+
     __updateWorldOpacity(): void
     __updateRenderTime(): void
     __updateChange(): void
@@ -201,6 +271,4 @@ export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix,
     __updateSortChildren(): void
     add(child: ILeaf, index?: number): void
     remove(child?: ILeaf): void
-}
-
-
+}

package/src/display/module/ILeafBounds.ts

@@ -5,15 +5,15 @@ export type ILeafBoundsModule = ILeafBounds & ThisType<ILeaf>
 export interface ILeafBounds {
     __updateWorldBounds?(): void
 
-    __updateRelativeBoxBounds?(): void
-    __updateRelativeEventBounds?(): void
-    __updateRelativeRenderBounds?(): void
+    __updateLocalBoxBounds?(): void
+    __updateLocalStrokeBounds?(): void
+    __updateLocalRenderBounds?(): void
 
     __updateBoxBounds?(): void
-    __updateEventBounds?(): void
+    __updateStrokeBounds?(): void
     __updateRenderBounds?(): void
 
-    __updateEventBoundsSpreadWidth?(): number
+    __updateStrokeBoundsSpreadWidth?(): number
     __updateRenderBoundsSpreadWidth?(): number
 
     __onUpdateSize?(): void

package/src/display/module/ILeafDataProxy.ts

@@ -4,8 +4,7 @@ import { __Value } from '../../data/IData'
 export type ILeafDataProxyModule = ILeafDataProxy & ThisType<ILeaf>
 
 export interface ILeafDataProxy {
-    __set?(attrName: string, newValue: __Value): void
-    __get?(attrName: string): __Value
-    __updateAttr?(attrName: string): void
+    __setAttr?(name: string, newValue: __Value): void
+    __getAttr?(name: string): __Value
 }
 

package/src/display/module/ILeafHit.ts

@@ -1,10 +1,12 @@
 import { IRadiusPointData } from '../../math/IMath'
 import { ILeaf } from '../ILeaf'
+import { ILeaferCanvas } from '../../canvas/ILeaferCanvas'
 
 export type ILeafHitModule = ILeafHit & ThisType<ILeaf>
 
 export interface ILeafHit {
     __hitWorld?(point: IRadiusPointData): boolean
     __hit?(local: IRadiusPointData): boolean
+    __drawHitPath?(canvas: ILeaferCanvas): void
     __updateHitCanvas?(): void
 }

package/src/display/module/ILeafMask.ts

@@ -0,0 +1,11 @@
+import { ILeaf } from '../ILeaf'
+import { ILeaferCanvas } from '../../canvas/ILeaferCanvas'
+
+export type ILeafMaskModule = ILeafMask & ThisType<ILeaf>
+
+export interface ILeafMask {
+    __updateMask?(value?: boolean): void
+    __renderMask?(canvas: ILeaferCanvas, content: ILeaferCanvas, mask: ILeaferCanvas): void
+    __removeMask?(child?: ILeaf): void
+}
+

package/src/display/module/ILeafMatrix.ts

@@ -4,5 +4,5 @@ export type ILeafMatrixModule = ILeafMatrix & ThisType<ILeaf>
 
 export interface ILeafMatrix {
     __updateWorldMatrix?(): void
-    __updateRelativeMatrix?(): void
+    __updateLocalMatrix?(): void
 }

package/src/display/module/ILeafRender.ts

@@ -9,6 +9,8 @@ export interface ILeafRender {
     __draw?(canvas: ILeaferCanvas, options: IRenderOptions): void
     __drawFast?(canvas: ILeaferCanvas, options: IRenderOptions): void
 
+    __renderShape?(canvas: ILeaferCanvas, options: IRenderOptions): void
+
     __drawBefore?(canvas: ILeaferCanvas, options: IRenderOptions): void
     __drawAfter?(canvas: ILeaferCanvas, options: IRenderOptions): void