docyrus-data-grid-page-design

Installation
SKILL.md

Docyrus Data Grid Page Design

Build full Docyrus list pages around the web DataGrid stack.

Choose the build mode

  1. Standard Docyrus page → use useDocyrusDataGrid.
    • Best when rows come from a Docyrus data source or generated collection.
    • Gives you metadata-driven columns, saved views, toolbar wiring, search, filters (with async option search for relation/user fields), grouping, sorting, row-height, display mode, fields visibility menu, paging, and reload.
    • Auto-wires reference field expansion, tenant-aware formatters (read from <DocyrusTenantProvider> context automatically), and a shared users list when supplied.
    • Built-in inline change tracking + save banner (trackChanges, onSaveChanges) plus optional inline add-row (onRowAdd).
    • Built-in selection-bar bulk actions (bulkActions: update, delete, export) with BulkUpdateDialog + RecordDeleteConfirmDialog, extendable via extraBulkActions.
    • Built-in server-side export menu (enableServerExportMenu, exportColumns, exportFileName, serverExportLimit).
    • Built-in pivot filter strips (pivotFilters) and an optional side-panel filter rail (enableSideFilters + sideFiltersConfig).
    • Relation-cell navigation (getRelationHref / onOpenRelation / relationIconFields), conditional row/cell color rules (rowColorRules / cellColorRules), and a excludeFieldSlugs escape hatch for stale backend metadata.
    • A companion formViewProps payload to spread straight into useDocyrusFormView for the active view's bound record form.
    • Read references/hook-pages.md for the core surface and references/advanced-grid-features.md for pivot/side filters, relation navigation, color rules, inline add-row, and the escape hatch.
Installs
5
GitHub Stars
1
First Seen
Jun 24, 2026
docyrus-data-grid-page-design — docyrus/design-skills