DevExtreme Team Blog

DevExtreme — June 2026 Roadmap (v26.1 - Angular, React, Vue, jQuery & ASP.NET Core)

Svetlana Troitskaya (DevExpress) — Wed, 25 Feb 2026 00:38:00 Z

In this blog post, we'll review the major features we expect to ship in our mid-year release (v26.1 - June 2026). These features apply to both DevExtreme JavaScript components (Angular, React, Vue, jQuery) and DevExtreme-based ASP.NET MVC/Core controls. To help us fine tune our release plans, please respond to the survey questions embedded within this post to share feedback. Alternatively, submit a support ticket via the DevExpress Support Center. We will be happy to follow up.

The information contained within this Roadmap details our current/projected development plans. Please note that this information is being shared for INFORMATIONAL PURPOSES ONLY and does not represent a binding commitment on the part of Developer Express Inc. This roadmap and the features/products listed within it are subject to change. You should not rely on or use this information to help make a purchase decision about Developer Express Inc products.

Roadmap Updates

This roadmap will be regularly updated to reflect development progress. As we get closer to the release, we expect to add more items and modify the status of planned features. Look for the following labels next to each feature:

Planned - Feature is scheduled but not yet in development.
In Development - Under active development.
Released in Beta v26.1 - Will be available in our v26.1 beta release.
Released in v26.1 - Fully implemented and available in v26.1.

DataGrid & TreeList — AI Assistant

All Platforms
Planned

With our v26.1 release, we will extend the AI-powered capabilities of both the DevExtreme DataGrid and TreeList. We plan to introduce a DevExtreme Chat-based AI assistant that will allow you to use natural language to interact with DataGrid/TreeList. The DataGrid/TreeList AI assistant will be able to complete the following actions:

Sort, filter, search, and group data.
Resize, reorder, fix/unfix, and show/hide columns.
Change pagination settings.

In our last release (v25.2), we introduced a standalone Speech To Text component. By incorporating this component into our Chat component (planned for 26.1), you will be able to add Speech to Text to your next DevExtreme-powered AI Assistant as well. This will eliminate the need for manual configuration and improve accessibility when working with DataGrid/TreeList (by offering an additional interface when interacting with UI elements).

This feature is particularly well suited for the following usage scenarios:

Large Datasets: Use the power of AI to browse large data sets. Apply complex filter values with natural language.
Complex Grid Configurations: Allow users to specify complex display preferences quickly.
Accessibility-first Applications: Allow users to interact with your application in a manner that is most appropriate for each specific situation: while at their desk, or on the go (when their hands are busy and they require voice commands to interact with your app).
Replicable Configurations: Apply the same prompt to recreate complex grid configurations across sessions. Reduce time spent on tedious layout adjustments.

DataGrid & TreeList — Persistent Validation Messages in Editors

All Platforms
Planned

We expect to introduce new APIs that will allow validation messages to remain visible even when data editors lose focus (similar to the validationMessageMode='always' in components such as our TextBox). These APIs will apply to all available editing modes.

Chat Enhancements

Speech To Text

All Platforms
In Development

We expect to integrate our new SpeechToText component into our Chat component's input area for faster, hands-free communication.

Message Streaming

All Platforms
In Development

We expect to add support for message streaming within DevExtreme Chat. The Chat component will be able display responses progressively as data arrives rather than after the request is fully completed. This feature will improve perceived performance and the overall user experience for DevExtreme-powered AI assistants, chatbots, and long-running operations, making conversations feel more dynamic and responsive.

Tool Call Visualization

All Platforms
Planned

We will introduce the ability to display AI tool/function calls in the message body. Such tools/functions can be declared locally within the app or available via MCP servers.

This visualization will increase clarity and transparency. Chat users will be able to see which tools were used, their order, and parameters alongside AI response.

Scheduler Enhancements

Appointment Snap Modes

All Platforms
In Development

DevExtreme Scheduler will include a new appointment snap mechanism. The following modes will be available:

always - an appointment always stretches to cell borders.
auto - an appointment is stretched to cell border only if the distance from the cell border to the edge of an appointment is less than half of the cell width.
never - appointments are proportional to their duration.

Handle Appointment Time Overlapping

All Platforms
In Development

Managing appointment overlapping will be easier with our next release. We will add public APIs to obtain an array of appointments for a specific range. You will be able to implement the following scenarios using these APIs:

Prevent Time Conflicts: Notify users about a scheduling conflict. Restrict adding, editing, or moving appointments if the selected time slot is already occupied.
Suggest Available Time Slots: Automatically suggest the nearest available time when a selected slot is unavailable.
Handle Recurring Appointment Conflicts: Detect and manage conflicts for individual occurrences within recurring appointments.
Execute Overlap Rules: Apply different overlap rules depending on the appointment category.
Enforce Buffer Time Between Appointments: Require a configurable gap before and after appointments to avoid tight scheduling.

Hide Specific Days

All Platforms
In Development

You will be able to hide specific days in week and month views, for example, weekends or custom day sets.

UI/UX and API Enhancements

TreeView — Prevent Selection for Disabled Nodes

All Platforms
In Development

With v26.1, you will be able to prevent recursive selection state changes for disabled TreeView nodes.

We will also add the ability to expand/collapse disabled parent nodes.

Application-Wide Date Formats

All Platforms
In Development

We will introduce new APIs designed to specify a single date format for all DevExtreme components within your application.

Globalization — Separate Text and Date/Number Locales

All Platforms
Planned

In v26.1, you will be able to specify different locales for application text values and dates/numbers. You will be able to change languages without affecting date/number formatting and vice-versa.

Accessibility

All Platforms
In Development

We expect to improve accessibility for the following DevExtreme UI components:

DataGrid/TreeList

Scheduler

Form

Popup / Popover / Tooltip

RadioGroup

We will also improve color schema in our Material themes to comply with accessibility contrast requirements.

Additionally, in v26.1, we expect to introduce screen reader support for Rich Text Editor for ASP.NET Core.

Our long-term goal is to address all limitations identified in our DevExtreme Accessibility Conformance Reports (ACRs).

Migration Away from CommonJS

All Platforms
Planned

As part of our ongoing modernization efforts, we will eliminate use of CommonJS. We plan to remove all CommonJS modules and imports in DevExtreme packages and source code. This change will optimize DevExtreme package size.

Please share your thoughts on this transition in the survey below. Your feedback will help us identify potential migration challenges and make the transition as smooth as possible.

Angular 22

Angular
Planned

The release of Angular 22 is planned for May 2026. As part of our commitment to same-day support for new versions, DevExtreme v26.1 will offer full compatibility once Angular 22 is available.

According to Angular's official support schedule, Angular 19 will reach end-of-support in May 2026. With v26.1, we will also update our minimum supported Angular version to 20.

ASP.NET Core

UI Template Kit Update

ASP.NET Core
In Development

DevExpress UI Template Kit includes application templates for ASP.NET Core. The templates help you start new projects quickly (templates address predefined application usage scenarios, which you can tailor to meet specific business requirements).

In our upcoming v26.1 release, ASP.NET Core application templates will be more flexible, with a built-in navigation area and a set of pre-configured views (with controls such as DataGrid).

Your Feedback Matters

DevExtreme — Year-End Roadmap v25.2 (React, Angular, Vue, jQuery & ASP.NET Core)

Elena Dikareva (DevExpress) — Thu, 14 Aug 2025 04:00:00 Z

UPDATE: What's New in DevExtreme v25.2

In this blog post, I’ll review major features we expect to ship in our year end release (v25.2 - December 2025). These features apply to both DevExtreme JavaScript/TypeScript (React, Angular, Vue, jQuery) and DevExtreme-based ASP.NET Core/ASP.NET MVC5 Controls. To share feedback, please respond to the survey questions embedded within this post or submit a support ticket via the DevExpress Support Center. We will be happy to follow up.

The information contained within this blog post details our current/projected development plans. Please note that this information is being shared for INFORMATIONAL PURPOSES ONLY and does not represent a binding commitment on the part of Developer Express Inc. This roadmap and the features/products listed within it are subject to change. You should not rely on or use this information to help make a purchase decision about Developer Express Inc products.

Live Roadmap Updates

Planned — Feature is scheduled but not yet in development.
In Development — Under active development.
Released in Beta v25.2 — Will be available in our v25.2 beta release.
Coming in v25.2 — Will be included in the final v25.2 release.
Released in v25.2 — Fully implemented and available in v25.2.

AI-Powered Extensions

New SpeechToText Component

All Platforms
Released in v25.2

Our next major update (v25.2) will include a new SpeechToText component. This component will convert speech to text in real-time using Web Speech APIs.

SpeechToText will enhance accessibility of DevExtreme-powered applications, improve user-efficiency, and support new interaction scenarios (such as hands-free voice input). You will be able to use it for:

Chats or any prompt-based interface
Search components
Populating app forms

SpeechToText will support multiple languages and listening states. You will also be able to customize the component button (icon, text, and styling mode).

DataGrid/TreeList – AI Column

All Platforms
Released in v25.2

With v25.2, DevExtreme DataGrid and TreeList will be able to display AI-generated columns. DataGrid/TreeList will populate the AI column with auto-generated data based on component data and a custom prompt.

Potential usage scenarios include:

Data Enrichment. Add missing contextual information without modifying the underlying dataset.
Categorization/Tagging. Assign categories or tags based on row information.
Prediction & Estimation. Generate estimated delivery times, sale insights, or performance ratings (based on AI model).

Form – AI Smart Paste

All Platforms
Released in v25.2

We will integrate AI-powered Smart Paste to DevExtreme Form and enhance traditional copy-paste workflows. When a user copies unstructured text (from spreadsheets, documents, emails, web pages, etc.) and activates Smart Paste, AI will analyze clipboard content and populate each form field with relevant data.

Chat-Related Enhancements

File Attachments

All Platforms
Released in v25.2

With v25.2, users will be able to attach files when sending messages through DevExtreme Chat. This feature will be of value for solutions that incorporate support conversations, team collaboration, and peer-to-peer communications.

Speech to Text

All Platforms
Posponed to v26.1

We plan to integrate our new SpeechToText component into Chat for faster, hands-free communication.

Empty View Template

All Platforms
Released in v25.2

With v25.2, you will be able to customize the Chat's empty view using our template engine.

Usage scenarios include:

Onboarding & First-Time User Guidance. Display messages or tips to help new users start a conversation. You can also include UI elements that suggest prompts.
Preliminary Information. Display important information before a conversation begins, such as usage instructions or data processing disclaimers.
Context-Aware Messaging. Display dynamic content based on user context (for example, “Ask me anything about your current order”) for a more personalized experience.
Branded Experience. Add brand visuals, mascots, or tone to engage users.

DataGrid/TreeList – TagBox Columns

All Platforms
Postponed

In v25.2, we will add a built-in TagBox column to both the DevExtreme DataGrid and TreeList components. These columns allow users to select multiple values when editing cell content or specify multiple search criteria within the Filter Row.

This feature enhances usability when working with multiple categories/related entities (such as tags, status info, or addresses).

Scheduler – Appointment Form Redesign

All Platforms
Released in v25.2

In v25.2, we will redesign the Scheduler appointment edit form based on modern UI/UX standards.

The updated form will be fully responsive (across desktops, tablets, and mobile devices). We will also improve accessibility to align with current compliance standards.

UI/UX and API Enhancements

Collection Components – Performance Optimizations

All Platforms
Released in v25.2

Accordion, Tabs, TabPanel, and List components re-render all items after each reordering operation. With v25.2, if repaintChangesOnly is enabled, re-rendering will be limited to affected items.

This change will increase rendering speed and reduce DOM updates, especially in large collections.

Drop-Down Editors – fieldTemplate Redesign

All Platforms
Released in v25.2

For SelectBox, TagBox, ColorBox, and DropDownBox, we expect to replace fieldTemplate with two new template options: before and after. These options will allow you to insert custom markup before/after the input field without recreating input logic (no need to define full TextBox component configuration). The fieldTemplate option will be deprecated.

LoadIndicator – New Animation Type

All Platforms
Released in v25.2

With our next release, the LoadIndicator component will support sparkle animation. The new animationType option will allow you to switch between circle and sparkle animation.

Calendar – Today Button Text

All Platforms
Released in v25.2

You will be able to specify custom text for the Today button.

TabPanel – New keyExpr Property

All Platforms
Released in v25.2

We will introduce a keyExpr property for the TabPanel component to simplify access to data items.

Font Stack Update

All Platforms
Released in v25.2

DevExtreme default font stack will be updated to better align with the native typography of modern operating systems.

With v25.2, DevExtreme-powered applications will automatically use system fonts as follows:

SE Pro on macOS
Roboto on Android
Ubuntu on Linux
Segoe UI on Windows

This change ensures consistent appearance across platforms, enhances text rendering, and improves performance.

Accessibility

All Platforms
Released in v25.2

We expect to improve accessibility for the following DevExtreme UI components:

Our long-term goal is to address all limitations identified in our DevExtreme Accessibility Conformance Reports (ACRs).

Long-Term Initiatives

Our roadmap lists key features planned for v25.2. Some ongoing initiatives will require more than one release to complete, as we undertake major architectural modifications and extended testing.

We will share progress on our long-term efforts throughout our v25.2 release cycle.

Notable initiatives include:

DevExpress MCP Server for AI-Powered Documentation Access

All Platforms
Available in Preview

We will introduce an MCP server that connects GitHub Copilot, Cursor, and other AI tools directly to our online help system. The server will provide instant access to over 300,000 help topics via natural language queries within your IDE. This will allow you and AI coding agents (such as Claude Code) to access up-to-date DevExpress documentation directly within the AI assistant's context.

AI-Powered Migration

React Angular Vue jQuery
In Development

To simplify version upgrades, we will introduce an MCP service that will list changes in each release and update applications accordingly.

We will begin implementing MCP in v25.2. Once ready, it will help you with the following tasks:

Resolve breaking changes
Transition to new APIs
Remove deprecated APIs
Apply strict type checking from new types
Identify and address emerging issues

Design System and Figma UI Kit

All Platforms
Planned

We are developing a unified design system (a common set of CSS variables for all components) to ensure visual consistency for all DevExpress products and platforms.

In this release cycle (v25.2), we will integrate the design system into DevExtreme. The system will introduce style management/customization flexibility.

We plan to implement a new Fluent 2.0 theme, based on design tokens and unified CSS variables. All current DevExtreme themes will remain the same (no breaking changes). We expect to introduce additional themes in future release cycles (once design system integration is complete). Needless to say, we will ensure a smooth transition to new themes.

We will also create a Figma-based UI Kit and gradually include all DevExtreme components within it. The first version of the UI Kit will ship in our v25.2 release cycle, followed by updates in later versions.

Angular 21

Angular
Released in v25.2

The release of Angular 21 is planned for November 2025. As part of our commitment to same-day support for new versions, DevExtreme v25.2 will offer full compatibility with Angular 21.

According to Angular’s official support schedule, Angular 18 will reach end-of-support on November 21, 2025. With v25.2, we will also update our minimum supported Angular version to 19.

.NET

.NET 10 Support

ASP.NET Core
Released in v25.2

We have started testing DevExtreme ASP.NET Core controls against .NET 10 previews. We expect to support .NET 10 across our DevExtreme component libraries in v25.2.

ASP.NET Core UI Template Gallery

ASP.NET Core
Available in the GitHub repository

We introduced the UI Template Gallery for DevExtreme in our v22.1 release cycle. In subsequent versions, we expanded the gallery to include templates for React, Angular, and Vue. This gallery showcases common application usage scenarios.

In response to customer requests, v25.2 will include a UI Template Gallery for ASP.NET Core.

ASP.NET Core Source Builder

ASP.NET Core
Released in v25.2

In v24.2, DevExpress Source Builder was introduced as part of the DevExpress Unified Installer. This tool rebuilds source code for .NET Core product libraries.

With v25.2, our Source Builder will support DevExtreme ASP.NET Core.

Web Reporting

ASP.NET and Blazor Subscription DXperience Universal
React Angular Vue ASP.NET Core ASP.NET MVC

Learn more: DevExpress Reports & BI Dashboard — Year-End 2025 Roadmap (v25.2)

Your Feedback Matters

Changes and Future Plans: New Angular Configuration Components

Vlada Skorokhodova (DevExpress) — Mon, 07 Jul 2025 23:41:00 Z

If you've worked with the DevExtreme Angular components in the past, you likely encountered configuration components — those with dxo- and dxi- prefixes. These helper components simplify widget setup, align with Angular architectural principles, and enhance readability. They are especially useful for nested options — for example, configuring paging options for dx-data-grid using the dxo-pager component.

<dx-data-grid  [dataSource]="dataSource"> 
    <dxo-pager 
        [visible]="true" 
        [showPageSizeSelector]="true" > 
    </dxo-pager> 
</ dx-data-grid>

They are also useful for setting up collection elements, such as defining toolbar items in dx-toolbar using its child components like dxi-item.

<dx-toolbar> 
    <dxi-item location="before" widget="dxButton" > 
    </dxi-item> 
</dx-toolbar>

Let's take a closer look at how the legacy Angular configuration components work, focusing on dxi-item as an example. This component is "universal". It is used not just within dx-toolbar, but also in many other DevExtreme components (such as Form and List).

While this approach offers consistency (the same component can be used in multiple places), it does have drawbacks. dxi-item requires entirely different sets of options depending on the parent component, complicating precise typing.

The following screenshot illustrates how an IDE presents the same general property list for dxi-item in two different contexts. For instance, the expected properties for a form’s group item differs significantly from those used in a Gantt chart’s context menu item.

One of our main priorities is delivering full and robust TypeScript support. We're committed to ensuring that all DevExtreme components are strictly typed and follow modern TypeScript practices. This approach improves code completion in IDEs, allows early error detection, and increases confidence during refactoring.

As you might expect, enforcing strict typing in configuration components has proven to be a complex challenge. Adjusting typings for existing dxo- and dxi- components can affect many projects, potentially requiring significant changes after an upgrade to a new version of DevExtreme. Furthermore, the generic nature of our current configuration architecture makes it difficult to achieve the desired level of type precision.

New Configuration Components: What's Changed and Why It Matters

With DevExtreme v24.2, we introduced a new set of configuration components (built from the ground up). New components are strictly typed, can be seamlessly integrated into Angular applications, and were designed to improve the overall developer experience.

Each UI component ships with its own dedicated set of configuration components. This marks a major step forward in predictability and type safety. Here's what's changed and how it benefits you:

Clearer and More Context-Aware Configuration Components

Configuration component names now include their parent component's name. This improves code readability, prevents naming collisions, and makes templates more self-explanatory.

For example, dxi-item is now:

dxi-toolbar-item in dx-toolbar
dxi-form-item in dx-form
dxi-context-menu-item in dx-context-menu

This naming convention helps IDEs recognize component context and gives developers a clearer view of the structure, making complex configurations easier to navigate and maintain.

Strict Typing and a Better Developer Experience

New configuration components now include only the properties that are relevant to their specific parent component. This eliminates instances wherein the IDE suggests a long, generic list of unrelated options. For example, dxi-data-grid-column reveals only properties applicable to DataGrid columns. As a result, IDE suggestions are now far more accurate and useful:

Most new configuration properties are strictly typed, and others will be typed in the future. This means that any misuse of a component's API will be caught during compilation (long before it can cause issues at runtime).

What's Next: Full adoption of the new configuration components

New configuration components have significant advantages over the old architecture: they are robust, modern, error-resistant, and better aligned with TypeScript's type system. We are planning a phased transition of our entire DevExtreme Angular ecosystem to this new configuration model. To ensure a smooth and predictable migration for users, please consider the following timeline/key milestones:

DevExtreme v25.1 Release

We will start updating all demo examples and help topics to use our new model.
We officially recommend that all new Angular applications adopt our new configuration model from the start.
All features introduced in the v25.1 release require new configuration components.

DevExtreme v25.2 Release

Using legacy configuration components will trigger deprecation warnings, indicating that these components are obsolete.
The legacy configuration system will no longer be updated with new features. As a result, any new functionality introduced in 25.2 and future releases will require the use of new configuration components.
We will provide documentation, migration guidelines, and helper tools to make the transition to our new architecture as smooth as possible.

DevExtreme v26.1 Release

We will continue to support those users migrating to our new configuration components. Our goal is to ensure that everyone has the resources and guidance needed to complete the transition smoothly.

DevExtreme v26.2 Release

All legacy configuration components will be removed from our codebase.

Again, our goal is to make the transition as clear, manageable, and secure as possible. We will provide plenty of time, tools, and guidance to support this change.

We believe that strict typing is not just a trend — it's essential for scalable, predictable, and safe development. As always, we welcome your thoughts, comments, and suggestions:

DevExtreme JS & ASP.NET Core — Early Access Preview (v25.1)

Vlada Skorokhodova (DevExpress) — Mon, 21 Apr 2025 06:32:00 Z

UPDATE: What's New in DevExtreme v25.1

Our next major release (v25.1) is just a couple of months away. Here's a look at new features/capabilities included in our Early Access Preview (EAP) build (the EAP is available to active DevExpress Universal or DXperience subscribers). As always, if you discover issues with our EAP build, please submit a support ticket at the DevExpress Support Center or use the embedded survey to submit direct feedback.

Installation

If you own an active Universal or DXperience subscription, you can download our EAP build via the DevExpress DownloadManager or appropriate NuGet packages.

To begin using the DevExtreme v25.1 EAP build, simply install target framework related NPM packages (marked with the 25.1-next tag). Use one of the following commands to proceed:

npm install devextreme@25.1-next --save-exact 

npm install devextreme-angular@25.1-next --save-exact // Angular installation

npm install devextreme-react@25.1-next --save-exact // React installation

npm install devextreme-vue@25.1-next --save-exact // Vue installation

Early Access and CTP builds are provided solely for early testing purposes and are not ready for production use. This build can be installed side by side with other major versions of DevExpress products. Please backup your project and other important data before installing Early Access and CTP builds.

Early Access Preview build is considered pre-release software, and you will see a W0022 error in your browser console.

This EAP may not include all features/products we expect to ship in our v25.1 release cycle. As its name implies, the EAP offers an early preview of what we expect to ship in two months.

New Stepper Component

All Frameworks

Our Early Access Preview includes a new Stepper UI component. DevExtreme Stepper displays progress as users move through a sequence. It's ideal for multi-step processes, such as populating forms, onboarding, or app wizards.

DevExtreme Stepper supports the following capabilities/options:

DataSource integration
Horizontal or vertical layout
Navigation modes (step through sequentially or skip)
Pre-selected steps
Custom icons or text for step indicators
Step titles
Visual step validation
Optional and disabled steps
Keyboard navigation
Internationalization (right-to-left)

You can specify whether Stepper is horizontal or vertical using the orientation property. Change navigation mode to linear or non-linear using the linear property. Preselect an item by index using the selectedIndex option. The selectOnFocus option determines if items are selected automatically when focused via the keyboard.

You can customize each step using the following settings:

icon: sets an icon inside the step indicator.
text: incorporates text within the step indicator.
title: places a caption next to the step.
isValid: visually indicates validation state.
optional: visually marks as optional.
disabled: disables the step.
hint: adds an in-browser hint.

Example: jQuery.

If using Angular to evaluate/test our EAP, we recommend the use of our new configuration components:

<dx-stepper> 
    <dxi-stepper-item text="1"></dxi-stepper-item> 
    <dxi-stepper-item text="2" [optional]="true" ></dxi-stepper-item> 
    <dxi-stepper-item icon="gift"></dxi-stepper-item> 
</dx-stepper>

Scheduler – Toolbar Customization

Angular, React, jQuery, Vue

This EAP introduces a customizable toolbar to the DevExtreme Scheduler (available for Angular, React, jQuery, and Vue). This new capability can be used to add custom items like a Today button, a new appointment button, or a custom resource selector to our built-in toolbar.

Specify the toolbar property to include desired items. You can set the location for each item (much like our standalone Toolbar). For DevExtreme components, specify associatedoptions. To introduce unique elements, use a custom template.

$('#scheduler').dxScheduler({ 
    // ... 
    toolbar: { 
        items: [ 
            // DevExtreme components: dxButton 
            { 
                location: 'before', 
                locateInMenu: 'auto', 
                widget: 'dxButton', 
                options: { 
                    text: 'Today', 
                    stylingMode: 'outlined', 
                    type: 'normal', 
                    onClick() { 
                        scheduler.option('currentDate', new Date()); 
                    }, 
                }, 
            }, 
            // Predefined toolbar's elements 
            'dateNavigator', 
            // Custom element 
            { 
                template: '<div>Custom Item</div>', 
            }, 
        ] 
    } 
});

Predefined items include "dateNavigator" and "viewSwitcher". If you do not specify the toolbar explicitly, the default toolbar with these two items is displayed on-screen.

You can also switch button order used in the “dateNavigator” and decide which buttons to display on-screen.

toolbar: { 
    items: [ 
        { 
           location: 'before', 
           name: 'dateNavigator',   
           options: { 
               items: ['dateInterval', 'prev', 'next'],   
           }, 
        }, 
    ] 
}

The example below also demonstrates use of DevExtreme Button (switch to Today) and SelectBox (choose resources) in the toolbar.

Example: jQuery.

If using Angular to test our EAP, you must use our new configuration components when working with toolbar items:

<dxo-scheduler-toolbar> 
    <dxi-scheduler-toolbar-item  
        name="dateNavigator"  
        location="before"  
        [options]="{items: ['dateInterval', 'prev', 'next']}"> 
    </dxi-scheduler-toolbar-item> 
</dxo-scheduler-toolbar>

Map – Custom Route Modes

All Frameworks

With this EAP, DevExtreme Map allows you to set custom route options for various transportation types.

Azure map 'car' route mode:

Azure map 'truck' route mode:

Note that each Map provider (Azure, Google, Bing) has its own set of route modes. Pass a string with the desired route name to the routes[].mode property to test this feature. For instance, you can switch default 'car' route type in Azure maps to a custom route mode like 'bicycle' or 'truck'.

Create React Applications with Vite

React

Previously, DevExtreme CLI used create-react-app (CRA) as a build tool for React applications. In February 2025, CRA was deprecated. With this EAP, we switched from CRA to Vite when creating DevExtreme React applications.

When creating a new app, DevExtreme CLI now allows you to choose between JS transpilers: Babel (used previously as the default) and SWC. To test this capability, select transpiler type in a terminal:

Or you can add a --transpiler=swc or --transpiler=babel argument to the first command:

npx devextreme-cli@1.11.0-alpha.0 new react-app app-name --transpiler=swc 

or 

npx devextreme-cli@1.11.0-alpha.0 new react-app app-name --transpiler=babel

After creating a project, run the following commands:

cd app-name  
npm run dev

In addition to Vite, we plan to add an option for Next.js build in our official v25.1 release.

DevExtreme – Create Flexible Layouts with the DevExtreme Splitter Component

Vlada Skorokhodova (DevExpress) — Mon, 10 Mar 2025 00:10:00 Z

When building an app, static layouts may not be enough. By using a "splitter" component, you can convert static page layouts to one that adapts to the needs of each individual user.

As you'll soon see, the DevExtreme Splitter UI component was designed to split a page layout into multiple resizable panes (page sections).

In this blog post, I'll explore a simple yet highly popular layout-related use case: resizing layout "sections" to display more business data (and of course, I'll be using the DevExtreme Splitter to do so). Below is the final page layout. Click the gif to see it in full screen:

Select one of the following supported dev frameworks to test the example:

Angular | React | Vue | jQuery

Implementation Details

The DevExtreme Splitter divides a layout into panes. These panes can be configured with the following basic settings:

Option	Description	Default value
resizable	Users can modify pane size.	`true`
collapsible	Users can collapse the pane.	`false`
size	Initial pane size.	`undefined`
minSize	Minimum pane size.	`undefined`
maxSize	Maximum pane size.	`undefined`
collapsedSize	Pane size when collapsed.	`undefined`

DevExtreme UI components rely on Item declarations for nested configurations (including panes). To include a component in a Splitter pane, you’ll need to create a separate template or use the following method (declare directly using Item markup).

<Splitter onResize={onResize} id="splitter" height="auto"> 
    <Item minSize={250}> 
        <DataGridComponent ref={grid} /> 
    </Item> 
    <Item minSize={250} size="55%"> 
        <ChartComponent /> 
    </Item> 
</Splitter>

This example adds the DevExtreme DataGrid and Chart components to the pane.

In this particular instance, users can view hidden DataGrid columns by expanding the Splitter's leftmost pane. For DataGrid adaptive mode, enable the columnHidingEnabled option. Call the updateDimensions method within the onResize function to adapt container size changes (for additional information in this regard, please refer to our Adaptability help topic).

const onResize = useCallback(() => { 
    cancelAnimationFrame(animationRefFrame.current); 
    animationRefFrame.current = requestAnimationFrame(() => 
        grid.current.instance().updateDimensions() 
    ); 
}, [grid]);

Customize Splitter Appearance

Once you set up a pane layout, our Splitter displays separator bars between panes. You can customize this visual element to match relevant design requirements.

For instance, you can modify separator bar width in pixels. You can also modify component appearance with custom CSS rules.

For this sample, we used custom CSS to modify both the Splitter and its panes:

// modifies the Splitter separator bar: 
.dx-resize-handle { 
    border-radius: 50px; 
} 

// rounds the corners of the pane content: 
.dx-datagrid-headers.dx-datagrid-nowrap.dx-bordered-top-view { 
     border-radius: 8px 8px 0 0 !important; 
} 
.dx-gridbase-container > .dx-bordered-bottom-view { 
     border-radius: 0 0 8px 8px !important; 
}

As the following image illustrates, you can personalize the Splitter separator as requirements dictate (through settings, CSS styles, etc).

UI Templates for Additional Layout Strategies

This sample layout was inspired by the DevExtreme UI Template Gallery. Our UI Template Gallery (for Angular, React, and Vue) includes app templates for a variety of page layouts/usage scenarios including the following:

Planning

Dashboards

Authentication forms

User profiles

Whether you're building a customer management system, a project planning tool, or user authentication flows, UI templates provide a solid foundation that you can easily modify to address specific business requirements.

Your Feedback Counts

Please take a moment and share your thoughts/requirements with us.

DevExtreme — June 2025 Roadmap (v25.1 - Angular, React, Vue, jQuery & ASP.NET Core)

Vlada Skorokhodova (DevExpress) — Fri, 21 Feb 2025 03:10:00 Z

UPDATE: What's New in DevExtreme v25.1

In this blog post, I’ll describe DevExtreme-related features/capabilities we expect to ship in our upcoming mid-year release (v25.1). Should you have any questions about the new products we expect to ship in June or if you’d like to discuss enhancements planned for v25.1, please submit a support ticket via the DevExpress Support Center. We’ll be happy to follow up.

New Components

CardView

In our next major update (v25.1, set for release in June 2025), we expect to ship our new CardView UI component. As you can see in the following image, you can use the DevExtreme CardView to display business data using a "card" UI metaphor (a visually engaging alternative to traditional grid views).

The DevExtreme CardView will ship with the following built-in data management capabilities:

Sorting
Paging
Column reordering
Column visibility control
Editing
Filtering
Searching
Data selection

Each card within the CardView will be fully customizable, with UI elements such as toolbars, covers, and footers (allowing you to adapt layouts as requirements dictate).

CardView card layouts will be fully responsive, will support multiple screen sizes, and will ship with two layout options:

Automatic Layout: The CardView will determine the optimal number of cards per row and associated size. When resized, the CardView will dynamically modify its layout, recalculating the number of cards per row and their dimensions.
Fixed Number of Cards per Row: You will be able to specify the exact number of cards displayed within a layout. When resized, card sizes will change but the number of cards per row will remain the same.

Stepper

v25.1 will also ship with a new Stepper UI component. As you can see in the following image, our Stepper can be used to describe/detail progress as users navigate through a defined sequence. Stepper will work especially well for multi-step processes like filling forms, onboarding flows, or wizards.

You will be able to customize the appearance of individual steps and modify component settings to address specific usage scenarios.

AI-powered Extensions

In our last major update (v24.2, released Dec 2024), we began work on key AI Integrations. As you may know, part of these integrations included the release of the DevExtreme Chat UI component.

In our next release, we will incorporate AI-powered text editing into the DevExtreme HTML Editor. Users will be able to apply actions to selected content (such as proofreading, summarizing, expanding text, etc) and you will be able to add a custom command to execute a specific request to your selected AI service.

Our new AI-powered Extensions will be accessed through a dedicated button in the HTML Editor’s toolbar.

Chat Enhancements

Editing and Deleting Messages

We expect to update our Chat UI component in our next major update and allow users to edit/delete messages once they’ve been sent.

DevExtreme Chat is a client-side component that requires a backend solution. Message editing and delete operations will include relevant UI elements for end users and APIs to modify rendered messages. To edit and remove messages from a data source, you will need to use Push APIs.

Image Rendering

In v24.2, the DevExtreme Chat component shipped with custom message content support, including charts and images. To use this feature, you were required to override the entire message bubble layout using the messageTemplate property.

With v25.1, we will simplify configuration when displaying images within messages.

You will be able to easily render an image received in responses. For example, if you use DALL-E or a similar AI service to generate pictures, you can set up image rendering using our Chat component.

Scheduler – Toolbar Customization

In v25.1, the DevExtreme Scheduler will include a customizable integrated toolbar.

Configuration options will include:

Choosing from predefined elements: Select and arrange built-in elements as needed.
Adding DevExtreme components: Include and configure DevExtreme components like Button or Checkbox in the toolbar.
Inserting custom elements: Define templates for custom elements within toolbar items for a curated experience.

For instance, in the screenshot below, our new toolbar includes two custom buttons: "Today" and "New event".

Map – Custom Route Modes

DevExtreme Map will allow you to define custom route modes for different transportation types. Each Map provider (Azure, Google, Bing) offers unique predefined route modes. You will be able to specify the desired route type as a string, and DevExtreme Map will display it accordingly.

For instance, in addition to a standard 'car' route in Azure maps, you will be able to define custom route modes like 'bicycle' and 'truck'.

Azure map 'car' route mode:

Azure map 'truck' route mode:

Accessibility

We expect to address a range of accessibility issues in both the DevExtreme DataGrid and Scheduler.

DevExtreme CLI

Create a Standalone Angular Application

Angular introduced standalone components in v14. In v19, default components created with Angular CLI are now standalone. To match this trend, we will transition from modules to standalone components in DevExtreme CLI Angular applications.

Create React Applications with Vite and Next.js

As you may already know, the create-react-app (CRA) utility - a key resource for React projects - was recently deprecated. With DevExtreme v25.1, you will be able to select between Vite and Next.js (as alternatives to CRA) when creating a React application using DevExtreme CLI. Whether you need Vite’s speed and simplicity or Next.js’ advanced features and scalability, this update will offer more options to match your project’s requirements.

ASP.NET Core

Rich Text Editor – Zoom

ASP.NET and Blazor Subscription

Our Rich Text Editor's built-in Ribbon will include a UI to specify zoom level for the current document.

It will also be possible to control the current zoom level and its maximum/minimum values using the Rich Text Editor's API.

Your Feedback Matters

DevExtreme React — Gatsby and Next.js

Vlada Skorokhodova (DevExpress) — Thu, 17 Oct 2024 03:43:00 Z

We recently updated the following Gatsby/Next.js-related help topics on our website.

DevExtreme React + Next.js

Next.js allows you to choose between Server-Side Rendering (SSR), Static Site Generation (SSG), and client-side rendering. As such, Next.js is an ideal framework for sites that include both static and dynamic content (such as e-commerce sites or dashboards).

If you are new to DevExtreme or considering it for a future BI/Dashboard project, be sure to check out our intuitive Dashboard UI templates.

Create a DevExtreme-powered website/application with Next.js

DevExtreme React + Gatsby

Gatsby primarily focuses on SSG, performance, and SEO (especially for content-centric websites such as blogs and product promotion/marketing).

If you are building a product promotion/marketing webpage and want to engage customers directly, take a moment to review the capabilities of the new DevExtreme Chat component (set for release in December 2024).

Create a DevExtreme-powered website/application with Gatsby

DevExtreme – Integration with Amazon S3 and Azure Blob Storage (Angular, React, Vue, jQuery)

Vlada Skorokhodova (DevExpress) — Wed, 25 Sep 2024 23:10:00 Z

Cloud services, such as Amazon S3 and Azure Blob Storage, offer object storage solutions for enterprises. Integrating these storage services into a DevExtreme-powered web application simplifies CRUD operations against user files.

We recently released the following integration guides for those considering Amazon S3 or Azure Blob Storage:

Manage Amazon S3 Storage with DevExtreme Components

Manage Azure Blob Storage with DevExtreme Components

Whether you choose Amazon S3 or Azure Blob Storage, these guides outline the steps you must take to integrate storage services into your next great DevExtreme-powered web application.

Manage Amazon S3 Storage with DevExtreme Components

Amazon's Simple Storage Service (S3) is often used to store application and database backups. It can also be used to host websites and media files. Amazon S3 is an excellent solution if your users upload and manage files within your web app.

Our Amazon S3 integration guide includes the following information:

How to use the AWS management console to configure S3 resources.

How to create a back-end .NET application that uses the Amazon SDK to query S3 APIs.

How to configure your client-side application to support multi-part AWS uploads.

How to use the DevExtreme FileManager and FileUploader to communicate with AWS.

Guide: Manage Amazon S3 Storage with DevExtreme Components

GitHub Example: FileManager - Amazon S3 Client-Side Binding

GitHub Example: FileUploader - Direct Upload to Amazon

Manage Azure Blob Storage with DevExtreme Components

Azure Blob Storage is a cloud-based service designed to store unstructured data. A key advantage of Azure Blob Storage is straightforward integration with the broader Microsoft ecosystem. Azure Blob Storage is often used to analyze big data, and like Amazon S3, is a great option for backups and hosting media files.

Our Azure Blob Storage integration guide includes the following information:

How to configure Microsoft Azure (create a new Storage account, blob container, etc.).

How to create a back-end application with basic/required configurations.

How to set up server-side and client-side binding options for the FileManager component

How to use DevExtreme FileUploader.

Guide: Manage Azure Blob Storage with DevExtreme Components

GitHub Example: File Manager - Azure Client-Side Binding

GitHub Example: File Manager - Azure Server-Side Binding

GitHub Example: FileUploader - Direct Upload to Azure

DevExtreme JS & ASP.NET Core — Early Access Preview (v24.2)

Vlada Skorokhodova (DevExpress) — Thu, 19 Sep 2024 00:00:00 Z

UPDATE: What's New in DevExtreme v24.2

Our next major release (v24.2) is a couple of months away. In this post, I'll detail new features included in our Early Access Preview (EAP) build (for active DevExpress Universal or DXperience subscribers). As always, if you encounter issues with our EAP build, feel free to submit a support ticket via the DevExpress Support Center or use the embedded survey to send us feature/product-related feedback.

Installation

If you own an active Universal or DXperience subscription, you can download our EAP build via the DevExpress DownloadManager or appropriate NuGet packages.

To begin using the DevExtreme v24.2 EAP build, simply install target framework related NPM packages (marked with the 24.2-next tag). Use one of the following commands to proceed:

npm install devextreme@24.2-next --save-exact 

npm install devextreme-angular@24.2-next --save-exact // Angular installation

npm install devextreme-react@24.2-next --save-exact // React installation

npm install devextreme-vue@24.2-next --save-exact // Vue installation

Early Access Preview build is considered pre-release software, and you will see a W0022 error in your browser console.

This EAP may not include all features/products we expect to ship in our v24.2 release cycle. As its name implies, the EAP offers an early preview of what we expect to ship in two months.

New Chat Component

All Frameworks

Our Early Access Preview ships with the first iteration of the DevExtreme JavaScript Chat component (allowing you to introduce peer-to-peer/chat-bot support within your DevExtreme-powered web application).

Key features included in the DevExtreme Chat component EAP build include:

Accept and report new messages.
Custom avatar support (initials used by default).
Sends messages using the "Send" button or Enter key.

Note: DevExtreme Chat is a client side library. An independent backend solution will be necessary. For an example of DevExtreme Chat and AI integration, refer to the DevExpress Reporting EAP blog post.

Select one of the following supported dev frameworks to explore the capabilities of the new DevExtreme JavaScript Chat component:

Angular | React | Vue | jQuery

Data Grid/Tree List — Sticky Columns

All Frameworks

The DevExtreme DataGrid and TreeList ship with fixed column support (as you know, fixed columns allow you to pin a column to the right or left side of a table/tree hierarchy).

In this EAP, a new (sticky) value is available for the fixedColumn property. Sticky columns are initially fixed but move with the table once scrolled to a specific position.

Note: This feature is still under development, and some DataGrid/TreeList features (such as resizing, reordering, or data grouping) may not work as expected.

We also redesigned our original “fixed column” engine (we now offer advanced CSS positioning).

Select one of the following supported dev frameworks to explore the capabilities of our new Sticky Columns feature:

DataGrid

Angular | React | Vue | jQuery

TreeList

Angular | React | Vue | jQuery

Tabs/TabPanel/List — onSelectionChanging Event

All Frameworks

DevExtreme Tabs, TabPanel, and List share a common feature: selectable items.

Currently, these components include an onSelectionChanged event that triggers once selections are finalized and the selectedItems option updates. This timing can make it difficult to control selection changes based on user interaction.

This EAP includes a new onSelectionChanging event for the aforementioned component libraries. The event helps track selection changes more effectively (for example, you can now prevent selection) and includes a cancel property, which can be Boolean or a JS Promise.

A common usage scenario is asynchronous validation for The Form component within an open tab. When attempting to switch to a different tab (and depending on validation results), our customers wanted the ability to either prevent tab switching or allow it. With our new onSelectionChanging event and an API that supports promises, this scenario can be implemented quite easily.

Select one of the following supported dev frameworks to explore the capabilities of the new onSelectionChanging event feature:

Angular | React | Vue | jQuery

DataSource — Case Sensitive Filtering

All Frameworks

DataSource can sort and filter data by locale, including special characters such symbols with diacritics (by using langParams options).

In this EAP, we added case sensitivity within langParams options. As you can see in the image below, you can now introduce case-aware filtering within DevExtreme UI components like our DataGrid.

This EAP also refines filtering for various locales (the filter is now more precise).

Select one of the following supported dev frameworks to explore the capabilities of our new Case Sensitive Filtering feature:

Angular | React | Vue | jQuery

Angular — New Configuration Components

Angular

This EAP includes new devextreme-angular configuration components.

As you may know, DevExtreme Splitter uses a generic dxi-item configuration component. This same dxi-item appears in components such as Form and TabPanel (causing potential confusion, especially with IntelliSense).

Our new components are specific to each parent. For instance, Splitter now also uses dxi-splitter-item, which only includes properties relevant to Splitter.

Similarly, other DevExtreme components use new configuration components that include parent name.

Note: You can either use new components or the previous, but not both.

Angular — Service for Popup Open Operations

Angular

In previous builds, you had to use a template to specify Popup content. This EAP introduces a new approach for this specific requirement. Use DxPopupService and its open method as necessary (this method takes a content component and a Popup configuration object).

import { DxPopupService } from “devextreme-angular/ui/popup”; 
// ... 
constructor(private popupService: DxPopupService) 
// ... 
popupService.open(ContentComponent, { showCloseButton: true })

The open method returns both Popup and contentComponent instances. In the following example, these instances are used to close the Popup programmatically:

Demo

.NET

.NET 9 Support

The DevExtreme product line now supports NET 9 RC1 .

.NET 8, .NET Framework 4.6.2, Visual Studio 2019 Will Be Minimally Supported Versions for DevExpress Libraries (v24.2+)

Learn more about this global change in this announcement.

DevExtreme — Year-End Roadmap v24.2 (Angular, React, Vue, jQuery & ASP.NET Core)

Vlada Skorokhodova (DevExpress) — Wed, 17 Jul 2024 02:00:00 Z

UPDATE: What's New in DevExtreme v24.2

In this blog post, we'll look at major features we expect to ship with v24.2. These features apply to both DevExtreme JavaScript (Angular, React, Vue, jQuery) and DevExtreme-based ASP.NET MVC/Core Controls. To share feedback, please respond to the survey questions embedded within this post or submit a support ticket via the DevExpress Support Center. We will be happy to follow up.

New Components

Chat Component

Our next major release (v24.2) will include a Chat component, a must-have UI element for apps that require real-time communication support. Here’s a sneak peek at what you can expect from our Chat component:

Human-to-Human Interaction: Enable user conversations with a chat interface for one-on-one or multi-account communication. Ideal for customer support, social networking, and/or internal collaboration.
AI and Chatbot Integration: Enhance your app’s user experience with AI services and chatbots. Automate responses, deliver immediate support services, and boost engagement with intelligent interactions.
Accessibility and Keyboard Navigation: Our commitment to accessibility ensures that the Chat component will be fully navigable via keyboard, making it intuitive/usable for everyone.

Pagination Component

DevExtreme DataGrid and TreeList ship with built-in paging support. We expect to release Pagination as a separate component to simplify data navigation/improve browsing. This component will allow users to navigate extensive datasets by dividing them into individual pages.

Display mode: “full”

Display mode: “compact”

Primary features will include:

Page Navigator: Built-in controls allow users move between pages. Navigation buttons can be displayed or hidden.
Page Size Selector: Set the number of records per page and configure page size selection elements (display/hide the page size selector and customize page size).
Page Information: Display current page number and total record count. Custom text can be set for page information.
Responsive Design: Pagination will support full, compact, and adaptive display modes. In compact mode, Pagination will change the appearance of the page navigator and page selector to use screen space more efficiently. In adaptive mode, Pagination will automatically switch between full and compact based on content width.
Right-to-Left Support: Suitable for applications requiring internationalization.
Accessibility and Keyboard Navigation: Pagination will be fully accessible with keyboard navigation support.

Data Grid / Tree List — Sticky Columns

In our next update, fixed column support will undergo a complete redesign. Designed before advanced CSS positioning tools were available, our current solution relies on two independent tables: one for fixed columns and another for the primary table. Synchronization between these tables is managed through code, which can fail in rare instances.

In addition to the basic redesign, v24.2 will include a new sticky columns option. Sticky columns remain static initially but start scrolling when they reach their position. Once scrolling moves past this point, they reattach to a different side of the table. This feature improves usability by displaying important columns in a specific view (ensuring continuous access to critical information).

Maps

Support Azure Maps

As you know, Microsoft recently announced that Bing Maps for Enterprise and associated APIs will be discontinued. Azure Maps will be Microsoft’s single unified enterprise mapping platform moving forward.

Accordingly, we expect to add an Azure Map provider in our v24.2 release cycle.

Advanced Google Markers and mapID Support

Google.maps.Marker was deprecated in February 2024. DevExtreme will support advanced Google markers in our Map component and publish a new mapID option (allowing you to use the Google Maps mapID option).

UI/UX and API Enhancements

Collection Components — onSelectionChanging Event

The DevExtreme product line includes several collection components (such as Accordion, List, TreeView, TabPanel, etc.). These components share a common feature: they contain items. Presently, many of these components include an onSelectionChanged event that triggers after all selections are final and the selectedItems option updates. This timing can make it difficult to prevent selection changes based on user interactions.

In our v24.2 release cycle, a new onSelectionChanging event will be available for collection components. This event, which includes a cancel property, will trigger before the selectedItems option updates. This addition simplifies the management of item selections, enabling you to handle user actions more effectively.

TabPanel/MultiView — Item Visibility Option

The DevExtreme TabPanel and MultiView will include a visible property for individual items. This new feature will offer control over collection item visibility settings and allow you to control item visibility at runtime.

DataSource — Case Sensitive Filtering

In June 2023, we released langParams for DataSource. This property can be used to include language-specific parameters for sorting and filtering operations performed on a client. For example, locale settings and collator option configurations are available.

In our next major update, you will be able to configure case sensitivity for sort and filtering operations in DataSource. For example, when the langParams option is set to langParams.collatorOptions.sensitivity=case and user inputs "A" for filtering, records containing the character "A" will be located, while records with the character "a" will be ignored.

Angular

Method to Specify Popup Content

Currently, a template can be used to set content for the DevExtreme Popup component.

With v24.2, Angular users will be able to specify content for Popup elements in a more traditional manner. You will be able to define custom components directly in method arguments used to open Popup.

popup.open(CustomComponent, {
    height: '400px',
    width: '600px',
});

Improved Configuration Component Typing

Props for some of the Angular configuration components lack strict typing. We will enhance the configuration component type definitions while working on internal TypeScript support.

React

Custom Configuration Components

The conventional approach for handling components in React is composition - where one component wraps another. This approach combines multiple components to create larger, more structured ones.

v24.2 will support component composition configuration for DevExtreme React components. For example, you will be able to wrap a DataGrid column into a custom component to reuse it:

const DynamicColumn = (props) => {
    return (<Column ... />) 
} 

function MyGrid(props) { 
     return ( 
        <DataGrid ... > 
            <DynamicColumn columns={props.columns} / > 
        </DataGrid>
     ); 
}

React 19 Support

We've tested our components, demo gallery, and responsive UI templates with React 19 RC and found no issues. As such, we expect to introduce React 19 support in our next major update.

Vue

Support TypeScript IDE Assistance

With v24.2, we will support TypeScript IDE assistance (e.g., IntelliSense) for Vue-based projects.

Import Enhancements

Single Entry-Point For All Types Import For Each Framework

For modular projects, you must import from two packages - devextreme and a framework package (devextreme-react/devextreme-angular/devextreme-vue).

v24.2 will simplify this process and all required types will be available for import from your preferable framework package.

Angular

// Before
import { DxDataGridModule, DxDataGridTypes } from 'devextreme-angular/ui/data-grid'; 
import DataSource from 'devextreme/data/data_source';
// After
import { DxDataGridModule, DxDataGridTypes } from 'devextreme-angular/ui/data-grid';
import { DataSource } from 'devextreme-angular/common/data';

React

// Before
import DataGrid, { DataGridTypes } from 'devextreme-react/data-grid';
import DataSource from 'devextreme/data/data_source';
// After
import DataGrid, { DataGridTypes } from 'devextreme-react/data-grid';
import { DataSource } from 'devextreme-react/common/data';

Vue

// Before
import { DxDataGrid, DxDataGridTypes } from 'devextreme-vue/data-grid';
import DataSource from 'devextreme/data/data_source';
// After
import { DxDataGrid, DxDataGridTypes } from 'devextreme-vue/data-grid';
import { DataSource } from 'devextreme-vue/common/data';

Accessibility

Continuing our commitment to accessibility support, v24.2 will resolve a range of accessibility issues affecting DevExtreme UI components. Our long-term goal is to address all limitations identified in our Voluntary Product Accessibility Template (VPAT) documents.

Application Template Enhancements

We expect to introduce the following enhancements to our application templates:

Refresh design, Material theme.
Introduce a Fluent theme.
Give you the ability to switch between light and dark themes.

.NET

.NET Framework 4.6.2 and .NET 8 Support

Once we release v24.2 (December 2024), DevExpress ASP.NET Core component libraries will no longer support .NET 6/7 and .NET Framework 4.5.2, 4.6 and 4.6.1. DevExpress ASP.NET Core will also require .NET 8 and .NET Framework 4.6.2 respectively.

With v24.2, Visual Studio 2019 will be the minimally supported IDE version. For .NET Core/.NET 8-based products, Visual Studio 2022 will be required.

To learn more, please review the following blog post: .NET and Visual Studio Support.

.NET 9 Support

We have started testing DevExtreme ASP.NET Core controls against .NET 9 previews. Once Microsoft officially releases .NET 9, we expect to introduce .NET 9 support for our v24.2 assemblies.