Support Kitty graphics protocol

demo/client/client.ts

@@ -29,6 +29,7 @@ import { TestWindow } from './components/window/testWindow';
 import { VtWindow } from './components/window/vtWindow';
 import { ClipboardAddon } from '@xterm/addon-clipboard';
 import { FitAddon } from '@xterm/addon-fit';
+import { KittyGraphicsAddon } from '@xterm/addon-kitty-graphics';
 import { LigaturesAddon } from '@xterm/addon-ligatures';
 import { ProgressAddon } from '@xterm/addon-progress';
 import { SearchAddon, ISearchOptions } from '@xterm/addon-search';
@@ -47,6 +48,7 @@ export interface IWindowWithTerminal extends Window {
   ClipboardAddon?: typeof ClipboardAddon;
   FitAddon?: typeof FitAddon;
   ImageAddon?: typeof ImageAddon;
+  KittyGraphicsAddon?: typeof KittyGraphicsAddon;
   ProgressAddon?: typeof ProgressAddon;
   SearchAddon?: typeof SearchAddon;
   SerializeAddon?: typeof SerializeAddon;
@@ -74,6 +76,7 @@ const addons: AddonCollection = {
   clipboard: { name: 'clipboard', ctor: ClipboardAddon, canChange: true },
   fit: { name: 'fit', ctor: FitAddon, canChange: false },
   image: { name: 'image', ctor: ImageAddon, canChange: true },
+  kittyGraphics: { name: 'kittyGraphics', ctor: KittyGraphicsAddon, canChange: true },
   progress: { name: 'progress', ctor: ProgressAddon, canChange: true },
   search: { name: 'search', ctor: SearchAddon, canChange: true },
   serialize: { name: 'serialize', ctor: SerializeAddon, canChange: true },
@@ -196,6 +199,7 @@ if (document.location.pathname === '/test') {
   window.ClipboardAddon = ClipboardAddon;
   window.FitAddon = FitAddon;
   window.ImageAddon = ImageAddon;
+  window.KittyGraphicsAddon = KittyGraphicsAddon;
   window.ProgressAddon = ProgressAddon;
   window.SearchAddon = SearchAddon;
   window.SerializeAddon = SerializeAddon;
@@ -294,6 +298,7 @@ function createTerminal(): Terminal {
   addons.serialize.instance = new SerializeAddon();
   addons.fit.instance = new FitAddon();
   addons.image.instance = new ImageAddon();
+  addons.kittyGraphics.instance = new KittyGraphicsAddon();
   addons.progress.instance = new ProgressAddon();
   addons.unicodeGraphemes.instance = new UnicodeGraphemesAddon();
   addons.clipboard.instance = new ClipboardAddon();
@@ -306,6 +311,7 @@ function createTerminal(): Terminal {
   addons.webFonts.instance = new WebFontsAddon();
   typedTerm.loadAddon(addons.fit.instance);
   typedTerm.loadAddon(addons.image.instance);
+  typedTerm.loadAddon(addons.kittyGraphics.instance);
   typedTerm.loadAddon(addons.progress.instance);
   typedTerm.loadAddon(addons.search.instance);
   typedTerm.loadAddon(addons.serialize.instance);
@@ -607,7 +613,7 @@ function updateTerminalSize(): void {
   function getBox(width: number, height: number): any {
     return {
       string: '+',
-      style: 'font-size: 1px; padding: ' + Math.floor(height/2) + 'px ' + Math.floor(width/2) + 'px; line-height: ' + height + 'px;'
+      style: 'font-size: 1px; padding: ' + Math.floor(height / 2) + 'px ' + Math.floor(width / 2) + 'px; line-height: ' + height + 'px;'
     };
   }
   if (source instanceof HTMLCanvasElement) {

demo/client/tsconfig.json

@@ -11,6 +11,7 @@
       "@xterm/addon-clipboard": ["../../addons/addon-clipboard"],
       "@xterm/addon-fit": ["../../addons/addon-fit"],
       "@xterm/addon-image": ["../../addons/addon-image"],
+      "@xterm/addon-kitty-graphics": ["../../addons/addon-kitty-graphics"],
       "@xterm/addon-progress": ["../../addons/addon-progress"],
       "@xterm/addon-search": ["../../addons/addon-search"],
       "@xterm/addon-serialize": ["../../addons/addon-serialize"],

demo/client/types.ts

@@ -9,6 +9,7 @@ import type { ImageAddon } from '@xterm/addon-image';
 import type { AttachAddon } from '@xterm/addon-attach';
 import type { ClipboardAddon } from '@xterm/addon-clipboard';
 import type { FitAddon } from '@xterm/addon-fit';
+import type { KittyGraphicsAddon } from '@xterm/addon-kitty-graphics';
 import type { LigaturesAddon } from '@xterm/addon-ligatures';
 import type { ProgressAddon } from '@xterm/addon-progress';
 import type { SearchAddon } from '@xterm/addon-search';
@@ -19,7 +20,7 @@ import type { WebFontsAddon } from '@xterm/addon-web-fonts';
 import type { WebLinksAddon } from '@xterm/addon-web-links';
 import type { WebglAddon } from '@xterm/addon-webgl';
 
-export type AddonType = 'attach' | 'clipboard' | 'fit' | 'image' | 'progress' | 'search' | 'serialize' | 'unicode11' | 'unicodeGraphemes' | 'webFonts' | 'webLinks' | 'webgl' | 'ligatures';
+export type AddonType = 'attach' | 'clipboard' | 'fit' | 'image' | 'kittyGraphics' | 'progress' | 'search' | 'serialize' | 'unicode11' | 'unicodeGraphemes' | 'webFonts' | 'webLinks' | 'webgl' | 'ligatures';
 
 export interface IDemoAddon<T extends AddonType> {
   name: T;
@@ -29,32 +30,34 @@ export interface IDemoAddon<T extends AddonType> {
       T extends 'clipboard' ? typeof ClipboardAddon :
         T extends 'fit' ? typeof FitAddon :
           T extends 'image' ? typeof ImageAddon :
-            T extends 'ligatures' ? typeof LigaturesAddon :
-              T extends 'progress' ? typeof ProgressAddon :
-                T extends 'search' ? typeof SearchAddon :
-                  T extends 'serialize' ? typeof SerializeAddon :
-                    T extends 'webFonts' ? typeof WebFontsAddon :
-                      T extends 'webLinks' ? typeof WebLinksAddon :
-                        T extends 'unicode11' ? typeof Unicode11Addon :
-                          T extends 'unicodeGraphemes' ? typeof UnicodeGraphemesAddon :
-                            T extends 'webgl' ? typeof WebglAddon :
-                              never
+            T extends 'kittyGraphics' ? typeof KittyGraphicsAddon :
+              T extends 'ligatures' ? typeof LigaturesAddon :
+                T extends 'progress' ? typeof ProgressAddon :
+                  T extends 'search' ? typeof SearchAddon :
+                    T extends 'serialize' ? typeof SerializeAddon :
+                      T extends 'webFonts' ? typeof WebFontsAddon :
+                        T extends 'webLinks' ? typeof WebLinksAddon :
+                          T extends 'unicode11' ? typeof Unicode11Addon :
+                            T extends 'unicodeGraphemes' ? typeof UnicodeGraphemesAddon :
+                              T extends 'webgl' ? typeof WebglAddon :
+                                never
   );
   instance?: (
     T extends 'attach' ? AttachAddon :
       T extends 'clipboard' ? ClipboardAddon :
         T extends 'fit' ? FitAddon :
           T extends 'image' ? ImageAddon :
-            T extends 'ligatures' ? LigaturesAddon :
-              T extends 'progress' ? ProgressAddon :
-                T extends 'search' ? SearchAddon :
-                  T extends 'serialize' ? SerializeAddon :
-                    T extends 'webFonts' ? WebFontsAddon :
-                      T extends 'webLinks' ? WebLinksAddon :
-                        T extends 'unicode11' ? Unicode11Addon :
-                          T extends 'unicodeGraphemes' ? UnicodeGraphemesAddon :
-                            T extends 'webgl' ? WebglAddon :
-                              never
+            T extends 'kittyGraphics' ? KittyGraphicsAddon :
+              T extends 'ligatures' ? LigaturesAddon :
+                T extends 'progress' ? ProgressAddon :
+                  T extends 'search' ? SearchAddon :
+                    T extends 'serialize' ? SerializeAddon :
+                      T extends 'webFonts' ? WebFontsAddon :
+                        T extends 'webLinks' ? WebLinksAddon :
+                          T extends 'unicode11' ? Unicode11Addon :
+                            T extends 'unicodeGraphemes' ? UnicodeGraphemesAddon :
+                              T extends 'webgl' ? WebglAddon :
+                                never
   );
 }