Textarea Module

The Textarea module provides styled multi-line text inputs with configurable colors, border, background, placeholder styling, focus/disabled/error states, and optional shake animation.

Primary Textarea:

This is a help block

Invalid Textarea:

This is a error block

Disabled Textarea:

Signature:

@mixin use-textarea($colors: ());

Example:

@include termeh.use-textarea(("primary", "error"));

Dependencies

Textarea module uses the following Termeh global var():

Component	Type	Usage	Default
base → separator	Color	Fallback border color	null
radius → normal	Number	Default textarea border radius	null
gap → micro	Number	Default textarea padding	8px
line-height → normal	Number	Textarea line height	1.6em
input → border	Color	Default textarea border color	FALLBACK
input → placeholder	Color	Default textarea placeholder color	FALLBACK
input → background	Color	Default textarea background color	white

---

Textarea module uses the following Termeh color() and variant():

Color / Variant	Usage	Default
error	Accent color for invalid state	error
primary	Default accent color	error
shade → mute	Fallback placeholder color	null

Modifiers

• .is-focused / :focus → applies focus styling
• .is-invalid / :invalid → applies error styling with shake animation
• .is-disabled / :disabled → applies disabled styling
• .is-<color> → applies a registered color as accent color