@eclipse-glsp/client 1.1.0-next.fdfeeeb.193 → 2.1.0-next.12ca798.289

package/src/features/bounds/vbox-layout.spec.ts

@@ -0,0 +1,170 @@
+/********************************************************************************
+ * Copyright (c) 2022-2023 TypeFox, STMicroelectronics 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
+ ********************************************************************************/
+/* eslint-disable deprecation/deprecation */
+import { expect } from 'chai';
+import 'mocha';
+import 'reflect-metadata';
+import { BoundsData, ConsoleLogger, Dimension, GModelElement, GNode } from '@eclipse-glsp/sprotty';
+import { createLabel, createNode, layout, setupLayoutRegistry } from './layouter-test-util.spec';
+
+describe('VBoxLayouter', () => {
+    const layoutRegistry = setupLayoutRegistry();
+    const log = new ConsoleLogger();
+    const map = new Map<GModelElement, BoundsData>();
+
+    function createModel(): GNode {
+        const model = createNode('node', undefined, Dimension.EMPTY);
+        model.children = [
+            createLabel('label1', undefined, undefined, { width: 1, height: 2 }),
+            createLabel('label2', undefined, undefined, { width: 2, height: 1 }),
+            createLabel('label3', undefined, undefined, { width: 3, height: 3 })
+        ];
+        model.layout = 'vbox';
+        return model;
+    }
+
+    it('defaultParams', () => {
+        const model = createModel();
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 6, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5.5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+
+    it('alignLeft', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            hAlign: 'left'
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 5, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+
+    it('alignCenter', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            hAlign: 'center'
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 6, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5.5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+
+    it('alignRight', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            hAlign: 'right'
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 7, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 6, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+
+    it('padding', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            paddingTop: 7,
+            paddingBottom: 8,
+            paddingLeft: 9,
+            paddingRight: 10
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 22, height: 23 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 10, y: 7, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 9.5, y: 10, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 9, y: 12, width: 3, height: 3 });
+    });
+
+    it('vGap', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            vGap: 4
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 24 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 6, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5.5, y: 11, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 16, width: 3, height: 3 });
+    });
+
+    it('paddingFactor', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            paddingFactor: 2
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 9, y: 9, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 8.5, y: 12, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 8, y: 14, width: 3, height: 3 });
+    });
+
+    it('minWidth', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            minWidth: 25
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 25, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 12, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 11.5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 11, y: 10, width: 3, height: 3 });
+    });
+
+    it('minHeight', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            minHeight: 25
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 25 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 6, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5.5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+
+    it('prefWidth', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            prefWidth: 20
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 20, height: 18 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 9.5, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 9, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 8.5, y: 10, width: 3, height: 3 });
+    });
+
+    it('prefHeight', () => {
+        const model = createModel();
+        model.layoutOptions = {
+            prefHeight: 20
+        };
+        layout(layoutRegistry, log, map, model);
+        expect(map.get(model)!.bounds).to.deep.equal({ x: 0, y: 0, width: 13, height: 20 });
+        expect(map.get(model.children[0])!.bounds).to.deep.equal({ x: 6, y: 5, width: 1, height: 2 });
+        expect(map.get(model.children[1])!.bounds).to.deep.equal({ x: 5.5, y: 8, width: 2, height: 1 });
+        expect(map.get(model.children[2])!.bounds).to.deep.equal({ x: 5, y: 10, width: 3, height: 3 });
+    });
+});

package/src/features/bounds/vbox-layout.ts

@@ -0,0 +1,275 @@
+/********************************************************************************
+ * Copyright (c) 2021-2023 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 {
+    Bounds,
+    BoundsData,
+    Dimension,
+    GChildElement,
+    LayoutContainer,
+    Point,
+    GModelElement,
+    GParentElement,
+    StatefulLayouter,
+    VBoxLayoutOptions,
+    VBoxLayouter,
+    isBoundsAware,
+    isLayoutableChild
+} from '@eclipse-glsp/sprotty';
+
+export interface VBoxLayoutOptionsExt extends VBoxLayoutOptions {
+    hGrab: boolean;
+    vGrab: boolean;
+    prefWidth: number | null;
+    prefHeight: number | null;
+}
+
+/**
+ * Extends VBoxLayouter to support additional layout options
+ */
+@injectable()
+export class VBoxLayouterExt extends VBoxLayouter {
+    static override KIND = VBoxLayouter.KIND;
+
+    override layout(container: GParentElement & LayoutContainer, layouter: StatefulLayouter): void {
+        const boundsData = layouter.getBoundsData(container);
+        const options = this.getLayoutOptions(container);
+        const childrenSize = this.getChildrenSize(container, options, layouter);
+
+        const fixedSize = this.getFixedContainerBounds(container, options, layouter);
+
+        const currentWidth = (boundsData.bounds?.width || 0) - options.paddingLeft - options.paddingRight;
+        const currentHeight = (boundsData.bounds?.height || 0) - options.paddingTop - options.paddingBottom;
+
+        const maxWidth =
+            options.paddingFactor *
+            (options.resizeContainer
+                ? Math.max(fixedSize.width - options.paddingLeft - options.paddingRight, childrenSize.width)
+                : Math.max(0, fixedSize.width - options.paddingLeft - options.paddingRight));
+        const maxHeight =
+            options.paddingFactor *
+            (options.resizeContainer
+                ? Math.max(fixedSize.height - options.paddingTop - options.paddingBottom, childrenSize.height)
+                : Math.max(0, fixedSize.height - options.paddingTop - options.paddingBottom));
+
+        const width = Math.max(currentWidth, maxWidth);
+        const height = Math.max(currentHeight, maxHeight);
+
+        // Remaining size that can be grabbed by children with the vGrab option
+        const grabHeight: number = height - childrenSize.height;
+        // Number of children that request vGrab
+        // FIXME: This approach works fine when only 1 child uses VGrab, but may cause rounding issues
+        // when the grabHeight can't be equally shared by all children.
+        const grabbingChildren = container.children
+            .map(child => this.getChildLayoutOptions(child, options))
+            .filter(opt => opt.vGrab).length;
+
+        if (maxWidth > 0 && maxHeight > 0) {
+            const offset = this.layoutChildren(container, layouter, options, width, height, grabHeight, grabbingChildren);
+            boundsData.bounds = this.getFinalContainerBounds(container, offset, options, childrenSize.width, childrenSize.height);
+            boundsData.boundsChanged = true;
+        }
+    }
+
+    protected override getChildrenSize(
+        container: GParentElement & LayoutContainer,
+        containerOptions: VBoxLayoutOptionsExt,
+        layouter: StatefulLayouter
+    ): Dimension {
+        let maxWidth = -1;
+        let maxHeight = 0;
+        let isFirst = true;
+        container.children.forEach(child => {
+            if (isLayoutableChild(child)) {
+                const bounds = layouter.getBoundsData(child).bounds;
+                if (bounds !== undefined && Dimension.isValid(bounds)) {
+                    maxHeight += bounds.height;
+                    if (isFirst) {
+                        isFirst = false;
+                    } else {
+                        maxHeight += containerOptions.vGap;
+                    }
+                    maxWidth = Math.max(maxWidth, bounds.width);
+                }
+            }
+        });
+        const result = {
+            width: maxWidth,
+            height: maxHeight
+        };
+        return result;
+    }
+
+    protected override layoutChildren(
+        container: GParentElement & LayoutContainer,
+        layouter: StatefulLayouter,
+        containerOptions: VBoxLayoutOptionsExt,
+        maxWidth: number,
+        maxHeight: number,
+        grabHeight?: number,
+        grabbingChildren?: number
+    ): Point {
+        let currentOffset: Point = {
+            x: containerOptions.paddingLeft + 0.5 * (maxWidth - maxWidth / containerOptions.paddingFactor),
+            y: containerOptions.paddingTop + 0.5 * (maxHeight - maxHeight / containerOptions.paddingFactor)
+        };
+
+        container.children.forEach(child => {
+            if (isLayoutableChild(child)) {
+                const boundsData = layouter.getBoundsData(child);
+                const bounds = boundsData.bounds;
+                const childOptions = this.getChildLayoutOptions(child, containerOptions);
+                if (bounds !== undefined && Dimension.isValid(bounds)) {
+                    currentOffset = this.layoutChild(
+                        child,
+                        boundsData,
+                        bounds,
+                        childOptions,
+                        containerOptions,
+                        currentOffset,
+                        maxWidth,
+                        maxHeight,
+                        grabHeight,
+                        grabbingChildren
+                    );
+                }
+            }
+        });
+        return currentOffset;
+    }
+
+    protected override layoutChild(
+        child: GChildElement,
+        boundsData: BoundsData,
+        bounds: Bounds,
+        childOptions: VBoxLayoutOptionsExt,
+        containerOptions: VBoxLayoutOptionsExt,
+        currentOffset: Point,
+        maxWidth: number,
+        maxHeight: number,
+        grabHeight?: number,
+        grabbingChildren?: number
+    ): Point {
+        const hAlign = childOptions.hGrab ? 'left' : childOptions.hAlign;
+        const dx = this.getDx(hAlign, bounds, maxWidth);
+        let offset = super.layoutChild(child, boundsData, bounds, childOptions, containerOptions, currentOffset, maxWidth, maxHeight);
+        boundsData.bounds = {
+            ...boundsData.bounds!,
+            x: currentOffset.x + dx,
+            y: currentOffset.y
+        };
+        if (childOptions.hGrab) {
+            boundsData.bounds = {
+                x: boundsData.bounds!.x,
+                y: boundsData.bounds!.y,
+                width: maxWidth,
+                height: boundsData.bounds!.height
+            };
+            boundsData.boundsChanged = true;
+        }
+        if (childOptions.vGrab && grabHeight && grabbingChildren) {
+            const height = boundsData.bounds!.height + grabHeight / grabbingChildren;
+            boundsData.bounds = {
+                x: boundsData.bounds!.x,
+                y: boundsData.bounds!.y,
+                width: boundsData.bounds!.width,
+                height: height
+            };
+            boundsData.boundsChanged = true;
+            offset = { x: currentOffset.x, y: currentOffset.y + height };
+        }
+        return offset;
+    }
+
+    protected override getFixedContainerBounds(
+        container: GModelElement,
+        layoutOptions: VBoxLayoutOptionsExt,
+        layouter: StatefulLayouter
+    ): Bounds {
+        const currentContainer = container;
+        // eslint-disable-next-line no-constant-condition
+        if (isBoundsAware(currentContainer)) {
+            const bounds = currentContainer.bounds;
+            const elementOptions = this.getElementLayoutOptions(currentContainer);
+            const width = elementOptions?.prefWidth ?? 0;
+            const height = elementOptions?.prefHeight ?? 0;
+            return { ...bounds, width, height };
+        }
+        return Bounds.EMPTY;
+    }
+
+    protected override getChildLayoutOptions(child: GChildElement, containerOptions: VBoxLayoutOptionsExt): VBoxLayoutOptionsExt {
+        return super.getChildLayoutOptions(child, this.filterContainerOptions(containerOptions)) as VBoxLayoutOptionsExt;
+    }
+
+    protected override getLayoutOptions(element: GModelElement): VBoxLayoutOptionsExt {
+        return super.getLayoutOptions(element) as VBoxLayoutOptionsExt;
+    }
+
+    protected getElementLayoutOptions(element: GModelElement): VBoxLayoutOptionsExt | undefined {
+        return (element as any).layoutOptions;
+    }
+
+    protected override getFinalContainerBounds(
+        container: GParentElement & LayoutContainer,
+        lastOffset: Point,
+        options: VBoxLayoutOptionsExt,
+        maxWidth: number,
+        maxHeight: number
+    ): Bounds {
+        const elementOptions = this.getElementLayoutOptions(container);
+        const width = elementOptions?.prefWidth ?? options.minWidth;
+        const height = elementOptions?.prefHeight ?? options.minHeight;
+
+        const result = {
+            x: container.bounds.x,
+            y: container.bounds.y,
+            width: Math.max(width, maxWidth + options.paddingLeft + options.paddingRight),
+            height: Math.max(height, maxHeight + options.paddingTop + options.paddingBottom)
+        };
+
+        return result;
+    }
+
+    protected override getDefaultLayoutOptions(): VBoxLayoutOptionsExt {
+        return {
+            resizeContainer: true,
+            paddingTop: 5,
+            paddingBottom: 5,
+            paddingLeft: 5,
+            paddingRight: 5,
+            paddingFactor: 1,
+            vGap: 1,
+            hAlign: 'center',
+            minWidth: 0,
+            minHeight: 0,
+            hGrab: false,
+            vGrab: false,
+            // eslint-disable-next-line no-null/no-null
+            prefHeight: null,
+            // eslint-disable-next-line no-null/no-null
+            prefWidth: null
+        };
+    }
+
+    protected filterContainerOptions(containerOptions: VBoxLayoutOptionsExt): VBoxLayoutOptionsExt {
+        // Reset object-specific layout options to default before merging,
+        // to make sure they won't be inherited (grab, prefSize)
+        // eslint-disable-next-line no-null/no-null
+        const localOptions = { vGrab: false, hGrab: false, prefHeight: null, prefWidth: null };
+        return { ...containerOptions, ...localOptions };
+    }
+}

package/src/features/change-bounds/model.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2022 EclipseSource and others.
+ * Copyright (c) 2019-2023 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
@@ -15,24 +15,24 @@
  ********************************************************************************/
 import {
     BoundsAware,
+    GChildElement,
     Hoverable,
+    Locateable,
+    GModelElement,
+    GParentElement,
+    Selectable,
     hoverFeedbackFeature,
     isBoundsAware,
     isMoveable,
-    isSelectable,
-    Locateable,
-    SChildElement,
-    Selectable,
-    SModelElement,
-    SParentElement
-} from 'sprotty';
+    isSelectable
+} from '@eclipse-glsp/sprotty';
 
 export const resizeFeature = Symbol('resizeFeature');
 
 export interface Resizable extends BoundsAware, Selectable {}
 
-export function isResizable(element: SModelElement): element is SParentElement & Resizable {
-    return isBoundsAware(element) && isSelectable(element) && element instanceof SParentElement && element.hasFeature(resizeFeature);
+export function isResizable(element: GModelElement): element is GParentElement & Resizable {
+    return isBoundsAware(element) && isSelectable(element) && element instanceof GParentElement && element.hasFeature(resizeFeature);
 }
 
 // eslint-disable-next-line no-shadow
@@ -43,11 +43,11 @@ export enum ResizeHandleLocation {
     BottomRight = 'bottom-right'
 }
 
-export function isBoundsAwareMoveable(element: SModelElement): element is SModelElement & Locateable & BoundsAware {
+export function isBoundsAwareMoveable(element: GModelElement): element is GModelElement & Locateable & BoundsAware {
     return isMoveable(element) && isBoundsAware(element);
 }
 
-export class SResizeHandle extends SChildElement implements Hoverable {
+export class SResizeHandle extends GChildElement implements Hoverable {
     static readonly TYPE = 'resize-handle';
 
     constructor(
@@ -71,7 +71,7 @@ export class SResizeHandle extends SChildElement implements Hoverable {
     }
 }
 
-export function addResizeHandles(element: SParentElement): void {
+export function addResizeHandles(element: GParentElement): void {
     removeResizeHandles(element);
     element.add(new SResizeHandle(ResizeHandleLocation.TopLeft));
     element.add(new SResizeHandle(ResizeHandleLocation.TopRight));
@@ -79,6 +79,6 @@ export function addResizeHandles(element: SParentElement): void {
     element.add(new SResizeHandle(ResizeHandleLocation.BottomRight));
 }
 
-export function removeResizeHandles(element: SParentElement): void {
+export function removeResizeHandles(element: GParentElement): void {
     element.removeAll(child => child instanceof SResizeHandle);
 }

package/src/features/change-bounds/movement-restrictor.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2022 EclipseSource and others.
+ * Copyright (c) 2019-2023 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,12 +13,11 @@
  *
  * 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 { BoundsAware, SModelElement, SNode, SParentElement } from 'sprotty';
+import { BoundsAware, Point, GModelElement, GNode, GParentElement } from '@eclipse-glsp/sprotty';
+import { ModifyCSSFeedbackAction } from '../../base/feedback/css-feedback';
 import { toAbsoluteBounds } from '../../utils/viewpoint-util';
-import { ModifyCSSFeedbackAction } from '../tool-feedback/css-feedback';
-import { isBoundsAwareMoveable, SResizeHandle } from './model';
+import { SResizeHandle, isBoundsAwareMoveable } from './model';
 
 /**
  * A `MovementRestrictor` is an optional service that can be used by tools to validate
@@ -32,7 +31,7 @@ export interface IMovementRestrictor {
      * @returns `true` if the the element is movable and moving to the given location is allowed, `false` otherwise.
      *          Should also return `false` if the newLocation is `undefined`:
      */
-    validate(element: SModelElement, newLocation?: Point): boolean;
+    validate(element: GModelElement, newLocation?: Point): boolean;
     /**
      * Feedback css-classes. Can be applied to elements that did fail the validation.
      */
@@ -47,12 +46,12 @@ export interface IMovementRestrictor {
 export class NoOverlapMovementRestrictor implements IMovementRestrictor {
     cssClasses = ['movement-not-allowed'];
 
-    validate(element: SModelElement, newLocation?: Point): boolean {
+    validate(element: GModelElement, newLocation?: Point): boolean {
         if (!isBoundsAwareMoveable(element) || !newLocation) {
             return false;
         }
         // Create ghost element at the newLocation
-        const ghostElement = Object.create(element) as SModelElement & BoundsAware;
+        const ghostElement = Object.create(element) as GModelElement & BoundsAware;
         ghostElement.bounds = {
             x: newLocation.x,
             y: newLocation.y,
@@ -64,12 +63,12 @@ export class NoOverlapMovementRestrictor implements IMovementRestrictor {
         return !Array.from(
             element.root.index
                 .all()
-                .filter(e => e.id !== ghostElement.id && e !== ghostElement.root && e instanceof SNode)
-                .map(e => e as SModelElement & BoundsAware)
+                .filter(e => e.id !== ghostElement.id && e !== ghostElement.root && e instanceof GNode)
+                .map(e => e as GModelElement & BoundsAware)
         ).some(e => this.areOverlapping(e, ghostElement));
     }
 
-    protected areOverlapping(element1: SModelElement & BoundsAware, element2: SModelElement & BoundsAware): boolean {
+    protected areOverlapping(element1: GModelElement & BoundsAware, element2: GModelElement & BoundsAware): boolean {
         const b1 = toAbsoluteBounds(element1);
         const b2 = toAbsoluteBounds(element2);
         const r1TopLeft: Point = b1;
@@ -98,11 +97,11 @@ export class NoOverlapMovementRestrictor implements IMovementRestrictor {
  * @returns The corresponding {@link ModifyCSSFeedbackAction}
  */
 export function createMovementRestrictionFeedback(
-    element: SModelElement,
+    element: GModelElement,
     movementRestrictor: IMovementRestrictor
 ): ModifyCSSFeedbackAction {
-    const elements: SModelElement[] = [element];
-    if (element instanceof SParentElement) {
+    const elements: GModelElement[] = [element];
+    if (element instanceof GParentElement) {
         element.children.filter(child => child instanceof SResizeHandle).forEach(e => elements.push(e));
     }
     return ModifyCSSFeedbackAction.create({ elements, add: movementRestrictor.cssClasses });
@@ -115,11 +114,11 @@ export function createMovementRestrictionFeedback(
  * @returns The corresponding {@link ModifyCSSFeedbackAction}
  */
 export function removeMovementRestrictionFeedback(
-    element: SModelElement,
+    element: GModelElement,
     movementRestrictor: IMovementRestrictor
 ): ModifyCSSFeedbackAction {
-    const elements: SModelElement[] = [element];
-    if (element instanceof SParentElement) {
+    const elements: GModelElement[] = [element];
+    if (element instanceof GParentElement) {
         element.children.filter(child => child instanceof SResizeHandle).forEach(e => elements.push(e));
     }
 

package/src/features/change-bounds/snap.spec.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2022 EclipseSource and others.
+ * Copyright (c) 2022-2023 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
@@ -15,12 +15,12 @@
  ********************************************************************************/
 
 import { expect } from 'chai';
-import { SModelElement } from 'sprotty';
+import { GModelElement } from '@eclipse-glsp/sprotty';
 import { GridSnapper, PointPositionUpdater } from './snap';
 
 describe('GridSnapper', () => {
     it('snap', () => {
-        const element = new SModelElement();
+        const element = new GModelElement();
         const snapper = new GridSnapper();
         expect(snapper.snap({ x: 0, y: 0 }, element)).to.be.deep.equals({ x: 0, y: 0 });
         expect(snapper.snap({ x: 4, y: 5 }, element)).to.be.deep.equals({ x: 0, y: 10 });
@@ -31,7 +31,7 @@ describe('GridSnapper', () => {
 
 describe('PointPositionUpdater', () => {
     it('updatePosition with no last drag position', () => {
-        const element = new SModelElement();
+        const element = new GModelElement();
         const updater = new PointPositionUpdater();
         expect(updater.updatePosition(element, { x: 0, y: 0 }, false)).to.be.undefined;
         expect(updater.updatePosition(element, { x: 0, y: 0 }, true)).to.be.undefined;
@@ -47,7 +47,7 @@ describe('PointPositionUpdater', () => {
     });
 
     it('updatePosition with no snapper', () => {
-        const element = new SModelElement();
+        const element = new GModelElement();
         const updater = new PointPositionUpdater();
         resetUpdater(updater);
         expect(updater.updatePosition(element, { x: 0, y: 0 }, false)).to.be.undefined;
@@ -61,7 +61,7 @@ describe('PointPositionUpdater', () => {
     });
 
     it('updatePosition with snapper', () => {
-        const element = new SModelElement();
+        const element = new GModelElement();
         const snapper = new GridSnapper();
         const updater = new PointPositionUpdater(snapper);
         resetUpdater(updater);