use decorations service instead of decorations render layer

src/browser/renderer/DecorationRenderLayer.ts

@@ -1,114 +0,0 @@
-/**
- * Copyright (c) 2022 The xterm.js authors. All rights reserved.
- * @license MIT
- */
-
-import { BaseRenderLayer } from 'browser/renderer/BaseRenderLayer';
-import { IRequestRedrawEvent } from 'browser/renderer/Types';
-import { IColorSet } from 'browser/Types';
-import { EventEmitter, IEventEmitter } from 'common/EventEmitter';
-import { Disposable } from 'common/Lifecycle';
-import { IBufferService, IOptionsService } from 'common/services/Services';
-import { IBufferDecorationOptions, IDecoration, IEvent, IMarker } from 'xterm';
-
-const enum DefaultButton {
-  COLOR = '#5DA5D5'
-}
-export class DecorationRenderLayer extends BaseRenderLayer {
-  private _decorations: IDecoration[] = [];
-  constructor(
-    container: HTMLElement,
-    zIndex: number,
-    colors: IColorSet,
-    rendererId: number,
-    private _onRequestRedraw: IEventEmitter<IRequestRedrawEvent>,
-    @IBufferService bufferService: IBufferService,
-    @IOptionsService optionsService: IOptionsService
-  ) {
-    super(container, 'decoration', zIndex, true, colors, rendererId, bufferService, optionsService);
-    // this.registerDecoration({ startMarker: new Marker(1), shape: 'button' });
-  }
-
-  public onGridChanged(startRow: number, endRow: number): void {
-    for (const decoration of this._decorations) {
-      (decoration as BufferDecoration).render();
-    }
-  }
-
-  public reset(): void {
-
-  }
-
-  public registerDecoration(decorationOptions: IBufferDecorationOptions): IDecoration | undefined {
-    if (decorationOptions.marker.isDisposed) {
-      return undefined;
-    }
-    return new BufferDecoration(decorationOptions, this._ctx.canvas);
-  }
-}
-
-class BufferDecoration extends Disposable implements IDecoration {
-  private static _nextId = 1;
-  private _marker: IMarker;
-  private _element: HTMLElement | undefined;
-  private _id: number = BufferDecoration._nextId++;
-  public isDisposed: boolean = false;
-
-  public get id(): number { return this._id; }
-  public get element(): HTMLElement { return this._element!; }
-  public get marker(): IMarker { return this._marker; }
-
-  private _onDispose = new EventEmitter<void>();
-  public get onDispose(): IEvent<void> { return this._onDispose.event; }
-
-  private _onRender = new EventEmitter<HTMLElement>();
-  public get onRender(): IEvent<HTMLElement> { return this._onRender.event; }
-
-  constructor(
-    decorationOptions: IBufferDecorationOptions,
-    private readonly _container: HTMLElement
-  ) {
-    super();
-    this._marker = decorationOptions.marker;
-    const color = DefaultButton.COLOR;
-    this._element = document.createElement('div');
-    this._element.classList.add('button-buffer-decoration');
-    this._element.id = 'button-buffer-decoration-' + this._id;
-    this._element.style.background = color;
-    this._element.style.width = '32px';
-    this._element.style.height = '32px';
-    this._element.style.borderRadius = '64px';
-    this._element.style.border = `4px solid white`;
-    this._element.style.zIndex = '6';
-    this._element.style.position = 'absolute';
-    if (decorationOptions.anchor === 'right') {
-      this._element.style.right = decorationOptions.x ? `${decorationOptions.x}px` : '5px';
-    } else {
-      this._element.style.right = decorationOptions.x ? `${decorationOptions.x}px` : '5px';
-    }
-    if (this._container.parentElement && this._element) {
-      this._container.parentElement.append(this._element);
-    }
-  }
-
-  public dispose(): void {
-    if (this.isDisposed) {
-      return;
-    }
-    this.isDisposed = true;
-    this._marker.dispose();
-    // Emit before super.dispose such that dispose listeners get a change to react
-    this._onDispose.fire();
-    super.dispose();
-  }
-
-  public render(): void {
-    if (!this._element) {
-      return;
-    }
-    if (this._container.parentElement && !this._container.parentElement.contains(this._element)) {
-      this._container.parentElement.append(this._element);
-    }
-    this._onRender.fire(this._element);
-  }
-}

src/browser/renderer/Renderer.ts

@@ -10,11 +10,10 @@ import { IRenderLayer, IRenderer, IRenderDimensions, IRequestRedrawEvent } from
 import { LinkRenderLayer } from 'browser/renderer/LinkRenderLayer';
 import { Disposable } from 'common/Lifecycle';
 import { IColorSet, ILinkifier, ILinkifier2 } from 'browser/Types';
-import { ICharSizeService, ICoreBrowserService } from 'browser/services/Services';
-import { IBufferService, IOptionsService, ICoreService, IInstantiationService } from 'common/services/Services';
+import { ICharSizeService } from 'browser/services/Services';
+import { IBufferService, IOptionsService, IInstantiationService } from 'common/services/Services';
 import { removeTerminalFromCache } from 'browser/renderer/atlas/CharAtlasCache';
 import { EventEmitter, IEvent } from 'common/EventEmitter';
-import { DecorationRenderLayer } from 'browser/renderer/DecorationRenderLayer';
 import { IBufferDecorationOptions, IDecoration } from 'xterm';
 
 let nextRendererId = 1;
@@ -46,8 +45,7 @@ export class Renderer extends Disposable implements IRenderer {
       instantiationService.createInstance(TextRenderLayer, this._screenElement, 0, this._colors, allowTransparency, this._id),
       instantiationService.createInstance(SelectionRenderLayer, this._screenElement, 1, this._colors, this._id),
       instantiationService.createInstance(LinkRenderLayer, this._screenElement, 2, this._colors, this._id, linkifier, linkifier2),
-      instantiationService.createInstance(CursorRenderLayer, this._screenElement, 3, this._colors, this._id, this._onRequestRedraw),
-      instantiationService.createInstance(DecorationRenderLayer, this._screenElement, 4, this._colors, this._id, this._onRequestRedraw)
+      instantiationService.createInstance(CursorRenderLayer, this._screenElement, 3, this._colors, this._id, this._onRequestRedraw)
     ];
     this.dimensions = {
       scaledCharWidth: 0,
@@ -68,13 +66,6 @@ export class Renderer extends Disposable implements IRenderer {
     this.onOptionsChanged();
   }
 
-  public registerDecoration(decorationOptions: IBufferDecorationOptions): IDecoration | undefined {
-    const decorationLayer = this._renderLayers.find(l => l instanceof DecorationRenderLayer);
-    if (decorationLayer instanceof DecorationRenderLayer) {
-      return decorationLayer.registerDecoration(decorationOptions);
-    }
-  }
-
   public dispose(): void {
     for (const l of this._renderLayers) {
       l.dispose();

src/browser/renderer/Types.d.ts

@@ -54,7 +54,6 @@ export interface IRenderer extends IDisposable {
   clear(): void;
   renderRows(start: number, end: number): void;
   clearTextureAtlas?(): void;
-  registerDecoration(decorationOptions: IBufferDecorationOptions): IDecoration | undefined;
 }
 
 export interface IRenderLayer extends IDisposable {

src/browser/renderer/dom/DomRenderer.ts

@@ -13,7 +13,6 @@ import { IOptionsService, IBufferService, IInstantiationService } from 'common/s
 import { EventEmitter, IEvent } from 'common/EventEmitter';
 import { color } from 'browser/Color';
 import { removeElementFromParent } from 'browser/Dom';
-import { DecorationRenderLayer } from 'browser/renderer/DecorationRenderLayer';
 import { IBufferDecorationOptions, IDecoration } from 'xterm';
 
 const TERMINAL_CLASS_PREFIX = 'xterm-dom-renderer-owner-';