@leafer/interface 1.0.0-alpha.10 → 1.0.0-alpha.23

package/package.json

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

package/src/app/IApp.ts

@@ -1,5 +1,6 @@
 import { ILeafer } from './ILeafer'
 
 export interface IApp extends ILeafer {
+    virtualCanvas: boolean
     children: ILeafer[]
 }

package/src/app/ILeafer.ts

@@ -3,7 +3,7 @@ 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 { IInteraction, IInteractionCanvas, IInteractionConfig } from '../interaction/IInteraction'
 import { IWatcher } from '../watcher/IWatcher'
 import { IAutoBounds, IScreenSizeData } from '../math/IMath'
 import { ICanvasManager } from '../canvas/ICanvasManager'
@@ -13,13 +13,12 @@ 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'
-
 
+export type ILeaferType = 'draw' | 'design' | 'board' | 'document' | 'user'
 export interface ILeaferConfig extends IRendererConfig, ILeaferCanvasConfig, IInteractionConfig, ILayouterConfig {
     start?: boolean
-    zoom?: boolean
-    move?: boolean
+    type?: ILeaferType
+    virtualCanvas?: boolean
 }
 
 export interface ILeafer extends IZoomView {
@@ -30,9 +29,13 @@ export interface ILeafer extends IZoomView {
     parent?: IApp
 
     running: boolean
+    ready: boolean
+
+    startTimer: number
 
     autoLayout?: IAutoBounds
 
+    view: unknown
     canvas: ILeaferCanvas
     renderer: IRenderer
 
@@ -46,6 +49,8 @@ export interface ILeafer extends IZoomView {
     hitCanvasManager?: IHitCanvasManager
     imageManager: IImageManager
 
+    config: ILeaferConfig
+
     start(): void
     stop(): void
 
@@ -53,9 +58,6 @@ export interface ILeafer extends IZoomView {
 }
 
 export interface ICreator {
-    ui?(tag: string, data?: IObject): ILeaf
-    event?(type: string, event: IEvent): IEvent
-
     image?(options?: ILeaferImageConfig): ILeaferImage
     canvas?(options?: ILeaferCanvasConfig, manager?: ICanvasManager): ILeaferCanvas
     hitCanvas?(options?: IHitCanvasConfig, manager?: ICanvasManager): IHitCanvas
@@ -65,7 +67,7 @@ export interface ICreator {
     renderer?(target: ILeaf, canvas: ILeaferCanvas, options: IRendererConfig): IRenderer
     selector?(target: ILeaf): 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
 }
 
@@ -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,8 @@ export interface ILeaferCanvasConfig extends IAutoBoundsData {
     view?: string | IObject
     fill?: string
     pixelRatio?: number
+    hittable?: boolean
+    offscreen?: boolean
     webgl?: boolean
 }
 
@@ -71,6 +73,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
@@ -96,24 +99,26 @@ interface ICanvasMethod {
 
     // custom
 
-    setStroke(strokeStyle: string | object, strokeWidth: number, options?: ICanvasStrokeOptions): void
-    setShadow(x: number, y: number, blur: number, color?: string): void
-    setBlur(blur: number): void
+    saveBlendMode(blendMode?: string): void
+    restoreBlendMode(): void
+
+    hitFill(point: IPointData, fillRule?: string): boolean
+    hitStroke(point: IPointData): boolean
 
+    setStroke(strokeStyle: string | object, strokeWidth: number, options?: ICanvasStrokeOptions): void
 
     setWorld(matrix: IMatrixData, parentMatrix?: IMatrixData): void
 
+    setWorldShadow(x: number, y: number, blur: number, color?: string): void
+    setWorldBlur(blur: number): void
 
-    hitPath(point: IPointData, fillRule?: string): boolean
-    hitStroke(point: IPointData): boolean
+    copyWorld(canvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData, blendMode?: string): void
+    copyWorldToInner(canvas: ILeaferCanvas, fromWorld: IMatrixWithBoundsData, toInnerBounds: IBoundsData, blendMode?: string): 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
+    clearWorld(bounds: IBoundsData, ceilPixel?: boolean): void
 
-    replaceBy(canvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData): void
-    copy(canvas: ILeaferCanvas, fromBounds?: IBoundsData, toBounds?: IBoundsData, blendMode?: string): void
-    copyWorldToLocal(canvas: ILeaferCanvas, fromWorld: IMatrixWithBoundsData, toLocalBounds: IBoundsData, blendMode?: string): void
-    fillBounds(bounds: IBoundsData, color: string | object, blendMode?: string): void
-    strokeBounds(bounds: IBoundsData, color: string | object, blendMode?: string): void
-    clipBounds(bounds: IBoundsData): void
-    clearBounds(bounds: IBoundsData): void
     clear(): void
 }
 
@@ -133,13 +138,16 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
     bounds: IBounds
 
     view: unknown
+    parentView: unknown
+    offscreen: boolean
+
     context: ICanvasContext2D
 
     recycled?: boolean
 
     debug(): void
 
-    autoLayout(autoBounds: IAutoBounds, listener: IResizeEventListener): void
+    startAutoLayout(autoBounds: IAutoBounds, listener: IResizeEventListener): void
     stopAutoLayout(): void
 
     resize(size: IScreenSizeData): void
@@ -152,6 +160,7 @@ export interface ILeaferCanvas extends ICanvasAttr, ICanvasMethod, IPathDrawer {
     useSameTransform(canvas: ILeaferCanvas): void
     recycle(): void
 
+    unloadView(): void
     destroy(): void
 }
 

package/src/data/ILeafData.ts

@@ -5,8 +5,10 @@ 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
+    __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,13 +5,13 @@ 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 { ILeafData } from '../data/ILeafData'
@@ -23,14 +23,17 @@ export interface ICachedLeaf {
     bounds: IBoundsData
 }
 
+
 export interface ILeafAttrData {
     // layer data
     id: __String
     name: __String
     className: __String
 
+    blendMode: IBlendMode
     opacity: __Number
     visible: __Boolean
+    isMask: __Boolean
     zIndex: __Number
 
     // layout data
@@ -45,16 +48,49 @@ export interface ILeafAttrData {
     skewY: __Number
 
     draggable: __Boolean
+
+    hittable: __Boolean
+    hitType: IHitType
+    hitChildren: __Boolean
 }
 
+export type IHitType =
+    | 'visible'
+    | 'fill-visible'
+    | 'stroke-visible'
+    | 'all'
+    | 'fill'
+    | 'stroke'
+
+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
     id?: __String
     name?: __String
     className?: __String
 
+    blendMode?: IBlendMode
     opacity?: __Number
     visible?: __Boolean
+    isMask?: __Boolean
     zIndex?: __Number
 
     // layout data
@@ -69,6 +105,10 @@ export interface ILeafInputData {
     skewY?: __Number
 
     draggable?: __Boolean
+
+    hittable?: __Boolean
+    hitType?: IHitType
+    hitChildren?: __Boolean
 }
 export interface ILeafComputedData {
     // layer data
@@ -76,8 +116,10 @@ export interface ILeafComputedData {
     name?: string
     className?: string
 
+    blendMode?: IBlendMode
     opacity?: number
     visible?: boolean
+    isMask?: boolean
     zIndex?: number
 
     // layout data
@@ -92,37 +134,52 @@ export interface ILeafComputedData {
     skewY?: number
 
     draggable?: boolean
+
+    hittable?: boolean
+    hitType?: IHitType
+    hitChildren?: boolean
+
+    // other
+    __childBranchNumber?: number // 存在子分支的个数
+    __complex?: boolean // 外观是否复杂
 }
 
 export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix, ILeafDataProxy, ILeafInputData, IEventer {
-    readonly tag: string
+    tag: string
+    readonly __tag: string
+
     readonly __DataProcessor: IObject // IDataProcessor
     readonly __LayoutProcessor: IObject // ILeafLayout
 
     leafer?: ILeafer
-    root?: ILeaf
     parent?: ILeaf
 
-    __interactionOff?: boolean
-    __childrenInteractionOff?: boolean
-
-    __isRoot?: boolean
+    isLeafer?: boolean
     __isBranch?: boolean
     __isBranchLeaf?: boolean
 
     __: ILeafData
     __layout: ILeafLayout
 
-    __relative: IMatrixWithBoundsData
+    __local: IMatrixWithBoundsData
     __world: IMatrixWithBoundsData
-
     __worldOpacity: number
-    __renderTime: number // μs 1000微秒 = 1毫秒
-    __complex: boolean // 外观是否复杂
+
+    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
 
     __parentWait?: IFunction[]
@@ -130,39 +187,51 @@ export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix,
     __addParentWait(item: IFunction): void
     __runParentWait(): void
 
-    __setAsLeafer(): void
-    __setAsRoot(): void
+    __bindLeafer(leafer: ILeafer): 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
+    __updateAttr(attrName?: string, value?: __Value): void
+
+    forceUpdate(): 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
 
+    // 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 ->
@@ -170,7 +239,10 @@ 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
 
     // path
@@ -181,11 +253,8 @@ export interface ILeaf extends ILeafRender, ILeafHit, ILeafBounds, ILeafMatrix,
 
     // branch
     children?: ILeaf[]
-    __childBranchNumber?: number // 存在子分支的个数
 
     __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,8 @@ 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
+    __updateAttr?(name?: string, value?: __Value): void
 }
 

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/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

@@ -6,12 +6,15 @@ export type ILeafRenderModule = ILeafRender & ThisType<ILeaf>
 
 export interface ILeafRender {
     __render?(canvas: ILeaferCanvas, options: IRenderOptions): void
-    __drawFast?(canvas: ILeaferCanvas, options: IRenderOptions): void
     __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
 
     __updateWorldOpacity?(): void
+    __updateRenderTime?(): void
     __updateChange?(): void
 }

package/src/event/IEvent.ts

@@ -24,6 +24,10 @@ export interface IEventTarget extends IEventer {
 
 }
 
+export interface ILeaferEvent {
+
+}
+
 export interface IRenderEvent {
 
 }
@@ -52,7 +56,7 @@ export interface IUpdateEvent extends IEvent {
 
 }
 
-export interface IAttrEvent extends IEvent {
+export interface IPropertyEvent extends IEvent {
     readonly attrName: string
     readonly oldValue: unknown
     readonly newValue: unknown

package/src/event/IUIEvent.ts

@@ -1,5 +1,7 @@
+import { IObject } from '../data/IData'
 import { ILeafList } from '../data/IList'
 import { IEvent } from './IEvent'
+import { ILeaferImage } from '../image/ILeaferImage'
 
 export interface IUIEvent extends IEvent {
     x: number
@@ -19,6 +21,8 @@ export interface IUIEvent extends IEvent {
     path: ILeafList
     throughPath?: ILeafList // 穿透path，不受层级影响，从上到下只要碰撞到区域就算，一般点击的时候
 
+    origin: IObject
+
     stopDefault(): void
     stopNow(): void
     stop(): void
@@ -46,6 +50,7 @@ export interface IDragEvent extends IPointerEvent {
 
 export interface IDropEvent extends IPointerEvent {
     list: ILeafList
+    data?: IObject
 }
 
 export interface IRotateEvent extends IUIEvent {
@@ -66,4 +71,9 @@ export interface ISwipeEvent extends IDragEvent {
 
 export interface IKeyEvent extends IUIEvent {
 
+}
+
+export interface IImageEvent extends IEvent {
+    image: ILeaferImage
+    error: string | IObject
 }

package/src/image/IImageManager.ts

@@ -1,3 +1,9 @@
+import { ILeaferImage, ILeaferImageConfig, ILeaferImageOnError, ILeaferImageOnLoaded } from './ILeaferImage'
+
+
 export interface IImageManager {
+    get(config: ILeaferImageConfig): ILeaferImage
+    onLoad(config: ILeaferImageConfig, onLoaded: ILeaferImageOnLoaded): void
+    onError(config: ILeaferImageConfig, onError: ILeaferImageOnError): void
     destory(): void
 }

package/src/image/ILeaferImage.ts

@@ -1,10 +1,25 @@
+import { IObject } from '../data/IData'
+
 export interface ILeaferImageConfig {
     url: string
     thumb?: string
 }
 
+export interface ILeaferImageOnLoaded {
+    (image?: ILeaferImage): any
+}
 
+export interface ILeaferImageOnError {
+    (error?: string | IObject, image?: ILeaferImage): any
+}
 
 export interface ILeaferImage {
-    //load(url: string):Promise<>
-}
+    view: unknown
+    width: number
+    height: number
+    ready: boolean
+    load(onSuccess?: ILeaferImageOnLoaded, onError?: ILeaferImageOnError): void
+    getCanvas(width: number, height: number, opacity?: number, _filters?: IObject): unknown
+}
+
+export type IImageStatus = 'wait' | 'thumb-loading' | 'thumb-success' | 'thumb-error' | 'loading' | 'success' | 'error' 

package/src/index.ts

@@ -1,6 +1,6 @@
 export { IApp } from './app/IApp'
-export { ILeafer, ILeaferConfig, ICreator, IUICreator } from './app/ILeafer'
-export { ILeaf, ILeafAttrData, ILeafComputedData, ILeafInputData, ICachedLeaf } from './display/ILeaf'
+export { ILeafer, ILeaferType, ILeaferConfig, ICreator, IUICreator } from './app/ILeafer'
+export { ILeaf, ILeafAttrData, ILeafComputedData, ILeafInputData, ICachedLeaf, IHitType, IBlendMode } from './display/ILeaf'
 export { IBranch } from './display/IBranch'
 export { IZoomView } from './display/IView'
 
@@ -34,15 +34,15 @@ export { IPathDrawer } from './path/IPathDrawer'
 export { IWindingRule, ICanvasContext2D, ITextMetrics, IPath2D } from './canvas/ICanvas'
 export { CanvasPathCommand, IPathCommandData, MCommandData, HCommandData, VCommandData, LCommandData, CCommandData, SCommandData, QCommandData, TCommandData, ZCommandData, ACommandData, RectCommandData, RoundRectCommandData, EllipseCommandData, ArcCommandData, ArcToCommandData } from './path/IPathCommand'
 
-export { ILeaferImage, ILeaferImageConfig } from './image/ILeaferImage'
+export { ILeaferImage, ILeaferImageConfig, ILeaferImageOnLoaded, ILeaferImageOnError } from './image/ILeaferImage'
 
 export { InnerId, IEventer, IEventListener, IEventListenerOptions, IEventListenerMap, IEventListenerItem, IEventListenerId } from './event/IEventer'
-export { IEventTarget, IEvent, IAttrEvent, ILayoutEvent, IRenderEvent, IChildEvent, IResizeEvent, IResizeEventListener, IUpdateEvent, IWatchEvent, ITransformEvent, ITransformEventData, TransformMode } from './event/IEvent'
-export { IUIEvent, IPointerEvent, PointerType, IDragEvent, IDropEvent, ISwipeEvent, IMoveEvent, IZoomEvent, IRotateEvent, IKeyEvent } from './event/IUIEvent'
-export { IInteraction, IInteractionConfig, IWheelConfig, IPointerConfig } from './interaction/IInteraction'
+export { IEventTarget, IEvent, ILeaferEvent, IPropertyEvent, ILayoutEvent, IRenderEvent, IChildEvent, IResizeEvent, IResizeEventListener, IUpdateEvent, IWatchEvent, ITransformEvent, ITransformEventData, TransformMode } from './event/IEvent'
+export { IUIEvent, IPointerEvent, PointerType, IDragEvent, IDropEvent, ISwipeEvent, IMoveEvent, IZoomEvent, IRotateEvent, IKeyEvent, IImageEvent } from './event/IUIEvent'
+export { IInteraction, IInteractionCanvas, IInteractionConfig, IWheelConfig, IPointerConfig } from './interaction/IInteraction'
 
 
 export { __Number, __Boolean, __String, __Object, __Value, IObject, INumberMap, IStringMap, IBooleanMap, IDataTypeHandle } from './data/IData'
 export { ILeafList, ILeafArrayMap, ILeafMap, ILeafLevelList, ILeafListItemCallback } from './data/IList'
-export { IPoint, IPointData, IRadiusPointData, ISize, ISizeData, IScreenSizeData, IBounds, IBoundsData, IBoundsDataHandle, IOffsetBoundsData, ITwoPointBounds, ITwoPointBoundsData, IAutoBounds, IAutoBoundsData, IMatrix, IMatrixData, IMatrixWithBoundsData } from './math/IMath'
+export { IPoint, IPointData, IRadiusPointData, ISize, ISizeData, IScreenSizeData, IBounds, IBoundsData, IBoundsDataHandle, IOffsetBoundsData, ITwoPointBounds, ITwoPointBoundsData, IAutoBounds, IAutoBoundsData, IMatrix, IMatrixData, IMatrixWithBoundsData, IMatrixDecompositionData, IMatrixDecompositionAttr } from './math/IMath'
 export { IFunction } from './function/IFunction'

package/src/interaction/IInteraction.ts

@@ -4,12 +4,11 @@ import { ILeaf } from '../display/ILeaf'
 import { ILeafList } from '../data/IList'
 import { IPointData } from '../math/IMath'
 import { ISelector } from '../selector/ISelector'
-import { ILeaferCanvas } from '../canvas/ILeaferCanvas'
 import { IBounds } from '../math/IMath'
 
 export interface IInteraction {
     target: ILeaf
-    canvas: ILeaferCanvas
+    canvas: IInteractionCanvas
     selector: ISelector
 
     running: boolean
@@ -40,6 +39,11 @@ export interface IInteraction {
     destroy(): void
 }
 
+export interface IInteractionCanvas {
+    bounds: IBounds
+    view: unknown
+}
+
 export interface IInteractionConfig {
     wheel?: IWheelConfig
     pointer?: IPointerConfig
@@ -54,16 +58,20 @@ export interface IWheelConfig {
     delta?: IPointData  // 以chrome为基准, 鼠标滚动一格的距离
     getScale?: INumberFunction
     getMove?: IPointDataFunction
+    preventDefault?: boolean
 }
 
 export interface IPointerConfig {
     hitRadius?: number
     through?: boolean
-    clickTime?: number
+    tapMulti?: boolean
+    tapTime?: number
     longPressTime?: number
     transformTime?: number
+    dragHover?: boolean
     dragDistance?: number
     swipeDistance?: number
     autoMoveDistance?: number
-    ignoreMove: boolean // 性能优化字段, 控制move事件触发次数
+    ignoreMove?: boolean // 性能优化字段, 控制move事件触发次数
+    preventDefault?: boolean
 }

package/src/layout/ILeafLayout.ts

@@ -1,8 +1,8 @@
-import { IBoundsData, IMatrixData } from '../math/IMath'
+import { IBoundsData, IMatrixData, IMatrixDecompositionData } from '../math/IMath'
 import { ILeaf } from '../display/ILeaf'
 
-export type ILayoutLocationType = 'world' | 'relative' | 'local'
-export type ILayoutBoundsType = 'content' | 'box' | 'event' | 'margin' | 'render'
+export type ILayoutLocationType = 'world' | 'local' | 'inner'
+export type ILayoutBoundsType = 'content' | 'box' | 'stroke' | 'margin' | 'render'
 
 export interface ILeafLayout {
 
@@ -13,23 +13,23 @@ export interface ILeafLayout {
     // local
 
     boxBounds: IBoundsData    //  | content + padding |
-    eventBounds: IBoundsData  //  | boxBounds + border |  
-    renderBounds: IBoundsData //  | eventBounds + shadow |
+    strokeBounds: IBoundsData  //  | boxBounds + border |  
+    renderBounds: IBoundsData //  | strokeBounds + shadow |
 
     // auto layout
-    marginBounds: IBoundsData //  | eventBounds + margin |
+    marginBounds: IBoundsData //  | strokeBounds + margin |
     contentBounds: IBoundsData // | content |  
 
-    // relative
+    // local
 
-    //relativeBoxBounds: IBoundsData = leaf.__local
-    relativeEventBounds: IBoundsData
-    relativeRenderBounds: IBoundsData
+    //localBoxBounds: IBoundsData = leaf.__local
+    localStrokeBounds: IBoundsData
+    localRenderBounds: IBoundsData
 
     // state
 
     // matrix changed
-    matrixChanged: boolean
+    matrixChanged: boolean // include positionChanged scaleChanged skewChanged
     positionChanged: boolean // x, y
     scaleChanged: boolean // scaleX scaleY
     rotationChanged: boolean // rotaiton, skewX scaleY 数据更新
@@ -38,7 +38,7 @@ export interface ILeafLayout {
     boundsChanged: boolean
 
     boxBoundsChanged: boolean
-    eventBoundsChanged: boolean
+    strokeBoundsChanged: boolean
     renderBoundsChanged: boolean
 
     localBoxBoundsChanged: boolean // position
@@ -54,24 +54,25 @@ export interface ILeafLayout {
     // keep state
     affectScaleOrRotation: boolean
     affectRotation: boolean
-    eventBoundsSpreadWidth: number
+    strokeBoundsSpreadWidth: number
     renderBoundsSpreadWidth: number
     renderShapeBoundsSpreadWidth: number
 
     update(): void
 
-    getTransform(type: ILayoutLocationType): IMatrixData
-    getBounds(type: ILayoutLocationType, boundsType: ILayoutBoundsType): IBoundsData
+    getTransform(locationType: ILayoutLocationType): IMatrixData
+    getMatrixDecompositionData(locationType: ILayoutLocationType): IMatrixDecompositionData
+    getBounds(type: ILayoutBoundsType, locationType: ILayoutLocationType): IBoundsData
 
     // 独立 / 引用 boxBounds
-    eventBoundsSpread(): void
+    strokeBoundsSpread(): void
     renderBoundsSpread(): void
-    eventBoundsSpreadCancel(): void
+    strokeBoundsSpreadCancel(): void
     renderBoundsSpreadCancel(): void
 
     // bounds
     boxBoundsChange(): void
-    eventBoundsChange(): void
+    strokeBoundsChange(): void
     renderBoundsChange(): void
 
     // matrix

package/src/math/IMath.ts

@@ -10,15 +10,17 @@ export interface IPoint extends IPointData {
     copy(point: IPointData): IPoint
     clone(): IPoint
 
-    rotate(angle: number, center?: IPointData): void
+    rotate(angle: number, center?: IPointData): IPoint
 
-    toLocal(matrix: IMatrixData): void
-    toWorld(matrix: IMatrixData): void
+    toInnerOf(matrix: IMatrixData, to?: IPointData): IPoint
+    toOuterOf(matrix: IMatrixData, to?: IPointData): IPoint
 
     getCenter(to: IPointData): IPointData
     getDistance(to: IPointData): number
     getAngle(to: IPointData): number
     getAtan2(to: IPointData): number
+
+    reset(): void
 }
 
 export interface IRadiusPointData extends IPointData {
@@ -54,31 +56,31 @@ export interface IBounds extends IBoundsData {
     copy(bounds: IBoundsData): IBounds
     clone(): IBounds
 
-    timesMatrix(matrix: IMatrixData): IBounds
-    divideMatrix(matrix: IMatrixData): IBounds
+    scale(scale: number): IBounds
+    toOuterOf(matrix: IMatrixData, to?: IBoundsData): IBounds
     getFitMatrix(put: IBoundsData): IMatrix
-    spread(size: number): void
-    ceil(): void
 
-    add(bounds: IBoundsData): void
-    addList(boundsList: IBounds[]): void
-    setByList(boundsList: IBounds[], addMode?: boolean): void
-    addListWithHandle(list: IObject[], boundsDataHandle: IBoundsDataHandle): void
-    setByListWithHandle(list: IObject[], boundsDataHandle: IBoundsDataHandle, addMode: boolean): void
-    setByBoundsTimesMatrix(fromBounds: IBoundsData, fromMatrix: IMatrixData): void
-    setByPoints(points: IPointData[]): void
+    spread(size: number): IBounds
+    ceil(): IBounds
+
+    add(bounds: IBoundsData): IBounds
+    addList(boundsList: IBounds[]): IBounds
+    setByList(boundsList: IBounds[], addMode?: boolean): IBounds
+    addListWithHandle(list: IObject[], boundsDataHandle: IBoundsDataHandle): IBounds
+    setByListWithHandle(list: IObject[], boundsDataHandle: IBoundsDataHandle, addMode: boolean): IBounds
+    setByPoints(points: IPointData[]): IBounds
 
     hitPoint(point: IPointData, pointMatrix?: IMatrixData): boolean
     hitRadiusPoint(point: IRadiusPointData, pointMatrix?: IMatrixData): boolean
     hit(bounds: IBoundsData, boundsMatrix?: IMatrixData): boolean
     includes(bounds: IBoundsData, boundsMatrix?: IMatrixData): boolean
 
+    intersect(bounds: IBoundsData, boundsMatrix?: IMatrixData): IBounds
     getIntersect(bounds: IBoundsData, boundsMatrix?: IMatrixData): IBounds
-    setByIntersect(bounds: IBoundsData, boundsMatrix?: IMatrixData): void
 
     isSame(bounds: IBoundsData): boolean
     isEmpty(): boolean
-    empty(): void
+    reset(): void
 }
 
 export interface ITwoPointBoundsData {
@@ -120,21 +122,56 @@ export interface IMatrixData {
     e: number
     f: number
 }
+
+export interface IMatrixDecompositionData {
+    x: number
+    y: number
+    scaleX: number
+    scaleY: number
+    rotation: number
+    skewX: number
+    skewY: number
+}
+
+export type IMatrixDecompositionAttr =
+    | 'x'
+    | 'y'
+    | 'scaleX'
+    | 'scaleY'
+    | 'rotation'
+    | 'skewX'
+    | 'skewY'
+
 export interface IMatrix extends IMatrixData {
     set(a: number, b: number, c: number, d: number, e: number, f: number): void
     copy(matrix: IMatrixData): IMatrix
     clone(): IMatrix
 
     translate(x: number, y: number): IMatrix
+    translateInner(x: number, y: number): IMatrix
+
     scale(x: number, y?: number): IMatrix
+    scaleOf(center: IPointData, x: number, y?: number): IMatrix
+    scaleOfInner(center: IPointData, x: number, y?: number): IMatrix
+
     rotate(angle: number): IMatrix
+    rotateOf(center: IPointData, angle: number): IMatrix
+    rotateOfInner(center: IPointData, angle: number): IMatrix
+
+    skew(x: number, y?: number): IMatrix
+    skewOf(center: IPointData, x: number, y?: number): IMatrix
+    skewOfInner(center: IPointData, x: number, y?: number): IMatrix
+
+    multiply(matrix: IMatrixData): IMatrix
+    divide(matrix: IMatrixData): IMatrix
+    invert(): IMatrix
+
+    toOuterPoint(inner: IPointData, to?: IPointData): void
+    toInnerPoint(outer: IPointData, to?: IPointData): void
 
-    times(matrix: IMatrixData): void
-    divide(matrix: IMatrixData): void
-    invert(): void
+    decompose(): IMatrixDecompositionData
 
-    toWorldPoint(local: IPointData, world?: IPointData): void
-    toLocalPoint(world: IPointData, local?: IPointData): void
+    reset(): void
 }
 
 

package/src/platform/IPlatform.ts

@@ -4,4 +4,6 @@ import { ILeaferCanvas } from '../canvas/ILeaferCanvas'
 export interface IPlatform {
     requestRender?(render: IFunction): void
     canvas?: ILeaferCanvas
+    isWorker?: boolean
+    conicGradientRotate90?: boolean // fixfox need rotate
 }

package/src/renderer/IRenderer.ts

@@ -38,8 +38,8 @@ export interface IRenderer {
     render(callback?: IFunction): void
     renderOnce(callback?: IFunction): void
     partRender(): void
-    clipRender(bounds: IBounds, fullMode?: boolean): void
-    fullRender(bounds?: IBounds): void
+    clipRender(bounds: IBounds): void
+    fullRender(): void
 
     addBlock(block: IBounds): void
     mergeBlocks(): void