Ivy.Widgets.Xterm 1.3.8

Ivy.Widgets.Xterm

A terminal emulator widget for Ivy Framework powered by xterm.js.

Installation

dotnet add package Ivy.Widgets.Xterm

Widgets

Terminal

A fully-featured terminal emulator component.

External React Libraries Used:

• @xterm/xterm - Terminal emulator
• @xterm/addon-fit - Auto-fit terminal to container
• @xterm/addon-web-links - Clickable URLs

Basic Usage

using Ivy.Widgets.Xterm;

// Simple terminal with default settings
new Terminal()

// Terminal with dark theme and custom font
new Terminal()
    .DarkTheme()
    .FontSize(16)
    .CursorBlink(true)

// Terminal with initial content
new Terminal()
    .InitialContent("Welcome!\r\n$ ")

// Terminal with a loading overlay shown until the attached
// process writes its first output to the stream
new Terminal()
    .Stream(pty.Stream)
    .Loading("Starting Claude Code...")

// Terminal with event handlers
new Terminal()
    .HandleData(data => Console.WriteLine($"User typed: {data}"))
    .HandleResize((cols, rows) => Console.WriteLine($"Resized: {cols}x{rows}"))

Props

Events

Themes

Built-in themes are available:

// Dark theme (VS Code-like)
new Terminal().DarkTheme()

// Light theme
new Terminal().LightTheme()

// Custom theme
new Terminal().Theme(new TerminalTheme
{
    Background = "#000000",
    Foreground = "#00ff00",
    Cursor = "#00ff00",
    // ... other colors
})

TerminalTheme Properties

All color properties accept CSS color strings (hex, rgb, rgba):

• Background, Foreground, Cursor, CursorAccent, Selection
• Black, Red, Green, Yellow, Blue, Magenta, Cyan, White
• BrightBlack, BrightRed, BrightGreen, BrightYellow, BrightBlue, BrightMagenta, BrightCyan, BrightWhite

Development

Building

1. Install frontend dependencies:

   cd frontend
   npm install
   

2. Build the frontend:

   npm run build
   

3. Build the project from the root folder:

   dotnet build
   

Running Samples

cd .samples
dotnet run

The sample server uses an app shell with multiple demo apps (in .samples/Apps/):

• Shell — an interactive system shell (cmd on Windows, bash otherwise)
• Hello Console — runs the Spectre.Console demo app from .console/HelloApp
• Claude Code — runs the claude CLI in the terminal (requires Claude Code to be installed and on PATH)

Creating New Widgets

See CLAUDE.md for detailed instructions on creating new external widgets.