Text Input

PacemInputTextElement is the suggested webcomponent for plain text editing.

Autogenerated

PacemInputTextElement can be injected into a form via metadata, the following way.

[ {"prop": "name", "type": "string", "display": { "name": "Name", "watermark": "Your name here...", "description": "Write down your full name" }, "extra": { "tooltip": true }, "validators": [{ "type": "required", "errorMessage": "Name is a required field." }] } ]

Styling and Behaviors

PacemInputTextElement (alongisde with all the other similar input components) can exploit some cozy functionalities.
Here are some behavioral attributes:

• autofocus: defines whether to auto focus the input element as the page loads.
• autoselect: whether to auto select the whole input text content on focus.

Keyboard interaction:

• by clicking the Escape button while typing, the value of the input field gets reset to the one set before the last focus, then the focus gets lost.

A handy style applicable to the input-text is the input-toggle css class, which removes the input hints until the field gets the focus.