Wijmo 2025 v1 Has Landed

Wijmo has just shipped its first major release of 2025. This release includes support for Angular 19 and Next.js 15. It also features nice enhancements to FlexGrid, like tri-state sorting, an empty data message, and accessibility improvements. As usual, the release also includes many bug fixes for customers.

Angular 19 Support

We are happy to announce that Wijmo fully supports Angular 19. We have a long tradition of support in Angular, including powerful features in markup like Cell Templates in FlexGrid. We believe Wijmo offers the most powerful set of Angular components and the best Angular DataGrid in the market.

To get started using Wijmo in Angular, follow our Angular QuickStart guide!

Next.js 15 Support

Wijmo has added support for Next.js version 15! Wijmo’s React Interop enables you to utilize Wijmo controls within a Next.js project.

Get started by following our Next.js QuickStart.

Cleanup Callbacks Support in React

As of React 19, the framework has supported returning cleanup functions from the ref callback function. Wijmo has now added support for these cleanup functions in all top-level components. The functions will be called when a Wijmo component is disposed of or destroyed, making Wijmo components more in line with modern React component architecture.

Empty Data Message in FlexGrid

To address a customer request, we have added a new noDataOverlayContent property to FlexGrid. This allows developers to specify an HTML string content string to be displayed in the overlay when the grid data is empty.

This is a more user-friendly way of showing an empty DataGrid. The message design and contents can be fully customized.

A new property overlayManager was also introduced to allow developers more customization of overlay content. To use the overlayManager, you can define a new class by inheriting from OverlayManager class and overriding the required method(s) to customize its functionality.

Try the new No Data Overlay Demo.

Tri-State Sorting in FlexGrid

Another great customer suggestion was adding the ability to customize sort behavior when column headers are clicked. Previously, users could only remove a column’s sort by using CTRL + click. However, our customers suggested a three-click pattern:

1. Click 1 = Sort Ascending
2. Click 2 = Sort Descending
3. Click 3 = Remove Sort

To support this (and even change the order), we have introduced a sortOrder property. This allows you to choose the Sort behavior for FlexGrid.

SortOrder includes the following options:

• AscDesc (Default)
• DescAsc
• AscDescNone (matches the customer-requested pattern)
• DescAscNone

This gives developers the choice of using the three-click sort pattern, even determining the order in which the sorting takes place.

Try our updated Sorting FlexGrid sample.

Accessibility Improvements in FlexGrid, CollectionViewNavigator, and Glyphs

Accessibility has been a major focus for us lately, and the following releases will show even more work being completed for WCAG compliance. This is important work, and we are happy to help ensure our customers' applications can meet WCAG compliance and beyond.

This release features some enhancements (and fixes) to FlexGrid’s accessibility, specifically issues identified in Axe. We are also releasing WCAG 2.0 AA compliance for CollectionViewNavigator (paging UI). Lastly, we have improved our glyphs for high-contrast support.

Again, we are looking forward to releasing the major developments we are undertaking to ensure WCAG compliance!

Breaking Changes

• [CollectionViewNavigator] Changed readonly INPUT element to a SPAN element. The value of wj-part attribute is same as previous. (WJM-35471)
  Previously: Selector for status element is input[wj-part=txt-curr]
  Now: Selector for status element is span[wj-part=txt-curr]
• [FlexGrid] Shifted WAI-ARIA related attributes from the FlexGrid's hostElement to the parentElement of [wj-part="root"] element. (WJM-35090)
  Previously: In test cases, FlexGrid's hostElement was checked for the presence of required WAI-ARIA attributes
  Now: Updates are required for such test cases as WAI-ARIA attributes are now present on the parentElement of FlexGrid's [wj-part="root"] element
• [FlexGrid] Editors' hostElements are moved outside of the [wj-part='root'] element. (WJM-35090)
   Previously: When FlexGrid was not in edit mode, editors' hostElements were placed as the children of [wj-part='root'] element. Example: [wj-part="root"] > .wj-control
  Now: When FlexGrid is not in edit mode, editors' hostElements are now contained inside a DIV that is a direct DOM child of FlexGrid's hostElement. Example: .wj-flexgrid > .wj-grid-editors-container > .wj-control, For FlexSheet, the editor container DIV will be added as a sibiling of role grid element
  Update Needed: Any selectors that target the inactive editors, either in CSS styling (rare) or in test cases, need to be updated

Change Log

• [Angular] Added support for Angular version 19. (WJM-24709)
• [NextJS] Added support for Next.js version 15. (WJM-24709)
• [React] Added support for cleanup callbacks in React refs for top-level controls that take DOM elements in their constructors. This feature is not available for child components. (WJM-35407)
• [Culture] Updated Croatian culture currency symbol from kn to €. (WJM-35015)
• [Culture] Added support for Saudi Arabia culture(ar-SA). (WJM-35102)
• [FlexGrid] Added noDataOverlayContent property and OverlayManager class to display customizable messages when grid has no data. (WJM-35318)
• [FlexGrid] Added 'sortOrder' property to FlexGrid and Column classes to support three-state Sort on column header click. (WJM-35277)
• [FlexGrid][FlexSheet][MultiRow] Added support for triggering sortingColumn and sortedColumn events when sorting from Filter dialog. (WJM-22970)
• [FlexGrid][GroupPanel] Added support for three-state Sort when sorting columns from GroupPanel. (WJM-35546)
• [FlexGrid] Standardized TreeGrid child node indentation to match TreeView. (WJM-35188)
• [FlexGrid] Added rowgroup role for root ([wj-part=root]), columnHeader ([wj-part=ch]) and columnFooter ([wj-part=cf]) elements. (WJM-35090)
• [FlexGrid] Added support for resizing rows/columns beyond grid boundary. (WJM-35276)
• [RESTCollectionView/ODataCollectionView] Added paging support with server-side grouping and group lazy-loading. (WJM-35218)
• [CollectionViewNavigator] Improved CollectionViewNavigator accessibility as per WCAG 2.0 AA. (WJM-35471)
• [Glyphs] Improved Wijmo Glyphs rendering in OS Contrast themes. (WJM-35471)

Please Migrate npm References to @mescius Scope!

As a reminder, our new releases are now published to the @mescius scope on npm. To access the latest code, you should migrate to the new @mescius scoped packages from the old @grapecity scope.

The table below includes examples of some new packages and their old equivalents:

As you can see, it's a direct migration. You will need to update the package.json references as well as the import statement. The best way to update your applications is to use a Find and Replace tool (like the one in VSCode), find instances of “@grapecity/”, and then replace them with “@mescius/”. This will cover the package.json and import statements. 

Notice of deprecation: We will still publish new versions of Wijmo under the old @grapecity scope for a short period. After this period, we will stop updating them and only publish new versions to @mescius scope. For this reason, we highly suggest migrating to the new @mescius scope.

Ready to See What the Latest Release Has to Offer? Download Wijmo Today!