@heyhuynhgiabuu/pi-pretty 0.1.5 → 0.1.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@heyhuynhgiabuu/pi-pretty",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "Pretty terminal output for pi — syntax-highlighted file reads, colored bash output, tree-view directory listings, and more.",
   "author": "huynhgiabuu",
   "license": "MIT",

package/src/index.ts

@@ -156,39 +156,107 @@ function lang(fp: string): BundledLanguage | undefined {
 }
 
 // ---------------------------------------------------------------------------
-// Terminal image rendering (iTerm2 / Kitty / WezTerm inline image protocol)
+// Terminal image rendering (iTerm2 / Kitty / Ghostty inline image protocols)
+// Handles tmux passthrough for image protocols.
 // ---------------------------------------------------------------------------
 
-function supportsInlineImages(): boolean {
+type ImageProtocol = "iterm2" | "kitty" | "none";
+
+const IS_TMUX = !!process.env.TMUX;
+
+/**
+ * Detect the outer terminal when running inside tmux.
+ * tmux sets TERM_PROGRAM=tmux, but the real terminal is often in
+ * the environment of the tmux server or can be inferred.
+ */
+function getOuterTerminal(): string {
+	// Direct terminal (not in tmux)
 	const term = process.env.TERM_PROGRAM ?? "";
+	if (term !== "tmux" && term !== "screen") return term;
+
+	// Inside tmux: check common env vars that leak through
+	// Ghostty sets this; iTerm2 sets LC_TERMINAL
+	if (process.env.LC_TERMINAL === "iTerm2") return "iTerm.app";
+
+	// TERM_PROGRAM_VERSION sometimes survives into tmux
+	// Try to detect via COLORTERM or other hints
+	if (process.env.GHOSTTY_RESOURCES_DIR) return "ghostty";
+
+	// Default: assume modern terminal if truecolor is supported
+	if (process.env.COLORTERM === "truecolor" || process.env.COLORTERM === "24bit") {
+		// Can't determine exact terminal, but likely modern
+		return "unknown-modern";
+	}
+	return term;
+}
+
+function detectImageProtocol(): ImageProtocol {
+	const term = getOuterTerminal();
+	// Ghostty and Kitty use the Kitty graphics protocol
+	if (term === "ghostty" || term === "kitty") return "kitty";
 	// iTerm2, WezTerm, Mintty support the iTerm2 protocol
-	if (["iTerm.app", "WezTerm", "mintty"].includes(term)) return true;
-	// Kitty has its own protocol but also supports iTerm2 compat in newer versions
-	if (term === "kitty") return true;
-	// TERM_PROGRAM_VERSION for iTerm2 check
-	if (process.env.LC_TERMINAL === "iTerm2") return true;
-	return false;
+	if (["iTerm.app", "WezTerm", "mintty"].includes(term)) return "iterm2";
+	if (process.env.LC_TERMINAL === "iTerm2") return "iterm2";
+	return "none";
+}
+
+/**
+ * Wrap escape sequence for tmux passthrough.
+ * tmux requires: ESC Ptmux; <escaped-sequence> ESC \
+ * Inner ESC chars must be doubled.
+ */
+function tmuxWrap(seq: string): string {
+	if (!IS_TMUX) return seq;
+	// Double all ESC chars inside the sequence
+	const escaped = seq.replace(/\x1b/g, "\x1b\x1b");
+	return `\x1bPtmux;${escaped}\x1b\\`;
 }
 
 /**
  * Render base64 image inline using iTerm2 inline image protocol.
  * Protocol: ESC ] 1337 ; File=[args] : base64data BEL
- * Supported by: iTerm2, WezTerm, Mintty, Kitty (compat mode)
  */
-function renderInlineImage(
+function renderIterm2Image(
 	base64Data: string,
-	opts: { width?: string; height?: string; preserveAspect?: boolean; name?: string } = {},
+	opts: { width?: string; name?: string } = {},
 ): string {
-	const args: string[] = ["inline=1"];
+	const args: string[] = ["inline=1", "preserveAspectRatio=1"];
 	if (opts.width) args.push(`width=${opts.width}`);
-	if (opts.height) args.push(`height=${opts.height}`);
-	if (opts.preserveAspect !== false) args.push("preserveAspectRatio=1");
 	if (opts.name) args.push(`name=${Buffer.from(opts.name).toString("base64")}`);
-	// Calculate size for the size= param
 	const byteSize = Math.ceil(base64Data.length * 3 / 4);
 	args.push(`size=${byteSize}`);
+	const seq = `\x1b]1337;File=${args.join(";")}:${base64Data}\x07`;
+	return tmuxWrap(seq);
+}
+
+/**
+ * Render base64 image inline using Kitty graphics protocol.
+ * Protocol: ESC _G <key>=<value>,...; <base64data> ESC \
+ * Chunked in 4096-byte pieces as required by protocol.
+ * Supported by: Kitty, Ghostty
+ */
+function renderKittyImage(
+	base64Data: string,
+	opts: { cols?: number } = {},
+): string {
+	const chunks: string[] = [];
+	const CHUNK_SIZE = 4096;
+
+	for (let i = 0; i < base64Data.length; i += CHUNK_SIZE) {
+		const chunk = base64Data.slice(i, i + CHUNK_SIZE);
+		const isFirst = i === 0;
+		const isLast = i + CHUNK_SIZE >= base64Data.length;
+		const more = isLast ? 0 : 1;
+
+		if (isFirst) {
+			const colPart = opts.cols ? `,c=${opts.cols}` : "";
+			chunks.push(tmuxWrap(`\x1b_Ga=T,f=100,t=d,m=${more}${colPart};${chunk}\x1b\\`));
+		} else {
+			chunks.push(tmuxWrap(`\x1b_Gm=${more};${chunk}\x1b\\`));
+		}
+	}
 
-	return `\x1b]1337;File=${args.join(";")}:${base64Data}\x07`;
+	return chunks.join("");
 }
 
 /**
@@ -690,16 +758,18 @@ export default function piPrettyExtension(pi: any): void {
 				out.push(`  ${fileIcon(d.filePath)}${FG_DIM}${mimeStr} · ${sizeStr}${RST}`);
 				out.push(rule(tw));
 
-				if (supportsInlineImages()) {
-					// Max width: use ~80 columns or terminal width, capped for readability
+				const protocol = detectImageProtocol();
+				if (protocol === "kitty") {
+					const imgCols = Math.min(tw - 4, 80);
+					out.push(renderKittyImage(d.data, { cols: imgCols }));
+				} else if (protocol === "iterm2") {
 					const imgWidth = Math.min(tw - 4, 80);
-					out.push(renderInlineImage(d.data, {
+					out.push(renderIterm2Image(d.data, {
 						width: `${imgWidth}`,
 						name: fname,
 					}));
 				} else {
-					// Fallback: show metadata only
-					out.push(`  ${FG_DIM}(Inline image preview requires iTerm2, WezTerm, or Kitty)${RST}`);
+					out.push(`  ${FG_DIM}(Inline image preview requires Ghostty, iTerm2, WezTerm, or Kitty)${RST}`);
 				}
 
 				out.push(rule(tw));