@eclipse-glsp/client 2.3.0-next.322 → 2.3.0-next.366

package/src/features/tools/edge-edit/edge-edit-tool.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2023 EclipseSource and others.
+ * Copyright (c) 2019-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -18,7 +18,6 @@ import {
     AnchorComputerRegistry,
     ChangeRoutingPointsOperation,
     Connectable,
-    Disposable,
     EdgeRouterRegistry,
     GModelElement,
     GModelRoot,
@@ -33,11 +32,12 @@ import {
 import { inject, injectable, optional } from 'inversify';
 import { DragAwareMouseListener } from '../../../base/drag-aware-mouse-listener';
 import { CursorCSS, cursorFeedbackAction } from '../../../base/feedback/css-feedback';
+import { FeedbackEmitter } from '../../../base/feedback/feedback-emitter';
 import { ISelectionListener, SelectionService } from '../../../base/selection-service';
 import { calcElementAndRoutingPoints, isRoutable, isRoutingHandle } from '../../../utils/gmodel-util';
-import { PositionSnapper } from '../../change-bounds/position-snapper';
 import { GReconnectHandle, isReconnectHandle, isReconnectable, isSourceRoutingHandle, isTargetRoutingHandle } from '../../reconnect/model';
 import { BaseEditTool } from '../base-tools';
+import { ChangeBoundsManager } from '../change-bounds/change-bounds-manager';
 import { DrawFeedbackEdgeAction, RemoveFeedbackEdgeAction, feedbackEdgeId } from '../edge-creation/dangling-edge-feedback';
 import {
     DrawFeedbackEdgeSourceAction,
@@ -56,7 +56,7 @@ export class EdgeEditTool extends BaseEditTool {
     @inject(SelectionService) protected selectionService: SelectionService;
     @inject(AnchorComputerRegistry) protected anchorRegistry: AnchorComputerRegistry;
     @inject(EdgeRouterRegistry) @optional() readonly edgeRouterRegistry?: EdgeRouterRegistry;
-    @inject(PositionSnapper) readonly positionSnapper: PositionSnapper;
+    @inject(ChangeBoundsManager) readonly changeBoundsManager: ChangeBoundsManager;
 
     protected feedbackEdgeSourceMovingListener: FeedbackEdgeSourceMovingMouseListener;
     protected feedbackEdgeTargetMovingListener: FeedbackEdgeTargetMovingMouseListener;
@@ -73,13 +73,14 @@ export class EdgeEditTool extends BaseEditTool {
         // install feedback move mouse listener for client-side move updates
         this.feedbackEdgeSourceMovingListener = new FeedbackEdgeSourceMovingMouseListener(this.anchorRegistry, this.feedbackDispatcher);
         this.feedbackEdgeTargetMovingListener = new FeedbackEdgeTargetMovingMouseListener(this.anchorRegistry, this.feedbackDispatcher);
-        this.feedbackMovingListener = new FeedbackEdgeRouteMovingMouseListener(this.positionSnapper, this.edgeRouterRegistry);
+        this.feedbackMovingListener = new FeedbackEdgeRouteMovingMouseListener(this.changeBoundsManager, this.edgeRouterRegistry);
 
         this.toDisposeOnDisable.push(
-            Disposable.create(() => this.edgeEditListener.reset()),
+            this.edgeEditListener,
             this.mouseTool.registerListener(this.edgeEditListener),
             this.feedbackEdgeSourceMovingListener,
             this.feedbackEdgeTargetMovingListener,
+            this.feedbackMovingListener,
             this.selectionService.onSelectionChanged(change => this.edgeEditListener.selectionChanged(change.root, change.selectedElements))
         );
     }
@@ -110,8 +111,13 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
     // active reconnect handle data
     protected reconnectMode?: 'NEW_SOURCE' | 'NEW_TARGET';
 
+    protected cursorFeedback: FeedbackEmitter;
+    protected editFeedback: FeedbackEmitter;
+
     constructor(protected tool: EdgeEditTool) {
         super();
+        this.cursorFeedback = this.tool.createFeedbackEmitter();
+        this.editFeedback = this.tool.createFeedbackEmitter();
     }
 
     protected isValidEdge(edge?: GRoutableElement): edge is GRoutableElement {
@@ -119,21 +125,21 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
     }
 
     protected setEdgeSelected(edge: GRoutableElement): void {
-        if (this.edge && this.edge.id !== edge.id) {
-            // reset from a previously selected edge
-            this.reset();
-        }
-
         this.edge = edge;
         // note: order is important here as we want the reconnect handles to cover the routing handles
-        const feedbackActions = [];
         if (canEditRouting(edge)) {
-            feedbackActions.push(SwitchRoutingModeAction.create({ elementsToActivate: [this.edge.id] }));
+            this.editFeedback.add(
+                SwitchRoutingModeAction.create({ elementsToActivate: [this.edge.id] }),
+                SwitchRoutingModeAction.create({ elementsToDeactivate: [this.edge.id] })
+            );
         }
         if (isReconnectable(edge)) {
-            feedbackActions.push(ShowEdgeReconnectHandlesFeedbackAction.create(this.edge.id));
+            this.editFeedback.add(
+                ShowEdgeReconnectHandlesFeedbackAction.create(this.edge.id),
+                HideEdgeReconnectHandlesFeedbackAction.create()
+            );
         }
-        this.tool.registerFeedback(feedbackActions);
+        this.editFeedback.submit();
     }
 
     protected isEdgeSelected(): boolean {
@@ -142,19 +148,24 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
 
     protected setReconnectHandleSelected(edge: GRoutableElement, reconnectHandle: GReconnectHandle): void {
         if (this.edge && this.edge.target && this.edge.source) {
+            this.editFeedback.dispose();
             if (isSourceRoutingHandle(edge, reconnectHandle)) {
-                this.tool.registerFeedback([
-                    HideEdgeReconnectHandlesFeedbackAction.create(),
-                    cursorFeedbackAction(CursorCSS.EDGE_RECONNECT),
-                    DrawFeedbackEdgeSourceAction.create({ elementTypeId: this.edge.type, targetId: this.edge.targetId })
-                ]);
+                this.editFeedback
+                    .add(cursorFeedbackAction(CursorCSS.EDGE_RECONNECT), cursorFeedbackAction())
+                    .add(
+                        DrawFeedbackEdgeSourceAction.create({ elementTypeId: this.edge.type, targetId: this.edge.targetId }),
+                        RemoveFeedbackEdgeAction.create()
+                    )
+                    .submit();
                 this.reconnectMode = 'NEW_SOURCE';
             } else if (isTargetRoutingHandle(edge, reconnectHandle)) {
-                this.tool.registerFeedback([
-                    HideEdgeReconnectHandlesFeedbackAction.create(),
-                    cursorFeedbackAction(CursorCSS.EDGE_CREATION_TARGET),
-                    DrawFeedbackEdgeAction.create({ elementTypeId: this.edge.type, sourceId: this.edge.sourceId })
-                ]);
+                this.editFeedback
+                    .add(cursorFeedbackAction(CursorCSS.EDGE_CREATION_TARGET), cursorFeedbackAction())
+                    .add(
+                        DrawFeedbackEdgeAction.create({ elementTypeId: this.edge.type, sourceId: this.edge.sourceId }),
+                        RemoveFeedbackEdgeAction.create()
+                    )
+                    .submit();
                 this.reconnectMode = 'NEW_TARGET';
             }
         }
@@ -204,22 +215,20 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
                 this.setRoutingHandleSelected(edge, routingHandle);
             } else if (this.isValidEdge(edge)) {
                 // PHASE 1: Select edge
+                this.dispose();
                 this.tool.registerFeedbackListeners();
                 this.setEdgeSelected(edge);
             }
         } else if (event.button === 2) {
-            this.reset();
+            this.dispose();
         }
         return result;
     }
 
-    override mouseMove(target: GModelElement, event: MouseEvent): Action[] {
-        const result = super.mouseMove(target, event);
-        if (this.isMouseDrag) {
-            // reset any selected connectables when we are dragging, maybe the user is just panning
-            this.setNewConnectable(undefined);
-        }
-        return result;
+    protected override draggingMouseMove(target: GModelElement, event: MouseEvent): Action[] {
+        // reset any selected connectables when we are dragging, maybe the user is just panning
+        this.setNewConnectable(undefined);
+        return super.draggingMouseMove(target, event);
     }
 
     override mouseUp(target: GModelElement, event: MouseEvent): Action[] {
@@ -234,7 +243,7 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
             if (this.requiresReconnect(sourceElementId, targetElementId)) {
                 result.push(ReconnectEdgeOperation.create({ edgeElementId: this.edge.id, sourceElementId, targetElementId }));
             }
-            this.reset();
+            this.dispose();
         } else if (this.edge && this.routingHandle) {
             // we need to re-retrieve the edge as it might have changed due to a server update since we do not reset the state between
             // reroute actions
@@ -258,11 +267,11 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
                         (this.reconnectMode === 'NEW_SOURCE' && currentTarget.canConnect(this.edge, 'source')) ||
                         (this.reconnectMode === 'NEW_TARGET' && currentTarget.canConnect(this.edge, 'target'))
                     ) {
-                        this.tool.registerFeedback([cursorFeedbackAction(CursorCSS.EDGE_RECONNECT)]);
+                        this.cursorFeedback.add(cursorFeedbackAction(CursorCSS.EDGE_RECONNECT), cursorFeedbackAction()).submit();
                         return [];
                     }
                 }
-                this.tool.registerFeedback([cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED)]);
+                this.cursorFeedback.add(cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED), cursorFeedbackAction()).submit();
             }
         }
         return [];
@@ -292,30 +301,18 @@ export class EdgeEditListener extends DragAwareMouseListener implements ISelecti
                     }
                 }
             }
-
-            this.reset();
+            this.dispose();
         }
     }
 
-    public reset(): void {
-        this.resetFeedback();
-        this.resetData();
-    }
-
-    protected resetData(): void {
+    override dispose(): void {
         this.edge = undefined;
         this.reconnectMode = undefined;
         this.newConnectable = undefined;
         this.routingHandle = undefined;
-    }
-
-    protected resetFeedback(): void {
-        const result: Action[] = [];
-        if (this.edge) {
-            result.push(SwitchRoutingModeAction.create({ elementsToDeactivate: [this.edge.id] }));
-        }
-        result.push(...[HideEdgeReconnectHandlesFeedbackAction.create(), cursorFeedbackAction(), RemoveFeedbackEdgeAction.create()]);
-        this.tool.deregisterFeedback(undefined, result);
+        this.cursorFeedback.dispose();
+        this.editFeedback.dispose();
         this.tool.deregisterFeedbackListeners();
+        super.dispose();
     }
 }

package/src/features/tools/marquee-selection/marquee-behavior.spec.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2021-2023 EclipseSource and others.
+ * Copyright (c) 2021-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -14,12 +14,13 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
+import { DOMHelper } from '@eclipse-glsp/sprotty';
 import { expect } from 'chai';
 import { IMarqueeBehavior, MarqueeUtil } from './marquee-behavior';
 
 describe('MarqueeUtil', () => {
     function initUtil(marqueeBehavior?: IMarqueeBehavior): MarqueeUtil {
-        const util = new MarqueeUtil(marqueeBehavior);
+        const util = new MarqueeUtil(marqueeBehavior, new DOMHelper());
         util.updateStartPoint({ x: 0, y: 0 });
         util.updateCurrentPoint({ x: 0, y: 0 });
         return util;

package/src/features/tools/marquee-selection/marquee-behavior.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2021-2023 EclipseSource and others.
+ * Copyright (c) 2021-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -14,7 +14,24 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Bounds, Point, PointToPointLine } from '@eclipse-glsp/sprotty';
+import {
+    Bounds,
+    DOMHelper,
+    GModelElement,
+    GModelRoot,
+    GNode,
+    Point,
+    PointToPointLine,
+    TYPES,
+    TypeGuard,
+    isSelectable,
+    toTypeGuard,
+    typeGuard
+} from '@eclipse-glsp/sprotty';
+import { inject, injectable, optional } from 'inversify';
+import { GEdge } from '../../../model';
+import { BoundsAwareModelElement, getMatchingElements, isSelectableAndBoundsAware } from '../../../utils/gmodel-util';
+import { toAbsoluteBounds } from '../../../utils/viewpoint-util';
 import { DrawMarqueeAction } from './marquee-tool-feedback';
 
 export interface IMarqueeBehavior {
@@ -22,17 +39,36 @@ export interface IMarqueeBehavior {
     readonly entireEdge: boolean;
 }
 
+@injectable()
 export class MarqueeUtil {
     protected startPoint: Point;
     protected currentPoint: Point;
-    protected marqueeBehavior: IMarqueeBehavior;
 
-    constructor(marqueeBehavior?: IMarqueeBehavior) {
-        if (marqueeBehavior) {
-            this.marqueeBehavior = marqueeBehavior;
-        } else {
-            this.marqueeBehavior = { entireElement: false, entireEdge: false };
-        }
+    constructor(
+        @inject(TYPES.IMarqueeBehavior)
+        @optional()
+        protected marqueeBehavior: IMarqueeBehavior = { entireElement: false, entireEdge: false },
+        @inject(TYPES.DOMHelper) protected domHelper: DOMHelper
+    ) {}
+
+    isContinuousMode(element: GModelElement, event: MouseEvent): boolean {
+        return event.shiftKey;
+    }
+
+    getMarkableNodes(root: GModelRoot): BoundsAwareModelElement[] {
+        return getMatchingElements(root.index, this.isMarkableNode());
+    }
+
+    protected isMarkableNode(): TypeGuard<BoundsAwareModelElement> {
+        return typeGuard(toTypeGuard(GNode), isSelectableAndBoundsAware);
+    }
+
+    getMarkableEdges(root: GModelRoot): GEdge[] {
+        return getMatchingElements(root.index, this.isMarkableEdge());
+    }
+
+    protected isMarkableEdge(): TypeGuard<GEdge> {
+        return typeGuard(toTypeGuard(GEdge), isSelectable);
     }
 
     updateStartPoint(position: Point): void {
@@ -43,10 +79,32 @@ export class MarqueeUtil {
         this.currentPoint = position;
     }
 
+    isMarked(element: BoundsAwareModelElement | GEdge): boolean {
+        return element instanceof GEdge ? this.isMarkedEdge(element) : this.isMarkedNode(element);
+    }
+
     drawMarqueeAction(): DrawMarqueeAction {
         return DrawMarqueeAction.create({ startPoint: this.startPoint, endPoint: this.currentPoint });
     }
 
+    protected isMarkedEdge(edge: GEdge): boolean {
+        const domId = this.domHelper.createUniqueDOMElementId(edge);
+        const domEdge = document.getElementById(domId) as unknown as SVGElement | undefined;
+        if (!domEdge || domEdge.getAttribute('transform') || !domEdge.children[0]) {
+            return false;
+        }
+        const path = domEdge.children[0].getAttribute('d');
+        return this.isEdgePathMarked(path);
+    }
+
+    protected isMarkedNode(node: BoundsAwareModelElement): boolean {
+        return this.isNodeMarked(this.getNodeBounds(node));
+    }
+
+    protected getNodeBounds(node: BoundsAwareModelElement): Bounds {
+        return toAbsoluteBounds(node);
+    }
+
     isEdgePathMarked(path: string | null): boolean {
         if (!path) {
             return false;

package/src/features/tools/marquee-selection/marquee-mouse-tool.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2021-2023 EclipseSource and others.
+ * Copyright (c) 2021-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -13,35 +13,23 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import {
-    Action,
-    BoundsAware,
-    DOMHelper,
-    GModelElement,
-    GModelRoot,
-    GNode,
-    KeyListener,
-    SelectAction,
-    TYPES,
-    isSelectable,
-    isSelected
-} from '@eclipse-glsp/sprotty';
-import { inject, injectable, optional } from 'inversify';
+import { Action, GModelElement, GModelRoot, KeyListener, SelectAction, isSelected, typeGuard } from '@eclipse-glsp/sprotty';
+import { inject, injectable } from 'inversify';
 import { DragAwareMouseListener } from '../../../base/drag-aware-mouse-listener';
 import { CursorCSS, cursorFeedbackAction } from '../../../base/feedback/css-feedback';
 import { EnableDefaultToolsAction } from '../../../base/tool-manager/tool';
-import { getAbsolutePosition, toAbsoluteBounds } from '../../../utils/viewpoint-util';
+import { GEdge } from '../../../model';
+import { BoundsAwareModelElement, getMatchingElements, isSelectableAndBoundsAware } from '../../../utils/gmodel-util';
+import { getAbsolutePosition } from '../../../utils/viewpoint-util';
 import { BaseEditTool } from '../base-tools';
-import { IMarqueeBehavior, MarqueeUtil } from './marquee-behavior';
+import { MarqueeUtil } from './marquee-behavior';
 import { RemoveMarqueeAction } from './marquee-tool-feedback';
-import { GEdge } from '../../../model';
 
 @injectable()
 export class MarqueeMouseTool extends BaseEditTool {
     static ID = 'glsp.marquee-mouse-tool';
 
-    @inject(TYPES.DOMHelper) protected domHelper: DOMHelper;
-    @inject(TYPES.IMarqueeBehavior) @optional() protected marqueeBehavior: IMarqueeBehavior;
+    @inject(MarqueeUtil) protected marqueeUtil: MarqueeUtil;
 
     protected shiftKeyListener: ShiftKeyListener = new ShiftKeyListener();
 
@@ -51,53 +39,38 @@ export class MarqueeMouseTool extends BaseEditTool {
 
     enable(): void {
         this.toDisposeOnDisable.push(
-            this.mouseTool.registerListener(new MarqueeMouseListener(this.domHelper, this.editorContext.modelRoot, this.marqueeBehavior)),
+            this.mouseTool.registerListener(new MarqueeMouseListener(this.editorContext.modelRoot, this.marqueeUtil)),
             this.keyTool.registerListener(this.shiftKeyListener),
-            this.registerFeedback([cursorFeedbackAction(CursorCSS.MARQUEE)], this, [cursorFeedbackAction()])
+            this.createFeedbackEmitter().add(cursorFeedbackAction(CursorCSS.MARQUEE), cursorFeedbackAction()).submit()
         );
     }
+
+    override get isEditTool(): boolean {
+        return false;
+    }
 }
 
 export class MarqueeMouseListener extends DragAwareMouseListener {
-    protected domHelper: DOMHelper;
-    protected marqueeUtil: MarqueeUtil;
-    protected nodes: (GModelElement & BoundsAware)[];
-    protected edges: SVGGElement[];
+    protected nodes: BoundsAwareModelElement[];
+    protected edges: GEdge[];
     protected previouslySelected: string[];
     protected isActive = false;
 
-    constructor(domHelper: DOMHelper, root: GModelRoot, marqueeBehavior: IMarqueeBehavior | undefined) {
+    constructor(
+        root: GModelRoot,
+        protected marqueeUtil: MarqueeUtil
+    ) {
         super();
-        this.domHelper = domHelper;
-        this.marqueeUtil = new MarqueeUtil(marqueeBehavior);
-        this.nodes = Array.from(
-            root.index
-                .all()
-                .map(e => e as GModelElement & BoundsAware)
-                .filter(e => isSelectable(e))
-                .filter(e => e instanceof GNode)
-        );
-        const sEdges = Array.from(
-            root.index
-                .all()
-                .filter(e => e instanceof GEdge)
-                .filter(e => isSelectable(e))
-                .map(e => e.id)
-        );
-        this.edges = Array.from(document.querySelectorAll('g')).filter(e => sEdges.includes(this.domHelper.findSModelIdByDOMElement(e)));
+        // pre-calculate all markable node and edges to improve performance
+        this.nodes = this.marqueeUtil.getMarkableNodes(root);
+        this.edges = this.marqueeUtil.getMarkableEdges(root);
     }
 
     override mouseDown(target: GModelElement, event: MouseEvent): Action[] {
         this.isActive = true;
         this.marqueeUtil.updateStartPoint(getAbsolutePosition(target, event));
         if (event.ctrlKey) {
-            this.previouslySelected = Array.from(
-                target.root.index
-                    .all()
-                    .map(e => e as GModelElement & BoundsAware)
-                    .filter(e => isSelected(e))
-                    .map(e => e.id)
-            );
+            this.previouslySelected = getMatchingElements(target.index, typeGuard(isSelectableAndBoundsAware, isSelected)).map(e => e.id);
         }
         return [];
     }
@@ -105,30 +78,20 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     override mouseMove(target: GModelElement, event: MouseEvent): Action[] {
         this.marqueeUtil.updateCurrentPoint(getAbsolutePosition(target, event));
         if (this.isActive) {
-            const nodeIdsSelected = this.nodes.filter(e => this.marqueeUtil.isNodeMarked(toAbsoluteBounds(e))).map(e => e.id);
-            const edgeIdsSelected = this.edges.filter(e => this.isEdgeMarked(e)).map(e => this.domHelper.findSModelIdByDOMElement(e));
-            const selected = nodeIdsSelected.concat(edgeIdsSelected);
-            return [SelectAction.setSelection(selected.concat(this.previouslySelected)), this.marqueeUtil.drawMarqueeAction()];
+            const nodeIdsSelected = this.nodes.filter(e => this.marqueeUtil.isMarked(e)).map(e => e.id);
+            const edgeIdsSelected = this.edges.filter(e => this.marqueeUtil.isMarked(e)).map(e => e.id);
+            const currentSelected = nodeIdsSelected.concat(edgeIdsSelected);
+            const selection = currentSelected.concat(this.previouslySelected);
+            return [SelectAction.setSelection(selection), this.marqueeUtil.drawMarqueeAction()];
         }
         return [];
     }
 
-    override mouseUp(_target: GModelElement, event: MouseEvent): Action[] {
+    override mouseUp(target: GModelElement, event: MouseEvent): Action[] {
         this.isActive = false;
-        if (event.shiftKey) {
-            return [RemoveMarqueeAction.create()];
-        }
-        return [RemoveMarqueeAction.create(), EnableDefaultToolsAction.create()];
-    }
-
-    isEdgeMarked(element: SVGElement): boolean {
-        if (!element.getAttribute('transform')) {
-            if (element.children[0]) {
-                const path = element.children[0].getAttribute('d');
-                return this.marqueeUtil.isEdgePathMarked(path);
-            }
-        }
-        return false;
+        return this.marqueeUtil.isContinuousMode(target, event)
+            ? [RemoveMarqueeAction.create()]
+            : [RemoveMarqueeAction.create(), EnableDefaultToolsAction.create()];
     }
 }
 

package/src/features/tools/marquee-selection/marquee-selection-module.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2023 EclipseSource and others.
+ * Copyright (c) 2019-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -19,14 +19,19 @@ import { MarqueeTool } from './marquee-tool';
 import { DrawMarqueeCommand, MARQUEE, RemoveMarqueeCommand } from './marquee-tool-feedback';
 import { MarqueeNode } from './model';
 import { MarqueeView } from './view';
+import { MarqueeUtil } from './marquee-behavior';
 
-export const marqueeSelectionToolModule = new FeatureModule((bind, unbind, isBound, rebind) => {
-    const context = { bind, unbind, isBound, rebind };
-    bindAsService(context, TYPES.IDefaultTool, MarqueeTool);
-    bindAsService(context, TYPES.ITool, MarqueeMouseTool);
+export const marqueeSelectionToolModule = new FeatureModule(
+    (bind, unbind, isBound, rebind) => {
+        const context = { bind, unbind, isBound, rebind };
+        context.bind(MarqueeUtil).toSelf().inSingletonScope();
+        bindAsService(context, TYPES.IDefaultTool, MarqueeTool);
+        bindAsService(context, TYPES.ITool, MarqueeMouseTool);
 
-    configureCommand(context, DrawMarqueeCommand);
-    configureCommand(context, RemoveMarqueeCommand);
+        configureCommand(context, DrawMarqueeCommand);
+        configureCommand(context, RemoveMarqueeCommand);
 
-    configureModelElement(context, MARQUEE, MarqueeNode, MarqueeView);
-});
+        configureModelElement(context, MARQUEE, MarqueeNode, MarqueeView);
+    },
+    { featureId: Symbol('marqueeSelectionTool') }
+);

package/src/features/tools/marquee-selection/view.tsx

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2021-2023 EclipseSource and others.
+ * Copyright (c) 2021-2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -13,14 +13,12 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+/** @jsx svg */
+import { RectangularNodeView, RenderingContext, svg } from '@eclipse-glsp/sprotty';
 import { injectable } from 'inversify';
 import { VNode } from 'snabbdom';
-import { RectangularNodeView, RenderingContext, svg } from '@eclipse-glsp/sprotty';
 import { MarqueeNode } from './model';
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const JSX = { createElement: svg };
-
 @injectable()
 export class MarqueeView extends RectangularNodeView {
     override render(node: MarqueeNode, context: RenderingContext): VNode {

package/src/features/tools/node-creation/container-manager.ts

@@ -0,0 +1,78 @@
+/********************************************************************************
+ * Copyright (c) 2024 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { GModelElement, Point, findChildrenAtPosition } from '@eclipse-glsp/sprotty';
+import { inject, injectable } from 'inversify';
+import { CSS_GHOST_ELEMENT, CursorCSS, cursorFeedbackAction } from '../../../base/feedback/css-feedback';
+import { FeedbackEmitter } from '../../../base/feedback/feedback-emitter';
+import { ContainerElement, isContainable } from '../../hints/model';
+import { ChangeBoundsManager } from '../change-bounds/change-bounds-manager';
+
+export interface InsertOptions extends Record<string, unknown> {
+    /** Flag to indicate whether the location within a container needs to be valid. Default: false */
+    validateLocationInContainer?: boolean;
+
+    /** Overwrite for location validation if validation result is already known. Default: undefined */
+    validLocationOverwrite?: boolean;
+
+    /** Mouse event to be used for finding the container. Default: undefined */
+    evt?: MouseEvent;
+}
+
+export const DEFAULT_INSERT_OPTIONS: InsertOptions = {
+    validateLocationInContainer: false
+};
+
+export interface TrackedInsert {
+    elementTypeId: string;
+    location: Point;
+    container?: GModelElement;
+    valid: boolean;
+    options: InsertOptions;
+}
+
+@injectable()
+export class ContainerManager {
+    @inject(ChangeBoundsManager) protected readonly changeBoundsManager: ChangeBoundsManager;
+
+    insert(proxy: GModelElement, location: Point, elementTypeId: string, opts?: Partial<InsertOptions>): TrackedInsert {
+        const options = { ...DEFAULT_INSERT_OPTIONS, ...opts };
+        const container = this.findContainer(location, proxy, opts?.evt);
+        let valid = !container || container.isContainableElement(elementTypeId);
+        if (valid && (!container || options.validateLocationInContainer)) {
+            // we need to check whether the location is valid either because we do not have a container or the option is set
+            valid = opts?.validLocationOverwrite ?? this.changeBoundsManager.hasValidPosition(proxy, location);
+        }
+        return { elementTypeId, container, location, valid, options };
+    }
+
+    findContainer(location: Point, ctx: GModelElement, evt?: MouseEvent): ContainerElement | undefined {
+        // reverse order of children to find the innermost, top-rendered containers first
+        return findChildrenAtPosition(ctx.root, location)
+            .reverse()
+            .find(element => isContainable(element) && !element.cssClasses?.includes(CSS_GHOST_ELEMENT)) as ContainerElement | undefined;
+    }
+
+    addInsertFeedback(feedback: FeedbackEmitter, trackedInsert: TrackedInsert, ctx?: GModelElement, event?: MouseEvent): FeedbackEmitter {
+        // cursor feedback
+        if (!trackedInsert.valid) {
+            feedback.add(cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED), cursorFeedbackAction(CursorCSS.DEFAULT));
+        } else {
+            feedback.add(cursorFeedbackAction(CursorCSS.NODE_CREATION), cursorFeedbackAction());
+        }
+        return feedback;
+    }
+}