@eclipse-glsp/client 0.9.0-next.6d10f92e → 0.9.0-next.75608185

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

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019 EclipseSource and others.
+ * Copyright (c) 2019-2021 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,9 +13,9 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { inject, injectable, optional } from "inversify";
+import { Action, ChangeRoutingPointsOperation, ReconnectEdgeOperation } from '@eclipse-glsp/protocol';
+import { inject, injectable, optional } from 'inversify';
 import {
-    Action,
     AnchorComputerRegistry,
     canEditRouting,
     Connectable,
@@ -27,22 +27,14 @@ import {
     SModelRoot,
     SRoutableElement,
     SRoutingHandle
-} from "sprotty";
-
-import { DragAwareMouseListener } from "../../base/drag-aware-mouse-listener";
-import { ChangeRoutingPointsOperation, ReconnectEdgeOperation } from "../../base/operations/operation";
-import { GLSP_TYPES } from "../../base/types";
-import { isRoutable, isRoutingHandle } from "../../utils/smodel-util";
-import {
-    isReconnectable,
-    isReconnectHandle,
-    isSourceRoutingHandle,
-    isTargetRoutingHandle,
-    SReconnectHandle
-} from "../reconnect/model";
-import { SelectionListener, SelectionService } from "../select/selection-service";
-import { DrawFeedbackEdgeAction, feedbackEdgeId, RemoveFeedbackEdgeAction } from "../tool-feedback/creation-tool-feedback";
-import { CursorCSS, cursorFeedbackAction } from "../tool-feedback/css-feedback";
+} from 'sprotty';
+import { DragAwareMouseListener } from '../../base/drag-aware-mouse-listener';
+import { GLSP_TYPES } from '../../base/types';
+import { isRoutable, isRoutingHandle } from '../../utils/smodel-util';
+import { isReconnectable, isReconnectHandle, isSourceRoutingHandle, isTargetRoutingHandle, SReconnectHandle } from '../reconnect/model';
+import { SelectionListener, SelectionService } from '../select/selection-service';
+import { DrawFeedbackEdgeAction, feedbackEdgeId, RemoveFeedbackEdgeAction } from '../tool-feedback/creation-tool-feedback';
+import { CursorCSS, cursorFeedbackAction } from '../tool-feedback/css-feedback';
 import {
     DrawFeedbackEdgeSourceAction,
     FeedbackEdgeRouteMovingMouseListener,
@@ -51,12 +43,12 @@ import {
     HideEdgeReconnectHandlesFeedbackAction,
     ShowEdgeReconnectHandlesFeedbackAction,
     SwitchRoutingModeAction
-} from "../tool-feedback/edge-edit-tool-feedback";
-import { BaseGLSPTool } from "./base-glsp-tool";
+} from '../tool-feedback/edge-edit-tool-feedback';
+import { BaseGLSPTool } from './base-glsp-tool';
 
 @injectable()
 export class EdgeEditTool extends BaseGLSPTool {
-    static ID = "glsp.edge-edit-tool";
+    static ID = 'glsp.edge-edit-tool';
 
     @inject(GLSP_TYPES.SelectionService) protected selectionService: SelectionService;
     @inject(AnchorComputerRegistry) protected anchorRegistry: AnchorComputerRegistry;
@@ -121,7 +113,7 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
         return edge !== undefined && edge.id !== feedbackEdgeId(edge.root) && isSelected(edge);
     }
 
-    protected setEdgeSelected(edge: SRoutableElement) {
+    protected setEdgeSelected(edge: SRoutableElement): void {
         if (this.edge && this.edge.id !== edge.id) {
             // reset from a previously selected edge
             this.reset();
@@ -143,18 +135,22 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
         return this.edge !== undefined && isSelected(this.edge);
     }
 
-    protected setReconnectHandleSelected(edge: SRoutableElement, reconnectHandle: SReconnectHandle) {
+    protected setReconnectHandleSelected(edge: SRoutableElement, reconnectHandle: SReconnectHandle): void {
         if (this.edge && this.edge.target && this.edge.source) {
             if (isSourceRoutingHandle(edge, reconnectHandle)) {
-                this.tool.dispatchFeedback([new HideEdgeReconnectHandlesFeedbackAction(),
-                cursorFeedbackAction(CursorCSS.EDGE_RECONNECT),
-                new DrawFeedbackEdgeSourceAction(this.edge.type, this.edge.targetId)]);
-                this.reconnectMode = "NEW_SOURCE";
+                this.tool.dispatchFeedback([
+                    new HideEdgeReconnectHandlesFeedbackAction(),
+                    cursorFeedbackAction(CursorCSS.EDGE_RECONNECT),
+                    new DrawFeedbackEdgeSourceAction(this.edge.type, this.edge.targetId)
+                ]);
+                this.reconnectMode = 'NEW_SOURCE';
             } else if (isTargetRoutingHandle(edge, reconnectHandle)) {
-                this.tool.dispatchFeedback([new HideEdgeReconnectHandlesFeedbackAction(),
-                cursorFeedbackAction(CursorCSS.EDGE_CREATION_TARGET),
-                new DrawFeedbackEdgeAction(this.edge.type, this.edge.sourceId)]);
-                this.reconnectMode = "NEW_TARGET";
+                this.tool.dispatchFeedback([
+                    new HideEdgeReconnectHandlesFeedbackAction(),
+                    cursorFeedbackAction(CursorCSS.EDGE_CREATION_TARGET),
+                    new DrawFeedbackEdgeAction(this.edge.type, this.edge.sourceId)
+                ]);
+                this.reconnectMode = 'NEW_TARGET';
             }
         }
     }
@@ -164,10 +160,10 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
     }
 
     protected isReconnectingNewSource(): boolean {
-        return this.reconnectMode === "NEW_SOURCE";
+        return this.reconnectMode === 'NEW_SOURCE';
     }
 
-    protected setRoutingHandleSelected(edge: SRoutableElement, routingHandle: SRoutingHandle) {
+    protected setRoutingHandleSelected(edge: SRoutableElement, routingHandle: SRoutingHandle): void {
         if (this.edge && this.edge.target && this.edge.source) {
             this.routingHandle = routingHandle;
         }
@@ -177,15 +173,15 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
         return this.edge !== undefined && (this.edge.sourceId !== sourceId || this.edge.targetId !== targetId);
     }
 
-    protected setNewConnectable(connectable?: SModelElement & Connectable) {
+    protected setNewConnectable(connectable?: SModelElement & Connectable): void {
         this.newConnectable = connectable;
     }
 
-    protected isReadyToReconnect() {
+    protected isReadyToReconnect(): boolean | undefined {
         return this.edge && this.isReconnecting() && this.newConnectable !== undefined;
     }
 
-    protected isReadyToReroute() {
+    protected isReadyToReroute(): boolean {
         return this.routingHandle !== undefined;
     }
 
@@ -235,7 +231,8 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
             }
             this.reset();
         } else if (this.edge && this.routingHandle) {
-            // we need to re-retrieve the edge as it might have changed due to a server udpate since we do not reset the state between reroute actions
+            // 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
             const latestEdge = target.index.getById(this.edge.id);
             if (latestEdge && isRoutable(latestEdge)) {
                 result.push(new ChangeRoutingPointsOperation([{ elementId: latestEdge.id, newRoutingPoints: latestEdge.routingPoints }]));
@@ -251,9 +248,10 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
             if (!this.newConnectable || currentTarget !== this.newConnectable) {
                 this.setNewConnectable(currentTarget);
                 if (currentTarget) {
-                    if ((this.reconnectMode === 'NEW_SOURCE' && currentTarget.canConnect(this.edge, "source")) ||
-                        (this.reconnectMode === 'NEW_TARGET' && currentTarget.canConnect(this.edge, "target"))) {
-
+                    if (
+                        (this.reconnectMode === 'NEW_SOURCE' && currentTarget.canConnect(this.edge, 'source')) ||
+                        (this.reconnectMode === 'NEW_TARGET' && currentTarget.canConnect(this.edge, 'target'))
+                    ) {
                         this.tool.dispatchFeedback([cursorFeedbackAction(CursorCSS.EDGE_RECONNECT)]);
                         return [];
                     }
@@ -293,25 +291,24 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
         }
     }
 
-    public reset() {
+    public reset(): void {
         this.resetFeedback();
         this.resetData();
     }
 
-    protected resetData() {
+    protected resetData(): void {
         this.edge = undefined;
         this.reconnectMode = undefined;
         this.newConnectable = undefined;
         this.routingHandle = undefined;
     }
 
-    protected resetFeedback() {
+    protected resetFeedback(): void {
         const result: Action[] = [];
         if (this.edge) {
             result.push(new SwitchRoutingModeAction([], [this.edge.id]));
         }
-        result.push(...[new HideEdgeReconnectHandlesFeedbackAction(),
-        cursorFeedbackAction(), new RemoveFeedbackEdgeAction()]);
+        result.push(...[new HideEdgeReconnectHandlesFeedbackAction(), cursorFeedbackAction(), new RemoveFeedbackEdgeAction()]);
         this.tool.deregisterFeedback(result);
         this.tool.deregisterFeedbackListeners();
     }

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

@@ -13,18 +13,19 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { inject, injectable } from "inversify";
-import { Action, BoundsAware, EnableDefaultToolsAction, isSelectable, KeyListener, Point, SEdge, SelectAction, SModelElement, SNode, TYPES } from "sprotty";
-import { DragAwareMouseListener } from "../../base/drag-aware-mouse-listener";
-import { CursorCSS, cursorFeedbackAction } from "../tool-feedback/css-feedback";
-import { DrawMarqueeAction, RemoveMarqueeAction } from "../tool-feedback/marquee-tool-feedback";
-import { BaseGLSPTool } from "../tools/base-glsp-tool";
-import { getAbsolutePosition, toAbsoluteBounds } from "../../utils/viewpoint-util";
-import { DOMHelper } from "sprotty/lib/base/views/dom-helper";
+import { Action, Point, SelectAction } from '@eclipse-glsp/protocol';
+import { inject, injectable } from 'inversify';
+import { BoundsAware, EnableDefaultToolsAction, isSelectable, isSelected, KeyListener, SEdge, SModelElement, SNode, TYPES } from 'sprotty';
+import { DOMHelper } from 'sprotty/lib/base/views/dom-helper';
+import { DragAwareMouseListener } from '../../base/drag-aware-mouse-listener';
+import { getAbsolutePosition, toAbsoluteBounds } from '../../utils/viewpoint-util';
+import { CursorCSS, cursorFeedbackAction } from '../tool-feedback/css-feedback';
+import { DrawMarqueeAction, RemoveMarqueeAction } from '../tool-feedback/marquee-tool-feedback';
+import { BaseGLSPTool } from '../tools/base-glsp-tool';
 
 @injectable()
 export class MarqueeMouseTool extends BaseGLSPTool {
-    static ID = "glsp.marquee-mouse-tool";
+    static ID = 'glsp.marquee-mouse-tool';
 
     @inject(TYPES.DOMHelper) protected domHelper: DOMHelper;
 
@@ -51,14 +52,15 @@ export class MarqueeMouseTool extends BaseGLSPTool {
 
 @injectable()
 export class MarqueeMouseListener extends DragAwareMouseListener {
-
     protected startPoint: Point;
 
     protected currentPoint: Point;
 
     protected domHelper: DOMHelper;
 
-    protected isActive: boolean = false;
+    protected previouslySelected: string[];
+
+    protected isActive = false;
 
     constructor(domHelper: DOMHelper) {
         super();
@@ -68,24 +70,36 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     mouseDown(target: SModelElement, event: MouseEvent): Action[] {
         this.isActive = true;
         this.startPoint = { x: getAbsolutePosition(target, event).x, y: getAbsolutePosition(target, event).y };
+        if (event.ctrlKey) {
+            this.previouslySelected = Array.from(
+                target.root.index
+                    .all()
+                    .map(e => e as SModelElement & BoundsAware)
+                    .filter(e => isSelected(e))
+                    .map(e => e.id)
+            );
+        }
         return [];
     }
 
     mouseMove(target: SModelElement, event: MouseEvent): Action[] {
         this.currentPoint = { x: getAbsolutePosition(target, event).x, y: getAbsolutePosition(target, event).y };
         if (this.isActive) {
-            const nodeIdsSelected = Array.from(target.root.index.all()
-                .map(e => e as SModelElement & BoundsAware)
-                .filter(e => isSelectable(e))
-                .filter(e => e instanceof SNode)
-                .filter(e => this.isNodeMarked(e)).map(e => e.id));
+            const nodeIdsSelected = Array.from(
+                target.root.index
+                    .all()
+                    .map(e => e as SModelElement & BoundsAware)
+                    .filter(e => isSelectable(e))
+                    .filter(e => e instanceof SNode)
+                    .filter(e => this.isNodeMarked(e))
+                    .map(e => e.id)
+            );
             const edgeIdsSelected = this.getMarkedEdges(target.root);
             const selected = nodeIdsSelected.concat(edgeIdsSelected);
             return [
-                new SelectAction([], Array.from(target.index.all().map(e => e.id))),
-                new SelectAction(selected, []),
-                new DrawMarqueeAction(this.startPoint,
-                    { x: getAbsolutePosition(target, event).x, y: getAbsolutePosition(target, event).y })
+                new SelectAction([], Array.from(target.root.index.all().map(e => e.id))),
+                new SelectAction(selected.concat(this.previouslySelected), []),
+                new DrawMarqueeAction(this.startPoint, { x: getAbsolutePosition(target, event).x, y: getAbsolutePosition(target, event).y })
             ];
         }
         return [];
@@ -100,25 +114,34 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     }
 
     getMarkedEdges(root: SModelElement): string[] {
-        const elements = Array.from(document.querySelectorAll("g"));
-        const edges = Array.from(root.index.all().filter(e => e instanceof SEdge).
-            filter(e => isSelectable(e)).map(e => e.id));
-        return elements.filter(e => edges.includes(this.domHelper.findSModelIdByDOMElement(e)))
-            .filter(e => this.isEdgeMarked(e)).map(e => this.domHelper.findSModelIdByDOMElement(e));
+        const elements = Array.from(document.querySelectorAll('g'));
+        const edges = Array.from(
+            root.index
+                .all()
+                .filter(e => e instanceof SEdge)
+                .filter(e => isSelectable(e))
+                .map(e => e.id)
+        );
+        return elements
+            .filter(e => edges.includes(this.domHelper.findSModelIdByDOMElement(e)))
+            .filter(e => this.isEdgeMarked(e))
+            .map(e => this.domHelper.findSModelIdByDOMElement(e));
     }
 
     isEdgeMarked(element: SVGElement): boolean {
-        if (element.getAttribute("transform") == null) {
-            if (element.children[0] != null) {
-                const path = element.children[0].getAttribute("d");
-                if (path != null) {
+        if (!element.getAttribute('transform')) {
+            if (element.children[0]) {
+                const path = element.children[0].getAttribute('d');
+                if (path) {
                     const points = path.split(/M|L/);
                     for (let i = 0; i < points.length - 1; i++) {
-                        const coord1 = points[i].split(",");
-                        const coord2 = points[i + 1].split(",");
-                        const point1 = { x: parseInt(coord1[0]), y: parseInt(coord1[1]) };
-                        const point2 = { x: parseInt(coord2[0]), y: parseInt(coord2[1]) };
-                        if (this.isLineMarked(point1, point2)) return true;
+                        const coord1 = points[i].split(',');
+                        const coord2 = points[i + 1].split(',');
+                        const point1 = { x: parseInt(coord1[0], 10), y: parseInt(coord1[1], 10) };
+                        const point2 = { x: parseInt(coord2[0], 10), y: parseInt(coord2[1], 10) };
+                        if (this.isLineMarked(point1, point2)) {
+                            return true;
+                        }
                     }
                 }
             }
@@ -127,47 +150,69 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     }
 
     isLineMarked(point1: Point, point2: Point): boolean {
-        if (this.pointInRect(point1) || this.pointInRect(point2)) return true;
-        if (this.linesIntersect(point1, point2, this.startPoint, { x: this.startPoint.x, y: this.currentPoint.y })) return true;
-        if (this.linesIntersect(point1, point2, this.startPoint, { x: this.currentPoint.x, y: this.startPoint.y })) return true;
-        if (this.linesIntersect(point1, point2, { x: this.currentPoint.x, y: this.startPoint.y }, this.currentPoint)) return true;
-        if (this.linesIntersect(point1, point2, { x: this.startPoint.x, y: this.currentPoint.y }, this.currentPoint)) return true;
+        if (this.pointInRect(point1) || this.pointInRect(point2)) {
+            return true;
+        }
+        if (this.linesIntersect(point1, point2, this.startPoint, { x: this.startPoint.x, y: this.currentPoint.y })) {
+            return true;
+        }
+        if (this.linesIntersect(point1, point2, this.startPoint, { x: this.currentPoint.x, y: this.startPoint.y })) {
+            return true;
+        }
+        if (this.linesIntersect(point1, point2, { x: this.currentPoint.x, y: this.startPoint.y }, this.currentPoint)) {
+            return true;
+        }
+        if (this.linesIntersect(point1, point2, { x: this.startPoint.x, y: this.currentPoint.y }, this.currentPoint)) {
+            return true;
+        }
         return false;
     }
 
     linesIntersect(p1: Point, p2: Point, p3: Point, p4: Point): boolean {
-        const tCount = ((p1.x - p3.x) * (p3.y - p4.y)) - ((p1.y - p3.y) * (p3.x - p4.x));
-        const tDenom = ((p1.x - p2.x) * (p3.y - p4.y)) - ((p1.y - p2.y) * (p3.x - p4.x));
+        const tCount = (p1.x - p3.x) * (p3.y - p4.y) - (p1.y - p3.y) * (p3.x - p4.x);
+        const tDenom = (p1.x - p2.x) * (p3.y - p4.y) - (p1.y - p2.y) * (p3.x - p4.x);
         const t = tCount / tDenom;
-        const uCount = ((p2.x - p1.x) * (p1.y - p3.y)) - ((p2.y - p1.y) * (p1.x - p3.x));
-        const uDenom = ((p1.x - p2.x) * (p3.y - p4.y)) - ((p1.y - p2.y) * (p3.x - p4.x));
+        const uCount = (p2.x - p1.x) * (p1.y - p3.y) - (p2.y - p1.y) * (p1.x - p3.x);
+        const uDenom = (p1.x - p2.x) * (p3.y - p4.y) - (p1.y - p2.y) * (p3.x - p4.x);
         const u = uCount / uDenom;
-        if (t >= 0.0 && t <= 1.0 && u >= 0.0 && u <= 1.0) return true;
+        if (t >= 0.0 && t <= 1.0 && u >= 0.0 && u <= 1.0) {
+            return true;
+        }
         return false;
     }
 
     pointInRect(point: Point): boolean {
-        const boolX = this.startPoint.x <= this.currentPoint.x ?
-            this.isBetween(point.x, this.startPoint.x, this.currentPoint.x) : this.isBetween(point.x, this.currentPoint.x, this.startPoint.x);
-        const boolY = this.startPoint.y <= this.currentPoint.y ?
-            this.isBetween(point.y, this.startPoint.y, this.currentPoint.y) : this.isBetween(point.y, this.currentPoint.y, this.startPoint.y);
+        const boolX =
+            this.startPoint.x <= this.currentPoint.x
+                ? this.isBetween(point.x, this.startPoint.x, this.currentPoint.x)
+                : this.isBetween(point.x, this.currentPoint.x, this.startPoint.x);
+        const boolY =
+            this.startPoint.y <= this.currentPoint.y
+                ? this.isBetween(point.y, this.startPoint.y, this.currentPoint.y)
+                : this.isBetween(point.y, this.currentPoint.y, this.startPoint.y);
         return boolX && boolY;
     }
 
     isNodeMarked(element: SModelElement & BoundsAware): boolean {
-        const horizontallyIn = this.startPoint.x < this.currentPoint.x ?
-            this.isElementBetweenXAxis(element, this.startPoint.x, this.currentPoint.x) :
-            this.isElementBetweenXAxis(element, this.currentPoint.x, this.startPoint.x);
-        const verticallyIn = this.startPoint.y < this.currentPoint.y ?
-            this.isElementBetweenYAxis(element, this.startPoint.y, this.currentPoint.y) :
-            this.isElementBetweenYAxis(element, this.currentPoint.y, this.startPoint.y);
-        if (horizontallyIn && verticallyIn) return true;
+        const horizontallyIn =
+            this.startPoint.x < this.currentPoint.x
+                ? this.isElementBetweenXAxis(element, this.startPoint.x, this.currentPoint.x)
+                : this.isElementBetweenXAxis(element, this.currentPoint.x, this.startPoint.x);
+        const verticallyIn =
+            this.startPoint.y < this.currentPoint.y
+                ? this.isElementBetweenYAxis(element, this.startPoint.y, this.currentPoint.y)
+                : this.isElementBetweenYAxis(element, this.currentPoint.y, this.startPoint.y);
+        if (horizontallyIn && verticallyIn) {
+            return true;
+        }
         return false;
     }
 
     isElementBetweenXAxis(element: SModelElement & BoundsAware, marqueeLeft: number, marqueeRight: number): boolean {
-        if (this.isBetween(marqueeLeft, toAbsoluteBounds(element).x, toAbsoluteBounds(element).x + toAbsoluteBounds(element).width)
-            || this.isBetween(marqueeRight, toAbsoluteBounds(element).x, toAbsoluteBounds(element).x + toAbsoluteBounds(element).width)) {
+        if (
+            this.isBetween(marqueeLeft, toAbsoluteBounds(element).x, toAbsoluteBounds(element).x + toAbsoluteBounds(element).width) ||
+            this.isBetween(marqueeRight, toAbsoluteBounds(element).x, toAbsoluteBounds(element).x + toAbsoluteBounds(element).width)
+        ) {
             return true;
         }
         const leftEdge = this.isBetween(toAbsoluteBounds(element).x, marqueeLeft, marqueeRight);
@@ -176,8 +221,10 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     }
 
     isElementBetweenYAxis(element: SModelElement & BoundsAware, marqueeTop: number, marqueeBottom: number): boolean {
-        if (this.isBetween(marqueeTop, toAbsoluteBounds(element).y, toAbsoluteBounds(element).y + toAbsoluteBounds(element).height)
-            || this.isBetween(marqueeBottom, toAbsoluteBounds(element).y, toAbsoluteBounds(element).y + toAbsoluteBounds(element).height)) {
+        if (
+            this.isBetween(marqueeTop, toAbsoluteBounds(element).y, toAbsoluteBounds(element).y + toAbsoluteBounds(element).height) ||
+            this.isBetween(marqueeBottom, toAbsoluteBounds(element).y, toAbsoluteBounds(element).y + toAbsoluteBounds(element).height)
+        ) {
             return true;
         }
         const topEdge = this.isBetween(toAbsoluteBounds(element).y, marqueeTop, marqueeBottom);
@@ -186,15 +233,15 @@ export class MarqueeMouseListener extends DragAwareMouseListener {
     }
 
     isBetween(x: number, lower: number, upper: number): boolean {
-        if (lower <= x && x <= upper) return true;
+        if (lower <= x && x <= upper) {
+            return true;
+        }
         return false;
     }
-
 }
 
 @injectable()
 export class ShiftKeyListener extends KeyListener {
-
     keyUp(element: SModelElement, event: KeyboardEvent): Action[] {
         if (event.shiftKey) {
             return [];

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

@@ -13,14 +13,15 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { inject, injectable } from "inversify";
-import { Action, EnableToolsAction, KeyListener, KeyTool, SModelElement } from "sprotty";
-import { BaseGLSPTool } from "../tools/base-glsp-tool";
-import { MarqueeMouseTool } from "./marquee-mouse-tool";
+import { Action } from '@eclipse-glsp/protocol';
+import { inject, injectable } from 'inversify';
+import { EnableToolsAction, KeyListener, KeyTool, SModelElement } from 'sprotty';
+import { BaseGLSPTool } from '../tools/base-glsp-tool';
+import { MarqueeMouseTool } from './marquee-mouse-tool';
 
 @injectable()
 export class MarqueeTool extends BaseGLSPTool {
-    static ID = "glsp.marquee-tool";
+    static ID = 'glsp.marquee-tool';
 
     protected marqueeKeyListener: MarqueeKeyListener = new MarqueeKeyListener();
 
@@ -41,7 +42,6 @@ export class MarqueeTool extends BaseGLSPTool {
 
 @injectable()
 export class MarqueeKeyListener extends KeyListener {
-
     keyDown(element: SModelElement, event: KeyboardEvent): Action[] {
         if (event.shiftKey) {
             return [new EnableToolsAction([MarqueeMouseTool.ID])];

package/src/features/tools/model.ts

@@ -13,8 +13,7 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-
-import { boundsFeature, Point, RectangularNode } from "sprotty";
+import { boundsFeature, Point, RectangularNode } from 'sprotty';
 
 export class MarqueeNode extends RectangularNode {
     static readonly DEFAULT_FEATURES = [boundsFeature];

package/src/features/tools/node-creation-tool.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2020 EclipseSource and others.
+ * Copyright (c) 2020-2021 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,9 +13,9 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { inject, injectable, optional } from "inversify";
+import { Action, CreateNodeOperation, isTriggerNodeCreationAction, TriggerNodeCreationAction } from '@eclipse-glsp/protocol';
+import { inject, injectable, optional } from 'inversify';
 import {
-    Action,
     EnableDefaultToolsAction,
     EnableToolsAction,
     findParentByFeature,
@@ -25,22 +25,16 @@ import {
     SModelElement,
     SNode,
     TYPES
-} from "sprotty";
-
-import { DragAwareMouseListener } from "../../base/drag-aware-mouse-listener";
-import {
-    CreateNodeOperation,
-    isTriggerNodeCreationAction,
-    TriggerNodeCreationAction
-} from "../../base/operations/operation";
-import { getAbsolutePosition } from "../../utils/viewpoint-util";
-import { Containable, isContainable } from "../hints/model";
-import { CursorCSS, cursorFeedbackAction } from "../tool-feedback/css-feedback";
-import { BaseGLSPTool } from "./base-glsp-tool";
+} from 'sprotty';
+import { DragAwareMouseListener } from '../../base/drag-aware-mouse-listener';
+import { getAbsolutePosition } from '../../utils/viewpoint-util';
+import { Containable, isContainable } from '../hints/model';
+import { CursorCSS, cursorFeedbackAction } from '../tool-feedback/css-feedback';
+import { BaseGLSPTool } from './base-glsp-tool';
 
 @injectable()
 export class NodeCreationTool extends BaseGLSPTool implements IActionHandler {
-    static ID = "tool_create_node";
+    static ID = 'tool_create_node';
 
     @inject(TYPES.ISnapper) @optional() readonly snapper?: ISnapper;
 
@@ -51,7 +45,7 @@ export class NodeCreationTool extends BaseGLSPTool implements IActionHandler {
         return NodeCreationTool.ID;
     }
 
-    enable() {
+    enable(): void {
         if (this.triggerAction === undefined) {
             throw new TypeError(`Could not enable tool ${this.id}.The triggerAction cannot be undefined.`);
         }
@@ -60,7 +54,7 @@ export class NodeCreationTool extends BaseGLSPTool implements IActionHandler {
         this.dispatchFeedback([cursorFeedbackAction(CursorCSS.NODE_CREATION)]);
     }
 
-    disable() {
+    disable(): void {
         this.mouseTool.deregister(this.creationToolMouseListener);
         this.deregisterFeedback([cursorFeedbackAction()]);
     }
@@ -75,18 +69,17 @@ export class NodeCreationTool extends BaseGLSPTool implements IActionHandler {
 
 @injectable()
 export class NodeCreationToolMouseListener extends DragAwareMouseListener {
-
     protected container?: SModelElement & Containable;
 
     constructor(protected triggerAction: TriggerNodeCreationAction, protected tool: NodeCreationTool) {
         super();
     }
 
-    protected creationAllowed(elementTypeId: string) {
+    protected creationAllowed(elementTypeId: string): boolean | undefined {
         return this.container && this.container.isContainableElement(elementTypeId);
     }
 
-    get elementTypeId() {
+    get elementTypeId(): string {
         return this.triggerAction.elementTypeId;
     }
 
@@ -114,8 +107,8 @@ export class NodeCreationToolMouseListener extends DragAwareMouseListener {
         if (!this.container || currentContainer !== this.container) {
             this.container = currentContainer;
             const feedback = this.creationAllowed(this.elementTypeId)
-                ? cursorFeedbackAction(CursorCSS.NODE_CREATION) :
-                cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED);
+                ? cursorFeedbackAction(CursorCSS.NODE_CREATION)
+                : cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED);
             this.tool.dispatchFeedback([feedback]);
         }
         return [];

package/src/features/tools/view.tsx

@@ -13,26 +13,32 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+import { injectable } from 'inversify';
+import { VNode } from 'snabbdom';
+import { RectangularNodeView, RenderingContext, svg } from 'sprotty';
 
-import { injectable } from "inversify";
-import * as snabbdom from "snabbdom-jsx";
-import { VNode } from "snabbdom/vnode";
-import { RectangularNodeView, RenderingContext } from "sprotty";
-import { MarqueeNode } from "./model";
+import { MarqueeNode } from './model';
 
-const JSX = { createElement: snabbdom.svg };
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const JSX = { createElement: svg };
 
 @injectable()
 export class MarqueeView extends RectangularNodeView {
     render(node: MarqueeNode, context: RenderingContext): VNode {
-        const graph = <g>
-            <rect class-sprotty-node={true} class-marquee={true}
-                x={((node.startPoint.x - node.endPoint.x) <= 0) ? node.startPoint.x : node.endPoint.x}
-                y={((node.startPoint.y - node.endPoint.y) <= 0) ? node.startPoint.y : node.endPoint.y}
-                rx={0} ry={0}
-                width={Math.abs(node.startPoint.x - node.endPoint.x)}
-                height={Math.abs(node.startPoint.y - node.endPoint.y)}></rect>
-        </g>;
+        const graph = (
+            <g>
+                <rect
+                    class-sprotty-node={true}
+                    class-marquee={true}
+                    x={node.startPoint.x - node.endPoint.x <= 0 ? node.startPoint.x : node.endPoint.x}
+                    y={node.startPoint.y - node.endPoint.y <= 0 ? node.startPoint.y : node.endPoint.y}
+                    rx={0}
+                    ry={0}
+                    width={Math.abs(node.startPoint.x - node.endPoint.x)}
+                    height={Math.abs(node.startPoint.y - node.endPoint.y)}
+                ></rect>
+            </g>
+        );
         return graph;
     }
-}
+}