Input

Single-line text field with some goodies built in.

<Input placeholder="Type something..." />

---

Props

• formSize
• iconLeft
• iconRight
• onChange
• value

formSize

The size of the input. Defaults to md.

<Input formSize="small" />
<Input formSize="medium" />
<Input formSize="large" />

iconLeft

An icon to display on the left side of the input. Padding is automatically added.

<Input iconLeft="magnifying-glass" />

iconRight

An icon to display on the right side of the input. Padding is automatically added.

<Input iconRight="percent" />

onChange

The change handler for the input.

import { useState } from "react";

function MyComponent() {
  const [val, setVal] = useState("");
  return <Input value={val} onChange={setVal} />;
}

value

The value of the input.

<Input value="Hello, World!" />