1.2.6 • Published 5 days ago
air-grid v1.2.6
Air-Grid
A beautiful Airtable-like React component to visualize and edit your data.
Feature rich:
- Dead simple to set up and to use
- Supports copy / pasting to and from Excel, Google-sheet...
- Keyboard navigation and shortcuts fully-supported
- Supports right-clicking and custom context menu
- Supports dragging corner to expand selection
- Easy to extend and implement custom widgets
- Blazing fast, optimized for speed, minimal renders count
- Smooth animations
- Virtualized rows and columns, supports hundreds of thousands of rows
- Extensively customizable, controllable behaviors
- Built with Typescript
Install
npm i air-grid
Usage
import {
DataSheetGrid,
checkboxColumn,
textColumn,
keyColumn,
} from 'air-grid'
// Import the style only once in your app!
import 'air-grid/dist/style.css'
const Example = () => {
const [ data, setData ] = useState([
{ active: true, firstName: 'Elon', lastName: 'Musk' },
{ active: false, firstName: 'Jeff', lastName: 'Bezos' },
])
const columns = [
{
...keyColumn('active', checkboxColumn),
title: 'Active',
},
{
...keyColumn('firstName', textColumn),
title: 'First name',
},
{
...keyColumn('lastName', textColumn),
title: 'Last name',
},
]
return (
<AirGrid
value={data}
onChange={setData}
columns={columns}
/>
)
}
1.2.6
5 days ago
1.2.5
5 days ago
1.2.4
5 days ago
1.2.3
9 days ago
1.2.2
9 days ago
1.2.1
9 days ago
1.2.0
11 days ago
1.1.9
11 days ago
1.1.8
11 days ago
1.1.7
11 days ago
1.1.6
11 days ago
1.1.5
11 days ago
1.1.1
13 days ago
1.1.4
13 days ago
1.1.3
13 days ago
1.1.2
13 days ago
1.1.0
14 days ago
1.0.9
16 days ago
1.0.8
19 days ago
1.0.7
19 days ago
1.0.6
20 days ago
1.0.5
20 days ago
1.0.4
20 days ago
1.0.3
20 days ago
1.0.2
21 days ago
1.0.1
21 days ago
1.0.0
21 days ago