Input

Input takes short free text such as names, emails, URLs, passwords and search terms, plus native types like file. Wrap it in a Field to wire the label, description and validation message to the control.

Install

bashnpx shadcn@4.18.0 add @siteplane/input

Import it from @/siteplane/components/input. The project needs Siteplane UI's one-time setup first: installation.

When to pick it

• vs Textarea: Pick Textarea when the answer can run past one line.
• vs Number Field: Pick Number Field for numbers that need stepping, bounds or locale formatting.
• vs Input Group: Pick Input Group when the input needs an attached prefix, icon or action button.
• vs Autocomplete: Pick Autocomplete when suggestions should help people type free text.

Rules

• Give it a visible label through Field and FieldLabel. A placeholder does not name the control.
• Set invalid on the surrounding Field and explain the problem with FieldError instead of coloring the input red.
• Use readOnly for values people can see and submit but not change. Use disabled only when the value should not submit.
• Read the text through onValueChange. A form reset leaves a controlled Input untouched, so clear your own state inside onReset.
• Use insetStart/insetEnd for adjoining elements. Put a password reveal in an InputGroup instead of inside the Input.

Reference

• Input docs, with every prop, part and example (Markdown)
• Siteplane UI 1.8.1, Forms & selection. Read the installed source under src/siteplane before relying on an API.