WeDanceDesign System

Input

Input components are used to collect user data through various types of form fields.

Usage

Import and use the Input component:

<Input
  v-model="value"
  placeholder="Enter text"
  :error="error"
/>

Variants

default

Default input style

error

Input with error state

This field is required

Types

text

Text input

email

Email input

password

Password input

number

Number input

search

Search input

Props

Name
Type
Default
Description
modelValue
string
''
v-model binding value
type
string
'text'
Type of input field
placeholder
string
''
Placeholder text
error
string
''
Error message

Examples

With Label

With Icon

With Description

This will be your public display name.