dash-glide-grid 0.1.0__tar.gz
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- dash_glide_grid-0.1.0/LICENSE +21 -0
- dash_glide_grid-0.1.0/MANIFEST.in +11 -0
- dash_glide_grid-0.1.0/PKG-INFO +226 -0
- dash_glide_grid-0.1.0/README.md +203 -0
- dash_glide_grid-0.1.0/dash_glide_grid/GlideGrid.py +1597 -0
- dash_glide_grid-0.1.0/dash_glide_grid/__init__.py +87 -0
- dash_glide_grid-0.1.0/dash_glide_grid/_imports_.py +5 -0
- dash_glide_grid-0.1.0/dash_glide_grid/async-null.js +3 -0
- dash_glide_grid-0.1.0/dash_glide_grid/async-null.js.map +1 -0
- dash_glide_grid-0.1.0/dash_glide_grid/dash_glide_grid.min.js +3 -0
- dash_glide_grid-0.1.0/dash_glide_grid/dash_glide_grid.min.js.map +1 -0
- dash_glide_grid-0.1.0/dash_glide_grid/metadata.json +1 -0
- dash_glide_grid-0.1.0/dash_glide_grid/package-info.json +53 -0
- dash_glide_grid-0.1.0/dash_glide_grid.egg-info/PKG-INFO +226 -0
- dash_glide_grid-0.1.0/dash_glide_grid.egg-info/SOURCES.txt +19 -0
- dash_glide_grid-0.1.0/dash_glide_grid.egg-info/dependency_links.txt +1 -0
- dash_glide_grid-0.1.0/dash_glide_grid.egg-info/requires.txt +1 -0
- dash_glide_grid-0.1.0/dash_glide_grid.egg-info/top_level.txt +1 -0
- dash_glide_grid-0.1.0/package.json +53 -0
- dash_glide_grid-0.1.0/pyproject.toml +50 -0
- dash_glide_grid-0.1.0/setup.cfg +4 -0
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Ben Weinberg
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
include dash_glide_grid/dash_glide_grid.min.js
|
|
2
|
+
include dash_glide_grid/dash_glide_grid.min.js.map
|
|
3
|
+
include dash_glide_grid/async-*.js
|
|
4
|
+
include dash_glide_grid/async-*.js.map
|
|
5
|
+
include dash_glide_grid/*-shared.js
|
|
6
|
+
include dash_glide_grid/*-shared.js.map
|
|
7
|
+
include dash_glide_grid/metadata.json
|
|
8
|
+
include dash_glide_grid/package-info.json
|
|
9
|
+
include README.md
|
|
10
|
+
include LICENSE
|
|
11
|
+
include package.json
|
|
@@ -0,0 +1,226 @@
|
|
|
1
|
+
Metadata-Version: 2.4
|
|
2
|
+
Name: dash-glide-grid
|
|
3
|
+
Version: 0.1.0
|
|
4
|
+
Summary: A high-performance data grid component for Plotly Dash
|
|
5
|
+
Author: Ben Weinberg
|
|
6
|
+
License: MIT
|
|
7
|
+
Project-URL: Homepage, https://github.com/benweinberg89/dash-glide-grid
|
|
8
|
+
Project-URL: Repository, https://github.com/benweinberg89/dash-glide-grid
|
|
9
|
+
Classifier: Framework :: Dash
|
|
10
|
+
Classifier: Programming Language :: Python :: 3
|
|
11
|
+
Classifier: Programming Language :: Python :: 3.9
|
|
12
|
+
Classifier: Programming Language :: Python :: 3.10
|
|
13
|
+
Classifier: Programming Language :: Python :: 3.11
|
|
14
|
+
Classifier: Programming Language :: Python :: 3.12
|
|
15
|
+
Classifier: Programming Language :: Python :: 3.13
|
|
16
|
+
Classifier: License :: OSI Approved :: MIT License
|
|
17
|
+
Classifier: Operating System :: OS Independent
|
|
18
|
+
Requires-Python: >=3.9
|
|
19
|
+
Description-Content-Type: text/markdown
|
|
20
|
+
License-File: LICENSE
|
|
21
|
+
Requires-Dist: dash>=3.3
|
|
22
|
+
Dynamic: license-file
|
|
23
|
+
|
|
24
|
+
# Dash Glide Grid
|
|
25
|
+
|
|
26
|
+
[](https://pypi.org/project/dash-glide-grid/)
|
|
27
|
+
[](https://opensource.org/licenses/MIT)
|
|
28
|
+
[](https://www.python.org/downloads/)
|
|
29
|
+
[](https://dash.plotly.com/)
|
|
30
|
+
|
|
31
|
+
> **Note:** This project is under active development and not yet recommended for production use. Expect breaking changes until v1.0 is released.
|
|
32
|
+
|
|
33
|
+
A high-performance, fully-featured data grid component for [Plotly Dash](https://dash.plotly.com/), powered by [Glide Data Grid](https://github.com/glideapps/glide-data-grid).
|
|
34
|
+
|
|
35
|
+
📖 **[Documentation & Interactive Examples](https://dgg-docs.onrender.com/)**
|
|
36
|
+
|
|
37
|
+
<!-- TODO: Add demo GIF here -->
|
|
38
|
+
<!--  -->
|
|
39
|
+
|
|
40
|
+
## Why Dash Glide Grid?
|
|
41
|
+
|
|
42
|
+
| Feature | Dash Glide Grid | Dash DataTable | Dash AG Grid Community | Dash AG Grid Enterprise |
|
|
43
|
+
|---------|----------------|----------------|-------------------|-------------------|
|
|
44
|
+
| **License** | MIT | MIT | MIT | Commercial |
|
|
45
|
+
| **Cost** | Free | Free | Free | \$999/developer + \$750/deployment |
|
|
46
|
+
| **Rendering** | Canvas | DOM | DOM | DOM |
|
|
47
|
+
| **Large Data** | 1M+ cells | Good | Good | Good |
|
|
48
|
+
| **Cell Types** | 11 built-in | 3 (text, number, dropdown) | 7 editors | Many |
|
|
49
|
+
| **Fill Handle** | ✅ | ❌ | ❌ | ✅ |
|
|
50
|
+
| **Copy/Paste** | ✅ | ✅ | Limited | ✅ |
|
|
51
|
+
| **Range Selection** | ✅ | Limited | ❌ | ✅ |
|
|
52
|
+
| **Undo/Redo** | ✅ | ❌ | ✅ | ✅ |
|
|
53
|
+
| **Sorting** | ✅ | ✅ | ✅ | ✅ |
|
|
54
|
+
| **Search** | ✅ | ❌ | ❌ | ✅ |
|
|
55
|
+
| **Filtering** | ✅ | ❌ | ✅ | ✅ |
|
|
56
|
+
| **Header Menu Support** | ✅ | ❌ | ❌ | ✅ |
|
|
57
|
+
| **Context Menu Support** | ✅ | ❌ | ❌ | ✅ |
|
|
58
|
+
| **Row Grouping** | ❌ | ❌ | ❌ | ✅ |
|
|
59
|
+
| **Pivoting** | ❌ | ❌ | ❌ | ✅ |
|
|
60
|
+
| **Master/Detail** | ❌ | ❌ | ❌ | ✅ |
|
|
61
|
+
| **Pagination** | ❌ (not needed) | ✅ | ✅ | ✅ |
|
|
62
|
+
| **Custom JS Functions** | ✅ | ❌ | ✅ | ✅ |
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
**Choose Dash Glide Grid when you need:**
|
|
66
|
+
- Excel-like editing (fill handle, copy/paste, range selection)
|
|
67
|
+
- Blazing-fast canvas rendering for large datasets (1M+ cells)
|
|
68
|
+
- Rich cell types (markdown, images, multi-select) in a free, MIT-licensed package
|
|
69
|
+
- A modern alternative to the deprecated Dash DataTable
|
|
70
|
+
|
|
71
|
+
## Features
|
|
72
|
+
|
|
73
|
+
- **High Performance** - Canvas-based rendering handles millions of rows smoothly
|
|
74
|
+
- **Rich Cell Types** - Text, numbers, booleans, markdown, URIs, images, dropdowns, multi-select bubbles, and more
|
|
75
|
+
- **Excel-like Editing** - Fill handle, copy/paste, undo/redo
|
|
76
|
+
- **Flexible Selection** - Cell, row, column, and range selection modes
|
|
77
|
+
- **Sorting & Filtering** - Built-in column sorting and header filter menus
|
|
78
|
+
- **Theming** - Full theme customization at grid, row, column, and cell level
|
|
79
|
+
- **Column Groups** - Organize columns under collapsible group headers
|
|
80
|
+
- **Cell Merging** - Horizontal cell spanning
|
|
81
|
+
- **Row/Column Reordering** - Drag-and-drop reordering
|
|
82
|
+
- **Frozen Rows** - Pin rows to the top or bottom
|
|
83
|
+
- **Validation** - Client-side cell validation with visual feedback
|
|
84
|
+
- **Search** - Built-in search
|
|
85
|
+
|
|
86
|
+
## Installation (Not available on PyPI yet)
|
|
87
|
+
|
|
88
|
+
```bash
|
|
89
|
+
pip install dash-glide-grid
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
Or with [uv](https://docs.astral.sh/uv/):
|
|
93
|
+
|
|
94
|
+
```bash
|
|
95
|
+
uv add dash-glide-grid
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
## Requirements
|
|
99
|
+
|
|
100
|
+
- Python 3.9+
|
|
101
|
+
- Dash 3.3+
|
|
102
|
+
|
|
103
|
+
## Quick Start
|
|
104
|
+
|
|
105
|
+
```python
|
|
106
|
+
import dash
|
|
107
|
+
from dash import html
|
|
108
|
+
import dash_glide_grid as dgg
|
|
109
|
+
|
|
110
|
+
app = dash.Dash(__name__)
|
|
111
|
+
|
|
112
|
+
app.layout = html.Div([
|
|
113
|
+
dgg.GlideGrid(
|
|
114
|
+
id='grid',
|
|
115
|
+
columns=[
|
|
116
|
+
{'title': 'Name', 'id': 'name', 'width': 200},
|
|
117
|
+
{'title': 'Age', 'id': 'age', 'width': 100},
|
|
118
|
+
{'title': 'City', 'id': 'city', 'width': 150}
|
|
119
|
+
],
|
|
120
|
+
data=[
|
|
121
|
+
{'name': 'Alice', 'age': 30, 'city': 'New York'},
|
|
122
|
+
{'name': 'Bob', 'age': 25, 'city': 'San Francisco'},
|
|
123
|
+
],
|
|
124
|
+
height=400
|
|
125
|
+
)
|
|
126
|
+
])
|
|
127
|
+
|
|
128
|
+
if __name__ == '__main__':
|
|
129
|
+
app.run(debug=True)
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
## Data Format
|
|
133
|
+
|
|
134
|
+
Use records format (compatible with `df.to_dict('records')`):
|
|
135
|
+
|
|
136
|
+
```python
|
|
137
|
+
# From a list of dicts
|
|
138
|
+
data = [
|
|
139
|
+
{'name': 'Alice', 'age': 30, 'active': True},
|
|
140
|
+
{'name': 'Bob', 'age': 25, 'active': False}
|
|
141
|
+
]
|
|
142
|
+
|
|
143
|
+
# From pandas
|
|
144
|
+
data = df.to_dict('records')
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
## Key Props
|
|
148
|
+
|
|
149
|
+
| Prop | Description |
|
|
150
|
+
|------|-------------|
|
|
151
|
+
| `columns` | Column definitions with `title`, `id`, `width`, `type`, etc. |
|
|
152
|
+
| `data` | List of row dicts |
|
|
153
|
+
| `height` | Grid height in pixels |
|
|
154
|
+
| `readonly` | Make the entire grid read-only |
|
|
155
|
+
| `theme` | Custom theme object |
|
|
156
|
+
| `fillHandle` | Enable Excel-like fill handle |
|
|
157
|
+
| `copyPaste` | Enable copy/paste support |
|
|
158
|
+
| `rowSelect` | Row selection: `'none'`, `'single'`, `'multi'` |
|
|
159
|
+
| `columnSelect` | Column selection: `'none'`, `'single'`, `'multi'` |
|
|
160
|
+
| `sortable` | Enable column sorting |
|
|
161
|
+
| `showSearch` | Show search box |
|
|
162
|
+
| `enableUndoRedo` | Enable undo/redo support |
|
|
163
|
+
| `freezeTrailingRows` | Number of rows to freeze at bottom |
|
|
164
|
+
| `columnGroups` | Group columns under headers |
|
|
165
|
+
|
|
166
|
+
See the [full documentation](https://dgg-docs.onrender.com/) for all props and callbacks.
|
|
167
|
+
|
|
168
|
+
## Examples
|
|
169
|
+
|
|
170
|
+
The `examples/` folder contains 39 examples covering many features:
|
|
171
|
+
|
|
172
|
+
```bash
|
|
173
|
+
# Basic usage
|
|
174
|
+
python examples/01_basic_grid.py
|
|
175
|
+
|
|
176
|
+
# With uv
|
|
177
|
+
uv run examples/01_basic_grid.py
|
|
178
|
+
```
|
|
179
|
+
|
|
180
|
+
Then open http://localhost:8050 in your browser.
|
|
181
|
+
|
|
182
|
+
**Highlights**
|
|
183
|
+
- [01_basic_grid.py](examples/01_basic_grid.py) - Simple read-only grid
|
|
184
|
+
- [02_editable_grid.py](examples/02_editable_grid.py) - Cell editing with callbacks
|
|
185
|
+
- [04_large_dataset.py](examples/04_large_dataset.py) - Performance with 10,000+ rows
|
|
186
|
+
- [05_basic_cell_types.py](examples/05_basic_cell_types.py) - All basic cell types
|
|
187
|
+
- [07_fill_handle_example.py](examples/07_fill_handle_example.py) - Excel-like drag-to-fill
|
|
188
|
+
- [37_undo_redo.py](examples/37_undo_redo.py) - Undo/redo support
|
|
189
|
+
|
|
190
|
+
See [examples/README.md](examples/README.md) for the complete list.
|
|
191
|
+
|
|
192
|
+
## Development
|
|
193
|
+
|
|
194
|
+
```bash
|
|
195
|
+
# Clone the repo
|
|
196
|
+
git clone https://github.com/benweinberg89/dash-glide-grid.git
|
|
197
|
+
cd dash-glide-grid
|
|
198
|
+
|
|
199
|
+
# Install dependencies
|
|
200
|
+
npm install
|
|
201
|
+
uv sync
|
|
202
|
+
|
|
203
|
+
# Build the component
|
|
204
|
+
npm run build
|
|
205
|
+
|
|
206
|
+
# Run an example
|
|
207
|
+
uv run examples/01_basic_grid.py
|
|
208
|
+
```
|
|
209
|
+
|
|
210
|
+
## Contributing
|
|
211
|
+
|
|
212
|
+
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
|
|
213
|
+
|
|
214
|
+
1. Fork the repository
|
|
215
|
+
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
|
|
216
|
+
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
|
|
217
|
+
4. Push to the branch (`git push origin feature/amazing-feature`)
|
|
218
|
+
5. Open a Pull Request
|
|
219
|
+
|
|
220
|
+
## License
|
|
221
|
+
|
|
222
|
+
MIT License - see [LICENSE](./LICENSE)
|
|
223
|
+
|
|
224
|
+
## Credits
|
|
225
|
+
|
|
226
|
+
Built on [Glide Data Grid](https://github.com/glideapps/glide-data-grid) by [Glide](https://www.glideapps.com/).
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
# Dash Glide Grid
|
|
2
|
+
|
|
3
|
+
[](https://pypi.org/project/dash-glide-grid/)
|
|
4
|
+
[](https://opensource.org/licenses/MIT)
|
|
5
|
+
[](https://www.python.org/downloads/)
|
|
6
|
+
[](https://dash.plotly.com/)
|
|
7
|
+
|
|
8
|
+
> **Note:** This project is under active development and not yet recommended for production use. Expect breaking changes until v1.0 is released.
|
|
9
|
+
|
|
10
|
+
A high-performance, fully-featured data grid component for [Plotly Dash](https://dash.plotly.com/), powered by [Glide Data Grid](https://github.com/glideapps/glide-data-grid).
|
|
11
|
+
|
|
12
|
+
📖 **[Documentation & Interactive Examples](https://dgg-docs.onrender.com/)**
|
|
13
|
+
|
|
14
|
+
<!-- TODO: Add demo GIF here -->
|
|
15
|
+
<!--  -->
|
|
16
|
+
|
|
17
|
+
## Why Dash Glide Grid?
|
|
18
|
+
|
|
19
|
+
| Feature | Dash Glide Grid | Dash DataTable | Dash AG Grid Community | Dash AG Grid Enterprise |
|
|
20
|
+
|---------|----------------|----------------|-------------------|-------------------|
|
|
21
|
+
| **License** | MIT | MIT | MIT | Commercial |
|
|
22
|
+
| **Cost** | Free | Free | Free | \$999/developer + \$750/deployment |
|
|
23
|
+
| **Rendering** | Canvas | DOM | DOM | DOM |
|
|
24
|
+
| **Large Data** | 1M+ cells | Good | Good | Good |
|
|
25
|
+
| **Cell Types** | 11 built-in | 3 (text, number, dropdown) | 7 editors | Many |
|
|
26
|
+
| **Fill Handle** | ✅ | ❌ | ❌ | ✅ |
|
|
27
|
+
| **Copy/Paste** | ✅ | ✅ | Limited | ✅ |
|
|
28
|
+
| **Range Selection** | ✅ | Limited | ❌ | ✅ |
|
|
29
|
+
| **Undo/Redo** | ✅ | ❌ | ✅ | ✅ |
|
|
30
|
+
| **Sorting** | ✅ | ✅ | ✅ | ✅ |
|
|
31
|
+
| **Search** | ✅ | ❌ | ❌ | ✅ |
|
|
32
|
+
| **Filtering** | ✅ | ❌ | ✅ | ✅ |
|
|
33
|
+
| **Header Menu Support** | ✅ | ❌ | ❌ | ✅ |
|
|
34
|
+
| **Context Menu Support** | ✅ | ❌ | ❌ | ✅ |
|
|
35
|
+
| **Row Grouping** | ❌ | ❌ | ❌ | ✅ |
|
|
36
|
+
| **Pivoting** | ❌ | ❌ | ❌ | ✅ |
|
|
37
|
+
| **Master/Detail** | ❌ | ❌ | ❌ | ✅ |
|
|
38
|
+
| **Pagination** | ❌ (not needed) | ✅ | ✅ | ✅ |
|
|
39
|
+
| **Custom JS Functions** | ✅ | ❌ | ✅ | ✅ |
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
**Choose Dash Glide Grid when you need:**
|
|
43
|
+
- Excel-like editing (fill handle, copy/paste, range selection)
|
|
44
|
+
- Blazing-fast canvas rendering for large datasets (1M+ cells)
|
|
45
|
+
- Rich cell types (markdown, images, multi-select) in a free, MIT-licensed package
|
|
46
|
+
- A modern alternative to the deprecated Dash DataTable
|
|
47
|
+
|
|
48
|
+
## Features
|
|
49
|
+
|
|
50
|
+
- **High Performance** - Canvas-based rendering handles millions of rows smoothly
|
|
51
|
+
- **Rich Cell Types** - Text, numbers, booleans, markdown, URIs, images, dropdowns, multi-select bubbles, and more
|
|
52
|
+
- **Excel-like Editing** - Fill handle, copy/paste, undo/redo
|
|
53
|
+
- **Flexible Selection** - Cell, row, column, and range selection modes
|
|
54
|
+
- **Sorting & Filtering** - Built-in column sorting and header filter menus
|
|
55
|
+
- **Theming** - Full theme customization at grid, row, column, and cell level
|
|
56
|
+
- **Column Groups** - Organize columns under collapsible group headers
|
|
57
|
+
- **Cell Merging** - Horizontal cell spanning
|
|
58
|
+
- **Row/Column Reordering** - Drag-and-drop reordering
|
|
59
|
+
- **Frozen Rows** - Pin rows to the top or bottom
|
|
60
|
+
- **Validation** - Client-side cell validation with visual feedback
|
|
61
|
+
- **Search** - Built-in search
|
|
62
|
+
|
|
63
|
+
## Installation (Not available on PyPI yet)
|
|
64
|
+
|
|
65
|
+
```bash
|
|
66
|
+
pip install dash-glide-grid
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
Or with [uv](https://docs.astral.sh/uv/):
|
|
70
|
+
|
|
71
|
+
```bash
|
|
72
|
+
uv add dash-glide-grid
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
## Requirements
|
|
76
|
+
|
|
77
|
+
- Python 3.9+
|
|
78
|
+
- Dash 3.3+
|
|
79
|
+
|
|
80
|
+
## Quick Start
|
|
81
|
+
|
|
82
|
+
```python
|
|
83
|
+
import dash
|
|
84
|
+
from dash import html
|
|
85
|
+
import dash_glide_grid as dgg
|
|
86
|
+
|
|
87
|
+
app = dash.Dash(__name__)
|
|
88
|
+
|
|
89
|
+
app.layout = html.Div([
|
|
90
|
+
dgg.GlideGrid(
|
|
91
|
+
id='grid',
|
|
92
|
+
columns=[
|
|
93
|
+
{'title': 'Name', 'id': 'name', 'width': 200},
|
|
94
|
+
{'title': 'Age', 'id': 'age', 'width': 100},
|
|
95
|
+
{'title': 'City', 'id': 'city', 'width': 150}
|
|
96
|
+
],
|
|
97
|
+
data=[
|
|
98
|
+
{'name': 'Alice', 'age': 30, 'city': 'New York'},
|
|
99
|
+
{'name': 'Bob', 'age': 25, 'city': 'San Francisco'},
|
|
100
|
+
],
|
|
101
|
+
height=400
|
|
102
|
+
)
|
|
103
|
+
])
|
|
104
|
+
|
|
105
|
+
if __name__ == '__main__':
|
|
106
|
+
app.run(debug=True)
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
## Data Format
|
|
110
|
+
|
|
111
|
+
Use records format (compatible with `df.to_dict('records')`):
|
|
112
|
+
|
|
113
|
+
```python
|
|
114
|
+
# From a list of dicts
|
|
115
|
+
data = [
|
|
116
|
+
{'name': 'Alice', 'age': 30, 'active': True},
|
|
117
|
+
{'name': 'Bob', 'age': 25, 'active': False}
|
|
118
|
+
]
|
|
119
|
+
|
|
120
|
+
# From pandas
|
|
121
|
+
data = df.to_dict('records')
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
## Key Props
|
|
125
|
+
|
|
126
|
+
| Prop | Description |
|
|
127
|
+
|------|-------------|
|
|
128
|
+
| `columns` | Column definitions with `title`, `id`, `width`, `type`, etc. |
|
|
129
|
+
| `data` | List of row dicts |
|
|
130
|
+
| `height` | Grid height in pixels |
|
|
131
|
+
| `readonly` | Make the entire grid read-only |
|
|
132
|
+
| `theme` | Custom theme object |
|
|
133
|
+
| `fillHandle` | Enable Excel-like fill handle |
|
|
134
|
+
| `copyPaste` | Enable copy/paste support |
|
|
135
|
+
| `rowSelect` | Row selection: `'none'`, `'single'`, `'multi'` |
|
|
136
|
+
| `columnSelect` | Column selection: `'none'`, `'single'`, `'multi'` |
|
|
137
|
+
| `sortable` | Enable column sorting |
|
|
138
|
+
| `showSearch` | Show search box |
|
|
139
|
+
| `enableUndoRedo` | Enable undo/redo support |
|
|
140
|
+
| `freezeTrailingRows` | Number of rows to freeze at bottom |
|
|
141
|
+
| `columnGroups` | Group columns under headers |
|
|
142
|
+
|
|
143
|
+
See the [full documentation](https://dgg-docs.onrender.com/) for all props and callbacks.
|
|
144
|
+
|
|
145
|
+
## Examples
|
|
146
|
+
|
|
147
|
+
The `examples/` folder contains 39 examples covering many features:
|
|
148
|
+
|
|
149
|
+
```bash
|
|
150
|
+
# Basic usage
|
|
151
|
+
python examples/01_basic_grid.py
|
|
152
|
+
|
|
153
|
+
# With uv
|
|
154
|
+
uv run examples/01_basic_grid.py
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
Then open http://localhost:8050 in your browser.
|
|
158
|
+
|
|
159
|
+
**Highlights**
|
|
160
|
+
- [01_basic_grid.py](examples/01_basic_grid.py) - Simple read-only grid
|
|
161
|
+
- [02_editable_grid.py](examples/02_editable_grid.py) - Cell editing with callbacks
|
|
162
|
+
- [04_large_dataset.py](examples/04_large_dataset.py) - Performance with 10,000+ rows
|
|
163
|
+
- [05_basic_cell_types.py](examples/05_basic_cell_types.py) - All basic cell types
|
|
164
|
+
- [07_fill_handle_example.py](examples/07_fill_handle_example.py) - Excel-like drag-to-fill
|
|
165
|
+
- [37_undo_redo.py](examples/37_undo_redo.py) - Undo/redo support
|
|
166
|
+
|
|
167
|
+
See [examples/README.md](examples/README.md) for the complete list.
|
|
168
|
+
|
|
169
|
+
## Development
|
|
170
|
+
|
|
171
|
+
```bash
|
|
172
|
+
# Clone the repo
|
|
173
|
+
git clone https://github.com/benweinberg89/dash-glide-grid.git
|
|
174
|
+
cd dash-glide-grid
|
|
175
|
+
|
|
176
|
+
# Install dependencies
|
|
177
|
+
npm install
|
|
178
|
+
uv sync
|
|
179
|
+
|
|
180
|
+
# Build the component
|
|
181
|
+
npm run build
|
|
182
|
+
|
|
183
|
+
# Run an example
|
|
184
|
+
uv run examples/01_basic_grid.py
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
## Contributing
|
|
188
|
+
|
|
189
|
+
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
|
|
190
|
+
|
|
191
|
+
1. Fork the repository
|
|
192
|
+
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
|
|
193
|
+
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
|
|
194
|
+
4. Push to the branch (`git push origin feature/amazing-feature`)
|
|
195
|
+
5. Open a Pull Request
|
|
196
|
+
|
|
197
|
+
## License
|
|
198
|
+
|
|
199
|
+
MIT License - see [LICENSE](./LICENSE)
|
|
200
|
+
|
|
201
|
+
## Credits
|
|
202
|
+
|
|
203
|
+
Built on [Glide Data Grid](https://github.com/glideapps/glide-data-grid) by [Glide](https://www.glideapps.com/).
|