Support setting the layer of a decoration

Fixes #3778

src/browser/renderer/BaseRenderLayer.ts

@@ -443,13 +443,18 @@ export abstract class BaseRenderLayer implements IRenderLayer {
     // exist but applied after inverse
     let bgOverride: number | undefined;
     let fgOverride: number | undefined;
+    let isTop = false;
     for (const d of this._decorationService.getDecorationsAtCell(x, y)) {
+      if (d.options.layer !== 'top' && isTop) {
+        continue;
+      }
       if (d.backgroundColorRGB) {
         bgOverride = d.backgroundColorRGB.rgba;
       }
       if (d.foregroundColorRGB) {
         fgOverride = d.foregroundColorRGB.rgba;
       }
+      isTop = d.options.layer === 'top';
     }
 
     if (!bgOverride && !fgOverride && (this._optionsService.rawOptions.minimumContrastRatio === 1 || isPowerlineGlyph(cell.getCode()))) {

src/browser/renderer/TextRenderLayer.ts

@@ -179,10 +179,15 @@ export class TextRenderLayer extends BaseRenderLayer {
 
       // Get any decoration foreground/background overrides, this must be fetched before the early
       // exist but applied after inverse
+      let isTop = false;
       for (const d of this._decorationService.getDecorationsAtCell(x, this._bufferService.buffer.ydisp + y)) {
+        if (d.options.layer !== 'top' && isTop) {
+          continue;
+        }
         if (d.backgroundColorRGB) {
           nextFillStyle = d.backgroundColorRGB.css;
         }
+        isTop = d.options.layer === 'top';
       }
 
       if (prevFillStyle === null) {

src/browser/renderer/dom/DomRendererRowFactory.ts

@@ -177,7 +177,11 @@ export class DomRendererRowFactory {
       // been applied
       let bgOverride: IColor | undefined;
       let fgOverride: IColor | undefined;
+      let isTop = false;
       for (const d of this._decorationService.getDecorationsAtCell(x, row)) {
+        if (d.options.layer !== 'top' && isTop) {
+          continue;
+        }
         if (d.backgroundColorRGB) {
           bgColorMode = Attributes.CM_RGB;
           bg = d.backgroundColorRGB.rgba >> 8 & 0xFFFFFF;
@@ -188,6 +192,7 @@ export class DomRendererRowFactory {
           fg = d.foregroundColorRGB.rgba >> 8 & 0xFFFFFF;
           fgOverride = d.foregroundColorRGB;
         }
+        isTop = d.options.layer === 'top';
       }
 
       // Foreground

src/common/services/DecorationService.ts

@@ -64,13 +64,13 @@ export class DecorationService extends Disposable implements IDecorationService
     return this._decorations.getKeyIterator(line);
   }
 
-  public *getDecorationsAtCell(x: number, line: number): IterableIterator<IInternalDecoration> {
+  public *getDecorationsAtCell(x: number, line: number, layer?: 'bottom' | 'top'): IterableIterator<IInternalDecoration> {
     let xmin = 0;
     let xmax = 0;
     for (const d of this._decorations.getKeyIterator(line)) {
       xmin = d.options.x ?? 0;
       xmax = xmin + (d.options.width ?? 1);
-      if (x >= xmin && x < xmax) {
+      if (x >= xmin && x < xmax && (!layer || (d.options.layer ?? 'bottom') === layer)) {
         yield d;
       }
     }

src/common/services/Services.ts

@@ -312,7 +312,7 @@ export interface IDecorationService extends IDisposable {
   /** Iterates over the decorations at a line (in no particular order). */
   getDecorationsAtLine(line: number): IterableIterator<IInternalDecoration>;
   /** Iterates over the decorations at a cell (in no particular order). */
-  getDecorationsAtCell(x: number, line: number): IterableIterator<IInternalDecoration>;
+  getDecorationsAtCell(x: number, line: number, layer?: 'bottom' | 'top'): IterableIterator<IInternalDecoration>;
 }
 export interface IInternalDecoration extends IDecoration {
   readonly options: IDecorationOptions;