Motion UIComponentsComponent

Terminal session

A CLI session that types commands in and fades output lines up as each step completes.

npx shadcn@latest add @motion/terminal-session

API reference

Components

<TerminalSession />

Height-stable typing terminal body with an sr-only spoken transcript.

lines

TerminalLine[]

The session to play, top to bottom.

typingSpeedMs?

number = 55

Base milliseconds per keystroke for command lines. Defaults to 55.

startDelayMs?

number = 400

Milliseconds before the first line starts typing. Defaults to 400.

outputDelayMs?

number = 520

Milliseconds an output line rests after fading in. Defaults to 520.

label?

string = "Terminal session"

Lead-in for the sr-only spoken transcript. Defaults to "Terminal session".

className?

string

Merged onto the scrolling body wrapper.

Hooks

useTerminalSession

Headless session controller that reveals one line at a time.

useTerminalSession(count: number, options: UseTerminalSessionOptions): TerminalSessionState

Returns

active

number

Index of the line currently being revealed.

advance

() => void

Fire when the active line finishes to schedule the next one.

done

boolean

true once every line has been revealed.