@plait/draw 0.81.3 → 0.82.0

package/fesm2022/plait-draw.mjs

@@ -1,4 +1,4 @@
-import { ACTIVE_STROKE_WIDTH, DEFAULT_COLOR, ThemeColorMode, PlaitElement, RectangleClient, getSelectedElements, idCreator, createDebugGenerator, Point, createG, arrowPoints, createPath, distanceBetweenPointAndPoint, drawLinearPath, rotate, catmullRomFitting, PlaitBoard, setStrokeLinecap, findElements, createMask, createRect, getNearestPointBetweenPointAndArc, setPathStrokeLinecap, distanceBetweenPointAndSegments, HIT_DISTANCE_BUFFER, isPointInPolygon, isLineHitRectangle, rotatePointsByAngle, rotateAntiPointsByElement, getEllipseArcCenter, Transforms, clearSelectedElement, addSelectedElement, BoardTransforms, PlaitPointerType, depthFirstRecursion, getIsRecursionFunc, SNAPPING_STROKE_WIDTH, SELECTION_BORDER_COLOR, SELECTION_FILL_COLOR, drawCircle, getI18nValue, toActiveRectangleFromViewBoxRectangle, getElementById, rotatePointsByElement, PlaitNode, hasValidAngle, toViewBoxPoint, toHostPoint, Direction, rotatePoints, getSelectionAngle, rotatedDataPoints, isAxisChangedByAngle, getRectangleByElements, isSelectionMoving, drawRectangle, getRectangleByAngle, getSnapRectangles, getTripleAxis, getMinPointDelta, SNAP_TOLERANCE, drawPointSnapLines, drawSolidLines, getNearestPointBetweenPointAndSegments, getEllipseTangentSlope, getVectorFromPointAndSlope, getNearestPointBetweenPointAndEllipse, isPointInEllipse, isPointInRoundRectangle, drawRoundRectangle, getCrossingPointsBetweenEllipseAndSegment, drawLine, getNearestPointBetweenPointAndDiscreteSegments, getNearestPointBetweenPointAndSegment, Path, RgbaToHEX, SELECTION_RECTANGLE_CLASS_NAME, toActivePointFromViewBoxPoint, getHitElementByPoint, WritableClipboardOperationType, WritableClipboardType, addOrCreateClipboardContext, setAngleForG, CursorClass, toActivePoint, temporaryDisableSelection, toScreenPointFromActivePoint, PRESS_AND_MOVE_BUFFER, isMainPointer, throttleRAF, getAngleBetweenPoints, normalizeAngle, degreesToRadians, rotateElements, MERGING, ROTATE_HANDLE_CLASS_NAME, isSelectedElement, isDragging } from '@plait/core';
+import { ACTIVE_STROKE_WIDTH, DEFAULT_COLOR, ThemeColorMode, PlaitElement, RectangleClient, getSelectedElements, idCreator, createDebugGenerator, Point, createG, arrowPoints, createPath, distanceBetweenPointAndPoint, drawLinearPath, rotate, catmullRomFitting, PlaitBoard, setStrokeLinecap, findElements, createMask, createRect, getNearestPointBetweenPointAndArc, setPathStrokeLinecap, distanceBetweenPointAndSegments, HIT_DISTANCE_BUFFER, isPointInPolygon, isLineHitRectangle, rotatePointsByAngle, rotateAntiPointsByElement, getEllipseArcCenter, Transforms, clearSelectedElement, addSelectedElement, BoardTransforms, PlaitPointerType, depthFirstRecursion, getIsRecursionFunc, SNAPPING_STROKE_WIDTH, SELECTION_BORDER_COLOR, SELECTION_FILL_COLOR, drawCircle, getI18nValue, toActiveRectangleFromViewBoxRectangle, getElementById, rotatePointsByElement, PlaitNode, hasValidAngle, toViewBoxPoint, toHostPoint, Direction, rotatePoints, getSelectionAngle, rotatedDataPoints, isAxisChangedByAngle, getRectangleByElements, isSelectionMoving, drawRectangle, getRectangleByAngle, getSnapRectangles, getTripleAxis, getMinPointDelta, SNAP_TOLERANCE, drawPointSnapLines, drawSolidLines, getNearestPointBetweenPointAndSegments, getEllipseTangentSlope, getVectorFromPointAndSlope, getNearestPointBetweenPointAndEllipse, isPointInEllipse, isPointInRoundRectangle, drawRoundRectangle, getCrossingPointsBetweenEllipseAndSegment, drawLine, getNearestPointBetweenPointAndDiscreteSegments, getNearestPointBetweenPointAndSegment, Path, rgbaToHEX, SELECTION_RECTANGLE_CLASS_NAME, toActivePointFromViewBoxPoint, getHitElementByPoint, WritableClipboardOperationType, WritableClipboardType, addOrCreateClipboardContext, setAngleForG, CursorClass, toActivePoint, temporaryDisableSelection, toScreenPointFromActivePoint, PRESS_AND_MOVE_BUFFER, isMainPointer, throttleRAF, getAngleBetweenPoints, normalizeAngle, degreesToRadians, rotateElements, MERGING, ROTATE_HANDLE_CLASS_NAME, isSelectedElement, isDragging } from '@plait/core';
 import { DEFAULT_FILL, Alignment, getMemorizedLatest, memorizeLatest, WithTextPluginKey, TextManage, StrokeStyle, removeDuplicatePoints, generateElbowLineRoute, simplifyOrthogonalPoints, getExtendPoint, getUnitVectorByPointAndPoint, Generator, getPointByVectorComponent, getStrokeLineDash, getPointOnPolyline, buildText, getCrossingPointsBetweenPointAndSegment, isPointOnSegment, getFirstTextEditor, sortElementsByArea, isFilled, getTextEditorsByElement, RESIZE_HANDLE_DIAMETER, measureElement, DEFAULT_FONT_FAMILY, getFirstTextManage, isSourceAndTargetIntersect, getPoints, DEFAULT_ROUTE_MARGIN, normalizeShapePoints, resetPointsAfterResize, getDirectionByVector, getRectangleResizeHandleRefs, getRotatedResizeCursorClassByAngle, ROTATE_HANDLE_SIZE, ROTATE_HANDLE_DISTANCE_TO_ELEMENT, isCornerHandle, getIndexByResizeHandle, withResize, getSymmetricHandleIndex, getResizeHandlePointByIndex, drawHandle, getDirectionFactorByDirectionComponent, buildClipboardData as buildClipboardData$1, insertClipboardData as insertClipboardData$1, getDirectionByPointOfRectangle, getDirectionFactor, rotateVector, getOppositeDirection, rotateVectorAnti90, getSourceAndTargetOuterRectangle, getNextPoint, PRIMARY_COLOR, CommonElementFlavour, createActiveGenerator, hasResizeHandle, ActiveGenerator, drawPrimaryHandle, drawFillPrimaryHandle, isVirtualKey, isDelete, isSpaceHotkey, isDndMode, isDrawingMode, getElementsText, acceptImageTypes, getElementOfFocusedImage, buildImage, isResizingByCondition, getRatioByPoint, getTextManages, ImageGenerator, ResizeHandle, addRotating, removeRotating, drawRotateHandle } from '@plait/common';
 import { TEXT_DEFAULT_HEIGHT, DEFAULT_FONT_SIZE, AlignEditor } from '@plait/text-plugins';
 import { pointsOnBezierCurves } from 'points-on-curve';
@@ -2421,7 +2421,7 @@ const getFlowchartDefaultFill = (theme) => {
 };
 const getTextShapeProperty = (board, text, fontSize) => {
     fontSize = fontSize ? Number(fontSize) : DEFAULT_FONT_SIZE;
-    const textSize = measureElement(buildText(text), { fontSize, fontFamily: DEFAULT_FONT_FAMILY });
+    const textSize = measureElement(board, buildText(text), { fontSize, fontFamily: DEFAULT_FONT_FAMILY });
     return {
         width: textSize.width + ShapeDefaultSpace.rectangleAndText * 2,
         height: textSize.height
@@ -7075,7 +7075,7 @@ class ArrowLineAutoCompleteGenerator extends Generator {
         middlePoints.forEach((point, index) => {
             const circle = drawCircle(PlaitBoard.getRoughSVG(this.board), point, LINE_AUTO_COMPLETE_DIAMETER, {
                 stroke: 'none',
-                fill: RgbaToHEX(PRIMARY_COLOR, LINE_AUTO_COMPLETE_OPACITY),
+                fill: rgbaToHEX(PRIMARY_COLOR, LINE_AUTO_COMPLETE_OPACITY),
                 fillStyle: 'solid'
             });
             circle.classList.add(`line-auto-complete-${index}`);
@@ -7957,7 +7957,7 @@ const withArrowLineResize = (board) => {
             const selectedLineElements = getSelectedArrowLineElements(board);
             if (selectedLineElements.length > 0) {
                 let result = null;
-                selectedLineElements.forEach(value => {
+                selectedLineElements.forEach((value) => {
                     const handleRef = getHitLineResizeHandleRef(board, value, point);
                     if (handleRef) {
                         result = {
@@ -8160,7 +8160,7 @@ const withArrowLineText = (board) => {
                     const defaultLineText = getDefaultLineText(board);
                     const textMemory = getMemorizedLatest('arrow-line')?.text || {};
                     const textElement = buildText(defaultLineText, undefined, textMemory);
-                    const { width, height } = measureElement(textElement, {
+                    const { width, height } = measureElement(board, textElement, {
                         fontSize: DEFAULT_FONT_SIZE,
                         fontFamily: DEFAULT_FONT_FAMILY
                     });
@@ -8283,7 +8283,7 @@ const withArrowLineAutoCompleteReaction = (board) => {
                 lineAutoCompleteGenerator?.removeAutoCompleteG(hitIndex);
                 reactionG = drawCircle(PlaitBoard.getRoughSVG(board), hitPoint, LINE_AUTO_COMPLETE_HOVERED_DIAMETER, {
                     stroke: 'none',
-                    fill: RgbaToHEX(PRIMARY_COLOR, LINE_AUTO_COMPLETE_HOVERED_OPACITY),
+                    fill: rgbaToHEX(PRIMARY_COLOR, LINE_AUTO_COMPLETE_HOVERED_OPACITY),
                     fillStyle: 'solid'
                 });
                 PlaitBoard.getActiveHost(board).append(reactionG);
@@ -9250,8 +9250,8 @@ const withDraw = (board) => {
         }
         return isHit(element, point, isStrict);
     };
-    board.getOneHitElement = elements => {
-        const isAllDrawElements = elements.every(item => PlaitDrawElement.isDrawElement(item));
+    board.getOneHitElement = (elements) => {
+        const isAllDrawElements = elements.every((item) => PlaitDrawElement.isDrawElement(item));
         if (isAllDrawElements) {
             return getHitDrawElement(board, elements);
         }
@@ -9277,7 +9277,7 @@ const withDraw = (board) => {
         if (PlaitDrawElement.isArrowLine(element)) {
             const selectedElements = getSelectedElements(board);
             const isSelected = (boundId) => {
-                return !!selectedElements.find(value => value.id === boundId);
+                return !!selectedElements.find((value) => value.id === boundId);
             };
             if (!element.source.boundId && !element.target.boundId) {
                 return true;
@@ -9300,10 +9300,10 @@ const withDraw = (board) => {
     };
     board.getRelatedFragment = (elements, originData) => {
         const selectedElements = originData?.length ? originData : getSelectedElements(board);
-        const lineElements = board.children.filter(element => PlaitDrawElement.isArrowLine(element));
-        const activeLines = lineElements.filter(line => {
-            const source = selectedElements.find(element => element.id === line.source.boundId);
-            const target = selectedElements.find(element => element.id === line.target.boundId);
+        const lineElements = board.children.filter((element) => PlaitDrawElement.isArrowLine(element));
+        const activeLines = lineElements.filter((line) => {
+            const source = selectedElements.find((element) => element.id === line.source.boundId);
+            const target = selectedElements.find((element) => element.id === line.target.boundId);
             const isSelected = selectedElements.includes(line);
             return source && target && !isSelected;
         });