@leafer-ui/interface 1.0.0-rc.3 → 1.0.0-rc.30

package/src/editor/IEditor.ts

@@ -0,0 +1,163 @@
+import { IGroup, IUI, IBox, IRectInputData, ISelectorProxy, IEditSize, ICursorType, IAlign, IUnitPointData, IDragEvent, IRotateEvent, IStroke, IFill, ILeaf, ILeafList, IObject, IBoxInputData, IGroupInputData, IImageCursor, IRect, IBoundsData, IKeyEvent, IUIInputData, IZoomEvent, IColorString } from '@leafer-ui/interface'
+
+export interface IEditorBase extends IGroup, ISelectorProxy {
+    config: IEditorConfig
+    readonly mergeConfig: IEditorConfig // 实际使用，合并了选中元素上的editConfig
+
+    hoverTarget?: IUI
+    target?: IUI | IUI[]
+
+    readonly list: IUI[]
+    leafList: ILeafList
+    openedGroupList: ILeafList
+
+    readonly editing: boolean
+    innerEditing: boolean
+    readonly groupOpening: boolean
+
+    readonly multiple: boolean
+    readonly single: boolean
+
+    readonly dragging: boolean
+
+    element?: IUI
+    buttons: IGroup
+
+    selector: IGroup
+    editBox: IEditBoxBase
+    editTool?: IObject
+    innerEditor?: IObject
+
+    select(target: IUI | IUI[]): void
+    cancel(): void
+
+    hasItem(item: IUI): boolean
+    shiftItem(item: IUI): void
+    addItem(item: IUI): void
+    removeItem(item: IUI): void
+
+    update(): void
+    updateEditBox(): void
+    updateEditTool(): void
+
+    getEditSize(ui: ILeaf): IEditSize
+
+    onMove(e: IDragEvent): void
+    onScale(e: IDragEvent | IZoomEvent): void
+    onRotate(e: IDragEvent | IRotateEvent): void
+    onSkew(e: IDragEvent): void
+
+    group(group?: IGroup | IGroupInputData): IGroup
+    ungroup(): IUI[]
+    openGroup(group: IGroup): void
+    closeGroup(group: IGroup): void
+
+    openInnerEditor(target?: IUI): void
+    closeInnerEditor(): void
+
+    lock(): void
+    unlock(): void
+
+    toTop(): void
+    toBottom(): void
+}
+
+export interface IEditorConfig {
+    editSize?: IEditSize
+    dualEvent?: boolean
+    keyEvent?: boolean
+
+    stroke?: IStroke
+    strokeWidth?: number
+
+    pointFill?: IFill
+    pointSize?: number
+    pointRadius?: number
+
+    point?: IBoxInputData | IBoxInputData[]
+    middlePoint?: IBoxInputData | IBoxInputData[]
+    rotatePoint?: IBoxInputData
+
+    rect?: IBoxInputData
+    area?: IRectInputData
+    mask?: IColorString
+
+    buttonsDirection?: 'top' | 'right' | 'bottom' | 'left'
+    buttonsFixed?: boolean
+    buttonsMargin?: number
+
+    hideOnMove?: boolean
+    hideOnSmall?: boolean | number
+
+    moveCursor?: ICursorType
+    resizeCursor?: IImageCursor
+    rotateCursor?: IImageCursor
+    skewCursor?: IImageCursor
+
+    around?: IAlign | IUnitPointData
+    lockRatio?: boolean | 'corner'
+    rotateGap?: number
+
+    selector?: boolean
+    hover?: boolean
+    hoverStyle?: IUIInputData
+    select?: 'press' | 'tap'
+    boxSelect?: boolean
+    continuousSelect?: boolean // 点击可以连续选择
+    openInner?: 'double' | 'long' // 双击/长按打开内部
+
+    moveable?: boolean
+    rotateable?: boolean | 'rotate'
+    resizeable?: boolean | 'zoom'
+    skewable?: boolean
+}
+
+export interface IEditPoint extends IBox {
+    direction: number
+    pointType: IEditPointType
+}
+
+export type IEditPointType = 'rotate' | 'resize'
+
+export interface IEditBoxBase extends IGroup {
+    editor: IEditorBase
+    dragging: boolean
+    moving: boolean
+
+    view: IGroup //  放置默认编辑工具控制点
+
+    circle: IEditPoint
+    rect: IRect
+
+    buttons: IGroup
+
+    resizePoints: IEditPoint[]
+    rotatePoints: IEditPoint[]
+    resizeLines: IEditPoint[]
+
+    readonly flipped: boolean
+    readonly flippedX: boolean
+    readonly flippedY: boolean
+    readonly flippedOne: boolean
+
+    enterPoint: IEditPoint
+
+    getPointStyle(userStyle?: IBoxInputData): IBoxInputData
+    getPointsStyle(): IBoxInputData[]
+    getMiddlePointsStyle(): IBoxInputData[]
+
+    load(): void
+    update(bounds: IBoundsData): void
+    unload(): void
+
+    onArrow(e: IKeyEvent): void
+
+}
+
+export interface IEditorConfigFunction {
+    (ui: any): IEditorConfig
+}
+
+export interface IEditToolFunction {
+    (ui: any): string
+}

package/src/index.ts

@@ -1,7 +1,11 @@
 export * from '@leafer/interface'
 
+export { IApp, IAppConfig } from './app/IApp'
+export { ILeafer } from './app/ILeafer'
+
 export {
     ILine, ILineInputData, ILineData,
+    IArrow, IArrowInputData, IArrowData,
     IRect, IRectInputData, IRectData,
     IEllipse, IEllipseInputData, IEllipseData,
     IPolygon, IPolygonInputData, IPolygonData,
@@ -12,24 +16,31 @@ export {
     IImage, IImageInputData, IImageData,
     ICanvas, ICanvasInputData, ICanvasData,
     IFrame, IFrameInputData, IFrameData,
+    IFlow, IFlowInputData, IFlowData,
     IBox, IBoxInputData, IBoxData,
     IGroup, IGroupInputData, IGroupData,
     ILeaferInputData, ILeaferData,
-    IUI, IUIBaseInputData, IUIData,
-    IUITag, IUIInputData
+    IAppInputData, IAppData,
+    IUI, IUIBaseInputData, IUIData, IFindUIMethod,
+    IUITag, IUIInputData, IUIJSONData
 } from './IUI'
-export { IUnitData, IVectorPath, IShadowEffect, IBlurEffect, IGrayscaleEffect, IStrokeAlign, IStrokeJoin, IStrokeCap, IRGB, IRGBA, IColor, IColorStop, IPaint, IGradientPaint, IImagePaint, IImagePaintMode, IFontWeight, ITextCase, ITextDecoration, ITextAlign, IVerticalAlign, IOverflow } from './type/IType'
-export { ICornerRadiusString, IStrokeWidthString, IPaintString, IShadowString, IPercent, IDashPatternString, IColorString as IStringColor } from './type/IStringType'
+
+export { IVectorPath, IShadowEffect, IBlurEffect, IGrayscaleEffect, IFill, IStroke, IPaintAttr, IStrokeAlign, IStrokeJoin, IStrokeCap, IArrowType, IPathDataArrow, IPathDataArrowMap, IRGB, IRGBA, IColor, IColorStop, IPaint, IGradientPaint, IImagePaint, IImagePaintMode, IFontWeight, ITextCase, ITextDecoration, ITextAlign, IVerticalAlign, IOverflow, ITextWrap, IRepeat } from './type/IType'
+export { ICornerRadiusString, IStrokeWidthString, IPaintString, IShadowString, IPercent, IDashPatternString, IColorString } from './type/IStringType'
 export { ILeafFill, ILeafPaint, ILeafPaintPatternData, ILeafPaintColor, ILeafStrokePaint, ILeafShadowEffect } from './type/IComputedType'
+export { IStrokeAttrData, IStrokeInputData, IStrokeComputedData, ITextStyleAttrData, ITextStyleInputData, ITextStyleComputedData, IEffectAttrData, IEffectInputData, IEffectComputedData } from './ICommonAttr'
 
 export { IUIRenderModule, IRectRenderModule, IImageRenderModule, ITextRenderModule, IGroupRenderModule, IFrameRenderModule } from './module/IUIRender'
 export { IUIBoundsModule } from './module/IUIBounds'
 export { IUIHitModule } from './module/IUIHit'
+export { IPathArrowModule } from './module/IPathArrow'
 export { ITextConvertModule } from './module/ITextConvert'
 export { IColorConvertModule } from './module/IColorConvert'
-export { IExportModule, IExportOptions, IExportResult, IExportResultFunction } from './module/IExport'
+export { IExportModule } from './module/IExport'
+export { IStateModule } from './module/IState'
 
-
-export { IPaintModule } from './module/IPaint'
+export { IPaintModule, IPaintImageModule, IPaintGradientModule } from './module/IPaint'
 export { IEffectModule } from './module/IEffect'
-export { ICachedShape } from './ICachedShape'
+export { ICachedShape } from './ICachedShape'
+
+export { IEditorBase, IEditorConfig, IEditBoxBase, IEditPoint, IEditPointType, IEditToolFunction, IEditorConfigFunction } from './editor/IEditor'

package/src/module/IColorConvert.ts

@@ -1,5 +1,5 @@
 import { IColor } from '../type/IType'
 
 export interface IColorConvertModule {
-    string?(color: IColor, opacity?: number): string
+    string(color: IColor, opacity?: number): string
 }

package/src/module/IEffect.ts

@@ -1,12 +1,12 @@
-import { ILeaferCanvas, IRenderOptions } from '@leafer/interface'
+import { ILeaferCanvas } from '@leafer/interface'
 
 import { IUI } from '../IUI'
 import { ICachedShape } from '../ICachedShape'
 
 
 export interface IEffectModule {
-    shadow?(ui: IUI, current: ILeaferCanvas, shape: ICachedShape, options: IRenderOptions): void
-    innerShadow?(ui: IUI, current: ILeaferCanvas, shape: ICachedShape, options: IRenderOptions): void
-    blur?(ui: IUI, current: ILeaferCanvas, origin: ILeaferCanvas, options: IRenderOptions): void
-    backgroundBlur?(ui: IUI, current: ILeaferCanvas, shape: ICachedShape, options: IRenderOptions): void
+    shadow(ui: IUI, current: ILeaferCanvas, shape: ICachedShape): void
+    innerShadow(ui: IUI, current: ILeaferCanvas, shape: ICachedShape): void
+    blur(ui: IUI, current: ILeaferCanvas, origin: ILeaferCanvas): void
+    backgroundBlur(ui: IUI, current: ILeaferCanvas, shape: ICachedShape): void
 }

package/src/module/IExport.ts

@@ -1,19 +1,7 @@
-import { ILeaf, IExportFileType, IBlob } from '@leafer/interface'
-
-export interface IExportOptions {
-    quality?: number
-    blob?: boolean
-}
-
-export interface IExportResult {
-    data: IBlob | string | boolean
-}
-
-export interface IExportResultFunction {
-    (data: IExportResult): void
-}
+import { ILeaf, IExportFileType, IExportOptions, IExportResult } from '@leafer/interface'
 
 
 export interface IExportModule {
-    export?(leaf: ILeaf, filename: IExportFileType | string, options?: IExportOptions | number | boolean): Promise<IExportResult>
+    running?: boolean
+    export(leaf: ILeaf, filename: IExportFileType | string, options?: IExportOptions | number | boolean): Promise<IExportResult>
 }

package/src/module/IPaint.ts

@@ -1,26 +1,45 @@
-import { ILeaferCanvas, IRenderOptions, IBooleanMap } from '@leafer/interface'
+import { ILeaferCanvas, IRenderOptions, IBooleanMap, IBoundsData, ILeaferImage, IAround, IPointData, IMatrixData } from '@leafer/interface'
 
-import { ILeafPaint } from '../type/IComputedType'
+import { ILeafPaint, ILeafPaintPatternData } from '../type/IComputedType'
 import { IUI, IUIData } from '../IUI'
 import { ICachedShape } from '../ICachedShape'
+import { IGradientPaint, IImagePaint, IPaintAttr } from '../type/IType'
+
 
 export interface IPaintModule {
-    compute?(ui: IUI, attrName: 'fill' | 'stroke'): void
+    compute(attrName: IPaintAttr, ui: IUI): void
+
+    fill(fill: string, ui: IUI, canvas: ILeaferCanvas,): void
+    fills(fills: ILeafPaint[], ui: IUI, canvas: ILeaferCanvas): void
 
-    fill?(ui: IUI, canvas: ILeaferCanvas, fill: string): void
-    fills?(ui: IUI, canvas: ILeaferCanvas, fills: ILeafPaint[]): void
+    fillText(ui: IUI, canvas: ILeaferCanvas): void
 
-    fillText?(ui: IUI, canvas: ILeaferCanvas): void
+    stroke(stroke: string, ui: IUI, canvas: ILeaferCanvas): void
+    strokes(strokes: ILeafPaint[], ui: IUI, canvas: ILeaferCanvas): void
 
-    stroke?(ui: IUI, canvas: ILeaferCanvas, stroke: string): void
-    strokes?(ui: IUI, canvas: ILeaferCanvas, strokes: ILeafPaint[]): void
+    strokeText(stroke: string | ILeafPaint[], ui: IUI, canvas: ILeaferCanvas): void
+    drawTextStroke(ui: IUI, canvas: ILeaferCanvas): void
 
-    strokeText?(ui: IUI, canvas: ILeaferCanvas, stroke: string): void
-    strokesText?(ui: IUI, canvas: ILeaferCanvas, strokes: ILeafPaint[]): void
+    shape(ui: IUI, current: ILeaferCanvas, renderOptions: IRenderOptions): ICachedShape
+}
 
-    drawTextStroke?(ui: IUI, canvas: ILeaferCanvas): void
 
-    shape?(ui: IUI, current: ILeaferCanvas, options: IRenderOptions): ICachedShape
+export interface IPaintImageModule {
+    image(ui: IUI, attrName: string, paint: IImagePaint, boxBounds: IBoundsData, firstUse: boolean): ILeafPaint
+    checkImage(ui: IUI, canvas: ILeaferCanvas, paint: ILeafPaint, allowPaint?: boolean): boolean
+    createPattern(ui: IUI, paint: ILeafPaint, pixelRatio: number): boolean
+    recycleImage(attrName: IPaintAttr, data: IUIData): IBooleanMap
 
-    recycleImage?(data: IUIData, attrName: string): IBooleanMap
+    createData(leafPaint: ILeafPaint, image: ILeaferImage, paint: IImagePaint, box: IBoundsData): void
+    getPatternData(paint: IImagePaint, box: IBoundsData, image: ILeaferImage): ILeafPaintPatternData
+    fillOrFitMode(data: ILeafPaintPatternData, box: IBoundsData, x: number, y: number, scaleX: number, scaleY: number, rotation: number): void
+    clipMode(data: ILeafPaintPatternData, box: IBoundsData, x: number, y: number, scaleX: number, scaleY: number, rotation: number): void
+    repeatMode(data: ILeafPaintPatternData, box: IBoundsData, width: number, height: number, x: number, y: number, scaleX: number, scaleY: number, rotation: number, around: IAround): void
 }
+
+export interface IPaintGradientModule {
+    linearGradient(paint: IGradientPaint, box: IBoundsData): ILeafPaint
+    radialGradient(paint: IGradientPaint, box: IBoundsData): ILeafPaint
+    conicGradient(paint: IGradientPaint, box: IBoundsData): ILeafPaint
+    getTransform(box: IBoundsData, from: IPointData, to: IPointData, stretch: number, rotate90: boolean): IMatrixData
+}

package/src/module/IPathArrow.ts

@@ -0,0 +1,8 @@
+import { IPathDataArrowMap } from '../type/IType'
+import { IUI } from '../IUI'
+
+
+export interface IPathArrowModule {
+    list: IPathDataArrowMap
+    addArrows(ui: IUI, changeRenderPath?: boolean): void
+}

package/src/module/IState.ts

@@ -0,0 +1,11 @@
+import { ILeaf, IStateStyleType } from '@leafer/interface'
+
+export interface IStateModule {
+    isHover(leaf: ILeaf): boolean
+    isPress(leaf: ILeaf): boolean
+    isFocus(leaf: ILeaf): boolean
+    isDrag(leaf: ILeaf): boolean
+
+    setStyle(leaf: ILeaf, stateType: IStateStyleType, value: boolean): void
+    updateEventStyle(leaf: ILeaf, eventType: string): void
+}

package/src/module/ITextConvert.ts

@@ -1,5 +1,5 @@
 import { ITextData, ITextDrawData } from '../IUI'
 
 export interface ITextConvertModule {
-    getDrawData?(content: string, style: ITextData): ITextDrawData
+    getDrawData(content: string, style: ITextData): ITextDrawData
 }

package/src/type/IComputedType.ts

@@ -1,4 +1,4 @@
-import { IBlendMode, ILeaferImage, IMatrixData } from '@leafer/interface'
+import { IBlendMode, ILeaferImage, IMatrixData, ITaskItem } from '@leafer/interface'
 
 import { IColorString } from './IStringType'
 import { IStrokeAlign, IStrokeJoin, IStrokeCap, IImagePaintMode } from './IType'
@@ -15,6 +15,7 @@ export interface ILeafPaint {
     image?: ILeaferImage
     loadId?: number
     patternId?: string
+    patternTask?: ITaskItem
     data?: ILeafPaintPatternData
 }
 
@@ -26,6 +27,7 @@ export interface ILeafPaintPatternData {
     opacity?: number
     transform?: IMatrixData
     mode?: IImagePaintMode
+    repeat?: 'repeat' | 'repeat-x' | 'repeat-y'
 }
 
 export type ILeafFill = ILeafPaint

package/src/type/IType.ts

@@ -1,13 +1,14 @@
-import { IPointData, IPathCommandData, IWindingRule, IBlendMode, IExportFileType } from '@leafer/interface'
-import { IColorString } from './IStringType'
-
-export interface IUnitData {
-    type: 'percent' | 'px'
-    value: number
-}
+import { IPointData, IPathCommandData, IWindingRule, IBlendMode, IExportFileType, ISizeData, IFourNumber, IAlign, IUnitPointData } from '@leafer/interface'
+import { IColorString, IPaintString } from './IStringType'
 
 export type IPaint = ISolidPaint | IGradientPaint | IImagePaint
 
+export type IFill = IPaint | IPaint[] | IPaintString
+
+export type IStroke = IPaint | IPaint[] | IPaintString
+
+export type IPaintAttr = 'fill' | 'stroke'
+
 export interface IPaintBase {
     type: IPaintType
     blendMode?: IBlendMode
@@ -46,10 +47,10 @@ export interface IRGBA extends IRGB {
 // ---
 export interface IGradientPaint extends IPaintBase {
     type: IGradientType
-    from?: IPointData
-    to?: IPointData
+    from?: IAlign | IUnitPointData
+    to?: IAlign | IUnitPointData
     stretch?: number
-    stops: IColorStop[]
+    stops: IColorStop[] | IColorString[]
 }
 export interface IColorStop {
     offset: number
@@ -65,9 +66,16 @@ export interface IImagePaint extends IPaintBase {
 
     filters?: IImageFilters
 
+    padding?: IFourNumber
+
+    align?: IAlign
     offset?: IPointData
+
+    size?: number | ISizeData
     scale?: number | IPointData
     rotation?: number
+
+    repeat?: IRepeat
 }
 export interface IImageFilters {
     exposure?: number // 曝光
@@ -78,13 +86,33 @@ export interface IImageFilters {
     highlights?: number // 高光
     shadows?: number // 阴影
 }
-export type IImagePaintMode = 'cover' | 'fit' | 'strench' | 'clip' | 'repeat'
+export type IImagePaintMode = 'normal' | 'cover' | 'fit' | 'strench' | 'clip' | 'repeat'
+export type IRepeat = boolean | 'x' | 'y'
 
 // 描边
 export type IStrokeAlign = 'inside' | 'outside' | 'center'
-export type IStrokeCap = 'none' | 'round' | 'square' | 'arrow-lines' | 'arrow-equilateral'
+export type IStrokeCap = 'none' | 'round' | 'square'
 export type IStrokeJoin = 'bevel' | 'round' | 'miter'
 
+// 箭头
+export type IArrowType = IPathDataArrow | 'none' | 'angle' | 'angle-side' | 'arrow' | 'triangle' | 'triangle-flip' | 'circle' | 'circle-line' | 'square' | 'square-line' | 'diamond' | 'diamond-line' | 'mark'
+
+export interface IPathDataArrowMap {
+    [name: string]: IPathDataArrow
+}
+
+export interface IPathDataArrow {
+    connect?: IPathDataArrowOffset // 箭头与线条的连接点位置
+    offset?: IPathDataArrowOffset  // 箭头偏移距离，与末端对齐
+    path: IPathCommandData
+}
+
+export interface IPathDataArrowOffset {
+    x?: number // 偏移距离（x轴）
+    bevelJoin?: number // strokeJoin 为 bevel 时增加的偏移距离（x轴）
+    roundJoin?: number // strokeJoin 为 round 时增加的偏移距离（x轴）
+}
+
 // 文本
 export type ITextAlign = 'left' | 'center' | 'right' | 'justify'
 export type IVerticalAlign = 'top' | 'middle' | 'bottom'
@@ -102,6 +130,7 @@ export type IFontWeightString =
     | 'extra-bold'
     | 'black'
 export type ITextDecoration = 'none' | 'under' | 'delete'
+export type ITextWrap = 'normal' | 'none' | 'break'
 
 // 路径
 export interface IVectorPath {