Skip to main content

Input

This element allows users to enter or provide data or information within a web form or interface. It is one of the fundamental building blocks for user input and interaction on websites and web applications.

Properties

NameTypeDescription
typeThis corresponds to all the types of native input elementType of the input element. Corresponds to the type attribute of the native input element.
valuestringInitial value of the input element
checkedbooleanWhen set to true, checks the input element
placeholderTextstringText that appears in the input element when it has no value set
hiddenbooleanWhen set to true, the input element is not displayed
multiplebooleanWhen set to true, allows multiple values for file and email input type.
acceptstringValid for the file

input type only, the accept

attribute defines which file types are selectable in a file

upload control.
inputStyleInputStyleStyling properties and values of the element

InputStyle

NameDescription
widthSets the width of the element
heightSets the height of the element
borderSets the border of the element
borderRadiusSets the border radius of the element
backgroundSets all background style properties at once, such as color, image, origin and size, or repeat method. Reference link
boxShadowSets shadow effects around the element
textFontSets all the different properties of font for the input text. Reference link
textColorSets the foreground color of the input text.
placeholderTextFontSets all the different properties of font for the hint text. Reference link
placeholderTextColorSets the foreground color of the hint text.

Usage

import '@cometchat/uikit-elements';//import the web component package.


<cometchat-input :type="email" :placeholderText="Please enter your email id" />