Text Area is a multi-line text input component designed for longer, free-form user input. It is commonly used for comments, descriptions, messages, or notes where single-line inputs are insufficient.

All Form Components should be placed within a Data Zone component set to the Form Data Source.

Settings Panel

All Form Components share the following properties in the Settings Panel:

• ID: Specifies how the data will be named when accessed through its Data Zone. Data for an input will not be accessible until you provide an ID.
• Error: Use this to indicate that a field has an error state. Field errors can be retrieved by referencing the parent Data Zone and inspecting the error property for each field.

Other properties in the Settings Panel include:

• Auto Focus: When enabled, the field will receive focus as soon as it renders on the screen. It is recommended to enable this for the first field of a mandatory form.
• Auto Capitalize: Specifies whether the user's input should be auto-capitalized.
• • Sentences: The first letter of every sentence will be capitalized.
  • Characters: Every character will be capitalized (uppercase).
  • None: No auto-capitalization will be performed (recommended for email and password fields).
  • Words: The first letter of every word will be capitalized.
• Auto Complete: Optionally provides context to the user's browser or operating system about the input type, enabling functionality like address autocomplete. Available options include Off, Email, Postal-code, Cc-number (credit card number), Name, Username, and others.
• Auto Correct : Instructs the user's browser or operating system to autocorrect input. This should be disabled for email and password fields.
• Blur On Submit: When enabled, the field will blur (lose focus) when the form is submitted.
• Caret Hidden: Hides the caret (text insert icon).
• Context Menu Hidden: Disables the default context menu for the input.
• Default Value: The value that is displayed when the input is first rendered. This is distinct from the Placeholder.
• Input Mode: Optional modes that suggest the type of data expected, typically used to determine the keyboard type and may perform data validation. Options include None, Decimal, Email, Numeric, Tel (telephone), and URL.
• Keyboard Type: Instructs the user's operating system to display a certain type of keyboard. Options include Default, Decimal-pad, Email-address, Number-pad, Numeric, Phone-pad, and URL.
• Max Length: Specifies the maximum number of characters that can be typed into the field.
• Multiline: When enabled, the input accepts multiple lines of text, used for open-text fields. This property is enabled by default for Text Area.
• Password Rules: An iOS-only feature to inform the OS of password requirements (refer to Apple's documentation).
• Placeholder: Optional text that is displayed when no value is provided. The color is controlled by Placeholder Text Color in the Appearance Panel.
• Readonly: If enabled, the user cannot edit the input's contents.
• Return Key Type: Changes the label on the user's return key when using an on-screen keyboard. Options include Done, Go, Next, Search, and Send.
• Secure Text Entry: Hides the user's input with circles or other characters, typically enabled for passwords or sensitive data.
• Select Text on Focus: When enabled, the text in the input is automatically selected when the user clicks or tabs into the input field.
• Text Align: Specifies whether text is left-, center-, or right-aligned.
• Text Content Type: An iOS-only property similar to Auto Complete that informs the OS of the specific data type, supporting more types than Auto Complete. If both are specified, Text Content Type takes precedence on iOS. Available options include None, Email Address, Password, Telephone Number, Credit Card Number, Postal Code, and others.

Appearance Properties (Other)

• Placeholder Text Color: Controls the color and opacity of the placeholder text displayed before a user enters text.
• Display: Controls the layout behavior of the component itself. Options include Block (default) and None (hides the component).
• Elevation: A numeric value that controls the shadow depth on Android and provides a similar shadow effect on iOS and Web.

Interaction Panel Supported Events

Text Area is an input component that supports both the Standard Event Set and Input and Focus Events:

• On Blur: Triggers when the field loses focus.
• On Change Text: Triggers when the text content changes.
• On Destroy: Triggers when the component is removed from the layout.
• On Focus: Triggers when the field receives focus.
• On Hover In: Triggers when a cursor hovers over the component.
• On Hover Out: Triggers when a cursor leaves the component.
• On Initialize: Triggers when the component is first rendered.
• On Inputs Change: Triggers when any input data changes in the component's context.
• On Long Press: Triggers when the user presses and holds the component.
• On Press: Triggers when the user taps or clicks the component.
• On Press In: Triggers when the user begins pressing the component.
• On Press Out: Triggers when the user releases the press.
• On Submit: Triggers when the form is submitted.