Form

Input

Text input with label, error state, and helper text.

Available inreactangular

Preview

Live previewreal component

Install

TerminalBash

$ npx @mcp-elements/cli add input

Usage

input-example.tsxTSX

import { Input } from '@mcp-elements/react'

export function Example() {
  return (
    <Input
      label="Email address"
      placeholder="you@example.com"
      helperText="We'll never share your email."
    />
  )
}

Props

Prop	Type	Default	Description
`label`	`string`	—	Label text above the input
`placeholder`	`string`	—	Placeholder text
`error`	`string`	—	Error message shown below the input
`helperText`	`string`	—	Helper text shown below the input
`disabled`	`boolean`	`false`	Whether the input is disabled