Wijmo 2025 v2 Has Landed

We're happy to announce that we've just published Wijmo's second major release of 2025. This release includes support for Angular 20 and Nuxt.js 4. We've also improved FlexGrid's Filter and Search functionality, as well as the accessibility features of Wijmo's Input controls. As usual, the release also includes bug fixes to address known issues.

Angular 20 Support

We are happy to announce that Wijmo fully supports Angular 20. 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!

Nuxt.js 4 Support

Wijmo has added support for Nuxt.js version 4! Wijmo's Vue Interop enables you to utilize Wijmo controls within a Nuxt.js project.

Get started by following our Nuxt.js QuickStart.

MultiFilter with Conditional and Value Filters in FlexGridFilter

Previously, users had to choose between conditional and value filters when filtering a FlexGrid. With this release, we're adding functionality so users can define both types of filters simultaneously.

This new functionality can be applied to your FlexGridFilter with either the defaultFilterMode or the filterMode properties. To enable MultiFilter:

import { FlexGridFilter, FilterMode } from '@mescius/wijmo.grid.filter';

new FlexGridFilter(grid, {
  defaultFilterMode: FilterMode.MultiFilter
});

Exact Matching with FlexGridSearch

By default, each row of data is converted into a space-separated string for search matching, which can cause issues in certain cases (e.g., when the cell data contains spaces). For such situations, we've implemented the ability to search for an exact match using the exactMatch property:

import { FlexGridSearch } from '@mescius/wijmo.grid.search';

new FlexGridSearch('#theSearch', {
  exactMatch: true
})

Improved Data Processing Operations with FlexGrid

With this release, we've added the ability to perform data processing operations for each cell when a user calls the getClipString method or when using Ctrl+C to retrieve the clip string of a specific range of cells. This is executed using FlexGrid's gettingCellClipString method.

Accessibility Improvements for CellMaker and Input Controls

We are maintaining our focus on accessibility and aiming to improve WCAG compliance for our Input controls.

For this release, we've fixed several issues that were causing most of Wijmo's Input components to report errors in common accessibility testing tools, such as Axe-DevTools, ANDI, and WAVE. We've also improved the quality of content read by screen readers, such as NVDA, JAWS, Narrator, and VoiceOver.

Finally, we've added more keyboard support for a friendlier control experience and have enhanced contrast displays of controls under both default and high-contrast operating system themes.

Breaking Changes

• [ColorPicker] Changed the DOM structure to row arrangement to meet the WCAG requirement, using flex layout styling.
  • Before: Column arrangement DOM structure, using float layout styling
• [Menu] Changed the behavior when pressing Enter key when the menu is split button (isButton:true), now it will execute the command directly. Customers can also use Alt+Down or Alt+Up to open the menu dropdown list.
  • Before: Open the menu dropdown list
• [InputDate][InputDateRange] Changed the position of the OK/Cancel buttons in multiple calendars. The buttons appear after enabling showConfirmationButtons and will now always be located at the bottom right.
  • Before: Always located at the bottom of the first calendar panel

Change Log

• [Accessibility] Enhanced Accessibility support to comply with WCAG 2.0 AA standards. Fixed issues where most Wijmo components reported errors in common accessibility testing tools (Axe-DevTools/ANDI/WAVE). Improved the quality of content read by screen readers (NVDA/JAWS/Narrator/VoiceOver). Added more keyboard support to provide customers with a friendlier control experience. Enhanced the contrast display of certain controls under both default OS themes and high-contrast OS themes.
  • [CellMaker] (WJM-35770)
  • [ToolTip] (WJM-35788)
  • [Menu] (WJM-35783)
  • [ColorPicker][InputColor] (WJM-35787)
  • [InputTime] (WJM-35782)
  • [InputDateTime] (WJM-35780)
  • [InputDateRange] (WJM-35779)
  • [InputMask] (WJM-35781)
  • [MultiSelect] (WJM-35784)
  • [MultiSelectListBox] (WJM-35785)
  • [MultiSelectAutoComplete] (WJM-35786)
• [FlexGrid] Enhanced the refreshRange method, allowing users to choose to refresh specific areas of the grid, such as cell ranges or row/column header areas. (WJM-36658)
• [FlexGrid] Added an event gettingCellClipString that allows customers to perform data processing operations on each cell's value when calling getClipString or using the Ctrl+C shortcut to retrieve the clip string of a specified range. This is useful in preventing CSV injection and similar user scenarios. (WJM-36052)
• [FlexGridFilter] Added the MultiFilter feature, which allows both the Condition and Value filters to take effect simultaneously. It can be enabled via defaultFilterMode or filterMode. (WJM-36654)
• [FlexGridSearch] Added an exact matching feature, which can be enabled via exactMatch. (WJM-36637)
• [UndoStack] Exposed some built-in actions, such as GridEditAction, to facilitate better customization of the application's undo/redo behavior for the customer. (WJM-21235)
• [Framework] Support Angular 20 (WJM-36354)
• [Framework] Support Nuxt.js 4 (WJM-36399)

Please Migrate npm References to @mescius Scope

As a reminder, our new releases have now been 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, this is 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 leverage the features of the latest release? Download Wijmo Today!