dash-glide-grid 0.1.16

A high-performance data grid component for Plotly Dash

Dash Glide Grid

Note: This project is under active development and not yet recommended for production use. Expect breaking changes until v1.0 is released.

A high-performance, fully-featured data grid component for Plotly Dash, powered by Glide Data Grid.

📖 Documentation & Interactive Examples

Why Dash Glide Grid?

Feature	Dash Glide Grid	Dash DataTable	Dash AG Grid Community	Dash AG Grid Enterprise
License	MIT	MIT	MIT	Commercial
Cost	Free	Free	Free	$999/developer + $750/deployment
Rendering	Canvas	DOM	DOM	DOM
Large Data	1M+ cells	Good	Good	Good
Cell Types	23	3	6	7
Fill Handle	✅	❌	❌	✅
Copy/Paste	✅	✅	Limited	✅
Range Selection	✅	Limited	❌	✅
Undo/Redo	✅	❌	✅	✅
Sorting	✅	✅	✅	✅
Search	✅	❌	❌	✅
Filtering	✅	❌	✅	✅
Header Menu Support	✅	❌	❌	✅
Context Menu Support	✅	❌	❌	✅
Row Grouping	❌	❌	❌	✅
Pivoting	❌	❌	❌	✅
Master/Detail	❌	❌	❌	✅
Pagination	❌	✅	✅	✅
Custom JS Functions	✅	❌	✅	✅

Choose Dash Glide Grid when you need:

• Excel-like editing (fill handle, copy/paste, range selection)
• Blazing-fast canvas rendering for large datasets (1M+ cells)
• Rich cell types (dropdowns, multi-select, range sliders, buttons) in a free, MIT-licensed package
• A modern alternative to the deprecated Dash DataTable

Features

• High Performance - Canvas-based rendering handles millions of rows smoothly
• Rich Cell Types - Text, numbers, booleans, markdown, URIs, images, dropdowns, multi-select bubbles, and more
• Excel-like Editing - Fill handle, copy/paste, undo/redo
• Flexible Selection - Cell, row, column, and range selection modes
• Sorting & Filtering - Built-in column sorting and header filter menus
• Theming - Full theme customization at grid, row, column, and cell level
• Column Groups - Organize columns under collapsible group headers
• Cell Merging - Horizontal cell spanning
• Row/Column Reordering - Drag-and-drop reordering
• Frozen Rows - Pin rows to the top or bottom
• Validation - Client-side cell validation with visual feedback
• Search - Built-in search

Installation

pip install dash-glide-grid

Or with uv:

uv add dash-glide-grid

Requirements

• Python 3.9+
• Dash 3.3+

Quick Start

import dash
from dash import html
import dash_glide_grid as dgg

app = dash.Dash(__name__)

app.layout = html.Div([
    dgg.GlideGrid(
        id='grid',
        columns=[
            {'title': 'Name', 'id': 'name', 'width': 200},
            {'title': 'Age', 'id': 'age', 'width': 100},
            {'title': 'City', 'id': 'city', 'width': 150}
        ],
        data=[
            {'name': 'Alice', 'age': 30, 'city': 'New York'},
            {'name': 'Bob', 'age': 25, 'city': 'San Francisco'},
        ],
        height=400
    )
])

if __name__ == '__main__':
    app.run(debug=True)

Data Format

Use records format (compatible with df.to_dict('records')):

# From a list of dicts
data = [
    {'name': 'Alice', 'age': 30, 'active': True},
    {'name': 'Bob', 'age': 25, 'active': False}
]

# From pandas
data = df.to_dict('records')

Key Props

Prop	Description
columns	Column definitions with title, id, width, type, etc.
data	List of row dicts
height	Grid height in pixels
readonly	Make the entire grid read-only
theme	Custom theme object
fillHandle	Enable Excel-like fill handle
copyPaste	Enable copy/paste support
rowSelect	Row selection: 'none', 'single', 'multi'
columnSelect	Column selection: 'none', 'single', 'multi'
sortable	Enable column sorting
showSearch	Show search box
enableUndoRedo	Enable undo/redo support
freezeTrailingRows	Number of rows to freeze at bottom
columnGroups	Group columns under headers

See the full documentation for all props and callbacks.

Examples

The examples/ folder contains 39 examples covering many features:

# Basic usage
python examples/01_basic_grid.py

# With uv
uv run examples/01_basic_grid.py

Then open http://localhost:8050 in your browser.

Highlights

• 01_basic_grid.py - Simple read-only grid
• 02_editable_grid.py - Cell editing with callbacks
• 04_large_dataset.py - Performance with 10,000+ rows
• 05_basic_cell_types.py - All basic cell types
• 07_fill_handle_example.py - Excel-like drag-to-fill
• 37_undo_redo.py - Undo/redo support

See examples/README.md for the complete list.

Development

# Clone the repo
git clone https://github.com/benweinberg89/dash-glide-grid.git
cd dash-glide-grid

# Install dependencies
npm install
uv sync

# Build the component
npm run build

# Run an example
uv run examples/01_basic_grid.py

Contributing

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.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

License

MIT License - see LICENSE

Credits

Built on Glide Data Grid by Glide.