build(docs-infra): Update dependency @xterm/xterm to v6

Update dependency @xterm/xterm to v6 and fix style

Author: aparzi

adev/package.json

@@ -48,7 +48,7 @@
     "@typescript/vfs": "1.6.2",
     "@webcontainer/api": "1.6.1",
     "@xterm/addon-fit": "0.11.0",
-    "@xterm/xterm": "5.5.0",
+    "@xterm/xterm": "6.0.0",
     "algoliasearch": "5.46.2",
     "angular-split": "20.0.0",
     "crelt": "1.0.6",

adev/src/app/editor/terminal/interactive-terminal.ts

@@ -7,7 +7,7 @@
  */
 
 import {Subject} from 'rxjs';
-import {Terminal} from '@xterm/xterm';
+import {Terminal, ITerminalOptions, ITerminalInitOnlyOptions} from '@xterm/xterm';
 
 import {CommandValidator} from './command-validator.service';
 
@@ -21,17 +21,28 @@ export const ALLOWED_KEYS: Array<KeyboardEvent['key']> = [
   'ArrowDown',
 ];
 
+/** Set of defaults to use for all terminal instances in adev. */
+export const adevTerminalDefaultOptions: ITerminalOptions = {
+  convertEol: true,
+  theme: {
+    background: '#00000000',
+  },
+  fontFamily: 'courier-new, courier, monospace',
+  fontSize: 15,
+};
+
 export class InteractiveTerminal extends Terminal {
   private readonly breakProcess = new Subject<void>();
 
   // Using this stream, the webcontainer shell can break current process.
   breakProcess$ = this.breakProcess.asObservable();
 
   constructor(
+    options: ITerminalOptions & ITerminalInitOnlyOptions,
     readonly window: Window,
     readonly commandValidator: CommandValidator,
   ) {
-    super({convertEol: true, disableStdin: false});
+    super(options);
 
     // bypass command validation if sudo=true is present in the query string
     if (!this.window.location.search.includes('sudo=true')) {

adev/src/app/editor/terminal/terminal-handler.service.ts

@@ -9,7 +9,7 @@
 import {computed, inject, Injectable, signal, Signal, untracked} from '@angular/core';
 import {Terminal} from '@xterm/xterm';
 import {FitAddon} from '@xterm/addon-fit';
-import {InteractiveTerminal} from './interactive-terminal';
+import {InteractiveTerminal, adevTerminalDefaultOptions} from './interactive-terminal';
 import {WINDOW} from '@angular/docs';
 import {CommandValidator} from './command-validator.service';
 
@@ -28,11 +28,18 @@ export class TerminalHandler {
     // Because colors are parsed
     // See https://github.com/xtermjs/xterm.js/blob/854e2736f66ca3e5d3ab5a7b65bf3fd6fba8b707/src/browser/services/ThemeService.ts#L125
     [TerminalType.READONLY]: signal({
-      instance: new Terminal({convertEol: true, disableStdin: true}),
+      instance: new Terminal({
+        ...adevTerminalDefaultOptions,
+        disableStdin: true,
+      }),
       fitAddon: new FitAddon(),
     }),
     [TerminalType.INTERACTIVE]: signal({
-      instance: new InteractiveTerminal(this.window, this.commandValidator),
+      instance: new InteractiveTerminal(
+        adevTerminalDefaultOptions,
+        this.window,
+        this.commandValidator,
+      ),
       fitAddon: new FitAddon(),
     }),
   };
@@ -59,10 +66,14 @@ export class TerminalHandler {
       instance.dispose();
       fitAddon = new FitAddon();
       if (type === TerminalType.READONLY) {
-        instance = new Terminal({convertEol: true, disableStdin: true});
+        instance = new Terminal({...adevTerminalDefaultOptions, disableStdin: true});
         this.terminals[type].set({instance, fitAddon});
       } else {
-        const newInstance = new InteractiveTerminal(this.window, this.commandValidator);
+        const newInstance = new InteractiveTerminal(
+          adevTerminalDefaultOptions,
+          this.window,
+          this.commandValidator,
+        );
         instance = newInstance;
         this.terminals[type].set({instance: newInstance, fitAddon});
       }