@erpardeepjain/rc-pui NPM

This Package contains below React UI Components available to use

Multi Select Dropdown
Currency Formatter
Search Input
Pagination

Documentation is still incomplete, will try to update asap. PR's for New Components are Welcome

Install

npm install --save @erpardeepjain/rc-pui

Usage

Pagination

Name	Description
pageCount	number
itemCount	number
currentPage	number
onPageChange	function
showLabel	boolean
showStartEndPage	boolean

import { Pagination } from '@erpardeepjain/rc-pui';
...
const {pageCount, itemCount, currentPage, onPageChange, showLabel, showStartEndPage } = paginationConfig;
...
<Pagination paginationConfig={paginationConfig} />

Currency Formatter

props

Name	Description	Default
value	integer	N/A
prefix	string	N/A
zeroAllowed	boolean	true
noSpan	boolean	N/A
onlyComma	boolean	N/A
eleClass	string	N/A

import { CurrencyFormat } from '@erpardeepjain/rc-pui';
...
<CurrencyFormat prefix="$" value="123456789" zeroAllowed />

Search Input

Name	Description	Default
placeholder	string	Search
waitTime	intiger	500
minSearchChar	intiger	2
onChange	function	function

import { SearchInput } from '@erpardeepjain/rc-pui';
...
const onSearchCB = (searchedValue) => {
    console.log(searchedValue);
};
...
<SearchInput onChange={onSearchCB} placeholder="Search Record" waitTime={300} minSearchChar={2} />

Multi Select Dropdown

Name	Description	Default
name	string	N/A
label	string	Select Multiple
options	array	[]
selectAll	boolean	false
onSelect	function	function

import { MultiSelect } from '@erpardeepjain/rc-pui';
...
const handleFilter = (selectedItems) => {
    console.log(selectedItems);
};
...
<MultiSelect 
    title="Status"
    options={['completed', 'failed', 'processing']} 
    name="status"
    selectAll="true"
    onSelect={handleFilter}
/>