AG Grid 31.3 is an important minor version - it enhances group and grand total rows, adds skeleton cell loaders and global grid options alongside improvements to Excel export, accessibility support and performance:
- Sticky Group Total and Grand Total Rows
- Theme Builder
- Skeleton Content Displayed in Loading Grid Cells
- Add a Background Image to Excel Export Files
- Global Grid Options to Apply to All AG Grid Instances
- Accessibility Improvements
Please note that AG Grid 31.3 has no breaking changes from AG Grid 31. We're providing Codemods to help you update any deprecated API members with their replacement members automatically. Please review the migration guide when planning to update to this version.
Sticky Group Total and Grand Total Rows
AG Grid 31.3 significantly improves group and grand total rows, allowing to display group and grand total rows as sticky rows at the top or bottom of the grid. This helps end-users more easily keep track of total row values in large datasets with a responsive and visually-appealing experience.
See this documented here and illustrated below:
Theme Builder
AG Grid 31.3 introduces a powerful styling tool - Theme Builder to allow you to easily build highly-customised custom themes for AG Grid.
The Theme Builder includes a number of styling presets and allows you to set all aspects of grid styling in a visual way. It exports these customised styling configurations which can then be applied to AG Grid.
See this illustrated below:
Skeleton Content Displayed in Loading Grid Cells
AG Grid 31.3 provides a built-in skeleton loading cell renderer when loading data with the server-side row model. The skeleton loader indicates that content is loading with an industry-standard, easily-recognizable visualization, providing a professional, user-friendly loading experience and improving the look and feel of your grids.
See this documented here and demonstrated below:
Add Background Image to Excel Exported File
AG Grid 31.3 allows adding background images to Excel exported files. This allows adding watermarks with a company logo or the status of a document (for example - draft, confidential) to an Excel exported file. This will make your exported files look better styled and more professional.
See this documented here and illustrated below:
Global Grid Options to Apply to All Grids
AG Grid 31.3 allows setting global grid options to be shared across all grids in an application. This allows you to simplify your AG Grid configuration by reusing a base AG Grid configuration across grids and to overriding it in specific grids as needed.
See this documented here.
Accessibility Support Improvements
AG Grid 31.3 further improves accessibility by allowing to use the Page Up, Page Down, Home and End keys to more easily navigate scrollable lists used across AG Grid. This includes the set filter, columns list in the column chooser and columns tool panel, select cell editor, rich select cell editor, lists of filter options, etc.
This makes AG Grid much easier to use with many columns or many values in cell editors or set filters, as shown below:
Figma Design System now available through Figma Community
AG Grid 31.3 adds the Figma design system to Figma Community. This makes it even easier to get started and stay up to date with AG Grid for Figma.
We’ve also added support for Skeleton loading cells to the Figma design system allowing you to design and mockup loading states for you application right within Figma.
Summary
AG Grid 31.3 is a minor version with key features - it significantly improves group and grand total rows, adds skeleton cell loaders and global grid options, alongside improvements to Excel export, accessibility and stability.
We suggest reviewing the migration guide when planning to upgrade and seeing the full list of changes in our Changelog.
As always, we’re keen to help you upgrade and to hear your feedback.
Happy coding!