@myntra/uikit-component-input-text v1.13.96

import InputText from './src/input-text'

InputText

export const _styles = (function () { // Add some styles for showing grid column examples. const style = document.createElement('style') style.id = 'input-example-override' style.textContent = .u-input-text-container .adornment { background-color: transparent; border-color: transparent; bottom: 5px; position: relative; } document.head.appendChild(style) })();

const [value, setValue] = useState();

<InputText value={value} onChange={setValue} />

Examples

Disabled

const [value, setValue] = useState();

<InputText value="Disabled" disabled placeholder="Your name" />

With placeholder text

const [value, setValue] = useState();

<InputText value={value} onChange={setValue} placeholder="Your name" />

With label text

const [value, setValue] = useState();

<Field title="Name" description="Your name">
  <InputText value={value} onChange={setValue} />
</Field>

With icon

const [value, setValue] = useState();

<InputText value={value} onChange={setValue} placeholder="Your name" icon={UserSolid}/>

With prefix/suffix text or element

const [value, setValue] = useState();

<InputText value={value} onChange={setValue} adornment="/Kg"/>

const [value, setValue] = useState();
const onClick = useCallback(() => console.log("clicked icon"))

<InputText value={value} onChange={setValue} adornment={<Button className="adornment" onClick={onClick} icon={UserSolid} />}/>