@eclipse-glsp/client 0.9.0-next.f54fd689 → 0.9.0

package/src/utils/argument-utils.ts

@@ -0,0 +1,130 @@
+/********************************************************************************
+ * Copyright (c) 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
+ * 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 { SModelElement } from 'sprotty';
+import { hasArguments } from '../base/argumentable';
+
+export namespace GArgument {
+    export function asNumber(argValue: string | number | boolean): number | undefined {
+        return typeof argValue === 'number' ? argValue : undefined;
+    }
+
+    export function asNumbers(argValues: (string | number | boolean)[]): (number | undefined)[] {
+        return argValues.map(asNumber);
+    }
+
+    export function asString(argValue: string | number | boolean): string | undefined {
+        return typeof argValue === 'string' ? argValue : undefined;
+    }
+
+    export function asStrings(argValues: (string | number | boolean)[]): (string | undefined)[] {
+        return argValues.map(asString);
+    }
+
+    export function asBoolean(argValue: string | number | boolean): boolean | undefined {
+        return typeof argValue === 'boolean' ? argValue : undefined;
+    }
+
+    export function asBooleans(argValues: (string | number | boolean)[]): (boolean | undefined)[] {
+        return argValues.map(asBoolean);
+    }
+
+    export function getArgument(element: SModelElement | undefined, key: string): string | number | boolean | undefined {
+        return hasArguments(element) ? element.args[key] : undefined;
+    }
+
+    export function getNumber(element: SModelElement | undefined, key: string): number | undefined {
+        return hasArguments(element) ? asNumber(element.args[key]) : undefined;
+    }
+
+    export function getString(element: SModelElement | undefined, key: string): string | undefined {
+        return hasArguments(element) ? asString(element.args[key]) : undefined;
+    }
+
+    export function getBoolean(element: SModelElement | undefined, key: string): boolean | undefined {
+        return hasArguments(element) ? asBoolean(element.args[key]) : undefined;
+    }
+
+    export function getArguments(element: SModelElement | undefined, ...keys: string[]): (number | boolean | string)[] | undefined {
+        if (!hasArguments(element)) {
+            return undefined;
+        }
+        const values = [];
+        for (const key of keys) {
+            const value = element.args[key];
+            if (value) {
+                values.push(value);
+            }
+        }
+        return values;
+    }
+
+    export function getNumbers(element: SModelElement | undefined, ...keys: string[]): (number | undefined)[] | undefined {
+        const values = getArguments(element, ...keys);
+        return values ? asNumbers(values) : undefined;
+    }
+
+    export function getStrings(element: SModelElement | undefined, ...keys: string[]): (string | undefined)[] | undefined {
+        const values = getArguments(element, ...keys);
+        return values ? asStrings(values) : undefined;
+    }
+
+    export function getBooleans(element: SModelElement | undefined, ...keys: string[]): (boolean | undefined)[] | undefined {
+        const values = getArguments(element, ...keys);
+        return values ? asBooleans(values) : undefined;
+    }
+
+    export function hasNValues<T>(values: (T | undefined)[], length: number): values is T[] {
+        return values.length === length && values.filter(e => e === undefined).length === 0;
+    }
+}
+
+export namespace EdgePadding {
+    const KEY = 'edgePadding';
+
+    export function from(element: SModelElement | undefined): number | undefined {
+        return GArgument.getNumber(element, KEY);
+    }
+}
+
+export class CornerRadius {
+    static NO_RADIUS = new CornerRadius(0);
+
+    static KEY_RADIUS_TOP_LEFT = 'radiusTopLeft';
+    static KEY_RADIUS_TOP_RIGHT = 'radiusTopRight';
+    static KEY_RADIUS_BOTTOM_RIGHT = 'radiusBottomRight';
+    static KEY_RADIUS_BOTTOM_LEFT = 'radiusBottomLeft';
+
+    constructor(
+        public readonly topLeft: number = 0,
+        public readonly topRight: number = topLeft,
+        public readonly bottomRight: number = topLeft,
+        public readonly bottomLeft: number = topRight
+    ) {}
+
+    static from(element: SModelElement | undefined): CornerRadius | undefined {
+        const radius = GArgument.getNumbers(
+            element,
+            this.KEY_RADIUS_TOP_LEFT,
+            this.KEY_RADIUS_TOP_RIGHT,
+            this.KEY_RADIUS_BOTTOM_RIGHT,
+            this.KEY_RADIUS_BOTTOM_LEFT
+        );
+        if (radius === undefined || radius[0] === undefined) {
+            return undefined;
+        }
+        return GArgument.hasNValues(radius, 4) ? new CornerRadius(radius[0], radius[1], radius[2], radius[3]) : new CornerRadius(radius[0]);
+    }
+}

package/src/utils/layout-utils.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 { BoundsAware, Dimension, ElementAndBounds, ElementMove, ModelLayoutOptions, Point, SModelElement } from "sprotty";
-
-import { IMovementRestrictor } from "../features/change-bounds/movement-restrictor";
+import { Point } from '@eclipse-glsp/protocol';
+import { BoundsAware, Dimension, ElementAndBounds, ElementMove, ModelLayoutOptions, SModelElement } from 'sprotty';
+import { IMovementRestrictor } from '../features/change-bounds/movement-restrictor';
 
 export function minWidth(element: SModelElement & BoundsAware): number {
     const layoutOptions = getLayoutOptions(element);
@@ -41,25 +41,33 @@ export function getLayoutOptions(element: SModelElement): ModelLayoutOptions | u
     return undefined;
 }
 
-export function isValidSize(element: SModelElement & BoundsAware, size: Dimension) {
+export function isValidSize(element: SModelElement & BoundsAware, size: Dimension): boolean {
     return size.width >= minWidth(element) && size.height >= minHeight(element);
 }
 
-export function isValidMove(element: SModelElement & BoundsAware, newPosition: Point, movementRestrictor?: IMovementRestrictor) {
+export function isValidMove(element: SModelElement & BoundsAware, newPosition: Point, movementRestrictor?: IMovementRestrictor): boolean {
     if (movementRestrictor) {
         return movementRestrictor.validate(newPosition, element);
     }
     return true;
 }
 
-export function toValidElementMove(element: SModelElement & BoundsAware, move: WriteableElementMove, movementRestrictor?: IMovementRestrictor) {
+export function toValidElementMove(
+    element: SModelElement & BoundsAware,
+    move: WriteableElementMove,
+    movementRestrictor?: IMovementRestrictor
+): WriteableElementMove | undefined {
     if (!isValidMove(element, move.toPosition, movementRestrictor)) {
         return;
     }
     return move;
 }
 
-export function toValidElementAndBounds(element: SModelElement & BoundsAware, bounds: WriteableElementAndBounds, movementRestrictor?: IMovementRestrictor) {
+export function toValidElementAndBounds(
+    element: SModelElement & BoundsAware,
+    bounds: WriteableElementAndBounds,
+    movementRestrictor?: IMovementRestrictor
+): WriteableElementAndBounds | undefined {
     if (!isValidMove(element, bounds.newPosition, movementRestrictor)) {
         return;
     }
@@ -85,11 +93,11 @@ export interface WriteableElementMove extends ElementMove {
 }
 
 export interface WriteableDimension extends Dimension {
-    width: number
-    height: number
+    width: number;
+    height: number;
 }
 
 export interface WriteableElementAndBounds extends ElementAndBounds {
     newPosition: WriteablePoint;
-    newSize: WriteableDimension
+    newSize: WriteableDimension;
 }

package/src/utils/marker.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,21 +13,16 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { SIssueMarker, SParentElement } from "sprotty";
-
-export namespace MarkerKind {
-    export const INFO = "info";
-    export const WARNING = "warning";
-    export const ERROR = "error";
-}
+import { MarkerKind } from '@eclipse-glsp/protocol';
+import { SIssueMarker, SParentElement } from 'sprotty';
 
 export namespace MarkerPredicates {
-    export const ALL = () => true;
-    export const ERRORS = (marker: SIssueMarker) => hasIssueWithSeverity(marker, MarkerKind.ERROR);
-    export const WARNINGS = (marker: SIssueMarker) => hasIssueWithSeverity(marker, MarkerKind.WARNING);
-    export const INFOS = (marker: SIssueMarker) => hasIssueWithSeverity(marker, MarkerKind.INFO);
+    export const ALL = (): boolean => true;
+    export const ERRORS = (marker: SIssueMarker): boolean => hasIssueWithSeverity(marker, MarkerKind.ERROR);
+    export const WARNINGS = (marker: SIssueMarker): boolean => hasIssueWithSeverity(marker, MarkerKind.WARNING);
+    export const INFOS = (marker: SIssueMarker): boolean => hasIssueWithSeverity(marker, MarkerKind.INFO);
 
-    export function hasIssueWithSeverity(marker: SIssueMarker, severity: 'info' | 'warning' | 'error') {
+    export function hasIssueWithSeverity(marker: SIssueMarker, severity: 'info' | 'warning' | 'error'): boolean {
         return marker.issues.find(issue => issue.severity === severity) !== undefined;
     }
 }
@@ -42,22 +37,3 @@ export function collectIssueMarkers(root: SParentElement): SIssueMarker[] {
     }
     return markers;
 }
-
-export interface Marker {
-    /**
-     * Short label describing this marker message, e.g., short validation message
-     */
-    readonly label: string;
-    /**
-     * Full description of this marker, e.g., full validation message
-     */
-    readonly description: string;
-    /**
-     * Id of the model element this marker refers to
-     */
-    readonly elementId: string;
-    /**
-     * Marker kind, e.g., info, warning, error or custom kind
-     */
-    readonly kind: string;
-}

package/src/utils/smodel-util.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,8 +13,10 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+import { ElementAndRoutingPoints } from '@eclipse-glsp/protocol';
 import {
     BoundsAware,
+    ElementAndBounds,
     isBoundsAware,
     isMoveable,
     isSelectable,
@@ -22,38 +24,42 @@ import {
     Selectable,
     SModelElement,
     SModelElementSchema,
+    SModelIndex,
     SRoutableElement,
     SRoutingHandle
-} from "sprotty";
+} from 'sprotty';
 
-import { ElementAndRoutingPoints } from "../base/operations/operation";
-
-
-export function getIndex(element: SModelElement) {
+export function getIndex(element: SModelElement): SModelIndex<SModelElement> {
     return element.root.index;
 }
 
-export function forEachElement<T>(element: SModelElement, predicate: (element: SModelElement) => element is SModelElement & T, runnable: (element: SModelElement & T) => void) {
-    getIndex(element).all()
-        .filter(predicate)
-        .forEach(runnable);
+export function forEachElement<T>(
+    element: SModelElement,
+    predicate: (modelElement: SModelElement) => modelElement is SModelElement & T,
+    runnable: (modelElement: SModelElement & T) => void
+): void {
+    getIndex(element).all().filter(predicate).forEach(runnable);
 }
 
-export function getMatchingElements<T>(element: SModelElement, predicate: (element: SModelElement) => element is SModelElement & T): (SModelElement & T)[] {
+export function getMatchingElements<T>(
+    element: SModelElement,
+    predicate: (modelElement: SModelElement) => modelElement is SModelElement & T
+): (SModelElement & T)[] {
     const matching: (SModelElement & T)[] = [];
     forEachElement(element, predicate, item => matching.push(item));
     return matching;
 }
 
-export function hasSelectedElements(element: SModelElement) {
+export function hasSelectedElements(element: SModelElement): boolean {
     return getSelectedElementCount(element) > 0;
 }
 
 export function getSelectedElementCount(element: SModelElement): number {
     let selected = 0;
-    getIndex(element).all()
+    getIndex(element)
+        .all()
         .filter(isSelected)
-        .forEach(e => selected = selected + 1);
+        .forEach(e => (selected = selected + 1));
     return selected;
 }
 
@@ -61,7 +67,7 @@ export function isNotUndefined<T>(element: T | undefined): element is T {
     return element !== undefined;
 }
 
-export function addCssClasses(root: SModelElement, cssClasses: string[]) {
+export function addCssClasses(root: SModelElement, cssClasses: string[]): void {
     if (root.cssClasses === undefined) {
         root.cssClasses = [];
     }
@@ -72,7 +78,7 @@ export function addCssClasses(root: SModelElement, cssClasses: string[]) {
     }
 }
 
-export function removeCssClasses(root: SModelElement, cssClasses: string[]) {
+export function removeCssClasses(root: SModelElement, cssClasses: string[]): void {
     if (root.cssClasses === undefined || root.cssClasses.length === 0) {
         return;
     }
@@ -108,7 +114,7 @@ export type SelectableBoundsAware = SModelElement & BoundsAware & Selectable;
 
 export type BoundsAwareModelElement = SModelElement & BoundsAware;
 
-export function toElementAndBounds(element: SModelElement & BoundsAware) {
+export function toElementAndBounds(element: SModelElement & BoundsAware): ElementAndBounds {
     return {
         elementId: element.id,
         newPosition: {
@@ -133,15 +139,15 @@ export function toElementAndRoutingPoints(element: SRoutableElement): ElementAnd
  * Checks if the model is compatible with the passed type string.
  * (either has the same type or a subtype of this type)
  */
-export function hasCompatibleType(input: SModelElement | SModelElementSchema | string, type: string) {
+export function hasCompatibleType(input: SModelElement | SModelElementSchema | string, type: string): boolean {
     const inputType = getElementTypeId(input);
-    return inputType === type ? true : inputType.split(":").includes(type);
+    return inputType === type ? true : inputType.split(':').includes(type);
 }
 
-export function getElementTypeId(input: SModelElement | SModelElementSchema | string) {
+export function getElementTypeId(input: SModelElement | SModelElementSchema | string): string {
     if (typeof input === 'string') {
-        return <string>input;
+        return input as string;
     } else {
-        return <string>(<any>input)["type"];
+        return (input as any)['type'] as string;
     }
 }

package/src/utils/viewpoint-util.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,19 +13,18 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+import { Bounds, Point } from '@eclipse-glsp/protocol';
 import {
-    Bounds,
     BoundsAware,
     Dimension,
     findParentByFeature,
     isAlignable,
     isViewport,
     ORIGIN_POINT,
-    Point,
     SModelElement,
     translateBounds,
     Viewport
-} from "sprotty";
+} from 'sprotty';
 
 /**
  * Return the position corresponding to this mouse event (Browser coordinates)
@@ -41,7 +40,8 @@ import {
  *  A mouseEvent
  */
 export function getAbsolutePosition(target: SModelElement, mouseEvent: MouseEvent): Point {
-    let xPos = mouseEvent.pageX, yPos = mouseEvent.pageY;
+    let xPos = mouseEvent.pageX;
+    let yPos = mouseEvent.pageY;
     const canvasBounds = target.root.canvasBounds;
     xPos -= canvasBounds.x;
     yPos -= canvasBounds.y;
@@ -56,7 +56,6 @@ export function getAbsolutePosition(target: SModelElement, mouseEvent: MouseEven
         xPos /= zoom;
         yPos /= zoom;
     }
-    xPos;
 
     return {
         x: xPos,

package/src/views/base-view-module.ts

@@ -0,0 +1,97 @@
+/********************************************************************************
+ * Copyright (c) 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
+ * 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 { DefaultTypes } from '@eclipse-glsp/protocol';
+import { ContainerModule, interfaces } from 'inversify';
+import {
+    CircularNode,
+    CircularNodeView,
+    configureModelElement,
+    DiamondNode,
+    DiamondNodeView,
+    ExpandButtonView,
+    ForeignObjectElement,
+    ForeignObjectView,
+    HtmlRoot,
+    HtmlRootView,
+    PreRenderedElement,
+    PreRenderedView,
+    RectangularNode,
+    RectangularNodeView,
+    SButton,
+    SCompartment,
+    SCompartmentView,
+    SEdge,
+    SGraphView,
+    ShapedPreRenderedElement,
+    SIssueMarker,
+    SLabel,
+    SLabelView,
+    SNode,
+    SPort,
+    SRoutingHandle,
+    SRoutingHandleView,
+    SvgViewportView,
+    ViewportRootElement
+} from 'sprotty';
+import { GLSPGraph } from '../lib/model';
+import { GEdgeView } from './glsp-edge-view';
+import { GIssueMarkerView } from './issue-marker-view';
+import { RoundedCornerNodeView } from './rounded-corner-view';
+
+interface ContainerContext {
+    bind: interfaces.Bind;
+    isBound: interfaces.IsBound;
+}
+
+const baseViewModule = new ContainerModule((bind, unbind, isBound, rebind) => {
+    const context = { bind, unbind, isBound, rebind };
+    configureDefaultModelElements(context);
+});
+
+export function configureDefaultModelElements(context: ContainerContext): void {
+    // HTML elements
+    configureModelElement(context, DefaultTypes.HTML, HtmlRoot, HtmlRootView);
+
+    // generic elements
+    configureModelElement(context, DefaultTypes.FOREIGN_OBJECT, ForeignObjectElement, ForeignObjectView);
+    configureModelElement(context, DefaultTypes.PRE_RENDERED, PreRenderedElement, PreRenderedView);
+    configureModelElement(context, DefaultTypes.SHAPE_PRE_RENDERED, ShapedPreRenderedElement, PreRenderedView);
+
+    // SVG elements
+    configureModelElement(context, DefaultTypes.SVG, ViewportRootElement, SvgViewportView);
+
+    // graph elements
+    configureModelElement(context, DefaultTypes.GRAPH, GLSPGraph, SGraphView);
+    configureModelElement(context, DefaultTypes.NODE, SNode, RoundedCornerNodeView);
+    configureModelElement(context, DefaultTypes.COMPARTMENT, SCompartment, SCompartmentView);
+    configureModelElement(context, DefaultTypes.COMPARTMENT_HEADER, SCompartment, SCompartmentView);
+    configureModelElement(context, DefaultTypes.EDGE, SEdge, GEdgeView);
+    configureModelElement(context, DefaultTypes.PORT, SPort, RectangularNodeView);
+    configureModelElement(context, DefaultTypes.ROUTING_POINT, SRoutingHandle, SRoutingHandleView);
+    configureModelElement(context, DefaultTypes.VOLATILE_ROUTING_POINT, SRoutingHandle, SRoutingHandleView);
+    configureModelElement(context, DefaultTypes.LABEL, SLabel, SLabelView);
+
+    // UI elements
+    configureModelElement(context, DefaultTypes.BUTTON_EXPAND, SButton, ExpandButtonView);
+    configureModelElement(context, DefaultTypes.ISSUE_MARKER, SIssueMarker, GIssueMarkerView);
+
+    // shapes
+    configureModelElement(context, DefaultTypes.NODE_CIRCLE, CircularNode, CircularNodeView);
+    configureModelElement(context, DefaultTypes.NODE_DIAMOND, DiamondNode, DiamondNodeView);
+    configureModelElement(context, DefaultTypes.NODE_RECTANGLE, RectangularNode, RectangularNodeView);
+}
+
+export default baseViewModule;

package/src/views/compartments.tsx

@@ -0,0 +1,37 @@
+/********************************************************************************
+ * Copyright (c) 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
+ * 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 { injectable } from 'inversify';
+import { VNode } from 'snabbdom';
+import { BoundsAware, RenderingContext, SChildElement, SCompartment, ShapeView, svg } from 'sprotty/lib';
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const JSX = { createElement: svg };
+
+@injectable()
+export class StructureCompartmentView extends ShapeView {
+    render(model: Readonly<SCompartment & SChildElement & BoundsAware>, context: RenderingContext): VNode | undefined {
+        if (!this.isVisible(model, context)) {
+            return undefined;
+        }
+
+        return (
+            <g>
+                <rect class-sprotty-comp={true} class-debug={true} x='0' y='0' width={model.size.width} height={model.size.height}></rect>
+                {context.renderChildren(model)}
+            </g>
+        );
+    }
+}

package/src/views/glsp-edge-view.tsx

@@ -0,0 +1,79 @@
+/********************************************************************************
+ * Copyright (c) 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
+ * 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 { Point } from '@eclipse-glsp/protocol';
+import { injectable } from 'inversify';
+import { Classes, VNode } from 'snabbdom';
+import { PolylineEdgeView, RenderingContext, SEdge, svg } from 'sprotty';
+import { EdgePadding } from '../utils/argument-utils';
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const JSX = { createElement: svg };
+
+@injectable()
+export class GEdgeView extends PolylineEdgeView {
+    render(edge: Readonly<SEdge>, context: RenderingContext): VNode {
+        const router = this.edgeRouterRegistry.get(edge.routerKind);
+        const route = router.route(edge);
+        if (route.length === 0) {
+            return this.renderDanglingEdge('Cannot compute route', edge, context);
+        }
+
+        return (
+            <g class-sprotty-edge={true} class-mouseover={edge.hoverFeedback} {...this.addtionalClasses(edge, context)}>
+                {this.renderLine(edge, route, context)}
+                {this.renderAdditionals(edge, route, context)}
+                {context.renderChildren(edge, { route })}
+            </g>
+        );
+    }
+
+    protected addtionalClasses(_edge: Readonly<SEdge>, _context: RenderingContext): Classes {
+        return {};
+    }
+
+    protected renderLine(_edge: SEdge, segments: Point[], _context: RenderingContext): VNode {
+        return <path d={this.createPathForSegments(segments)} />;
+    }
+
+    protected renderAdditionals(edge: SEdge, segments: Point[], _context: RenderingContext): VNode[] {
+        // for additional padding we draw another transparent path with larger stroke width
+        const edgePadding = EdgePadding.from(edge);
+        return edgePadding ? [this.renderMouseHandle(segments, edgePadding)] : [];
+    }
+
+    protected renderMouseHandle(segments: Point[], padding: number): VNode {
+        return (
+            <path
+                class-mouse-handle
+                d={this.createPathForSegments(segments)}
+                style-stroke-width={padding * 2}
+                style-stroke='transparent'
+                style-stroke-dasharray='none'
+                style-stroke-dashoffset='0'
+            />
+        );
+    }
+
+    protected createPathForSegments(segments: Point[]): string {
+        const firstPoint = segments[0];
+        let path = `M ${firstPoint.x},${firstPoint.y}`;
+        for (let i = 1; i < segments.length; i++) {
+            const p = segments[i];
+            path += ` L ${p.x},${p.y}`;
+        }
+        return path;
+    }
+}

package/{lib/utils/array-utils.d.ts → src/views/index.ts}

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019 EclipseSource and others.
+ * Copyright (c) 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,6 +13,9 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-export declare function remove<T>(array: T[], value: T): boolean;
-export declare function distinctAdd<T>(array: T[], value: T): boolean;
-//# sourceMappingURL=array-utils.d.ts.map
+export * from './base-view-module';
+export * from './compartments';
+export * from './glsp-edge-view';
+export * from './issue-marker-view';
+export * from './rounded-corner';
+export * from './rounded-corner-view';