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

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 '@eclipse-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

@@ -0,0 +1,88 @@
+/********************************************************************************
+ * 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 { inject, injectable } from 'inversify';
+import { toArray } from 'sprotty/lib/utils/iterable';
+import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
+import {
+    Action,
+    KeyListener,
+    KeyTool,
+    GModelElement,
+    GRoutableElement,
+    SelectAction,
+    SwitchEditModeAction,
+    isSelectable
+} from '@eclipse-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 Tool {
+    static ID = 'glsp.deselect-key-tool';
+
+    isEditTool = true;
+
+    protected readonly deselectKeyListener = new DeselectKeyListener();
+
+    @inject(KeyTool) protected readonly keytool: KeyTool;
+
+    get id(): string {
+        return DeselectKeyTool.ID;
+    }
+
+    enable(): void {
+        this.keytool.register(this.deselectKeyListener);
+    }
+
+    disable(): void {
+        this.keytool.deregister(this.deselectKeyListener);
+    }
+}
+
+export class DeselectKeyListener extends KeyListener {
+    override keyDown(target: GModelElement, event: KeyboardEvent): Action[] {
+        if (this.matchesDeselectKeystroke(event)) {
+            const isResizeHandleActive = toArray(target.root.index.all().filter(el => el instanceof SResizeHandle)).length > 0;
+
+            if (isResizeHandleActive) {
+                return [];
+            }
+
+            const deselect = toArray(target.root.index.all().filter(element => isSelectable(element) && element.selected));
+            const actions: Action[] = [];
+
+            if (deselect.length > 0) {
+                actions.push(SelectAction.create({ deselectedElementsIDs: deselect.map(e => e.id) }));
+            }
+
+            const routableDeselect = deselect.filter(e => e instanceof GRoutableElement).map(e => e.id);
+            if (routableDeselect.length > 0) {
+                actions.push(SwitchEditModeAction.create({ elementsToDeactivate: routableDeselect }));
+            }
+
+            return actions;
+        }
+        return [];
+    }
+
+    protected matchesDeselectKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'Escape');
+    }
+}

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

@@ -0,0 +1,127 @@
+/********************************************************************************
+ * 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 { inject, injectable, optional } from 'inversify';
+import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
+import { Action, ISnapper, KeyListener, KeyTool, GModelElement, TYPES } from '@eclipse-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 { 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 Tool {
+    static ID = 'glsp.movement-key-tool';
+
+    isEditTool = true;
+
+    protected readonly movementKeyListener = new MoveKeyListener(this);
+
+    @inject(KeyTool) protected readonly keytool: KeyTool;
+    @inject(SelectionService) selectionService: SelectionService;
+    @inject(TYPES.ISnapper) @optional() readonly snapper?: ISnapper;
+    @inject(TYPES.IActionDispatcher) readonly actionDispatcher: GLSPActionDispatcher;
+
+    get id(): string {
+        return MovementKeyTool.ID;
+    }
+
+    enable(): void {
+        this.keytool.register(this.movementKeyListener);
+        this.movementKeyListener.registerShortcutKey();
+    }
+
+    disable(): void {
+        this.keytool.deregister(this.movementKeyListener);
+    }
+}
+
+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) {
+        super();
+
+        if (this.tool.snapper instanceof GridSnapper) {
+            this.grid = this.tool.snapper.grid;
+        }
+    }
+
+    registerShortcutKey(): void {
+        this.tool.actionDispatcher.dispatchOnceModelInitialized(
+            SetAccessibleKeyShortcutAction.create({
+                token: this.token,
+                keys: [{ shortcuts: ['⬅  ⬆  ➡  ⬇'], description: 'Move element or viewport', group: 'Move', position: 0 }]
+            })
+        );
+    }
+
+    override keyDown(element: GModelElement, event: KeyboardEvent): Action[] {
+        const selectedElementIds = this.tool.selectionService.getSelectedElementIDs();
+
+        if (selectedElementIds.length > 0) {
+            if (this.matchesMoveUpKeystroke(event)) {
+                return [MoveElementAction.create(selectedElementIds, 0, -this.grid.x)];
+            } else if (this.matchesMoveDownKeystroke(event)) {
+                return [MoveElementAction.create(selectedElementIds, 0, this.grid.x)];
+            } else if (this.matchesMoveRightKeystroke(event)) {
+                return [MoveElementAction.create(selectedElementIds, this.grid.x, 0)];
+            } else if (this.matchesMoveLeftKeystroke(event)) {
+                return [MoveElementAction.create(selectedElementIds, -this.grid.x, 0)];
+            }
+        } else {
+            if (this.matchesMoveUpKeystroke(event)) {
+                return [MoveViewportAction.create(0, -this.grid.x)];
+            } else if (this.matchesMoveDownKeystroke(event)) {
+                return [MoveViewportAction.create(0, this.grid.x)];
+            } else if (this.matchesMoveRightKeystroke(event)) {
+                return [MoveViewportAction.create(this.grid.x, 0)];
+            } else if (this.matchesMoveLeftKeystroke(event)) {
+                return [MoveViewportAction.create(-this.grid.x, 0)];
+            }
+        }
+        return [];
+    }
+
+    protected matchesMoveUpKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'ArrowUp');
+    }
+
+    protected matchesMoveDownKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'ArrowDown');
+    }
+
+    protected matchesMoveRightKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'ArrowRight');
+    }
+
+    protected matchesMoveLeftKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'ArrowLeft');
+    }
+}

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

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

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

@@ -0,0 +1,197 @@
+/********************************************************************************
+ * 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 { inject, injectable } from 'inversify';
+import { matchesKeystroke } from 'sprotty/lib/utils/keyboard';
+import {
+    Action,
+    CenterAction,
+    KeyListener,
+    KeyTool,
+    Point,
+    GModelElement,
+    GModelRoot,
+    SetViewportAction,
+    TYPES,
+    Viewport,
+    isViewport
+} from '@eclipse-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';
+import { EnableKeyboardGridAction, KeyboardGridCellSelectedAction, KeyboardGridKeyboardEventAction } from '../keyboard-grid/action';
+import { getAbsolutePositionByPoint } from '../../../utils/viewpoint-util';
+import { EditorContextService } from '../../../base/editor-context-service';
+import { HideToastAction, ShowToastMessageAction } from '../toast/toast-handler';
+import { ElementNavigatorKeyListener } from '../element-navigation/diagram-navigation-tool';
+import * as messages from '../toast/messages.json';
+
+/**
+ * Zoom viewport and elements when its focused and arrow keys are hit.
+ */
+@injectable()
+export class ZoomKeyTool implements Tool {
+    static ID = 'glsp.zoom-key-tool';
+
+    isEditTool = false;
+
+    protected readonly zoomKeyListener = new ZoomKeyListener(this);
+
+    @inject(KeyTool) protected readonly keytool: KeyTool;
+    @inject(TYPES.IActionDispatcher) readonly actionDispatcher: GLSPActionDispatcher;
+    @inject(SelectionService) selectionService: SelectionService;
+    @inject(EditorContextService)
+    protected editorContextService: EditorContextService;
+
+    get id(): string {
+        return ZoomKeyTool.ID;
+    }
+
+    enable(): void {
+        this.keytool.register(this.zoomKeyListener);
+        this.zoomKeyListener.registerShortcutKey();
+    }
+
+    disable(): void {
+        this.keytool.deregister(this.zoomKeyListener);
+    }
+
+    handle(action: Action): Action | void {
+        if (isViewport(this.editorContextService.modelRoot)) {
+            let viewportAction: Action | undefined = undefined;
+
+            if (KeyboardGridCellSelectedAction.is(action) && action.options.originId === ZoomKeyTool.ID) {
+                viewportAction = this.zoomKeyListener.setNewZoomFactor(
+                    this.editorContextService.modelRoot,
+                    ZoomKeyListener.defaultZoomInFactor,
+                    getAbsolutePositionByPoint(this.editorContextService.modelRoot, action.options.centerCellPosition)
+                );
+            } else if (KeyboardGridKeyboardEventAction.is(action) && action.options.originId === ZoomKeyTool.ID) {
+                if (matchesKeystroke(action.options.event, 'Minus')) {
+                    viewportAction = this.zoomKeyListener.setNewZoomFactor(
+                        this.editorContextService.modelRoot,
+                        ZoomKeyListener.defaultZoomOutFactor
+                    );
+                } else if (matchesKeystroke(action.options.event, 'Digit0', 'ctrl')) {
+                    viewportAction = CenterAction.create([]);
+                }
+            }
+
+            if (viewportAction) {
+                this.actionDispatcher.dispatchAll([
+                    viewportAction,
+                    HideToastAction.create({ id: Symbol.for(ElementNavigatorKeyListener.name) })
+                ]);
+            }
+        }
+    }
+}
+
+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.dispatchOnceModelInitialized(
+            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 }
+                ]
+            })
+        );
+    }
+
+    setNewZoomFactor(viewport: GModelElement & GModelRoot & Viewport, zoomFactor: number, point?: Point): SetViewportAction {
+        let newViewport: Viewport;
+        const newZoom = viewport.zoom * zoomFactor;
+
+        if (point) {
+            newViewport = {
+                scroll: {
+                    x: point.x - (0.5 * viewport.canvasBounds.width) / newZoom,
+                    y: point.y - (0.5 * viewport.canvasBounds.height) / newZoom
+                },
+                zoom: newZoom
+            };
+        } else {
+            newViewport = {
+                scroll: viewport.scroll,
+                zoom: newZoom
+            };
+        }
+        return SetViewportAction.create(viewport.id, newViewport, { animate: true });
+    }
+
+    override keyDown(element: GModelElement, event: KeyboardEvent): Action[] {
+        const selectedElementIds = this.tool.selectionService.getSelectedElementIDs();
+
+        if (this.matchesZoomViaGrid(event)) {
+            return [
+                EnableKeyboardGridAction.create({
+                    originId: ZoomKeyTool.ID,
+                    triggerActions: []
+                }),
+
+                ShowToastMessageAction.createWithTimeout({
+                    id: Symbol.for(ElementNavigatorKeyListener.name),
+                    message: messages.grid.zoom_in_grid
+                })
+            ];
+        } else if (this.matchesZoomOutKeystroke(event)) {
+            if (selectedElementIds.length > 0) {
+                return [ZoomElementAction.create(selectedElementIds, ZoomKeyListener.defaultZoomOutFactor)];
+            } else {
+                return [ZoomViewportAction.create(ZoomKeyListener.defaultZoomOutFactor)];
+            }
+        } else if (this.matchesZoomInKeystroke(event)) {
+            if (selectedElementIds.length > 0) {
+                return [ZoomElementAction.create(selectedElementIds, ZoomKeyListener.defaultZoomInFactor)];
+            } else {
+                return [ZoomViewportAction.create(ZoomKeyListener.defaultZoomInFactor)];
+            }
+        } else if (this.matchesMinZoomLevelKeystroke(event)) {
+            return [CenterAction.create(selectedElementIds)];
+        }
+        return [];
+    }
+
+    protected matchesZoomInKeystroke(event: KeyboardEvent): boolean {
+        /** here event.key is used for '+', as keycode 187 is already declared for 'Equals' in {@link matchesKeystroke}.*/
+        return event.key === '+' || matchesKeystroke(event, 'NumpadAdd');
+    }
+
+    protected matchesZoomViaGrid(event: KeyboardEvent): boolean {
+        return event.key === '+' && event.ctrlKey;
+    }
+    protected matchesMinZoomLevelKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'Digit0', 'ctrl') || matchesKeystroke(event, 'Numpad0', 'ctrl');
+    }
+
+    protected matchesZoomOutKeystroke(event: KeyboardEvent): boolean {
+        return matchesKeystroke(event, 'Minus') || matchesKeystroke(event, 'NumpadSubtract');
+    }
+}

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,
+    RequestBoundsCommand,
+    SetBoundsCommand,
+    TYPES,
+    VBoxLayouter,
+    bindAsService,
+    configureCommand,
+    configureLayout
+} from '@eclipse-glsp/sprotty';
+import { FreeFormLayouter } from './freeform-layout';
+import { GLSPHiddenBoundsUpdater } from './glsp-hidden-bounds-updater';
+import { HBoxLayouterExt } from './hbox-layout';
+import { LayouterExt } from './layouter';
+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(LayouterExt).inSingletonScope();
+    bind(TYPES.LayoutRegistry).to(LayoutRegistry).inSingletonScope();
+
+    configureLayout(context, VBoxLayouter.KIND, VBoxLayouterExt);
+    configureLayout(context, HBoxLayouter.KIND, HBoxLayouterExt);
+    configureLayout(context, FreeFormLayouter.KIND, FreeFormLayouter);
+});