Skip to main content

​
Examples

  • Basic Usage
  • Keyboard Shortcuts
  • States
Basic text area example

Basic text area with different configurations and features.

NeoTextArea(
  controller: controller, // Using e.g. useTextEditingController() hook
  label: "Comments",
  description: "Share your thoughts and feedback",
  onChanged: (value) {
    // Handle input
  },
),

​
Properties

​
Required

​
controller
TextEditingController
required
The controller for managing the text content of the text area.

​
Content

​
label
String?
Optional label text displayed above the text area.
​
placeholder
String?
default:"Type here..."
Hint text displayed when the text area is empty.
​
description
String?
Optional helper text displayed below the text area. Hidden when errorText is present.
​
errorText
String?
Error message displayed below the text area. Takes priority over description.
​
inputFormatters
List<TextInputFormatter>?
List of input formatters to control text input behavior (e.g., length limits, character restrictions).
​
autofillHints
List<String>?
Hints for autofill services.

​
Layout

​
minLines
int
default:"3"
Minimum number of lines to display.
​
maxLines
int
default:"5"
Maximum number of lines for auto-sizing.
​
maxResizeLines
int?
default:"20"
Maximum number of lines when manually resized. Set to null for unlimited resizing.
​
showResizeHandle
bool
default:"true"
Whether to show the resize handle for manual height adjustment.
Double-tap the resize handle to reset to auto-sizing mode.

​
Behavior

​
onChanged
ValueChanged<String>?
Callback triggered when the text content changes.
​
onSubmitted
ValueChanged<String>?
Callback triggered when text is submitted via keyboard shortcuts.
​
submitOnEnter
bool
default:"false"
Controls keyboard submission behavior:
  • true: Enter submits, Shift+Enter adds new line (chat-style)
  • false: Cmd/Ctrl+Enter submits, Enter adds new line (editor-style)
​
maintainFocusOnSubmit
bool
default:"false"
Whether to keep focus on the text area after submission.

​
State

​
isEnabled
bool
default:"true"
Controls whether the text area is interactive. When disabled, the field appears dimmed and prevents all interaction.
​
focusNode
FocusNode?
Optional focus node for advanced focus management. If not provided, an internal focus node is created.

​
Best Practices

  • Use appropriate line limits: Set minLines and maxLines based on expected content length
  • Use chat-style submission for messaging: Set submitOnEnter: true with maintainFocusOnSubmit: true for chat interfaces. You would also probably want to set minLines to 1.
⌘I