Back to components
Forms component
Advanced Form Elements
Tags input and phone input with formatting, validation, and keyboard support.
Install
$ Run in your project root
pnpm dlx shadcn@latest add https://vibekit.desishub.com/r/advanced-form-elements.jsonWhat it does
- Tags input with badges, Enter to add, Backspace to remove
- Phone input with country picker and live formatting
- Keyboard accessible with proper ARIA roles
- Drop-in replacements inside React Hook Form
When to use
Use it
Forms needing tag selection, phone numbers, or multi-value chip inputs.
Skip it
Simple text fields — use the shadcn Input component instead.
Prerequisites
- shadcn/ui (badge, button, input, label, popover, calendar, command)