@mdesignable/core 1.0.0-beta.64

package/lib/effects/useDragDropEffect.js

@@ -0,0 +1,172 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDragDropEffect = void 0;
+var models_1 = require("../models");
+var events_1 = require("../events");
+var shared_1 = require("@mdesignable/shared");
+var useDragDropEffect = function (engine) {
+    engine.subscribeTo(events_1.DragStartEvent, function (event) {
+        if (engine.cursor.type !== models_1.CursorType.Normal)
+            return;
+        var target = event.data.target;
+        var el = target === null || target === void 0 ? void 0 : target.closest("\n       *[".concat(engine.props.nodeIdAttrName, "],\n       *[").concat(engine.props.sourceIdAttrName, "],\n       *[").concat(engine.props.outlineNodeIdAttrName, "]\n      "));
+        var handler = target === null || target === void 0 ? void 0 : target.closest("*[".concat(engine.props.nodeDragHandlerAttrName, "]"));
+        var helper = handler === null || handler === void 0 ? void 0 : handler.closest("*[".concat(engine.props.nodeSelectionIdAttrName, "]"));
+        if (!(el === null || el === void 0 ? void 0 : el.getAttribute) && !handler)
+            return;
+        var sourceId = el === null || el === void 0 ? void 0 : el.getAttribute(engine.props.sourceIdAttrName);
+        var outlineId = el === null || el === void 0 ? void 0 : el.getAttribute(engine.props.outlineNodeIdAttrName);
+        var handlerId = helper === null || helper === void 0 ? void 0 : helper.getAttribute(engine.props.nodeSelectionIdAttrName);
+        var nodeId = el === null || el === void 0 ? void 0 : el.getAttribute(engine.props.nodeIdAttrName);
+        engine.workbench.eachWorkspace(function (currentWorkspace) {
+            var operation = currentWorkspace.operation;
+            var moveHelper = operation.moveHelper;
+            if (nodeId || outlineId || handlerId) {
+                var node_1 = engine.findNodeById(outlineId || nodeId || handlerId);
+                if (node_1) {
+                    if (!node_1.allowDrag())
+                        return;
+                    if (node_1 === node_1.root)
+                        return;
+                    var validSelected = engine
+                        .getAllSelectedNodes()
+                        .filter(function (node) { return node.allowDrag(); });
+                    if (validSelected.some(function (selectNode) { return selectNode === node_1; })) {
+                        moveHelper.dragStart({ dragNodes: models_1.TreeNode.sort(validSelected) });
+                    }
+                    else {
+                        moveHelper.dragStart({ dragNodes: [node_1] });
+                    }
+                }
+            }
+            else if (sourceId) {
+                var sourceNode = engine.findNodeById(sourceId);
+                if (sourceNode) {
+                    moveHelper.dragStart({ dragNodes: [sourceNode] });
+                }
+            }
+        });
+        engine.cursor.setStyle('move');
+    });
+    engine.subscribeTo(events_1.DragMoveEvent, function (event) {
+        if (engine.cursor.type !== models_1.CursorType.Normal)
+            return;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Move)
+            return;
+        var target = event.data.target;
+        var el = target === null || target === void 0 ? void 0 : target.closest("\n      *[".concat(engine.props.nodeIdAttrName, "],\n      *[").concat(engine.props.outlineNodeIdAttrName, "]\n    "));
+        var point = new shared_1.Point(event.data.topClientX, event.data.topClientY);
+        var nodeId = el === null || el === void 0 ? void 0 : el.getAttribute(engine.props.nodeIdAttrName);
+        var outlineId = el === null || el === void 0 ? void 0 : el.getAttribute(engine.props.outlineNodeIdAttrName);
+        engine.workbench.eachWorkspace(function (currentWorkspace) {
+            var operation = currentWorkspace.operation;
+            var moveHelper = operation.moveHelper;
+            var dragNodes = moveHelper.dragNodes;
+            var tree = operation.tree;
+            if (!dragNodes.length)
+                return;
+            var touchNode = tree.findById(outlineId || nodeId);
+            moveHelper.dragMove({
+                point: point,
+                touchNode: touchNode,
+            });
+        });
+    });
+    engine.subscribeTo(events_1.ViewportScrollEvent, function (event) {
+        var _a, _b;
+        if (engine.cursor.type !== models_1.CursorType.Normal)
+            return;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Move)
+            return;
+        var point = new shared_1.Point(engine.cursor.position.topClientX, engine.cursor.position.topClientY);
+        var currentWorkspace = (_b = (_a = event === null || event === void 0 ? void 0 : event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        if (!currentWorkspace)
+            return;
+        var operation = currentWorkspace.operation;
+        var moveHelper = operation.moveHelper;
+        if (!moveHelper.dragNodes.length)
+            return;
+        var tree = operation.tree;
+        var viewport = currentWorkspace.viewport;
+        var outline = currentWorkspace.outline;
+        var viewportTarget = viewport.elementFromPoint(point);
+        var outlineTarget = outline.elementFromPoint(point);
+        var viewportNodeElement = viewportTarget === null || viewportTarget === void 0 ? void 0 : viewportTarget.closest("\n      *[".concat(engine.props.nodeIdAttrName, "],\n      *[").concat(engine.props.outlineNodeIdAttrName, "]\n    "));
+        var outlineNodeElement = outlineTarget === null || outlineTarget === void 0 ? void 0 : outlineTarget.closest("\n    *[".concat(engine.props.nodeIdAttrName, "],\n    *[").concat(engine.props.outlineNodeIdAttrName, "]\n  "));
+        var nodeId = viewportNodeElement === null || viewportNodeElement === void 0 ? void 0 : viewportNodeElement.getAttribute(engine.props.nodeIdAttrName);
+        var outlineNodeId = outlineNodeElement === null || outlineNodeElement === void 0 ? void 0 : outlineNodeElement.getAttribute(engine.props.outlineNodeIdAttrName);
+        var touchNode = tree.findById(outlineNodeId || nodeId);
+        moveHelper.dragMove({ point: point, touchNode: touchNode });
+    });
+    engine.subscribeTo(events_1.DragStopEvent, function () {
+        if (engine.cursor.type !== models_1.CursorType.Normal)
+            return;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Move)
+            return;
+        engine.workbench.eachWorkspace(function (currentWorkspace) {
+            var operation = currentWorkspace.operation;
+            var moveHelper = operation.moveHelper;
+            var dragNodes = moveHelper.dragNodes;
+            var closestNode = moveHelper.closestNode;
+            var closestDirection = moveHelper.closestDirection;
+            var selection = operation.selection;
+            if (!dragNodes.length)
+                return;
+            if (dragNodes.length && closestNode && closestDirection) {
+                if (closestDirection === models_1.ClosestPosition.After ||
+                    closestDirection === models_1.ClosestPosition.Under) {
+                    if (closestNode.allowSibling(dragNodes)) {
+                        selection.batchSafeSelect(closestNode.insertAfter.apply(closestNode, __spreadArray([], __read(models_1.TreeNode.filterDroppable(dragNodes, closestNode.parent)), false)));
+                    }
+                }
+                else if (closestDirection === models_1.ClosestPosition.Before ||
+                    closestDirection === models_1.ClosestPosition.Upper) {
+                    if (closestNode.allowSibling(dragNodes)) {
+                        selection.batchSafeSelect(closestNode.insertBefore.apply(closestNode, __spreadArray([], __read(models_1.TreeNode.filterDroppable(dragNodes, closestNode.parent)), false)));
+                    }
+                }
+                else if (closestDirection === models_1.ClosestPosition.Inner ||
+                    closestDirection === models_1.ClosestPosition.InnerAfter) {
+                    if (closestNode.allowAppend(dragNodes)) {
+                        selection.batchSafeSelect(closestNode.append.apply(closestNode, __spreadArray([], __read(models_1.TreeNode.filterDroppable(dragNodes, closestNode)), false)));
+                        moveHelper.dragDrop({ dropNode: closestNode });
+                    }
+                }
+                else if (closestDirection === models_1.ClosestPosition.InnerBefore) {
+                    if (closestNode.allowAppend(dragNodes)) {
+                        selection.batchSafeSelect(closestNode.prepend.apply(closestNode, __spreadArray([], __read(models_1.TreeNode.filterDroppable(dragNodes, closestNode)), false)));
+                        moveHelper.dragDrop({ dropNode: closestNode });
+                    }
+                }
+            }
+            moveHelper.dragEnd();
+        });
+        engine.cursor.setStyle('');
+    });
+};
+exports.useDragDropEffect = useDragDropEffect;

package/lib/effects/useFreeSelectionEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useFreeSelectionEffect: (engine: Engine) => void;

package/lib/effects/useFreeSelectionEffect.js

@@ -0,0 +1,63 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFreeSelectionEffect = void 0;
+var events_1 = require("../events");
+var models_1 = require("../models");
+var shared_1 = require("@mdesignable/shared");
+var useFreeSelectionEffect = function (engine) {
+    engine.subscribeTo(events_1.DragStopEvent, function (event) {
+        if (engine.cursor.dragType !== models_1.CursorDragType.Move) {
+            return;
+        }
+        engine.workbench.eachWorkspace(function (workspace) {
+            var viewport = workspace.viewport;
+            var dragEndPoint = new shared_1.Point(event.data.topClientX, event.data.topClientY);
+            var dragStartOffsetPoint = viewport.getOffsetPoint(new shared_1.Point(engine.cursor.dragStartPosition.topClientX, engine.cursor.dragStartPosition.topClientY));
+            var dragEndOffsetPoint = viewport.getOffsetPoint(new shared_1.Point(engine.cursor.position.topClientX, engine.cursor.position.topClientY));
+            if (!viewport.isPointInViewport(dragEndPoint, false))
+                return;
+            var tree = workspace.operation.tree;
+            var selectionRect = (0, shared_1.calcRectByStartEndPoint)(dragStartOffsetPoint, dragEndOffsetPoint, viewport.dragScrollXDelta, viewport.dragScrollYDelta);
+            var selected = [];
+            tree.eachChildren(function (node) {
+                var nodeRect = viewport.getValidNodeOffsetRect(node);
+                if (nodeRect && (0, shared_1.isCrossRectInRect)(selectionRect, nodeRect)) {
+                    selected.push([node, nodeRect]);
+                }
+            });
+            var selectedNodes = selected.reduce(function (buf, _a) {
+                var _b = __read(_a, 2), node = _b[0], nodeRect = _b[1];
+                if ((0, shared_1.isRectInRect)(nodeRect, selectionRect)) {
+                    if (selected.some(function (_a) {
+                        var _b = __read(_a, 1), selectNode = _b[0];
+                        return selectNode.isMyParents(node);
+                    })) {
+                        return buf;
+                    }
+                }
+                return buf.concat(node);
+            }, []);
+            workspace.operation.selection.batchSafeSelect(selectedNodes);
+        });
+        if (engine.cursor.type === models_1.CursorType.Selection) {
+            engine.cursor.setType(models_1.CursorType.Normal);
+        }
+    });
+};
+exports.useFreeSelectionEffect = useFreeSelectionEffect;

package/lib/effects/useKeyboardEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useKeyboardEffect: (engine: Engine) => void;

package/lib/effects/useKeyboardEffect.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useKeyboardEffect = void 0;
+var events_1 = require("../events");
+var useKeyboardEffect = function (engine) {
+    engine.subscribeTo(events_1.KeyDownEvent, function (event) {
+        var keyboard = engine.keyboard;
+        if (!keyboard)
+            return;
+        var workspace = engine.workbench.activeWorkspace || engine.workbench.currentWorkspace;
+        keyboard.handleKeyboard(event, workspace.getEventContext());
+    });
+    engine.subscribeTo(events_1.KeyUpEvent, function (event) {
+        var keyboard = engine.keyboard;
+        if (!keyboard)
+            return;
+        var workspace = engine.workbench.activeWorkspace || engine.workbench.currentWorkspace;
+        keyboard.handleKeyboard(event, workspace.getEventContext());
+    });
+};
+exports.useKeyboardEffect = useKeyboardEffect;

package/lib/effects/useResizeEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useResizeEffect: (engine: Engine) => void;

package/lib/effects/useResizeEffect.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useResizeEffect = void 0;
+var models_1 = require("../models");
+var events_1 = require("../events");
+var useResizeEffect = function (engine) {
+    var findStartNodeHandler = function (target) {
+        var handler = target === null || target === void 0 ? void 0 : target.closest("*[".concat(engine.props.nodeResizeHandlerAttrName, "]"));
+        if (handler) {
+            var direction = handler.getAttribute(engine.props.nodeResizeHandlerAttrName);
+            if (direction) {
+                var element = handler.closest("*[".concat(engine.props.nodeSelectionIdAttrName, "]"));
+                if (element) {
+                    var nodeId = element.getAttribute(engine.props.nodeSelectionIdAttrName);
+                    if (nodeId) {
+                        var node = engine.findNodeById(nodeId);
+                        if (node) {
+                            return { direction: direction, node: node, element: element };
+                        }
+                    }
+                }
+            }
+        }
+        return;
+    };
+    engine.subscribeTo(events_1.DragStartEvent, function (event) {
+        var _a, _b;
+        var target = event.data.target;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        if (!currentWorkspace)
+            return;
+        var handler = findStartNodeHandler(target);
+        var helper = currentWorkspace.operation.transformHelper;
+        if (handler) {
+            var selectionElement = handler.element.closest("*[".concat(engine.props.nodeSelectionIdAttrName, "]"));
+            if (selectionElement) {
+                var nodeId = selectionElement.getAttribute(engine.props.nodeSelectionIdAttrName);
+                if (nodeId) {
+                    var node = engine.findNodeById(nodeId);
+                    if (node) {
+                        helper.dragStart({
+                            dragNodes: [node],
+                            type: 'resize',
+                            direction: handler.direction,
+                        });
+                    }
+                }
+            }
+        }
+    });
+    engine.subscribeTo(events_1.DragMoveEvent, function (event) {
+        var _a, _b;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Resize)
+            return;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        var helper = currentWorkspace === null || currentWorkspace === void 0 ? void 0 : currentWorkspace.operation.transformHelper;
+        var dragNodes = helper.dragNodes;
+        if (!dragNodes.length)
+            return;
+        helper.dragMove();
+        dragNodes.forEach(function (node) {
+            var element = node.getElement();
+            helper.resize(node, function (rect) {
+                element.style.width = rect.width + 'px';
+                element.style.height = rect.height + 'px';
+                element.style.position = 'absolute';
+                element.style.left = '0px';
+                element.style.top = '0px';
+                element.style.transform = "translate3d(".concat(rect.x, "px,").concat(rect.y, "px,0)");
+            });
+        });
+    });
+    engine.subscribeTo(events_1.DragStopEvent, function (event) {
+        var _a, _b;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Resize)
+            return;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        var helper = currentWorkspace === null || currentWorkspace === void 0 ? void 0 : currentWorkspace.operation.transformHelper;
+        if (helper) {
+            helper.dragEnd();
+        }
+    });
+};
+exports.useResizeEffect = useResizeEffect;

package/lib/effects/useSelectionEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useSelectionEffect: (engine: Engine) => void;

package/lib/effects/useSelectionEffect.js

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectionEffect = void 0;
+var models_1 = require("../models");
+var events_1 = require("../events");
+var shared_1 = require("@mdesignable/shared");
+var useSelectionEffect = function (engine) {
+    engine.subscribeTo(events_1.MouseClickEvent, function (event) {
+        var _a, _b, _c, _d;
+        if (engine.cursor.status !== models_1.CursorStatus.Normal)
+            return;
+        var target = event.data.target;
+        var el = (_a = target === null || target === void 0 ? void 0 : target.closest) === null || _a === void 0 ? void 0 : _a.call(target, "\n      *[".concat(engine.props.nodeIdAttrName, "],\n      *[").concat(engine.props.outlineNodeIdAttrName, "]\n    "));
+        var isHelpers = (_b = target === null || target === void 0 ? void 0 : target.closest) === null || _b === void 0 ? void 0 : _b.call(target, "*[".concat(engine.props.nodeSelectionIdAttrName, "]"));
+        var currentWorkspace = (_d = (_c = event.context) === null || _c === void 0 ? void 0 : _c.workspace) !== null && _d !== void 0 ? _d : engine.workbench.activeWorkspace;
+        if (!currentWorkspace)
+            return;
+        if (!(el === null || el === void 0 ? void 0 : el.getAttribute)) {
+            var point = new shared_1.Point(event.data.topClientX, event.data.topClientY);
+            var operation_1 = currentWorkspace.operation;
+            var viewport = currentWorkspace.viewport;
+            var outline = currentWorkspace.outline;
+            var isInViewport = viewport.isPointInViewport(point, false);
+            var isInOutline = outline.isPointInViewport(point, false);
+            if (isHelpers)
+                return;
+            if (isInViewport || isInOutline) {
+                var selection_1 = operation_1.selection;
+                var tree_1 = operation_1.tree;
+                selection_1.select(tree_1);
+            }
+            return;
+        }
+        var nodeId = el.getAttribute(engine.props.nodeIdAttrName);
+        var structNodeId = el.getAttribute(engine.props.outlineNodeIdAttrName);
+        var operation = currentWorkspace.operation;
+        var selection = operation.selection;
+        var tree = operation.tree;
+        var node = tree.findById(nodeId || structNodeId);
+        if (node) {
+            engine.keyboard.requestClean();
+            if (engine.keyboard.isKeyDown(shared_1.KeyCode.Meta) ||
+                engine.keyboard.isKeyDown(shared_1.KeyCode.Control)) {
+                if (selection.has(node)) {
+                    if (selection.selected.length > 1) {
+                        selection.remove(node);
+                    }
+                }
+                else {
+                    selection.add(node);
+                }
+            }
+            else if (engine.keyboard.isKeyDown(shared_1.KeyCode.Shift)) {
+                if (selection.has(node)) {
+                    if (selection.selected.length > 1) {
+                        selection.remove(node);
+                    }
+                }
+                else {
+                    selection.crossAddTo(node);
+                }
+            }
+            else {
+                selection.select(node);
+            }
+        }
+        else {
+            selection.select(tree);
+        }
+    });
+};
+exports.useSelectionEffect = useSelectionEffect;

package/lib/effects/useTranslateEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useTranslateEffect: (engine: Engine) => void;

package/lib/effects/useTranslateEffect.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTranslateEffect = void 0;
+var models_1 = require("../models");
+var events_1 = require("../events");
+var useTranslateEffect = function (engine) {
+    engine.subscribeTo(events_1.DragStartEvent, function (event) {
+        var _a, _b;
+        var target = event.data.target;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        var handler = target === null || target === void 0 ? void 0 : target.closest("*[".concat(engine.props.nodeTranslateAttrName, "]"));
+        if (!currentWorkspace)
+            return;
+        var helper = currentWorkspace.operation.transformHelper;
+        if (handler) {
+            var type = handler.getAttribute(engine.props.nodeTranslateAttrName);
+            if (type) {
+                var selectionElement = handler.closest("*[".concat(engine.props.nodeSelectionIdAttrName, "]"));
+                if (selectionElement) {
+                    var nodeId = selectionElement.getAttribute(engine.props.nodeSelectionIdAttrName);
+                    if (nodeId) {
+                        var node = engine.findNodeById(nodeId);
+                        if (node) {
+                            helper.dragStart({ dragNodes: [node], type: 'translate' });
+                        }
+                    }
+                }
+            }
+        }
+    });
+    engine.subscribeTo(events_1.DragMoveEvent, function (event) {
+        var _a, _b;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Translate)
+            return;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        var helper = currentWorkspace === null || currentWorkspace === void 0 ? void 0 : currentWorkspace.operation.transformHelper;
+        var dragNodes = helper.dragNodes;
+        if (!dragNodes.length)
+            return;
+        helper.dragMove();
+        dragNodes.forEach(function (node) {
+            var element = node.getElement();
+            helper.translate(node, function (translate) {
+                element.style.position = 'absolute';
+                element.style.left = '0px';
+                element.style.top = '0px';
+                element.style.transform = "translate3d(".concat(translate.x, "px,").concat(translate.y, "px,0)");
+            });
+        });
+    });
+    engine.subscribeTo(events_1.DragStopEvent, function (event) {
+        var _a, _b;
+        if (engine.cursor.dragType !== models_1.CursorDragType.Translate)
+            return;
+        var currentWorkspace = (_b = (_a = event.context) === null || _a === void 0 ? void 0 : _a.workspace) !== null && _b !== void 0 ? _b : engine.workbench.activeWorkspace;
+        var helper = currentWorkspace === null || currentWorkspace === void 0 ? void 0 : currentWorkspace.operation.transformHelper;
+        if (helper) {
+            helper.dragEnd();
+        }
+    });
+};
+exports.useTranslateEffect = useTranslateEffect;

package/lib/effects/useViewportEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useViewportEffect: (engine: Engine) => void;

package/lib/effects/useViewportEffect.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useViewportEffect = void 0;
+var events_1 = require("../events");
+var useViewportEffect = function (engine) {
+    engine.subscribeTo(events_1.ViewportResizeEvent, function (event) {
+        var _a;
+        var currentWorkspace = (_a = event === null || event === void 0 ? void 0 : event.context) === null || _a === void 0 ? void 0 : _a.workspace;
+        if (!currentWorkspace)
+            return;
+        var viewport = currentWorkspace.viewport;
+        var outline = currentWorkspace.outline;
+        if (viewport.matchViewport(event.data.target)) {
+            viewport.digestViewport();
+        }
+        if (outline.matchViewport(event.data.target)) {
+            outline.digestViewport();
+        }
+    });
+    engine.subscribeTo(events_1.ViewportScrollEvent, function (event) {
+        var _a;
+        var currentWorkspace = (_a = event === null || event === void 0 ? void 0 : event.context) === null || _a === void 0 ? void 0 : _a.workspace;
+        if (!currentWorkspace)
+            return;
+        var viewport = currentWorkspace.viewport;
+        var outline = currentWorkspace.outline;
+        if (viewport.matchViewport(event.data.target)) {
+            viewport.digestViewport();
+        }
+        if (outline.matchViewport(event.data.target)) {
+            outline.digestViewport();
+        }
+    });
+};
+exports.useViewportEffect = useViewportEffect;

package/lib/effects/useWorkspaceEffect.d.ts

@@ -0,0 +1,2 @@
+import { Engine } from '../models';
+export declare const useWorkspaceEffect: (engine: Engine) => void;

package/lib/effects/useWorkspaceEffect.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useWorkspaceEffect = void 0;
+var events_1 = require("../events");
+var useWorkspaceEffect = function (engine) {
+    engine.subscribeWith([
+        'append:node',
+        'insert:after',
+        'insert:before',
+        'insert:children',
+        'drag:node',
+        'drop:node',
+        'prepend:node',
+        'remove:node',
+        'select:node',
+        'update:children',
+        'wrap:node',
+        'update:node:props',
+    ], function (event) {
+        var _a;
+        if ((_a = event.context) === null || _a === void 0 ? void 0 : _a.workbench) {
+            engine.workbench.setActiveWorkspace(event.context.workspace);
+        }
+    });
+    engine.subscribeTo(events_1.SelectNodeEvent, function (event) {
+        engine.workbench.eachWorkspace(function (workspace) {
+            if (workspace !== event.context.workspace) {
+                workspace.operation.selection.clear();
+            }
+        });
+    });
+};
+exports.useWorkspaceEffect = useWorkspaceEffect;

package/lib/events/cursor/AbstractCursorEvent.d.ts

@@ -0,0 +1,21 @@
+import { IEngineContext } from '../../types';
+export interface ICursorEventOriginData {
+    clientX: number;
+    clientY: number;
+    pageX: number;
+    pageY: number;
+    target: EventTarget;
+    view: Window;
+}
+export interface ICursorEventData extends ICursorEventOriginData {
+    topClientX?: number;
+    topClientY?: number;
+    topPageX?: number;
+    topPageY?: number;
+}
+export declare class AbstractCursorEvent {
+    data: ICursorEventData;
+    context: IEngineContext;
+    constructor(data: ICursorEventOriginData);
+    transformCoordinates(): void;
+}

package/lib/events/cursor/AbstractCursorEvent.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AbstractCursorEvent = void 0;
+var shared_1 = require("@mdesignable/shared");
+var AbstractCursorEvent = /** @class */ (function () {
+    function AbstractCursorEvent(data) {
+        this.data = data || {
+            clientX: 0,
+            clientY: 0,
+            pageX: 0,
+            pageY: 0,
+            target: null,
+            view: shared_1.globalThisPolyfill,
+        };
+        this.transformCoordinates();
+    }
+    AbstractCursorEvent.prototype.transformCoordinates = function () {
+        var _a;
+        var frameElement = (((_a = this.data) === null || _a === void 0 ? void 0 : _a.view) || {}).frameElement;
+        if (frameElement && this.data.view !== shared_1.globalThisPolyfill) {
+            var frameRect = frameElement.getBoundingClientRect();
+            var scale = frameRect.width / frameElement['offsetWidth'];
+            this.data.topClientX = this.data.clientX * scale + frameRect.x;
+            this.data.topClientY = this.data.clientY * scale + frameRect.y;
+            this.data.topPageX =
+                this.data.pageX + frameRect.x - this.data.view.scrollX;
+            this.data.topPageY =
+                this.data.pageY + frameRect.y - this.data.view.scrollY;
+            var topElement = document.elementFromPoint(this.data.topPageX, this.data.topClientY);
+            if (topElement !== frameElement) {
+                this.data.target = topElement;
+            }
+        }
+        else {
+            this.data.topClientX = this.data.clientX;
+            this.data.topClientY = this.data.clientY;
+            this.data.topPageX = this.data.pageX;
+            this.data.topPageY = this.data.pageY;
+        }
+    };
+    return AbstractCursorEvent;
+}());
+exports.AbstractCursorEvent = AbstractCursorEvent;

package/lib/events/cursor/DragMoveEvent.d.ts

@@ -0,0 +1,5 @@
+import { ICustomEvent } from '@mdesignable/shared';
+import { AbstractCursorEvent } from './AbstractCursorEvent';
+export declare class DragMoveEvent extends AbstractCursorEvent implements ICustomEvent {
+    type: string;
+}