We have addressed the needs of those who are building apps that display/render real-time data. With this release, you can integrate DevExtreme controls with your SignalR server (or any other notification service).
The new 'push' method is now available within a 'Store' instance.
notificationHub.on('message', msg => {
store.push([{ type: msg.type, data: msg.data }]);
});
New DataSource options include:
With this release, our Data Grid and Tree List reflect changes to real-time data much faster. To address the most popular usage scenarios, we have extended the Grid's and TreeList's API in the following manner:
We've introduced a new API to control DataGrid and TreeList focused row operations. This feature is useful when you need to display Master-Detail relationships, navigate through records and view details in a side-by-side view.
You can also use mouse or keyboard to navigate through rows. Our new API allows you to implement custom keyboard navigation through individual cells.
We've extended the capabilities of our Excel data export engine so you can control the appearance of exported data more effectively (font, background color, etc.).
This release includes new command column customization options for our DataGrid and TreeList controls. These include:
The new Sankey component will help you visualize data as flows or relationships between different parts of systems. This widget supports the following features:
We've added support for real-time data updates within a Chart without a full chart redraw. When a new point arrives, you can use one of the following behaviors:
We've also included uninterrupted navigation during data updates (you can zoom, scroll and explore a chart while it is updated in the background). You can also jump to your new data and view it in real-time.
We have refined our JavaScript Charting library to support the following:
You can now group Scheduler appointments first by date and then by resources.
This release introduces a new rich WYSIWYG text editor. This UI widget allows you to change text styles, create lists and add hyperlinks and images. Both HTML and Markdown target markup formats are available.
Our DateBox widget allows you to specify a date mask and control user input as needed.
This release includes a new Drawer component for building responsive application layouts. It can be used to implement collapsible navigation, information, and tool panels. With a wide range of configuration options, you can specify Drawer position, reveal animation, open/close behavior and more.
The new ButtonGroup component consists of a set of toggle buttons. Both single and multi-select modes are available.
This release includes the following client-side file validation options for our File Uploader widget:
The new chunkSize option allows you to upload large files in "chunks."
You can now limit Filter Builder group nesting and specify available operations.
{
...
maxGroupLevel: 0, // disable group nesting
groupOperations: [ "and", "or", "notAnd", "notOr" ] // specify available operations
}
Our List, Accordion and TabPanel components now support partial UI updates. Use the new 'repaintChangesOnly' option to enable this feature.
You can now customize button and editor appearance as business needs dictate. Buttons ship with the following styling modes: "Contained", "Outlined" and "Text". Editor styling modes include: "Outlined", "Filled" and "Underlined". New styles are available for both Material and Generic themes.
You can now create and use multiple DevExtreme color schemes within the same application. For instance, you can implement a dark navigation sidebar with a light content area. This feature is available in the both ThemeBuilder UI and CLI tools.
The new ThemeBuilder CLI allows you to generate custom DevExtreme color schemes and save them as a CSS file without using our ThemeBuilder UI.
You can also use the DevExtreme theme variables within your app to deliver a more consistent UI. Use the ThemeBuilder CLI to export any theme variable as LESS or SASS file.
The new ThemeBuilder UI ships with a more intuitive UX and supports new theming capabilities such as Color Swatches.
A set of new 5 dark Material Design themes are available in v18.2. You can use them 'as is' or inherit a custom dark Material Design theme.
We have upgraded the Twitter Bootstrap version in our MS Visual Studio Project templates. You can now utilize all the advantages of the Bootstrap 4 CSS Framework.
Our new Application Layout template is integrated with our new DevExtreme CLI tools.
v18.2 introduces our new CLI tools. You can now bootstrap Angular CLI based applications that are tightly integrated with DevExtreme. DevExtreme CLI utilizes our new Application Layout template and build-time theming capabilities. You can also add Angular views with DevExtreme components into your existing applications.
With this release, you can scaffold Angular views into your Visual Studio Angular project. These views are built upon DevExtreme Angular components and bound to your ASP.Net Core CRUD API endpoints.
Our Vue Wrappers have been released to manufacturing and ship with the following enhancements:
Data binding capabilities include:
We've also added new demos to our Widgets Gallery. All new DevExtreme widgets introduced in this release cycle are also available for Vue.
v18.2 marks the official release of our React Wrappers. This update includes the following new features:
This release includes the first iteration of our native React Scheduler/Calendar control. The following features are now available:
Our DevExtreme React Chart widget was first introduced in May 2018 as a community technology preview. This update introduces the following new features:
Stacked Series
Non-Linear Axes Types
Now you can specify logarithmic, exponential or custom axes types.
Color Palette Management
You can now specify a chart's color palette. You can use palettes from the open source D3 library or create your own.
Animations
We have enhanced our React Chart component with animations.
You can now anchor columns to the left or rightmost edge of the Grid. These fixed columns are never scrolled horizontally and as such, allow you to create solutions that offer improved readability and visual clarity.
The React Grid component can now calculate a summary for all rows (total summary), row groups (group summary), and tree nodes that contain child nodes (tree summary).