<tyro-ui-text-field>

Text Field

Input field with 3 variants: outlined, filled, standard. Floating label, error state, 6 types including auto eye toggle for password.

Full border, floating label

First name

Filled background, bottom border only

Phone

No background, bottom line only

Username

Amount

Date

Auto eye toggle - all variants

Password

[error] + [errorMessage] - all variants

Invalid email address

Disabled - all variants

Name

Inputs

Property	Type	Default	Description
`[variant]`	`'outlined' \| 'filled' \| 'standard'`	`'outlined'`	Visual style of the field
`[type]`	`'text' \| 'password' \| 'number' \| 'date' \| 'email' \| 'tel'`	`'text'`	HTML input type - password automatically adds an eye toggle
`[(value)]`	`string`	`''`	Field value - two-way binding available
`[label]`	`string`	`-`	Floating label - moves above the field on focus or when a value is entered
`[placeholder]`	`string`	`-`	Hint text in the field (visible once the label has floated)
`[icon]`	`string`	`-`	Remix Icon class displayed on the left
`[disabled]`	`boolean`	`false`	Disables the field
`[error]`	`boolean`	`false`	Sets the field to error state (red border)
`[errorMessage]`	`string`	`-`	Error message shown below the field when error is true

Outputs

Event	Payload	Description
`(valueChange)`	`string`	Emitted on every user keystroke