@eclipse-glsp/client 1.1.0-next.c54a4b8.246 → 1.1.0-next.c5afbfa.273

package/src/features/accessibility/search/search-palette.ts

@@ -14,15 +14,28 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action, CenterAction, SelectAction, SelectAllAction } from '@eclipse-glsp/protocol';
 import { injectable } from 'inversify';
 import { isEqual } from 'lodash';
-import { codiconCSSString, isNameable, LabeledAction, name, SEdge, SModelElement, SModelRoot, SNode } from 'sprotty';
 import { toArray } from 'sprotty/lib/utils/iterable';
+import {
+    Action,
+    CenterAction,
+    LabeledAction,
+    SEdge,
+    SModelElement,
+    SModelRoot,
+    SNode,
+    SelectAction,
+    SelectAllAction,
+    codiconCSSString,
+    isNameable,
+    name
+} from '~glsp-sprotty';
 import { AutocompleteSuggestion, IAutocompleteSuggestionProvider } from '../../autocomplete-palette/autocomplete-suggestion-providers';
 import { BaseAutocompletePalette } from '../../autocomplete-palette/base-autocomplete-palette';
 
-import { applyCssClasses, deleteCssClasses } from '../../tool-feedback/css-feedback';
+import { applyCssClasses, deleteCssClasses } from '../../../base/feedback/css-feedback';
+import { RepositionAction } from '../../../features/viewport/reposition';
 
 const CSS_SEARCH_HIDDEN = 'search-hidden';
 const CSS_SEARCH_HIGHLIGHTED = 'search-highlighted';
@@ -32,11 +45,11 @@ export class RevealNamedElementAutocompleteSuggestionProvider implements IAutoco
         const nameables = toArray(root.index.all().filter(element => isNameable(element)));
         return nameables.map(nameable => ({
             element: nameable,
-            action: new LabeledAction(
-                `[${nameable.type}] ${name(nameable) ?? '<no-name>'}`,
-                this.getActions(nameable),
-                codiconCSSString('eye')
-            )
+            action: {
+                label: `[${nameable.type}] ${name(nameable) ?? '<no-name>'}`,
+                actions: this.getActions(nameable),
+                icon: codiconCSSString('eye')
+            }
         }));
     }
 
@@ -50,11 +63,11 @@ export class RevealEdgeElementAutocompleteSuggestionProvider implements IAutocom
         const edges = toArray(root.index.all().filter(element => element instanceof SEdge)) as SEdge[];
         return edges.map(edge => ({
             element: edge,
-            action: new LabeledAction(
-                `[${edge.type}] ` + this.getEdgeLabel(root, edge),
-                this.getActions(edge),
-                codiconCSSString('arrow-both')
-            )
+            action: {
+                label: `[${edge.type}]  ${this.getEdgeLabel(root, edge)}`,
+                actions: this.getActions(edge),
+                icon: codiconCSSString('arrow-both')
+            }
         }));
     }
     protected getActions(edge: SEdge): Action[] {
@@ -91,6 +104,7 @@ export class SearchAutocompletePalette extends BaseAutocompletePalette {
         super.initializeContents(containerElement);
 
         this.autocompleteWidget.inputField.placeholder = 'Search for elements';
+        containerElement.setAttribute('aria-label', 'Search Field');
     }
     protected getSuggestionProviders(root: Readonly<SModelRoot>, input: string): IAutocompleteSuggestionProvider[] {
         return [new RevealNamedElementAutocompleteSuggestionProvider(), new RevealEdgeElementAutocompleteSuggestionProvider()];
@@ -120,8 +134,8 @@ export class SearchAutocompletePalette extends BaseAutocompletePalette {
         if (labeledAction !== undefined) {
             const suggestions = this.getSuggestionsFromLabeledActions([labeledAction]);
 
-            const actions: CenterAction[] = [];
-            suggestions.map(currElem => actions.push(CenterAction.create([currElem.element.id], { animate: true, retainZoom: true })));
+            const actions: RepositionAction[] = [];
+            suggestions.map(currElem => actions.push(RepositionAction.create([currElem.element.id])));
 
             this.actionDispatcher.dispatchAll(actions);
             await this.applyCSS(

package/src/features/accessibility/search/search-tool.ts

@@ -14,18 +14,19 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action } from '@eclipse-glsp/protocol';
 import { inject, injectable } from 'inversify';
-import { KeyListener, KeyTool, SetUIExtensionVisibilityAction, SModelElement, Tool } from 'sprotty';
 import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
+import { Action, KeyListener, KeyTool, SModelElement, SetUIExtensionVisibilityAction, TYPES } from '~glsp-sprotty';
+import { GLSPActionDispatcher } from '../../../base/action-dispatcher';
+import { Tool } from '../../../base/tool-manager/tool';
+import { AccessibleKeyShortcutProvider, SetAccessibleKeyShortcutAction } from '../key-shortcut/accessible-key-shortcut';
 import { SearchAutocompletePalette } from './search-palette';
-
 @injectable()
 export class SearchAutocompletePaletteTool implements Tool {
     static readonly ID = 'glsp.search-autocomplete-palette-tool';
 
-    protected readonly keyListener = new SearchAutocompletePaletteKeyListener();
-
+    protected readonly keyListener = new SearchAutocompletePaletteKeyListener(this);
+    @inject(TYPES.IActionDispatcher) readonly actionDispatcher: GLSPActionDispatcher;
     @inject(KeyTool) protected keyTool: KeyTool;
 
     get id(): string {
@@ -34,6 +35,7 @@ export class SearchAutocompletePaletteTool implements Tool {
 
     enable(): void {
         this.keyTool.register(this.keyListener);
+        this.keyListener.registerShortcutKey();
     }
 
     disable(): void {
@@ -41,7 +43,24 @@ export class SearchAutocompletePaletteTool implements Tool {
     }
 }
 
-export class SearchAutocompletePaletteKeyListener extends KeyListener {
+export class SearchAutocompletePaletteKeyListener extends KeyListener implements AccessibleKeyShortcutProvider {
+    protected readonly token = SearchAutocompletePalette.name;
+
+    constructor(protected tool: SearchAutocompletePaletteTool) {
+        super();
+    }
+
+    registerShortcutKey(): void {
+        this.tool.actionDispatcher.onceModelInitialized().then(() => {
+            this.tool.actionDispatcher.dispatchAll([
+                SetAccessibleKeyShortcutAction.create({
+                    token: this.token,
+                    keys: [{ shortcuts: ['CTRL', 'F'], description: 'Activate search for elements', group: 'Search', position: 0 }]
+                })
+            ]);
+        });
+    }
+
     override keyDown(element: SModelElement, event: KeyboardEvent): Action[] {
         if (this.matchesSearchActivateKeystroke(event)) {
             return [

package/src/features/accessibility/toast/messages.json

@@ -0,0 +1,16 @@
+{
+  "navigation": {
+    "default_navigation_mode_activated": "Navigation On: Use arrow keys to select preceding (←) or succeding (→) elements. Use the up (↑) and down (↓) arrows to navigate paths. Press 'N' to exit.",
+    "default_navigation_mode_deactivated": "Navigation Off: Press 'N' for default navigation, 'ALT+N' for position based navigation.",
+    "local_navigation_mode_activated": "Position based Nav On: Navigate nearest elements using arrow keys: (↑) for above, (↓) for below, (←) for previous, (→) for next element. Press 'ALT+N' to exit.",
+    "local_navigation_mode_deactivated": "Position based Nav Off: Press 'N' for default navigation, 'ALT+N' for position based navigation."
+  },
+  "focus": {
+    "focus_on": "Currently focused: ",
+    "focus_off": "Currently no element is focused."
+  },
+  "resize": {
+    "resize_mode_activated": "Resize On: Use plus(+) and minus(-) to resize, 'CTRL'+'0' for default size. Press 'ESC' to exit.",
+    "resize_mode_deactivated": "Resize Off: Press 'ALT'+'A' for resize mode."
+  }
+}

package/src/features/accessibility/toast/toast-handler.ts

@@ -0,0 +1,69 @@
+/********************************************************************************
+ * Copyright (c) 2023 Business Informatics Group (TU Wien) 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 { Action } from '~glsp-sprotty';
+
+export interface HideToastAction extends Action {
+    kind: typeof HideToastAction.KIND;
+    options: HideToastAction.Options;
+}
+
+export namespace HideToastAction {
+    export const KIND = 'hideToastMessageAction';
+
+    export type Options = Pick<ToastOptions, 'id' | 'timeout'>;
+
+    export function is(object: any): object is HideToastAction {
+        return Action.hasKind(object, KIND);
+    }
+
+    export function create(options: Options): HideToastAction {
+        return { kind: KIND, options };
+    }
+}
+
+export interface ShowToastMessageAction extends Action {
+    kind: typeof ShowToastMessageAction.KIND;
+    options: ToastOptions;
+}
+
+export namespace ShowToastMessageAction {
+    export const KIND = 'showToastMessageAction';
+    export const TIMEOUT = 2000;
+
+    export type CreateOptions = Partial<ToastOptions> & Required<Pick<ToastOptions, 'message'>>;
+
+    export function is(object: any): object is ShowToastMessageAction {
+        return Action.hasKind(object, KIND);
+    }
+
+    export function create(options: CreateOptions): ShowToastMessageAction {
+        return { kind: KIND, options: { ...options, position: options.position ?? 'center', id: options.id ?? Symbol('toast id') } };
+    }
+    export function createWithTimeout(options: CreateOptions): ShowToastMessageAction {
+        return {
+            kind: KIND,
+            options: { timeout: TIMEOUT, ...options, position: options.position ?? 'center', id: options.id ?? Symbol('toast id') }
+        };
+    }
+}
+
+export interface ToastOptions {
+    id: symbol;
+    timeout?: number;
+    position: 'left' | 'center' | 'right';
+    message: string;
+}

package/src/features/accessibility/toast/toast-module.ts

@@ -0,0 +1,36 @@
+/********************************************************************************
+ * Copyright (c) 2023 Business Informatics Group (TU Wien) 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 { ContainerModule } from 'inversify';
+import { bindAsService, BindingContext, configureActionHandler, TYPES } from '~glsp-sprotty';
+import '../../../../css/toast.css';
+import { HideToastAction, ShowToastMessageAction } from './toast-handler';
+import { Toast } from './toast-tool';
+
+/**
+ * Handles toast/user notification actions.
+ */
+
+export const glspToastModule = new ContainerModule((bind, unbind, isBound, rebind) => {
+    const context = { bind, unbind, isBound, rebind };
+    configureToastTool(context);
+});
+
+export function configureToastTool(context: BindingContext): void {
+    bindAsService(context, TYPES.IUIExtension, Toast);
+    context.bind(TYPES.IDiagramStartup).toService(Toast);
+    configureActionHandler(context, ShowToastMessageAction.KIND, Toast);
+    configureActionHandler(context, HideToastAction.KIND, Toast);
+}

package/src/features/accessibility/toast/toast-tool.ts

@@ -0,0 +1,108 @@
+/********************************************************************************
+ * Copyright (c) 2023 Business Informatics Group (TU Wien) 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, inject } from 'inversify';
+import { Action, AbstractUIExtension, IActionHandler, ICommand, TYPES } from '~glsp-sprotty';
+import { IDiagramStartup } from '../../../base/model/diagram-loader';
+import { GLSPActionDispatcher } from '../../../base/action-dispatcher';
+import { EditorContextService } from '../../../base/editor-context-service';
+import { HideToastAction, ShowToastMessageAction, ToastOptions } from './toast-handler';
+
+/**
+ * This extension is used to create customized user notifications as toast messages.
+ */
+@injectable()
+export class Toast extends AbstractUIExtension implements IActionHandler, IDiagramStartup {
+    static readonly ID = 'toast';
+    protected messages: { [key: symbol]: ToastOptions } = {};
+
+    @inject(TYPES.IActionDispatcher) protected readonly actionDispatcher: GLSPActionDispatcher;
+    @inject(EditorContextService)
+    protected editorContext: EditorContextService;
+
+    id(): string {
+        return Toast.ID;
+    }
+    containerClass(): string {
+        return Toast.ID;
+    }
+
+    protected initializeContents(_containerElement: HTMLElement): void {
+        this.render();
+    }
+
+    handle(action: Action): ICommand | Action | void {
+        if (ShowToastMessageAction.is(action)) {
+            this.messages[action.options.id] = action.options;
+            this.render();
+
+            if (action.options.timeout) {
+                setTimeout(() => {
+                    this.delete(action.options.id);
+                }, action.options.timeout);
+            }
+        } else if (HideToastAction.is(action)) {
+            if (action.options.timeout) {
+                setTimeout(() => {
+                    this.delete(action.options.id);
+                }, action.options.timeout);
+            } else {
+                this.delete(action.options.id);
+            }
+        }
+    }
+
+    protected render(): void {
+        if (this.containerElement === undefined) {
+            return;
+        }
+
+        this.containerElement.innerHTML = '';
+
+        this.values(this.messages).forEach(message => {
+            this.containerElement.appendChild(this.createToastMessage(message));
+        });
+    }
+
+    protected delete(id: symbol): void {
+        delete this.messages[id];
+        this.render();
+    }
+
+    protected createToastMessage(option: ToastOptions): HTMLDivElement {
+        const cell = document.createElement('div');
+        cell.classList.add('toast-cell', `toast-column-${option.position}`);
+
+        const container = document.createElement('div');
+        container.classList.add('toast-container');
+
+        const text = document.createElement('span');
+        text.textContent = option.message;
+
+        container.appendChild(text);
+        cell.appendChild(container);
+
+        return cell;
+    }
+
+    preInitialize(): void {
+        this.show(this.editorContext.modelRoot);
+    }
+
+    values(obj: { [key: symbol]: ToastOptions }): ToastOptions[] {
+        return Object.getOwnPropertySymbols(obj).map(s => obj[s]);
+    }
+}

package/src/features/accessibility/view-key-tools/deselect-key-tool.ts

@@ -14,19 +14,27 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action, SelectAction } from '@eclipse-glsp/protocol';
 import { inject, injectable } from 'inversify';
-import { isSelectable, KeyListener, KeyTool, SModelElement, SRoutableElement, SwitchEditModeAction } from 'sprotty';
 import { toArray } from 'sprotty/lib/utils/iterable';
 import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
-import { GLSPTool } from '../../../base/tool-manager/glsp-tool-manager';
+import {
+    Action,
+    KeyListener,
+    KeyTool,
+    SModelElement,
+    SRoutableElement,
+    SelectAction,
+    SwitchEditModeAction,
+    isSelectable
+} from '~glsp-sprotty';
+import { Tool } from '../../../base/tool-manager/tool';
 import { SResizeHandle } from '../../change-bounds/model';
 
 /**
  * Deselects the element if there is no interaction possible with element.
  */
 @injectable()
-export class DeselectKeyTool implements GLSPTool {
+export class DeselectKeyTool implements Tool {
     static ID = 'glsp.deselect-key-tool';
 
     isEditTool = true;

package/src/features/accessibility/view-key-tools/movement-key-tool.ts

@@ -14,22 +14,21 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action } from '@eclipse-glsp/protocol';
 import { inject, injectable, optional } from 'inversify';
-import { ISnapper, KeyListener, KeyTool, SModelElement } from 'sprotty';
 import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
-import { GLSPTool } from '../../../base/tool-manager/glsp-tool-manager';
-import { TYPES } from '../../../base/types';
+import { Action, ISnapper, KeyListener, KeyTool, SModelElement, TYPES } from '~glsp-sprotty';
+import { GLSPActionDispatcher } from '../../../base/action-dispatcher';
+import { SelectionService } from '../../../base/selection-service';
+import { Tool } from '../../../base/tool-manager/tool';
 import { GridSnapper } from '../../change-bounds/snap';
-
-import { SelectionService } from '../../select/selection-service';
+import { AccessibleKeyShortcutProvider, SetAccessibleKeyShortcutAction } from '../key-shortcut/accessible-key-shortcut';
 import { MoveElementAction, MoveViewportAction } from '../move-zoom/move-handler';
 
 /**
  * Moves viewport and elements when its focused and arrow keys are hit.
  */
 @injectable()
-export class MovementKeyTool implements GLSPTool {
+export class MovementKeyTool implements Tool {
     static ID = 'glsp.movement-key-tool';
 
     isEditTool = true;
@@ -37,8 +36,9 @@ export class MovementKeyTool implements GLSPTool {
     protected readonly movementKeyListener = new MoveKeyListener(this);
 
     @inject(KeyTool) protected readonly keytool: KeyTool;
-    @inject(TYPES.SelectionService) selectionService: SelectionService;
+    @inject(SelectionService) selectionService: SelectionService;
     @inject(TYPES.ISnapper) @optional() readonly snapper?: ISnapper;
+    @inject(TYPES.IActionDispatcher) readonly actionDispatcher: GLSPActionDispatcher;
 
     get id(): string {
         return MovementKeyTool.ID;
@@ -46,6 +46,7 @@ export class MovementKeyTool implements GLSPTool {
 
     enable(): void {
         this.keytool.register(this.movementKeyListener);
+        this.movementKeyListener.registerShortcutKey();
     }
 
     disable(): void {
@@ -53,13 +54,15 @@ export class MovementKeyTool implements GLSPTool {
     }
 }
 
-export class MoveKeyListener extends KeyListener {
+export class MoveKeyListener extends KeyListener implements AccessibleKeyShortcutProvider {
     // Default x distance used if GridSnapper is not provided
     static readonly defaultMoveX = 20;
 
     // Default y distance used if GridSnapper is not provided
     static readonly defaultMoveY = 20;
 
+    protected readonly token = MoveKeyListener.name;
+
     protected grid = { x: MoveKeyListener.defaultMoveX, y: MoveKeyListener.defaultMoveY };
 
     constructor(protected readonly tool: MovementKeyTool) {
@@ -70,6 +73,17 @@ export class MoveKeyListener extends KeyListener {
         }
     }
 
+    registerShortcutKey(): void {
+        this.tool.actionDispatcher.onceModelInitialized().then(() => {
+            this.tool.actionDispatcher.dispatchAll([
+                SetAccessibleKeyShortcutAction.create({
+                    token: this.token,
+                    keys: [{ shortcuts: ['⬅  ⬆  ➡  ⬇'], description: 'Move element or viewport', group: 'Move', position: 0 }]
+                })
+            ]);
+        });
+    }
+
     override keyDown(element: SModelElement, event: KeyboardEvent): Action[] {
         const selectedElementIds = this.tool.selectionService.getSelectedElementIDs();
 

package/src/features/accessibility/view-key-tools/view-key-tools-module.ts

@@ -0,0 +1,31 @@
+/********************************************************************************
+ * 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
+ * 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 { bindAsService, BindingContext, FeatureModule, TYPES } from '~glsp-sprotty';
+import { DeselectKeyTool } from './deselect-key-tool';
+import { MovementKeyTool } from './movement-key-tool';
+import { ZoomKeyTool } from './zoom-key-tool';
+
+export const viewKeyToolsModule = new FeatureModule((bind, _unbind, isBound, rebind) => {
+    const context = { bind, isBound, rebind };
+    configureViewKeyTools(context);
+});
+
+export function configureViewKeyTools(context: Pick<BindingContext, 'bind'>): void {
+    bindAsService(context, TYPES.IDefaultTool, MovementKeyTool);
+    bindAsService(context, TYPES.IDefaultTool, ZoomKeyTool);
+    bindAsService(context, TYPES.IDefaultTool, DeselectKeyTool);
+}

package/src/features/accessibility/view-key-tools/zoom-key-tool.ts

@@ -14,20 +14,20 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action, CenterAction } from '@eclipse-glsp/protocol';
 import { inject, injectable } from 'inversify';
-import { KeyListener, KeyTool, SModelElement } from 'sprotty';
 import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
-import { GLSPTool } from '../../../base/tool-manager/glsp-tool-manager';
-import { TYPES } from '../../../base/types';
-import { SelectionService } from '../../select/selection-service';
+import { Action, CenterAction, KeyListener, KeyTool, SModelElement, TYPES } from '~glsp-sprotty';
+import { GLSPActionDispatcher } from '../../../base/action-dispatcher';
+import { SelectionService } from '../../../base/selection-service';
+import { Tool } from '../../../base/tool-manager/tool';
+import { SetAccessibleKeyShortcutAction } from '../key-shortcut/accessible-key-shortcut';
 import { ZoomElementAction, ZoomViewportAction } from '../move-zoom/zoom-handler';
 
 /**
  * Zoom viewport and elements when its focused and arrow keys are hit.
  */
 @injectable()
-export class ZoomKeyTool implements GLSPTool {
+export class ZoomKeyTool implements Tool {
     static ID = 'glsp.zoom-key-tool';
 
     isEditTool = false;
@@ -35,7 +35,8 @@ export class ZoomKeyTool implements GLSPTool {
     protected readonly zoomKeyListener = new ZoomKeyListener(this);
 
     @inject(KeyTool) protected readonly keytool: KeyTool;
-    @inject(TYPES.SelectionService) selectionService: SelectionService;
+    @inject(TYPES.IActionDispatcher) readonly actionDispatcher: GLSPActionDispatcher;
+    @inject(SelectionService) selectionService: SelectionService;
 
     get id(): string {
         return ZoomKeyTool.ID;
@@ -43,6 +44,7 @@ export class ZoomKeyTool implements GLSPTool {
 
     enable(): void {
         this.keytool.register(this.zoomKeyListener);
+        this.zoomKeyListener.registerShortcutKey();
     }
 
     disable(): void {
@@ -53,11 +55,28 @@ export class ZoomKeyTool implements GLSPTool {
 export class ZoomKeyListener extends KeyListener {
     static readonly defaultZoomInFactor = 1.1;
     static readonly defaultZoomOutFactor = 0.9;
+    protected readonly token = ZoomKeyListener.name;
 
     constructor(protected tool: ZoomKeyTool) {
         super();
     }
 
+    registerShortcutKey(): void {
+        this.tool.actionDispatcher.onceModelInitialized().then(() => {
+            this.tool.actionDispatcher.dispatchAll([
+                SetAccessibleKeyShortcutAction.create({
+                    token: this.token,
+                    keys: [
+                        { shortcuts: ['+'], description: 'Zoom in to element or viewport', group: 'Zoom', position: 0 },
+                        { shortcuts: ['-'], description: 'Zoom out to element or viewport', group: 'Zoom', position: 1 },
+                        { shortcuts: ['CTRL', '0'], description: 'Reset zoom to default', group: 'Zoom', position: 2 },
+                        { shortcuts: ['CTRL', '+'], description: 'Zoom in via Grid', group: 'Zoom', position: 3 }
+                    ]
+                })
+            ]);
+        });
+    }
+
     override keyDown(element: SModelElement, event: KeyboardEvent): Action[] {
         const selectedElementIds = this.tool.selectionService.getSelectedElementIDs();
 

package/src/features/autocomplete-palette/autocomplete-suggestion-providers.ts

@@ -14,7 +14,7 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { LabeledAction, SModelElement, SModelRoot } from 'sprotty';
+import { LabeledAction, SModelElement, SModelRoot } from '~glsp-sprotty';
 
 /**
  * Interface for a provider that provides suggestions that can be used to fill the autocomplete

package/src/features/autocomplete-palette/base-autocomplete-palette.ts

@@ -14,9 +14,8 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { Action } from '@eclipse-glsp/protocol';
 import { inject } from 'inversify';
-import { AbstractUIExtension, LabeledAction, SModelRoot, TYPES } from 'sprotty';
+import { AbstractUIExtension, Action, LabeledAction, SModelRoot, TYPES } from '~glsp-sprotty';
 import '../../../css/autocomplete-palette.css';
 import { GLSPActionDispatcher } from '../../base/action-dispatcher';
 import { AutoCompleteWidget, CloseReason, toActionArray } from '../../base/auto-complete/auto-complete-widget';

package/src/features/bounds/bounds-module.ts

@@ -0,0 +1,47 @@
+/********************************************************************************
+ * 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
+ * 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 {
+    FeatureModule,
+    HBoxLayouter,
+    HiddenBoundsUpdater,
+    LayoutRegistry,
+    Layouter,
+    RequestBoundsCommand,
+    SetBoundsCommand,
+    TYPES,
+    VBoxLayouter,
+    bindAsService,
+    configureCommand,
+    configureLayout
+} from '~glsp-sprotty';
+import { FreeFormLayouter } from './freeform-layout';
+import { GLSPHiddenBoundsUpdater } from './glsp-hidden-bounds-updater';
+import { HBoxLayouterExt } from './hbox-layout';
+import { VBoxLayouterExt } from './vbox-layout';
+
+export const boundsModule = new FeatureModule((bind, _unbind, isBound, _rebind) => {
+    const context = { bind, isBound };
+    configureCommand(context, SetBoundsCommand);
+    configureCommand(context, RequestBoundsCommand);
+    bind(HiddenBoundsUpdater).toSelf().inSingletonScope();
+    bindAsService(context, TYPES.HiddenVNodePostprocessor, GLSPHiddenBoundsUpdater);
+    bind(TYPES.Layouter).to(Layouter).inSingletonScope();
+    bind(TYPES.LayoutRegistry).to(LayoutRegistry).inSingletonScope();
+
+    configureLayout(context, VBoxLayouter.KIND, VBoxLayouterExt);
+    configureLayout(context, HBoxLayouter.KIND, HBoxLayouterExt);
+    configureLayout(context, FreeFormLayouter.KIND, FreeFormLayouter);
+});