@plait/draw 0.53.0 → 0.55.0

package/generators/line-auto-complete.generator.d.ts

@@ -1,12 +1,12 @@
 import { PlaitBoard } from '@plait/core';
-import { PlaitGeometry, PlaitShape } from '../interfaces';
+import { PlaitGeometry, PlaitShapeElement } from '../interfaces';
 import { ActiveGeneratorExtraData, Generator } from '@plait/common';
-export declare class LineAutoCompleteGenerator extends Generator<PlaitShape, ActiveGeneratorExtraData> {
+export declare class LineAutoCompleteGenerator extends Generator<PlaitShapeElement, ActiveGeneratorExtraData> {
     board: PlaitBoard;
     autoCompleteG: SVGGElement;
     hoverElement: SVGGElement | null;
     constructor(board: PlaitBoard);
-    canDraw(element: PlaitShape, data: ActiveGeneratorExtraData): boolean;
+    canDraw(element: PlaitShapeElement, data: ActiveGeneratorExtraData): boolean;
     draw(element: PlaitGeometry, data: ActiveGeneratorExtraData): SVGGElement;
     removeAutoCompleteG(index: number): void;
     recoverAutoCompleteG(): void;

package/geometry.component.d.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, OnDestroy, OnInit, ViewContainerRef } from '@angular/core';
+import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
 import { PlaitBoard, PlaitPluginElementContext, OnContextChanged } from '@plait/core';
 import { Subject } from 'rxjs';
 import { PlaitGeometry } from './interfaces/geometry';
@@ -8,14 +8,13 @@ import { ActiveGenerator, CommonPluginElement } from '@plait/common';
 import { LineAutoCompleteGenerator } from './generators/line-auto-complete.generator';
 import * as i0 from "@angular/core";
 export declare class GeometryComponent extends CommonPluginElement<PlaitGeometry, PlaitBoard> implements OnInit, OnDestroy, OnContextChanged<PlaitGeometry, PlaitBoard> {
-    private viewContainerRef;
     protected cdr: ChangeDetectorRef;
     destroy$: Subject<void>;
     activeGenerator: ActiveGenerator<PlaitGeometry>;
     lineAutoCompleteGenerator: LineAutoCompleteGenerator;
     shapeGenerator: GeometryShapeGenerator;
     get textManage(): TextManage;
-    constructor(viewContainerRef: ViewContainerRef, cdr: ChangeDetectorRef);
+    constructor(cdr: ChangeDetectorRef);
     initializeGenerator(): void;
     ngOnInit(): void;
     onContextChanged(value: PlaitPluginElementContext<PlaitGeometry, PlaitBoard>, previous: PlaitPluginElementContext<PlaitGeometry, PlaitBoard>): void;

package/image.component.d.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, OnDestroy, OnInit, ViewContainerRef } from '@angular/core';
+import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
 import { PlaitBoard, PlaitPluginElementContext, OnContextChanged } from '@plait/core';
 import { Subject } from 'rxjs';
 import { CommonPluginElement, ImageGenerator } from '@plait/common';
@@ -6,13 +6,12 @@ import { PlaitImage } from './interfaces/image';
 import { LineAutoCompleteGenerator } from './generators/line-auto-complete.generator';
 import * as i0 from "@angular/core";
 export declare class ImageComponent extends CommonPluginElement<PlaitImage, PlaitBoard> implements OnInit, OnDestroy, OnContextChanged<PlaitImage, PlaitBoard> {
-    private viewContainerRef;
     protected cdr: ChangeDetectorRef;
     destroy$: Subject<void>;
     get activeGenerator(): import("@plait/common").ActiveGenerator<import("@plait/core").PlaitElement>;
     imageGenerator: ImageGenerator<PlaitImage>;
     lineAutoCompleteGenerator: LineAutoCompleteGenerator;
-    constructor(viewContainerRef: ViewContainerRef, cdr: ChangeDetectorRef);
+    constructor(cdr: ChangeDetectorRef);
     initializeGenerator(): void;
     ngOnInit(): void;
     onContextChanged(value: PlaitPluginElementContext<PlaitImage, PlaitBoard>, previous: PlaitPluginElementContext<PlaitImage, PlaitBoard>): void;

package/interfaces/element.d.ts

@@ -1,6 +1,7 @@
 export declare enum StrokeStyle {
     solid = "solid",
-    dashed = "dashed"
+    dashed = "dashed",
+    dotted = "dotted"
 }
 export declare enum MemorizeKey {
     basicShape = "basicShape",

package/interfaces/geometry.d.ts

@@ -22,7 +22,8 @@ export declare enum BasicShapes {
     processArrow = "processArrow",
     twoWayArrow = "twoWayArrow",
     comment = "comment",
-    roundComment = "roundComment"
+    roundComment = "roundComment",
+    cloud = "cloud"
 }
 export declare enum FlowchartSymbols {
     process = "process",
@@ -35,7 +36,11 @@ export declare enum FlowchartSymbols {
     manualLoop = "manualLoop",
     merge = "merge",
     delay = "delay",
-    storedData = "storedData"
+    storedData = "storedData",
+    or = "or",
+    summingJunction = "summingJunction",
+    predefinedProcess = "predefinedProcess",
+    offPage = "offPage"
 }
 export type GeometryShapes = BasicShapes | FlowchartSymbols;
 export interface PlaitGeometry extends PlaitElement {

package/interfaces/index.d.ts

@@ -7,14 +7,14 @@ export * from './geometry';
 export * from './text';
 export * from './element';
 export type PlaitDrawElement = PlaitGeometry | PlaitLine | PlaitImage;
-export type PlaitShape = PlaitGeometry | PlaitImage;
+export type PlaitShapeElement = PlaitGeometry | PlaitImage;
 export declare const PlaitDrawElement: {
     isGeometry: (value: any) => value is PlaitGeometry;
     isLine: (value: any) => value is PlaitLine;
     isText: (value: any) => value is PlaitText;
     isImage: (value: any) => value is PlaitImage;
     isDrawElement: (value: any) => value is PlaitDrawElement;
-    isShape: (value: any) => value is PlaitShape;
+    isShapeElement: (value: any) => value is PlaitShapeElement;
     isBasicShape: (value: any) => boolean;
     isFlowchart: (value: any) => boolean;
 };

package/line.component.d.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, OnDestroy, OnInit, ViewContainerRef } from '@angular/core';
+import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
 import { PlaitBoard, PlaitPluginElementContext, OnContextChanged } from '@plait/core';
 import { Subject } from 'rxjs';
 import { LineText, PlaitGeometry, PlaitLine } from './interfaces';
@@ -12,13 +12,12 @@ interface BoundedElements {
     target?: PlaitGeometry;
 }
 export declare class LineComponent extends CommonPluginElement<PlaitLine, PlaitBoard> implements OnInit, OnDestroy, OnContextChanged<PlaitLine, PlaitBoard> {
-    private viewContainerRef;
     protected cdr: ChangeDetectorRef;
     destroy$: Subject<void>;
     shapeGenerator: LineShapeGenerator;
     activeGenerator: LineActiveGenerator;
     boundedElements: BoundedElements;
-    constructor(viewContainerRef: ViewContainerRef, cdr: ChangeDetectorRef);
+    constructor(cdr: ChangeDetectorRef);
     initializeGenerator(): void;
     ngOnInit(): void;
     getBoundedElements(): BoundedElements;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plait/draw",
-  "version": "0.53.0",
+  "version": "0.55.0",
   "peerDependencies": {
     "@angular/common": "^17.2.4",
     "@angular/core": "^17.2.4",

package/plugins/with-draw-fragment.d.ts

@@ -1,4 +1,4 @@
 import { PlaitBoard } from '@plait/core';
-import { PlaitLine, PlaitShape } from '../interfaces';
+import { PlaitLine, PlaitShapeElement } from '../interfaces';
 export declare const withDrawFragment: (baseBoard: PlaitBoard) => PlaitBoard;
-export declare const getBoundedLineElements: (board: PlaitBoard, plaitShapes: PlaitShape[]) => PlaitLine[];
+export declare const getBoundedLineElements: (board: PlaitBoard, plaitShapes: PlaitShapeElement[]) => PlaitLine[];

package/plugins/with-draw-resize.d.ts

@@ -1,6 +1,4 @@
-import { ResizeRef, ResizeState } from '@plait/common';
-import { PlaitBoard, Point } from '@plait/core';
-import { PlaitDrawElement } from '../interfaces';
+import { PlaitBoard, Point, RectangleClient } from '@plait/core';
 export interface BulkRotationRef {
     angle: number;
     offsetX: number;
@@ -8,12 +6,18 @@ export interface BulkRotationRef {
     newCenterPoint: Point;
 }
 export declare function withDrawResize(board: PlaitBoard): PlaitBoard;
-export declare const getResizeOriginPointAndHandlePoint: (board: PlaitBoard, resizeRef: ResizeRef<PlaitDrawElement | PlaitDrawElement[]>) => {
+export declare const getResizeOriginPointAndHandlePoint: (board: PlaitBoard, handleIndex: number, rectangle: RectangleClient) => {
     originPoint: Point;
     handlePoint: Point;
 };
-export declare const getResizeZoom: (resizeState: ResizeState, resizeOriginPoint: Point, resizeHandlePoint: Point, isFromCorner: boolean, isAspectRatio: boolean) => {
+export declare const getResizeZoom: (resizeStartAndEnd: [Point, Point], resizeOriginPoint: Point, resizeHandlePoint: Point, isFromCorner: boolean, isAspectRatio: boolean) => {
     xZoom: number;
     yZoom: number;
 };
 export declare const movePointByZoomAndOriginPoint: (p: Point, resizeOriginPoint: Point, xZoom: number, yZoom: number) => Point;
+/**
+ * 1. Rotate 90°
+ * 2. Scale based on the rotated points
+ * 3. Reverse rotate the scaled points by 90°
+ */
+export declare const getResizePointsByOtherwiseAxis: (board: PlaitBoard, points: Point[], resizeOriginPoint: Point, xZoom: number, yZoom: number) => Point[];

package/plugins/with-draw-rotate.d.ts

@@ -0,0 +1,2 @@
+import { PlaitBoard } from '@plait/core';
+export declare const withDrawRotate: (board: PlaitBoard) => PlaitBoard;

package/utils/geometry.d.ts

@@ -4,7 +4,7 @@ import { Alignment, CustomText } from '@plait/text';
 import { Element } from 'slate';
 import { DrawPointerType } from '../constants';
 import { Options } from 'roughjs/bin/core';
-import { PlaitShape } from '../interfaces';
+import { PlaitShapeElement } from '../interfaces';
 export type GeometryStyleOptions = Pick<PlaitGeometry, 'fill' | 'strokeColor' | 'strokeWidth'>;
 export type TextProperties = Partial<CustomText> & {
     align?: Alignment;
@@ -17,9 +17,12 @@ export declare const getTextRectangle: (element: PlaitGeometry) => {
     x: number;
     y: number;
 };
-export declare const drawBoundMask: (board: PlaitBoard, element: PlaitGeometry) => SVGGElement;
+export declare const drawBoundReaction: (board: PlaitBoard, element: PlaitGeometry, options?: {
+    hasMask: boolean;
+    hasConnector: boolean;
+}) => SVGGElement;
 export declare const drawGeometry: (board: PlaitBoard, outerRectangle: RectangleClient, shape: GeometryShapes, options: Options) => SVGGElement;
-export declare const getNearestPoint: (element: PlaitShape, point: Point) => Point;
+export declare const getNearestPoint: (element: PlaitShapeElement, point: Point) => Point;
 export declare const getCenterPointsOnPolygon: (points: Point[]) => Point[];
 export declare const getDefaultFlowchartProperty: (symbol: FlowchartSymbols) => {
     width: number;
@@ -41,7 +44,7 @@ export declare const getDefaultFlowchartProperty: (symbol: FlowchartSymbols) =>
     height: number;
 };
 export declare const createDefaultFlowchart: (point: Point) => (PlaitGeometry | import("../interfaces").PlaitLine)[];
-export declare const getAutoCompletePoints: (element: PlaitShape) => [Point, Point, Point, Point];
+export declare const getAutoCompletePoints: (element: PlaitShapeElement) => [Point, Point, Point, Point];
 export declare const getHitIndexOfAutoCompletePoint: (movingPoint: Point, points: Point[]) => number;
 export declare const getDrawDefaultStrokeColor: (theme: ThemeColorMode) => string;
 export declare const getFlowchartDefaultFill: (theme: ThemeColorMode) => string;

package/utils/hit.d.ts

@@ -1,9 +1,11 @@
 import { PlaitElement, Selection, PlaitBoard, Point } from '@plait/core';
-import { PlaitGeometry, PlaitLine } from '../interfaces';
+import { PlaitGeometry, PlaitLine, PlaitShapeElement } from '../interfaces';
 export declare const isTextExceedingBounds: (geometry: PlaitGeometry) => boolean;
 export declare const isHitLineText: (board: PlaitBoard, element: PlaitLine, point: Point) => boolean;
 export declare const isHitPolyLine: (pathPoints: Point[], point: Point) => boolean;
 export declare const isHitLine: (board: PlaitBoard, element: PlaitLine, point: Point) => boolean;
 export declare const isRectangleHitDrawElement: (board: PlaitBoard, element: PlaitElement, selection: Selection) => boolean | null;
 export declare const isHitDrawElement: (board: PlaitBoard, element: PlaitElement, point: Point) => boolean | null;
+export declare const isHitEdgeOfShape: (board: PlaitBoard, element: PlaitShapeElement, point: Point, hitDistanceBuffer: number) => boolean;
+export declare const isInsideOfShape: (board: PlaitBoard, element: PlaitShapeElement, point: Point, hitDistanceBuffer: number) => boolean;
 export declare const isHitElementInside: (board: PlaitBoard, element: PlaitElement, point: Point) => boolean | null;

package/utils/line/elbow.d.ts

@@ -1,5 +1,8 @@
 import { Point, PlaitBoard, RectangleClient } from '@plait/core';
+import { ElbowLineRouteOptions } from '@plait/common';
 import { LineHandleRefPair, PlaitLine } from '../../interfaces';
+export declare const isSelfLoop: (element: PlaitLine) => boolean | "" | undefined;
+export declare const isUseDefaultOrthogonalRoute: (element: PlaitLine, options: ElbowLineRouteOptions) => boolean;
 export declare const getElbowPoints: (board: PlaitBoard, element: PlaitLine) => Point[];
 export declare const getNextSourceAndTargetPoints: (board: PlaitBoard, element: PlaitLine) => Point[];
 export declare const getSourceAndTargetRectangle: (board: PlaitBoard, element: PlaitLine, handleRefPair: LineHandleRefPair) => {

package/utils/line/line-basic.d.ts

@@ -1,13 +1,13 @@
 import { Point, PlaitBoard, RectangleClient } from '@plait/core';
-import { LineHandle, LineShape, LineText, PlaitLine, PlaitShape } from '../../interfaces';
+import { LineHandle, LineShape, LineText, PlaitLine, PlaitShapeElement } from '../../interfaces';
 export declare const createLineElement: (shape: LineShape, points: [Point, Point], source: LineHandle, target: LineHandle, texts?: LineText[], options?: Pick<PlaitLine, 'strokeColor' | 'strokeWidth'>) => PlaitLine;
 export declare const getLinePoints: (board: PlaitBoard, element: PlaitLine) => Point[];
 export declare const getCurvePoints: (board: PlaitBoard, element: PlaitLine) => Point[];
 export declare function getMiddlePoints(board: PlaitBoard, element: PlaitLine): Point[];
 export declare const drawLine: (board: PlaitBoard, element: PlaitLine) => SVGGElement;
-export declare const getConnectionByNearestPoint: (board: PlaitBoard, point: Point, hitElement: PlaitShape) => Point;
-export declare const getHitConnectorPoint: (point: Point, hitElement: PlaitShape, rectangle: RectangleClient) => Point | undefined;
+export declare const getHitConnection: (board: PlaitBoard, point: Point, hitElement: PlaitShapeElement) => Point;
+export declare const getHitConnectorPoint: (point: Point, hitElement: PlaitShapeElement) => Point | undefined;
 export declare const getLineTextRectangle: (board: PlaitBoard, element: PlaitLine, index: number) => RectangleClient;
 export declare const getLines: (board: PlaitBoard) => PlaitLine[];
 export declare const Q2C: (points: Point[]) => Point[];
-export declare const handleLineCreating: (board: PlaitBoard, lineShape: LineShape, sourcePoint: Point, movingPoint: Point, sourceElement: PlaitShape | null, lineShapeG: SVGGElement) => PlaitLine;
+export declare const handleLineCreating: (board: PlaitBoard, lineShape: LineShape, sourcePoint: Point, movingPoint: Point, sourceElement: PlaitShapeElement | null, lineShapeG: SVGGElement) => PlaitLine;

package/utils/position/geometry.d.ts

@@ -1,5 +1,5 @@
 import { PlaitBoard, Point, RectangleClient } from '@plait/core';
-import { PlaitGeometry } from '../../interfaces';
+import { PlaitGeometry, PlaitShapeElement } from '../../interfaces';
 export declare const getHitRectangleResizeHandleRef: (board: PlaitBoard, rectangle: RectangleClient, point: Point, angle?: number) => {
     rectangle: {
         x: number;
@@ -10,4 +10,18 @@ export declare const getHitRectangleResizeHandleRef: (board: PlaitBoard, rectang
     handle: import("@plait/common").ResizeHandle;
     cursorClass: import("@plait/core").ResizeCursorClass;
 } | undefined;
-export declare const getHitOutlineGeometry: (board: PlaitBoard, point: Point, offset?: number) => PlaitGeometry | null;
+export declare const getSnappingGeometry: (board: PlaitBoard, point: Point) => PlaitGeometry | null;
+export declare const getSnappingRef: (board: PlaitBoard, hitElement: PlaitShapeElement, point: Point) => {
+    isHitEdge: boolean;
+    isHitConnector: boolean;
+    connectorPoint: Point | undefined;
+    edgePoint: Point;
+};
+export declare const getHitGeometry: (board: PlaitBoard, point: Point, offset?: number) => PlaitGeometry | null;
+export declare const traverseDrawShapes: (board: PlaitBoard, callback: (element: PlaitShapeElement) => void) => void;
+export declare const getRotateHandleRectangle: (rectangle: RectangleClient) => {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};

package/utils/shape.d.ts

@@ -1,2 +1,2 @@
-import { PlaitShape } from '../interfaces';
-export declare const getShape: (value: PlaitShape) => import("../interfaces").GeometryShapes;
+import { PlaitShapeElement } from '../interfaces';
+export declare const getElementShape: (value: PlaitShapeElement) => import("../interfaces").GeometryShapes;

package/utils/snap-resizing.d.ts

@@ -0,0 +1,25 @@
+import { ResizeRef, ResizeState } from '@plait/common';
+import { DirectionFactors, PlaitBoard, PlaitElement, Point, RectangleClient, SnapRef } from '@plait/core';
+import { PlaitDrawElement } from '../interfaces';
+export declare const debugGenerator: import("@plait/core").DebugGenerator;
+export interface ResizeSnapRef extends SnapRef {
+    xZoom: number;
+    yZoom: number;
+    activePoints: Point[];
+}
+export interface ResizeSnapOptions {
+    resizePoints: Point[];
+    activeRectangle: RectangleClient;
+    directionFactors: DirectionFactors;
+    isFromCorner: boolean;
+    isAspectRatio: boolean;
+    resizeOriginPoint?: Point[];
+    originPoint?: Point;
+    handlePoint?: Point;
+    isCreate?: boolean;
+}
+export declare function getSnapResizingRefOptions(board: PlaitBoard, resizeRef: ResizeRef<PlaitDrawElement | PlaitDrawElement[]>, resizeState: ResizeState, resizeOriginPointAndHandlePoint: {
+    originPoint: Point;
+    handlePoint: Point;
+}, isAspectRatio: boolean, isFromCorner: boolean): ResizeSnapOptions;
+export declare function getSnapResizingRef(board: PlaitBoard, activeElements: PlaitElement[], resizeSnapOptions: ResizeSnapOptions): ResizeSnapRef;