@ytkj/ag-grid-react-components v0.0.3

ag-grid-react-components

AgGrid framework components for React, powered by TypeScript.

Installation

1. npm install -S ag-grid-react-components

Usage

RankFilter

1. import RankFilter

   import { RankFilter } from 'ag-grid-react-components'

2. set RankFilter to columnDef.filterFramework

   <AgGridReact
       columnDefs={[
           {
               field: 'field1',
               headerName: 'Rank Filter',
               filterFramework: RankFilter,
           },
       ]}
       {...props}
   />

Result

Server-side

'rank' filter type can be handled by sqlalchemy-ag-grid with Python + Flask + SQLAlchemy stack.

SetFilter

1. import setFilterFactory

   import { setFilterFactory } from 'ag-grid-react-components'

2. create SetFilter by setFilterFactory() and set it to columnDef.filterFramework

   <AgGridReact
       columnDefs={[
           {
               field: 'field2',
               headerName: 'Set Filter',
               filterFramework: setFilterFactory([
                   {key: '', label: ''},
                   {key: 'a', label: 'A'},
                   {key: 'b', label: 'B'},
                   {key: 'c', label: 'C'},
               ]),
           },
       ]}
       {...props}
   />

Result

Test

1. git clone https://github.com/ytkj/ag-grid-react-components.git
2. cd ag-grid-react-components
3. npm install
4. npm test
5. open http://localhost:3000 in your browser.