Input

To import and render the Input component, use the following demo code.

Usage

Normal

import { Input } from 'elementique';
 
function App() {
    return (
    <>
        <Input 
            variant='primary' 
            type='text' 
            placeholder='Enter text'
        />
    </>
    )
}
 
export default App;

Float

import { Input } from 'elementique';
 
function App() {
    return (
    <>
        <Input 
            variant='float' 
            type='text' 
            placeholder='Enter text'
        />
    </>
    )
}
 
export default App;

Props

variant - primary or float
name - This value will be passed to the id and name tags of input
type - This prop accepts the type of input ex: text, email
width - Custom width of the input
maxWidth - Maximum width of the input
p - Custom padding for the input as number
placeholder - This props accepts the prop to be displayed as the placeholder for the input
setValue - This prop is for the React useState setValue function to change the value
value - The value entered inside the input can be accessed using this prop
border - Custom border for the input box
fontsProperty - Custom fontsProperty is to be entered here in the form of an object: { size: string, weight: number, family: string }