@plait/mind 0.4.0 → 0.5.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.
- package/base/emoji-base.component.d.ts +1 -0
- package/esm2020/base/emoji-base.component.mjs +16 -3
- package/esm2020/node.component.mjs +2 -2
- package/esm2020/plugins/with-mind-create.mjs +15 -3
- package/esm2020/plugins/with-mind.mjs +3 -7
- package/esm2020/plugins/with-node-dnd.mjs +36 -22
- package/esm2020/utils/dnd/common.mjs +25 -29
- package/esm2020/utils/dnd/detector.mjs +10 -86
- package/esm2020/utils/draw/node-dnd.mjs +27 -7
- package/esm2020/utils/node-style/branch.mjs +4 -3
- package/fesm2015/plait-mind.mjs +120 -144
- package/fesm2015/plait-mind.mjs.map +1 -1
- package/fesm2020/plait-mind.mjs +119 -144
- package/fesm2020/plait-mind.mjs.map +1 -1
- package/package.json +1 -1
- package/styles/styles.scss +1 -2
- package/utils/dnd/common.d.ts +11 -3
- package/utils/dnd/detector.d.ts +0 -7
- package/utils/draw/node-dnd.d.ts +6 -4
package/fesm2020/plait-mind.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, ChangeDetectionStrategy, NgModule, Directive, Input } from '@angular/core';
|
|
2
|
+
import { Component, ChangeDetectionStrategy, NgModule, Directive, Input, HostListener } from '@angular/core';
|
|
3
3
|
import * as i2 from '@plait/core';
|
|
4
|
-
import { distanceBetweenPointAndRectangle, RectangleClient, PlaitElement, PlaitBoard, idCreator, isNullOrUndefined, Transforms, clearSelectedElement, addSelectedElement, depthFirstRecursion, Path, drawRoundRectangle, drawLinearPath, createG, PlaitNode, getRectangleByElements, getSelectedElements, NODE_TO_PARENT, drawAbstractRoundRectangle, PlaitPluginElementComponent, PlaitPointerType, NODE_TO_INDEX, createText, IS_TEXT_EDITABLE, MERGING, transformPoint, toPoint, PlaitModule, distanceBetweenPointAndPoint, CLIP_BOARD_FORMAT_KEY, isMainPointer, BOARD_TO_HOST, throttleRAF, updateForeignObject as updateForeignObject$1, BoardTransforms,
|
|
5
|
-
import { MindLayoutType, isIndentedLayout, getNonAbstractChildren, isStandardLayout, AbstractNode, isLeftLayout, isRightLayout,
|
|
4
|
+
import { distanceBetweenPointAndRectangle, RectangleClient, PlaitElement, PlaitBoard, idCreator, isNullOrUndefined, Transforms, clearSelectedElement, addSelectedElement, depthFirstRecursion, Path, drawRoundRectangle, drawLinearPath, createG, PlaitNode, getRectangleByElements, getSelectedElements, NODE_TO_PARENT, drawAbstractRoundRectangle, PlaitPluginElementComponent, PlaitPointerType, NODE_TO_INDEX, createText, IS_TEXT_EDITABLE, MERGING, transformPoint, toPoint, PlaitModule, distanceBetweenPointAndPoint, CLIP_BOARD_FORMAT_KEY, isMainPointer, BOARD_TO_HOST, PlaitPluginKey, throttleRAF, updateForeignObject as updateForeignObject$1, BoardTransforms, removeSelectedElement, PlaitHistoryBoard, hotkeys } from '@plait/core';
|
|
5
|
+
import { MindLayoutType, isIndentedLayout, getNonAbstractChildren, isStandardLayout, AbstractNode, isLeftLayout, isRightLayout, isVerticalLogicLayout, isHorizontalLogicLayout, isTopLayout, isBottomLayout, isHorizontalLayout, getCorrectStartEnd, getAbstractLayout, ConnectingPosition, GlobalLayout } from '@plait/layouts';
|
|
6
6
|
import { getSizeByText, ROOT_DEFAULT_HEIGHT, TEXT_DEFAULT_HEIGHT, updateForeignObject, drawRichtext, createForeignObject, updateRichText, setFullSelectionAndFocus, getRichtextContentSize, hasEditableTarget, RichtextModule } from '@plait/richtext';
|
|
7
7
|
import { fromEvent, Subject, timer } from 'rxjs';
|
|
8
8
|
import { take, takeUntil, filter, debounceTime } from 'rxjs/operators';
|
|
@@ -486,7 +486,8 @@ const getAvailableProperty = (board, element, propertyKey) => {
|
|
|
486
486
|
*/
|
|
487
487
|
const getBranchColorByMindElement = (board, element) => {
|
|
488
488
|
const branchColor = getAvailableProperty(board, element, 'branchColor');
|
|
489
|
-
|
|
489
|
+
const parentBranchColor = MindElement.getParent(element)?.branchColor;
|
|
490
|
+
return parentBranchColor || branchColor || getDefaultBranchColor(board, element);
|
|
490
491
|
};
|
|
491
492
|
const getBranchShapeByMindElement = (board, element) => {
|
|
492
493
|
const branchShape = getAvailableProperty(board, element, 'branchShape');
|
|
@@ -552,30 +553,20 @@ function isVirtualKey(e) {
|
|
|
552
553
|
}
|
|
553
554
|
|
|
554
555
|
const IS_DRAGGING = new WeakMap();
|
|
555
|
-
const addActiveOnDragOrigin = (activeElement
|
|
556
|
+
const addActiveOnDragOrigin = (activeElement) => {
|
|
556
557
|
const activeComponent = PlaitElement.getComponent(activeElement);
|
|
557
|
-
|
|
558
|
-
activeComponent.g.classList.add('dragging-origin');
|
|
559
|
-
}
|
|
560
|
-
else {
|
|
561
|
-
activeComponent.g.classList.add('dragging-child');
|
|
562
|
-
}
|
|
558
|
+
activeComponent.g.classList.add('dragging-node');
|
|
563
559
|
!activeElement.isCollapsed &&
|
|
564
560
|
activeElement.children.forEach(child => {
|
|
565
|
-
addActiveOnDragOrigin(child
|
|
561
|
+
addActiveOnDragOrigin(child);
|
|
566
562
|
});
|
|
567
563
|
};
|
|
568
|
-
const removeActiveOnDragOrigin = (activeElement
|
|
564
|
+
const removeActiveOnDragOrigin = (activeElement) => {
|
|
569
565
|
const activeComponent = PlaitElement.getComponent(activeElement);
|
|
570
|
-
|
|
571
|
-
activeComponent.g.classList.remove('dragging-origin');
|
|
572
|
-
}
|
|
573
|
-
else {
|
|
574
|
-
activeComponent.g.classList.remove('dragging-child');
|
|
575
|
-
}
|
|
566
|
+
activeComponent.g.classList.remove('dragging-node');
|
|
576
567
|
!activeElement.isCollapsed &&
|
|
577
568
|
activeElement.children.forEach(child => {
|
|
578
|
-
removeActiveOnDragOrigin(child
|
|
569
|
+
removeActiveOnDragOrigin(child);
|
|
579
570
|
});
|
|
580
571
|
};
|
|
581
572
|
const isDragging = (board) => {
|
|
@@ -584,22 +575,20 @@ const isDragging = (board) => {
|
|
|
584
575
|
const setIsDragging = (board, state) => {
|
|
585
576
|
IS_DRAGGING.set(board, state);
|
|
586
577
|
};
|
|
587
|
-
const hasPreviousOrNextOfDropPath = (parent,
|
|
588
|
-
|
|
589
|
-
let hasPreviousNode = dropPath[dropPath.length - 1] !== 0;
|
|
590
|
-
let hasNextNode = dropPath[dropPath.length - 1] !== (children?.length || 0);
|
|
578
|
+
const hasPreviousOrNextOfDropPath = (parent, dropTarget, dropPath) => {
|
|
579
|
+
let children = getNonAbstractChildren(parent);
|
|
591
580
|
if (PlaitMind.isMind(parent) && isStandardLayout(getRootLayout(parent))) {
|
|
592
|
-
const
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
hasPreviousNode = true;
|
|
596
|
-
hasNextNode = false;
|
|
581
|
+
const isDropRight = isDropStandardRight(parent, dropTarget);
|
|
582
|
+
if (isDropRight) {
|
|
583
|
+
children = children.slice(0, parent.rightNodeCount);
|
|
597
584
|
}
|
|
598
|
-
if (
|
|
599
|
-
|
|
600
|
-
|
|
585
|
+
if (!isDropRight) {
|
|
586
|
+
children = children.slice(parent.rightNodeCount, children.length);
|
|
587
|
+
dropPath = [...dropPath, dropPath[dropPath.length - 1] - parent.rightNodeCount];
|
|
601
588
|
}
|
|
602
589
|
}
|
|
590
|
+
let hasPreviousNode = dropPath[dropPath.length - 1] !== 0;
|
|
591
|
+
let hasNextNode = dropPath[dropPath.length - 1] !== (children?.length || 0);
|
|
603
592
|
if (parent.isCollapsed) {
|
|
604
593
|
hasNextNode = false;
|
|
605
594
|
hasPreviousNode = false;
|
|
@@ -609,6 +598,14 @@ const hasPreviousOrNextOfDropPath = (parent, target, dropPath) => {
|
|
|
609
598
|
hasNextNode
|
|
610
599
|
};
|
|
611
600
|
};
|
|
601
|
+
const isDropStandardRight = (parent, dropTarget) => {
|
|
602
|
+
const target = dropTarget.target;
|
|
603
|
+
return ((PlaitMind.isMind(parent) &&
|
|
604
|
+
isStandardLayout(getRootLayout(parent)) &&
|
|
605
|
+
parent.children.indexOf(target) !== -1 &&
|
|
606
|
+
parent.children.indexOf(target) < parent.rightNodeCount) ||
|
|
607
|
+
(PlaitMind.isMind(target) && isStandardLayout(getRootLayout(target)) && dropTarget.detectResult === 'right'));
|
|
608
|
+
};
|
|
612
609
|
|
|
613
610
|
const directionCorrector = (board, node, detectResults) => {
|
|
614
611
|
if (!node.origin.isRoot && !AbstractNode.isAbstract(node.origin)) {
|
|
@@ -735,88 +732,6 @@ const directionDetector = (targetNode, centerPoint) => {
|
|
|
735
732
|
}
|
|
736
733
|
return null;
|
|
737
734
|
};
|
|
738
|
-
/* 根据布局调整 target 以及 direction */
|
|
739
|
-
const readjustmentDropTarget = (board, dropTarget) => {
|
|
740
|
-
const { target, detectResult } = dropTarget;
|
|
741
|
-
const newDropTarget = { target, detectResult };
|
|
742
|
-
const targetComponent = PlaitElement.getComponent(target);
|
|
743
|
-
if (targetComponent.node.children.length > 0 && dropTarget.detectResult) {
|
|
744
|
-
const layout = MindQueries.getCorrectLayoutByElement(board, targetComponent.node.origin);
|
|
745
|
-
const parentLayout = MindQueries.getCorrectLayoutByElement(board, targetComponent.node.origin.isRoot ? targetComponent.node.origin : targetComponent.node.parent.origin);
|
|
746
|
-
const children = getNonAbstractChildren(targetComponent.node);
|
|
747
|
-
if (['right', 'left'].includes(dropTarget.detectResult)) {
|
|
748
|
-
if (!isMixedLayout(parentLayout, layout)) {
|
|
749
|
-
if (targetComponent.node.origin.isRoot) {
|
|
750
|
-
const layout = MindQueries.getCorrectLayoutByElement(board, targetComponent.node.origin);
|
|
751
|
-
// 标准布局,根节点
|
|
752
|
-
if (isStandardLayout(layout)) {
|
|
753
|
-
const rightNodeCount = targetComponent.node.origin.rightNodeCount;
|
|
754
|
-
if (detectResult === 'left') {
|
|
755
|
-
// 作为左的第一个节点
|
|
756
|
-
if (targetComponent.node.children.length === rightNodeCount) {
|
|
757
|
-
return newDropTarget;
|
|
758
|
-
}
|
|
759
|
-
}
|
|
760
|
-
else {
|
|
761
|
-
// 作为右的第一个节点或最后一个节点
|
|
762
|
-
if (rightNodeCount === 0) {
|
|
763
|
-
newDropTarget.target = target;
|
|
764
|
-
}
|
|
765
|
-
else {
|
|
766
|
-
newDropTarget.target = targetComponent.node.children[rightNodeCount - 1].origin;
|
|
767
|
-
newDropTarget.detectResult = 'bottom';
|
|
768
|
-
}
|
|
769
|
-
return newDropTarget;
|
|
770
|
-
}
|
|
771
|
-
}
|
|
772
|
-
}
|
|
773
|
-
// 缩进布局探测到第一个子节点
|
|
774
|
-
if (isIndentedLayout(parentLayout)) {
|
|
775
|
-
newDropTarget.target = targetComponent.node.children[0].origin;
|
|
776
|
-
newDropTarget.detectResult = isTopLayout(parentLayout) ? 'bottom' : 'top';
|
|
777
|
-
return newDropTarget;
|
|
778
|
-
}
|
|
779
|
-
// 上下布局的根节点只可以探测到上或者下,子节点的左右探测不处理,跳过。
|
|
780
|
-
if (isVerticalLogicLayout(parentLayout)) {
|
|
781
|
-
return newDropTarget;
|
|
782
|
-
}
|
|
783
|
-
// 剩下是水平布局的默认情况:插入最后一个子节点的下方
|
|
784
|
-
const lastChildNodeIndex = children.length - 1;
|
|
785
|
-
newDropTarget.target = targetComponent.node.children[lastChildNodeIndex].origin;
|
|
786
|
-
newDropTarget.detectResult = 'bottom';
|
|
787
|
-
}
|
|
788
|
-
else {
|
|
789
|
-
// 处理左右布局下的混合布局
|
|
790
|
-
if ([MindLayoutType.left, MindLayoutType.right].includes(parentLayout)) {
|
|
791
|
-
const layout = MindQueries.getCorrectLayoutByElement(board, targetComponent.node.origin);
|
|
792
|
-
if (isIndentedLayout(layout)) {
|
|
793
|
-
newDropTarget.target = targetComponent.node.children[0].origin;
|
|
794
|
-
newDropTarget.detectResult = isTopLayout(layout) ? 'bottom' : 'top';
|
|
795
|
-
return newDropTarget;
|
|
796
|
-
}
|
|
797
|
-
}
|
|
798
|
-
}
|
|
799
|
-
}
|
|
800
|
-
if (['top', 'bottom'].includes(dropTarget.detectResult)) {
|
|
801
|
-
// 缩进布局移动至第一个节点
|
|
802
|
-
if (targetComponent.node.origin.isRoot && isIndentedLayout(layout)) {
|
|
803
|
-
newDropTarget.target = targetComponent.node.children[0].origin;
|
|
804
|
-
newDropTarget.detectResult = isTopLayout(layout) ? 'bottom' : 'top';
|
|
805
|
-
return newDropTarget;
|
|
806
|
-
}
|
|
807
|
-
// 上下布局,插到右边
|
|
808
|
-
const parentLayout = MindQueries.getCorrectLayoutByElement(board, targetComponent.node.origin.isRoot ? targetComponent.node.origin : targetComponent.node.parent.origin);
|
|
809
|
-
if (isVerticalLogicLayout(parentLayout)) {
|
|
810
|
-
const lastChildNodeIndex = children.length - 1;
|
|
811
|
-
newDropTarget.target = targetComponent.node.children[lastChildNodeIndex].origin;
|
|
812
|
-
newDropTarget.detectResult = 'right';
|
|
813
|
-
return newDropTarget;
|
|
814
|
-
}
|
|
815
|
-
}
|
|
816
|
-
return newDropTarget;
|
|
817
|
-
}
|
|
818
|
-
return dropTarget;
|
|
819
|
-
};
|
|
820
735
|
const isValidTarget = (origin, target) => {
|
|
821
736
|
return origin !== target && !isChildElement(origin, target);
|
|
822
737
|
};
|
|
@@ -838,7 +753,13 @@ const getPathByDropTarget = (board, dropTarget) => {
|
|
|
838
753
|
}
|
|
839
754
|
// 水平布局/标准布局:上下是兄弟节点,左右是子节点
|
|
840
755
|
if (isHorizontalLogicLayout(layout)) {
|
|
841
|
-
if (dropTarget.detectResult === 'right'
|
|
756
|
+
if (dropTarget.detectResult === 'right' && !PlaitMind.isMind(dropTarget?.target)) {
|
|
757
|
+
targetPath.push(children.length);
|
|
758
|
+
}
|
|
759
|
+
if (dropTarget.detectResult === 'right' && PlaitMind.isMind(dropTarget?.target) && isStandardLayout(layout)) {
|
|
760
|
+
targetPath.push(dropTarget?.target.rightNodeCount);
|
|
761
|
+
}
|
|
762
|
+
if (dropTarget.detectResult === 'left') {
|
|
842
763
|
targetPath.push(children.length);
|
|
843
764
|
}
|
|
844
765
|
// 如果是上,位置不变,下插入到下一个兄弟节点
|
|
@@ -1124,7 +1045,8 @@ function drawLink(board, parentNode, node, isHorizontal, needDrawUnderline, defa
|
|
|
1124
1045
|
: drawLogicLink(board, parentNode, node, isHorizontal, defaultStroke, defaultStrokeWidth);
|
|
1125
1046
|
}
|
|
1126
1047
|
|
|
1127
|
-
const drawFakeDragNode = (board,
|
|
1048
|
+
const drawFakeDragNode = (board, element, offsetX, offsetY) => {
|
|
1049
|
+
const activeComponent = PlaitElement.getComponent(element);
|
|
1128
1050
|
const dragFakeNodeG = createG();
|
|
1129
1051
|
dragFakeNodeG.classList.add('dragging', 'fake-node', 'plait-board-attached');
|
|
1130
1052
|
const fakeDraggingNode = {
|
|
@@ -1139,14 +1061,22 @@ const drawFakeDragNode = (board, activeComponent, offsetX, offsetY) => {
|
|
|
1139
1061
|
updateForeignObject(richtextG, textRectangle.width, textRectangle.height, textRectangle.x + offsetX, textRectangle.y + offsetY);
|
|
1140
1062
|
dragFakeNodeG?.append(fakeNodeG);
|
|
1141
1063
|
dragFakeNodeG?.append(richtextG);
|
|
1064
|
+
// draw emojis
|
|
1065
|
+
if (MindElement.hasEmojis(element)) {
|
|
1066
|
+
const fakeEmojisG = activeComponent.emojisDrawer.g.cloneNode(true);
|
|
1067
|
+
const foreignRectangle = getEmojiForeignRectangle(board, element);
|
|
1068
|
+
updateForeignObject(fakeEmojisG, foreignRectangle.width, foreignRectangle.height, foreignRectangle.x + offsetX, foreignRectangle.y + offsetY);
|
|
1069
|
+
dragFakeNodeG?.append(fakeEmojisG);
|
|
1070
|
+
}
|
|
1142
1071
|
return dragFakeNodeG;
|
|
1143
1072
|
};
|
|
1144
|
-
const drawFakeDropNode = (board,
|
|
1073
|
+
const drawFakeDropNode = (board, dropTarget, path) => {
|
|
1074
|
+
const target = dropTarget.target;
|
|
1145
1075
|
const fakeDropNodeG = createG();
|
|
1146
1076
|
const parent = PlaitNode.get(board, Path.parent(path));
|
|
1147
1077
|
const layout = MindQueries.getLayoutByElement(parent);
|
|
1148
1078
|
const isHorizontal = isHorizontalLayout(layout);
|
|
1149
|
-
const { hasNextNode, hasPreviousNode } = hasPreviousOrNextOfDropPath(parent,
|
|
1079
|
+
const { hasNextNode, hasPreviousNode } = hasPreviousOrNextOfDropPath(parent, dropTarget, path);
|
|
1150
1080
|
const width = 30;
|
|
1151
1081
|
const height = 12;
|
|
1152
1082
|
let fakeNode, centerPoint, basicNode, linkDirection;
|
|
@@ -1155,6 +1085,16 @@ const drawFakeDropNode = (board, target, path) => {
|
|
|
1155
1085
|
const parentRect = getRectangleByNode(parentNode);
|
|
1156
1086
|
linkDirection = getLayoutDirection(parentNode, isHorizontal);
|
|
1157
1087
|
basicNode = parentNode;
|
|
1088
|
+
if (PlaitMind.isMind(target) && isStandardLayout(layout)) {
|
|
1089
|
+
if (dropTarget.detectResult === 'left') {
|
|
1090
|
+
linkDirection = LayoutDirection.left;
|
|
1091
|
+
basicNode.left = true;
|
|
1092
|
+
}
|
|
1093
|
+
else {
|
|
1094
|
+
linkDirection = LayoutDirection.right;
|
|
1095
|
+
basicNode.left = false;
|
|
1096
|
+
}
|
|
1097
|
+
}
|
|
1158
1098
|
const placement = [HorizontalPlacement.right, VerticalPlacement.middle];
|
|
1159
1099
|
transformPlacement(placement, linkDirection);
|
|
1160
1100
|
const parentCenterPoint = getPointByPlacement(parentRect, placement);
|
|
@@ -2822,7 +2762,7 @@ class MindNodeComponent extends PlaitPluginElementComponent {
|
|
|
2822
2762
|
}
|
|
2823
2763
|
// interactive
|
|
2824
2764
|
fromEvent(collapseG, 'mouseup')
|
|
2825
|
-
.pipe(filter(() => !this.handActive ||
|
|
2765
|
+
.pipe(filter(() => !this.handActive || PlaitBoard.isReadonly(this.board)), take(1))
|
|
2826
2766
|
.subscribe(() => {
|
|
2827
2767
|
const isCollapsed = !this.node.origin.isCollapsed;
|
|
2828
2768
|
const newElement = { isCollapsed };
|
|
@@ -3254,7 +3194,7 @@ const withDnd = (board) => {
|
|
|
3254
3194
|
startPoint = point;
|
|
3255
3195
|
}
|
|
3256
3196
|
else if (isMultiple) {
|
|
3257
|
-
activeElements =
|
|
3197
|
+
activeElements = selectedElements;
|
|
3258
3198
|
startPoint = point;
|
|
3259
3199
|
}
|
|
3260
3200
|
}, node => {
|
|
@@ -3283,7 +3223,7 @@ const withDnd = (board) => {
|
|
|
3283
3223
|
dropTarget = detectDropTarget(board, detectPoint, dropTarget, [...activeElements, ...correspondingElements]);
|
|
3284
3224
|
if (dropTarget?.target) {
|
|
3285
3225
|
targetPath = getPathByDropTarget(board, dropTarget);
|
|
3286
|
-
fakeDropNodeG = drawFakeDropNode(board, dropTarget
|
|
3226
|
+
fakeDropNodeG = drawFakeDropNode(board, dropTarget, targetPath);
|
|
3287
3227
|
PlaitBoard.getHost(board).appendChild(fakeDropNodeG);
|
|
3288
3228
|
}
|
|
3289
3229
|
const offsetX = endPoint[0] - startPoint[0];
|
|
@@ -3292,27 +3232,29 @@ const withDnd = (board) => {
|
|
|
3292
3232
|
dragFakeNodeG = createG();
|
|
3293
3233
|
[...activeElements, ...correspondingElements].forEach(element => {
|
|
3294
3234
|
addActiveOnDragOrigin(element);
|
|
3295
|
-
|
|
3296
|
-
|
|
3297
|
-
|
|
3298
|
-
|
|
3299
|
-
}
|
|
3235
|
+
});
|
|
3236
|
+
activeElements.forEach(element => {
|
|
3237
|
+
const nodeG = drawFakeDragNode(board, element, offsetX, offsetY);
|
|
3238
|
+
dragFakeNodeG?.appendChild(nodeG);
|
|
3300
3239
|
});
|
|
3301
3240
|
PlaitBoard.getHost(board).appendChild(dragFakeNodeG);
|
|
3302
3241
|
}
|
|
3303
3242
|
mousemove(event);
|
|
3304
3243
|
};
|
|
3305
3244
|
board.globalMouseup = (event) => {
|
|
3306
|
-
|
|
3307
|
-
|
|
3245
|
+
const firstLevelElements = getFirstLevelElement(activeElements);
|
|
3246
|
+
if (!board.options.readonly && firstLevelElements.length) {
|
|
3247
|
+
firstLevelElements.push(...correspondingElements);
|
|
3308
3248
|
if (isDragging(board)) {
|
|
3309
|
-
|
|
3249
|
+
firstLevelElements.forEach(element => {
|
|
3250
|
+
removeActiveOnDragOrigin(element);
|
|
3251
|
+
});
|
|
3310
3252
|
}
|
|
3311
3253
|
if (dropTarget) {
|
|
3312
3254
|
const targetPathRef = board.pathRef(targetPath);
|
|
3313
3255
|
const targetElementPathRef = board.pathRef(PlaitBoard.findPath(board, dropTarget.target));
|
|
3314
|
-
|
|
3315
|
-
const normalElements =
|
|
3256
|
+
let abstractRefs = getValidAbstractRefs(board, firstLevelElements);
|
|
3257
|
+
const normalElements = firstLevelElements
|
|
3316
3258
|
.filter(element => !abstractRefs.some(refs => refs.abstract === element))
|
|
3317
3259
|
.map(element => {
|
|
3318
3260
|
if (AbstractNode.isAbstract(element)) {
|
|
@@ -3323,18 +3265,30 @@ const withDnd = (board) => {
|
|
|
3323
3265
|
}
|
|
3324
3266
|
return element;
|
|
3325
3267
|
});
|
|
3326
|
-
const
|
|
3268
|
+
const hasPreviousNode = targetPath[targetPath.length - 1] !== 0;
|
|
3269
|
+
if (hasPreviousNode) {
|
|
3270
|
+
const previousElement = PlaitNode.get(board, Path.previous(targetPath));
|
|
3271
|
+
const correspondingAbstract = getCorrespondingAbstract(previousElement);
|
|
3272
|
+
const targetHasCorrespondAbstract = correspondingAbstract && correspondingAbstract.end !== targetPath[targetPath.length - 1] - 1;
|
|
3273
|
+
if (targetHasCorrespondAbstract) {
|
|
3274
|
+
const adjustedNode = abstractRefs.map(ref => {
|
|
3275
|
+
return adjustAbstractToNode(ref.abstract);
|
|
3276
|
+
});
|
|
3277
|
+
normalElements.push(...adjustedNode);
|
|
3278
|
+
abstractRefs = [];
|
|
3279
|
+
}
|
|
3280
|
+
}
|
|
3281
|
+
const effectedAbstracts = deleteElementHandleAbstract(board, firstLevelElements);
|
|
3327
3282
|
insertElementHandleAbstract(board, targetPath, normalElements.length, false, effectedAbstracts);
|
|
3328
3283
|
MindTransforms.setAbstractsByRefs(board, effectedAbstracts);
|
|
3329
|
-
let refs = deleteElementsHandleRightNodeCount(board,
|
|
3330
|
-
const
|
|
3331
|
-
|
|
3332
|
-
(Path.isSibling(targetPath, targetElementPathRef.current) || Path.equals(targetPath, targetElementPathRef.current));
|
|
3284
|
+
let refs = deleteElementsHandleRightNodeCount(board, firstLevelElements);
|
|
3285
|
+
const parent = PlaitNode.get(board, Path.parent(targetPath));
|
|
3286
|
+
const shouldChangeRoot = isDropStandardRight(parent, dropTarget);
|
|
3333
3287
|
if (shouldChangeRoot && targetElementPathRef.current) {
|
|
3334
3288
|
refs = insertElementHandleRightNodeCount(board, targetElementPathRef.current.slice(0, 1), normalElements.length, refs);
|
|
3335
3289
|
}
|
|
3336
3290
|
MindTransforms.setRightNodeCountByRefs(board, refs);
|
|
3337
|
-
MindTransforms.removeElements(board,
|
|
3291
|
+
MindTransforms.removeElements(board, firstLevelElements);
|
|
3338
3292
|
let insertPath = targetPathRef.current;
|
|
3339
3293
|
const parentPath = Path.parent(targetPathRef.current || targetPath);
|
|
3340
3294
|
if (!insertPath) {
|
|
@@ -3600,8 +3554,20 @@ const withMindExtend = (board) => {
|
|
|
3600
3554
|
const DefaultHotkey = 'm';
|
|
3601
3555
|
const withCreateMind = (board) => {
|
|
3602
3556
|
const newBoard = board;
|
|
3603
|
-
const { keydown, mousemove, mouseup } = board;
|
|
3557
|
+
const { keydown, mousedown, mousemove, mouseup } = board;
|
|
3604
3558
|
let fakeCreateNodeRef = null;
|
|
3559
|
+
newBoard.mousedown = (event) => {
|
|
3560
|
+
if (fakeCreateNodeRef && PlaitBoard.isPointer(board, MindPointerType.mind)) {
|
|
3561
|
+
const currentOptions = board.getPluginOptions(PlaitPluginKey.withSelection);
|
|
3562
|
+
board.setPluginOptions(PlaitPluginKey.withSelection, {
|
|
3563
|
+
isDisabledSelect: true
|
|
3564
|
+
});
|
|
3565
|
+
setTimeout(() => {
|
|
3566
|
+
board.setPluginOptions(PlaitPluginKey.withSelection, { ...currentOptions });
|
|
3567
|
+
}, 0);
|
|
3568
|
+
}
|
|
3569
|
+
mousedown(event);
|
|
3570
|
+
};
|
|
3605
3571
|
newBoard.mousemove = (event) => {
|
|
3606
3572
|
if (PlaitBoard.isReadonly(board)) {
|
|
3607
3573
|
mousemove(event);
|
|
@@ -3701,12 +3667,9 @@ const withMind = (board) => {
|
|
|
3701
3667
|
return isRecursion(element);
|
|
3702
3668
|
};
|
|
3703
3669
|
board.isHitSelection = (element, range) => {
|
|
3704
|
-
if (MindElement.isMindElement(board, element)
|
|
3670
|
+
if (MindElement.isMindElement(board, element)) {
|
|
3705
3671
|
const client = getRectangleByNode(MindElement.getNode(element));
|
|
3706
3672
|
const isHit = RectangleClient.isHit(RectangleClient.toRectangleClient([range.anchor, range.focus]), client);
|
|
3707
|
-
if (isHit && MindElement.hasEmojis(element) && Selection.isCollapsed(range) && isHitEmojis(board, element, range.anchor)) {
|
|
3708
|
-
return false;
|
|
3709
|
-
}
|
|
3710
3673
|
return isHit;
|
|
3711
3674
|
}
|
|
3712
3675
|
return isHitSelection(element, range);
|
|
@@ -3875,6 +3838,15 @@ class MindEmojiBaseComponent {
|
|
|
3875
3838
|
get nativeElement() {
|
|
3876
3839
|
return this.elementRef.nativeElement;
|
|
3877
3840
|
}
|
|
3841
|
+
handleClick() {
|
|
3842
|
+
const currentOptions = this.board.getPluginOptions(PlaitPluginKey.withSelection);
|
|
3843
|
+
this.board.setPluginOptions(PlaitPluginKey.withSelection, {
|
|
3844
|
+
isDisabledSelect: true
|
|
3845
|
+
});
|
|
3846
|
+
setTimeout(() => {
|
|
3847
|
+
this.board.setPluginOptions(PlaitPluginKey.withSelection, { ...currentOptions });
|
|
3848
|
+
}, 0);
|
|
3849
|
+
}
|
|
3878
3850
|
constructor(elementRef) {
|
|
3879
3851
|
this.elementRef = elementRef;
|
|
3880
3852
|
this.fontSize = 14;
|
|
@@ -3884,7 +3856,7 @@ class MindEmojiBaseComponent {
|
|
|
3884
3856
|
}
|
|
3885
3857
|
}
|
|
3886
3858
|
MindEmojiBaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: MindEmojiBaseComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
3887
|
-
MindEmojiBaseComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.5", type: MindEmojiBaseComponent, inputs: { fontSize: "fontSize", emojiItem: "emojiItem", board: "board", element: "element" }, host: { classAttribute: "mind-node-emoji" }, ngImport: i0 });
|
|
3859
|
+
MindEmojiBaseComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.5", type: MindEmojiBaseComponent, inputs: { fontSize: "fontSize", emojiItem: "emojiItem", board: "board", element: "element" }, host: { listeners: { "mousedown": "handleClick()" }, classAttribute: "mind-node-emoji" }, ngImport: i0 });
|
|
3888
3860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: MindEmojiBaseComponent, decorators: [{
|
|
3889
3861
|
type: Directive,
|
|
3890
3862
|
args: [{
|
|
@@ -3900,6 +3872,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImpor
|
|
|
3900
3872
|
type: Input
|
|
3901
3873
|
}], element: [{
|
|
3902
3874
|
type: Input
|
|
3875
|
+
}], handleClick: [{
|
|
3876
|
+
type: HostListener,
|
|
3877
|
+
args: ['mousedown']
|
|
3903
3878
|
}] } });
|
|
3904
3879
|
|
|
3905
3880
|
/*
|
|
@@ -3910,5 +3885,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImpor
|
|
|
3910
3885
|
* Generated bundle index. Do not edit.
|
|
3911
3886
|
*/
|
|
3912
3887
|
|
|
3913
|
-
export { ABSTRACT_HANDLE_COLOR, ABSTRACT_HANDLE_LENGTH, ABSTRACT_HANDLE_MASK_WIDTH, ABSTRACT_INCLUDED_OUTLINE_OFFSET, AbstractHandlePosition, AbstractResizeState, BASE, BRANCH_COLORS, BRANCH_WIDTH, BaseDrawer, BranchShape, DefaultAbstractNodeStyle, DefaultNodeStyle, DefaultRootStyle, ELEMENT_TO_NODE, EXTEND_OFFSET, EXTEND_RADIUS, GRAY_COLOR, IS_DRAGGING, LayoutDirection, LayoutDirectionsMap, MindElement, MindElementShape, MindEmojiBaseComponent, MindModule, MindNode, MindNodeComponent, MindPointerType, MindQueries, MindTransforms, NODE_MIN_WIDTH, PRIMARY_COLOR, PlaitMind, PlaitMindComponent, QUICK_INSERT_CIRCLE_COLOR, QUICK_INSERT_CIRCLE_OFFSET, QUICK_INSERT_INNER_CROSS_COLOR, ROOT_TOPIC_FONT_SIZE, STROKE_WIDTH, TOPIC_COLOR, TOPIC_DEFAULT_MAX_WORD_COUNT, TOPIC_FONT_SIZE, TRANSPARENT, addActiveOnDragOrigin, adjustAbstractToNode, adjustNodeToRoot, adjustRootToNode, canSetAbstract, copyNewNode, correctLayoutByDirection, createDefaultMind, createEmptyMind, createMindElement, deleteElementHandleAbstract, deleteElementsHandleRightNodeCount, detectDropTarget, directionCorrector, directionDetector, divideElementByParent, drawFakeDragNode, drawFakeDropNode, enterNodeEditing, extractNodesText, findLastChild, findLocationLeftIndex, getAbstractBranchColor, getAbstractBranchWidth, getAbstractHandleRectangle, getAllowedDirection, getAvailableSubLayoutsByLayoutDirections, getBehindAbstracts, getBranchColorByMindElement, getBranchDirectionsByLayouts, getBranchShapeByMindElement, getBranchWidthByMindElement, getChildrenCount, getCorrespondingAbstract, getDefaultBranchColor, getDefaultBranchColorByIndex, getDefaultLayout, getEmojiForeignRectangle, getEmojiRectangle, getFirstLevelElement, getHitAbstractHandle, getInCorrectLayoutDirection, getLayoutDirection$1 as getLayoutDirection, getLayoutReverseDirection, getLocationScope, getNextBranchColor, getOverallAbstracts, getPathByDropTarget, getRectangleByElement, getRectangleByNode, getRectangleByResizingLocation, getRelativeStartEndByAbstractRef, getRootLayout, getShapeByElement, getStrokeByMindElement, getTopicRectangleByElement, getTopicRectangleByNode, getValidAbstractRefs, handleTouchedAbstract, hasAfterDraw, hasPreviousOrNextOfDropPath, insertElementHandleAbstract, insertElementHandleRightNodeCount, insertMindElement, isChildElement, isChildRight, isChildUp, isCorrectLayout, isDragging, isHitEmojis, isHitMindElement, isInRightBranchOfStandardLayout, isMixedLayout, isSetAbstract, isValidTarget, isVirtualKey,
|
|
3888
|
+
export { ABSTRACT_HANDLE_COLOR, ABSTRACT_HANDLE_LENGTH, ABSTRACT_HANDLE_MASK_WIDTH, ABSTRACT_INCLUDED_OUTLINE_OFFSET, AbstractHandlePosition, AbstractResizeState, BASE, BRANCH_COLORS, BRANCH_WIDTH, BaseDrawer, BranchShape, DefaultAbstractNodeStyle, DefaultNodeStyle, DefaultRootStyle, ELEMENT_TO_NODE, EXTEND_OFFSET, EXTEND_RADIUS, GRAY_COLOR, IS_DRAGGING, LayoutDirection, LayoutDirectionsMap, MindElement, MindElementShape, MindEmojiBaseComponent, MindModule, MindNode, MindNodeComponent, MindPointerType, MindQueries, MindTransforms, NODE_MIN_WIDTH, PRIMARY_COLOR, PlaitMind, PlaitMindComponent, QUICK_INSERT_CIRCLE_COLOR, QUICK_INSERT_CIRCLE_OFFSET, QUICK_INSERT_INNER_CROSS_COLOR, ROOT_TOPIC_FONT_SIZE, STROKE_WIDTH, TOPIC_COLOR, TOPIC_DEFAULT_MAX_WORD_COUNT, TOPIC_FONT_SIZE, TRANSPARENT, addActiveOnDragOrigin, adjustAbstractToNode, adjustNodeToRoot, adjustRootToNode, canSetAbstract, copyNewNode, correctLayoutByDirection, createDefaultMind, createEmptyMind, createMindElement, deleteElementHandleAbstract, deleteElementsHandleRightNodeCount, detectDropTarget, directionCorrector, directionDetector, divideElementByParent, drawFakeDragNode, drawFakeDropNode, enterNodeEditing, extractNodesText, findLastChild, findLocationLeftIndex, getAbstractBranchColor, getAbstractBranchWidth, getAbstractHandleRectangle, getAllowedDirection, getAvailableSubLayoutsByLayoutDirections, getBehindAbstracts, getBranchColorByMindElement, getBranchDirectionsByLayouts, getBranchShapeByMindElement, getBranchWidthByMindElement, getChildrenCount, getCorrespondingAbstract, getDefaultBranchColor, getDefaultBranchColorByIndex, getDefaultLayout, getEmojiForeignRectangle, getEmojiRectangle, getFirstLevelElement, getHitAbstractHandle, getInCorrectLayoutDirection, getLayoutDirection$1 as getLayoutDirection, getLayoutReverseDirection, getLocationScope, getNextBranchColor, getOverallAbstracts, getPathByDropTarget, getRectangleByElement, getRectangleByNode, getRectangleByResizingLocation, getRelativeStartEndByAbstractRef, getRootLayout, getShapeByElement, getStrokeByMindElement, getTopicRectangleByElement, getTopicRectangleByNode, getValidAbstractRefs, handleTouchedAbstract, hasAfterDraw, hasPreviousOrNextOfDropPath, insertElementHandleAbstract, insertElementHandleRightNodeCount, insertMindElement, isChildElement, isChildRight, isChildUp, isCorrectLayout, isDragging, isDropStandardRight, isHitEmojis, isHitMindElement, isInRightBranchOfStandardLayout, isMixedLayout, isSetAbstract, isValidTarget, isVirtualKey, removeActiveOnDragOrigin, separateChildren, setIsDragging, withMind, withMindExtend };
|
|
3914
3889
|
//# sourceMappingURL=plait-mind.mjs.map
|