TextArea

final class Phui\Components\TextArea

A multi-line editor with selection, word motions and clipboard support. Text soft-wraps at the measured width, the view is rows lines tall and scrolls vertically, and the cursor is always kept in view. Takes focus.

A multi-line editor holding wrapped text

php

use Phui\Components\TextArea;
use Phui\Events\EmitEvent;

TextArea::mount()
    ->props(value: $this->body, rows: 8, placeholder: 'Describe the change…')
    ->on('change', fn (EmitEvent $e) => $this->body = $e->data);

Props

Prop	Type	Default	Description
`rows`	`int`	`5`	Height of the view in lines.
`maxChars`	`int`	`50000`	Most characters the value may hold.
`invalid`	`bool`	`false`	Forces the invalid colour on.
`placeholder`	`string`	`'Type here...'`	Shown while the value is empty and the field is unfocused.
`marker`	`string`	`'│'`	The rule drawn down the left of every row.

Reaching maxChars shows the invalid colour, the same as setting invalid. Further typing and the overflow of a paste are dropped.

Models

The component holds this and emits on every change. Pass it as a prop to take ownership, and handle its emit — see binding a value both ways.

Model	Type	Default	Emits
`value`	`string`	`''`	`change`

Emits

Event	Payload	Emitted when
`change`	`string`	The value is edited.

Input

Input	Action
Any character	Insert at the cursor, replacing the selection
`Enter`	Insert a newline
`←` `→`	Move by one character
`↑` `↓`	Move by one line, keeping the preferred column
`Alt` + `←` `→`	Move by one word
`Home` `End`	Move to the start or end of the value
`Shift` + any motion	Extend the selection instead of moving
`Backspace`	Delete back, or the selection
`Alt` + `Backspace`	Delete the word before the cursor
`Delete` `Ctrl`+`d`	Delete forward, or the selection
`Ctrl`+`a`	Select all
`Ctrl`+`y`	Copy the selection to the system clipboard
`Ctrl`+`x`	Cut the selection
`Ctrl`+`w`	Delete the word before the cursor, or the selection
`Ctrl`+`k`	Delete to the end of the line
`Ctrl`+`u`	Delete to the start of the line
Paste	Insert the pasted text, replacing the selection
Left click	Move the cursor to the clicked position
Scroll wheel	Scroll the view

Word motions treat spaces and newlines as boundaries.

Colours

Phui\Components\Colours\TextAreaColours

Colour	Palette default	Used for
`marker`	`muted`	The left rule at rest.
`active`	`accent`	The left rule and cursor while focused, and the scrollbar thumb.
`invalid`	`danger`	The left rule and cursor while invalid.
`placeholder`	`muted`	The placeholder text.
`selection`	`surface`	The background behind the selection.
`scrollTrack`	`surface`	The scrollbar track.

The value itself is drawn in the terminal's default foreground; colour it by overriding marker and friends, or wrap the field to style around it.

TextArea ​

Props ​

Models ​

Emits ​

Input ​

Colours ​