@plait/draw 0.1.0-next.10

package/interfaces/line.d.ts

@@ -0,0 +1,59 @@
+import { PlaitElement, Point } from '@plait/core';
+import { Element } from 'slate';
+import { PlaitGeometry } from './geometry';
+import { StrokeStyle } from './element';
+export declare enum LineMarkerType {
+    arrow = "arrow",
+    none = "none",
+    openTriangle = "open-triangle",
+    solidTriangle = "solid-triangle",
+    sharpArrow = "sharp-arrow"
+}
+export declare enum LineShape {
+    straight = "straight",
+    curve = "curve",
+    elbow = "elbow"
+}
+export declare enum LineHandleKey {
+    source = "source",
+    target = "target"
+}
+export interface LineText {
+    text: Element;
+    position: number;
+    width: number;
+    height: number;
+}
+export interface LineHandle {
+    boundId?: string;
+    connection?: Point;
+    marker: LineMarkerType;
+}
+export interface PlaitLine extends PlaitElement {
+    type: 'line';
+    shape: LineShape;
+    points: Point[];
+    source: LineHandle;
+    target: LineHandle;
+    texts: LineText[];
+    strokeColor?: string;
+    strokeWidth?: number;
+    strokeStyle?: StrokeStyle;
+    opacity: number;
+}
+export interface PlaitStraightLine extends PlaitLine {
+    shape: LineShape.straight;
+}
+export interface PlaitCurveLine extends PlaitLine {
+    shape: LineShape.curve;
+}
+export interface PlaitElbowLine extends PlaitLine {
+    shape: LineShape.elbow;
+}
+export declare const PlaitLine: {
+    getTextEditors(element: PlaitLine): (import("slate").BaseEditor & import("slate-angular").AngularEditor & import("slate-history").HistoryEditor)[];
+    isSourceMark(line: PlaitLine, markType: LineMarkerType): boolean;
+    isTargetMark(line: PlaitLine, markType: LineMarkerType): boolean;
+    isBoundElementOfSource(line: PlaitLine, element: PlaitGeometry): boolean;
+    isBoundElementOfTarget(line: PlaitLine, element: PlaitGeometry): boolean;
+};

package/interfaces/text.d.ts

@@ -0,0 +1,5 @@
+import { PlaitGeometry, GeometryShape } from './geometry';
+export interface PlaitText extends PlaitGeometry {
+    shape: GeometryShape.text;
+    autoSize: boolean;
+}

package/line.component.d.ts

@@ -0,0 +1,36 @@
+import { ChangeDetectorRef, OnDestroy, OnInit, ViewContainerRef } from '@angular/core';
+import { PlaitBoard, PlaitPluginElementComponent, PlaitPluginElementContext, OnContextChanged } from '@plait/core';
+import { Subject } from 'rxjs';
+import { LineText, PlaitGeometry, PlaitLine } from './interfaces';
+import { TextManage } from '@plait/text';
+import { LineShapeGenerator } from './generators/line.generator';
+import { LineActiveGenerator } from './generators/line-active.generator';
+import * as i0 from "@angular/core";
+interface BoundedElements {
+    source?: PlaitGeometry;
+    target?: PlaitGeometry;
+}
+export declare class LineComponent extends PlaitPluginElementComponent<PlaitLine, PlaitBoard> implements OnInit, OnDestroy, OnContextChanged<PlaitLine, PlaitBoard> {
+    private viewContainerRef;
+    protected cdr: ChangeDetectorRef;
+    destroy$: Subject<void>;
+    shapeGenerator: LineShapeGenerator;
+    activeGenerator: LineActiveGenerator;
+    textManages: TextManage[];
+    boundedElements: BoundedElements;
+    constructor(viewContainerRef: ViewContainerRef, cdr: ChangeDetectorRef);
+    initializeGenerator(): void;
+    ngOnInit(): void;
+    getBoundedElements(): BoundedElements;
+    onContextChanged(value: PlaitPluginElementContext<PlaitLine, PlaitBoard>, previous: PlaitPluginElementContext<PlaitLine, PlaitBoard>): void;
+    initializeTextManages(): void;
+    destroyTextManages(): void;
+    drawText(): void;
+    createTextManage(text: LineText, index: number): TextManage;
+    updateText(previousTexts: LineText[], currentTexts: LineText[]): void;
+    updateTextRectangle(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LineComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LineComponent, "plait-draw-line", never, {}, {}, never, never, false, never>;
+}
+export {};

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@plait/draw",
+  "version": "0.1.0-next.10",
+  "peerDependencies": {
+    "@angular/common": "^16.0.0",
+    "@angular/core": "^16.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "module": "fesm2015/plait-draw.mjs",
+  "es2020": "fesm2020/plait-draw.mjs",
+  "esm2020": "esm2020/plait-draw.mjs",
+  "fesm2020": "fesm2020/plait-draw.mjs",
+  "fesm2015": "fesm2015/plait-draw.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2020": "./esm2020/plait-draw.mjs",
+      "es2020": "./fesm2020/plait-draw.mjs",
+      "es2015": "./fesm2015/plait-draw.mjs",
+      "node": "./fesm2015/plait-draw.mjs",
+      "default": "./fesm2020/plait-draw.mjs"
+    }
+  },
+  "sideEffects": false
+}

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

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

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

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

package/plugins/with-draw.d.ts

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

package/plugins/with-geometry-create.d.ts

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

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

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

package/plugins/with-line-bound-reaction.d.ts

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

package/plugins/with-line-create.d.ts

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

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

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

package/plugins/with-line-text.d.ts

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

package/public-api.d.ts

@@ -0,0 +1,7 @@
+export * from './interfaces';
+export * from './plugins/with-draw';
+export * from './constants';
+export * from './utils';
+export * from './geometry.component';
+export * from './line.component';
+export * from './transforms';

package/styles/styles.scss

@@ -0,0 +1,16 @@
+.plait-board-container {
+    &.pointer-text {
+        .board-host-svg {
+            cursor: default;
+        }
+    }
+    &.pointer-rectangle,
+    &.pointer-line {
+        .board-host-svg {
+            cursor: crosshair;
+        }
+    }
+    &.draw-line-resizing .element-active-host .line-handle {
+        display: none;
+    }
+}

package/transforms/geometry-text.d.ts

@@ -0,0 +1,5 @@
+import { PlaitBoard } from '@plait/core';
+import { Element } from 'slate';
+import { PlaitGeometry } from '../interfaces';
+export declare const setText: (board: PlaitBoard, element: PlaitGeometry, text: Element, width: number, textHeight: number) => void;
+export declare const setTextSize: (board: PlaitBoard, element: PlaitGeometry, textWidth: number, textHeight: number) => void;

package/transforms/geometry.d.ts

@@ -0,0 +1,6 @@
+import { PlaitBoard, Point, Path } from '@plait/core';
+import { GeometryShape } from '../interfaces';
+import { Element } from 'slate';
+export declare const insertGeometry: (board: PlaitBoard, points: [Point, Point], shape: GeometryShape) => void;
+export declare const insertText: (board: PlaitBoard, points: [Point, Point], text?: string | Element) => void;
+export declare const resizeGeometry: (board: PlaitBoard, points: [Point, Point], textHeight: number, path: Path) => void;

package/transforms/index.d.ts

@@ -0,0 +1,11 @@
+export declare const DrawTransforms: {
+    setText: (board: import("@plait/core").PlaitBoard, element: import("@plait/draw").PlaitGeometry, text: import("slate").BaseElement, width: number, textHeight: number) => void;
+    insertGeometry: (board: import("@plait/core").PlaitBoard, points: [import("@plait/core").Point, import("@plait/core").Point], shape: import("@plait/draw").GeometryShape) => void;
+    resizeGeometry: (board: import("@plait/core").PlaitBoard, points: [import("@plait/core").Point, import("@plait/core").Point], textHeight: number, path: import("@plait/core").Path) => void;
+    insertText: (board: import("@plait/core").PlaitBoard, points: [import("@plait/core").Point, import("@plait/core").Point], text?: string | import("slate").BaseElement) => void;
+    setTextSize: (board: import("@plait/core").PlaitBoard, element: import("@plait/draw").PlaitGeometry, textWidth: number, textHeight: number) => void;
+    resizeLine: (board: import("@plait/core").PlaitBoard, options: Partial<import("@plait/draw").PlaitLine>, path: import("@plait/core").Path) => void;
+    setLineTexts: (board: import("@plait/core").PlaitBoard, element: import("@plait/draw").PlaitLine, texts: import("@plait/draw").LineText[]) => void;
+    removeLineText: (board: import("@plait/core").PlaitBoard, element: import("@plait/draw").PlaitLine, index: number) => void;
+    setLineMark: (board: import("@plait/core").PlaitBoard, element: import("@plait/draw").PlaitLine, handleKey: import("@plait/draw").LineHandleKey, marker: import("@plait/draw").LineMarkerType) => void;
+};

package/transforms/line.d.ts

@@ -0,0 +1,6 @@
+import { Path, PlaitBoard } from '@plait/core';
+import { LineHandleKey, LineMarkerType, LineText, PlaitLine } from '../interfaces';
+export declare const resizeLine: (board: PlaitBoard, options: Partial<PlaitLine>, path: Path) => void;
+export declare const setLineTexts: (board: PlaitBoard, element: PlaitLine, texts: LineText[]) => void;
+export declare const removeLineText: (board: PlaitBoard, element: PlaitLine, index: number) => void;
+export declare const setLineMark: (board: PlaitBoard, element: PlaitLine, handleKey: LineHandleKey, marker: LineMarkerType) => void;

package/utils/clipboard.d.ts

@@ -0,0 +1,4 @@
+import { PlaitBoard, Point } from '@plait/core';
+import { PlaitDrawElement, PlaitGeometry, PlaitLine } from '../interfaces';
+export declare const buildClipboardData: (board: PlaitBoard, elements: PlaitDrawElement[], startPoint: Point) => (PlaitGeometry | PlaitLine)[];
+export declare const insertClipboardData: (board: PlaitBoard, elements: PlaitDrawElement[], startPoint: Point) => void;

package/utils/engine/diamond.d.ts

@@ -0,0 +1,2 @@
+import { ShapeEngine } from '../../interfaces';
+export declare const DiamondEngine: ShapeEngine;

package/utils/engine/ellipse.d.ts

@@ -0,0 +1,4 @@
+import { Point } from '@plait/core';
+import { ShapeEngine } from '../../interfaces';
+export declare const EllipseEngine: ShapeEngine;
+export declare function getNearestPointBetweenPointAndEllipse(point: Point, center: Point, rx: number, ry: number, rotation?: number): Point;

package/utils/engine/index.d.ts

@@ -0,0 +1,3 @@
+import { GeometryShape, ShapeEngine } from '../../interfaces';
+export declare const ShapeEngineMap: Record<GeometryShape, ShapeEngine>;
+export declare const getEngine: (shape: GeometryShape) => ShapeEngine;

package/utils/engine/parallelogram.d.ts

@@ -0,0 +1,4 @@
+import { Point, RectangleClient } from '@plait/core';
+import { ShapeEngine } from '../../interfaces';
+export declare const ParallelogramEngine: ShapeEngine;
+export declare const getParallelogramPoints: (rectangle: RectangleClient) => Point[];

package/utils/engine/rectangle.d.ts

@@ -0,0 +1,2 @@
+import { ShapeEngine } from '../../interfaces';
+export declare const RectangleEngine: ShapeEngine;

package/utils/engine/round-rectangle.d.ts

@@ -0,0 +1,5 @@
+import { Point, RectangleClient } from '@plait/core';
+import { ShapeEngine } from '../../interfaces';
+export declare const RoundRectangleEngine: ShapeEngine;
+export declare const getRoundRectangleRadius: (rectangle: RectangleClient) => number;
+export declare function getNearestPointBetweenPointAndRoundRectangle(point: Point, rectangle: RectangleClient, radius: number): Point;

package/utils/geometry.d.ts

@@ -0,0 +1,16 @@
+import { PlaitBoard, Point, RectangleClient } from '@plait/core';
+import { GeometryShape, PlaitGeometry } from '../interfaces/geometry';
+import { Element } from 'slate';
+import { Options } from 'roughjs/bin/core';
+export declare const createGeometryElement: (shape: GeometryShape, points: [Point, Point], text: string | Element, options?: Pick<PlaitGeometry, 'fill' | 'strokeColor' | 'strokeWidth'>) => PlaitGeometry;
+export declare const getPointsByCenterPoint: (point: Point, width: number, height: number) => [Point, Point];
+export declare const getTextRectangle: (element: PlaitGeometry) => {
+    height: number;
+    width: number;
+    x: number;
+    y: number;
+};
+export declare const drawBoundMask: (board: PlaitBoard, element: PlaitGeometry) => SVGGElement;
+export declare const drawGeometry: (board: PlaitBoard, outerRectangle: RectangleClient, shape: GeometryShape, options: Options) => SVGGElement;
+export declare const getNearestPoint: (element: PlaitGeometry, point: Point, inflateDelta?: number) => Point;
+export declare const getCenterPointsOnPolygon: (points: Point[]) => Point[];

package/utils/index.d.ts

@@ -0,0 +1,4 @@
+export * from './line';
+export * from './geometry';
+export * from './selected';
+export * from './style';

package/utils/line-arrow.d.ts

@@ -0,0 +1,4 @@
+import { Point } from '@plait/core';
+import { PlaitLine } from '../interfaces';
+import { Options } from 'roughjs/bin/core';
+export declare const drawLineArrow: (element: PlaitLine, points: Point[], options: Options) => SVGGElement | null;

package/utils/line.d.ts

@@ -0,0 +1,17 @@
+import { Point, PlaitBoard, RectangleClient } from '@plait/core';
+import { LineHandle, LineShape, PlaitGeometry, PlaitLine } from '../interfaces';
+export declare const createLineElement: (shape: LineShape, points: [Point, Point], source: LineHandle, target: LineHandle, options?: Pick<PlaitLine, 'strokeColor' | 'strokeWidth'>) => PlaitLine;
+export declare const getLinePoints: (board: PlaitBoard, element: PlaitLine) => Point[];
+export declare const getStraightPoints: (board: PlaitBoard, element: PlaitLine) => Point[];
+export declare const getElbowPoints: (board: PlaitBoard, element: PlaitLine) => Point[];
+export declare const isHitPolyLine: (pathPoints: Point[], point: Point, strokeWidth: number, expand?: number) => boolean;
+export declare const getHitLineTextIndex: (board: PlaitBoard, element: PlaitLine, point: Point) => number;
+export declare const isHitLineText: (board: PlaitBoard, element: PlaitLine, point: Point) => boolean;
+export declare const drawLine: (board: PlaitBoard, element: PlaitLine) => SVGGElement;
+export declare const getSourcePoint: (board: PlaitBoard, element: PlaitLine) => Point;
+export declare const getTargetPoint: (board: PlaitBoard, element: PlaitLine) => Point;
+export declare const getConnectionPoint: (geometry: PlaitGeometry, connection: Point, offset: number) => Point;
+export declare const transformPointToConnection: (board: PlaitBoard, point: Point, hitElement: PlaitGeometry) => Point;
+export declare const getHitConnectorPoint: (movingPoint: Point, hitElement: PlaitGeometry, rectangle: RectangleClient) => Point | undefined;
+export declare const getLineTextRectangle: (board: PlaitBoard, element: PlaitLine, index: number) => RectangleClient;
+export declare const getBoardLines: (board: PlaitBoard) => PlaitLine[];

package/utils/position/geometry.d.ts

@@ -0,0 +1,13 @@
+import { PlaitBoard, Point } from '@plait/core';
+import { PlaitGeometry } from '../../interfaces';
+export declare const getHitGeometryResizeHandleRef: (board: PlaitBoard, element: PlaitGeometry, point: Point) => {
+    rectangle: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    handle: import("@plait/common").ResizeHandle;
+    cursorClass: import("@plait/common").ResizeCursorClass;
+} | undefined;
+export declare const getHitOutlineGeometry: (board: PlaitBoard, point: Point, offset?: number) => PlaitGeometry | null;

package/utils/position/line.d.ts

@@ -0,0 +1,10 @@
+import { PlaitBoard, Point, RectangleClient } from '@plait/core';
+import { PlaitLine } from '../../interfaces';
+export declare enum LineResizeHandle {
+    'source' = "source",
+    'target' = "target"
+}
+export declare const getHitLineResizeHandleRef: (board: PlaitBoard, element: PlaitLine, point: Point) => {
+    rectangle: RectangleClient;
+    handle: LineResizeHandle;
+} | undefined;

package/utils/selected.d.ts

@@ -0,0 +1,5 @@
+import { PlaitBoard } from '@plait/core';
+import { PlaitDrawElement, PlaitGeometry, PlaitLine } from '../interfaces';
+export declare const getSelectedDrawElements: (board: PlaitBoard) => PlaitDrawElement[];
+export declare const getSelectedGeometryElements: (board: PlaitBoard) => PlaitGeometry[];
+export declare const getSelectedLineElements: (board: PlaitBoard) => PlaitLine[];

package/utils/style/index.d.ts

@@ -0,0 +1 @@
+export * from './stroke';

package/utils/style/stroke.d.ts

@@ -0,0 +1,6 @@
+import { PlaitGeometry, PlaitLine, StrokeStyle } from '../../interfaces';
+export declare const getStrokeWidthByElement: (element: PlaitGeometry | PlaitLine) => number;
+export declare const getStrokeColorByElement: (element: PlaitGeometry | PlaitLine) => string;
+export declare const getFillByElement: (element: PlaitGeometry | PlaitLine) => any;
+export declare const getLineDashByElement: (element: PlaitGeometry | PlaitLine) => number[] | undefined;
+export declare const getStrokeStyleByElement: (element: PlaitGeometry | PlaitLine) => StrokeStyle;