This Package contains below React UI Components available to use

• Multi Select Dropdown
• Currency Formatter
• Search Input
• Pagination

💥 Working Demo - Stackblitz

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

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

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

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

Search Input

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

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

Multi Select Dropdown

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

1import { MultiSelect } from '@erpardeepjain/rc-pui';
2...
3const handleFilter = (selectedItems) => {
4    console.log(selectedItems);
5};
6...
7<MultiSelect 
8    title="Status"
9    options={['completed', 'failed', 'processing']} 
10    name="status"
11    selectAll="true"
12    onSelect={handleFilter}
13/>
14