@visactor/vstory 0.0.8-alpha.9 → 0.0.8

package/es/edit/edit-component/edit-control/richtext-transform-control.d.ts

@@ -1,11 +0,0 @@
-import type { ITransformControl } from './transform-control';
-import { TransformControl } from './transform-control';
-export declare class RichTextTransformControl extends TransformControl implements ITransformControl {
-    initEvent(): void;
-    releaseEvent(): void;
-    handlerDblClick: (e: any) => void;
-    startEditText(): void;
-    endEditText(): void;
-    protected render(): void;
-    release(): void;
-}

package/es/edit/edit-component/edit-control/richtext-transform-control.js

@@ -1,50 +0,0 @@
-import { TransformControl } from "./transform-control";
-
-export class RichTextTransformControl extends TransformControl {
-    constructor() {
-        super(...arguments), this.handlerDblClick = e => {
-            this.startEditText();
-        };
-    }
-    initEvent() {
-        super.initEvent(), this.rect.addEventListener("dblclick", this.handlerDblClick);
-    }
-    releaseEvent() {
-        super.releaseEvent(), this.rect.removeEventListener("dblclick", this.handlerDblClick);
-    }
-    startEditText() {
-        this.rect.setAttributes({
-            pickable: !1
-        }), this.editBorder.setAttributes({
-            pickable: !1
-        }), this.setAttributes({
-            pickable: !1
-        });
-        const character = this.editComponent.getActiveCharacter();
-        if (!character) return;
-        const text = character._text && character._text._graphic;
-        text && text.setAttributes({
-            editable: !0
-        });
-    }
-    endEditText() {
-        this.rect.setAttributes({
-            pickable: !0
-        }), this.editBorder.setAttributes({
-            pickable: !0
-        }), this.setAttributes({
-            pickable: !0
-        });
-        const character = this.editComponent.getActiveCharacter(), text = character._text && character._text._graphic;
-        text && text.setAttributes({
-            editable: !1
-        });
-    }
-    render() {
-        super.render();
-    }
-    release() {
-        this.endEditText(), super.release();
-    }
-}
-//# sourceMappingURL=richtext-transform-control.js.map

package/es/edit/edit-component/edit-control/richtext-transform-control.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/edit/edit-component/edit-control/richtext-transform-control.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,MAAM,OAAO,wBAAyB,SAAQ,gBAAgB;IAA9D;;QAaE,oBAAe,GAAG,CAAC,CAAM,EAAE,EAAE;YAE3B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC,CAAC;IAwGJ,CAAC;IAvHC,SAAS;QACP,KAAK,CAAC,SAAS,EAAE,CAAC;QAClB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC/D,CAAC;IAED,YAAY;QACV,KAAK,CAAC,YAAY,EAAE,CAAC;QACrB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAClE,CAAC;IASD,aAAa;QAEX,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;QAC7C,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;QACxC,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,kBAAkB,EAAE,CAAC;QAC1D,IAAI,CAAC,SAAS,EAAE;YACd,OAAO;SACR;QACD,MAAM,IAAI,GAAI,SAAiB,CAAC,KAAK,IAAK,SAAiB,CAAC,KAAK,CAAC,QAAQ,CAAC;QAC3E,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IACjD,CAAC;IAED,WAAW;QACT,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QAC5C,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QAClD,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QACvC,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,kBAAkB,EAAE,CAAC;QAC1D,MAAM,IAAI,GAAI,SAAiB,CAAC,KAAK,IAAK,SAAiB,CAAC,KAAK,CAAC,QAAQ,CAAC;QAC3E,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;IAClD,CAAC;IA2DS,MAAM;QACd,KAAK,CAAC,MAAM,EAAE,CAAC;IASjB,CAAC;IAQD,OAAO;QAEL,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,KAAK,CAAC,OAAO,EAAE,CAAC;IAClB,CAAC;CACF","file":"richtext-transform-control.js","sourcesContent":["/**\n * @description PopTip组件\n */\nimport type {\n  ICircleGraphicAttribute,\n  IPathGraphicAttribute,\n  IGraphic,\n  IGroupGraphicAttribute,\n  IRect,\n  IRectGraphicAttribute,\n  ILineGraphicAttribute,\n  IGroup\n} from '@visactor/vrender';\nimport { createRect, getTheme } from '@visactor/vrender';\nimport type { IAABBBounds, IAABBBoundsLike, IPointLike } from '@visactor/vutils';\nimport { AABBBounds, merge, normalizePadding, pi } from '@visactor/vutils';\nimport { AbstractComponent } from '@visactor/vrender-components';\nimport { transformPointWithMatrix } from '../../../util/space';\nimport { MinSize } from '../../../constants/attribute';\nimport { normalizeAngle } from '../../../util/math';\nimport { BOUNDS_SELECT_COLOR, DRAG_ANCHOR_COLOR, SHAPE_SELECT_COLOR } from './constants';\nimport type { VRenderPointerEvent } from '../../../interface/type';\nimport type { IEditComponent } from '../../interface';\nimport type { ITransformControl } from './transform-control';\nimport { TransformControl } from './transform-control';\n\nexport class RichTextTransformControl extends TransformControl implements ITransformControl {\n  initEvent(): void {\n    super.initEvent();\n    this.rect.addEventListener('dblclick', this.handlerDblClick);\n  }\n\n  releaseEvent(): void {\n    super.releaseEvent();\n    this.rect.removeEventListener('dblclick', this.handlerDblClick);\n  }\n\n  // domTextEditor?: HTMLElement;\n\n  handlerDblClick = (e: any) => {\n    // this.attachDomTextEditor();\n    this.startEditText();\n  };\n\n  startEditText() {\n    // 关掉上层的pick，开启richtext的editable\n    this.rect.setAttributes({ pickable: false });\n    this.editBorder.setAttributes({ pickable: false });\n    this.setAttributes({ pickable: false });\n    const character = this.editComponent.getActiveCharacter();\n    if (!character) {\n      return;\n    }\n    const text = (character as any)._text && (character as any)._text._graphic;\n    text && text.setAttributes({ editable: true });\n  }\n\n  endEditText() {\n    this.rect.setAttributes({ pickable: true });\n    this.editBorder.setAttributes({ pickable: true });\n    this.setAttributes({ pickable: true });\n    const character = this.editComponent.getActiveCharacter();\n    const text = (character as any)._text && (character as any)._text._graphic;\n    text && text.setAttributes({ editable: false });\n  }\n\n  // protected attachDomTextEditor() {\n  //   const stage = this.stage;\n  //   if (!stage) {\n  //     return;\n  //   }\n  //   const { x, y, width, height } = this.rect.attribute;\n  //   const container = document.createElement('div');\n  //   container.style.position = 'relative';\n  //   container.style.display = 'flex';\n  //   container.style.justifyContent = 'center';\n  //   container.style.left = x + 'px';\n  //   container.style.top = y + 'px';\n  //   container.style.width = width + 'px';\n  //   container.style.height = height + 'px';\n  //   container.style.pointerEvents = 'none';\n  //   const bg = document.createElement('div');\n  //   bg.style.position = 'absolute';\n  //   bg.style.zIndex = '-1';\n  //   bg.style.width = '100%';\n  //   bg.style.height = '100%';\n  //   bg.style.opacity = '0.2';\n  //   bg.style.background = BOUNDS_SELECT_COLOR;\n  //   bg.style.cursor = 'text';\n  //   container.appendChild(bg);\n  //   stage.window.getContainer().appendChild(container);\n  //   this.domTextEditor = container;\n\n  //   // 添加textArea\n  //   const character = this.editComponent.getActiveCharacter();\n  //   const text = (character as any)._text && (character as any)._text._graphic;\n  //   if (text) {\n  //     const textArea = document.createElement('textArea') as HTMLTextAreaElement;\n  //     const bounds = text.AABBBounds;\n  //     const theme = getTheme(text).text;\n  //     const {\n  //       fontFamily = theme.fontFamily,\n  //       fontSize = theme.fontSize,\n  //       fontWeight = theme.fontWeight\n  //     } = text.attribute;\n  //     textArea.style.alignSelf = `center`;\n  //     textArea.style.width = `${bounds.width()}px`;\n  //     textArea.style.height = `${bounds.height()}px`;\n  //     textArea.innerText = text.attribute.text;\n  //     textArea.style.border = 'none';\n  //     textArea.style.fontFamily = fontFamily;\n  //     textArea.style.fontSize = fontSize;\n  //     textArea.style.fontWeight = fontWeight;\n  //     textArea.style.overflow = 'hidden';\n  //     textArea.style.outline = 'none';\n  //     textArea.style.resize = 'none';\n  //     textArea.style.pointerEvents = 'all';\n  //     container.appendChild(textArea);\n  //   }\n\n  //   // textArea.value = this.activeGraphic;\n  // }\n\n  protected render() {\n    super.render();\n    // if (this.domTextEditor) {\n    //   const container = this.domTextEditor;\n    //   const { x, y, width, height } = this.rect.attribute;\n    //   container.style.left = x + 'px';\n    //   container.style.top = y + 'px';\n    //   container.style.width = width + 'px';\n    //   container.style.height = height + 'px';\n    // }\n  }\n\n  // detachDomTextEditor() {\n  //   // if (this.domTextEditor && this.stage) {\n  //   //   this.stage.window.getContainer().removeChild(this.domTextEditor);\n  //   // }\n  // }\n\n  release(): void {\n    // this.detachDomTextEditor();\n    this.endEditText();\n    super.release();\n  }\n}\n"]}

package/es/edit/edit-component/edit-control/transform-control.d.ts

@@ -1,138 +0,0 @@
-import type { ICircleGraphicAttribute, IPathGraphicAttribute, IGraphic, IGroupGraphicAttribute, IRect, IRectGraphicAttribute, ILineGraphicAttribute, IGroup } from '@visactor/vrender';
-import type { IAABBBounds, IAABBBoundsLike, IPointLike } from '@visactor/vutils';
-import { AbstractComponent } from '@visactor/vrender-components';
-import type { VRenderPointerEvent } from '../../../interface/type';
-import type { IEditComponent } from '../../interface';
-import { DragComponent } from './transform-drag';
-type AnchorDirection = 'top' | 'bottom' | 'left-top' | 'left-bottom' | 'right' | 'left' | 'right-top' | 'right-bottom';
-export type TransformAttributes = {
-    padding?: number | [number, number, number, number];
-    resizeBorder?: Partial<ILineGraphicAttribute>;
-    cornerRect?: Partial<IRectGraphicAttribute>;
-    rotateCircle?: Partial<ICircleGraphicAttribute>;
-    rotatePath?: Partial<IPathGraphicAttribute> & {
-        size: number;
-    };
-    handlerLine?: Partial<ILineGraphicAttribute> & {
-        size: number;
-    };
-    shapeCircle?: Partial<ICircleGraphicAttribute>;
-    move?: boolean;
-    rotate?: boolean;
-    resize?: boolean;
-    reshape?: boolean;
-    setCursor?: (c: string) => void;
-    shapePoints?: IPointLike[];
-    isShapePointAbsolute?: boolean;
-    enabledAnchors?: AnchorDirection[];
-    minWidth?: number;
-    minHeight?: number;
-    proportionalScaling?: boolean;
-} & IGroupGraphicAttribute;
-export type IUpdateParams = {
-    x: number;
-    y: number;
-    width: number;
-    height: number;
-    angle: number;
-    anchor: [number | string, number | string];
-    shapePoints: IPointLike[];
-    text?: string | string[];
-};
-export interface ITransformControl extends IGroup {
-    updateBoundsAndAngle: (b: IAABBBoundsLike, angle: number) => void;
-    onActive: () => void;
-    onUpdate: (cb: (data: IUpdateParams, event?: VRenderPointerEvent) => Partial<IUpdateParams> | false) => void;
-    onEditorEnd: (cb: (event?: VRenderPointerEvent) => void) => void;
-    onEditorStart: (cb: (event?: VRenderPointerEvent) => void) => void;
-    onUnTransStart: (cb: (event: PointerEvent) => void) => void;
-}
-export declare class TransformControl extends AbstractComponent<Required<TransformAttributes>> implements ITransformControl {
-    name: string;
-    rectB: IAABBBounds;
-    isDragging: boolean;
-    dragOffsetX: number;
-    dragOffsetY: number;
-    dragStartAngle: number;
-    activeGraphic: IGraphic | null;
-    horizontalResizble: number;
-    verticalResizble: number;
-    rotatable: number;
-    reshapeState: number;
-    rect: IRect;
-    editBorder: IRect;
-    runningAddChildUpdateBoundTag: boolean;
-    updateCbs: Array<(data: IUpdateParams, event?: VRenderPointerEvent) => Partial<IUpdateParams> | false>;
-    editEndCbs: Array<(event?: VRenderPointerEvent) => void>;
-    editStartCbs: Array<(event?: VRenderPointerEvent) => void>;
-    unTransStartCbs: Array<(event: PointerEvent) => void>;
-    isEditor: boolean;
-    _editorConfig: {
-        move: boolean;
-        rotate: boolean;
-        resize: boolean;
-        reshape: boolean;
-    };
-    minSize: {
-        width: number;
-        height: number;
-    };
-    proportionalScaling: boolean;
-    _rectBeforeScale: IRectGraphicAttribute;
-    _eventPosBeforeScale: any;
-    _setCursor: (c: string) => void;
-    editComponent: IEditComponent;
-    _dragger: DragComponent;
-    private _lastBoxInDrag;
-    static defaultAttributes: Partial<TransformAttributes>;
-    constructor(editComponent: IEditComponent, attributes: Partial<TransformAttributes>);
-    addDrag(): void;
-    protected _dragElement: (moveX: number, moveY: number) => void;
-    private _dragEnd;
-    private _unDragEnd;
-    protected _editorEnd: () => void;
-    updateBoundsAndAngle(bounds: IAABBBoundsLike, angle: number): void;
-    onActive(): void;
-    initEvent(): void;
-    protected handleMouseMove: (e: any) => void;
-    protected handleMouseOut: (e: any) => void;
-    protected handleDragMouseDown: (e: any) => void;
-    protected handleDragMouseMove: (e: any) => void;
-    protected handleDragMouseUp: (e: any) => void;
-    protected setCursor(c?: string): void;
-    protected setActiveGraphic(g: IGraphic | null): void;
-    protected handleScale(dx: number, dy: number): void;
-    private _handleScale;
-    private _handleScaleProportional;
-    private _handleReshape;
-    private _getRectWithOffset;
-    private _getRectP2;
-    protected handleRotate(currentPoint: {
-        x: number;
-        y: number;
-    }): void;
-    private fixAngle;
-    getAngle(): number;
-    protected render(): void;
-    moveBy(dx: number, dy: number): this;
-    dispatchUpdate(e?: any): void;
-    onUpdate(cb: (data: IUpdateParams, event?: VRenderPointerEvent) => Partial<IUpdateParams> | false): void;
-    onEditorEnd(cb: (event?: VRenderPointerEvent) => void): void;
-    onEditorStart(cb: (event?: VRenderPointerEvent) => void): void;
-    onUnTransStart(cb: (event: PointerEvent) => void): void;
-    addChildUpdateBoundTag(): void;
-    getTransformAttribute(): {
-        x: number;
-        y: number;
-        width: number;
-        height: number;
-        angle: number;
-        anchor: [string | number, string | number];
-        shapePoints: IPointLike[];
-    };
-    releaseEvent(): void;
-    releaseDragger(): void;
-    private _isRelease;
-    release(): void;
-}
-export {};

package/es/edit/edit-component/edit-control/transform-control.js

@@ -1,457 +0,0 @@
-import { createRect } from "@visactor/vrender";
-
-import { AABBBounds, merge, normalizePadding, pi } from "@visactor/vutils";
-
-import { AbstractComponent } from "@visactor/vrender-components";
-
-import { transformPointWithMatrix } from "../../../util/space";
-
-import { MinSize } from "../../../constants/attribute";
-
-import { normalizeAngle } from "../../../util/math";
-
-import { DRAG_ANCHOR_COLOR, SHAPE_SELECT_COLOR } from "./constants";
-
-import { DragComponent } from "./transform-drag";
-
-const fixedAngles = [ 0, Math.PI / 2, Math.PI, 3 * Math.PI / 2, 2 * Math.PI ], maxAngleDifference = 3 / 180 * Math.PI, borderAnchors = [ "top", "bottom", "left", "right" ], cornerAnchors = [ "left-top", "right-top", "left-bottom", "right-bottom" ], anchorPositionMap = {
-    top: [ 0, 0, 1, 0 ],
-    bottom: [ 0, 1, 1, 1 ],
-    left: [ 0, 0, 0, 1 ],
-    right: [ 1, 0, 1, 1 ],
-    "left-top": [ 0, 0 ],
-    "right-top": [ 1, 0 ],
-    "left-bottom": [ 0, 1 ],
-    "right-bottom": [ 1, 1 ]
-}, anchorCursorMap = {
-    "left-top": "nwse-resize",
-    top: "ns-resize",
-    "right-top": "nesw-resize",
-    left: "ew-resize",
-    right: "ew-resize",
-    "left-bottom": "nesw-resize",
-    bottom: "ns-resize",
-    "right-bottom": "nwse-resize"
-};
-
-export class TransformControl extends AbstractComponent {
-    constructor(editComponent, attributes) {
-        var _a, _b;
-        super(merge({
-            shadowRootIdx: 1
-        }, TransformControl.defaultAttributes, attributes)), this.name = "TransformControl", 
-        this.isDragging = !1, this.dragStartAngle = 0, this.isEditor = !1, this.minSize = {
-            width: MinSize,
-            height: MinSize
-        }, this.proportionalScaling = !1, this._setCursor = null, this._dragElement = (moveX, moveY) => {
-            var _a, _b;
-            this._lastBoxInDrag.setAttribute("visible", !0);
-            const scale = null !== (_b = null === (_a = this.stage.defaultLayer) || void 0 === _a ? void 0 : _a.globalTransMatrix.a) && void 0 !== _b ? _b : 1;
-            this.moveBy(moveX / scale, moveY / scale);
-        }, this._dragEnd = () => {
-            this._editorEnd();
-        }, this._unDragEnd = () => {
-            this._editorEnd();
-        }, this._editorEnd = () => {
-            this._lastBoxInDrag.setAttribute("visible", !1);
-        }, this.handleMouseMove = e => {
-            if (e.pickParams) {
-                const {shadowTarget: shadowTarget} = e.pickParams;
-                this.setCursor(shadowTarget.attribute.cursor);
-            } else this.setCursor();
-        }, this.handleMouseOut = e => {
-            this.setCursor();
-        }, this.handleDragMouseDown = e => {
-            var _a;
-            this.isEditor = !0, this.editStartCbs.forEach((cb => cb(e)));
-            const layerPos = transformPointWithMatrix(this.layer.globalTransMatrix.getInverse(), e.offset);
-            this.dragOffsetX = layerPos.x, this.dragOffsetY = layerPos.y;
-            const {shadowTarget: shadowTarget} = e.pickParams || {};
-            shadowTarget && this.stage ? (this.setActiveGraphic(shadowTarget), this._rectBeforeScale = Object.assign({}, this.rect.attribute), 
-            this._eventPosBeforeScale = layerPos, this.isDragging = !0, this.dragStartAngle = null !== (_a = this.attribute.angle) && void 0 !== _a ? _a : 0) : (this.unTransStartCbs.forEach((cb => cb(e))), 
-            this._dragger.startDrag(e));
-        }, this.handleDragMouseMove = e => {
-            if (!this.isDragging) return;
-            const layerPos = transformPointWithMatrix(this.layer.globalTransMatrix.getInverse(), e.offset), dx = layerPos.x - this.dragOffsetX, dy = layerPos.y - this.dragOffsetY;
-            0 === dx && 0 === dy || (this.rotatable ? (this.handleRotate(layerPos), this.dispatchUpdate(e)) : this.reshapeState ? (this._handleReshape(dx, dy), 
-            this.dispatchUpdate(e)) : (this._handleScale(dx, dy, e), this.dispatchUpdate(e)), 
-            this.dragOffsetX = layerPos.x, this.dragOffsetY = layerPos.y);
-        }, this.handleDragMouseUp = e => {
-            var _a;
-            this.isDragging && (this.dragOffsetX = 0, this.dragOffsetY = 0, this.setActiveGraphic(null), 
-            null === (_a = this.editEndCbs) || void 0 === _a || _a.forEach((cb => cb(e))), this.isEditor = !1, 
-            this.isDragging = !1);
-        }, this._isRelease = !1, this.editComponent = editComponent, this._editorConfig = {
-            move: !1 !== attributes.move,
-            rotate: !1 !== attributes.rotate,
-            resize: !1 !== attributes.resize,
-            reshape: !1 !== attributes.reshape
-        }, this.rectB = new AABBBounds, this.dragOffsetX = 0, this.dragOffsetY = 0, this.activeGraphic = null, 
-        this.horizontalResizble = 0, this.verticalResizble = 0, this.rotatable = 0, this.runningAddChildUpdateBoundTag = !1, 
-        this.minSize.width = null !== (_a = attributes.minWidth) && void 0 !== _a ? _a : MinSize, 
-        this.minSize.height = null !== (_b = attributes.minHeight) && void 0 !== _b ? _b : MinSize, 
-        this.proportionalScaling = !0 === attributes.proportionalScaling, this._setCursor = attributes.setCursor, 
-        this.rect = createRect({
-            fill: "transparent",
-            stroke: !1,
-            pickable: !1
-        }), this.editBorder = createRect({
-            fill: !1,
-            stroke: !1
-        }), this.editBorder.attachShadow(), this.add(this.rect), this.add(this.editBorder), 
-        this.editStartCbs = [], this.unTransStartCbs = [], this.updateCbs = [], this.editEndCbs = [];
-    }
-    addDrag() {
-        this.stage && (this._dragger = new DragComponent(this.stage), this._dragger.dragHandler(this._dragElement), 
-        this._dragger.dragEndHandler(this._dragEnd), this._dragger.unDragEndHandler(this._unDragEnd), 
-        this._lastBoxInDrag = createRect({
-            pickable: !1,
-            stroke: SHAPE_SELECT_COLOR,
-            strokeOpacity: .4,
-            visible: !1
-        }));
-    }
-    updateBoundsAndAngle(bounds, angle) {
-        var _a, _b;
-        this.rect.setAttributes({
-            x: bounds.x1,
-            y: bounds.y1,
-            width: bounds.x2 - bounds.x1,
-            height: bounds.y2 - bounds.y1
-        });
-        const x = (null !== (_a = this.attribute.x) && void 0 !== _a ? _a : 0) + (bounds.x1 + bounds.x2) / 2, y = (null !== (_b = this.attribute.y) && void 0 !== _b ? _b : 0) + (bounds.y1 + bounds.y2) / 2;
-        this.setAttributes({
-            anchor: [ x, y ],
-            angle: angle
-        });
-    }
-    onActive() {
-        this.initEvent();
-    }
-    initEvent() {
-        this.editBorder.addEventListener("mousemove", this.handleMouseMove), this.addEventListener("pointerout", this.handleMouseOut), 
-        this.addEventListener("pointerdown", this.handleDragMouseDown), this.addDrag(), 
-        this.stage.addEventListener("pointermove", this.handleDragMouseMove), this.stage.addEventListener("pointerup", this.handleDragMouseUp);
-    }
-    setCursor(c) {
-        var _a;
-        this.stage && (this.stage.setCursor(c), null === (_a = this._setCursor) || void 0 === _a || _a.call(this, c));
-    }
-    setActiveGraphic(g) {
-        this.activeGraphic = g;
-        let reset = !0;
-        if (g && g.name) {
-            reset = !1;
-            const dirList = g.name.split("-"), type = dirList.shift();
-            if ("scale" === type) {
-                if (2 === dirList.length) this.horizontalResizble = "left" === dirList[0] ? -1 : 1, 
-                this.verticalResizble = "top" === dirList[1] ? -1 : 1; else {
-                    const dir = dirList[0], h = "left" === dir || "right" === dir;
-                    this.horizontalResizble = h ? "left" === dirList[0] ? -1 : 1 : 0, this.verticalResizble = h ? 0 : "top" === dirList[0] ? -1 : 1;
-                }
-                this.rotatable = 0;
-            } else "rotate" === type ? (this.rotatable = 1, this.horizontalResizble = 0, this.verticalResizble = 0) : "reshape" === type ? (this.reshapeState = Number.parseInt(dirList[0], 10) + 1, 
-            this.rotatable = 0, this.horizontalResizble = 0, this.verticalResizble = 0) : reset = !0;
-        }
-        reset && (this.horizontalResizble = 0, this.verticalResizble = 0, this.rotatable = 0, 
-        this.reshapeState = 0);
-    }
-    handleScale(dx, dy) {
-        const {anchor: anchor, x: x, y: y, width: width, height: height} = this._getRectWithOffset(dx, dy, this.rect.attribute).attribute;
-        width < this.minSize.width || height < this.minSize.height || (this.rect.setAttributes({
-            width: width,
-            height: height,
-            x: x,
-            y: y
-        }), this.setAttributes({
-            anchor: anchor
-        }));
-    }
-    _handleScale(dx, dy, e) {
-        this.proportionalScaling ? this._handleScaleProportional(dx, dy, e) : this.handleScale(dx, dy);
-    }
-    _handleScaleProportional(dx, dy, e) {
-        const layerPos = transformPointWithMatrix(this.layer.globalTransMatrix.getInverse(), e.offset), {attribute: attribute, temp: temp} = this._getRectWithOffset(layerPos.x - this._eventPosBeforeScale.x, layerPos.y - this._eventPosBeforeScale.y, this._rectBeforeScale), maxScale = Math.max(attribute.width / this._rectBeforeScale.width, attribute.height / this._rectBeforeScale.height), finalWidth = this._rectBeforeScale.width * maxScale, finalHeight = this._rectBeforeScale.height * maxScale;
-        if (finalWidth < this.minSize.width) return;
-        if (finalHeight < this.minSize.height) return;
-        let nextP2 = temp.nextP2;
-        const nextP1 = temp.nextP1, angle = this.getAngle();
-        if (this.verticalResizble > 0 && this.horizontalResizble > 0) nextP2 = this._getRectP2(nextP1, {
-            width: finalWidth,
-            height: finalHeight
-        }, angle); else if (this.verticalResizble > 0 && this.horizontalResizble < 0) {
-            const lockPos = {
-                x: nextP1.x + attribute.width * Math.cos(angle),
-                y: nextP1.y + attribute.width * Math.sin(angle)
-            };
-            nextP1.x = lockPos.x - finalWidth * Math.cos(angle), nextP1.y = lockPos.y - finalWidth * Math.sin(angle), 
-            nextP2 = this._getRectP2(nextP1, {
-                width: finalWidth,
-                height: finalHeight
-            }, angle);
-        }
-        if (this.verticalResizble < 0 && this.horizontalResizble > 0) {
-            const lockPos = {
-                x: nextP1.x - attribute.height * Math.sin(angle),
-                y: nextP1.y + attribute.height * Math.cos(angle)
-            };
-            nextP1.x = lockPos.x + finalHeight * Math.sin(angle), nextP1.y = lockPos.y - finalHeight * Math.cos(angle), 
-            nextP2 = this._getRectP2(nextP1, {
-                width: finalWidth,
-                height: finalHeight
-            }, angle);
-        }
-        this.verticalResizble < 0 && this.horizontalResizble < 0 && (nextP1.x = nextP2.x - Math.cos(angle) * finalWidth + Math.sin(angle) * finalHeight, 
-        nextP1.y = nextP2.y - Math.sin(angle) * finalWidth - Math.cos(angle) * finalHeight);
-        const center = {
-            x: (nextP1.x + nextP2.x) / 2,
-            y: (nextP1.y + nextP2.y) / 2
-        };
-        this.rect.setAttributes({
-            width: finalWidth,
-            height: finalHeight,
-            x: center.x - finalWidth / 2,
-            y: center.y - finalHeight / 2
-        }), this.setAttributes({
-            anchor: [ center.x, center.y ]
-        });
-    }
-    _handleReshape(dx, dy) {
-        const {width: width, height: height} = this.rect.attribute, {shapePoints: shapePoints} = this.attribute, angle = this.getAngle(), _dx = dx, _dy = dy;
-        dx = Math.cos(angle) * _dx + Math.sin(angle) * _dy, dy = Math.cos(angle + pi / 2) * _dx + Math.sin(angle + pi / 2) * _dy, 
-        this.attribute.isShapePointAbsolute || (dx /= width, dy /= height);
-        const nextShapePoints = shapePoints.map(((shapePoint, i) => i + 1 === this.reshapeState ? {
-            x: shapePoint.x + dx,
-            y: shapePoint.y + dy
-        } : shapePoint));
-        this.setAttributes({
-            shapePoints: nextShapePoints
-        });
-    }
-    _getRectWithOffset(dx, dy, lastAttribute) {
-        const angle = this.getAngle(), _dx = dx, _dy = dy;
-        dx = Math.cos(angle) * _dx + Math.sin(angle) * _dy, dy = Math.cos(angle + pi / 2) * _dx + Math.sin(angle + pi / 2) * _dy, 
-        dx *= this.horizontalResizble, dy *= this.verticalResizble;
-        const {x: x, y: y, width: width, height: height} = lastAttribute, m = this.transMatrix, nextP1 = {
-            x: m.a * x + m.c * y + m.e,
-            y: m.b * x + m.d * y + m.f
-        }, nextP2 = {
-            x: m.a * (x + width) + m.c * (y + height) + m.e,
-            y: m.b * (x + width) + m.d * (y + height) + m.f
-        };
-        this.horizontalResizble < 0 ? (nextP1.x -= Math.cos(angle) * dx, nextP1.y -= Math.sin(angle) * dx) : this.horizontalResizble > 0 && (nextP2.x += Math.cos(angle) * dx, 
-        nextP2.y += Math.sin(angle) * dx), this.verticalResizble < 0 ? (nextP1.x -= Math.cos(angle + pi / 2) * dy, 
-        nextP1.y -= Math.sin(angle + pi / 2) * dy) : this.verticalResizble > 0 && (nextP2.x += Math.cos(angle + pi / 2) * dy, 
-        nextP2.y += Math.sin(angle + pi / 2) * dy);
-        const center = {
-            x: (nextP1.x + nextP2.x) / 2,
-            y: (nextP1.y + nextP2.y) / 2
-        }, tw = width + dx, th = height + dy;
-        return {
-            attribute: {
-                width: tw,
-                height: th,
-                x: center.x - tw / 2,
-                y: center.y - th / 2,
-                anchor: [ center.x, center.y ]
-            },
-            temp: {
-                nextP1: nextP1,
-                nextP2: nextP2,
-                dx: dx,
-                dy: dy
-            }
-        };
-    }
-    _getRectP2(p1, size, angle) {
-        return {
-            x: p1.x + Math.cos(angle) * size.width - Math.sin(angle) * size.height,
-            y: p1.y + Math.sin(angle) * size.width + Math.cos(angle) * size.height
-        };
-    }
-    handleRotate(currentPoint) {
-        const originB = this.rectB, cx = (originB.x1 + originB.x2) / 2, cy = (originB.y1 + originB.y2) / 2, vectorDrag_x = this._eventPosBeforeScale.x - cx, vectorDrag_y = this._eventPosBeforeScale.y - cy, vectorCurrent_x = currentPoint.x - cx, vectorCurrent_y = currentPoint.y - cy, cosAngle = (vectorDrag_x * vectorCurrent_x + vectorDrag_y * vectorCurrent_y) / (Math.sqrt(vectorDrag_x ** 2 + vectorDrag_y ** 2) * Math.sqrt(vectorCurrent_x ** 2 + vectorCurrent_y ** 2)), delta = vectorDrag_x * vectorCurrent_y - vectorDrag_y * vectorCurrent_x < 0 ? 2 * Math.PI - Math.acos(cosAngle) : Math.acos(cosAngle);
-        this.setAttributes({
-            angle: this.fixAngle(this.dragStartAngle + delta),
-            anchor: [ cx, cy ]
-        });
-    }
-    fixAngle(angle) {
-        angle = normalizeAngle(angle);
-        for (const fixedAngle of fixedAngles) if (angle >= fixedAngle - maxAngleDifference && angle <= fixedAngle + maxAngleDifference) return fixedAngle;
-        return angle;
-    }
-    getAngle() {
-        var _a;
-        if (!this.attribute.postMatrix) return null !== (_a = this.attribute.angle) && void 0 !== _a ? _a : 0;
-        const m = this.transMatrix;
-        return Math.atan2(m.b, m.a);
-    }
-    render() {
-        const {resizeBorder: resizeBorder, padding: padding, cornerRect: cornerRect, rotateCircle: rotateCircle, rotatePath: rotatePath, handlerLine: handlerLine, shapeCircle: shapeCircle, enabledAnchors: enabledAnchors = [ "top", "bottom", "left-top", "left-bottom", "right", "left", "right-top", "right-bottom" ], shapePoints: shapePoints = [], isShapePointAbsolute: isShapePointAbsolute} = this.attribute, root = this.editBorder.shadowRoot;
-        if (!root || 1 === this.count) return;
-        const parsedPadding = normalizePadding(padding), {x: x = 0, y: y = 0, width: w = 0, height: h = 0} = this.rect.attribute;
-        this.rectB.setValue(x, y, x + w, y + h);
-        const minX = x - parsedPadding[3], minY = y - parsedPadding[0], width = w + parsedPadding[1] + parsedPadding[3], height = h + parsedPadding[0] + parsedPadding[2];
-        if (borderAnchors.forEach(((anchor, i) => {
-            const enableResize = this._editorConfig.resize && enabledAnchors.includes(anchor), item = anchorPositionMap[anchor], cursor = enableResize ? anchorCursorMap[anchor] : "default";
-            root.createOrUpdateChild(enableResize ? `scale-${anchor}` : `stroke-line-${anchor}`, Object.assign({
-                x: minX,
-                y: minY,
-                points: [ {
-                    x: item[0] * width,
-                    y: item[1] * height
-                }, {
-                    x: item[2] * width,
-                    y: item[3] * height
-                } ],
-                cursor: cursor
-            }, resizeBorder), "line");
-        })), this._editorConfig.rotate && (root.createOrUpdateChild("top-handler-line", Object.assign({
-            x: minX + width / 2,
-            y: minY,
-            points: [ {
-                x: 0,
-                y: 0
-            }, {
-                x: 0,
-                y: -handlerLine.size
-            } ]
-        }, handlerLine), "line"), root.createOrUpdateChild("rotate-all", Object.assign({
-            x: minX + width / 2,
-            y: minY - handlerLine.size - rotateCircle.radius,
-            cursor: "grab"
-        }, rotateCircle), "circle"), root.createOrUpdateChild("path-rotate", Object.assign({
-            pickable: !1,
-            x: minX + width / 2 + rotatePath.size / 2,
-            y: minY - handlerLine.size + rotatePath.size / 2 - rotateCircle.radius,
-            scaleX: rotatePath.size / 200,
-            scaleY: rotatePath.size / 200,
-            cursor: "grab",
-            dx: .5,
-            dy: -.5
-        }, rotatePath), "path")), this._editorConfig.resize && enabledAnchors.forEach((anchor => {
-            if (!cornerAnchors.includes(anchor)) return;
-            const item = anchorPositionMap[anchor], cursor = anchorCursorMap[anchor];
-            root.createOrUpdateChild(`scale-${anchor}`, Object.assign({
-                x: minX + item[0] * width - cornerRect.width / 2,
-                y: minY + item[1] * height - cornerRect.height / 2,
-                cursor: cursor
-            }, cornerRect), "rect");
-        })), this._editorConfig.reshape) {
-            const shapePointsChildren = root.children.filter((child => child.name.startsWith("reshape")));
-            shapePointsChildren.length !== shapePoints.length && shapePointsChildren.forEach((child => root.removeChild(child))), 
-            shapePoints.forEach(((point, i) => {
-                root.createOrUpdateChild(`reshape-${i}`, Object.assign({
-                    x: isShapePointAbsolute ? point.x : point.x * w + x,
-                    y: isShapePointAbsolute ? point.y : point.y * h + y,
-                    cursor: "move"
-                }, shapeCircle), "circle");
-            }));
-        }
-    }
-    moveBy(dx, dy) {
-        const {x: x, y: y, width: width, height: height} = this.rect.attribute;
-        return this.rect.setAttributes({
-            width: width,
-            height: height,
-            x: x + dx,
-            y: y + dy
-        }), this.setAttributes({
-            anchor: [ x + dx + width / 2, y + dy + height / 2 ]
-        }), this.dispatchUpdate(), this;
-    }
-    dispatchUpdate(e) {
-        const out = this.getTransformAttribute();
-        this.updateCbs.forEach((cb => {
-            const data = cb(out, e);
-            if (data) {
-                const {x: x, y: y, width: width, height: height, anchor: anchor, angle: angle, shapePoints: shapePoints} = data;
-                Number.isFinite(x) && this.rect.setAttribute("x", x), Number.isFinite(y) && this.rect.setAttribute("y", y), 
-                Number.isFinite(width) && this.rect.setAttribute("width", width), Number.isFinite(height) && this.rect.setAttribute("height", height), 
-                anchor && this.setAttribute("anchor", anchor), Number.isFinite(angle) && this.setAttribute("angle", angle), 
-                shapePoints && this.setAttribute("shapePoints", shapePoints);
-            }
-        }));
-    }
-    onUpdate(cb) {
-        this.updateCbs.push(cb);
-    }
-    onEditorEnd(cb) {
-        this.editEndCbs.push(cb);
-    }
-    onEditorStart(cb) {
-        this.editStartCbs.push(cb);
-    }
-    onUnTransStart(cb) {
-        this.unTransStartCbs.push(cb);
-    }
-    addChildUpdateBoundTag() {
-        super.addChildUpdateBoundTag(), this.runningAddChildUpdateBoundTag || (this.runningAddChildUpdateBoundTag = !0, 
-        this.render(), this.runningAddChildUpdateBoundTag = !1);
-    }
-    getTransformAttribute() {
-        const {x: x, y: y, width: width, height: height} = this.rect.attribute, {angle: angle, anchor: anchor, shapePoints: shapePoints} = this.attribute;
-        return {
-            x: x,
-            y: y,
-            width: width,
-            height: height,
-            angle: angle,
-            anchor: anchor,
-            shapePoints: shapePoints
-        };
-    }
-    releaseEvent() {
-        this.editBorder.removeEventListener("mousemove", this.handleMouseMove), this.stage && (this.stage.removeEventListener("pointermove", this.handleDragMouseMove), 
-        this.stage.removeEventListener("pointerup", this.handleDragMouseUp)), this.removeEventListener("pointerout", this.handleMouseOut), 
-        this.removeEventListener("pointerdown", this.handleDragMouseDown);
-    }
-    releaseDragger() {
-        this._dragger && this._dragger.release();
-    }
-    release() {
-        this._isRelease = !0, this.releaseEvent(), this.parent.removeChild(this), this.editBorder = null, 
-        this.updateCbs = [], this.editEndCbs = [], this.unTransStartCbs = [], super.release();
-    }
-}
-
-TransformControl.defaultAttributes = {
-    resizeBorder: {
-        stroke: SHAPE_SELECT_COLOR,
-        lineWidth: 1
-    },
-    cornerRect: {
-        fill: "white",
-        stroke: SHAPE_SELECT_COLOR,
-        lineWidth: 1,
-        width: 8,
-        height: 8,
-        cornerRadius: 2
-    },
-    rotateCircle: {
-        fill: "white",
-        stroke: SHAPE_SELECT_COLOR,
-        radius: 10
-    },
-    rotatePath: {
-        fill: "#000000",
-        size: 12,
-        angle: Math.PI,
-        path: "M202.403,95.22c0,46.312-33.237,85.002-77.109,93.484v25.663l-69.76-40l69.76-40v23.494 c27.176-7.87,47.109-32.964,47.109-62.642c0-35.962-29.258-65.22-65.22-65.22s-65.22,29.258-65.22,65.22 c0,9.686,2.068,19.001,6.148,27.688l-27.154,12.754c-5.968-12.707-8.994-26.313-8.994-40.441C11.964,42.716,54.68,0,107.184,0 S202.403,42.716,202.403,95.22z"
-    },
-    handlerLine: {
-        stroke: SHAPE_SELECT_COLOR,
-        lineWidth: 1,
-        size: 24
-    },
-    shapeCircle: {
-        fill: "white",
-        lineWidth: 1,
-        radius: 4,
-        stroke: DRAG_ANCHOR_COLOR,
-        startAngle: 0,
-        endAngle: 2 * Math.PI
-    }
-};
-//# sourceMappingURL=transform-control.js.map