Merge pull request #3802 from Tyriar/3801

Allow styling active result decoration via .xterm-find-active-result-decoration
xtermjs · May 13, 2022 · 995080c · 995080c
2 parents 5ad12df + 77d5d52
commit 995080c
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/addons/xterm-addon-search/src/SearchAddon.ts b/addons/xterm-addon-search/src/SearchAddon.ts
@@ -679,7 +679,7 @@ export class SearchAddon implements ITerminalAddon {
             color: options.activeMatchColorOverviewRuler
           }
         });
-        this._selectedDecoration?.onRender((e) => this._applyStyles(e, options.activeMatchBorder));
+        this._selectedDecoration?.onRender((e) => this._applyStyles(e, options.activeMatchBorder, true));
         this._selectedDecoration?.onDispose(() => marker.dispose());
       }
     }
@@ -702,7 +702,7 @@ export class SearchAddon implements ITerminalAddon {
    * @param borderColor the border color to apply
    * @returns
    */
-  private _applyStyles(element: HTMLElement, borderColor: string | undefined): void {
+  private _applyStyles(element: HTMLElement, borderColor: string | undefined, isActiveResult: boolean): void {
     if (element.clientWidth <= 0) {
       return;
     }
@@ -712,6 +712,9 @@ export class SearchAddon implements ITerminalAddon {
         element.style.outline = `1px solid ${borderColor}`;
       }
     }
+    if (isActiveResult) {
+      element.classList.add('xterm-find-active-result-decoration');
+    }
   }
 
   /**
@@ -736,7 +739,7 @@ export class SearchAddon implements ITerminalAddon {
         position: 'center'
       }
     });
-    findResultDecoration?.onRender((e) => this._applyStyles(e, options.matchBorder));
+    findResultDecoration?.onRender((e) => this._applyStyles(e, options.matchBorder, false));
     findResultDecoration?.onDispose(() => marker.dispose());
     return findResultDecoration;
   }