TextInput

The TextInput component is used to handle user input, providing options for styling via themes and sizes. Also offers options for adding icons, captions, custom content, and error text for the field.

Usage

import { TextInput } from '@harnessio/ui/components'

//...

return (
    <TextInput
    label="Success Input"
    id="someinput"
    value="input with value"
    placeholder="Enter the value"
    theme="success"
  />
)

API Reference

Prop	Required	Default	Type
type	false	text	string
wrapperClassName	false		string
label	false		string
caption	false		string
error	false		string
warning	false		string
optional	false	false	boolean
id	false		string
disabled	false	false	boolean
className	false		string
inputContainerClassName	false		string
theme	false	'default'	'default' | 'success' | 'danger' | 'warning'
size	false	'default'	'default' | 'sm'
prefix	false		ReactNode
suffix	false		ReactNode
value	false		string
defaultValue	false		string
onChange	false		React.ChangeEventHandler<HTMLInputElement>
placeholder	false		string
readOnly	false	false	boolean