@plait/draw 0.71.0 → 0.73.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/arrow-line.component.d.ts +1 -1
  2. package/constants/default.d.ts +1 -0
  3. package/constants/geometry.d.ts +5 -5
  4. package/constants/index.d.ts +1 -0
  5. package/constants/pointer.d.ts +3 -3
  6. package/engines/index.d.ts +2 -2
  7. package/engines/table/table.d.ts +2 -2
  8. package/engines/uml/combined-fragment.d.ts +3 -3
  9. package/engines/uml/package.d.ts +3 -3
  10. package/esm2022/arrow-line.component.mjs +13 -13
  11. package/esm2022/constants/default.mjs +2 -0
  12. package/esm2022/constants/geometry.mjs +8 -8
  13. package/esm2022/constants/index.mjs +2 -1
  14. package/esm2022/constants/pointer.mjs +4 -4
  15. package/esm2022/engines/index.mjs +1 -1
  16. package/esm2022/engines/table/table.mjs +3 -3
  17. package/esm2022/engines/uml/combined-fragment.mjs +5 -5
  18. package/esm2022/engines/uml/package.mjs +5 -5
  19. package/esm2022/generators/single-text.generator.mjs +3 -3
  20. package/esm2022/generators/text.generator.mjs +25 -21
  21. package/esm2022/geometry.component.mjs +4 -5
  22. package/esm2022/interfaces/arrow-line.mjs +1 -1
  23. package/esm2022/interfaces/element.mjs +1 -7
  24. package/esm2022/interfaces/engine.mjs +1 -1
  25. package/esm2022/interfaces/geometry.mjs +6 -6
  26. package/esm2022/interfaces/index.mjs +13 -1
  27. package/esm2022/interfaces/options.mjs +2 -0
  28. package/esm2022/interfaces/table.mjs +1 -1
  29. package/esm2022/interfaces/vector-line.mjs +5 -5
  30. package/esm2022/plugins/with-arrow-line-text.mjs +2 -2
  31. package/esm2022/plugins/with-draw-fragment.mjs +8 -12
  32. package/esm2022/plugins/with-draw-hotkey.mjs +3 -3
  33. package/esm2022/plugins/with-draw-resize.mjs +11 -6
  34. package/esm2022/plugins/with-draw-rotate.mjs +4 -2
  35. package/esm2022/plugins/with-draw.mjs +10 -11
  36. package/esm2022/plugins/with-vector-line-create.mjs +123 -0
  37. package/esm2022/plugins/with-vector-line-resize.mjs +3 -3
  38. package/esm2022/table.component.mjs +9 -10
  39. package/esm2022/transforms/index.mjs +3 -3
  40. package/esm2022/transforms/multi-text-geometry-text.mjs +3 -3
  41. package/esm2022/utils/arrow-line/arrow-line-basic.mjs +3 -3
  42. package/esm2022/utils/clipboard.mjs +6 -17
  43. package/esm2022/utils/common.mjs +16 -9
  44. package/esm2022/utils/geometry.mjs +3 -3
  45. package/esm2022/utils/hit.mjs +21 -19
  46. package/esm2022/utils/index.mjs +2 -1
  47. package/esm2022/utils/multi-text-geometry.mjs +3 -3
  48. package/esm2022/utils/selected.mjs +9 -1
  49. package/esm2022/utils/snap-resizing.mjs +1 -1
  50. package/esm2022/utils/style/stroke.mjs +6 -6
  51. package/esm2022/utils/table.mjs +2 -2
  52. package/esm2022/utils/vector-line.mjs +3 -9
  53. package/esm2022/vector-line.component.mjs +2 -4
  54. package/fesm2022/plait-draw.mjs +251 -303
  55. package/fesm2022/plait-draw.mjs.map +1 -1
  56. package/generators/single-text.generator.d.ts +2 -2
  57. package/generators/text.generator.d.ts +11 -13
  58. package/interfaces/arrow-line.d.ts +1 -1
  59. package/interfaces/element.d.ts +0 -5
  60. package/interfaces/engine.d.ts +7 -2
  61. package/interfaces/geometry.d.ts +11 -10
  62. package/interfaces/index.d.ts +4 -1
  63. package/interfaces/options.d.ts +4 -0
  64. package/interfaces/table.d.ts +2 -2
  65. package/interfaces/vector-line.d.ts +4 -4
  66. package/package.json +1 -1
  67. package/plugins/with-vector-line-create.d.ts +2 -0
  68. package/styles/styles.scss +1 -1
  69. package/table.component.d.ts +2 -2
  70. package/transforms/common.d.ts +1 -1
  71. package/transforms/geometry.d.ts +1 -1
  72. package/transforms/index.d.ts +3 -3
  73. package/transforms/multi-text-geometry-text.d.ts +2 -2
  74. package/utils/clipboard.d.ts +10 -3
  75. package/utils/common.d.ts +6 -4
  76. package/utils/geometry.d.ts +6 -6
  77. package/utils/hit.d.ts +8 -4
  78. package/utils/index.d.ts +1 -0
  79. package/utils/multi-text-geometry.d.ts +6 -10
  80. package/utils/selected.d.ts +3 -1
  81. package/utils/snap-resizing.d.ts +2 -2
  82. package/utils/vector-line.d.ts +0 -1
  83. package/esm2022/plugins/with-geometry-resize.mjs +0 -70
  84. package/esm2022/plugins/with-vector-pen-create.mjs +0 -123
  85. package/plugins/with-geometry-resize.d.ts +0 -2
  86. package/plugins/with-vector-pen-create.d.ts +0 -2
@@ -1,5 +1,5 @@
1
- import { ACTIVE_STROKE_WIDTH, DEFAULT_COLOR, ThemeColorMode, RectangleClient, getSelectedElements, idCreator, catmullRomFitting, PlaitBoard, createG, drawLinearPath, setStrokeLinecap, distanceBetweenPointAndSegments, HIT_DISTANCE_BUFFER, isPointInPolygon, rotatePointsByElement, isPolylineHitRectangle, rotateAntiPointsByElement, distanceBetweenPointAndPoint, Transforms, clearSelectedElement, addSelectedElement, BoardTransforms, PlaitPointerType, depthFirstRecursion, getIsRecursionFunc, SNAPPING_STROKE_WIDTH, SELECTION_BORDER_COLOR, SELECTION_FILL_COLOR, drawCircle, createDebugGenerator, Point, arrowPoints, createPath, rotate, findElements, createMask, createRect, PlaitElement, getElementById, PlaitNode, hasValidAngle, toViewBoxPoint, toHostPoint, Direction, rotatePoints, getRectangleByElements, getSelectionAngle, rotatedDataPoints, isAxisChangedByAngle, isSelectionMoving, drawRectangle, getRectangleByAngle, getSnapRectangles, getTripleAxis, getMinPointDelta, SNAP_TOLERANCE, drawPointSnapLines, drawSolidLines, getNearestPointBetweenPointAndSegments, isPointInEllipse, getNearestPointBetweenPointAndEllipse, getEllipseTangentSlope, getVectorFromPointAndSlope, drawRoundRectangle, isPointInRoundRectangle, setPathStrokeLinecap, getCrossingPointsBetweenEllipseAndSegment, drawLine, Path, RgbaToHEX, SELECTION_RECTANGLE_CLASS_NAME, getHitElementByPoint, WritableClipboardOperationType, createClipboardContext, WritableClipboardType, addClipboardContext, setAngleForG, CursorClass, temporaryDisableSelection, PRESS_AND_MOVE_BUFFER, isMainPointer, throttleRAF, getAngleBetweenPoints, normalizeAngle, degreesToRadians, rotateElements, MERGING, ROTATE_HANDLE_CLASS_NAME, isSelectedElement, isDragging } from '@plait/core';
2
- import { DEFAULT_FILL, Alignment, WithTextPluginKey, ELEMENT_TO_TEXT_MANAGES, TextManage, getMemorizedLatest, memorizeLatest, getPointOnPolyline, buildText, Generator, getStrokeLineDash, sortElementsByArea, isFilled, getTextEditorsByElement, removeDuplicatePoints, generateElbowLineRoute, simplifyOrthogonalPoints, getExtendPoint, getUnitVectorByPointAndPoint, getPointByVectorComponent, RESIZE_HANDLE_DIAMETER, measureElement, DEFAULT_FONT_FAMILY, getFirstTextManage, ActiveGenerator, isSourceAndTargetIntersect, getPoints, DEFAULT_ROUTE_MARGIN, normalizeShapePoints, getFirstTextEditor, resetPointsAfterResize, getDirectionByVector, getRectangleResizeHandleRefs, getRotatedResizeCursorClassByAngle, ROTATE_HANDLE_DISTANCE_TO_ELEMENT, ROTATE_HANDLE_SIZE, isCornerHandle, getIndexByResizeHandle, withResize, drawHandle, getSymmetricHandleIndex, getResizeHandlePointByIndex, getDirectionFactorByDirectionComponent, getCrossingPointsBetweenPointAndSegment, isPointOnSegment, getDirectionByPointOfRectangle, getDirectionFactor, rotateVector, getOppositeDirection, rotateVectorAnti90, getSourceAndTargetOuterRectangle, getNextPoint, PRIMARY_COLOR, CommonElementFlavour, canResize, drawPrimaryHandle, drawFillPrimaryHandle, isVirtualKey, isDelete, isSpaceHotkey, isDndMode, isDrawingMode, getElementsText, acceptImageTypes, getElementOfFocusedImage, buildImage, isResizingByCondition, getRatioByPoint, getTextManages, ImageGenerator, ResizeHandle, addRotating, removeRotating, drawRotateHandle } from '@plait/common';
1
+ import { ACTIVE_STROKE_WIDTH, DEFAULT_COLOR, ThemeColorMode, PlaitElement, RectangleClient, getSelectedElements, idCreator, catmullRomFitting, PlaitBoard, createG, drawLinearPath, setStrokeLinecap, distanceBetweenPointAndSegments, HIT_DISTANCE_BUFFER, isPointInPolygon, isPolylineHitRectangle, rotatePointsByAngle, rotateAntiPointsByElement, distanceBetweenPointAndPoint, Transforms, clearSelectedElement, addSelectedElement, BoardTransforms, PlaitPointerType, depthFirstRecursion, getIsRecursionFunc, SNAPPING_STROKE_WIDTH, SELECTION_BORDER_COLOR, SELECTION_FILL_COLOR, drawCircle, createDebugGenerator, Point, arrowPoints, createPath, rotate, findElements, createMask, createRect, getElementById, rotatePointsByElement, PlaitNode, hasValidAngle, toViewBoxPoint, toHostPoint, Direction, rotatePoints, getRectangleByElements, getSelectionAngle, rotatedDataPoints, isAxisChangedByAngle, isSelectionMoving, drawRectangle, getRectangleByAngle, getSnapRectangles, getTripleAxis, getMinPointDelta, SNAP_TOLERANCE, drawPointSnapLines, drawSolidLines, getNearestPointBetweenPointAndSegments, isPointInEllipse, getNearestPointBetweenPointAndEllipse, getEllipseTangentSlope, getVectorFromPointAndSlope, drawRoundRectangle, isPointInRoundRectangle, setPathStrokeLinecap, getCrossingPointsBetweenEllipseAndSegment, drawLine, Path, RgbaToHEX, SELECTION_RECTANGLE_CLASS_NAME, getHitElementByPoint, WritableClipboardOperationType, WritableClipboardType, addOrCreateClipboardContext, setAngleForG, CursorClass, temporaryDisableSelection, PRESS_AND_MOVE_BUFFER, isMainPointer, throttleRAF, getAngleBetweenPoints, normalizeAngle, degreesToRadians, rotateElements, MERGING, ROTATE_HANDLE_CLASS_NAME, isSelectedElement, isDragging } from '@plait/core';
2
+ import { DEFAULT_FILL, Alignment, WithTextPluginKey, TextManage, getMemorizedLatest, memorizeLatest, getPointOnPolyline, buildText, Generator, getStrokeLineDash, StrokeStyle, sortElementsByArea, isFilled, getTextEditorsByElement, removeDuplicatePoints, generateElbowLineRoute, simplifyOrthogonalPoints, getExtendPoint, getUnitVectorByPointAndPoint, getPointByVectorComponent, RESIZE_HANDLE_DIAMETER, measureElement, DEFAULT_FONT_FAMILY, getFirstTextManage, ActiveGenerator, isSourceAndTargetIntersect, getPoints, DEFAULT_ROUTE_MARGIN, normalizeShapePoints, getFirstTextEditor, resetPointsAfterResize, getDirectionByVector, getRectangleResizeHandleRefs, getRotatedResizeCursorClassByAngle, ROTATE_HANDLE_DISTANCE_TO_ELEMENT, ROTATE_HANDLE_SIZE, isCornerHandle, getIndexByResizeHandle, withResize, drawHandle, getSymmetricHandleIndex, getResizeHandlePointByIndex, getDirectionFactorByDirectionComponent, buildClipboardData as buildClipboardData$1, insertClipboardData as insertClipboardData$1, getCrossingPointsBetweenPointAndSegment, isPointOnSegment, getDirectionByPointOfRectangle, getDirectionFactor, rotateVector, getOppositeDirection, rotateVectorAnti90, getSourceAndTargetOuterRectangle, getNextPoint, PRIMARY_COLOR, CommonElementFlavour, canResize, drawPrimaryHandle, drawFillPrimaryHandle, isVirtualKey, isDelete, isSpaceHotkey, isDndMode, isDrawingMode, getElementsText, acceptImageTypes, getElementOfFocusedImage, buildImage, isResizingByCondition, getRatioByPoint, getTextManages, ImageGenerator, ResizeHandle, addRotating, removeRotating, drawRotateHandle } from '@plait/common';
3
3
  import { pointsOnBezierCurves } from 'points-on-curve';
4
4
  import { TEXT_DEFAULT_HEIGHT, DEFAULT_FONT_SIZE, AlignEditor } from '@plait/text-plugins';
5
5
  import { isKeyHotkey } from 'is-hotkey';
@@ -80,11 +80,11 @@ var UMLSymbols;
80
80
  UMLSymbols["providedInterface"] = "providedInterface";
81
81
  UMLSymbols["requiredInterface"] = "requiredInterface";
82
82
  })(UMLSymbols || (UMLSymbols = {}));
83
- var MultipleTextGeometryCommonTextKeys;
84
- (function (MultipleTextGeometryCommonTextKeys) {
85
- MultipleTextGeometryCommonTextKeys["name"] = "name";
86
- MultipleTextGeometryCommonTextKeys["content"] = "content";
87
- })(MultipleTextGeometryCommonTextKeys || (MultipleTextGeometryCommonTextKeys = {}));
83
+ var GeometryCommonTextKeys;
84
+ (function (GeometryCommonTextKeys) {
85
+ GeometryCommonTextKeys["name"] = "name";
86
+ GeometryCommonTextKeys["content"] = "content";
87
+ })(GeometryCommonTextKeys || (GeometryCommonTextKeys = {}));
88
88
  const PlaitGeometry = {};
89
89
 
90
90
  var SwimlaneSymbols;
@@ -113,6 +113,8 @@ const PlaitTableElement = {
113
113
  }
114
114
  };
115
115
 
116
+ const WithDrawPluginKey = 'plait-draw-plugin-key';
117
+
116
118
  const ShapeDefaultSpace = {
117
119
  rectangleAndText: 4
118
120
  };
@@ -213,12 +215,12 @@ const DefaultPackageProperty = {
213
215
  height: 150,
214
216
  texts: [
215
217
  {
216
- key: MultipleTextGeometryCommonTextKeys.name,
218
+ id: GeometryCommonTextKeys.name,
217
219
  text: '包名',
218
220
  align: Alignment.left
219
221
  },
220
222
  {
221
- key: MultipleTextGeometryCommonTextKeys.content,
223
+ id: GeometryCommonTextKeys.content,
222
224
  text: '',
223
225
  align: Alignment.left
224
226
  }
@@ -261,12 +263,12 @@ const DefaultCombinedFragmentProperty = {
261
263
  height: 280,
262
264
  texts: [
263
265
  {
264
- key: MultipleTextGeometryCommonTextKeys.name,
266
+ id: GeometryCommonTextKeys.name,
265
267
  text: 'Opt | Alt | Loop',
266
268
  align: Alignment.left
267
269
  },
268
270
  {
269
- key: MultipleTextGeometryCommonTextKeys.content,
271
+ id: GeometryCommonTextKeys.content,
270
272
  text: '[Condition]',
271
273
  align: Alignment.left
272
274
  }
@@ -356,8 +358,8 @@ const DefaultUMLPropertyMap = {
356
358
  [UMLSymbols.requiredInterface]: DefaultRequiredInterfaceProperty
357
359
  };
358
360
  const MultipleTextGeometryTextKeys = {
359
- [UMLSymbols.package]: Object.keys(MultipleTextGeometryCommonTextKeys),
360
- [UMLSymbols.combinedFragment]: Object.keys(MultipleTextGeometryCommonTextKeys)
361
+ [UMLSymbols.package]: Object.keys(GeometryCommonTextKeys),
362
+ [UMLSymbols.combinedFragment]: Object.keys(GeometryCommonTextKeys)
361
363
  };
362
364
  const LINE_HIT_GEOMETRY_BUFFER = 10;
363
365
  const LINE_SNAPPING_BUFFER = 6;
@@ -400,8 +402,8 @@ const getUMLPointers = () => {
400
402
  const getArrowLinePointers = () => {
401
403
  return Object.keys(ArrowLineShape);
402
404
  };
403
- const getVectorPenPointers = () => {
404
- return Object.keys(VectorPenPointerType);
405
+ const getVectorLinePointers = () => {
406
+ return Object.keys(VectorLinePointerType);
405
407
  };
406
408
 
407
409
  const DEFAULT_IMAGE_WIDTH = 1000;
@@ -469,14 +471,20 @@ const getElementShape = (value) => {
469
471
  return value.shape;
470
472
  };
471
473
 
474
+ // TODO: 是否可以完全基于位置定位 TextManager,实现 line 和 多文本 geometry 统一
475
+ // 一个元素有多个文本时,单纯通过位置无法获取 TextManage,因此这里单独通过 Map 保存关键字 key 和 TextManage 的对应关系
476
+ // 1. 单文本元素 key 就是元素的 id
477
+ // 2. 表格元素 key 是单元格的 id
478
+ // 3. 符合 isMultipleTextGeometry 的元素,key 是元素 id + text.id (通常不是 id 而是文本位置的常量)
479
+ // 4. arrow-line 和 vector-line 文本不依赖于 text.generator,基于 text 可以直接找到 TextManage
472
480
  const KEY_TO_TEXT_MANAGE = new WeakMap();
473
- const setTextManage = (board, key, textManage) => {
481
+ const setTextManage = (board, element, text, textManage) => {
474
482
  const textManages = KEY_TO_TEXT_MANAGE.get(board);
475
- return KEY_TO_TEXT_MANAGE.set(board, { ...textManages, [key]: textManage });
483
+ return KEY_TO_TEXT_MANAGE.set(board, { ...textManages, [getTextKey(element, text)]: textManage });
476
484
  };
477
- const getTextManage = (board, key) => {
485
+ const getTextManage = (board, element, text) => {
478
486
  const textManages = KEY_TO_TEXT_MANAGE.get(board);
479
- return textManages[key];
487
+ return textManages[getTextKey(element, text)];
480
488
  };
481
489
  const deleteTextManage = (board, key) => {
482
490
  const textManages = KEY_TO_TEXT_MANAGE.get(board);
@@ -498,15 +506,16 @@ class TextGenerator {
498
506
  .textPlugins;
499
507
  this.textManages = this.texts.map(text => {
500
508
  const textManage = this.createTextManage(text, textPlugins);
501
- setTextManage(this.board, getTextKey(this.element, text), textManage);
509
+ setTextManage(this.board, this.element, text, textManage);
502
510
  return textManage;
503
511
  });
504
- ELEMENT_TO_TEXT_MANAGES.set(this.element, this.textManages);
512
+ const ref = PlaitElement.getElementRef(this.element);
513
+ ref.initializeTextManage(this.textManages);
505
514
  }
506
515
  draw(elementG) {
507
516
  const centerPoint = RectangleClient.getCenterPoint(this.board.getRectangle(this.element));
508
517
  this.texts.forEach(drawShapeText => {
509
- const textManage = getTextManage(this.board, getTextKey(this.element, drawShapeText));
518
+ const textManage = getTextManage(this.board, this.element, drawShapeText);
510
519
  if (drawShapeText.text && textManage) {
511
520
  textManage.draw(drawShapeText.text);
512
521
  elementG.append(textManage.g);
@@ -516,30 +525,29 @@ class TextGenerator {
516
525
  }
517
526
  update(element, previousDrawShapeTexts, currentDrawShapeTexts, elementG) {
518
527
  this.element = element;
519
- ELEMENT_TO_TEXT_MANAGES.set(this.element, this.textManages);
520
528
  const centerPoint = RectangleClient.getCenterPoint(this.board.getRectangle(this.element));
521
529
  const textPlugins = (this.board.getPluginOptions(WithTextPluginKey) || {})
522
530
  .textPlugins;
523
531
  const removedTexts = previousDrawShapeTexts.filter(value => {
524
- return !currentDrawShapeTexts.find(item => item.key === value.key);
532
+ return !currentDrawShapeTexts.find(item => item.id === value.id);
525
533
  });
526
534
  if (removedTexts.length) {
527
535
  removedTexts.forEach(item => {
528
- const textManage = getTextManage(this.board, item.key);
536
+ const textManage = getTextManage(this.board, element, item);
529
537
  const index = this.textManages.findIndex(value => value === textManage);
530
538
  if (index > -1 && item.text && item.textHeight) {
531
539
  this.textManages.splice(index, 1);
532
540
  }
533
541
  textManage?.destroy();
534
- deleteTextManage(this.board, item.key);
542
+ deleteTextManage(this.board, item.id);
535
543
  });
536
544
  }
537
545
  currentDrawShapeTexts.forEach(drawShapeText => {
538
546
  if (drawShapeText.text) {
539
- let textManage = getTextManage(this.board, getTextKey(this.element, drawShapeText));
547
+ let textManage = getTextManage(this.board, this.element, drawShapeText);
540
548
  if (!textManage) {
541
549
  textManage = this.createTextManage(drawShapeText, textPlugins);
542
- setTextManage(this.board, drawShapeText.key, textManage);
550
+ setTextManage(this.board, element, drawShapeText, textManage);
543
551
  textManage.draw(drawShapeText.text);
544
552
  elementG.append(textManage.g);
545
553
  this.textManages.push(textManage);
@@ -581,13 +589,11 @@ class TextGenerator {
581
589
  return this.options.getMaxWidth ? this.options.getMaxWidth() : this.getRectangle(text).width;
582
590
  }
583
591
  destroy() {
584
- this.textManages.forEach(manage => {
585
- manage.destroy();
586
- });
592
+ const ref = PlaitElement.getElementRef(this.element);
593
+ ref.destroyTextManage();
587
594
  this.textManages = [];
588
- ELEMENT_TO_TEXT_MANAGES.delete(this.element);
589
595
  this.texts.forEach(item => {
590
- deleteTextManage(this.board, item.key);
596
+ deleteTextManage(this.board, item.id);
591
597
  });
592
598
  }
593
599
  }
@@ -708,7 +714,7 @@ function editCell(board, cell) {
708
714
  textManage && textManage.edit();
709
715
  }
710
716
  function getTextManageByCell(board, cell) {
711
- return getTextManage(board, cell.id);
717
+ return getTextManage(board, undefined, cell);
712
718
  }
713
719
  const updateColumns = (table, columnId, width, offset) => {
714
720
  const columns = table.columns.map(item => (item.id === columnId ? { ...item, width } : item));
@@ -925,7 +931,7 @@ const buildDefaultTextsByShape = (shape) => {
925
931
  return (textKeys || []).map((textKey) => {
926
932
  const text = defaultTexts?.find((item) => item?.key === textKey);
927
933
  return {
928
- key: textKey,
934
+ id: textKey,
929
935
  text: buildText(text?.text || '', alignment || text?.align || Alignment.center, textProperties),
930
936
  textHeight: textHeight
931
937
  };
@@ -937,7 +943,7 @@ const getHitMultipleGeometryText = (element, point) => {
937
943
  let hitText;
938
944
  if (engine.getTextRectangle) {
939
945
  hitText = element.texts.find(text => {
940
- const textRectangle = engine.getTextRectangle(element, { key: text.key });
946
+ const textRectangle = engine.getTextRectangle(element, { id: text.id });
941
947
  return RectangleClient.isHit(rectangle, textRectangle);
942
948
  });
943
949
  }
@@ -967,12 +973,6 @@ class VectorLineShapeGenerator extends Generator {
967
973
  }
968
974
  }
969
975
 
970
- const isClosedVectorLine = (vectorLine) => {
971
- const points = vectorLine.points;
972
- const startPoint = points[0];
973
- const endPoint = points[points.length - 1];
974
- return startPoint[0] === endPoint[0] && startPoint[1] === endPoint[1];
975
- };
976
976
  const getVectorLinePoints = (board, element) => {
977
977
  switch (element.shape) {
978
978
  case VectorLineShape.straight: {
@@ -1055,7 +1055,7 @@ const isHitArrowLine = (board, element, point) => {
1055
1055
  };
1056
1056
  const isHitVectorLine = (board, element, point) => {
1057
1057
  const points = getVectorLinePoints(board, element);
1058
- if (isClosedVectorLine(element)) {
1058
+ if (isClosedPoints(element.points)) {
1059
1059
  return isPointInPolygon(point, points) || isHitPolyLine(points, point);
1060
1060
  }
1061
1061
  else {
@@ -1067,15 +1067,13 @@ const isRectangleHitElementText = (element, rectangle) => {
1067
1067
  if (isMultipleTextGeometry(element)) {
1068
1068
  const texts = element.texts;
1069
1069
  return texts.some(item => {
1070
- const textClient = engine.getTextRectangle(element, { key: item.key });
1071
- const rotatedCornerPoints = rotatePointsByElement(RectangleClient.getCornerPoints(textClient), element) || RectangleClient.getCornerPoints(textClient);
1072
- return isPolylineHitRectangle(rotatedCornerPoints, rectangle);
1070
+ const textClient = engine.getTextRectangle(element, { id: item.id });
1071
+ return isRectangleHitRotatedPoints(rectangle, RectangleClient.getCornerPoints(textClient), element.angle);
1073
1072
  });
1074
1073
  }
1075
1074
  else {
1076
1075
  const textClient = engine.getTextRectangle ? engine.getTextRectangle(element) : getTextRectangle(element);
1077
- const rotatedCornerPoints = rotatePointsByElement(RectangleClient.getCornerPoints(textClient), element) || RectangleClient.getCornerPoints(textClient);
1078
- return isPolylineHitRectangle(rotatedCornerPoints, rectangle);
1076
+ return isRectangleHitRotatedPoints(rectangle, RectangleClient.getCornerPoints(textClient), element.angle);
1079
1077
  }
1080
1078
  };
1081
1079
  const isHitElementText = (element, point) => {
@@ -1083,7 +1081,7 @@ const isHitElementText = (element, point) => {
1083
1081
  if (isMultipleTextGeometry(element)) {
1084
1082
  const texts = element.texts;
1085
1083
  return texts.some(item => {
1086
- const textClient = engine.getTextRectangle(element, { key: item.key });
1084
+ const textClient = engine.getTextRectangle(element, { id: item.id });
1087
1085
  return RectangleClient.isPointInRectangle(textClient, point);
1088
1086
  });
1089
1087
  }
@@ -1095,18 +1093,14 @@ const isHitElementText = (element, point) => {
1095
1093
  const isRectangleHitDrawElement = (board, element, selection) => {
1096
1094
  const rangeRectangle = RectangleClient.getRectangleByPoints([selection.anchor, selection.focus]);
1097
1095
  if (PlaitDrawElement.isGeometry(element)) {
1098
- const client = RectangleClient.getRectangleByPoints(element.points);
1099
- let rotatedCornerPoints = rotatePointsByElement(RectangleClient.getCornerPoints(client), element) || RectangleClient.getCornerPoints(client);
1100
- const isHitElement = isPolylineHitRectangle(rotatedCornerPoints, rangeRectangle);
1096
+ const isHitElement = isRectangleHitRotatedElement(board, rangeRectangle, element);
1101
1097
  if (isHitElement) {
1102
1098
  return isHitElement;
1103
1099
  }
1104
1100
  return isRectangleHitElementText(element, rangeRectangle);
1105
1101
  }
1106
1102
  if (PlaitDrawElement.isImage(element)) {
1107
- const client = RectangleClient.getRectangleByPoints(element.points);
1108
- const rotatedCornerPoints = rotatePointsByElement(RectangleClient.getCornerPoints(client), element) || RectangleClient.getCornerPoints(client);
1109
- return isPolylineHitRectangle(rotatedCornerPoints, rangeRectangle);
1103
+ return isRectangleHitRotatedElement(board, rangeRectangle, element);
1110
1104
  }
1111
1105
  if (PlaitDrawElement.isArrowLine(element)) {
1112
1106
  const points = getArrowLinePoints(board, element);
@@ -1118,7 +1112,15 @@ const isRectangleHitDrawElement = (board, element, selection) => {
1118
1112
  }
1119
1113
  return null;
1120
1114
  };
1121
- const getDrawHitElement = (board, elements) => {
1115
+ const isRectangleHitRotatedElement = (board, rectangle, element) => {
1116
+ const client = RectangleClient.getRectangleByPoints(element.points);
1117
+ return isRectangleHitRotatedPoints(rectangle, RectangleClient.getCornerPoints(client), element.angle);
1118
+ };
1119
+ const isRectangleHitRotatedPoints = (rectangle, points, angle) => {
1120
+ let rotatedPoints = rotatePointsByAngle(points, angle) || points;
1121
+ return isPolylineHitRectangle(rotatedPoints, rectangle);
1122
+ };
1123
+ const getHitDrawElement = (board, elements) => {
1122
1124
  let firstFilledElement = getFirstFilledDrawElement(board, elements);
1123
1125
  let endIndex = elements.length;
1124
1126
  if (firstFilledElement) {
@@ -1136,7 +1138,7 @@ const getFirstFilledDrawElement = (board, elements) => {
1136
1138
  let filledElement = null;
1137
1139
  for (let i = 0; i < elements.length; i++) {
1138
1140
  const element = elements[i];
1139
- if (isDrawElementClosed(element)) {
1141
+ if (isCustomGeometryClosed(board, element) || isDrawElementClosed(element)) {
1140
1142
  const fill = getFillByElement(board, element);
1141
1143
  if (isFilled(fill)) {
1142
1144
  filledElement = element;
@@ -1277,13 +1279,16 @@ const isDrawElementClosed = (element) => {
1277
1279
  return false;
1278
1280
  }
1279
1281
  if (PlaitDrawElement.isVectorLine(element)) {
1280
- return isClosedVectorLine(element);
1282
+ return isClosedPoints(element.points);
1281
1283
  }
1282
1284
  if (PlaitDrawElement.isGeometry(element)) {
1283
1285
  return isGeometryClosed(element);
1284
1286
  }
1285
1287
  return true;
1286
1288
  };
1289
+ const isCustomGeometryClosed = (board, value) => {
1290
+ return PlaitDrawElement.isCustomGeometryElement(board, value) && isClosedPoints(value.points);
1291
+ };
1287
1292
  const getSnappingShape = (board, point) => {
1288
1293
  let hitElement = getHitShape(board, point);
1289
1294
  if (hitElement) {
@@ -1325,7 +1330,7 @@ const drawBoundReaction = (board, element, roughOptions = { hasMask: true, hasCo
1325
1330
  const rectangle = RectangleClient.getRectangleByPoints(element.points);
1326
1331
  const activeRectangle = RectangleClient.inflate(rectangle, SNAPPING_STROKE_WIDTH);
1327
1332
  const shape = getElementShape(element);
1328
- let drawOptions = {};
1333
+ let drawOptions;
1329
1334
  if (PlaitDrawElement.isElementByTable(element)) {
1330
1335
  drawOptions = { element };
1331
1336
  }
@@ -1358,16 +1363,16 @@ const drawBoundReaction = (board, element, roughOptions = { hasMask: true, hasCo
1358
1363
  return g;
1359
1364
  };
1360
1365
  const getTextKey = (element, text) => {
1361
- if (isMultipleTextGeometry(element)) {
1362
- return `${element.id}-${text.key}`;
1366
+ if (element && isMultipleTextGeometry(element)) {
1367
+ return `${element.id}-${text.id}`;
1363
1368
  }
1364
1369
  else {
1365
- return text.key;
1370
+ return text.id;
1366
1371
  }
1367
1372
  };
1368
1373
  const getGeometryAlign = (board, element) => {
1369
1374
  if (isMultipleTextGeometry(element)) {
1370
- const drawShapeText = element.texts.find(item => item.key.includes(MultipleTextGeometryCommonTextKeys.content));
1375
+ const drawShapeText = element.texts.find(item => item.id.includes(GeometryCommonTextKeys.content));
1371
1376
  return drawShapeText?.text.align || Alignment.center;
1372
1377
  }
1373
1378
  if (isSingleTextGeometry(element)) {
@@ -1379,6 +1384,11 @@ const getGeometryAlign = (board, element) => {
1379
1384
  }
1380
1385
  return Alignment.center;
1381
1386
  };
1387
+ const isClosedPoints = (points) => {
1388
+ const startPoint = points[0];
1389
+ const endPoint = points[points.length - 1];
1390
+ return startPoint[0] === endPoint[0] && startPoint[1] === endPoint[1];
1391
+ };
1382
1392
 
1383
1393
  const getStrokeColorByElement = (board, element) => {
1384
1394
  const defaultColor = getDrawDefaultStrokeColor(board.theme.themeColorMode);
@@ -1386,8 +1396,8 @@ const getStrokeColorByElement = (board, element) => {
1386
1396
  return strokeColor;
1387
1397
  };
1388
1398
  const getFillByElement = (board, element) => {
1389
- const defaultFill = PlaitDrawElement.isFlowchart(element) && isDrawElementClosed(element)
1390
- ? getFlowchartDefaultFill(board.theme.themeColorMode)
1399
+ const defaultFill = isDrawElementClosed(element) || isCustomGeometryClosed(board, element)
1400
+ ? getDefaultFill(board.theme.themeColorMode)
1391
1401
  : DefaultDrawStyle.fill;
1392
1402
  const fill = element.fill || defaultFill;
1393
1403
  return fill;
@@ -2245,7 +2255,7 @@ const getHitIndexOfAutoCompletePoint = (movingPoint, points) => {
2245
2255
  const getDrawDefaultStrokeColor = (theme) => {
2246
2256
  return DrawThemeColors[theme].strokeColor;
2247
2257
  };
2248
- const getFlowchartDefaultFill = (theme) => {
2258
+ const getDefaultFill = (theme) => {
2249
2259
  return DrawThemeColors[theme].fill;
2250
2260
  };
2251
2261
  const getTextShapeProperty = (board, text = DefaultTextProperty.text, fontSize) => {
@@ -2305,7 +2315,7 @@ const createDefaultGeometry = (board, points, shape) => {
2305
2315
  }
2306
2316
  };
2307
2317
  const editText = (board, element, text) => {
2308
- const textManage = text ? getTextManage(board, `${element.id}-${text.key}`) : getFirstTextManage(element);
2318
+ const textManage = text ? getTextManage(board, element, text) : getFirstTextManage(element);
2309
2319
  if (textManage) {
2310
2320
  textManage.edit(() => {
2311
2321
  // delay to avoid blinking
@@ -2450,6 +2460,10 @@ const getSelectedGeometryElements = (board) => {
2450
2460
  const selectedElements = getSelectedElements(board).filter(value => PlaitDrawElement.isGeometry(value));
2451
2461
  return selectedElements;
2452
2462
  };
2463
+ const getSelectedCustomGeometryElements = (board) => {
2464
+ const selectedElements = getSelectedElements(board).filter(value => PlaitDrawElement.isCustomGeometryElement(board, value));
2465
+ return selectedElements;
2466
+ };
2453
2467
  const getSelectedArrowLineElements = (board) => {
2454
2468
  const selectedElements = getSelectedElements(board).filter(value => PlaitDrawElement.isArrowLine(value));
2455
2469
  return selectedElements;
@@ -2466,6 +2480,10 @@ const isSingleSelectSwimlane = (board) => {
2466
2480
  const selectedElements = getSelectedElements(board);
2467
2481
  return selectedElements && selectedElements.length === 1 && PlaitDrawElement.isSwimlane(selectedElements[0]);
2468
2482
  };
2483
+ const isSingleSelectArrowLine = (board) => {
2484
+ const selectedElements = getSelectedElements(board);
2485
+ return selectedElements && selectedElements.length === 1 && PlaitDrawElement.isArrowLine(selectedElements[0]);
2486
+ };
2469
2487
  const getSelectedSwimlane = (board) => {
2470
2488
  const selectedElements = getSelectedElements(board);
2471
2489
  return selectedElements.find(item => PlaitDrawElement.isSwimlane(item));
@@ -2924,9 +2942,9 @@ const updateSwimlane = (board, swimlane, newColumns, newRows, newCells, newPoint
2924
2942
  }, path);
2925
2943
  };
2926
2944
 
2927
- const setDrawShapeText = (board, element, text) => {
2945
+ const setDrawTexts = (board, element, text) => {
2928
2946
  const newTexts = element.texts?.map(item => {
2929
- if (item.key === text.key) {
2947
+ if (item.id === text.id) {
2930
2948
  return { ...item, ...text };
2931
2949
  }
2932
2950
  return item;
@@ -3056,7 +3074,7 @@ const insertDrawByVector = (board, point, shape, vector) => {
3056
3074
 
3057
3075
  const DrawTransforms = {
3058
3076
  setText,
3059
- setDrawShapeText,
3077
+ setDrawTexts,
3060
3078
  insertGeometry,
3061
3079
  resizeGeometry,
3062
3080
  insertText,
@@ -3118,7 +3136,10 @@ function withDrawResize(board) {
3118
3136
  let resizeActivePoints = null;
3119
3137
  const canResize = () => {
3120
3138
  const elements = getSelectedElements(board);
3121
- return elements.length > 1 && elements.every(el => PlaitDrawElement.isDrawElement(el));
3139
+ return (elements.length >= 1 &&
3140
+ elements.every(el => (PlaitDrawElement.isDrawElement(el) || PlaitDrawElement.isCustomGeometryElement(board, el)) &&
3141
+ !isSingleSelectArrowLine(board) &&
3142
+ !isSingleSelectSwimlane(board)));
3122
3143
  };
3123
3144
  const options = {
3124
3145
  key: 'draw-elements',
@@ -3142,7 +3163,7 @@ function withDrawResize(board) {
3142
3163
  snapG?.remove();
3143
3164
  debugGenerator$2.isDebug() && debugGenerator$2.clear();
3144
3165
  const isFromCorner = isCornerHandle(board, resizeRef.handle);
3145
- const isAspectRatio = resizeState.isShift || isFromCorner;
3166
+ const isAspectRatio = resizeState.isShift || (resizeRef.element.length === 1 && PlaitDrawElement.isImage(resizeRef.element[0]));
3146
3167
  const centerPoint = RectangleClient.getCenterPoint(resizeRef.rectangle);
3147
3168
  const handleIndex = getIndexByResizeHandle(resizeRef.handle);
3148
3169
  const { originPoint, handlePoint } = getResizeOriginPointAndHandlePoint(board, handleIndex, resizeRef.rectangle);
@@ -3212,7 +3233,7 @@ function withDrawResize(board) {
3212
3233
  }
3213
3234
  }
3214
3235
  if (PlaitDrawElement.isGeometry(target)) {
3215
- if (isGeometryIncludeText(target)) {
3236
+ if (PlaitDrawElement.isGeometry(target) && isGeometryIncludeText(target)) {
3216
3237
  const { height: textHeight } = getFirstTextManage(target).getSize();
3217
3238
  DrawTransforms.resizeGeometry(board, points, textHeight, path);
3218
3239
  }
@@ -3221,7 +3242,9 @@ function withDrawResize(board) {
3221
3242
  Transforms.setNode(board, { points }, path);
3222
3243
  }
3223
3244
  }
3224
- else if (PlaitDrawElement.isArrowLine(target)) {
3245
+ else if (PlaitDrawElement.isLine(target) ||
3246
+ PlaitDrawElement.isCustomGeometryElement(board, target) ||
3247
+ PlaitDrawElement.isVectorLine(target)) {
3225
3248
  Transforms.setNode(board, { points }, path);
3226
3249
  }
3227
3250
  else if (PlaitDrawElement.isImage(target)) {
@@ -3600,6 +3623,56 @@ function getMiddlePoints(board, element) {
3600
3623
  return result;
3601
3624
  }
3602
3625
 
3626
+ const buildClipboardData = (board, elements, startPoint) => {
3627
+ return buildClipboardData$1(board, elements, startPoint, (element) => {
3628
+ if (PlaitDrawElement.isArrowLine(element)) {
3629
+ let source = { ...element.source };
3630
+ let target = { ...element.target };
3631
+ let points = [...element.points];
3632
+ if (element.source.boundId) {
3633
+ points[0] = getConnectionPoint(getElementById(board, element.source.boundId), element.source.connection);
3634
+ if (!getElementById(board, element.source.boundId, elements)) {
3635
+ delete source.boundId;
3636
+ delete source.connection;
3637
+ }
3638
+ }
3639
+ if (element.target.boundId) {
3640
+ points[points.length - 1] = getConnectionPoint(getElementById(board, element.target.boundId), element.target.connection);
3641
+ if (!getElementById(board, element.target.boundId, elements)) {
3642
+ delete target.boundId;
3643
+ delete target.connection;
3644
+ }
3645
+ }
3646
+ points = points.map(point => [point[0] - startPoint[0], point[1] - startPoint[1]]);
3647
+ return { ...element, points, source, target };
3648
+ }
3649
+ return undefined;
3650
+ });
3651
+ };
3652
+ const insertClipboardData = (board, elements, startPoint) => {
3653
+ insertClipboardData$1(board, elements, startPoint, (element, idsMap) => {
3654
+ if (PlaitDrawElement.isArrowLine(element)) {
3655
+ if (element.source.boundId) {
3656
+ const boundElement = elements.find(item => [element.source.boundId, idsMap[element.source.boundId]].includes(item.id));
3657
+ if (boundElement) {
3658
+ element.source.boundId = idsMap[element.source.boundId];
3659
+ }
3660
+ }
3661
+ if (element.target.boundId) {
3662
+ const boundElement = elements.find(item => [element.target.boundId, idsMap[element.target.boundId]].includes(item.id));
3663
+ if (boundElement) {
3664
+ element.target.boundId = idsMap[element.target.boundId];
3665
+ }
3666
+ }
3667
+ }
3668
+ if (PlaitDrawElement.isElementByTable(element)) {
3669
+ updateRowOrColumnIds(element, 'row');
3670
+ updateRowOrColumnIds(element, 'column');
3671
+ updateCellIds(element.cells);
3672
+ }
3673
+ });
3674
+ };
3675
+
3603
3676
  const getCenterPointsOnPolygon = (points) => {
3604
3677
  const centerPoints = [];
3605
3678
  for (let i = 0; i < points.length; i++) {
@@ -5411,8 +5484,8 @@ const TableEngine = {
5411
5484
  },
5412
5485
  getTextRectangle(element, options) {
5413
5486
  try {
5414
- if (options && options.key) {
5415
- const cell = getCellWithPoints(options?.board, element, options.key);
5487
+ if (options && options.id) {
5488
+ const cell = getCellWithPoints(options?.board, element, options.id);
5416
5489
  if (cell) {
5417
5490
  if (PlaitTableElement.isVerticalText(cell)) {
5418
5491
  return getVerticalTextRectangle(cell);
@@ -5643,8 +5716,8 @@ const PackageEngine = {
5643
5716
  getTextRectangle(element, options) {
5644
5717
  const elementRectangle = RectangleClient.getRectangleByPoints(element.points);
5645
5718
  const strokeWidth = getStrokeWidthByElement(element);
5646
- const textHeight = element.texts?.find(item => item.key === options?.key)?.textHeight;
5647
- if (options?.key === MultipleTextGeometryCommonTextKeys.name) {
5719
+ const textHeight = element.texts?.find(item => item.id === options?.id)?.textHeight;
5720
+ if (options?.id === GeometryCommonTextKeys.name) {
5648
5721
  const width = elementRectangle.width * 0.7 - ShapeDefaultSpace.rectangleAndText - strokeWidth;
5649
5722
  return {
5650
5723
  height: textHeight,
@@ -5653,7 +5726,7 @@ const PackageEngine = {
5653
5726
  y: elementRectangle.y + (25 - textHeight) / 2
5654
5727
  };
5655
5728
  }
5656
- if (options?.key === MultipleTextGeometryCommonTextKeys.content) {
5729
+ if (options?.id === GeometryCommonTextKeys.content) {
5657
5730
  const width = elementRectangle.width - ShapeDefaultSpace.rectangleAndText * 2 - strokeWidth * 2;
5658
5731
  return {
5659
5732
  height: textHeight,
@@ -5703,8 +5776,8 @@ const CombinedFragmentEngine = {
5703
5776
  getTextRectangle(element, options) {
5704
5777
  const elementRectangle = RectangleClient.getRectangleByPoints(element.points);
5705
5778
  const strokeWidth = getStrokeWidthByElement(element);
5706
- const textHeight = element.texts?.find(item => item.key === options?.key)?.textHeight;
5707
- if (options?.key === MultipleTextGeometryCommonTextKeys.name) {
5779
+ const textHeight = element.texts?.find(item => item.id === options?.id)?.textHeight;
5780
+ if (options?.id === GeometryCommonTextKeys.name) {
5708
5781
  const width = elementRectangle.width / 3 - 8 - ShapeDefaultSpace.rectangleAndText - strokeWidth;
5709
5782
  return {
5710
5783
  height: textHeight,
@@ -5713,7 +5786,7 @@ const CombinedFragmentEngine = {
5713
5786
  y: elementRectangle.y + (25 - textHeight) / 2
5714
5787
  };
5715
5788
  }
5716
- if (options?.key === MultipleTextGeometryCommonTextKeys.content) {
5789
+ if (options?.id === GeometryCommonTextKeys.content) {
5717
5790
  const width = elementRectangle.width - ShapeDefaultSpace.rectangleAndText * 2 - strokeWidth * 2;
5718
5791
  return {
5719
5792
  height: textHeight,
@@ -6443,12 +6516,6 @@ const PlaitArrowLine = {
6443
6516
  }
6444
6517
  };
6445
6518
 
6446
- var StrokeStyle;
6447
- (function (StrokeStyle) {
6448
- StrokeStyle["solid"] = "solid";
6449
- StrokeStyle["dashed"] = "dashed";
6450
- StrokeStyle["dotted"] = "dotted";
6451
- })(StrokeStyle || (StrokeStyle = {}));
6452
6519
  var MemorizeKey;
6453
6520
  (function (MemorizeKey) {
6454
6521
  MemorizeKey["basicShape"] = "basicShape";
@@ -6458,10 +6525,10 @@ var MemorizeKey;
6458
6525
  MemorizeKey["UML"] = "UML";
6459
6526
  })(MemorizeKey || (MemorizeKey = {}));
6460
6527
 
6461
- var VectorPenPointerType;
6462
- (function (VectorPenPointerType) {
6463
- VectorPenPointerType["vectorPen"] = "vectorPen";
6464
- })(VectorPenPointerType || (VectorPenPointerType = {}));
6528
+ var VectorLinePointerType;
6529
+ (function (VectorLinePointerType) {
6530
+ VectorLinePointerType["vectorLine"] = "vectorLine";
6531
+ })(VectorLinePointerType || (VectorLinePointerType = {}));
6465
6532
  var VectorLineShape;
6466
6533
  (function (VectorLineShape) {
6467
6534
  VectorLineShape["straight"] = "straight";
@@ -6502,6 +6569,16 @@ const PlaitDrawElement = {
6502
6569
  return false;
6503
6570
  }
6504
6571
  },
6572
+ isCustomGeometryElement: (board, value) => {
6573
+ const options = board.getPluginOptions(WithDrawPluginKey);
6574
+ const customGeometryTypes = options?.customGeometryTypes || [];
6575
+ if (customGeometryTypes.includes(value.type)) {
6576
+ return true;
6577
+ }
6578
+ else {
6579
+ return false;
6580
+ }
6581
+ },
6505
6582
  isShapeElement: (value) => {
6506
6583
  return (PlaitDrawElement.isImage(value) ||
6507
6584
  PlaitDrawElement.isGeometry(value) ||
@@ -6608,11 +6685,11 @@ class SingleTextGenerator extends TextGenerator {
6608
6685
  return this.textManages[0];
6609
6686
  }
6610
6687
  constructor(board, element, text, options) {
6611
- super(board, element, [{ key: element.id, text: text, textHeight: element.textHeight }], options);
6688
+ super(board, element, [{ id: element.id, text: text, textHeight: element.textHeight }], options);
6612
6689
  }
6613
6690
  update(element, previousText, currentText, elementG) {
6614
6691
  if (!isMultipleTextGeometry(element)) {
6615
- super.update(element, [{ text: previousText, key: element.id, textHeight: element.textHeight }], [{ text: currentText, key: element.id, textHeight: element.textHeight }], elementG);
6692
+ super.update(element, [{ text: previousText, id: element.id, textHeight: element.textHeight }], [{ text: currentText, id: element.id, textHeight: element.textHeight }], elementG);
6616
6693
  }
6617
6694
  }
6618
6695
  }
@@ -6669,8 +6746,7 @@ class GeometryComponent extends CommonElementFlavour {
6669
6746
  this.textGenerator && this.textGenerator.draw(this.getElementG());
6670
6747
  }
6671
6748
  onContextChanged(value, previous) {
6672
- const isChangeTheme = this.board.operations.find(op => op.type === 'set_theme');
6673
- if (value.element !== previous.element || isChangeTheme) {
6749
+ if (value.element !== previous.element || value.hasThemeChanged) {
6674
6750
  this.shapeGenerator.processDrawing(this.element, this.getElementG());
6675
6751
  this.activeGenerator.processDrawing(this.element, PlaitBoard.getElementActiveHost(this.board), { selected: this.selected });
6676
6752
  this.lineAutoCompleteGenerator.processDrawing(this.element, PlaitBoard.getElementActiveHost(this.board), {
@@ -6701,8 +6777,8 @@ class GeometryComponent extends CommonElementFlavour {
6701
6777
  const onTextChange = (element, textManageChangeData, text) => {
6702
6778
  if (textManageChangeData.newText) {
6703
6779
  if (isMultipleTextGeometry(element)) {
6704
- DrawTransforms.setDrawShapeText(this.board, element, {
6705
- key: text.key,
6780
+ DrawTransforms.setDrawTexts(this.board, element, {
6781
+ id: text.id,
6706
6782
  text: textManageChangeData.newText,
6707
6783
  textHeight: textManageChangeData.height
6708
6784
  });
@@ -6873,7 +6949,7 @@ class ArrowLineComponent extends CommonElementFlavour {
6873
6949
  initializeGenerator() {
6874
6950
  this.shapeGenerator = new ArrowLineShapeGenerator(this.board);
6875
6951
  this.activeGenerator = new LineActiveGenerator(this.board);
6876
- this.initializeTextManagesByElement();
6952
+ this.initializeTextManages();
6877
6953
  }
6878
6954
  initialize() {
6879
6955
  this.initializeGenerator();
@@ -6905,13 +6981,11 @@ class ArrowLineComponent extends CommonElementFlavour {
6905
6981
  return boundedElements;
6906
6982
  }
6907
6983
  onContextChanged(value, previous) {
6908
- this.initializeWeakMap();
6909
6984
  const boundedElements = this.getBoundedElements();
6910
6985
  const isBoundedElementsChanged = boundedElements.source !== this.boundedElements.source || boundedElements.target !== this.boundedElements.target;
6911
6986
  this.boundedElements = boundedElements;
6912
- const isChangeTheme = this.board.operations.find(op => op.type === 'set_theme');
6913
6987
  const linePoints = getArrowLinePoints(this.board, this.element);
6914
- if (value.element !== previous.element || isChangeTheme) {
6988
+ if (value.element !== previous.element || value.hasThemeChanged) {
6915
6989
  this.shapeGenerator.processDrawing(this.element, this.getElementG());
6916
6990
  this.activeGenerator.processDrawing(this.element, PlaitBoard.getElementActiveHost(this.board), {
6917
6991
  selected: this.selected,
@@ -6939,19 +7013,21 @@ class ArrowLineComponent extends CommonElementFlavour {
6939
7013
  return;
6940
7014
  }
6941
7015
  }
6942
- initializeTextManagesByElement() {
7016
+ initializeTextManages() {
6943
7017
  if (this.element.texts?.length) {
6944
7018
  const textManages = [];
6945
7019
  this.element.texts.forEach((text, index) => {
6946
7020
  const manage = this.createTextManage(text, index);
6947
7021
  textManages.push(manage);
6948
7022
  });
6949
- this.initializeTextManages(textManages);
7023
+ this.getRef().initializeTextManage(textManages);
6950
7024
  }
6951
7025
  }
6952
7026
  drawText() {
6953
7027
  if (this.element.texts?.length) {
6954
- this.getTextManages().forEach((manage, index) => {
7028
+ this.getRef()
7029
+ .getTextManages()
7030
+ .forEach((manage, index) => {
6955
7031
  manage.draw(this.element.texts[index].text);
6956
7032
  this.getElementG().append(manage.g);
6957
7033
  });
@@ -6985,7 +7061,7 @@ class ArrowLineComponent extends CommonElementFlavour {
6985
7061
  return;
6986
7062
  const previousTextsLength = previousTexts.length;
6987
7063
  const currentTextsLength = currentTexts.length;
6988
- const textManages = this.getTextManages();
7064
+ const textManages = this.getRef().getTextManages();
6989
7065
  if (currentTextsLength === previousTextsLength) {
6990
7066
  for (let i = 0; i < previousTextsLength; i++) {
6991
7067
  if (previousTexts[i].text !== currentTexts[i].text) {
@@ -6994,13 +7070,13 @@ class ArrowLineComponent extends CommonElementFlavour {
6994
7070
  }
6995
7071
  }
6996
7072
  else {
6997
- this.destroyTextManages();
6998
- this.initializeTextManagesByElement();
7073
+ this.getRef().destroyTextManage();
7074
+ this.initializeTextManages();
6999
7075
  this.drawText();
7000
7076
  }
7001
7077
  }
7002
7078
  updateTextRectangle() {
7003
- const textManages = this.getTextManages();
7079
+ const textManages = this.getRef().getTextManages();
7004
7080
  textManages.forEach(manage => {
7005
7081
  manage.updateRectangle();
7006
7082
  });
@@ -7008,7 +7084,7 @@ class ArrowLineComponent extends CommonElementFlavour {
7008
7084
  destroy() {
7009
7085
  super.destroy();
7010
7086
  this.activeGenerator.destroy();
7011
- this.destroyTextManages();
7087
+ this.getRef().destroyTextManage();
7012
7088
  }
7013
7089
  }
7014
7090
 
@@ -7031,10 +7107,8 @@ class VectorLineComponent extends CommonElementFlavour {
7031
7107
  super.initialize();
7032
7108
  }
7033
7109
  onContextChanged(value, previous) {
7034
- this.initializeWeakMap();
7035
- const isChangeTheme = this.board.operations.find(op => op.type === 'set_theme');
7036
7110
  const linePoints = getVectorLinePoints(this.board, this.element);
7037
- if (value.element !== previous.element || isChangeTheme) {
7111
+ if (value.element !== previous.element || value.hasThemeChanged) {
7038
7112
  this.shapeGenerator.processDrawing(this.element, this.getElementG());
7039
7113
  this.activeGenerator.processDrawing(this.element, PlaitBoard.getElementActiveHost(this.board), {
7040
7114
  selected: this.selected,
@@ -7083,7 +7157,7 @@ const withDrawHotkey = (board) => {
7083
7157
  if (hitElement && PlaitDrawElement.isGeometry(hitElement)) {
7084
7158
  if (isMultipleTextGeometry(hitElement)) {
7085
7159
  const hitText = getHitMultipleGeometryText(hitElement, point) ||
7086
- hitElement.texts.find(item => item.key.includes(MultipleTextGeometryCommonTextKeys.content)) ||
7160
+ hitElement.texts.find(item => item.id.includes(GeometryCommonTextKeys.content)) ||
7087
7161
  hitElement.texts[0];
7088
7162
  editText(board, hitElement, hitText);
7089
7163
  }
@@ -7290,68 +7364,6 @@ const withGeometryCreateByDrawing = (board) => {
7290
7364
  return board;
7291
7365
  };
7292
7366
 
7293
- const buildClipboardData = (board, elements, startPoint) => {
7294
- return elements.map(element => {
7295
- if (PlaitDrawElement.isShapeElement(element)) {
7296
- const points = element.points.map(point => [point[0] - startPoint[0], point[1] - startPoint[1]]);
7297
- return { ...element, points };
7298
- }
7299
- if (PlaitDrawElement.isArrowLine(element)) {
7300
- let source = { ...element.source };
7301
- let target = { ...element.target };
7302
- let points = [...element.points];
7303
- if (element.source.boundId) {
7304
- points[0] = getConnectionPoint(getElementById(board, element.source.boundId), element.source.connection);
7305
- if (!getElementById(board, element.source.boundId, elements)) {
7306
- delete source.boundId;
7307
- delete source.connection;
7308
- }
7309
- }
7310
- if (element.target.boundId) {
7311
- points[points.length - 1] = getConnectionPoint(getElementById(board, element.target.boundId), element.target.connection);
7312
- if (!getElementById(board, element.target.boundId, elements)) {
7313
- delete target.boundId;
7314
- delete target.connection;
7315
- }
7316
- }
7317
- points = points.map(point => [point[0] - startPoint[0], point[1] - startPoint[1]]);
7318
- return { ...element, points, source, target };
7319
- }
7320
- return element;
7321
- });
7322
- };
7323
- const insertClipboardData = (board, elements, startPoint) => {
7324
- const idsMap = {};
7325
- elements.forEach(element => {
7326
- idsMap[element.id] = idCreator();
7327
- });
7328
- elements.forEach(element => {
7329
- element.id = idsMap[element.id];
7330
- if (PlaitDrawElement.isArrowLine(element)) {
7331
- if (element.source.boundId) {
7332
- const boundElement = elements.find(item => [element.source.boundId, idsMap[element.source.boundId]].includes(item.id));
7333
- if (boundElement) {
7334
- element.source.boundId = idsMap[element.source.boundId];
7335
- }
7336
- }
7337
- if (element.target.boundId) {
7338
- const boundElement = elements.find(item => [element.target.boundId, idsMap[element.target.boundId]].includes(item.id));
7339
- if (boundElement) {
7340
- element.target.boundId = idsMap[element.target.boundId];
7341
- }
7342
- }
7343
- }
7344
- if (PlaitDrawElement.isElementByTable(element)) {
7345
- updateRowOrColumnIds(element, 'row');
7346
- updateRowOrColumnIds(element, 'column');
7347
- updateCellIds(element.cells);
7348
- }
7349
- element.points = element.points.map(point => [startPoint[0] + point[0], startPoint[1] + point[1]]);
7350
- Transforms.insertNode(board, element, [board.children.length]);
7351
- });
7352
- Transforms.addSelectionWithTemporaryElements(board, elements);
7353
- };
7354
-
7355
7367
  const withDrawFragment = (baseBoard) => {
7356
7368
  const board = baseBoard;
7357
7369
  const { getDeletedFragment, buildFragment, insertFragment } = board;
@@ -7394,16 +7406,12 @@ const withDrawFragment = (baseBoard) => {
7394
7406
  const selectedElements = [...targetDrawElements, ...boundLineElements];
7395
7407
  const elements = buildClipboardData(board, selectedElements, rectangle ? [rectangle.x, rectangle.y] : [0, 0]);
7396
7408
  const text = getElementsText(selectedElements);
7397
- if (!clipboardContext) {
7398
- clipboardContext = createClipboardContext(WritableClipboardType.elements, elements, text);
7399
- }
7400
- else {
7401
- clipboardContext = addClipboardContext(clipboardContext, {
7402
- text,
7403
- type: WritableClipboardType.elements,
7404
- elements
7405
- });
7406
- }
7409
+ const addition = {
7410
+ text,
7411
+ type: WritableClipboardType.elements,
7412
+ elements: elements
7413
+ };
7414
+ clipboardContext = addOrCreateClipboardContext(clipboardContext, addition);
7407
7415
  }
7408
7416
  return buildFragment(clipboardContext, rectangle, operationType, originData);
7409
7417
  };
@@ -7492,67 +7500,6 @@ const withArrowLineCreateByDraw = (board) => {
7492
7500
  return board;
7493
7501
  };
7494
7502
 
7495
- const withGeometryResize = (board) => {
7496
- let snapG;
7497
- const options = {
7498
- key: 'draw-geometry',
7499
- canResize: () => {
7500
- return true;
7501
- },
7502
- hitTest: (point) => {
7503
- const selectedElements = [...getSelectedGeometryElements(board), ...getSelectedImageElements(board)];
7504
- if (selectedElements.length !== 1 || getSelectedElements(board).length !== 1) {
7505
- return null;
7506
- }
7507
- const target = selectedElements[0];
7508
- if (canResize(board, target)) {
7509
- const rectangle = board.getRectangle(target);
7510
- const handleRef = getHitRectangleResizeHandleRef(board, rectangle, point, target.angle);
7511
- if (handleRef) {
7512
- return {
7513
- element: target,
7514
- handle: handleRef.handle,
7515
- cursorClass: handleRef.cursorClass,
7516
- rectangle
7517
- };
7518
- }
7519
- }
7520
- return null;
7521
- },
7522
- onResize: (resizeRef, resizeState) => {
7523
- resizeState.startPoint = rotateAntiPointsByElement(resizeState.startPoint, resizeRef.element) || resizeState.startPoint;
7524
- resizeState.endPoint = rotateAntiPointsByElement(resizeState.endPoint, resizeRef.element) || resizeState.endPoint;
7525
- snapG?.remove();
7526
- const isFromCorner = isCornerHandle(board, resizeRef.handle);
7527
- const isAspectRatio = resizeState.isShift || PlaitDrawElement.isImage(resizeRef.element);
7528
- const handleIndex = getIndexByResizeHandle(resizeRef.handle);
7529
- const { originPoint, handlePoint } = getResizeOriginPointAndHandlePoint(board, handleIndex, resizeRef.rectangle);
7530
- const resizeSnapRefOptions = getSnapResizingRefOptions(board, resizeRef, resizeState, {
7531
- originPoint,
7532
- handlePoint
7533
- }, isAspectRatio, isFromCorner);
7534
- const resizeSnapRef = getSnapResizingRef(board, [resizeRef.element], resizeSnapRefOptions);
7535
- snapG = resizeSnapRef.snapG;
7536
- PlaitBoard.getElementActiveHost(board).append(snapG);
7537
- let points = resizeSnapRef.activePoints;
7538
- if (PlaitDrawElement.isGeometry(resizeRef.element) && isGeometryIncludeText(resizeRef.element)) {
7539
- const { height: textHeight } = getFirstTextManage(resizeRef.element).getSize();
7540
- DrawTransforms.resizeGeometry(board, points, textHeight, resizeRef.path);
7541
- }
7542
- else {
7543
- points = normalizeShapePoints(points);
7544
- Transforms.setNode(board, { points }, resizeRef.path);
7545
- }
7546
- },
7547
- afterResize: (resizeRef) => {
7548
- snapG?.remove();
7549
- snapG = null;
7550
- }
7551
- };
7552
- withResize(board, options);
7553
- return board;
7554
- };
7555
-
7556
7503
  const withArrowLineResize = (board) => {
7557
7504
  let elbowLineIndex;
7558
7505
  let elbowLineDeleteCount;
@@ -7766,7 +7713,7 @@ const withArrowLineText = (board) => {
7766
7713
  }
7767
7714
  else {
7768
7715
  const ratio = getRatioByPoint(points, point);
7769
- const textMemory = getMemorizedLatest('line')?.text || {};
7716
+ const textMemory = getMemorizedLatest('arrow-line')?.text || {};
7770
7717
  texts.push({
7771
7718
  text: buildText(LINE_TEXT, undefined, textMemory),
7772
7719
  position: ratio,
@@ -8016,7 +7963,9 @@ const withDrawRotate = (board) => {
8016
7963
  let needCustomActiveRectangle = false;
8017
7964
  const canRotate = () => {
8018
7965
  const elements = getSelectedElements(board);
8019
- return elements.length > 0 && elements.every(el => PlaitDrawElement.isGeometry(el) || PlaitDrawElement.isImage(el));
7966
+ return (elements.length > 0 &&
7967
+ elements.every(el => (PlaitDrawElement.isDrawElement(el) && !PlaitDrawElement.isArrowLine(el)) ||
7968
+ PlaitDrawElement.isCustomGeometryElement(board, el)));
8020
7969
  };
8021
7970
  board.pointerDown = (event) => {
8022
7971
  if (!canRotate() || PlaitBoard.isReadonly(board) || PlaitBoard.hasBeenTextEditing(board) || !isMainPointer(event)) {
@@ -8179,10 +8128,10 @@ class TableComponent extends CommonElementFlavour {
8179
8128
  const table = this.board.buildTable(this.element);
8180
8129
  table.cells.forEach(item => {
8181
8130
  if (PlaitTableElement.isVerticalText(item)) {
8182
- const textManage = getTextManage(this.board, item.id);
8131
+ const textManage = getTextManageByCell(this.board, item);
8183
8132
  if (textManage) {
8184
8133
  const engine = getEngine(TableSymbols.table);
8185
- const rectangle = engine.getTextRectangle(this.element, { key: item.id, board: this.board });
8134
+ const rectangle = engine.getTextRectangle(this.element, { id: item.id, board: this.board });
8186
8135
  textManage.g.classList.add('vertical-cell-text');
8187
8136
  setAngleForG(textManage.g, RectangleClient.getCenterPoint(rectangle), degreesToRadians(-90));
8188
8137
  }
@@ -8194,7 +8143,7 @@ class TableComponent extends CommonElementFlavour {
8194
8143
  .filter(item => isCellIncludeText(item))
8195
8144
  .map(item => {
8196
8145
  return {
8197
- key: item.id,
8146
+ id: item.id,
8198
8147
  text: item.text,
8199
8148
  textHeight: item.textHeight,
8200
8149
  board: this.board
@@ -8207,12 +8156,12 @@ class TableComponent extends CommonElementFlavour {
8207
8156
  onChange: (value, data, text) => {
8208
8157
  const path = PlaitBoard.findPath(this.board, value);
8209
8158
  if (data.newText) {
8210
- DrawTransforms.setTableText(this.board, path, text.key, data.newText, data.height);
8159
+ DrawTransforms.setTableText(this.board, path, text.id, data.newText, data.height);
8211
8160
  }
8212
8161
  data.operations && memorizeLatestText(value, data.operations);
8213
8162
  },
8214
8163
  getRenderRectangle: (value, text) => {
8215
- const cell = getCellWithPoints(this.board, value, text.key);
8164
+ const cell = getCellWithPoints(this.board, value, text.id);
8216
8165
  if (PlaitTableElement.isVerticalText(cell)) {
8217
8166
  const cellRectangle = RectangleClient.getRectangleByPoints(cell.points);
8218
8167
  const strokeWidth = getStrokeWidthByElement(cell);
@@ -8233,8 +8182,7 @@ class TableComponent extends CommonElementFlavour {
8233
8182
  this.textGenerator.initialize();
8234
8183
  }
8235
8184
  onContextChanged(value, previous) {
8236
- const isChangeTheme = this.board.operations.find(op => op.type === 'set_theme');
8237
- if (value.element !== previous.element || isChangeTheme) {
8185
+ if (value.element !== previous.element || value.hasThemeChanged) {
8238
8186
  const previousSelectedCells = getSelectedCells(previous.element);
8239
8187
  if (previousSelectedCells?.length) {
8240
8188
  clearSelectedCells(previous.element);
@@ -8631,57 +8579,57 @@ const withSwimlane = (board) => {
8631
8579
  return withSwimlaneCreateByDrawing(withSwimlaneCreateByDrag(board));
8632
8580
  };
8633
8581
 
8634
- const withVectorPenCreateByDraw = (board) => {
8582
+ const withVectorLineCreateByDraw = (board) => {
8635
8583
  const { pointerDown, pointerMove, dblClick, globalKeyDown } = board;
8636
8584
  let lineShapeG = null;
8637
8585
  let temporaryElement = null;
8638
- let vectorPenRef;
8586
+ let vectorLineRef;
8639
8587
  const vectorLineComplete = () => {
8640
- if (vectorPenRef) {
8588
+ if (vectorLineRef) {
8641
8589
  clearSelectedElement(board);
8642
- if (vectorPenRef?.element) {
8643
- addSelectedElement(board, vectorPenRef?.element);
8590
+ if (vectorLineRef?.element) {
8591
+ addSelectedElement(board, vectorLineRef?.element);
8644
8592
  }
8645
8593
  }
8646
8594
  PlaitBoard.getBoardContainer(board).classList.remove(`vector-line-closed`);
8647
8595
  lineShapeG?.remove();
8648
8596
  lineShapeG = null;
8649
- vectorPenRef = null;
8597
+ vectorLineRef = null;
8650
8598
  temporaryElement = null;
8651
8599
  };
8652
8600
  board.pointerDown = (event) => {
8653
- const penPointers = getVectorPenPointers();
8654
- const isVectorPenPointer = PlaitBoard.isInPointer(board, penPointers);
8655
- if (isVectorPenPointer && !vectorPenRef) {
8656
- vectorPenRef = { shape: VectorLineShape.straight };
8601
+ const penPointers = getVectorLinePointers();
8602
+ const isVectorLinePointer = PlaitBoard.isInPointer(board, penPointers);
8603
+ if (isVectorLinePointer && !vectorLineRef) {
8604
+ vectorLineRef = { shape: VectorLineShape.straight };
8657
8605
  }
8658
- if (!PlaitBoard.isReadonly(board) && vectorPenRef && isDrawingMode(board)) {
8606
+ if (!PlaitBoard.isReadonly(board) && vectorLineRef && isDrawingMode(board)) {
8659
8607
  let point = toViewBoxPoint(board, toHostPoint(board, event.x, event.y));
8660
8608
  if (!temporaryElement) {
8661
- vectorPenRef = {
8662
- ...vectorPenRef,
8609
+ vectorLineRef = {
8610
+ ...vectorLineRef,
8663
8611
  start: point
8664
8612
  };
8665
8613
  }
8666
8614
  else {
8667
- if (!vectorPenRef.element) {
8668
- vectorPenRef.element = temporaryElement;
8669
- Transforms.insertNode(board, vectorPenRef.element, [board.children.length]);
8615
+ if (!vectorLineRef.element) {
8616
+ vectorLineRef.element = temporaryElement;
8617
+ Transforms.insertNode(board, vectorLineRef.element, [board.children.length]);
8670
8618
  }
8671
8619
  else {
8672
- let points = vectorPenRef.element.points;
8673
- const isClosed = distanceBetweenPointAndPoint(...point, ...vectorPenRef.start) <= LINE_HIT_GEOMETRY_BUFFER;
8620
+ let points = vectorLineRef.element.points;
8621
+ const isClosed = distanceBetweenPointAndPoint(...point, ...vectorLineRef.start) <= LINE_HIT_GEOMETRY_BUFFER;
8674
8622
  if (isClosed) {
8675
- point = vectorPenRef.start;
8623
+ point = vectorLineRef.start;
8676
8624
  }
8677
- if (vectorPenRef.path) {
8625
+ if (vectorLineRef.path) {
8678
8626
  const lastPoint = points[points.length - 1];
8679
8627
  const distance = distanceBetweenPointAndPoint(...point, ...lastPoint);
8680
8628
  if (distance > 2) {
8681
- Transforms.setNode(board, { points: [...points, point] }, vectorPenRef.path);
8629
+ Transforms.setNode(board, { points: [...points, point] }, vectorLineRef.path);
8682
8630
  }
8683
8631
  }
8684
- vectorPenRef.element = getElementById(board, vectorPenRef.element.id);
8632
+ vectorLineRef.element = getElementById(board, vectorLineRef.element.id);
8685
8633
  if (isClosed) {
8686
8634
  vectorLineComplete();
8687
8635
  }
@@ -8695,33 +8643,33 @@ const withVectorPenCreateByDraw = (board) => {
8695
8643
  lineShapeG = createG();
8696
8644
  let movingPoint = toViewBoxPoint(board, toHostPoint(board, event.x, event.y));
8697
8645
  const pointer = PlaitBoard.getPointer(board);
8698
- if (pointer !== VectorPenPointerType.vectorPen) {
8646
+ if (pointer !== VectorLinePointerType.vectorLine) {
8699
8647
  vectorLineComplete();
8700
8648
  }
8701
- if (vectorPenRef && vectorPenRef.start) {
8702
- let drawPoints = [vectorPenRef.start];
8703
- if (vectorPenRef.element) {
8704
- drawPoints = [vectorPenRef.start, ...vectorPenRef.element.points];
8705
- const path = PlaitBoard.findPath(board, vectorPenRef.element);
8706
- vectorPenRef.path = path;
8649
+ if (vectorLineRef && vectorLineRef.start) {
8650
+ let drawPoints = [vectorLineRef.start];
8651
+ if (vectorLineRef.element) {
8652
+ drawPoints = [vectorLineRef.start, ...vectorLineRef.element.points];
8653
+ const path = PlaitBoard.findPath(board, vectorLineRef.element);
8654
+ vectorLineRef.path = path;
8707
8655
  }
8708
- const distance = distanceBetweenPointAndPoint(...movingPoint, ...vectorPenRef.start);
8656
+ const distance = distanceBetweenPointAndPoint(...movingPoint, ...vectorLineRef.start);
8709
8657
  if (distance <= LINE_HIT_GEOMETRY_BUFFER) {
8710
- movingPoint = vectorPenRef.start;
8658
+ movingPoint = vectorLineRef.start;
8711
8659
  PlaitBoard.getBoardContainer(board).classList.add(`vector-line-closed`);
8712
8660
  }
8713
8661
  else {
8714
8662
  PlaitBoard.getBoardContainer(board).classList.remove(`vector-line-closed`);
8715
8663
  }
8716
- temporaryElement = vectorLineCreating(board, vectorPenRef.shape, drawPoints, movingPoint, lineShapeG);
8664
+ temporaryElement = vectorLineCreating(board, vectorLineRef.shape, drawPoints, movingPoint, lineShapeG);
8717
8665
  }
8718
8666
  pointerMove(event);
8719
8667
  };
8720
8668
  board.dblClick = (event) => {
8721
8669
  if (!PlaitBoard.isReadonly(board)) {
8722
- if (vectorPenRef) {
8723
- if (vectorPenRef.path) {
8724
- Transforms.setNode(board, { points: vectorPenRef?.element?.points }, vectorPenRef.path);
8670
+ if (vectorLineRef) {
8671
+ if (vectorLineRef.path) {
8672
+ Transforms.setNode(board, { points: vectorLineRef?.element?.points }, vectorLineRef.path);
8725
8673
  }
8726
8674
  vectorLineComplete();
8727
8675
  BoardTransforms.updatePointerType(board, PlaitPointerType.selection);
@@ -8733,9 +8681,9 @@ const withVectorPenCreateByDraw = (board) => {
8733
8681
  if (!PlaitBoard.isReadonly(board)) {
8734
8682
  const isEsc = isKeyHotkey('esc', event);
8735
8683
  const isV = isKeyHotkey('v', event);
8736
- if ((isEsc || isV) && vectorPenRef) {
8737
- if (vectorPenRef.path) {
8738
- Transforms.setNode(board, { points: vectorPenRef.element?.points }, vectorPenRef.path);
8684
+ if ((isEsc || isV) && vectorLineRef) {
8685
+ if (vectorLineRef.path) {
8686
+ Transforms.setNode(board, { points: vectorLineRef.element?.points }, vectorLineRef.path);
8739
8687
  }
8740
8688
  vectorLineComplete();
8741
8689
  if (isV) {
@@ -8777,7 +8725,7 @@ const withVectorLineResize = (board) => {
8777
8725
  let handleIndex = resizeRef.handleIndex;
8778
8726
  if (resizeRef.handle === LineResizeHandle.source || resizeRef.handle === LineResizeHandle.target) {
8779
8727
  points[handleIndex] = resizeState.endPoint;
8780
- if (isClosedVectorLine(resizeRef.element)) {
8728
+ if (isClosedPoints(resizeRef.element.points)) {
8781
8729
  points[points.length - 1] = resizeState.endPoint;
8782
8730
  }
8783
8731
  else {
@@ -8804,7 +8752,7 @@ const withVectorLineResize = (board) => {
8804
8752
  };
8805
8753
 
8806
8754
  const withDraw = (board) => {
8807
- const { drawElement, getRectangle, isRectangleHit, isHit, isInsidePoint, isMovable, isAlign, getRelatedFragment, getHitElement } = board;
8755
+ const { drawElement, getRectangle, isRectangleHit, isHit, isInsidePoint, isMovable, isAlign, getRelatedFragment, getOneHitElement } = board;
8808
8756
  board.drawElement = (context) => {
8809
8757
  if (PlaitDrawElement.isGeometry(context.element)) {
8810
8758
  if (PlaitDrawElement.isUML(context.element)) {
@@ -8860,12 +8808,12 @@ const withDraw = (board) => {
8860
8808
  }
8861
8809
  return isHit(element, point);
8862
8810
  };
8863
- board.getHitElement = elements => {
8864
- const isDrawElements = elements.every(item => PlaitDrawElement.isDrawElement(item));
8865
- if (isDrawElements) {
8866
- return getDrawHitElement(board, elements);
8811
+ board.getOneHitElement = elements => {
8812
+ const isAllDrawElements = elements.every(item => PlaitDrawElement.isDrawElement(item));
8813
+ if (isAllDrawElements) {
8814
+ return getHitDrawElement(board, elements);
8867
8815
  }
8868
- return getHitElement(elements);
8816
+ return getOneHitElement(elements);
8869
8817
  };
8870
8818
  board.isInsidePoint = (element, point) => {
8871
8819
  const result = isHitElementInside(board, element, point);
@@ -8919,12 +8867,12 @@ const withDraw = (board) => {
8919
8867
  });
8920
8868
  return getRelatedFragment([...elements, ...activeLines], originData);
8921
8869
  };
8922
- return withSwimlane(withTable(withDrawResize(withVectorPenCreateByDraw(withArrowLineAutoCompleteReaction(withArrowLineBoundReaction(withVectorLineResize(withArrowLineResize(withArrowLineTextMove(withArrowLineText(withGeometryResize(withDrawRotate(withArrowLineCreateByDraw(withArrowLineAutoComplete(withGeometryCreateByDrag(withGeometryCreateByDrawing(withDrawFragment(withDrawHotkey(board))))))))))))))))));
8870
+ return withSwimlane(withTable(withDrawResize(withVectorLineCreateByDraw(withArrowLineAutoCompleteReaction(withArrowLineBoundReaction(withVectorLineResize(withArrowLineResize(withArrowLineTextMove(withArrowLineText(withDrawRotate(withArrowLineCreateByDraw(withArrowLineAutoComplete(withGeometryCreateByDrag(withGeometryCreateByDrawing(withDrawFragment(withDrawHotkey(board)))))))))))))))));
8923
8871
  };
8924
8872
 
8925
8873
  /**
8926
8874
  * Generated bundle index. Do not edit.
8927
8875
  */
8928
8876
 
8929
- export { ArrowLineAutoCompleteGenerator, ArrowLineComponent, ArrowLineHandleKey, ArrowLineMarkerType, ArrowLineShape, BasicShapes, DEFAULT_IMAGE_WIDTH, DefaultActivationProperty, DefaultActorProperty, DefaultArrowProperty, DefaultAssemblyProperty, DefaultBasicShapeProperty, DefaultBasicShapePropertyMap, DefaultClassProperty, DefaultCloudProperty, DefaultCombinedFragmentProperty, DefaultComponentBoxProperty, DefaultConnectorProperty, DefaultContainerProperty, DefaultDataBaseProperty, DefaultDataProperty, DefaultDecisionProperty, DefaultDeletionProperty, DefaultDocumentProperty, DefaultDrawActiveStyle, DefaultDrawStyle, DefaultFlowchartProperty, DefaultFlowchartPropertyMap, DefaultInterfaceProperty, DefaultInternalStorageProperty, DefaultManualInputProperty, DefaultMergeProperty, DefaultMultiDocumentProperty, DefaultNoteProperty, DefaultObjectProperty, DefaultPackageProperty, DefaultPentagonArrowProperty, DefaultPortProperty, DefaultProvidedInterfaceProperty, DefaultRequiredInterfaceProperty, DefaultSwimlaneHorizontalProperty, DefaultSwimlaneHorizontalWithHeaderProperty, DefaultSwimlanePropertyMap, DefaultSwimlaneVerticalProperty, DefaultSwimlaneVerticalWithHeaderProperty, DefaultTextProperty, DefaultTwoWayArrowProperty, DefaultUMLPropertyMap, DrawThemeColors, DrawTransforms, FlowchartSymbols, GEOMETRY_NOT_CLOSED, GEOMETRY_WITHOUT_TEXT, GEOMETRY_WITH_MULTIPLE_TEXT, GeometryComponent, GeometryShapeGenerator, GeometryThreshold, KEY_TO_TEXT_MANAGE, LINE_HIT_GEOMETRY_BUFFER, LINE_SNAPPING_BUFFER, LINE_SNAPPING_CONNECTOR_BUFFER, LineActiveGenerator, MIN_TEXT_WIDTH, MemorizeKey, MultipleTextGeometryCommonTextKeys, MultipleTextGeometryTextKeys, PlaitArrowLine, PlaitDrawElement, PlaitGeometry, PlaitTableElement, Q2C, SELECTED_CELLS, SWIMLANE_HEADER_SIZE, ShapeDefaultSpace, SingleTextGenerator, StrokeStyle, SwimlaneDrawSymbols, SwimlaneSymbols, TableGenerator, TableSymbols, TextGenerator, UMLSymbols, VectorLineComponent, VectorLineShape, VectorPenPointerType, WithArrowLineAutoCompletePluginKey, adjustSwimlaneShape, alignElbowSegment, alignPoints, buildDefaultTextsByShape, buildSwimlaneTable, clearSelectedCells, collectArrowLineUpdatedRefsByGeometry, createArrowLineElement, createCell, createDefaultCells, createDefaultFlowchart, createDefaultGeometry, createDefaultRowsOrColumns, createDefaultSwimlane, createGeometryElement, createGeometryElementWithText, createGeometryElementWithoutText, createMultipleTextGeometryElement, createTextElement, createUMLClassOrInterfaceGeometryElement, createVectorLineElement, debugGenerator$1 as debugGenerator, deleteTextManage, drawArrowLine, drawArrowLineArrow, drawBoundReaction, drawGeometry, drawShape, drawVectorLine, editCell, editText, getArrowLineHandleRefPair, getArrowLinePointers, getArrowLinePoints, getArrowLineTextRectangle, getArrowLines, getAutoCompletePoints, getBasicPointers, getCellWithPoints, getCellsRectangle, getCellsWithPoints, getCenterPointsOnPolygon$1 as getCenterPointsOnPolygon, getConnectionPoint, getCurvePoints, getDefaultBasicShapeProperty, getDefaultFlowchartProperty, getDefaultGeometryPoints, getDefaultGeometryProperty, getDefaultSwimlanePoints, getDefaultTextPoints, getDefaultUMLProperty, getDrawDefaultStrokeColor, getDrawHitElement, getElbowLineRouteOptions, getElbowPoints, getFillByElement, getFirstFilledDrawElement, getFirstTextOrLineElement, getFlowchartDefaultFill, getFlowchartPointers, getGeometryAlign, getGeometryPointers, getHitCell, getHitConnection, getHitConnectorPoint, getHitIndexOfAutoCompletePoint, getHitMultipleGeometryText, getHitShape, getIndexAndDeleteCountByKeyPoint, getLineMemorizedLatest, getMemorizeKey, getMemorizedLatestByPointer, getMemorizedLatestShape, getMidKeyPoints, getMiddlePoints, getMirrorDataPoints, getMultipleTextGeometryTextKeys, getNearestPoint, getNextRenderPoints, getNextSourceAndTargetPoints, getResizedPreviousAndNextPoint, getSelectedArrowLineElements, getSelectedCells, getSelectedDrawElements, getSelectedGeometryElements, getSelectedImageElements, getSelectedSwimlane, getSelectedTableCellsEditor, getSelectedTableElements, getSelectedVectorLineElements, getSnapResizingRef, getSnapResizingRefOptions, getSnappingRef, getSnappingShape, getSourceAndTargetRectangle, getStrokeColorByElement, getStrokeStyleByElement, getStrokeWidthByElement, getSwimlaneCount, getSwimlanePointers, getTextKey, getTextManage, getTextManageByCell, getTextRectangle, getTextShapeProperty, getUMLPointers, getVectorByConnection, getVectorLinePoints, getVectorPenPointers, handleArrowLineCreating, hasIllegalElbowPoint, insertElement, isCellIncludeText, isClosedVectorLine, isDrawElementClosed, isDrawElementIncludeText, isDrawElementsIncludeText, isGeometryClosed, isGeometryIncludeText, isHitArrowLine, isHitArrowLineText, isHitDrawElement, isHitEdgeOfShape, isHitElementInside, isHitElementText, isHitPolyLine, isHitVectorLine, isInsideOfShape, isMultipleTextGeometry, isMultipleTextShape, isRectangleHitDrawElement, isRectangleHitElementText, isSelfLoop, isSingleSelectElementByTable, isSingleSelectSwimlane, isSingleSelectTable, isSingleTextGeometry, isSingleTextShape, isSwimlanePointers, isSwimlaneWithHeader, isTextExceedingBounds, isUpdatedHandleIndex, isUseDefaultOrthogonalRoute, memorizeLatestShape, memorizeLatestText, rerenderGeometryActive, setSelectedCells, setTextManage, traverseDrawShapes, updateCellIds, updateCellIdsByRowOrColumn, updateColumns, updateRowOrColumnIds, updateRows, vectorLineCreating, withArrowLineAutoComplete, withDraw };
8877
+ export { ArrowLineAutoCompleteGenerator, ArrowLineComponent, ArrowLineHandleKey, ArrowLineMarkerType, ArrowLineShape, BasicShapes, DEFAULT_IMAGE_WIDTH, DefaultActivationProperty, DefaultActorProperty, DefaultArrowProperty, DefaultAssemblyProperty, DefaultBasicShapeProperty, DefaultBasicShapePropertyMap, DefaultClassProperty, DefaultCloudProperty, DefaultCombinedFragmentProperty, DefaultComponentBoxProperty, DefaultConnectorProperty, DefaultContainerProperty, DefaultDataBaseProperty, DefaultDataProperty, DefaultDecisionProperty, DefaultDeletionProperty, DefaultDocumentProperty, DefaultDrawActiveStyle, DefaultDrawStyle, DefaultFlowchartProperty, DefaultFlowchartPropertyMap, DefaultInterfaceProperty, DefaultInternalStorageProperty, DefaultManualInputProperty, DefaultMergeProperty, DefaultMultiDocumentProperty, DefaultNoteProperty, DefaultObjectProperty, DefaultPackageProperty, DefaultPentagonArrowProperty, DefaultPortProperty, DefaultProvidedInterfaceProperty, DefaultRequiredInterfaceProperty, DefaultSwimlaneHorizontalProperty, DefaultSwimlaneHorizontalWithHeaderProperty, DefaultSwimlanePropertyMap, DefaultSwimlaneVerticalProperty, DefaultSwimlaneVerticalWithHeaderProperty, DefaultTextProperty, DefaultTwoWayArrowProperty, DefaultUMLPropertyMap, DrawThemeColors, DrawTransforms, FlowchartSymbols, GEOMETRY_NOT_CLOSED, GEOMETRY_WITHOUT_TEXT, GEOMETRY_WITH_MULTIPLE_TEXT, GeometryCommonTextKeys, GeometryComponent, GeometryShapeGenerator, GeometryThreshold, KEY_TO_TEXT_MANAGE, LINE_HIT_GEOMETRY_BUFFER, LINE_SNAPPING_BUFFER, LINE_SNAPPING_CONNECTOR_BUFFER, LineActiveGenerator, MIN_TEXT_WIDTH, MemorizeKey, MultipleTextGeometryTextKeys, PlaitArrowLine, PlaitDrawElement, PlaitGeometry, PlaitTableElement, Q2C, SELECTED_CELLS, SWIMLANE_HEADER_SIZE, ShapeDefaultSpace, SingleTextGenerator, SwimlaneDrawSymbols, SwimlaneSymbols, TableGenerator, TableSymbols, TextGenerator, UMLSymbols, VectorLineComponent, VectorLinePointerType, VectorLineShape, WithArrowLineAutoCompletePluginKey, WithDrawPluginKey, adjustSwimlaneShape, alignElbowSegment, alignPoints, buildClipboardData, buildDefaultTextsByShape, buildSwimlaneTable, clearSelectedCells, collectArrowLineUpdatedRefsByGeometry, createArrowLineElement, createCell, createDefaultCells, createDefaultFlowchart, createDefaultGeometry, createDefaultRowsOrColumns, createDefaultSwimlane, createGeometryElement, createGeometryElementWithText, createGeometryElementWithoutText, createMultipleTextGeometryElement, createTextElement, createUMLClassOrInterfaceGeometryElement, createVectorLineElement, debugGenerator$1 as debugGenerator, deleteTextManage, drawArrowLine, drawArrowLineArrow, drawBoundReaction, drawGeometry, drawShape, drawVectorLine, editCell, editText, getArrowLineHandleRefPair, getArrowLinePointers, getArrowLinePoints, getArrowLineTextRectangle, getArrowLines, getAutoCompletePoints, getBasicPointers, getCellWithPoints, getCellsRectangle, getCellsWithPoints, getCenterPointsOnPolygon$1 as getCenterPointsOnPolygon, getConnectionPoint, getCurvePoints, getDefaultBasicShapeProperty, getDefaultFill, getDefaultFlowchartProperty, getDefaultGeometryPoints, getDefaultGeometryProperty, getDefaultSwimlanePoints, getDefaultTextPoints, getDefaultUMLProperty, getDrawDefaultStrokeColor, getElbowLineRouteOptions, getElbowPoints, getFillByElement, getFirstFilledDrawElement, getFirstTextOrLineElement, getFlowchartPointers, getGeometryAlign, getGeometryPointers, getHitCell, getHitConnection, getHitConnectorPoint, getHitDrawElement, getHitIndexOfAutoCompletePoint, getHitMultipleGeometryText, getHitShape, getIndexAndDeleteCountByKeyPoint, getLineMemorizedLatest, getMemorizeKey, getMemorizedLatestByPointer, getMemorizedLatestShape, getMidKeyPoints, getMiddlePoints, getMirrorDataPoints, getMultipleTextGeometryTextKeys, getNearestPoint, getNextRenderPoints, getNextSourceAndTargetPoints, getResizedPreviousAndNextPoint, getSelectedArrowLineElements, getSelectedCells, getSelectedCustomGeometryElements, getSelectedDrawElements, getSelectedGeometryElements, getSelectedImageElements, getSelectedSwimlane, getSelectedTableCellsEditor, getSelectedTableElements, getSelectedVectorLineElements, getSnapResizingRef, getSnapResizingRefOptions, getSnappingRef, getSnappingShape, getSourceAndTargetRectangle, getStrokeColorByElement, getStrokeStyleByElement, getStrokeWidthByElement, getSwimlaneCount, getSwimlanePointers, getTextKey, getTextManage, getTextManageByCell, getTextRectangle, getTextShapeProperty, getUMLPointers, getVectorByConnection, getVectorLinePointers, getVectorLinePoints, handleArrowLineCreating, hasIllegalElbowPoint, insertClipboardData, insertElement, isCellIncludeText, isClosedPoints, isCustomGeometryClosed, isDrawElementClosed, isDrawElementIncludeText, isDrawElementsIncludeText, isGeometryClosed, isGeometryIncludeText, isHitArrowLine, isHitArrowLineText, isHitDrawElement, isHitEdgeOfShape, isHitElementInside, isHitElementText, isHitPolyLine, isHitVectorLine, isInsideOfShape, isMultipleTextGeometry, isMultipleTextShape, isRectangleHitDrawElement, isRectangleHitElementText, isRectangleHitRotatedElement, isRectangleHitRotatedPoints, isSelfLoop, isSingleSelectArrowLine, isSingleSelectElementByTable, isSingleSelectSwimlane, isSingleSelectTable, isSingleTextGeometry, isSingleTextShape, isSwimlanePointers, isSwimlaneWithHeader, isTextExceedingBounds, isUpdatedHandleIndex, isUseDefaultOrthogonalRoute, memorizeLatestShape, memorizeLatestText, rerenderGeometryActive, setSelectedCells, setTextManage, traverseDrawShapes, updateCellIds, updateCellIdsByRowOrColumn, updateColumns, updateRowOrColumnIds, updateRows, vectorLineCreating, withArrowLineAutoComplete, withDraw };
8930
8878
  //# sourceMappingURL=plait-draw.mjs.map