0.0.25 • Published 6 years ago
pkui-designs v0.0.25
pkui-designs
Data grid with virtualization and lazy loading Autocomplete/typeahead Input Fields Checkboxes RadioButton Switches
Install
npm install --save pkui-designs
yarn add pkui-designs
Usage
import React, { Component } from 'react'
import { Grid, AutoComplete, Select, Input, CheckBox, RadioButton, Switch } from 'pkui-designs'
class App extends Component {
render () {
return (
<Grid
data={[]} // actual row data
headers={[]} // columns
id={'pkgrid'} // unique identifier
height={540} // height of the container
hasMore={hasMore} // if grid has more data to load -- boolean
loadMore={() => {}} // lazy loading function
showLazyLoader={showLazyLoader} // show rows loader -- boolean
loading={loading} // show grid loader -- boolean
serverSorting={true} // enable api call
serverFiltering={true} // enable api call
onFilter={filters => {}} // filter function
onSort={sort => {}} // sort function
onRowClick={row => {}} // on row click function
rowHeight={34} // default 34
autoFitColumn={true} // if columns to be fit into the provided width
/>
<AutoComplete
dataSource={[]}
multiple={false}
id={'single'}
onRemove={() => {}}
onChange={selected => {}}
onSelect={(value, selected) => {}}
onInputChange={(e, value) => {}}
placeholder={'Select country...'}
defaultFirstOptionSelected={true}
openDropDownOnFocus={false}
isAsync={true}
loading={false}
value={''}
open={true}
selectOnBlur={false}
animate={true||false}
/>
<Select
dataSource={[]}
placeHolder={''}
selected={anyof('', {})}
onSelect={selected => {}}
id={'id'}
animate={true||false}
/>
<Input
placeholder='Enter user name'
label='Enter user name'
showClear={true}
onChange={e => {}}
value={''}
/>
<CheckBox
label={'label text'}
checked={true||false}
disabled={true||false}
onChange={checked => {}}
name={'checkboxname'}
/>
<RadioButton
options={[{ label: 'Label', value: 'label' }]}
selected={selectedValue}
onChange={selected => {}}
/>
<Switch
checked={true||false}
disabled={true||false}
onChange={checked => {}}
/>
)
}
}
License
MIT © PrabhuKathiresan
0.0.25
6 years ago
0.0.24
6 years ago
0.0.23
6 years ago
0.0.22
6 years ago
0.0.21
6 years ago
0.0.20
6 years ago
0.0.19
6 years ago
0.0.18
6 years ago
0.0.17
6 years ago
0.0.16
6 years ago
0.0.15
6 years ago
0.0.14
6 years ago
0.0.13
6 years ago
0.0.12
6 years ago
0.0.11
6 years ago
0.0.10
6 years ago
0.0.9
6 years ago
0.0.8
6 years ago
0.0.7
6 years ago
0.0.6
6 years ago
0.0.5
6 years ago
0.0.4
6 years ago
0.0.3
6 years ago
0.0.2
6 years ago
0.0.1
6 years ago
0.0.0
6 years ago