Textarea

Introduction

Textarea renders <textarea class="or-textarea"> with Orbit label chrome. Default rows is 4 when unset. Use it for notes, bios, and JSON blobs that are not rich text. Prefer Rich editor for HTML and Markdown editor for markdown-classed chrome.

Each variation below includes a detailed explanation, the fluent API to paste into your schema, and light/dark screenshots of the rendered control.

Basic textarea

Labeled multiline field with default height. Placeholder and helper text work like TextInput.

Textarea.make('notes')
    .label('Notes')
    .placeholder('Internal notes…')
    .helper_text('Not shown publicly.')

Orbit Basic textarea (light)

Orbit Basic textarea (dark)

Rows and columns

.rows(n) sets the HTML rows attribute. .cols(n) sets cols when you want a character-width hint (often ignored in full-width admin layouts but useful in constrained grids).

Textarea.make('description')
    .label('Description')
    .rows(6)
    .cols(40)

Orbit Rows and columns (light)

Orbit Rows and columns (dark)

Autosize

.autosize() emits data-autosize="true" so client scripts can grow the textarea with content.

Textarea.make('bio')
    .label('Bio')
    .autosize()
    .rows(3)

Orbit Autosize (light)

Orbit Autosize (dark)

Length validation

Combine .required(), .min_length(), and .max_length() for copy limits that Form.validate enforces.

Textarea.make('summary')
    .label('Summary')
    .required()
    .min_length(20)
    .max_length(280)

Orbit Length validation (light)

Orbit Length validation (dark)

Closures work on .label(), .helper_text(), .placeholder(), .visible(), .disabled(), and .required() where applicable — see Form closures.