Volkeno-inputify NPM

volkeno-inputify

Volkeno Inputify is a ReactJS module that harmonizes the management of form components.

Install

npm install --save volkeno-inputify

Usage

import React, { Component } from 'react'

import { Inputify } from 'volkeno-inputify'
import 'volkeno-inputify/dist/index.css'

class Example extends Component {
  render() {
    return  <Inputify
              {...props}
            />
  }
}

Configuration - Props

Property	Type	Default	Description
model	string	null	Input model. Value can be 'input', 'select', 'file', 'textarea', 'toggle_switch'
inputType	string	null	Input type. Value can be 'text', 'checkbox', 'radio', 'file'
inputName	string	null	Input name property (Required)
inputValue	---	null	Input value property
callBack	function	void	This is the method that allows you to retrieve the value of all Inputs except select
selectCallback	function	void	This is the method that allows you to retrieve the value of select
disabled	boolean	false	Input disabled property
readOnly	boolean	false	Input readonly property
placeholder	string	null	Input placeholder property
selectOption	Array	null	Array of select option label and value
selectPlaceholder	string	null	Select placeholder
className	string	null	Input custom className
inputLabel	string	null	Input label
inputLabelClassName	string	null	Input custom label container className
overridedID	string	null	Input custom ID value
inputHasIcon	boolean	false	Flag to add icon on input
iconInInput	string	null	Icon tag for example for Fontawesome ''
inputIconPosition	string	null	Icon position on the Input tag. Value can be 'left' or 'right'
inputCheckboxSize	Array	null	Checkbox tag size. It is an array containing the width and height values of checkbox size
inputRadioSize	Array	null	Radio tag size. It is an array containing the width and height values of radio size
hasMutliple	boolean	false	Define if has multiple files on Input file type
inputFileType	string	default	Define the type of Input file. Value can be 'default' or 'dnd' (for drag and drop)
textareaRows	number	null	Textarea rows size
textareaCols	number	null	Textarea cols size
textareaContentSizeLimit	string	null	Textarea content size limit value
inputSwitchValue	string	null	Input switch value property
switchCheckedStatus	boolean	false	Input switch checked proprety status
inputContainerClassName	string	null	Input switch parent container custom className
inputSwitchHasLabel	boolean	null	Define if Input switch have label
inputSwitchLabelPosition	string	null	Define Input switch label position. Value can be 'left-side-to-side', 'right-side-to-side', 'top-before-input-switch', 'bottom-after-input-switch'
inputBorderRadiusValue	string	null	Define Input border radius value
inputIconContainerBg	string	null	Define Input Icon parent container background value
isRequired	boolean	false	Define if Input value is required
dndInputLabel	string	null	Drag and Drop input file label value
inputStyleDeclination	string	default	Input style declinaison. Value can be 'defaut', 'primary', 'success', 'warning', 'danger', 'volkan'
otherProps	any	null	Can add all others input properties

License

MIT © VolkenoMakers

reactjs form reactjs input form input react custom input reactjs input management react js inputify

react-icons

@everything-registry/sub-chunk-3066

1.0.0

2 years ago