InputField

Import

import { InputField } from "react-sheikah-ui";

Usage

Input fields allow users to enter text. These components usually used in forms and dialogs.

Full Name

Your name throughout the game

Horse name

This field cannot be empty

import { InputField } from "react-sheikah-ui";

<InputField
  type={'text'}
  label={'Full Name'}
  helperText={'Your name throughout the game'}
  errorText={'There has been an error in this input'}
  isError={false}
  placeholder={'input your name here'}
  onChange={() => { ... }}
/>
<InputField
  type={'text'}
  label={'Horse name'}
  errorText={'This field cannot be empty'}
  isError={true}
  placeholder={'input your horse name here'}
  containerStyle={{ marginTop: '1rem' }}
/>

Available Props

label

The label of the input field

helperText

Optional Helper text below the input field for instruction how or what to fill in the field.

isError

Optional A flag to trigger error state displayed

errorText

Optional The description text below the input field to explain what causes the field to return an error state

containerStyle

Optional Standard style object applied to the whole container of this component. Use style instead if you want to specifically style the input box.

Other default standard input props

Other than the props defined above, this component accepts all standard props for HTML input component.