Skip to main content
Version: Next

Textarea

A multi-line text field, for comments, notes and free-text reasons.

The Textarea component as it renders with its default settings.The Textarea component as it renders with its default settings.

Reach for it when you need:

  • A downtime-reason comment
  • Operator notes attached to a batch record

Component name: Textarea · Category: Input

In the palette: Multi-line text input

Properties

Any property can be bound to a tag, another component's property, or a query.

PropertyTypeDefaultDescription
valuestring""
placeholderstringType here...
titlestringTextarea
showTitlebooleantrue
titleSizenumber13
shadowbooleantrueShow a subtle drop-shadow on the box. Turn off for a flat look.
clearablebooleanfalseShow an × button to clear the value while there is one.
maxLengthnumber0Maximum number of characters (0 = no limit). Caps typing and paste.
showCountbooleanfalseShow a live character counter ("N", or "N/max" when maxLength is set) below the box.
disabledbooleanfalse
stylestyle{}Custom CSS properties

Events

Attach event actions to these in the Event Manager.

EventLabelGroupPayload
clickClickMouseThe DOM event.
dblclickDouble clickMouseThe DOM event.
contextmenuRight clickMouseThe DOM event.
mouseenterMouse enterMouseThe DOM event.
mouseleaveMouse leaveMouseThe DOM event.
changeChangeInputThe DOM event.
submitSubmitInputThe DOM event.
focusFocusInputThe DOM event.
blurBlurInputThe DOM event.
Right-click behaves differently in the Designer

contextmenu fires your configured actions at runtime only — in LiveView and in preview. On the Designer canvas the right-click is captured to open the Event Manager, so testing it there will not run your actions. Test right-click in preview.