@plait/mind 0.12.2 → 0.13.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/esm2020/node.component.mjs +1 -2
- package/esm2020/plugins/with-mind-hotkey.mjs +101 -16
- package/esm2020/plugins/with-mind.mjs +3 -91
- package/esm2020/utils/mind.mjs +1 -2
- package/esm2020/utils/node/common.mjs +2 -2
- package/esm2020/utils/position/topic.mjs +5 -2
- package/fesm2015/plait-mind.mjs +96 -104
- package/fesm2015/plait-mind.mjs.map +1 -1
- package/fesm2020/plait-mind.mjs +96 -104
- package/fesm2020/plait-mind.mjs.map +1 -1
- package/package.json +1 -1
- package/plugins/with-mind-hotkey.d.ts +4 -1
- package/styles/styles.scss +32 -30
package/fesm2015/plait-mind.mjs
CHANGED
|
@@ -280,7 +280,10 @@ const isHitEmojis = (board, element, point) => {
|
|
|
280
280
|
|
|
281
281
|
function getTopicRectangleByNode(board, node) {
|
|
282
282
|
let nodeRectangle = getRectangleByNode(node);
|
|
283
|
-
|
|
283
|
+
const result = getTopicRectangleByElement(board, nodeRectangle, node.origin);
|
|
284
|
+
// add buffer width to avoid unexpected text breaks in different scene
|
|
285
|
+
result.width = result.width + 4;
|
|
286
|
+
return result;
|
|
284
287
|
}
|
|
285
288
|
function getTopicRectangleByElement(board, nodeRectangle, element) {
|
|
286
289
|
const x = nodeRectangle.x + NodeSpace.getTextLeftSpace(board, element);
|
|
@@ -294,7 +297,7 @@ const NODE_MIN_WIDTH = 18;
|
|
|
294
297
|
|
|
295
298
|
function editTopic(element) {
|
|
296
299
|
const component = PlaitElement.getComponent(element);
|
|
297
|
-
component.editTopic();
|
|
300
|
+
component === null || component === void 0 ? void 0 : component.editTopic();
|
|
298
301
|
}
|
|
299
302
|
|
|
300
303
|
const TOPIC_COLOR = '#333';
|
|
@@ -441,7 +444,6 @@ const extractNodesText = (node) => {
|
|
|
441
444
|
}
|
|
442
445
|
return str;
|
|
443
446
|
};
|
|
444
|
-
// layoutLevel 用来表示插入兄弟节点还是子节点
|
|
445
447
|
const insertMindElement = (board, inheritNode, path) => {
|
|
446
448
|
const newNode = {};
|
|
447
449
|
if (!inheritNode.isRoot) {
|
|
@@ -2584,7 +2586,6 @@ class MindNodeComponent extends PlaitPluginElementComponent {
|
|
|
2584
2586
|
const plugins = this.board.getMindOptions().textPlugins;
|
|
2585
2587
|
this.textManage = new TextManage(this.board, this.viewContainerRef, () => {
|
|
2586
2588
|
const rect = getTopicRectangleByNode(this.board, this.node);
|
|
2587
|
-
rect.width = rect.width + WIDTH_BUFFER;
|
|
2588
2589
|
return rect;
|
|
2589
2590
|
}, (point) => {
|
|
2590
2591
|
return isHitMindElement(this.board, point, this.element);
|
|
@@ -3361,27 +3362,104 @@ const withCreateMind = (board) => {
|
|
|
3361
3362
|
|
|
3362
3363
|
const withMindHotkey = (board) => {
|
|
3363
3364
|
const { keydown } = board;
|
|
3364
|
-
board.keydown = (
|
|
3365
|
-
|
|
3366
|
-
|
|
3365
|
+
board.keydown = (event) => {
|
|
3366
|
+
const selectedElements = getSelectedElements(board);
|
|
3367
|
+
const isSingleSelection = selectedElements.length === 1;
|
|
3368
|
+
const isSingleMindElement = selectedElements.length === 1 && MindElement.isMindElement(board, selectedElements[0]);
|
|
3369
|
+
const targetElement = selectedElements[0];
|
|
3370
|
+
if (isExpandHotkey(event) && isSingleMindElement && !PlaitMind.isMind(targetElement)) {
|
|
3371
|
+
if (targetElement.children && targetElement.children.length > 0) {
|
|
3372
|
+
Transforms.setNode(board, { isCollapsed: targetElement.isCollapsed ? false : true }, PlaitBoard.findPath(board, targetElement));
|
|
3373
|
+
return;
|
|
3374
|
+
}
|
|
3367
3375
|
}
|
|
3368
|
-
if (
|
|
3369
|
-
|
|
3370
|
-
|
|
3371
|
-
|
|
3372
|
-
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
+
if (!PlaitBoard.isReadonly(board)) {
|
|
3377
|
+
if (isTabHotkey(event) && isSingleMindElement) {
|
|
3378
|
+
event.preventDefault();
|
|
3379
|
+
removeSelectedElement(board, targetElement);
|
|
3380
|
+
const targetElementPath = PlaitBoard.findPath(board, targetElement);
|
|
3381
|
+
if (targetElement.isCollapsed) {
|
|
3382
|
+
const newElement = { isCollapsed: false };
|
|
3383
|
+
PlaitHistoryBoard.withoutSaving(board, () => {
|
|
3384
|
+
Transforms.setNode(board, newElement, targetElementPath);
|
|
3385
|
+
});
|
|
3386
|
+
}
|
|
3387
|
+
insertMindElement(board, targetElement, findNewChildNodePath(board, targetElement));
|
|
3388
|
+
return;
|
|
3389
|
+
}
|
|
3390
|
+
if (isEnterHotkey(event) &&
|
|
3391
|
+
isSingleMindElement &&
|
|
3392
|
+
!PlaitMind.isMind(targetElement) &&
|
|
3393
|
+
!AbstractNode.isAbstract(targetElement)) {
|
|
3394
|
+
const targetElementPath = PlaitBoard.findPath(board, targetElement);
|
|
3395
|
+
if (isInRightBranchOfStandardLayout(targetElement)) {
|
|
3396
|
+
const refs = insertElementHandleRightNodeCount(board, targetElementPath.slice(0, 1), 1);
|
|
3397
|
+
MindTransforms.setRightNodeCountByRefs(board, refs);
|
|
3398
|
+
}
|
|
3399
|
+
const abstractRefs = insertElementHandleAbstract(board, Path.next(targetElementPath));
|
|
3400
|
+
MindTransforms.setAbstractsByRefs(board, abstractRefs);
|
|
3401
|
+
insertMindElement(board, targetElement, findNewSiblingNodePath(board, targetElement));
|
|
3402
|
+
return;
|
|
3403
|
+
}
|
|
3404
|
+
if (selectedElements.length > 0 && (hotkeys.isDeleteBackward(event) || hotkeys.isDeleteForward(event))) {
|
|
3405
|
+
event.preventDefault();
|
|
3406
|
+
const targetMindElements = selectedElements.filter(el => MindElement.isMindElement(board, el));
|
|
3407
|
+
const firstLevelElements = getFirstLevelElement(targetMindElements);
|
|
3408
|
+
const deletableElements = firstLevelElements.reverse();
|
|
3409
|
+
const abstractRefs = deleteElementHandleAbstract(board, deletableElements);
|
|
3410
|
+
MindTransforms.setAbstractsByRefs(board, abstractRefs);
|
|
3411
|
+
const refs = deleteElementsHandleRightNodeCount(board, targetMindElements);
|
|
3412
|
+
MindTransforms.setRightNodeCountByRefs(board, refs);
|
|
3413
|
+
MindTransforms.removeElements(board, targetMindElements);
|
|
3414
|
+
let activeElement;
|
|
3415
|
+
if (AbstractNode.isAbstract(firstLevelElements[0])) {
|
|
3416
|
+
const parent = MindElement.getParent(firstLevelElements[0]);
|
|
3417
|
+
activeElement = parent.children[firstLevelElements[0].start];
|
|
3418
|
+
}
|
|
3419
|
+
const firstElement = firstLevelElements[0];
|
|
3420
|
+
const firstElementParent = MindElement.findParent(firstElement);
|
|
3421
|
+
const hasSameParent = firstLevelElements.every(element => {
|
|
3422
|
+
return MindElement.findParent(element) === firstElementParent;
|
|
3423
|
+
});
|
|
3424
|
+
if (firstElementParent && hasSameParent && !activeElement) {
|
|
3425
|
+
const firstElementIndex = firstElementParent.children.indexOf(firstElement);
|
|
3426
|
+
const childrenCount = firstElementParent.children.length;
|
|
3427
|
+
// active parent element
|
|
3428
|
+
if (childrenCount === firstLevelElements.length) {
|
|
3429
|
+
activeElement = firstElementParent;
|
|
3430
|
+
}
|
|
3431
|
+
else {
|
|
3432
|
+
if (firstElementIndex > 0) {
|
|
3433
|
+
activeElement = firstElementParent.children[firstElementIndex - 1];
|
|
3434
|
+
}
|
|
3435
|
+
}
|
|
3436
|
+
}
|
|
3437
|
+
if (activeElement) {
|
|
3438
|
+
addSelectedElement(board, activeElement);
|
|
3439
|
+
}
|
|
3440
|
+
return;
|
|
3441
|
+
}
|
|
3442
|
+
if (!isVirtualKey(event) && !isSpaceHotkey(event) && isSingleSelection) {
|
|
3443
|
+
event.preventDefault();
|
|
3444
|
+
editTopic(targetElement);
|
|
3376
3445
|
return;
|
|
3377
3446
|
}
|
|
3378
3447
|
}
|
|
3379
|
-
keydown(
|
|
3448
|
+
keydown(event);
|
|
3380
3449
|
};
|
|
3381
3450
|
return board;
|
|
3382
3451
|
};
|
|
3383
|
-
const isExpandHotkey = (
|
|
3384
|
-
return isKeyHotkey('mod+/',
|
|
3452
|
+
const isExpandHotkey = (event) => {
|
|
3453
|
+
return isKeyHotkey('mod+/', event);
|
|
3454
|
+
};
|
|
3455
|
+
const isTabHotkey = (event) => {
|
|
3456
|
+
return event.key === 'Tab';
|
|
3457
|
+
};
|
|
3458
|
+
const isEnterHotkey = (event) => {
|
|
3459
|
+
return event.key === 'Enter';
|
|
3460
|
+
};
|
|
3461
|
+
const isSpaceHotkey = (event) => {
|
|
3462
|
+
return event.code === 'Space';
|
|
3385
3463
|
};
|
|
3386
3464
|
|
|
3387
3465
|
const withNodeHover = (board) => {
|
|
@@ -3497,92 +3575,6 @@ const withMind = (board) => {
|
|
|
3497
3575
|
}
|
|
3498
3576
|
return isMovable(element);
|
|
3499
3577
|
};
|
|
3500
|
-
board.keydown = (event) => {
|
|
3501
|
-
if (PlaitBoard.isReadonly(board)) {
|
|
3502
|
-
keydown(event);
|
|
3503
|
-
return;
|
|
3504
|
-
}
|
|
3505
|
-
const selectedElements = getSelectedElements(board);
|
|
3506
|
-
if (selectedElements.length) {
|
|
3507
|
-
if (selectedElements.length === 1 &&
|
|
3508
|
-
(event.key === 'Tab' ||
|
|
3509
|
-
(event.key === 'Enter' && !selectedElements[0].isRoot && !AbstractNode.isAbstract(selectedElements[0])))) {
|
|
3510
|
-
event.preventDefault();
|
|
3511
|
-
const selectedElement = selectedElements[0];
|
|
3512
|
-
removeSelectedElement(board, selectedElement);
|
|
3513
|
-
const selectedElementPath = PlaitBoard.findPath(board, selectedElement);
|
|
3514
|
-
if (event.key === 'Tab') {
|
|
3515
|
-
if (selectedElement.isCollapsed) {
|
|
3516
|
-
const newElement = { isCollapsed: false };
|
|
3517
|
-
PlaitHistoryBoard.withoutSaving(board, () => {
|
|
3518
|
-
Transforms.setNode(board, newElement, selectedElementPath);
|
|
3519
|
-
});
|
|
3520
|
-
}
|
|
3521
|
-
insertMindElement(board, selectedElement, findNewChildNodePath(board, selectedElement));
|
|
3522
|
-
}
|
|
3523
|
-
else {
|
|
3524
|
-
if (isInRightBranchOfStandardLayout(selectedElement)) {
|
|
3525
|
-
const refs = insertElementHandleRightNodeCount(board, selectedElementPath.slice(0, 1), 1);
|
|
3526
|
-
MindTransforms.setRightNodeCountByRefs(board, refs);
|
|
3527
|
-
}
|
|
3528
|
-
const abstractRefs = insertElementHandleAbstract(board, Path.next(selectedElementPath));
|
|
3529
|
-
MindTransforms.setAbstractsByRefs(board, abstractRefs);
|
|
3530
|
-
insertMindElement(board, selectedElement, findNewSiblingNodePath(board, selectedElement));
|
|
3531
|
-
}
|
|
3532
|
-
return;
|
|
3533
|
-
}
|
|
3534
|
-
if (hotkeys.isDeleteBackward(event) || hotkeys.isDeleteForward(event)) {
|
|
3535
|
-
event.preventDefault();
|
|
3536
|
-
const deletableElements = getFirstLevelElement(selectedElements).reverse();
|
|
3537
|
-
const abstractRefs = deleteElementHandleAbstract(board, deletableElements);
|
|
3538
|
-
MindTransforms.setAbstractsByRefs(board, abstractRefs);
|
|
3539
|
-
const refs = deleteElementsHandleRightNodeCount(board, selectedElements);
|
|
3540
|
-
MindTransforms.setRightNodeCountByRefs(board, refs);
|
|
3541
|
-
MindTransforms.removeElements(board, selectedElements);
|
|
3542
|
-
let activeElement;
|
|
3543
|
-
const firstLevelElements = getFirstLevelElement(selectedElements);
|
|
3544
|
-
if (AbstractNode.isAbstract(firstLevelElements[0])) {
|
|
3545
|
-
const parent = MindElement.getParent(firstLevelElements[0]);
|
|
3546
|
-
activeElement = parent.children[firstLevelElements[0].start];
|
|
3547
|
-
}
|
|
3548
|
-
const firstElement = firstLevelElements[0];
|
|
3549
|
-
const firstElementParent = MindElement.findParent(firstElement);
|
|
3550
|
-
const hasSameParent = firstLevelElements.every(element => {
|
|
3551
|
-
return MindElement.findParent(element) === firstElementParent;
|
|
3552
|
-
});
|
|
3553
|
-
if (firstElementParent && hasSameParent && !activeElement) {
|
|
3554
|
-
const firstElementIndex = firstElementParent.children.indexOf(firstElement);
|
|
3555
|
-
const childrenCount = firstElementParent.children.length;
|
|
3556
|
-
// active parent element
|
|
3557
|
-
if (childrenCount === firstLevelElements.length) {
|
|
3558
|
-
activeElement = firstElementParent;
|
|
3559
|
-
}
|
|
3560
|
-
else {
|
|
3561
|
-
if (firstElementIndex > 0) {
|
|
3562
|
-
activeElement = firstElementParent.children[firstElementIndex - 1];
|
|
3563
|
-
}
|
|
3564
|
-
}
|
|
3565
|
-
}
|
|
3566
|
-
if (activeElement) {
|
|
3567
|
-
addSelectedElement(board, activeElement);
|
|
3568
|
-
}
|
|
3569
|
-
return;
|
|
3570
|
-
}
|
|
3571
|
-
// auto enter edit status
|
|
3572
|
-
if (!isVirtualKey(event)) {
|
|
3573
|
-
event.preventDefault();
|
|
3574
|
-
const selectedElement = selectedElements[0];
|
|
3575
|
-
editTopic(selectedElement);
|
|
3576
|
-
return;
|
|
3577
|
-
}
|
|
3578
|
-
}
|
|
3579
|
-
if (board.selection && event.code === 'Space') {
|
|
3580
|
-
if (selectedElements === null || selectedElements === void 0 ? void 0 : selectedElements.length) {
|
|
3581
|
-
return;
|
|
3582
|
-
}
|
|
3583
|
-
}
|
|
3584
|
-
keydown(event);
|
|
3585
|
-
};
|
|
3586
3578
|
board.dblclick = (event) => {
|
|
3587
3579
|
if (PlaitBoard.isReadonly(board)) {
|
|
3588
3580
|
dblclick(event);
|