useTerminal

Creates a read-only xterm terminal instance and attaches it to a container element.

Import

import { useTerminal } from "@fluxlay/react";

Signature

function useTerminal(options?: UseTerminalOptions): UseTerminalReturn;

Parameters

UseTerminalOptions

Property	Type	Default	Description
`fontSize`	`number`	`12`	Font size in pixels.
`fontFamily`	`string`	System monospace	Font family string.
`theme`	`ITheme`	`TerminalThemes.dark.default`	xterm color theme.

Return Value

Property	Type	Description
`terminalRef`	`React.RefObject<HTMLDivElement>`	Ref to attach to the container `<div>`.
`instance`	`TerminalInstance \| null`	Terminal instance, available after mount.

TerminalInstance

Property	Type	Description
`terminal`	`Terminal`	The xterm `Terminal` instance.
`fitAddon`	`FitAddon`	The FitAddon for auto-resizing.

Example

import { useTerminal, useShell, TerminalThemes } from "@fluxlay/react";
 
function Monitor() {
  const { terminalRef, instance } = useTerminal({
    fontSize: 14,
    fontFamily: "'JetBrains Mono', monospace",
    theme: TerminalThemes.catppuccin.mocha
  });
 
  useShell("my-command", { terminal: instance });
 
  return <div ref={terminalRef} style={{ height: "100%", width: "100%" }} />;
}

Behavior

The terminal is read-only — keyboard input is disabled.
The cursor is hidden.
Scrollback is disabled.
The terminal automatically fits its container using the FitAddon.
CSS overrides ensure the terminal fills the container element.