@leafer-ui/display 1.0.0-rc.22 → 1.0.0-rc.23

package/package.json

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

package/src/Box.ts

@@ -49,6 +49,7 @@ export class Box extends Group implements IBox {
 
     public __updateBoxBounds(): void {
         const data = this.__
+
         if (data.__autoSide && this.children.length) {
             if (this.leafer) this.leafer.layouter.addExtra(this)
             super.__updateBoxBounds()
@@ -60,6 +61,8 @@ export class Box extends Group implements IBox {
         } else {
             this.__updateRectBoxBounds()
         }
+
+        if (data.flow) this.__updateContentBounds()
     }
 
     @rewrite(rect.__updateStrokeBounds)

package/src/Leafer.ts

@@ -195,10 +195,6 @@ export class Leafer extends Group implements ILeafer {
         Object.keys(data).forEach(key => (this as any)[key] = data[key])
     }
 
-    public forceFullRender(): void {
-        this.forceRender()
-    }
-
     public forceRender(bounds?: IBoundsData): void {
         this.renderer.addBlock(bounds ? new Bounds(bounds) : this.canvas.bounds)
         if (this.viewReady) this.renderer.update()
@@ -280,7 +276,7 @@ export class Leafer extends Group implements ILeafer {
         if (this.canvas.allowBackgroundColor) {
             this.canvas.backgroundColor = newValue as string
         } else {
-            this.forceFullRender()
+            this.forceRender()
         }
     }
 

package/src/Text.ts

@@ -1,7 +1,7 @@
-import { ILeaferCanvas, IPathDrawer, IPathCommandData, IBoolean, INumber, IString, IBoundsData, IFourNumber } from '@leafer/interface'
+import { ILeaferCanvas, IPathDrawer, IPathCommandData, IBoolean, INumber, IString, IBoundsData, IUnitData } from '@leafer/interface'
 import { BoundsHelper, boundsType, surfaceType, dataProcessor, registerUI, affectStrokeBoundsType, hitType, MathHelper } from '@leafer/core'
 
-import { IFill, IText, IFontWeight, ITextCase, ITextDecoration, ITextData, ITextInputData, ITextAlign, IVerticalAlign, ITextDrawData, IOverflow, IUnitData, IStrokeAlign, IHitType, ITextWrap } from '@leafer-ui/interface'
+import { IFill, IText, IFontWeight, ITextCase, ITextDecoration, ITextData, ITextInputData, ITextAlign, IVerticalAlign, ITextDrawData, IOverflow, IStrokeAlign, IHitType, ITextWrap } from '@leafer-ui/interface'
 import { TextData, UnitConvert } from '@leafer-ui/data'
 
 import { TextConvert } from '@leafer-ui/external'
@@ -9,7 +9,7 @@ import { TextConvert } from '@leafer-ui/external'
 import { UI } from './UI'
 
 
-const { copyAndSpread, includes, spread, setList } = BoundsHelper
+const { copyAndSpread, includes, isSame, spread, setList } = BoundsHelper
 
 @registerUI()
 export class Text extends UI implements IText {
@@ -26,9 +26,6 @@ export class Text extends UI implements IText {
     @boundsType(0)
     declare public height: INumber
 
-    @boundsType(0)
-    public padding: IFourNumber
-
     @surfaceType('#000000')
     declare public fill: IFill
 
@@ -172,7 +169,7 @@ export class Text extends UI implements IText {
         if (italic) b.width += fontSize * 0.16
 
         const contentBounds = includes(b, bounds) ? b : bounds
-        if (contentBounds !== layout.contentBounds) {
+        if (!isSame(contentBounds, layout.contentBounds)) {
             layout.contentBounds = contentBounds
             layout.renderChanged = true
             setList(data.__textBoxBounds = {} as IBoundsData, [b, bounds])

package/src/UI.ts

@@ -1,7 +1,7 @@
-import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IAround, IValue, IWindingRule, IPathCreator, IFourNumber, IBoundsData } from '@leafer/interface'
+import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IEraserType, IValue, IWindingRule, IPathCreator, IFourNumber, IBoundsData, IFlowType, IGap, IWrap, IAxis, IConstraint, IAutoBoxData, IFlowBoxType, IPointGap, IFlowAlign, IFlowAxisAlign, IFindCondition, IAutoSize, IRangeSize, IAlign, IUnitPointData } 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, pen, 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, IEditorConfig, IEditorConfigFunction, IEditToolFunction } from '@leafer-ui/interface'
+import { IUI, IShadowEffect, IBlurEffect, IStrokeAlign, IStrokeJoin, IStrokeCap, IBlendMode, IDashPatternString, IShadowString, IGrayscaleEffect, IUIData, IGroup, IStrokeWidthString, ICornerRadiusString, IUIInputData, IExportOptions, IExportResult, IFill, IStroke, IArrowType, IFindUIMethod, ILeafer, IEditorConfig, IEditorConfigFunction, IEditToolFunction } from '@leafer-ui/interface'
 import { arrowType, effectType, stateType, zoomLayerType } from '@leafer-ui/decorator'
 
 import { UIData } from '@leafer-ui/data'
@@ -72,13 +72,13 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
 
 
     @maskType(false)
-    public mask: IBoolean
+    public mask: IMaskType
 
-    @surfaceType('pixel')
+    @surfaceType('pixel') // will remove
     public maskType: IMaskType
 
     @eraserType(false)
-    public eraser: IBoolean
+    public eraser: IEraserType
 
 
     // position
@@ -114,12 +114,91 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
     public skewY: INumber
 
 
+    // offset
+    @positionType(0, true)
+    public offsetX: INumber
+
+    @positionType(0, true)
+    public offsetY: INumber
+
+    // scroll
+    @positionType(0, true)
+    public scrollX: INumber
+
+    @positionType(0, true)
+    public scrollY: INumber
+
+
+    // center
     @autoLayoutType()
-    public around: IAround
+    public origin: IAlign | IUnitPointData
+
+    @autoLayoutType()
+    public around: IAlign | IUnitPointData
 
 
+    // image
     @dataType(false)
-    public draggable: IBoolean | 'x' | 'y'
+    public lazy: IBoolean  // load image / compute paint
+
+    @naturalBoundsType(1)
+    public pixelRatio: INumber
+
+
+    // path
+    @pathInputType()
+    public path: IPathCommandData | IPathString
+
+    @pathType()
+    public windingRule: IWindingRule
+
+    @pathType(true)
+    public closed: boolean
+
+
+    // auto layout
+    @autoLayoutType(false)
+    public flow: IFlowType
+
+    @boundsType(0)
+    public padding: IFourNumber
+
+    @boundsType(0)
+    public gap: IGap | IPointGap
+
+    @boundsType('top-left')
+    public align: IFlowAlign | IFlowAxisAlign
+
+    @boundsType(false)
+    public wrap: IWrap
+
+    @boundsType('box')
+    public itemBox: IFlowBoxType
+
+
+    @boundsType(true)
+    public inFlow: IBoolean
+
+    @boundsType() // rewrite in flow
+    public autoWidth: IAutoSize
+
+    @boundsType()  // rewrite in flow
+    public autoHeight: IAutoSize
+
+    @boundsType()
+    public autoBox: IAutoBoxData | IConstraint
+
+
+    @boundsType()
+    public widthRange: IRangeSize
+
+    @boundsType()
+    public heightRange: IRangeSize
+
+
+    // drag
+    @dataType(false)
+    public draggable: IBoolean | IAxis
 
     @dataType()
     public dragBounds?: IBoundsData | 'parent'
@@ -128,9 +207,6 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
     @dataType(false)
     public editable: IBoolean
 
-    @dataType('size')
-    public editSize?: IEditSize
-
 
     // hit
     @hitType(true)
@@ -194,25 +270,6 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
     @strokeType(10)
     public miterLimit: INumber
 
-    // 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
-
-    @pathType(true)
-    public closed: boolean
-
 
     // arrow
 
@@ -322,9 +379,13 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
 
     // hit rewrite
 
-    public find(_condition: number | string | IFindUIMethod, _options?: any): IUI[] { return undefined }
+    public find(_condition: number | string | IFindCondition | IFindUIMethod, _options?: any): IUI[] { return undefined }
+
+    public findTag(tag: string | string[]): IUI[] { return this.find({ tag }) }
+
+    public findOne(_condition: number | string | IFindCondition | IFindUIMethod, _options?: any): IUI { return undefined }
 
-    public findOne(_condition: number | string | IFindUIMethod, _options?: any): IUI { return undefined }
+    public findId(id: number | string): IUI { return this.findOne({ id }) }
 
 
     // path

package/types/index.d.ts

@@ -1,6 +1,6 @@
-import { IString, INumber, IBoolean, IMaskType, IAround, IBoundsData, IHitType, ICursorType, IFourNumber, IPathCommandData, IPathString, IWindingRule, IPointData, IPathCreator, IValue, ILeaferCanvas, IPathDrawer, IExportFileType, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IResizeEvent, IObject, IZoomType, IRenderOptions, ILeaferImage, ICanvasContext2DSettings, ICanvasContext2D } from '@leafer/interface';
+import { IString, INumber, IBoolean, IMaskType, IEraserType, IAlign, IUnitPointData, IPathCommandData, IPathString, IWindingRule, IFlowType, IFourNumber, IGap, IPointGap, IFlowAlign, IFlowAxisAlign, IWrap, IFlowBoxType, IAutoSize, IAutoBoxData, IConstraint, IRangeSize, IAxis, IBoundsData, IHitType, ICursorType, IPointData, IPathCreator, IValue, IFindCondition, ILeaferCanvas, IPathDrawer, IExportFileType, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IResizeEvent, IObject, IZoomType, IRenderOptions, ILeaferImage, ICanvasContext2DSettings, ICanvasContext2D, IUnitData } from '@leafer/interface';
 import { Leaf, LeafList } from '@leafer/core';
-import { IUI, IUIData, IUIInputData, ILeafer, IGroup, IBlendMode, IEditSize, IFill, IStroke, IStrokeAlign, IStrokeWidthString, IStrokeCap, IStrokeJoin, IDashPatternString, IArrowType, ICornerRadiusString, IShadowEffect, IShadowString, IBlurEffect, IGrayscaleEffect, IEditorConfig, IFindUIMethod, IExportOptions, IExportResult, IEditorConfigFunction, IEditToolFunction, 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';
+import { IUI, IUIData, IUIInputData, ILeafer, IGroup, IBlendMode, IFill, IStroke, IStrokeAlign, IStrokeWidthString, IStrokeCap, IStrokeJoin, IDashPatternString, IArrowType, ICornerRadiusString, IShadowEffect, IShadowString, IBlurEffect, IGrayscaleEffect, IEditorConfig, IFindUIMethod, IExportOptions, IExportResult, IEditorConfigFunction, IEditToolFunction, 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, 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;
@@ -22,9 +22,9 @@ declare class UI extends Leaf implements IUI {
     disabled: IBoolean;
     locked: IBoolean;
     zIndex: INumber;
-    mask: IBoolean;
+    mask: IMaskType;
     maskType: IMaskType;
-    eraser: IBoolean;
+    eraser: IEraserType;
     x: INumber;
     y: INumber;
     width: INumber;
@@ -34,11 +34,32 @@ declare class UI extends Leaf implements IUI {
     rotation: INumber;
     skewX: INumber;
     skewY: INumber;
-    around: IAround;
-    draggable: IBoolean | 'x' | 'y';
+    offsetX: INumber;
+    offsetY: INumber;
+    scrollX: INumber;
+    scrollY: INumber;
+    origin: IAlign | IUnitPointData;
+    around: IAlign | IUnitPointData;
+    lazy: IBoolean;
+    pixelRatio: INumber;
+    path: IPathCommandData | IPathString;
+    windingRule: IWindingRule;
+    closed: boolean;
+    flow: IFlowType;
+    padding: IFourNumber;
+    gap: IGap | IPointGap;
+    align: IFlowAlign | IFlowAxisAlign;
+    wrap: IWrap;
+    itemBox: IFlowBoxType;
+    inFlow: IBoolean;
+    autoWidth: IAutoSize;
+    autoHeight: IAutoSize;
+    autoBox: IAutoBoxData | IConstraint;
+    widthRange: IRangeSize;
+    heightRange: IRangeSize;
+    draggable: IBoolean | IAxis;
     dragBounds?: IBoundsData | 'parent';
     editable: IBoolean;
-    editSize?: IEditSize;
     hittable: IBoolean;
     hitFill: IHitType;
     hitStroke: IHitType;
@@ -57,11 +78,6 @@ declare class UI extends Leaf implements IUI {
     dashPattern: INumber[] | IDashPatternString;
     dashOffset: INumber;
     miterLimit: INumber;
-    lazy: IBoolean;
-    pixelRatio: INumber;
-    path: IPathCommandData | IPathString;
-    windingRule: IWindingRule;
-    closed: boolean;
     startArrow: IArrowType;
     endArrow: IArrowType;
     cornerRadius: IFourNumber | ICornerRadiusString;
@@ -88,8 +104,10 @@ declare class UI extends Leaf implements IUI {
     set(data: IUIInputData): void;
     get(name?: string | string[] | IUIInputData): IUIInputData | IValue;
     createProxyData(): IUIInputData;
-    find(_condition: number | string | IFindUIMethod, _options?: any): IUI[];
-    findOne(_condition: number | string | IFindUIMethod, _options?: any): IUI;
+    find(_condition: number | string | IFindCondition | IFindUIMethod, _options?: any): IUI[];
+    findTag(tag: string | string[]): IUI[];
+    findOne(_condition: number | string | IFindCondition | IFindUIMethod, _options?: any): IUI;
+    findId(id: number | string): IUI;
     getPath(curve?: boolean, pathForRender?: boolean): IPathCommandData;
     getPathString(curve?: boolean, pathForRender?: boolean): IPathString;
     __onUpdateSize(): void;
@@ -182,7 +200,6 @@ declare class Leafer extends Group implements ILeafer {
     unlockLayout(): void;
     lockLayout(): void;
     resize(size: IScreenSizeData): void;
-    forceFullRender(): void;
     forceRender(bounds?: IBoundsData): void;
     updateCursor(cursor?: ICursorType): void;
     updateLazyBounds(): void;
@@ -335,7 +352,6 @@ declare class Text extends UI implements IText {
     __: ITextData;
     width: INumber;
     height: INumber;
-    padding: IFourNumber;
     fill: IFill;
     strokeAlign: IStrokeAlign;
     hitFill: IHitType$1;