Input

This is the <Input /> component

---

Examples

Text Input Label

Assistant Text

<Input value="Main" />

Disabled Input

Assistant Text

<Input value="Is Disabled" disabled />

Error Label

Error instead

<Input value="Has Error" error />

Success Label

Success Text

<Input value="Has Success" success />

<Input placeolder="Test Placeholder" icon={<BurnIcon color="$primary400" />} iconHeight="25px" iconPosition="right" />

---

Basic Usage

import Input from '@candy/kitkat/input'

export const MyComponent = () => {
  return <Input value="value" />
}

---

Props

autoComplete?: string
autoFocus?: boolean
children?: ReactNode
disabled?: boolean
error?: boolean
forceFocusState?: boolean
label?: string
name?: string
onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void
onChange?: (value: string) => void
onChange?: (value: string, e: React.ChangeEvent<HTMLInputElement>) => void
onClick?: (e: React.ChangeEvent<HTMLInputElement>) => void
onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void
placeholder?: string
success?: boolean
value?: string