@eclipse-glsp/client 2.6.0-next.1 → 2.6.0-next.12

package/src/features/context-menu/server-context-menu-provider.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2024 EclipseSource and others.
+ * Copyright (c) 2019-2025 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
@@ -14,11 +14,11 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 import {
-    Action,
+    ClientMenuItem,
     GModelElement,
     IActionDispatcher,
     IContextMenuItemProvider,
-    LabeledAction,
+    MenuItem,
     Point,
     RequestContextActions,
     SetContextActions,
@@ -37,7 +37,7 @@ export class ServerContextMenuItemProvider implements IContextMenuItemProvider {
     @inject(TYPES.IActionDispatcher) protected actionDispatcher: IActionDispatcher;
     @inject(EditorContextService) protected editorContext: EditorContextService;
 
-    async getItems(root: Readonly<GModelElement>, _lastMousePosition?: Point): Promise<LabeledAction[]> {
+    async getItems(root: Readonly<GModelElement>, _lastMousePosition?: Point): Promise<ClientMenuItem[]> {
         const selectedElementIds = Array.from(
             root.index
                 .all()
@@ -50,10 +50,9 @@ export class ServerContextMenuItemProvider implements IContextMenuItemProvider {
         return response ? this.getContextActionsFromResponse(response) : [];
     }
 
-    getContextActionsFromResponse(action: Action): LabeledAction[] {
-        if (SetContextActions.is(action)) {
-            return action.actions;
-        }
-        return [];
+    getContextActionsFromResponse(action: SetContextActions): ClientMenuItem[] {
+        return action.actions
+            .filter(item => MenuItem.is(item)) //
+            .map(item => ClientMenuItem.convert(item));
     }
 }

package/src/features/copy-paste/copy-paste-context-menu.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2020-2023 EclipseSource and others.
+ * Copyright (c) 2020-2025 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
@@ -14,21 +14,23 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 /* eslint-disable deprecation/deprecation */
-import { inject, injectable } from 'inversify';
 import {
     Action,
+    ClientMenuItem,
+    GModelRoot,
     IActionDispatcher,
     IActionHandler,
     IContextMenuItemProvider,
-    MenuItem,
-    Point,
-    GModelRoot,
     MessageAction,
+    Point,
     StatusAction,
     TYPES,
     hasStringProp,
     isSelected
 } from '@eclipse-glsp/sprotty';
+import { inject, injectable } from 'inversify';
+import { EditorContextService } from '../../base/editor-context-service';
+import { messages } from '../../base/messages';
 
 /**
  * An `InvokeCopyPasteAction` is dispatched by the client to initiate a cut, copy or paste operation.
@@ -89,39 +91,41 @@ export class InvokeCopyPasteActionHandler implements IActionHandler {
 
 @injectable()
 export class CopyPasteContextMenuItemProvider implements IContextMenuItemProvider {
-    getItems(root: Readonly<GModelRoot>, _lastMousePosition?: Point): Promise<MenuItem[]> {
+    @inject(EditorContextService)
+    protected editorContext: EditorContextService;
+
+    async getItems(root: Readonly<GModelRoot>, _lastMousePosition?: Point): Promise<ClientMenuItem[]> {
+        if (this.editorContext.isReadonly) {
+            return [];
+        }
         const hasSelectedElements = Array.from(root.index.all().filter(isSelected)).length > 0;
-        return Promise.resolve([
-            this.createCopyMenuItem(hasSelectedElements),
-            this.createCutMenuItem(hasSelectedElements),
-            this.createPasteMenuItem()
-        ]);
+        return [this.createCopyMenuItem(hasSelectedElements), this.createCutMenuItem(hasSelectedElements), this.createPasteMenuItem()];
     }
 
-    protected createPasteMenuItem(): MenuItem {
+    protected createPasteMenuItem(): ClientMenuItem {
         return {
             id: 'paste',
-            label: 'Paste',
+            label: messages.context_menu.paste,
             group: 'copy-paste',
             actions: [InvokeCopyPasteAction.create('paste')],
             isEnabled: () => true
         };
     }
 
-    protected createCutMenuItem(hasSelectedElements: boolean): MenuItem {
+    protected createCutMenuItem(hasSelectedElements: boolean): ClientMenuItem {
         return {
             id: 'cut',
-            label: 'Cut',
+            label: messages.context_menu.cut,
             group: 'copy-paste',
             actions: [InvokeCopyPasteAction.create('cut')],
             isEnabled: () => hasSelectedElements
         };
     }
 
-    protected createCopyMenuItem(hasSelectedElements: boolean): MenuItem {
+    protected createCopyMenuItem(hasSelectedElements: boolean): ClientMenuItem {
         return {
             id: 'copy',
-            label: 'Copy',
+            label: messages.context_menu.copy,
             group: 'copy-paste',
             actions: [InvokeCopyPasteAction.create('copy')],
             isEnabled: () => hasSelectedElements

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

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2024 EclipseSource and others.
+ * Copyright (c) 2019-2025 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
@@ -20,6 +20,7 @@ import { GlspDecorationPlacer } from './decoration-placer';
 export const decorationModule = new FeatureModule(
     bind => {
         bindAsService(bind, TYPES.IVNodePostprocessor, GlspDecorationPlacer);
+        bind(TYPES.ISvgExportPostprocessor).toService(GlspDecorationPlacer);
     },
     { featureId: Symbol('decoration') }
 );

package/src/features/decoration/decoration-placer.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2023 EclipseSource and others.
+ * Copyright (c) 2019-2025 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,37 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { Decoration, DecorationPlacer, GChildElement, GModelElement, GRoutableElement, Point, isSizeable } from '@eclipse-glsp/sprotty';
-import { injectable } from 'inversify';
+import {
+    Action,
+    DOMHelper,
+    Decoration,
+    DecorationPlacer,
+    GChildElement,
+    GModelElement,
+    GRoutableElement,
+    ISvgExportPostProcessor,
+    LazyInjector,
+    Point,
+    TYPES,
+    isDecoration,
+    isSizeable
+} from '@eclipse-glsp/sprotty';
+import { inject, injectable } from 'inversify';
+import { EditorContextService } from '../../base/editor-context-service';
+import { filter } from '../../utils/gmodel-util';
 
 @injectable()
-export class GlspDecorationPlacer extends DecorationPlacer {
+export class GlspDecorationPlacer extends DecorationPlacer implements ISvgExportPostProcessor {
     protected static readonly DECORATION_OFFSET: Point = { x: 12, y: 10 };
+    @inject(TYPES.DOMHelper)
+    protected domHelper: DOMHelper;
+
+    @inject(LazyInjector)
+    protected lazyInjector: LazyInjector;
+
+    get editorContextService(): EditorContextService {
+        return this.lazyInjector.get(EditorContextService);
+    }
 
     protected override getPosition(element: GModelElement & Decoration): Point {
         if (element instanceof GChildElement && element.parent instanceof GRoutableElement) {
@@ -32,4 +57,24 @@ export class GlspDecorationPlacer extends DecorationPlacer {
         }
         return Point.ORIGIN;
     }
+    // HiddenVNodePostprocessor implementation
+    override postUpdate(cause?: Action): void;
+    // ISvgExportPostProcessor implementation
+    override postUpdate(element: SVGSVGElement, cause?: Action): void;
+    override postUpdate(elementOrCause?: SVGSVGElement | Action, _cause?: Action): void {
+        // Called as HiddenVNodePostprocessor => no-op
+        if (!elementOrCause || Action.is(elementOrCause)) {
+            return;
+        }
+
+        // Called as ISvgExportPostProcessor
+        // Adjust the position of all decorations in the exported SVG
+        const svg = elementOrCause;
+        const translate = `translate(-${GlspDecorationPlacer.DECORATION_OFFSET.x}px, -${GlspDecorationPlacer.DECORATION_OFFSET.y}px)`;
+        filter(this.editorContextService.modelRoot.index, isDecoration).forEach(decoration => {
+            const domId = this.domHelper.createUniqueDOMElementId(decoration);
+            const element = svg.querySelector<SVGElement>(`#${domId}`);
+            element!.style.transform = translate;
+        });
+    }
 }

package/src/features/{accessibility/search/search-palette-module.ts → search-palette/search-palette-key-listener.ts}

@@ -14,20 +14,21 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { bindAsService, BindingContext, FeatureModule, TYPES } from '@eclipse-glsp/sprotty';
-import '../../../../css/search.css';
+import { Action, GModelElement, KeyListener, matchesKeystroke, SetUIExtensionVisibilityAction } from '@eclipse-glsp/sprotty';
+import { injectable } from 'inversify';
 import { SearchAutocompletePalette } from './search-palette';
-import { SearchAutocompletePaletteTool } from './search-tool';
 
-export const searchPaletteModule = new FeatureModule(
-    (bind, _unbind, isBound, rebind) => {
-        const context = { bind, isBound, rebind };
-        configureSearchPaletteModule(context);
-    },
-    { featureId: Symbol('searchPalette') }
-);
-
-export function configureSearchPaletteModule(context: Pick<BindingContext, 'bind'>): void {
-    bindAsService(context, TYPES.IUIExtension, SearchAutocompletePalette);
-    bindAsService(context, TYPES.IDefaultTool, SearchAutocompletePaletteTool);
+@injectable()
+export class SearchPaletteKeyListener extends KeyListener {
+    override keyDown(element: GModelElement, event: KeyboardEvent): Action[] {
+        if (matchesKeystroke(event, 'KeyF', 'ctrlCmd')) {
+            return [
+                SetUIExtensionVisibilityAction.create({
+                    extensionId: SearchAutocompletePalette.ID,
+                    visible: true
+                })
+            ];
+        }
+        return [];
+    }
 }

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

@@ -0,0 +1,48 @@
+/********************************************************************************
+ * Copyright (c) 2023-2025 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 { bindAsService, FeatureModule, TYPES } from '@eclipse-glsp/sprotty';
+import '../../../css/search.css';
+import { SearchAutocompletePalette } from './search-palette';
+import { SearchPaletteKeyListener } from './search-palette-key-listener';
+import { RevealEdgeElementSuggestionProvider } from './suggestions/edge-element-suggestions';
+import { NodesWithoutNameSuggestionProvider, RevealNamedElementSuggestionProvider } from './suggestions/named-element-suggestions';
+
+export const searchPaletteModule = new FeatureModule(
+    (bind, _unbind, isBound, rebind) => {
+        const context = { bind, isBound, rebind };
+        bindAsService(context, TYPES.IUIExtension, SearchAutocompletePalette);
+    },
+    { featureId: Symbol('searchPalette') }
+);
+
+export const searchPaletteDefaultSuggestionsModule = new FeatureModule(
+    (bind, _unbind, isBound, rebind) => {
+        const context = { bind, isBound, rebind };
+        bindAsService(context, TYPES.IAutocompleteSuggestionProvider, RevealNamedElementSuggestionProvider);
+        bindAsService(context, TYPES.IAutocompleteSuggestionProvider, NodesWithoutNameSuggestionProvider);
+        bindAsService(context, TYPES.IAutocompleteSuggestionProvider, RevealEdgeElementSuggestionProvider);
+    },
+    { featureId: Symbol('searchPaletteDefaultSuggestions'), requires: searchPaletteModule }
+);
+
+export const standaloneSearchPaletteModule = new FeatureModule(
+    (bind, _unbind, isBound) => {
+        const context = { bind, isBound };
+        bindAsService(context, TYPES.KeyListener, SearchPaletteKeyListener);
+    },
+    { featureId: Symbol('standaloneSearchPalette'), requires: searchPaletteModule }
+);

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

@@ -0,0 +1,164 @@
+/********************************************************************************
+ * Copyright (c) 2023-2025 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 { GModelElement, GModelRoot, GNode, LabeledAction, SelectAllAction, toArray, TYPES } from '@eclipse-glsp/sprotty';
+import { inject, injectable } from 'inversify';
+import { debounce, isEqual } from 'lodash';
+import {
+    AutocompleteSuggestionProviderContext,
+    type AutocompleteSuggestion,
+    type AutocompleteSuggestionRegistry
+} from '../../base/auto-complete/autocomplete-suggestion-provider';
+import { BaseAutocompletePalette } from '../../base/auto-complete/base-autocomplete-palette';
+import { applyCssClasses, deleteCssClasses } from '../../base/feedback/css-feedback';
+import { messages } from '../../base/messages';
+import { GEdge } from '../../model';
+import { RepositionAction } from '../viewport/reposition';
+
+const CSS_SEARCH_HIDDEN = 'search-hidden';
+const CSS_SEARCH_HIGHLIGHTED = 'search-highlighted';
+
+export interface SearchAutocompleteSuggestion extends Required<AutocompleteSuggestion> {}
+
+export namespace SearchAutocompleteSuggestion {
+    export function is(suggestion: AutocompleteSuggestion): suggestion is SearchAutocompleteSuggestion {
+        return suggestion.element !== undefined;
+    }
+}
+
+@injectable()
+export class SearchAutocompletePalette extends BaseAutocompletePalette {
+    static readonly ID: string = 'glsp.search-autocomplete-palette';
+
+    @inject(TYPES.IAutocompleteSuggestionProviderRegistry)
+    protected readonly suggestionRegistry: AutocompleteSuggestionRegistry;
+
+    /**
+     * Cache the suggestions so that we don't have to retrieve them again for CSS manipulation.
+     */
+    protected cachedSuggestions: SearchAutocompleteSuggestion[] = [];
+
+    id(): string {
+        return SearchAutocompletePalette.ID;
+    }
+
+    /**
+     * The search context for the search palette. This is used to filter the suggestions
+     */
+    get searchContext(): string[] {
+        return [AutocompleteSuggestionProviderContext.CANVAS];
+    }
+
+    protected override initializeContents(containerElement: HTMLElement): void {
+        super.initializeContents(containerElement);
+
+        this.autocompleteWidget.inputField.placeholder = messages.search.placeholder;
+        containerElement.setAttribute('aria-label', messages.search.label);
+    }
+
+    protected async retrieveSuggestions(root: Readonly<GModelRoot>, input: string): Promise<LabeledAction[]> {
+        const suggestions = await this.provideSearchSuggestions(root, input);
+        this.cachedSuggestions = suggestions;
+        return suggestions.map(s => s.action);
+    }
+
+    protected async provideSearchSuggestions(root: Readonly<GModelRoot>, input: string): Promise<SearchAutocompleteSuggestion[]> {
+        return (
+            await Promise.all(
+                this.suggestionRegistry.providersForContext(this.searchContext).flatMap(provider => provider.getSuggestions(root, input))
+            )
+        )
+            .flat(1)
+            .filter(SearchAutocompleteSuggestion.is);
+    }
+
+    protected override async visibleSuggestionsChanged(root: Readonly<GModelRoot>, labeledActions: LabeledAction[]): Promise<void> {
+        await this.applyCSS(this.getHiddenElements(root, this.getSuggestionsFromLabeledActions(labeledActions)), CSS_SEARCH_HIDDEN);
+        await this.deleteCSS(
+            this.getSuggestionsFromLabeledActions(labeledActions)
+                .filter(s => s.element)
+                .map(s => s.element!),
+            CSS_SEARCH_HIDDEN
+        );
+    }
+
+    protected override async selectedSuggestionChanged(
+        root: Readonly<GModelRoot>,
+        labeledAction?: LabeledAction | undefined
+    ): Promise<void> {
+        await this.handleSuggestionChanged(root, labeledAction);
+    }
+
+    protected readonly handleSuggestionChanged = debounce(this.doHandleSuggestionChanged, 300, { trailing: true });
+    protected async doHandleSuggestionChanged(root: Readonly<GModelRoot>, labeledAction?: LabeledAction | undefined): Promise<void> {
+        await this.deleteAllCSS(root, CSS_SEARCH_HIGHLIGHTED);
+        if (labeledAction !== undefined) {
+            const suggestions = this.getSuggestionsFromLabeledActions([labeledAction]);
+
+            const actions: RepositionAction[] = [];
+            suggestions.map(currElem => actions.push(RepositionAction.create([currElem.element.id])));
+
+            this.actionDispatcher.dispatchAll(actions);
+            await this.applyCSS(
+                suggestions.map(s => s.element),
+                CSS_SEARCH_HIGHLIGHTED
+            );
+        }
+    }
+
+    override show(root: Readonly<GModelRoot>, ...contextElementIds: string[]): void {
+        this.actionDispatcher.dispatch(SelectAllAction.create(false));
+
+        super.show(root, ...contextElementIds);
+    }
+
+    override hide(): void {
+        if (this.root !== undefined) {
+            this.deleteAllCSS(this.root, CSS_SEARCH_HIDDEN, CSS_SEARCH_HIGHLIGHTED);
+            this.autocompleteWidget.inputField.value = '';
+        }
+
+        super.hide();
+    }
+
+    protected applyCSS(elements: GModelElement[], ...add: string[]): Promise<void> {
+        const actions = elements.map(element => applyCssClasses(element, ...add));
+        return this.actionDispatcher.dispatchAll(actions);
+    }
+
+    protected deleteCSS(elements: GModelElement[], ...remove: string[]): Promise<void> {
+        const actions = elements.map(element => deleteCssClasses(element, ...remove));
+        return this.actionDispatcher.dispatchAll(actions);
+    }
+
+    protected deleteAllCSS(root: Readonly<GModelRoot>, ...remove: string[]): Promise<void> {
+        const actions = toArray(root.index.all().map(element => deleteCssClasses(element, ...remove)));
+        return this.actionDispatcher.dispatchAll(actions);
+    }
+
+    protected getSuggestionsFromLabeledActions(labeledActions: LabeledAction[]): SearchAutocompleteSuggestion[] {
+        return this.cachedSuggestions.filter(c => labeledActions.find(s => isEqual(s, c.action)));
+    }
+
+    protected getHiddenElements(root: Readonly<GModelRoot>, suggestions: SearchAutocompleteSuggestion[]): GModelElement[] {
+        return toArray(
+            root.index
+                .all()
+                .filter(element => element instanceof GNode || element instanceof GEdge)
+                .filter(element => suggestions.find(suggestion => suggestion.element.id === element.id) === undefined)
+        );
+    }
+}

package/src/features/search-palette/suggestions/edge-element-suggestions.ts

@@ -0,0 +1,71 @@
+/********************************************************************************
+ * Copyright (c) 2023-2025 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, CenterAction, GModelRoot, SelectAction, codiconCSSString, name, toArray } from '@eclipse-glsp/sprotty';
+import { injectable } from 'inversify';
+import {
+    AutocompleteSuggestionProviderContext,
+    IAutocompleteSuggestionProvider,
+    type AutocompleteSuggestion
+} from '../../../base/auto-complete/autocomplete-suggestion-provider';
+import { GEdge } from '../../../model';
+
+@injectable()
+export class RevealEdgeElementSuggestionProvider implements IAutocompleteSuggestionProvider {
+    get id(): string {
+        return 'glsp.reveal-edge-element-suggestion';
+    }
+
+    canHandle(context: string): boolean {
+        return context === AutocompleteSuggestionProviderContext.CANVAS;
+    }
+
+    async getSuggestions(root: Readonly<GModelRoot>, text: string): Promise<AutocompleteSuggestion[]> {
+        const edges = toArray(root.index.all().filter(element => element instanceof GEdge)) as GEdge[];
+        return edges.map(edge => ({
+            element: edge,
+            action: {
+                label: `[${edge.type}]  ${this.getEdgeLabel(root, edge)}`,
+                actions: this.createActions(edge),
+                icon: codiconCSSString('arrow-both')
+            }
+        }));
+    }
+
+    protected createActions(edge: GEdge): Action[] {
+        return [
+            SelectAction.create({ selectedElementsIDs: [edge.id] }),
+            CenterAction.create([edge.sourceId, edge.targetId], { retainZoom: true })
+        ];
+    }
+
+    protected getEdgeLabel(root: Readonly<GModelRoot>, edge: GEdge): string {
+        let sourceName = '';
+        let targetName = '';
+
+        const sourceNode = root.index.getById(edge.sourceId);
+        const targetNode = root.index.getById(edge.targetId);
+
+        if (sourceNode !== undefined) {
+            sourceName = name(sourceNode) ?? sourceNode.type;
+        }
+        if (targetNode !== undefined) {
+            targetName = name(targetNode) ?? targetNode.type;
+        }
+
+        return sourceName + ' -> ' + targetName;
+    }
+}

package/src/features/search-palette/suggestions/named-element-suggestions.ts

@@ -0,0 +1,88 @@
+/********************************************************************************
+ * Copyright (c) 2023-2025 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,
+    CenterAction,
+    codiconCSSString,
+    GModelElement,
+    GModelRoot,
+    GNode,
+    isNameable,
+    name,
+    SelectAction,
+    toArray
+} from '@eclipse-glsp/sprotty';
+import { injectable } from 'inversify';
+import {
+    AutocompleteSuggestionProviderContext,
+    IAutocompleteSuggestionProvider,
+    type AutocompleteSuggestion
+} from '../../../base/auto-complete/autocomplete-suggestion-provider';
+
+@injectable()
+export class RevealNamedElementSuggestionProvider implements IAutocompleteSuggestionProvider {
+    get id(): string {
+        return 'glsp.reveal-named-element-suggestion';
+    }
+
+    canHandle(context: string): boolean {
+        return context === AutocompleteSuggestionProviderContext.CANVAS;
+    }
+
+    async getSuggestions(root: Readonly<GModelRoot>, text: string): Promise<AutocompleteSuggestion[]> {
+        const nameables = toArray(root.index.all().filter(element => isNameable(element)));
+        return nameables.map(nameable => ({
+            element: nameable,
+            action: {
+                label: `[${nameable.type}] ${name(nameable) ?? '<no-name>'}`,
+                actions: this.createActions(nameable),
+                icon: codiconCSSString('eye')
+            }
+        }));
+    }
+
+    protected createActions(nameable: GModelElement): Action[] {
+        return [SelectAction.create({ selectedElementsIDs: [nameable.id] }), CenterAction.create([nameable.id], { retainZoom: true })];
+    }
+}
+
+@injectable()
+export class NodesWithoutNameSuggestionProvider implements IAutocompleteSuggestionProvider {
+    get id(): string {
+        return 'glsp.reveal-nodes-without-name-suggestion';
+    }
+
+    canHandle(searchContext: string): boolean {
+        return searchContext === AutocompleteSuggestionProviderContext.CANVAS;
+    }
+
+    async getSuggestions(root: Readonly<GModelRoot>, text: string): Promise<AutocompleteSuggestion[]> {
+        const nodes = toArray(root.index.all().filter(element => !isNameable(element) && element instanceof GNode));
+        return nodes.map(node => ({
+            element: node,
+            action: {
+                label: `[${node.type}]`,
+                actions: this.createActions(node),
+                icon: codiconCSSString('symbol-namespace')
+            }
+        }));
+    }
+
+    protected createActions(nameable: GModelElement): Action[] {
+        return [SelectAction.create({ selectedElementsIDs: [nameable.id] }), CenterAction.create([nameable.id], { retainZoom: true })];
+    }
+}