Input

Provides a simple, standardized input component which enforces the Feelix styling. The input will allow the ability to show a tooltip next to the label and more importantly display any validation errors with the Feelix styling.

Example

Variations

Example

API

Name Type Default Description
name string Sets the name of Input. This is required.
id string (generated) Sets the id of Input. If no id is specified, a generated one is used.
label string Sets the label for the Input. This is required.
hideLabel boolean false Determines whether to show or hide the label for the Input.
tooltip Tooltip If this is not null, it shows the specified Tooltip component.
type string text One of: “text”, “email”, “number”, “password”, “tel”, “url”
value string Specifies the value for the control.
defaultValue string Specifies the intial value for the control.
placeholder string Specifies a short hint that describes the expected value.
disabled boolean Disables the input control. It won’t accept changes from the user. It also cannot receive focus and will be skipped when tabbing.
autoFocus boolean Specifies that this element should automatically get focus when the page loads
maxLength number Sets the maximum number of characters allowed.
onChange function Sets the input’s onChange handler.
onBlur function Sets the input’s onBlur handler.
onFocus function Sets the input’s onFocus handler.
errorMessage string If this is not null or empty, it displays the string as an error message in the style dictated by Feelix.

Used by

Team
Pathfinder