Input Fields

A focused collection of input fields optimized for data entry and user information capture with advanced validation.

Installation

$
npx tambo add input-fields

Example Prompt

Try this prompt in the chat interface

Create input fields showcasing all available features:
- Username field (required text, placeholder "Enter username", minLength 3, maxLength 20, pattern for alphanumeric only, description "Must be 3-20 alphanumeric characters", autoComplete "username")
- Email field (required email, placeholder "your.email@example.com", description "We'll use this for account notifications", autoComplete "email")
- Password field (required password, placeholder "Create strong password", minLength 8, maxLength 128, description "Must be at least 8 characters long", autoComplete "new-password")
- Phone field (optional text, placeholder "(555) 123-4567", pattern for phone format, description "Optional: for account recovery", autoComplete "tel")
- Age field (optional number, placeholder "25", minLength 1, maxLength 3, description "Must be between 1-150")
- Disabled field (text, disabled true, placeholder "This field is disabled", description "This demonstrates a disabled state")

Use the solid variant with compact layout. Show validation patterns, length constraints, autocomplete attributes, help descriptions, and both required/optional fields.

Preview

Loading threads...