The Input field is a flexible, styled input field that supports:

Custom sizing and styling via props

Real-time validation (required, email, number, password)

Error message display with red styling

Two-way binding using v-model

--------------------Features----------------------

Customizable via props (height, width, color, etc.)

Real-time validation with error messages

Red border and message when validation fails

Mobile responsive styles

Supports multiple input types (text, number, email, password)

--------------------Props---------------------

Prop Type Default Description modelValue String "" Value from parent via value placeholder String "" Placeholder text type String "text" Input type (text, email, number, etc.) height String "auto" Custom height width String "100%" Custom width fontSize String "14px" Font size padding String "8px" Padding inside the input margin String "0" Margin around the input color String "#000" Text color backgroundColor String "#fff" Background color border String "1px solid #ccc" Border styling borderRadius String "6px" Rounded corners validation Array [] Validation rules (required, email, etc.) errorMessages Object { required: "..."} Custom error messages

--------------------Validation Rules-----------------------

Supports the following validation types (passed via :validation):

"required" – field cannot be empty

"email" – must be a valid email format

"number" – must be numeric

"password" – must be at least 6 characters

Default error messages are customizable via the errorMessages prop.