﻿<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="https://community.devexpress.com/feed-stylesheets/rss.xsl" media="screen"?>
<rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:dx="https://www.devexpress.com/" xmlns:a10="http://www.w3.org/2005/Atom" version="2.0">
  <channel>
    <title>DevExtreme Team Blog</title>
    <link>https://community.devexpress.com/Blogs/javascript/default.aspx</link>
    <description>JavaScript, HTML 5, Angular, React, Vue, jQuery, Knockout, DevExpress, ASP.NET MVC &amp; ASP.NET Core, and News - JavaScript DevExpress blog</description>
    <language>en-US</language>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388300</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2026/08/25/devextreme-roadmap-v26-2.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2026">2026</category>
      <category domain="https://community.devexpress.com/Tags/ai">ai</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/Roadmap">Roadmap</category>
      <category domain="https://community.devexpress.com/Tags/Survey">Survey</category>
      <category domain="https://community.devexpress.com/Tags/v26.2">v26.2</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme — Year-End Roadmap v26.2 (React, Angular, Vue, jQuery &amp; ASP.NET Core)</title>
      <description>&lt;p&gt;The features/capabilities we expect to ship in our next major update apply to both DevExtreme JavaScript component libraries (Angular, React, Vue, jQuery) and DevExtreme-based ASP.NET MVC/Core controls.&lt;/p&gt;
&lt;p&gt;To help us fine tune our release plans, please respond to the survey questions embedded within this post. Alternatively, submit a support ticket via the &lt;a href="https://supportcenter.devexpress.com/ticket/create" target="_blank"&gt;DevExpress Support Center&lt;/a&gt;. We will be happy to follow up.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/Roadmap.png" alt="DevExtreme v26.2 Roadmap" style="width:1920px;height:1000px;"&gt;
&lt;div class="Note"&gt;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.&lt;/div&gt;
&lt;h2&gt;Roadmap Updates&lt;/h2&gt;
&lt;p&gt;This roadmap will be updated regularly to reflect development progress. As we near our official release, we expect to add additional items and modify the status of planned features as necessary. Look for the following labels next to each feature:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="not-started"&gt;Planned&lt;/span&gt; - Feature is scheduled but not yet in development. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="development"&gt;In Development&lt;/span&gt; - Under active development. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in Beta v26.2&lt;/span&gt; - Will be available in our v26.2 beta release. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in v26.2&lt;/span&gt; - Fully implemented and available in v26.2. &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="ai-skills-enhancements"&gt;&lt;/a&gt;
&lt;h2&gt;DevExtreme AI Agent Skills — Planned Enhancements&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;In v26.1, we published a &lt;a href="https://github.com/DevExpress/agent-skills/tree/main/plugins/dx-devextreme" target="_blank"&gt;set of AI Agent Skills for DevExtreme&lt;/a&gt;. These skills help AI coding agents generate higher-quality code that adheres to DevExtreme APIs, patterns, and best practices.&lt;/p&gt;
&lt;p&gt;We expect to improve these skills in upcoming release cycles. Planned updates include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Improvements to existing skills&lt;/li&gt;
&lt;li&gt;New skills for additional components and usage scenarios&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.devexpress.com/AspNetCore/400263/aspnet-core-controls" target="_blank"&gt;ASP.NET Core&lt;/a&gt; support&lt;/li&gt;
&lt;/ul&gt;
&lt;div data-survey-id="528944fe-ad3d-40ef-b590-26ef7d4156a0" data-survey-auth-required="false"&gt;&lt;/div&gt;
&lt;a name="sbom-cra-readiness"&gt;&lt;/a&gt;
&lt;h2&gt;Security — SBOMs and CRA Readiness&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Planned&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;If you deliver software in the EU, the Cyber Resilience Act (CRA) will require a Software Bill of Materials (SBOM – an inventory of every component inside your solution) as part of your conformity documentation. The CRA and its associated regulatory regime will go into effect on December 2027. Each software application/solution manufacturer must fulfil SBOM-related obligations. DevExpress-authored SBOMs will help customers document/inventory DevExpress libraries used within a DevExpress-powered app.&lt;/p&gt;
&lt;p&gt;Most dependency scanners and SBOM generation tools read what a NuGet package declares (its dependencies on other NuGet packages) and stop there, which leaves two gaps we fill:&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;&lt;strong&gt;Components embedded inside a package&lt;/strong&gt;. Some DevExpress NuGet packages bundle fonts and third-party JavaScript libraries. Package metadata has no way to declare them, so a scanner never reports them — even though their licenses and vulnerabilities are as real as those of any declared dependency.&lt;/li&gt;
    &lt;li&gt;&lt;strong&gt;Developer dependencies&lt;/strong&gt;. Libraries we use to build our products never reach users, so we mark them with &lt;code class="language-cmdline"&gt;scope: &amp;quot;excluded&amp;quot;&lt;/code&gt;. We list these libraries regardless, because all vulnerabilities should be documented.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;We released a preview version of DevExpress-authored SBOMs in May 2026 (for our .NET NuGet packages). &lt;a href="https://community.devexpress.com/Blogs/news/archive/2026/05/07/sboms-for-cra-compliance-in-devexpress-based-apps-preview-now-open.aspx" target="_blank"&gt;SBOMs for CRA Compliance in DevExpress-powered Apps&lt;/a&gt; describes what the files contain and how to feed them into tools such as Dependency-Track, Trivy, and Grype. With v26.2, we expect to extend coverage to NPM packages and DevExpress VCL libraries, take our SBOMs out of preview and make them available to every customer.&lt;/p&gt;
&lt;h2&gt;DataGrid Enhancements&lt;/h2&gt;
&lt;a name="semantic-search"&gt;&lt;/a&gt;
&lt;h3&gt;Semantic Search&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;v26.2 will introduce a new DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt; Semantic Search option – one that integrates the component with an AI-powered semantic search backend. Semantic search uses AI embeddings to locate data records based on meaning rather than exact wording. To filter date, the backend processes the context and intent behind a question or phrase.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/DataGrid%20%E2%80%93%20Semantic%20Search@2x.png" alt="DevExtreme DataGrid that displays semantic search results for &amp;quot;Vehicle&amp;quot; with a similarity factor of 0.35. Four records are displayed. Each record contains the following fields: ID, Name, Description." style="width:780px;height:368px;"&gt;
&lt;p&gt;Semantic search is perfect for unprocessed/uncategorized data sets (where configuring filters for exact values may be tedious). By using longer/specific queries, this option can help users locate records more effectively. To control search precision, users will be able to fine-tune search results using a similarity factor.&lt;/p&gt;
&lt;p&gt;Semantic search requires resource-intensive data vectorization. This process is best suited for the server-side, especially for large data sets with records in the tens of thousands. We will demonstrate how to implement semantic search using an ASP.NET Core backend that is tailored to the DevExtreme DataGrid. The UI component itself will require minimal configuration on the client side.&lt;/p&gt;
&lt;a name="ai-powered-detail-view"&gt;&lt;/a&gt;
&lt;h3&gt;AI-powered Detail View&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to add AI-driven data analysis for those using our &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt;&amp;#39;s master-detail view. This new option will allow users to interrogate individual records using natural language.&lt;/p&gt;
&lt;p&gt;In v25.2, we added an &lt;a href="https://www.devexpress.com/subscriptions/new-2025-2.xml#js-grids-ai-columns" target="_blank"&gt;AI column&lt;/a&gt; to our DataGrid. This feature helped analyze component data using an AI prompt. While valuable, certain usage scenarios do not require generated data for every row. Instead, users may need on-demand data generation for specific rows. Our new AI detail scenario will offer this capability, which can significantly reduce AI token consumption and enhance data generation performance.&lt;/p&gt;
&lt;p&gt;Our new AI master-detail feature will also display generated content in a format better suited to longer, more in-depth insights. This option will include a prompt-driven data analysis UI within the DataGrid’s master-detail interface, spanning the full width of the component.&lt;/p&gt;
&lt;p&gt;Within the detail row, users will be able to ask questions about the active record and receive AI-generated insights. The AI assistant will be able to summarize record data, clarify complex values, highlight notable patterns, and obtain contextual information specific to the active record.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/DataGrid%20-%20DataGrid%20-%20AI-Powered%20Detail%20View%20Scenario@2x.png" alt="DevExtreme DataGrid that displays an AI-powered detail view. The open AI detail view displays an entered prompt and generated AI data." style="width:780px;height:534px;"&gt;
&lt;p&gt;This option is particularly valuable for data-intensive applications where records contain many fields or complex business information. Instead of searching through multiple columns and analyzing data manually, users can obtain necessary information using a natural-language prompt. This will improve both user productivity and your application&amp;#39;s overall user experience.&lt;/p&gt;
&lt;a name="chat-tool-call-visualization"&gt;&lt;/a&gt;
&lt;h2&gt;DevExtreme Chat — Tool Call Visualization&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to add the ability to display AI tool/function calls in the DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Chat/Overview/" target="_blank"&gt;Chat&lt;/a&gt; message body. These tools/functions can be declared locally within the app or available via MCP servers.&lt;/p&gt;
&lt;p&gt;This visualization will increase clarity and transparency. Chat users will be able to see which tools were used, their order, and parameters alongside the AI response.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/Chat%20-%20Tool%20Calling%20Visualization@2x.png" alt="Two DevExtreme Chat components that display AI tool calling visualizations. The Chat on the left is in light mode, the Chat on the right is in dark mode." style="width:790px;height:782px;"&gt;
&lt;a name="scheduler-hierarchical-resource-grouping"&gt;&lt;/a&gt;
&lt;h2&gt;DevExtreme Scheduler — Hierarchical Resource Grouping&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Scheduler/Overview/" target="_blank"&gt;Scheduler&lt;/a&gt; currently supports appointment grouping at a single resource level. With v26.2, we will extend this behavior with hierarchical (multi-level) resource grouping based on direct parent-child relationships in your resource data source.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/Scheduler%20%E2%80%93%20Multi-level%20resource%20grouping@2x.png" alt="DevExtreme Scheduler that displays appointments in hierarchical groups. Appointments are grouped by rooms, then by assignees." style="width:780px;height:580px;"&gt;
&lt;p&gt;Planned capabilities will include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Multi-level (parent-child) resource grouping with unrestricted nesting depth&lt;/li&gt;
&lt;li&gt;Nested row headers for Timeline view and nested column headers in Day/Week views (both vertical and horizontal grouping)&lt;/li&gt;
&lt;li&gt;Appointment rendering in the correct leaf resource while preserving existing appointment drag-and-drop behavior&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;This capability is especially valuable for applications that schedule appointments across layered resource hierarchies, such as departments and employees, buildings and rooms, or teams and equipment. You will be able to define parent-child relationships between resources and control which child resources belong to each parent, creating a clear and intuitive hierarchy.&lt;/p&gt;
&lt;a name="map-osm-support"&gt;&lt;/a&gt;
&lt;h2&gt;DevExtreme Map — OpenStreetMap (OSM) Support&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to add &lt;a href="https://www.openstreetmap.org/" target="_blank"&gt;OpenStreetMap&lt;/a&gt; (OSM) support to the DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Map/Overview/" target="_blank"&gt;Map&lt;/a&gt; component. The new provider will allow you to connect the Map to OSM-compatible tile, geocoding, and routing services, including commercial providers and self-hosted infrastructure.&lt;/p&gt;
&lt;p&gt;Planned capabilities will include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Support for core Map features, including markers, routes, and tooltips&lt;/li&gt;
&lt;li&gt;Additional configuration options for OSM-based services&lt;/li&gt;
&lt;li&gt;Greater control over service selection, deployment model, and mapping infrastructure&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="globalization-text-date-number-locales"&gt;&lt;/a&gt;
&lt;h2&gt;Globalization – Separate Text and Date/Number Locales&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v26.2, 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.&lt;/p&gt;
&lt;a name="accessibility"&gt;&lt;/a&gt;
&lt;h2&gt;Accessibility&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to improve accessibility for the following DevExtreme UI components:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/PivotGrid/Overview/" target="_blank"&gt;PivotGrid&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Toolbar/Overview/" target="_blank"&gt;Toolbar&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/HtmlEditor/Overview/" target="_blank"&gt;HTML Editor&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Popover/Overview/" target="_blank"&gt;Popover&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Our long-term goal is to address all limitations identified in our DevExtreme &lt;a href="https://www.devexpress.com/products/net/accessibility.xml#devexpress-accessible-ui" target="_blank"&gt;Accessibility Conformance Reports&lt;/a&gt; (ACRs).&lt;/p&gt;
&lt;a name="pivotgrid-kbn-aria-enhancements"&gt;&lt;/a&gt;
&lt;h3&gt;DevExtreme PivotGrid — Keyboard Navigation and ARIA Attribute Updates&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v26.2, we expect to improve &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/PivotGrid/Overview/" target="_blank"&gt;PivotGrid&lt;/a&gt; keyboard navigation and ARIA semantics to support a more accessible interaction model.&lt;/p&gt;
&lt;p&gt;Planned enhancements include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Consistent arrow-key navigation across column headers, row headers, and area items&lt;/li&gt;
&lt;li&gt;Keyboard access for expand icons and column sort operations&lt;/li&gt;
&lt;li&gt;Keyboard-accessible Field Chooser content with visible focus states&lt;/li&gt;
&lt;li&gt;Focus returned to the trigger button when a popup closes&lt;/li&gt;
&lt;li&gt;Header filter activation from keyboard input with an aria-label that includes column context&lt;/li&gt;
&lt;li&gt;ARIA grid semantics alignment, including header-to-data associations and aria-rowindex/aria-colindex metadata for clearer screen reader announcements&lt;/li&gt;
&lt;li&gt;Keyboard access for scrollable regions and keyboard commands for context menus&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="toolbar-kbn-enhancements"&gt;&lt;/a&gt;
&lt;h3&gt;DevExtreme Toolbar — Enhanced Keyboard Navigation&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to align &amp;quot;focus management&amp;quot; in the DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Toolbar/Getting_Started_with_Toolbar/" target="_blank"&gt;Toolbar&lt;/a&gt; with &lt;a href="https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/" target="_blank"&gt;W3C Toolbar pattern&lt;/a&gt; recommendations.&lt;/p&gt;
&lt;p&gt;Keyboard users will navigate the Toolbar with a single Tab stop and arrow keys between items, instead of tabbing through each item individually — a faster, less error-prone path through the toolbar. Items containing other components (for example, a search box) will support the same model:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Arrow keys reach the item.&lt;/li&gt;
&lt;li&gt;Enter or Space moves focus inside the item.&lt;/li&gt;
&lt;li&gt;Esc returns to the toolbar.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;A visible outline on the focused item will allow users to track keyboard focus.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2026.2%20Roadmap/Toolbar%20-%20KBN%20Enhancements@2x.png" alt="DevExtreme Toolbar that displays a blue outline around the focused item. The component contains text formatting and editing controls, and the focused item changes font size." style="width:780px;height:152px;"&gt;

&lt;p&gt;The same navigation model will extend to built-in toolbars in the following DevExtreme components:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;DataGrid&lt;/li&gt;
&lt;li&gt;File Manager&lt;/li&gt;
&lt;li&gt;HTML Editor&lt;/li&gt;
&lt;li&gt;Scheduler&lt;/li&gt;
&lt;li&gt;TreeList&lt;/li&gt;
&lt;li&gt;Rich Text Editor for ASP.NET Core&lt;/li&gt;
&lt;li&gt;Spreadsheet for ASP.NET Core&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;We will also add an option to preserve behaviors within applications that require our previous implementation.&lt;/p&gt;
&lt;a name="globalize-deprecation"&gt;&lt;/a&gt;
&lt;h2&gt;Globalize — Deprecation Plans&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Planned&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExtreme supports two localization/internationalization libraries: &lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl" target="_blank"&gt;Intl&lt;/a&gt; and &lt;a href="https://github.com/globalizejs/globalize" target="_blank"&gt;Globalize&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Globalize is currently in maintenance mode and may introduce long-term security and reliability risks. We plan to deprecate Globalize support in our next two major release cycles (v26.2 and v27.1) and remove support in subsequent releases.&lt;/p&gt;
&lt;p&gt;We will publish migration guidance to help you transition with minimal disruption.&lt;/p&gt;
&lt;p&gt;If you currently use Globalize, we would appreciate your feedback. Your input will help us understand real-world usage scenarios and assess the impact of this change.&lt;/p&gt;
&lt;div data-survey-id="d40ca586-71a3-419b-95a1-b100cc4d0f62" data-survey-auth-required="false"&gt;&lt;/div&gt;
&lt;a name="net"&gt;&lt;/a&gt;
&lt;h2&gt;ASP.NET Core&lt;/h2&gt;
&lt;h3&gt;.NET 11 Support&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Planned&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExpress ASP.NET Core controls will support .NET 11 (both v26.1 and v26.2) following Microsoft&amp;#39;s official release.&lt;/p&gt;&lt;p&gt;
&lt;/p&gt;&lt;h3&gt;Minimum Supported .NET and Visual Studio Versions&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Planned&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;As you may know, .NET 8 and .NET 9 will &lt;a href="https://dotnet.microsoft.com/en-us/platform/support/policy/dotnet-core" target="_blank"&gt;reach end of support&lt;/a&gt; on November 10, 2026. We will therefore raise our minimum supported .NET version to .NET 10 once we release v26.2 in December. The minimum .NET Framework version will remain 4.6.2.&lt;/p&gt;
&lt;p&gt;Visual Studio 2022 will be the minimum supported IDE version when v26.2 ships.&lt;/p&gt;
&lt;a name="survey"&gt;&lt;/a&gt;
&lt;h2&gt;Your Feedback Matters&lt;/h2&gt;
&lt;div data-survey-id="925083e9-f3f7-4a05-9c0d-4331861fea8b" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Tue, 25 Aug 2026 02:05:00 Z</pubDate>
      <dc:creator>Svetlana Troitskaya (DevExpress)</dc:creator>
      <dx:excerpt>In this blog post, we’ll review the major features we expect to ship in our next major update (v26.2) in December 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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388280</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2026/02/25/devextreme-roadmap-v26-1.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2026">2026</category>
      <category domain="https://community.devexpress.com/Tags/ai">ai</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/Roadmap">Roadmap</category>
      <category domain="https://community.devexpress.com/Tags/Survey">Survey</category>
      <category domain="https://community.devexpress.com/Tags/v26.1">v26.1</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme — June 2026 Roadmap (v26.1 - Angular, React, Vue, jQuery &amp; ASP.NET Core)</title>
      <description>&lt;h2&gt;&lt;span style="color:#ff0000;"&gt;UPDATE:&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/subscriptions/whats-new/#devextreme" target="_blank" style="color:#115bc0;"&gt;What&amp;#39;s New in DevExtreme v26.1&lt;/a&gt;&lt;/h2&gt;
&lt;p&gt;In this blog post, we&amp;#39;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 &lt;a href="https://supportcenter.devexpress.com/ticket/create" target="_blank"&gt;DevExpress Support Center&lt;/a&gt;. We will be happy to follow up. &lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/Roadmap.png" alt="DevExtreme v26.1 Roadmap" style="width:960px;height:500px;"&gt;
&lt;div class="Note"&gt;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.&lt;/div&gt;
&lt;h3&gt;Roadmap Updates &lt;/h3&gt;
&lt;p&gt;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: &lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="not-started"&gt;Planned&lt;/span&gt; - Feature is scheduled but not yet in development. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="development"&gt;In Development&lt;/span&gt; - Under active development. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in Beta v26.1&lt;/span&gt; - Will be available in our v26.1 beta release. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in v26.1&lt;/span&gt; - Fully implemented and available in v26.1. &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="grids-ai-assistant"&gt;&lt;/a&gt;
&lt;h2&gt;DataGrid &amp;amp; TreeList — AI Assistant&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With our v26.1 release, we will extend the AI-powered capabilities of both the DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt; and &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TreeList/Overview/" target="_blank"&gt;TreeList&lt;/a&gt;. 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:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Sort, filter, search, and group data.&lt;/li&gt;
&lt;li&gt;Resize, reorder, fix/unfix, and show/hide columns.&lt;/li&gt;
&lt;li&gt;Change pagination settings.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;In our last release (v&lt;strong&gt;25.2&lt;/strong&gt;), we introduced a standalone &lt;a href="https://www.devexpress.com/subscriptions/whats-new/#js-speechtotext" target="_blank"&gt;Speech To Text&lt;/a&gt; &lt;strong&gt;component&lt;/strong&gt;. 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).&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/DataGrid-and-TreeList%20%E2%80%93%20AI%20Assistant@2x.png" style="width:780px;height:572px;" alt="DevExtreme DataGrid with the expected AI Assistant interface enabled. It is a Popup window on top of the grid that allows you to type in custom requests regarding grid&amp;#39;s data."&gt;
&lt;p&gt;This feature is particularly well suited for the following usage scenarios:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Large Datasets&lt;/strong&gt;: Use the power of AI to browse large data sets. Apply complex filter values with natural language.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Complex Grid Configurations&lt;/strong&gt;: Allow users to specify complex display preferences quickly. &lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Accessibility-first Applications&lt;/strong&gt;: 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). &lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Replicable Configurations&lt;/strong&gt;: Apply the same prompt to recreate complex grid configurations across sessions. Reduce time spent on tedious layout adjustments.&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="grids-validation-message"&gt;&lt;/a&gt;
&lt;h2&gt;DataGrid &amp;amp; TreeList — Persistent Validation Messages in Editors&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Postponed&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to introduce new APIs that will allow validation messages to remain visible even when data editors lose focus (similar to the &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxTextBox/Configuration/#validationMessageMode" target="_blank"&gt;validationMessageMode=&amp;#39;always&amp;#39;&lt;/a&gt; in components such as our &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TextBox/Overview/" target="_blank"&gt;TextBox&lt;/a&gt;). These APIs will apply to all available editing modes. &lt;/p&gt;
&lt;h2&gt;Chat Enhancements&lt;/h2&gt;
&lt;a name="chat-stt"&gt;&lt;/a&gt;
&lt;h3&gt;Speech To Text&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to integrate our new &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/SpeechToText/Overview/" target="_blank"&gt;SpeechToText&lt;/a&gt; component into our &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Chat/Overview/" target="_blank"&gt;Chat&lt;/a&gt; component&amp;#39;s input area for faster, hands-free communication.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/Chat%20-%20Speech%20to%20text@2x.png" alt="DevExtreme Chat will display a &amp;quot;Start Dictation&amp;quot; button in its input field." style="width:780px;height:363px;"&gt;
&lt;a name="chat-streaming"&gt;&lt;/a&gt;
&lt;h3&gt;Message Streaming&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;a name="chat-tool-calling"&gt;&lt;/a&gt;
&lt;h3&gt;Tool Call Visualization&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Posponed to v26.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;

&lt;p&gt;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.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/Chat%20-%20Tool%20Calling@2x.png" alt="Chat - Tool Calling" style="width:790px;height:782px;"&gt;
&lt;h2&gt;Scheduler Enhancements&lt;/h2&gt;
&lt;a name="scheduler-snap-modes"&gt;&lt;/a&gt;
&lt;h3&gt;Appointment Snap Modes&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Scheduler/Overview/" target="_blank"&gt;Scheduler&lt;/a&gt; will include a new appointment snap mechanism. The following modes will be available: &lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;always&lt;/strong&gt; - an appointment always stretches to cell borders.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;auto&lt;/strong&gt; - 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.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;never&lt;/strong&gt; - appointments are proportional to their duration.&lt;/li&gt;
&lt;/ul&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/Scheduler%20-%20SnapToCellsMode@2x.png" alt="DevExtreme Scheduler Ui displaying 3 mentioned snap modes." style="width:780px;height:759px;"&gt;
&lt;a name="scheduler-time-overlapping"&gt;&lt;/a&gt;
&lt;h3&gt;Handle Appointment Time Overlapping&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Prevent Time Conflicts&lt;/strong&gt;: Notify users about a scheduling conflict. Restrict adding, editing, or moving appointments if the selected time slot is already occupied.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Suggest Available Time Slots&lt;/strong&gt;: Automatically suggest the nearest available time when a selected slot is unavailable.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Handle Recurring Appointment Conflicts&lt;/strong&gt;: Detect and manage conflicts for individual occurrences within recurring appointments.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Execute Overlap Rules&lt;/strong&gt;: Apply different overlap rules depending on the appointment category.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Enforce Buffer Time Between Appointments&lt;/strong&gt;: Require a configurable gap before and after appointments to avoid tight scheduling.&lt;/li&gt;
&lt;/ul&gt;
&lt;a name="scheduler-hide-days"&gt;&lt;/a&gt;
&lt;h3&gt;Hide Specific Days &lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;You will be able to hide specific days in week and month views, for example, weekends or custom day sets.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/Scheduler%20-%20Hide%20day@2x.png" alt="Scheduler - Hide days" style="width:780px;height:551px;"&gt;

&lt;h2&gt;UI/UX and API Enhancements&lt;/h2&gt;
&lt;a name="treeview-disabled-node-selection"&gt;&lt;/a&gt;
&lt;h3&gt;TreeView — Prevent Selection for Disabled Nodes&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v26.1, you will be able to prevent &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxTreeView/Configuration/#selectNodesRecursive" target="_blank"&gt;recursive selection&lt;/a&gt; state changes for &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxTreeView/Node/#disabled" target="_blank"&gt;disabled TreeView nodes&lt;/a&gt;.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2026.1%20Roadmap/TreeView%20-%20Provide%20a%20way%20to%20control%20ability%20to%20select%20nodes@2x.png" alt="TreeView - Provide a way to control ability to select nodes (disable nodes selection)" style="width:788px;height:546px;"&gt;

&lt;p&gt;We will also add the ability to expand/collapse disabled parent nodes.&lt;/p&gt;
&lt;a name="date-formats"&gt;&lt;/a&gt;
&lt;h3&gt;Application-Wide Date Formats&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We will introduce new APIs designed to specify a single date format for all DevExtreme components within your application.&lt;/p&gt;
&lt;a name="globalization-locales"&gt;&lt;/a&gt;
&lt;h3&gt;Globalization — Separate Text and Date/Number Locales&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Postponed&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;a name="accessibility"&gt;&lt;/a&gt;
&lt;h2&gt;Accessibility&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to improve accessibility for the following DevExtreme UI components: &lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt;/&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TreeList/Overview/" target="_blank"&gt;TreeList&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Scheduler/Overview/" target="_blank"&gt;Scheduler&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Form/Overview/" target="_blank"&gt;Form&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Popup/Overview/" target="_blank"&gt;Popup&lt;/a&gt; / &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Popover/Overview/" target="_blank"&gt;Popover&lt;/a&gt; / &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Tooltip/Overview/" target="_blank"&gt;Tooltip&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/RadioGroup/Overview/" target="_blank"&gt;RadioGroup&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;We will also improve color schema in our Material themes to comply with accessibility contrast requirements.&lt;/p&gt;&lt;p&gt;&lt;span&gt;Additionally, in v26.1, we expect to introduce screen reader support for&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/aspnetcore/rich-text-editor/" target="_blank"&gt;Rich Text Editor for ASP.NET Core&lt;/a&gt;.&lt;br&gt;&lt;/p&gt;
&lt;p&gt;Our long-term goal is to address all limitations identified in our DevExtreme &lt;a href="https://www.devexpress.com/products/net/accessibility.xml#devexpress-accessible-ui" target="_blank"&gt;Accessibility Conformance Reports&lt;/a&gt; (ACRs).&lt;/p&gt;
&lt;a name="migration-away-from-common-js"&gt;&lt;/a&gt;
&lt;h2&gt;Migration Away from CommonJS&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Postponed&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;a name="survey-common-js"&gt;&lt;/a&gt;
&lt;div data-survey-id="fa04a453-b6a8-499a-91df-eb8c52aa8991" data-survey-auth-required="false"&gt;&lt;/div&gt;
&lt;a name="angular-22"&gt;&lt;/a&gt;
&lt;h2&gt;Angular 22&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;The release of Angular 22 is &lt;a href="https://angular.dev/reference/releases" target="_blank"&gt;planned&lt;/a&gt; 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.&lt;/p&gt;
&lt;p&gt;According to Angular&amp;#39;s &lt;a href="https://angular.dev/reference/releases#actively-supported-versions" target="_blank"&gt;official support schedule&lt;/a&gt;, Angular 19 will reach end-of-support in May 2026. With v26.1, we will also update our minimum supported Angular version to 20.&lt;/p&gt;
&lt;a name="net"&gt;&lt;/a&gt;
&lt;h2&gt;ASP.NET Core&lt;/h2&gt;
&lt;h3&gt;UI Template Kit Update&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;&lt;a href="https://docs.devexpress.com/AspNetCore/405322/devextreme-based-controls/get-started/project-template-kit" target="_blank"&gt;DevExpress UI Template Kit&lt;/a&gt; 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).&lt;/p&gt;
&lt;p&gt;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).&lt;/p&gt;
&lt;a name="survey"&gt;&lt;/a&gt;
&lt;h2&gt;Your Feedback Matters&lt;/h2&gt;
&lt;div data-survey-id="2f17b67a-b8ef-4882-9c4c-470a6dffaa71" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Wed, 25 Feb 2026 00:38:00 Z</pubDate>
      <dc:creator>Svetlana Troitskaya (DevExpress)</dc:creator>
      <dx:excerpt>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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388261</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2025/08/14/devextreme-december-2025-roadmap-v25-2.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2025">2025</category>
      <category domain="https://community.devexpress.com/Tags/ai">ai</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/Roadmap">Roadmap</category>
      <category domain="https://community.devexpress.com/Tags/Survey">Survey</category>
      <category domain="https://community.devexpress.com/Tags/v25.2">v25.2</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme — Year-End Roadmap v25.2 (React, Angular, Vue, jQuery &amp; ASP.NET Core)</title>
      <description>&lt;h2&gt;&lt;span style="color:#ff0000;"&gt;UPDATE:&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/subscriptions/whats-new/#devextreme" target="_blank" style="color:#115bc0;"&gt;What&amp;#39;s New in DevExtreme v25.2&lt;/a&gt;&lt;/h2&gt;
&lt;p&gt;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&amp;nbsp;(React, &lt;span&gt;Angular,&amp;nbsp;&lt;/span&gt;Vue, jQuery) and DevExtreme-based ASP.NET Core/ASP.NET MVC5 Controls. To share feedback, please respond to the &lt;a href="#survey"&gt;survey questions&lt;/a&gt; embedded within this post or submit a support ticket via the &lt;a href="https://supportcenter.devexpress.com/ticket/create" target="_blank"&gt;DevExpress Support Center&lt;/a&gt;. We will be happy to follow up.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/rm.png" alt="DevExtreme Roadmap v25.2" style="width:1560px;height:813px;"&gt;

&lt;div class="Note"&gt;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.&lt;/div&gt;

&lt;h2&gt;Live Roadmap Updates&lt;/h2&gt;
&lt;p&gt;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 every feature:&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;&lt;p class="tags"&gt;&lt;span class="not-started"&gt;Planned&lt;/span&gt; — Feature is scheduled but not yet in development.&lt;/p&gt;&lt;/li&gt;
    &lt;li&gt;&lt;p class="tags"&gt;&lt;span class="development"&gt;In Development&lt;/span&gt; — Under active development.&lt;/p&gt;&lt;/li&gt;
    &lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in Beta v25.2&lt;/span&gt; — Will be available in our v25.2 beta release.&lt;/p&gt;&lt;/li&gt;
    &lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Coming in v25.2&lt;/span&gt; — Will be included in the final v25.2 release.&lt;/p&gt;&lt;/li&gt;
    &lt;li&gt;&lt;p class="tags"&gt;&lt;span class="completed"&gt;Released in v25.2&lt;/span&gt; — Fully implemented and available in v25.2.&lt;/p&gt;&lt;/li&gt;
    
&lt;/ul&gt;

&lt;h2&gt;AI-Powered Extensions&lt;/h2&gt;

&lt;a name="new-speechtotext-component"&gt;&lt;/a&gt;
&lt;h3&gt;New SpeechToText Component&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;Our next major update (v25.2) will include a new SpeechToText component. This component will convert speech to text in real-time using &lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition" target="_blank"&gt;Web Speech APIs&lt;/a&gt;.&lt;/p&gt;&lt;img src="https://www.devexpress.com/subscriptions/i/25.2/speech-to-text.gif" alt="New SpeechToText component in action"&gt;
&lt;p&gt;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:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Chats or any prompt-based interface&lt;/li&gt;
&lt;li&gt;Search components&lt;/li&gt;
&lt;li&gt;Populating app forms&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;SpeechToText will support multiple languages and listening states. You will also be able to customize the component button (icon, text, and styling mode).&lt;/p&gt;

&lt;a name="datagrid-treelist-ai-column"&gt;&lt;/a&gt;
&lt;h3&gt;DataGrid/TreeList – AI Column&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v25.2, DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt; and &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TreeList/Overview/" target="_blank"&gt;TreeList&lt;/a&gt; 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.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/AI%20Column@2x%20(1).png" alt="DevExtreme DataGrid with an AI column" style="width:1560px;height:848px;"&gt;
&lt;p&gt;Potential usage scenarios include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Data Enrichment.&lt;/strong&gt; Add missing contextual information without modifying the underlying dataset.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Categorization/Tagging. &lt;/strong&gt;Assign categories or tags based on row information.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Prediction &amp;amp; Estimation. &lt;/strong&gt;Generate estimated delivery times, sale insights, or performance ratings (based on AI model).&lt;/li&gt;
&lt;/ul&gt;

&lt;a name="form-ai-smart-paste"&gt;&lt;/a&gt;
&lt;h3&gt;Form – AI Smart Paste&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We will integrate AI-powered Smart Paste to DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Form/Overview/" target="_blank"&gt;Form&lt;/a&gt; and enhance traditional copy-paste workflows. When a user copies unstructured text (from spreadsheets, documents, emails, web pages, etc.) and activates &lt;strong&gt;Smart Paste&lt;/strong&gt;, AI will analyze clipboard content and populate each form field with relevant data.&lt;/p&gt;&lt;img src="https://www.devexpress.com/subscriptions/i/25.2/js-smart-paste.gif" alt="DevExtreme Form - Smart Paste feature"&gt;

&lt;h2&gt;Chat-Related Enhancements&lt;/h2&gt;

&lt;a name="file-attachments"&gt;&lt;/a&gt;
&lt;h3&gt;File Attachments&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v25.2, users will be able to attach files when sending messages through DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Chat/Overview/" target="_blank"&gt;Chat&lt;/a&gt;. This feature will be of value for solutions that incorporate support conversations, team collaboration, and peer-to-peer communications.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/File%20Attachments@2x.png" alt="DevExtreme Chat with files attached" class="small" style="width:1560px;height:640px;"&gt;

&lt;a name="speech-to-text"&gt;&lt;/a&gt;
&lt;h3&gt;Speech to Text&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Posponed to v26.1&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We plan to integrate our new SpeechToText component into Chat for faster, hands-free communication.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/chat-speech-to-text@2x.png" alt="DevExtreme Chat showcasing the speech-to-text feature in a dialog" style="width:1560px;height:720px;"&gt;

&lt;a name="empty-view-template"&gt;&lt;/a&gt;
&lt;h3&gt;Empty View Template&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With v25.2, you will be able to customize the Chat&amp;#39;s empty view using our template engine.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/empty-view@2x.png" alt="DevExtreme Chat with customized empty view. Includes bubbles with prompt messages for AI assistant" style="width:1560px;height:1080px;"&gt;
&lt;p&gt;Usage scenarios include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Onboarding &amp;amp; First-Time User Guidance. &lt;/strong&gt;Display messages or tips to help new users start a conversation. You can also include UI elements that suggest prompts.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Preliminary Information. &lt;/strong&gt;Display&amp;nbsp;important information before a conversation begins, such as usage instructions or data processing disclaimers.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Context-Aware Messaging. &lt;/strong&gt;Display dynamic content based on user context (for example, “Ask me anything about your current order”) for a more personalized experience.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Branded Experience. &lt;/strong&gt;Add brand visuals, mascots, or tone to engage users.&lt;/li&gt;
&lt;/ul&gt;

&lt;a name="datagrid-treelist-taxbox-columns"&gt;&lt;/a&gt;
&lt;h2&gt;DataGrid/TreeList – TagBox Columns&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Postponed&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;In v25.2, we will add a built-in &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TagBox/Getting_Started_with_TagBox/" target="_blank"&gt;TagBox&lt;/a&gt; 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.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/TreeList%20%E2%80%93%20TagBox%20Columns@2x.png" alt="DevExtreme TreeList component with a TagBox column - multiple choice enabled"&gt;
&lt;p&gt;This feature enhances usability when working with multiple categories/related entities (such as tags, status info, or addresses).&lt;/p&gt;

&lt;a name="scheduler-appointment-form-redesign"&gt;&lt;/a&gt;
&lt;h2&gt;Scheduler – Appointment Form Redesign&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;In v25.2, we will redesign the &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Scheduler/Overview/" target="_blank"&gt;Scheduler&lt;/a&gt; appointment edit form based on modern UI/UX standards.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/Scheduler%20-%20Edit%20Appointment%20Form@2x.png" alt="Scheduler&amp;#39;s new appointment form"&gt;
&lt;p&gt;The updated form will be fully responsive (across desktops, tablets, and mobile devices). We will also improve accessibility to align with current compliance standards.&lt;/p&gt;

&lt;h2&gt;UI/UX and API Enhancements&lt;/h2&gt;

&lt;a name="collection-components-performance-optimizations"&gt;&lt;/a&gt;
&lt;h3&gt;Collection Components – Performance Optimizations&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Accordion/Getting_Started_with_Accordion/" target="_blank"&gt;Accordion&lt;/a&gt;, &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Tabs/Getting_Started_with_Tabs/" target="_blank"&gt;Tabs&lt;/a&gt;, &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TabPanel/Getting_Started_with_TabPanel/" target="_blank"&gt;TabPanel&lt;/a&gt;, and &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/List/Overview/" target="_blank"&gt;List&lt;/a&gt; components re-render all items after each reordering operation. With v25.2, if &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxAccordion/Configuration/#repaintChangesOnly" target="_blank"&gt;repaintChangesOnly&lt;/a&gt; is enabled, re-rendering will be limited to affected items.&lt;/p&gt;
&lt;p&gt;This change will increase rendering speed and reduce DOM updates, especially in large collections.&lt;/p&gt;

&lt;a name="drop-down-editors-fieldtemplate-redesign"&gt;&lt;/a&gt;
&lt;h3&gt;Drop-Down Editors – fieldTemplate Redesign&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;For &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/SelectBox/Overview/" target="_blank"&gt;SelectBox&lt;/a&gt;, &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TagBox/Getting_Started_with_TagBox/" target="_blank"&gt;TagBox&lt;/a&gt;, &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/ColorBox/Getting_Started_with_ColorBox/" target="_blank"&gt;ColorBox&lt;/a&gt;, and  &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/DropDownBox/Getting_Started_with_DropDownBox/" target="_blank"&gt;DropDownBox&lt;/a&gt;, we expect to replace &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSelectBox/Configuration/#fieldTemplate" target="_blank"&gt;fieldTemplate&lt;/a&gt; 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 &lt;code class="language-js"&gt;fieldTemplate&lt;/code&gt; option will be deprecated.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/Dropdown@2x.png" alt=""&gt;

&lt;a name="loadindicator-new-animation-type"&gt;&lt;/a&gt;
&lt;h3&gt;LoadIndicator – New Animation Type&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With our next release, the &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/LoadIndicator/Overview/" target="_blank"&gt;LoadIndicator&lt;/a&gt; component will support sparkle animation. The new &lt;code class="language-js"&gt;animationType&lt;/code&gt; option will allow you to switch between circle and sparkle animation.&lt;/p&gt;&lt;img src="https://www.devexpress.com/subscriptions/i/25.2/loading.gif" alt="DevExtreme LoadIndicator - Circle and Sparkle animations"&gt;

&lt;a name="calendar-today-button-text"&gt;&lt;/a&gt;
&lt;h3&gt;Calendar – Today Button Text&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;You will be able to specify custom text for the Today button.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/Custom%20Text@2x.png" alt="DevExtreme Calendar - Today button custom text" style="width:1560px;height:930px;"&gt;

&lt;a name="tabpanel-new-keyexpr-property"&gt;&lt;/a&gt;
&lt;h3&gt;TabPanel – New keyExpr Property&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We will introduce a &lt;code class="language-js"&gt;keyExpr&lt;/code&gt; property for the &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/TabPanel/Getting_Started_with_TabPanel/" target="_blank"&gt;TabPanel&lt;/a&gt; component to simplify access to data items.&lt;/p&gt;

&lt;a name="font-stack-update"&gt;&lt;/a&gt;
&lt;h2&gt;Font Stack Update&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExtreme default font stack will be updated to better align with the native typography of modern operating systems.&lt;/p&gt;
&lt;p&gt;With v25.2, DevExtreme-powered applications will automatically use system fonts as follows:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;SE Pro on macOS&lt;/li&gt;
&lt;li&gt;Roboto on Android&lt;/li&gt;
&lt;li&gt;Ubuntu on Linux&lt;/li&gt;
&lt;li&gt;Segoe UI on Windows&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;This change ensures consistent appearance across platforms, enhances text rendering, and improves performance.&lt;/p&gt;

&lt;a name="accessibility"&gt;&lt;/a&gt;
&lt;h2&gt;Accessibility&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We expect to improve accessibility for the following DevExtreme UI components:&amp;nbsp;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Popup/Overview/" target="_blank"&gt;Popup&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/HtmlEditor/Overview/" target="_blank"&gt;HTML Editor&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Scheduler/Overview/" target="_blank"&gt;Scheduler&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Our long-term goal is to address all limitations identified in our DevExtreme Accessibility Conformance Reports (ACRs).&lt;/p&gt;

&lt;h2&gt;Long-Term Initiatives&lt;/h2&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;p&gt;We will share progress on our long-term efforts throughout our v25.2 release cycle.&lt;/p&gt;
&lt;p&gt;Notable initiatives include:&lt;/p&gt;

&lt;a name="devexpress-mcp-server-for-ai-powered-documentation-access"&gt;&lt;/a&gt;
&lt;h3&gt;DevExpress MCP Server for AI-Powered Documentation Access&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;&lt;a target="_blank" href="https://docs.devexpress.com/GeneralInformation/405551/help-resources/dev-express-documentation-mcp-server-configure-an-ai-powered-assistant"&gt;Available in Preview&lt;/a&gt;&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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&amp;#39;s context.&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/winforms/20251008-Win-Roadmap-252/dx-mcp-docs-assistant.png" alt="MCP Server for AI-Powered Documentation Access" style="width:862px;height:391px;"&gt;

&lt;a name="ai-powered-migration"&gt;&lt;/a&gt;
&lt;h3 id=""&gt;AI-Powered Migration&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;React&lt;/span&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
    &lt;span class="platform"&gt;Vue&lt;/span&gt;
    &lt;span class="platform"&gt;jQuery&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="development"&gt;In Development&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;To simplify version upgrades, we will introduce an MCP service that will list changes in each release and update applications accordingly.&lt;/p&gt;
&lt;p&gt;We will begin implementing MCP in v25.2. Once ready, it will help you with the following tasks:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Resolve breaking changes&lt;/li&gt;
&lt;li&gt;Transition to&amp;nbsp;new APIs&lt;/li&gt;
&lt;li&gt;Remove deprecated APIs&lt;/li&gt;
&lt;li&gt;Apply strict type checking from new types&lt;/li&gt;
&lt;li&gt;Identify and address emerging issues&lt;/li&gt;
&lt;/ul&gt;

&lt;a name="survey-migration"&gt;&lt;/a&gt;
&lt;div data-survey-id="76ebc4ce-570e-49d7-a3ed-b890407eff6b" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="design-system-and-figma-ui-kit"&gt;&lt;/a&gt;
&lt;h3&gt;Design System and Figma UI Kit&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Platforms&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="not-started"&gt;Planned&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;p&gt;In this release cycle (v25.2), we will integrate the design system into DevExtreme. The system will introduce style management/customization flexibility.&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/Figma@2x.png" alt="DevExtreme UI Kit Fluent theme"&gt;

&lt;a name="survey-design"&gt;&lt;/a&gt;
&lt;div data-survey-id="5cbc5718-f562-4db3-a7fa-d83a9b1d4721" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="angular-21"&gt;&lt;/a&gt;
&lt;h2&gt;Angular 21&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;The release of Angular 21 is &lt;a href="https://angular.dev/reference/releases" target="_blank"&gt;planned&lt;/a&gt; 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.&lt;/p&gt;
&lt;p&gt;According to Angular’s &lt;a href="https://angular.dev/reference/releases#actively-supported-versions" target="_blank"&gt;official support schedule&lt;/a&gt;, 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.&lt;/p&gt;

&lt;a name="net"&gt;&lt;/a&gt;
&lt;h2&gt;.NET&lt;/h2&gt;

&lt;h3&gt;.NET 10 Support&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;

&lt;h3&gt;ASP.NET Core UI Template Gallery&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
        &lt;span class="completed"&gt;&lt;a target="_blank" href="https://github.com/DevExpress/devextreme-asp-ui-template-gallery"&gt;Available in the GitHub repository&lt;/a&gt;&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;We introduced the UI Template Gallery for DevExtreme in our &lt;a href="https://www.devexpress.com/subscriptions/new-2022-1.xml#angular" target="_blank"&gt;v22.1 release&lt;/a&gt; cycle. In subsequent versions, we expanded the gallery to include templates for &lt;a href="https://js.devexpress.com/React/Demos/WidgetsGallery/Demo/Templates/" target="_blank"&gt;React&lt;/a&gt;, &lt;a href="https://js.devexpress.com/Angular/Demos/WidgetsGallery/Demo/Templates/" target="_blank"&gt;Angular&lt;/a&gt;, and &lt;a href="https://js.devexpress.com/Vue/Demos/WidgetsGallery/Demo/Templates/" target="_blank"&gt;Vue&lt;/a&gt;. This gallery showcases common application usage scenarios.&lt;/p&gt;
&lt;p&gt;In response to customer requests, v25.2 will include a UI Template Gallery for ASP.NET Core.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.2%20Roadmap/ASP%20Template@2x.png" alt="ASP.NET Core UI Template Gallery" style="width:1560px;height:1004px;"&gt;

&lt;h3&gt;ASP.NET Core Source Builder&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="completed"&gt;Released in v25.2&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;In v24.2, DevExpress Source Builder &lt;a href="https://www.devexpress.com/subscriptions/new-2024-2.xml#devexpress-source-builder" target="_blank"&gt;was introduced&lt;/a&gt; as part of the DevExpress Unified Installer. This tool rebuilds source code for .NET Core product libraries.&lt;/p&gt;
&lt;p&gt;With v25.2, our Source Builder will support DevExtreme ASP.NET Core.&lt;/p&gt;

&lt;a name="web-reporting"&gt;&lt;/a&gt;
&lt;h2 id="reporting"&gt;Web Reporting&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET and Blazor Subscription&lt;/span&gt;
    &lt;span class="platform"&gt;DXperience&lt;/span&gt;
    &lt;span class="platform"&gt;Universal&lt;/span&gt;
    &lt;br&gt;
    &lt;span class="platform"&gt;React&lt;/span&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
    &lt;span class="platform"&gt;Vue&lt;/span&gt;
    &lt;span class="platform"&gt;ASP.NET Core&lt;/span&gt;
    &lt;span class="platform"&gt;ASP.NET MVC&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;Learn more: &lt;a href="https://community.devexpress.com/Blogs/reporting/archive/2025/08/13/devexpress-reports-amp-bi-dashboard-november-2025-roadmap-v25-2.aspx" target="_blank"&gt;DevExpress Reports &amp;amp; BI Dashboard — Year-End 2025 Roadmap (v25.2)&lt;/a&gt;&lt;/p&gt;

&lt;a name="survey"&gt;&lt;/a&gt;
&lt;h2&gt;Your Feedback Matters&lt;/h2&gt;
&lt;div data-survey-id="a42ace09-fc2c-44e0-9ec3-e4f49e5ad3c5" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Thu, 14 Aug 2025 04:00:00 Z</pubDate>
      <dc:creator>Elena Dikareva (DevExpress)</dc:creator>
      <dx:excerpt>This blog post outlines key features/enhancements planned in DevExtreme for our next major update (v25.2) in December 2025</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388251</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2025/07/07/new-angular-configuration-components.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2025">2025</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <title>Changes and Future Plans: New Angular Configuration Components</title>
      <description>&lt;img src="https://community.devexpress.com/blogs/javascript/20250617-devextreme-new-angular-components/facebook.png" alt="DevExtreme Angular New Configuration Components v24.2+"&gt;&lt;p&gt;If you&amp;#39;ve worked with the DevExtreme Angular components in the past, you likely encountered configuration components — those with &lt;code class="language-js"&gt;dxo-&lt;/code&gt; and &lt;code class="language-js"&gt;dxi-&lt;/code&gt; 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 &lt;code class="language-js"&gt;dx-data-grid&lt;/code&gt; using the &lt;code class="language-js"&gt;dxo-pager&lt;/code&gt; component.&lt;/p&gt;&lt;pre&gt;&lt;code class="language-html"&gt;&amp;lt;dx-data-grid  [dataSource]=&amp;quot;dataSource&amp;quot;&amp;gt; 
    &amp;lt;dxo-pager 
        [visible]=&amp;quot;true&amp;quot; 
        [showPageSizeSelector]=&amp;quot;true&amp;quot; &amp;gt; 
    &amp;lt;/dxo-pager&amp;gt; 
&amp;lt;/ dx-data-grid&amp;gt; &lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;
    They are also useful for setting up collection elements, such as defining toolbar items in &lt;code class="language-js"&gt;dx-toolbar&lt;/code&gt; using its child components like &lt;code class="language-js"&gt;dxi-item&lt;/code&gt;.&lt;/p&gt;&lt;pre&gt;&lt;code class="language-html"&gt;&amp;lt;dx-toolbar&amp;gt; 
    &amp;lt;dxi-item location=&amp;quot;before&amp;quot; widget=&amp;quot;dxButton&amp;quot; &amp;gt; 
    &amp;lt;/dxi-item&amp;gt; 
&amp;lt;/dx-toolbar&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;
    Let&amp;#39;s take a closer look at how the legacy Angular configuration components work, focusing on &lt;code class="language-js"&gt;dxi-item&lt;/code&gt; as an example. This component is &amp;quot;universal&amp;quot;. It is used not just within &lt;code class="language-js"&gt;dx-toolbar&lt;/code&gt;, but also in many other DevExtreme components (such as Form and List). 
&lt;/p&gt;
&lt;p&gt;
    While this approach offers consistency (the same component can be used in multiple places), it does have drawbacks. &lt;code class="language-js"&gt;dxi-item&lt;/code&gt; requires entirely different sets of options depending on the parent component, complicating precise typing. 
&lt;/p&gt;
&lt;p&gt;
    The following screenshot illustrates how an IDE presents the same general property list for &lt;code class="language-js"&gt;dxi-item&lt;/code&gt; in two different contexts. For instance, the expected properties for a &lt;a href="https://js.devexpress.com/Angular/Documentation/ApiReference/UI_Components/dxForm/Item_Types/GroupItem/" target="_blank"&gt;form’s group item&lt;/a&gt; differs significantly from those used in a &lt;a href="https://js.devexpress.com/Angular/Documentation/ApiReference/UI_Components/dxGantt/Configuration/contextMenu/items/" target="_blank"&gt;Gantt chart’s context menu item&lt;/a&gt;.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/20250617-devextreme-new-angular-components/ide-comparison.png" alt="A side-by-side comparison of IDE tooltips for &amp;lt;dxi-item&amp;gt; used in two different components — one showing suggestions relevant to a Form’s group item, and the other showing suggestions for a Gantt chart’s context menu item" style="width:2880px;height:960px;"&gt;
&lt;p&gt;
    One of our main priorities is delivering full and robust &lt;b&gt;TypeScript support&lt;/b&gt;. We&amp;#39;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. 
&lt;/p&gt;
&lt;p&gt;
    As you might expect, enforcing strict typing in configuration components has proven to be a complex challenge. Adjusting typings for existing &lt;code class="language-js"&gt;dxo-&lt;/code&gt; and &lt;code class="language-js"&gt;dxi-&lt;/code&gt; 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. 
&lt;/p&gt;
&lt;h2&gt;
    New Configuration Components: What&amp;#39;s Changed and Why It Matters
&lt;/h2&gt;
&lt;p&gt;
    With DevExtreme v24.2, we introduced a &lt;a href="https://js.devexpress.com/Angular/New/24_2/#new-configuration-components" target="_blank"&gt;new set of configuration components&lt;/a&gt; (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. 
&lt;/p&gt;
&lt;p&gt;
    Each UI component ships with its own dedicated set of configuration components. This marks a major step forward in predictability and type safety. Here&amp;#39;s what&amp;#39;s changed and how it benefits you: 
&lt;/p&gt;
&lt;h3&gt;
    Clearer and More Context-Aware Configuration Components
&lt;/h3&gt;
&lt;p&gt;
    Configuration component names now include their parent component&amp;#39;s name. This improves code readability, prevents naming collisions, and makes templates more self-explanatory. 
&lt;/p&gt;
&lt;p&gt;
    For example, &lt;code class="language-js"&gt;dxi-item&lt;/code&gt; is now: 
&lt;/p&gt;&lt;ul&gt;
    &lt;li&gt;&lt;code class="language-js"&gt;dxi-toolbar-item&lt;/code&gt; in &lt;code class="language-js"&gt;dx-toolbar&lt;/code&gt;&lt;/li&gt;
    &lt;li&gt;&lt;code class="language-js"&gt;dxi-form-item&lt;/code&gt; in &lt;code class="language-js"&gt;dx-form&lt;/code&gt;&lt;/li&gt;
    &lt;li&gt;&lt;code class="language-js"&gt;dxi-context-menu-item&lt;/code&gt; in &lt;code class="language-js"&gt;dx-context-menu&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;
    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. 
&lt;/p&gt;
&lt;h3&gt;
    Strict Typing and a Better Developer Experience
&lt;/h3&gt;
&lt;p&gt;
    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, &lt;code class="language-js"&gt;dxi-data-grid-column&lt;/code&gt; reveals only properties applicable to DataGrid columns. As a result, IDE suggestions are now far more accurate and useful: 
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/20250617-devextreme-new-angular-components/new-components.png" alt="Old and new components side-by-side"&gt;
&lt;p&gt;
    Most new configuration properties are &lt;b&gt;strictly typed, and others will be typed in the future&lt;/b&gt;. This means that any misuse of a component&amp;#39;s API will be caught during compilation (long before it can cause issues at runtime).&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/20250617-devextreme-new-angular-components/strictly-typed.png" alt="Compiling apps with old and new configuration components: the new ones throw TS error" style="width:2800px;height:1100px;"&gt;
&lt;h2&gt;
    What&amp;#39;s Next: Full adoption of the new configuration components
&lt;/h2&gt;
&lt;p&gt;
    New configuration components have significant advantages over the old architecture: they are robust, modern, error-resistant, and better aligned with TypeScript&amp;#39;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: 
&lt;/p&gt;
&lt;h4&gt;
    DevExtreme v25.1 Release 
&lt;/h4&gt;
&lt;ul&gt;
    &lt;li&gt;We will start updating all demo examples and help topics to use our new model.&lt;/li&gt;
    &lt;li&gt;We officially recommend that all new Angular applications adopt our new configuration model from the start.&lt;/li&gt;
    &lt;li&gt;All features introduced in the v25.1 release require new configuration components.&lt;/li&gt;
&lt;/ul&gt;
&lt;h4&gt;
    DevExtreme v25.2 Release 
&lt;/h4&gt;
&lt;ul&gt;
    &lt;li&gt;Using legacy configuration components will trigger &lt;b&gt;deprecation warnings&lt;/b&gt;, indicating that these components are obsolete. &lt;/li&gt;
    &lt;li&gt;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 &lt;b&gt;require&lt;/b&gt; the use of new configuration components.&lt;/li&gt;
    &lt;li&gt;We will provide documentation, migration guidelines, and helper tools to make the transition to our new architecture as smooth as possible.&lt;/li&gt;
&lt;/ul&gt;
&lt;h4&gt;
    DevExtreme v26.1 Release 
&lt;/h4&gt;
&lt;p&gt;
    We will continue to &lt;b&gt;support those users migrating to our new configuration components&lt;/b&gt;. Our goal is to ensure that everyone has the resources and guidance needed to complete the transition smoothly. 
&lt;/p&gt;
&lt;h4&gt;
    DevExtreme v26.2 Release 
&lt;/h4&gt;
&lt;p&gt;
    &lt;b&gt;All legacy configuration components will be removed&lt;/b&gt; from our codebase. 
&lt;/p&gt;
&lt;br&gt;
&lt;p&gt;
    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. 
&lt;/p&gt;
&lt;p&gt;
    We believe that strict typing is not just a trend — it&amp;#39;s essential for scalable, predictable, and safe development. As always, we welcome your thoughts, comments, and suggestions:&lt;/p&gt;&lt;div data-survey-id="2e9669b5-2861-407f-8ee9-44745a8b6d27" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Mon, 07 Jul 2025 23:41:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>If you&amp;#39;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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388240</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2025/04/21/devextreme-early-access-preview-v25-1.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2025">2025</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/EAP">EAP</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/prerelease">prerelease</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/TypeScript">TypeScript</category>
      <category domain="https://community.devexpress.com/Tags/v25.1">v25.1</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme JS &amp; ASP.NET Core — Early Access Preview (v25.1) </title>
      <description>&lt;h2&gt;&lt;span style="color:#ff0000;"&gt;UPDATE:&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/subscriptions/whats-new/#devextreme" target="_blank" style="color:#115bc0;"&gt;What&amp;#39;s New in DevExtreme v25.1&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Our next major release (v25.1) is just a couple of months away. Here&amp;#39;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 &lt;a href="https://supportcenter.devexpress.com/ticket/create" target="_blank"&gt;DevExpress Support Center&lt;/a&gt; or use the embedded survey to submit direct feedback.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20EAP/EAP%20-%20social.png" alt="DevExtreme v25.1 Early Access Preview for Angular, React, Vue, jQuery, and ASP.NET Core" style="width:3840px;height:1960px;"&gt;
&lt;p&gt;&lt;strong&gt;Installation&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;If you own an active &lt;a href="https://www.devexpress.com/buy/net/" target="_blank"&gt;Universal or DXperience&lt;/a&gt; subscription, you can download our EAP build via the DevExpress &lt;a href="https://www.devexpress.com/ClientCenter/DownloadManager/" target="_blank"&gt;DownloadManager&lt;/a&gt; or appropriate &lt;a href="https://nuget.devexpress.com/packages" target="_blank"&gt;NuGet packages&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;To begin using the DevExtreme v25.1 EAP build, simply install target framework related NPM packages (marked with the &lt;code class="language-js"&gt;25.1-next&lt;/code&gt; tag). Use one of the following commands to proceed:&lt;/p&gt;
&lt;pre&gt;&lt;code class="language-cmdline"&gt;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&lt;/code&gt;&lt;/pre&gt;
&lt;div class="Note"&gt;&lt;p&gt;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.&lt;/p&gt;
    &lt;p&gt;
        Early Access Preview build is considered pre-release software, and you will see a &lt;a href="https://js.devexpress.com/Documentation/ApiReference/Common/Utils/Errors_and_Warnings/#W0022" target="_blank"&gt;W0022&lt;/a&gt; error in your browser console. 
    &lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;&lt;/div&gt;
&lt;a name="stepper"&gt;&lt;/a&gt;
&lt;h2&gt;New Stepper Component&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;Our Early Access Preview includes a new Stepper UI component. DevExtreme Stepper displays progress as users move through a sequence. It&amp;#39;s ideal for multi-step processes, such as populating&amp;nbsp;forms, onboarding, or app&amp;nbsp;wizards.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20EAP/stepper.gif" alt="DevExtreme Stepper" style="width:1283px;height:347px;"&gt;
&lt;p&gt;DevExtreme Stepper supports the following capabilities/options:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;DataSource integration&lt;/li&gt;
&lt;li&gt;Horizontal or vertical layout&lt;/li&gt;
&lt;li&gt;Navigation modes (step through sequentially or skip)&lt;/li&gt;
&lt;li&gt;Pre-selected steps&lt;/li&gt;
&lt;li&gt;Custom icons or text for step indicators&lt;/li&gt;
&lt;li&gt;Step titles&lt;/li&gt;
&lt;li&gt;Visual step validation&lt;/li&gt;
&lt;li&gt;Optional and disabled steps&lt;/li&gt;
&lt;li&gt;Keyboard navigation&lt;/li&gt;
&lt;li&gt;Internationalization (right-to-left)&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;You can specify whether Stepper is horizontal or vertical using the &lt;code class="language-js"&gt;orientation&lt;/code&gt; property. Change navigation mode to linear or non-linear using the &lt;code class="language-js"&gt;linear&lt;/code&gt; property. Preselect an item by index using the &lt;code class="language-js"&gt;selectedIndex&lt;/code&gt; option. The &lt;code class="language-js"&gt;selectOnFocus&lt;/code&gt; option determines if items are selected automatically when focused via the keyboard.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20EAP/Stepper%20-%20Orientation@2x.png" alt="Stepper orientation modes: vertical and horizontal" style="width:1640px;height:792px;"&gt;
&lt;p&gt;You can customize each step using the following settings:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code class="language-js"&gt;icon&lt;/code&gt;: sets an icon inside the step indicator.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;text&lt;/code&gt;: incorporates text within the step indicator.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;title&lt;/code&gt;: places a caption next to the step.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;isValid&lt;/code&gt;: visually indicates validation state.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;optional&lt;/code&gt;: visually marks as optional.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;disabled&lt;/code&gt;: disables the step.&lt;/li&gt;
&lt;li&gt;&lt;code class="language-js"&gt;hint&lt;/code&gt;: adds an in-browser hint.&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="Note"&gt;&lt;p&gt;Example: &lt;a href="https://codepen.io/EugeniyKiyashko/pen/jEOzBQG" target="_blank"&gt;jQuery&lt;/a&gt;.&lt;/p&gt;&lt;/div&gt;
&lt;p&gt;If using&amp;nbsp;Angular to evaluate/test our EAP, we recommend the use of our &lt;a href="https://js.devexpress.com/Angular/New/24_2/#new-configuration-components" target="_blank"&gt;new configuration components&lt;/a&gt;:&lt;/p&gt;&lt;pre&gt;&lt;code class="language-html"&gt;&amp;lt;dx-stepper&amp;gt; 
    &amp;lt;dxi-stepper-item text=&amp;quot;1&amp;quot;&amp;gt;&amp;lt;/dxi-stepper-item&amp;gt; 
    &amp;lt;dxi-stepper-item text=&amp;quot;2&amp;quot; [optional]=&amp;quot;true&amp;quot; &amp;gt;&amp;lt;/dxi-stepper-item&amp;gt; 
    &amp;lt;dxi-stepper-item icon=&amp;quot;gift&amp;quot;&amp;gt;&amp;lt;/dxi-stepper-item&amp;gt; 
&amp;lt;/dx-stepper&amp;gt; &lt;/code&gt;&lt;/pre&gt;&lt;div data-survey-id="b8353e57-24b9-41d7-8b30-c651a781f09f" data-survey-auth-required="false"&gt;&lt;/div&gt;
&lt;a name="scheduler-toolbar"&gt;&lt;/a&gt;
&lt;h2&gt;Scheduler – Toolbar Customization&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;Angular, React, jQuery, Vue&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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&amp;nbsp;custom items like a Today button, a new appointment button, or a custom resource selector to our built-in toolbar. &lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20EAP/Scheduler%20-%20Toolbar%20Customization@2x.png" alt="DevExtreme Scheduler with customized toolbar" style="width:2120px;height:1170px;"&gt;&lt;br&gt;&lt;p&gt;Specify the &lt;code class="language-js"&gt;toolbar&lt;/code&gt; property to include desired items. You can set the &lt;code class="language-js"&gt;location&lt;/code&gt; for each item (much like our standalone &lt;a href="https://js.devexpress.com/jQuery/Documentation/Guide/UI_Components/Toolbar/Getting_Started_with_Toolbar/" target="_blank"&gt;Toolbar&lt;/a&gt;). For DevExtreme components, specify associated&lt;code class="language-js"&gt;options&lt;/code&gt;. To introduce unique elements, use a custom &lt;code class="language-js"&gt;template&lt;/code&gt;.&lt;/p&gt;&lt;pre&gt;&lt;code class="language-js" data-line="5, 19, 21"&gt;$(&amp;#39;#scheduler&amp;#39;).dxScheduler({ 
    // ... 
    toolbar: { 
        items: [ 
            // DevExtreme components: dxButton 
            { 
                location: &amp;#39;before&amp;#39;, 
                locateInMenu: &amp;#39;auto&amp;#39;, 
                widget: &amp;#39;dxButton&amp;#39;, 
                options: { 
                    text: &amp;#39;Today&amp;#39;, 
                    stylingMode: &amp;#39;outlined&amp;#39;, 
                    type: &amp;#39;normal&amp;#39;, 
                    onClick() { 
                        scheduler.option(&amp;#39;currentDate&amp;#39;, new Date()); 
                    }, 
                }, 
            }, 
            // Predefined toolbar&amp;#39;s elements 
            &amp;#39;dateNavigator&amp;#39;, 
            // Custom element 
            { 
                template: &amp;#39;&amp;lt;div&amp;gt;Custom Item&amp;lt;/div&amp;gt;&amp;#39;, 
            }, 
        ] 
    } 
}); &lt;/code&gt;&lt;/pre&gt;&lt;p&gt;Predefined items include &amp;quot;dateNavigator&amp;quot; and &amp;quot;viewSwitcher&amp;quot;. If you do not specify the &lt;code class="language-js"&gt;toolbar&lt;/code&gt; explicitly, the default toolbar with these two items is displayed on-screen.&amp;nbsp;&lt;/p&gt;
&lt;p&gt;You can also switch button order&amp;nbsp;used in the “dateNavigator” and decide which buttons to display on-screen.&lt;/p&gt;&lt;pre&gt;&lt;code class="language-js"&gt;toolbar: { 
    items: [ 
        { 
           location: &amp;#39;before&amp;#39;, 
           name: &amp;#39;dateNavigator&amp;#39;,   
           options: { 
               items: [&amp;#39;dateInterval&amp;#39;, &amp;#39;prev&amp;#39;, &amp;#39;next&amp;#39;],   
           }, 
        }, 
    ] 
} &lt;/code&gt;&lt;/pre&gt;&lt;p&gt;The example below also demonstrates use of DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Button/Overview/" target="_blank"&gt;Button&lt;/a&gt; (switch to Today) and &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/SelectBox/Overview/" target="_blank"&gt;SelectBox&lt;/a&gt; (choose resources) in the toolbar.&lt;/p&gt;
&lt;div class="Note"&gt;&lt;p&gt;Example: &lt;a href="https://codepen.io/Ember2890/pen/MYWVooa" target="_blank"&gt;jQuery&lt;/a&gt;.&lt;/p&gt;&lt;/div&gt;
&lt;p&gt;If using Angular to test our EAP, you must&amp;nbsp;use our &lt;a href="https://js.devexpress.com/Angular/New/24_2/#new-configuration-components" target="_blank"&gt;new configuration components&lt;/a&gt; when working with toolbar items:&lt;/p&gt;&lt;pre&gt;&lt;code class="language-html" data-line="2"&gt;&amp;lt;dxo-scheduler-toolbar&amp;gt; 
    &amp;lt;dxi-scheduler-toolbar-item  
        name=&amp;quot;dateNavigator&amp;quot;  
        location=&amp;quot;before&amp;quot;  
        [options]=&amp;quot;{items: [&amp;#39;dateInterval&amp;#39;, &amp;#39;prev&amp;#39;, &amp;#39;next&amp;#39;]}&amp;quot;&amp;gt; 
    &amp;lt;/dxi-scheduler-toolbar-item&amp;gt; 
&amp;lt;/dxo-scheduler-toolbar&amp;gt; &lt;/code&gt;&lt;/pre&gt;&lt;div data-survey-id="39aa8afc-4f64-481a-a2a9-6a8b2aef2f9f" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="map-routes"&gt;&lt;/a&gt;
&lt;h2&gt;Map – Custom Route Modes&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;With this EAP, DevExtreme Map allows you to set custom route options for various transportation types.&lt;/p&gt;
&lt;p&gt;
    Azure map &amp;#39;car&amp;#39; route mode:
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/custom%20routes-default@2x.png" alt="DevExtreme Map: Azure map car route mode" style="width:1200px;height:660px;"&gt;
&lt;p&gt;
    Azure map &amp;#39;truck&amp;#39; route mode:
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/custom%20routes-truck@2x.png" alt="DevExtreme Map: Azure map truck route mode" style="width:1200px;height:660px;"&gt;
&lt;p&gt;Note that each Map provider (&lt;a href="https://learn.microsoft.com/en-us/rest/api/maps/route/get-route-directions?view=rest-maps-1.0&amp;amp;viewFallbackFrom=rest-maps-2024-04-01&amp;amp;tabs=HTTP#travelmode" target="_blank"&gt;Azure&lt;/a&gt;, &lt;a href="https://developers.google.com/maps/documentation/javascript/directions#TravelModes" target="_blank"&gt;Google&lt;/a&gt;, &lt;a href="https://learn.microsoft.com/en-us/bingmaps/v8-web-control/modules/directions-module/routemode-enumeration" target="_blank"&gt;Bing&lt;/a&gt;) has its own set of route modes. Pass a string with the desired route name to the &lt;code class="language-js"&gt;routes[].mode&lt;/code&gt; property to test this feature. For instance, you can switch default &amp;#39;car&amp;#39; route type in Azure maps to a custom route mode like &amp;#39;bicycle&amp;#39; or &amp;#39;truck&amp;#39;.&lt;/p&gt;&lt;div data-survey-id="8f0a04dc-1ec7-4d30-8144-7a4db6c4ae60" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="react-vite"&gt;&lt;/a&gt;
&lt;h2&gt;Create React Applications with Vite&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;React&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;Previously, DevExtreme CLI used &lt;a href="https://create-react-app.dev/" target="_blank"&gt;create-react-app&lt;/a&gt; (CRA) as a build tool for React applications. In February 2025, CRA was &lt;a href="https://react.dev/blog/2025/02/14/sunsetting-create-react-app" target="_blank"&gt;deprecated&lt;/a&gt;. With this EAP, we switched from CRA to &lt;a href="https://vite.dev/" target="_blank"&gt;Vite&lt;/a&gt; when creating DevExtreme React applications.&lt;/p&gt;
&lt;p&gt;When creating a new app, DevExtreme CLI now allows you to choose between JS transpilers: &lt;a href="https://babeljs.io/" target="_blank"&gt;Babel&lt;/a&gt; (used previously as the default) and &lt;a href="https://swc.rs/" target="_blank"&gt;SWC&lt;/a&gt;. To test this capability, select transpiler type in a terminal:&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20EAP/command-line.png" alt="DevExtreme CLI: a &amp;quot;Specify desired transpiler type&amp;quot; prompt in the command line" style="width:1400px;height:400px;"&gt;&lt;p&gt;Or you can add a &lt;code class="language-js"&gt;--transpiler=swc&lt;/code&gt; or &lt;code class="language-js"&gt;--transpiler=babel&lt;/code&gt; argument to the first command:&lt;/p&gt;&lt;pre&gt;&lt;code class="language-cmdline"&gt;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 &lt;/code&gt;&lt;/pre&gt;&lt;p&gt;After creating a project, run the following commands:&lt;/p&gt;&lt;pre&gt;&lt;code class="language-cmdline"&gt;cd app-name  
npm run dev &lt;/code&gt;&lt;/pre&gt;&lt;p&gt;In addition to Vite, we plan to add an option for &lt;a href="https://nextjs.org/" target="_blank"&gt;Next.js&lt;/a&gt; build in our official v25.1 release.&lt;/p&gt;&lt;div data-survey-id="0216573a-01d0-449e-a96b-6974ce221803" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Mon, 21 Apr 2025 06:32:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>Our next major release (v25.1) is just a couple of months away. Here&amp;#39;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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388229</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2025/03/10/devextreme-flexible-layouts-with-splitter.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2025">2025</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/Layout">Layout</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/Splitter">Splitter</category>
      <category domain="https://community.devexpress.com/Tags/TypeScript">TypeScript</category>
      <category domain="https://community.devexpress.com/Tags/v24.1">v24.1</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme – Create Flexible Layouts with the DevExtreme Splitter Component </title>
      <description>&lt;img src="https://community.devexpress.com:443/blogs/javascript/20250306-devextreme-splitter/FLEXIBLE_LAYOUT.png" alt="Create flexible layouts with the DevExtreme Splitter component" style="width:1920px;height:900px;"&gt;
&lt;p&gt;When building an app, static layouts may not be enough. By using a &amp;quot;splitter&amp;quot; component, you can convert static page layouts to one that adapts to the needs of each individual user.&lt;/p&gt;
&lt;p&gt;As you&amp;#39;ll soon see, the &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Splitter/Getting_Started_with_Splitter/" target="_blank"&gt;DevExtreme Splitter UI component&lt;/a&gt; was designed to split a page layout into multiple resizable panes (page sections).&lt;/p&gt;
&lt;p&gt;In this blog post, I&amp;#39;ll explore a simple yet highly popular layout-related use case: resizing layout &amp;quot;sections&amp;quot; to display more business data (and of course, I&amp;#39;ll be using the DevExtreme Splitter to do so). Below is the final page layout. Click the gif to see it in full screen:&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/20250306-devextreme-splitter/Splitter-gif.gif" alt="A split layout with a grid on the left and a chart on the right" style="width:2180px;height:860px;"&gt;
&lt;div class="Note"&gt;&lt;p&gt;Select one of the following supported dev frameworks to test the example:&lt;/p&gt;
&lt;p&gt;&lt;a href="https://codesandbox.io/p/sandbox/p3smx5?file=%2Fsrc%2Fapp%2Fapp.component.html" target="_blank"&gt;Angular&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/wxslnx?file=%2FApp.tsx" target="_blank"&gt;React&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/fv9m5d?file=%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt; | &lt;a href="https://codepen.io/16adianay/pen/GgKjGBj" target="_blank"&gt;jQuery&lt;/a&gt;&lt;/p&gt;&lt;/div&gt;
&lt;h2&gt;Implementation Details&lt;/h2&gt;
&lt;p&gt;The DevExtreme Splitter divides a layout &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/Splitter/Getting_Started_with_Splitter/#Configure_Panes" target="_blank"&gt;into panes&lt;/a&gt;. These panes can be configured with the following basic settings:&lt;/p&gt;
&lt;table&gt;
&lt;tr&gt;
&lt;th&gt;Option&lt;/th&gt;
&lt;th&gt;Description&lt;/th&gt;
&lt;th&gt;Default value&lt;/th&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#resizable" target="_blank"&gt;resizable&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Users can modify pane size.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;true&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#collapsible" target="_blank"&gt;collapsible&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Users can collapse the pane.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;false&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#size" target="_blank"&gt;size&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Initial pane size.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;undefined&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#minSize" target="_blank"&gt;minSize&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Minimum pane size.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;undefined&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#maxSize" target="_blank"&gt;maxSize&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Maximum pane size.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;undefined&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#collapsedSize" target="_blank"&gt;collapsedSize&lt;/a&gt;&lt;/td&gt;
&lt;td&gt;Pane size when collapsed.&lt;/td&gt;
&lt;td&gt;&lt;code&gt;undefined&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;

&lt;/table&gt;
&lt;p&gt;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 &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/#template" target="_blank"&gt;template&lt;/a&gt; or use the following method (declare directly using Item markup).&lt;/p&gt;&lt;pre&gt;&lt;code class="language-html"&gt;&amp;lt;Splitter onResize={onResize} id=&amp;quot;splitter&amp;quot; height=&amp;quot;auto&amp;quot;&amp;gt; 
    &amp;lt;Item minSize={250}&amp;gt; 
        &amp;lt;DataGridComponent ref={grid} /&amp;gt; 
    &amp;lt;/Item&amp;gt; 
    &amp;lt;Item minSize={250} size=&amp;quot;55%&amp;quot;&amp;gt; 
        &amp;lt;ChartComponent /&amp;gt; 
    &amp;lt;/Item&amp;gt; 
&amp;lt;/Splitter&amp;gt; &lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This example adds the DevExtreme &lt;a href="https://js.devexpress.com/React/Documentation/Guide/UI_Components/DataGrid/Overview/" target="_blank"&gt;DataGrid&lt;/a&gt; and &lt;a href="https://js.devexpress.com/React/Documentation/Guide/UI_Components/Chart/Overview/" target="_blank"&gt;Chart&lt;/a&gt; components to the pane.&lt;/p&gt;
&lt;p&gt;In this particular instance, users can view hidden DataGrid columns by expanding the Splitter&amp;#39;s leftmost pane. For DataGrid adaptive mode, enable the &lt;a href="https://js.devexpress.com/jQuery/Documentation/ApiReference/UI_Components/dxDataGrid/Configuration/#columnHidingEnabled" target="_blank"&gt;columnHidingEnabled&lt;/a&gt; option. Call the &lt;a href="https://js.devexpress.com/jQuery/Documentation/ApiReference/UI_Components/dxDataGrid/Methods/#updateDimensions" target="_blank"&gt;updateDimensions&lt;/a&gt; method within the onResize function to adapt container size changes (for additional information in this regard, please refer to our &lt;a href="https://js.devexpress.com/jQuery/Documentation/Guide/UI_Components/DataGrid/Columns/Adaptability/" target="_blank"&gt;Adaptability&lt;/a&gt; help topic).&lt;/p&gt;&lt;pre&gt;&lt;code class="language-js"&gt;const onResize = useCallback(() =&amp;gt; { 
    cancelAnimationFrame(animationRefFrame.current); 
    animationRefFrame.current = requestAnimationFrame(() =&amp;gt; 
        grid.current.instance().updateDimensions() 
    ); 
}, [grid]); &lt;/code&gt;&lt;/pre&gt;
&lt;h2&gt;Customize Splitter Appearance&lt;/h2&gt;
&lt;p&gt;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.&lt;/p&gt;
&lt;p&gt;For instance, you can modify &lt;a href="https://js.devexpress.com/jQuery/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/#separatorSize" target="_blank"&gt;separator bar width&lt;/a&gt; in pixels. You can also modify component appearance with custom CSS rules.&lt;/p&gt;
&lt;p&gt;For this sample, we used custom CSS to modify both the Splitter and its panes:&lt;/p&gt;&lt;pre&gt;&lt;code class="language-css"&gt;// 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 &amp;gt; .dx-bordered-bottom-view { 
     border-radius: 0 0 8px 8px !important; 
} &lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;As the following image illustrates, you can personalize the Splitter separator as requirements dictate (through settings, CSS styles, etc).&lt;/p&gt;&lt;img src="https://community.devexpress.com:443/blogs/javascript/20250306-devextreme-splitter/Splitter%20types%201.png" alt="3 types of the splitter bar appearance: resizable only (a handle icon appears), resizable and collapsible (the collapse arrows are added to the handle icon), and a custom handle (fully customized handle using CSS)" style="width:986px;height:380px;"&gt;&lt;p&gt;&lt;br&gt;&lt;/p&gt;
&lt;h2&gt;UI Templates for Additional Layout Strategies&lt;/h2&gt;
&lt;p&gt;This sample layout was inspired by the DevExtreme &lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/AnalyticsDashboard/MaterialBlueLight/Compact/" target="_blank"&gt;UI Template Gallery&lt;/a&gt;. Our UI Template Gallery (for Angular, React, and Vue) includes app templates for a variety of page layouts/usage scenarios including the following:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/CrmContactList/MaterialBlueLight/Compact/" target="_blank"&gt;CRM&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/PlanningTaskList/MaterialBlueLight/Compact/" target="_blank"&gt;Planning&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/AnalyticsSalesReport/MaterialBlueLight/Compact/" target="_blank"&gt;&lt;strong&gt;Dashboards&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/SignInForm/MaterialBlueLight/Compact/" target="_blank"&gt;Authentication forms&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Templates/UserProfile/MaterialBlueLight/Compact/" target="_blank"&gt;User profiles&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Whether you&amp;#39;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.&lt;/p&gt;
&lt;h2&gt;Your Feedback Counts&lt;/h2&gt;
&lt;p&gt;Please take a moment and share your thoughts/requirements with us.&lt;/p&gt;&lt;div data-survey-id="b67beff0-5b6f-4778-93fd-74df9f5f5d42" data-survey-auth-required="false"&gt;&lt;/div&gt;&lt;br&gt;</description>
      <pubDate>Mon, 10 Mar 2025 00:10:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>When building an app, static layouts may not be enough. By using a &amp;quot;splitter&amp;quot; component, you can convert static page layouts to one that adapts to the needs of each individual user</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388223</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2025/02/21/devextreme-roadmap-v25-1.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2025">2025</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/Roadmap">Roadmap</category>
      <category domain="https://community.devexpress.com/Tags/v25.1">v25.1</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme — June 2025 Roadmap (v25.1 - Angular, React, Vue, jQuery &amp; ASP.NET Core)</title>
      <description>&lt;h2&gt;&lt;span style="color:#ff0000;"&gt;UPDATE:&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/subscriptions/whats-new/#devextreme" target="_blank" style="color:#115bc0;"&gt;What&amp;#39;s New in DevExtreme v25.1&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;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 &lt;a href="https://supportcenter.devexpress.com/ticket/create" target="_blank"&gt;DevExpress Support Center&lt;/a&gt;. We’ll be happy to follow up.&lt;/p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/DX-RM.png" alt="DevExtreme v25.1 Roadmap" style="width:3840px;height:1960px;"&gt;
&lt;div class="Note"&gt;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.&lt;/div&gt;&lt;h2&gt;
    New Components
&lt;/h2&gt;
&lt;h3&gt;
    CardView
&lt;/h3&gt;
&lt;p&gt;
    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 &amp;quot;card&amp;quot; UI metaphor (a visually engaging alternative to traditional grid views).
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Cardview@2x.png" alt="DevExtreme CardView component: cards with employees " style="width:2632px;height:2096px;"&gt;
&lt;p&gt;
    The DevExtreme CardView will ship with the following built-in data management capabilities:
&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;Sorting&lt;/li&gt;
    &lt;li&gt;Paging&lt;/li&gt;
    &lt;li&gt;Column reordering&lt;/li&gt;
    &lt;li&gt;Column visibility control&lt;/li&gt;
    &lt;li&gt;Editing&lt;/li&gt;
    &lt;li&gt;Filtering&lt;/li&gt;
    &lt;li&gt;Searching&lt;/li&gt;
    &lt;li&gt;Data selection&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;
    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).
&lt;/p&gt;
&lt;p&gt;
    CardView card layouts will be fully responsive, will support multiple screen sizes, and will ship with two layout options:
&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;&lt;b&gt;Automatic Layout:&lt;/b&gt; 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.&lt;/li&gt;
    &lt;li&gt;&lt;b&gt;Fixed Number of Cards per Row:&lt;/b&gt; 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.&lt;/li&gt;
&lt;/ul&gt;
&lt;h3&gt;
    Stepper
&lt;/h3&gt;
&lt;p&gt;
    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.&amp;nbsp;
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Stepper%20(Light%20and%20Dark)@2x.png" alt="DevExtreme Stepper component: steps for checkout" style="width:1800px;height:832px;"&gt;
&lt;p&gt;
    You will be able to customize the appearance of individual steps and modify component settings to address specific usage scenarios.
&lt;/p&gt;
&lt;h2&gt;
    AI-powered Extensions
&lt;/h2&gt;
&lt;p&gt;
    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 &lt;a href="https://js.devexpress.com/Demos/WidgetsGallery/Demo/Chat/AIAndChatbotIntegration/" target="_blank"&gt;Chat UI component&lt;/a&gt;. 
&lt;/p&gt;
&lt;p&gt;
    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.
&lt;/p&gt;
&lt;p&gt;
    Our new AI-powered Extensions will be accessed through a dedicated button in the HTML Editor’s toolbar.
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Html-ai@2x.png" alt="DevExtreme HTML Editor with built-in AI commands" style="width:1600px;height:934px;"&gt;
&lt;h2&gt;
    Chat Enhancements
&lt;/h2&gt;
&lt;h3&gt;
    Editing and Deleting Messages
&lt;/h3&gt;
&lt;p&gt;
    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.
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Editing@2x.png" alt="DevExtreme Chat: edit and delete icons above a message" class="small" style="width:2320px;height:772px;"&gt;
&lt;p&gt;
    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 &lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/Push_API" target="_blank"&gt;Push API&lt;/a&gt;s.   
&lt;/p&gt;
&lt;h3&gt;
    Image Rendering
&lt;/h3&gt;
&lt;p&gt;
    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 &lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxChat/Configuration/#messageTemplate" target="_blank"&gt;messageTemplate&lt;/a&gt; property.
&lt;/p&gt;
&lt;p&gt;
    With v25.1, we will simplify configuration when displaying images within messages.
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Chat%20Images%20(sbs)@2x.png" alt="DevExtreme Chat: a chatbot sends 2 images" style="width:2320px;height:1880px;"&gt;
&lt;p&gt;
    You will be able to easily render an image received in responses. For example, if you use &lt;a href="https://openai.com/index/dall-e-3/" target="_blank"&gt;DALL-E&lt;/a&gt; or a similar AI service to generate pictures, you can set up image rendering using our Chat component.
&lt;/p&gt;
&lt;h2&gt;
    Scheduler – Toolbar Customization
&lt;/h2&gt;
&lt;p&gt;
    In v25.1, the DevExtreme Scheduler will include a customizable integrated toolbar.
&lt;/p&gt;
&lt;p&gt;
    Configuration options will include:
&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;&lt;b&gt;Choosing from predefined elements:&lt;/b&gt; Select and arrange built-in elements as needed.&lt;/li&gt;
    &lt;li&gt;&lt;b&gt;Adding DevExtreme components:&lt;/b&gt; Include and configure DevExtreme components like Button or Checkbox in the toolbar.&lt;/li&gt;
    &lt;li&gt;&lt;b&gt;Inserting custom elements:&lt;/b&gt; Define templates for custom elements within toolbar items for a curated experience.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;
    For instance, in the screenshot below, our new toolbar includes two custom buttons: &amp;quot;Today&amp;quot; and &amp;quot;New event&amp;quot;.&amp;nbsp;
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/Scheduler%20-%20Toolbar@2x.png" alt="DevExtreme Scheduler with a custom toolbar" style="width:1692px;height:930px;"&gt;
&lt;h2&gt;
    Map – Custom Route Modes
&lt;/h2&gt;
&lt;p&gt;
    DevExtreme Map will allow you to define custom route modes for different transportation types. Each Map provider (&lt;a href="https://learn.microsoft.com/en-us/rest/api/maps/route/get-route-directions?view=rest-maps-2024-04-01&amp;amp;tabs=HTTP#travelmode" target="_blank"&gt;Azure&lt;/a&gt;, &lt;a href="https://developers.google.com/maps/documentation/javascript/directions#TravelModes" target="_blank"&gt;Google&lt;/a&gt;, &lt;a href="https://learn.microsoft.com/en-us/bingmaps/v8-web-control/modules/directions-module/routemode-enumeration" target="_blank"&gt;Bing&lt;/a&gt;) 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.
&lt;/p&gt;
&lt;p&gt;
    For instance, in addition to a standard &amp;#39;car&amp;#39; route in Azure maps, you will be able to define custom route modes like &amp;#39;bicycle&amp;#39; and &amp;#39;truck&amp;#39;.
&lt;/p&gt;
&lt;p&gt;
    Azure map &amp;#39;car&amp;#39; route mode:
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/custom%20routes-default@2x.png" alt="DevExtreme Map: Azure map car route mode" style="width:1200px;height:660px;"&gt;
&lt;p&gt;
    Azure map &amp;#39;truck&amp;#39; route mode:
&lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2025.1%20Roadmap/custom%20routes-truck@2x.png" alt="DevExtreme Map: Azure map truck route mode" style="width:1200px;height:660px;"&gt;
&lt;h2&gt;
    Accessibility
&lt;/h2&gt;
&lt;p&gt;
    We expect to address a range of accessibility issues in both the DevExtreme &lt;b&gt;DataGrid&lt;/b&gt; and &lt;b&gt;Scheduler&lt;/b&gt;. 
&lt;/p&gt;
&lt;h2&gt;
    DevExtreme CLI
&lt;/h2&gt;
&lt;h3&gt;
    Create a Standalone Angular Application
&lt;/h3&gt;
&lt;p&gt;
    Angular introduced &lt;a href="https://angular.dev/guide/components#imports-in-the-component-decorator" target="_blank"&gt;standalone&lt;/a&gt;&amp;nbsp;components in v14. In v19, default components created with &lt;a href="https://angular.dev/tools/cli" target="_blank"&gt;Angular CLI&lt;/a&gt; are now standalone. To match this trend, we will transition from modules to standalone components in DevExtreme CLI Angular applications.
&lt;/p&gt;
&lt;h3&gt;
    Create React Applications with Vite and Next.js
&lt;/h3&gt;
&lt;p&gt;
    &lt;span&gt;As you may already know, the&amp;nbsp;create-react-app (CRA) utility - a key resource for React projects - was &lt;a id="menurlbv" href="https://react.dev/blog/2025/02/14/sunsetting-create-react-app" rel="noreferrer noopener" target="_blank"&gt;&lt;u&gt;recently deprecated&lt;/u&gt;&lt;/a&gt;. &lt;/span&gt;With DevExtreme v25.1, you will be able to select between &lt;a href="https://vite.dev/" target="_blank"&gt;Vite&lt;/a&gt; and &lt;a href="https://nextjs.org/" target="_blank"&gt;Next.js&lt;/a&gt;&amp;nbsp;(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.
&lt;/p&gt;
&lt;h2&gt;
    ASP.NET Core
&lt;/h2&gt;
&lt;h3&gt;
    Rich Text Editor – Zoom
&lt;/h3&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;ASP.NET and Blazor Subscription&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;Our Rich Text Editor&amp;#39;s built-in Ribbon will include a UI to specify zoom level for the current document.&lt;/p&gt;
&lt;img class="small" src="https://community.devexpress.com/blogs/aspnet/v25.1/rich-zoom.png" alt="rich text editor zoom"&gt;
&lt;p&gt;It will also be possible to control the current zoom level and its maximum/minimum values using the Rich Text Editor&amp;#39;s API.&lt;/p&gt;
&lt;a name="survey"&gt;&lt;/a&gt;
&lt;h2&gt;
    Your Feedback Matters
&lt;/h2&gt;
&lt;div data-survey-id="79e889d0-35bd-4e51-a9c4-dc33bf02d2b5" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Fri, 21 Feb 2025 03:10:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388208</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2024/10/17/devextreme-react-gatsby-or-next-js.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2024">2024</category>
      <category domain="https://community.devexpress.com/Tags/Chat">Chat</category>
      <category domain="https://community.devexpress.com/Tags/Dashboard">Dashboard</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/Gatsby">Gatsby</category>
      <category domain="https://community.devexpress.com/Tags/Next.js">Next.js</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <title>DevExtreme React —  Gatsby and Next.js</title>
      <description>&lt;p&gt;We recently updated the following &lt;a href="https://www.gatsbyjs.com/docs"&gt;Gatsby&lt;/a&gt;/&lt;a href="https://nextjs.org/docs"&gt;Next.js&lt;/a&gt;-related help topics on our website.&amp;nbsp;&amp;nbsp;&lt;/p&gt;&lt;img src="https://community.devexpress.com:443/blogs/javascript/20241015-devextreme-gatsby-nextjs/React@2x.png" alt="Build an App with Gatsby or Next.js" style="width:800px;height:375px;"&gt;
&lt;h2&gt;DevExtreme React + Next.js&lt;/h2&gt;
&lt;p&gt;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).&amp;nbsp;&lt;/p&gt;
&lt;div class="Note"&gt;&lt;p&gt;If you are new to DevExtreme or considering it for a future BI/Dashboard&amp;nbsp;project, be sure to check out our intuitive&amp;nbsp;&lt;a href="https://js.devexpress.com/React/Demos/WidgetsGallery/Demo/Templates/AnalyticsDashboard/MaterialBlueLight/Compact/"&gt;Dashboard UI templates&lt;/a&gt;.&lt;/p&gt;&lt;/div&gt;

&lt;p&gt;&lt;a href="https://js.devexpress.com/React/Documentation/Guide/Common/Integration_Guides/Create_a_DevExtreme_application_with_Next.js/"&gt;&lt;strong&gt;Create a DevExtreme-powered website/application with Next.js&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;DevExtreme React + Gatsby&lt;/h2&gt;
&lt;p&gt;Gatsby primarily focuses on SSG, performance,&amp;nbsp;and SEO (especially for content-centric websites such as blogs and product promotion/marketing).&lt;/p&gt;
&lt;div class="Note"&gt;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&amp;nbsp;&lt;a href="https://js.devexpress.com/React/Demos/WidgetsGallery/Demo/Chat/Overview/MaterialBlueLight/"&gt;Chat component&lt;/a&gt;&amp;nbsp;(set for release in December 2024).&lt;/div&gt;

&lt;p&gt;&lt;a href="https://js.devexpress.com/React/Documentation/Guide/Common/Integration_Guides/Create_a_DevExtreme_application_with_Gatsby/"&gt;&lt;strong&gt;Create a DevExtreme-powered website/application with Gatsby&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;br&gt;&lt;/p&gt;</description>
      <pubDate>Thu, 17 Oct 2024 03:43:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>We recently updated the following Gatsby/Next.js-related help topics on our website</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388191</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2024/09/25/devextreme-amazon-s3-and-azure-blob-storage.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2024">2024</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/Integration">Integration</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/TypeScript">TypeScript</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme – Integration with Amazon S3 and Azure Blob Storage (Angular, React, Vue, jQuery) </title>
      <description>&lt;p&gt;&lt;img src="https://community.devexpress.com/blogs/javascript/20240919-devextreme-amazon-azure-integration/Cloud-(Facebook).png" alt="DevExtreme Amazon S3 and Azure Blob Storage integration"&gt;&lt;br&gt;&lt;/p&gt;&lt;p&gt;Cloud services, such as &lt;a href="https://docs.aws.amazon.com/s3/?icmpid=docs_homepage_featuredsvcs" target="_blank"&gt;Amazon S3&lt;/a&gt; and &lt;a href="https://learn.microsoft.com/en-us/azure/storage/blobs/" target="_blank"&gt;Azure Blob Storage,&lt;/a&gt; offer object storage solutions for enterprises. Integrating these storage services into a DevExtreme-powered web application simplifies CRUD operations against user files.&lt;/p&gt;
&lt;p&gt;We recently released the following integration guides for those considering Amazon S3 or Azure Blob Storage:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#amazon"&gt;Manage Amazon S3 Storage with DevExtreme Components&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#azure"&gt;Manage Azure Blob Storage with DevExtreme Components&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;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.&lt;/p&gt;

&lt;a name="amazon"&gt;&lt;/a&gt;
&lt;h2&gt;Manage Amazon S3 Storage with DevExtreme Components&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Amazon&amp;#39;s Simple Storage Service (S3)&lt;/strong&gt; is often used to store application&amp;nbsp;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.&amp;nbsp;&lt;/p&gt;
&lt;p&gt;Our Amazon S3 integration guide&amp;nbsp;includes the following information:&amp;nbsp;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;How to use the AWS management console to configure S3 resources.&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to create a back-end .NET application that uses the Amazon SDK to query S3 APIs.&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to configure your client-side application to support multi-part AWS uploads.&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to use the&amp;nbsp;DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/FileManager/Getting_Started_with_File_Manager/" target="_blank"&gt;FileManager&lt;/a&gt; and &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/FileUploader/Overview/" target="_blank"&gt;FileUploader&lt;/a&gt; to communicate with AWS.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/Common/Integration_Guides/Manage_Amazon_S3_Storage_with_DevExtreme_Components/" target="_blank"&gt;&lt;strong&gt;Guide: Manage Amazon S3 Storage with DevExtreme Components&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://github.com/DevExpress-Examples/devextreme-file-manager-amazon-client-side-binding/" target="_blank"&gt;GitHub Example: FileManager - Amazon S3 Client-Side Binding&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://github.com/DevExpress-Examples/devextreme-file-uploader-direct-upload-to-amazon" target="_blank"&gt;GitHub Example: FileUploader - Direct Upload to Amazon&lt;/a&gt;&lt;/p&gt;

&lt;a name="azure"&gt;&lt;/a&gt;
&lt;h2&gt;Manage Azure Blob Storage with DevExtreme Components&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Azure Blob Storage&lt;/strong&gt; is a cloud-based service designed to store&amp;nbsp;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&amp;nbsp;like Amazon S3, is a great option for backups and hosting media files.&lt;/p&gt;
&lt;p&gt;Our Azure Blob Storage integration guide includes the following information:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;How to configure Microsoft Azure (create a new Storage account, blob container, etc.).&amp;nbsp;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to create a back-end application with basic/required configurations.&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to set up server-side and client-side binding options for the &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/FileManager/Getting_Started_with_File_Manager/" target="_blank"&gt;FileManager&lt;/a&gt; component&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
&lt;li&gt;How to use DevExtreme &lt;a href="https://js.devexpress.com/Documentation/Guide/UI_Components/FileUploader/Overview/" target="_blank"&gt;FileUploader&lt;/a&gt;.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;a href="https://js.devexpress.com/Documentation/Guide/Common/Integration_Guides/Manage_Azure_Blob_Storage_with_DevExtreme_Components/" target="_blank"&gt;&lt;strong&gt;Guide: Manage Azure Blob Storage with DevExtreme Components&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://github.com/DevExpress-Examples/devextreme-file-manager-azure-client-side-binding" target="_blank"&gt;GitHub Example: File Manager - Azure Client-Side Binding&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://github.com/DevExpress-Examples/devextreme-file-manager-azure-server-side-binding" target="_blank"&gt;GitHub Example: File Manager - Azure Server-Side Binding&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://github.com/DevExpress-Examples/devextreme-file-uploader-direct-upload-to-azure" target="_blank"&gt;GitHub Example: FileUploader - Direct Upload to Azure&lt;/a&gt;&lt;/p&gt;&lt;p&gt;
&lt;br&gt;
&lt;/p&gt;&lt;div data-survey-id="8276ac04-29cd-4092-9f98-5f8d02fd5e37" data-survey-auth-required="false"&gt;&lt;/div&gt;</description>
      <pubDate>Wed, 25 Sep 2024 23:10:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>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</dx:excerpt>
    </item>
    <item>
      <guid isPermaLink="false">bd716303-653c-428d-8b8a-a7d998cde032:388188</guid>
      <link>https://community.devexpress.com/Blogs/javascript/archive/2024/09/19/devextreme-early-access-preview-v24-2.aspx</link>
      <category domain="https://community.devexpress.com/Tags/2024">2024</category>
      <category domain="https://community.devexpress.com/Tags/Angular">Angular</category>
      <category domain="https://community.devexpress.com/Tags/ASP.NET+Core">ASP.NET Core</category>
      <category domain="https://community.devexpress.com/Tags/DevExtreme">DevExtreme</category>
      <category domain="https://community.devexpress.com/Tags/EAP">EAP</category>
      <category domain="https://community.devexpress.com/Tags/JavaScript">JavaScript</category>
      <category domain="https://community.devexpress.com/Tags/jQuery">jQuery</category>
      <category domain="https://community.devexpress.com/Tags/prerelease">prerelease</category>
      <category domain="https://community.devexpress.com/Tags/React">React</category>
      <category domain="https://community.devexpress.com/Tags/v24.2">v24.2</category>
      <category domain="https://community.devexpress.com/Tags/Vue">Vue</category>
      <title>DevExtreme JS &amp; ASP.NET Core — Early Access Preview (v24.2)</title>
      <description>&lt;h2&gt;&lt;span style="color:#ff0000;"&gt;UPDATE:&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/subscriptions/whats-new/#devextreme" target="_blank" style="color:#115bc0;"&gt;What&amp;#39;s New in DevExtreme v24.2&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Our next major release (v24.2) is a couple of months away. In this post, I&amp;#39;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 &lt;a href="https://www.devexpress.com/go/DevExtreme_EAP_v24.2_blog.aspx" target="_blank"&gt;DevExpress Support Center&lt;/a&gt;&amp;nbsp;or use the embedded survey to send us feature/product-related feedback.&amp;nbsp;&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/2024.2%20EAP/eap-headpic.png" alt="DevExtreme Early Access Preview v24.2" style="width:780px;height:398px;"&gt;
&lt;p&gt;&lt;strong&gt;Installation&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;span&gt;If you own an active&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/buy/net/" target="_blank"&gt;Universal or DXperience&lt;/a&gt;&lt;span&gt;&amp;nbsp;subscription, you can download our EAP build via the DevExpress&amp;nbsp;&lt;/span&gt;&lt;a href="https://www.devexpress.com/ClientCenter/DownloadManager/" target="_blank"&gt;DownloadManager&lt;/a&gt;&lt;span&gt;&amp;nbsp;or appropriate&amp;nbsp;&lt;/span&gt;&lt;a href="https://nuget.devexpress.com/packages" target="_blank"&gt;NuGet packages&lt;/a&gt;&lt;span&gt;.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;To begin using the DevExtreme v24.2 EAP build, simply install target framework related NPM packages (marked with the &lt;code class="language-js"&gt;24.2-next&lt;/code&gt; tag). Use one of the following commands  to proceed:&lt;/p&gt;
&lt;pre&gt;&lt;code class="language-cmdline"&gt;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&lt;/code&gt;&lt;/pre&gt;

&lt;div class="Note"&gt;&lt;p&gt;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.&lt;/p&gt;
    &lt;p&gt;
        Early Access Preview build is considered pre-release software, and you will see a &lt;a href="https://js.devexpress.com/Documentation/ApiReference/Common/Utils/Errors_and_Warnings/#W0022" target="_blank"&gt;W0022&lt;/a&gt; error in your browser console. 
    &lt;/p&gt;
&lt;p&gt;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.&lt;/p&gt;&lt;/div&gt;

&lt;a name="chat"&gt;&lt;/a&gt;
&lt;h2&gt;
    New Chat Component 
&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;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&amp;nbsp;application). &lt;/p&gt;
&lt;img src="https://community.devexpress.com/blogs/javascript/2024.2%20EAP/chat@2x%20(1).png" alt="New Chat component" data-before-src="https://community.devexpress.com/blogs/javascript/2024.2 EAP/chat-empty@2x.png" data-label-before="" data-label-after="" data-comparer-theme="dark"&gt;
&lt;p&gt;
    Key features included in the DevExtreme Chat component EAP build&amp;nbsp;include: 
&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;Accept and report&amp;nbsp;new messages.&lt;/li&gt;
    &lt;li&gt;Custom avatar support (initials used by default).&lt;/li&gt;
    &lt;li&gt;Sends messages using the &amp;quot;Send&amp;quot; button or Enter key. &lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;
    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&amp;nbsp;&lt;a href="https://community.devexpress.com/blogs/reporting/archive/2024/09/19/devexpress-reporting-early-access-preview-v24-2-svg-preview-ai-powered-enhancements-and-more.aspx" target="_blank"&gt;DevExpress Reporting EAP blog post&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;
    Select one of the following supported dev frameworks to explore the capabilities of the new DevExtreme JavaScript Chat component: 
&lt;/p&gt;
&lt;p&gt;
    &lt;a href="https://codesandbox.io/p/sandbox/loving-cherry-5vpl9g?file=%2Fsrc%2Fapp%2Fapp.component.ts" target="_blank"&gt;Angular&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-new-chat-component-react-forked-rdpfjw?file=%2FApp.tsx" target="_blank"&gt;React&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-new-chat-component-vue-forked-7fy2vf?file=%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt; | &lt;a href="https://codepen.io/EugeniyKiyashko/pen/gONNgEG?editors=1010" target="_blank"&gt;jQuery&lt;/a&gt; 
&lt;/p&gt;
&lt;div data-survey-id="457276df-6768-4c07-9dfb-82250f9550ad" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="sticky"&gt;&lt;/a&gt;
&lt;h2&gt;
    Data Grid/Tree List — Sticky Columns 
&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;
    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). &lt;/p&gt;
&lt;p&gt;In this EAP, a new (&lt;code class="language-js"&gt;sticky&lt;/code&gt;) value is available for the&amp;nbsp;&lt;code class="language-js"&gt;fixedColumn&lt;/code&gt; property. Sticky columns are initially fixed but move with the table once scrolled to a specific position. 
&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/2024.2%20EAP/grid_v2.gif" alt="DataGrid with sticky columns" style="width:650px;height:348px;" class="small"&gt;&lt;p&gt;Note: This feature is still under development, and some DataGrid/TreeList features (such as resizing, reordering, or data grouping) may not work as expected. &lt;/p&gt;
&lt;p&gt;We also redesigned our original “fixed column” engine (we now offer advanced CSS positioning). 
&lt;/p&gt;
&lt;p&gt;
    Select one of the following supported dev frameworks to explore the capabilities of our new Sticky Columns feature:
&lt;/p&gt;
&lt;p&gt;
    &lt;b&gt;DataGrid&lt;/b&gt;
&lt;/p&gt;
&lt;p&gt;
    &lt;a href="https://codesandbox.io/p/sandbox/hopeful-sutherland-ct5pj9?file=%2Fsrc%2Fapp%2Fapp.component.html" target="_blank"&gt;Angular&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-datagrid-sticky-columns-forked-ddsjww?file=%2FApp.tsx" target="_blank"&gt;React&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-datagrid-sticky-columns-forked-knwtm7?file=%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt; | &lt;a href="https://codepen.io/Alyar666-the-styleful/pen/eYwPBzp" target="_blank"&gt;jQuery&lt;/a&gt; 
&lt;/p&gt;
&lt;p&gt;
    &lt;b&gt;TreeList&lt;/b&gt;
&lt;/p&gt;
&lt;p&gt;
    &lt;a href="https://codesandbox.io/p/sandbox/strange-hermann-78f8ht?file=%2Fsrc%2Fapp%2Fapp.component.html" target="_blank"&gt;Angular&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-treelist-sticky-columns-forked-ysnzsr?file=%2Findex.html" target="_blank"&gt;React&lt;/a&gt; | &lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-treelist-sticky-columns-forked-653vcx?file=%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt; | &lt;a href="https://codepen.io/Alyar666-the-styleful/pen/wvLYopb" target="_blank"&gt;jQuery&lt;/a&gt; 
&lt;/p&gt;
&lt;div data-survey-id="30d5d9dd-b373-4ac1-a9c3-ab45f6da7fb7" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="selection"&gt;&lt;/a&gt;
&lt;h2&gt;
    Tabs/TabPanel/List — onSelectionChanging Event 
&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DevExtreme Tabs, TabPanel, and List share a common feature: selectable items.&lt;/p&gt;
&lt;p&gt;Currently, these components include an&amp;nbsp;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxAccordion/Configuration/#onSelectionChanged"&gt;onSelectionChanged&lt;/a&gt;&amp;nbsp;event that triggers once selections are finalized and the&amp;nbsp;&lt;a href="https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxAccordion/Configuration/#selectedItems"&gt;selectedItems&lt;/a&gt;&amp;nbsp;option updates. This timing can make it difficult to control selection changes based on user interaction.&lt;/p&gt;
&lt;p&gt;This EAP includes a new &lt;code class="language-js"&gt;onSelectionChanging&lt;/code&gt;&amp;nbsp;event for the aforementioned component libraries. The event helps track selection changes more effectively (for example, you can now prevent selection) and includes a &lt;code class="language-js"&gt;cancel&lt;/code&gt;&amp;nbsp;property, which can be Boolean or a JS Promise.&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/2024.2%20EAP/tabs%20(1).gif" alt="Tabs with onSelectionChanging in work" style="width:650px;height:416px;" class="small"&gt;&lt;p&gt;A common usage scenario&amp;nbsp;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 &lt;code class="language-js"&gt;onSelectionChanging&lt;/code&gt;&amp;nbsp;event and an API that supports promises, this scenario can be implemented quite easily.&lt;/p&gt;
&lt;p&gt;Select one of the following supported dev frameworks to explore the capabilities of the new onSelectionChanging event feature:&lt;/p&gt;
&lt;p&gt;&lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-new-chat-component-angular-forked-q2r3q6?file=%2Fsrc%2Fapp%2Fapp.component.ts" target="_blank"&gt;Angular&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-tabs-onselectionchanging-event-react-forked-ryhv9n?file=%2FApp.tsx" target="_blank"&gt;React&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codesandbox.io/p/sandbox/devextreme-eap-24-2-tabs-onselectionchanging-event-vue-forked-3xqgld?file=%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codepen.io/EugeniyKiyashko/pen/WNqqRmK?editors=0010" target="_blank"&gt;jQuery&lt;/a&gt;&lt;/p&gt;
&lt;div data-survey-id="997a3f10-c1a3-4d4d-a5a1-36ffebaef490" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="filtering"&gt;&lt;/a&gt;
&lt;h2&gt;
    DataSource — Case Sensitive Filtering  
&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;All Frameworks&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;DataSource can sort and filter data by locale, including special characters such symbols with diacritics (by using &lt;a href="https://js.devexpress.com/Documentation/ApiReference/Data_Layer/DataSource/Configuration/langParams/"&gt;langParams&lt;/a&gt; options).&lt;/p&gt;
&lt;p&gt;In this EAP, we added case sensitivity within&amp;nbsp;&lt;code class="language-js"&gt;langParams&lt;/code&gt;&amp;nbsp;options. As you can see in the image below, you can now introduce&amp;nbsp;case-aware filtering within DevExtreme UI components like our DataGrid.&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/2024.2%20EAP/CODE.gif" alt="Example of case-sensitive filtering" style="width:650px;height:326px;" class="small"&gt;&lt;p&gt;This EAP also refines filtering&amp;nbsp;for various locales (the filter is now more precise).&lt;/p&gt;
&lt;p&gt;Select one of the following supported dev frameworks to explore the capabilities of our new Case Sensitive Filtering feature:&lt;/p&gt;
&lt;p&gt;&lt;a href="https://codesandbox.io/p/devbox/devextreme-eap-24-2-case-sensitivity-filtering-t7gvv9?file=%2Fsrc%2Fapp%2Fapp.component.ts" target="_blank"&gt;Angular&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codesandbox.io/p/sandbox/devextreme-24-2-eap-case-sensitivity-filtering-9jkf23?file=%2Fsrc%2FApp.tsx%3A11%2C5" target="_blank"&gt;React&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codesandbox.io/p/devbox/devextreme-eap-24-2-case-sensitivity-filtering-hrg537?file=%2Fsrc%2FApp.vue" target="_blank"&gt;Vue&lt;/a&gt;&amp;nbsp;|&amp;nbsp;&lt;a href="https://codepen.io/gooddayforsurf/pen/VwJqYpZ?editors=0010" target="_blank"&gt;jQuery&lt;/a&gt;&lt;/p&gt;
&lt;div data-survey-id="1cf72537-f22e-4232-a496-8f833938c414" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="configuration"&gt;&lt;/a&gt;
&lt;h2&gt;
    Angular — New Configuration Components 
&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;This EAP includes new&amp;nbsp;&lt;code class="language-js"&gt;devextreme-angular&lt;/code&gt; configuration components. &lt;/p&gt;
&lt;p&gt;As you may know, DevExtreme Splitter uses a generic&amp;nbsp;&lt;code class="language-js"&gt;dxi-item&lt;/code&gt; configuration component. This same&amp;nbsp;&lt;code class="language-js"&gt;dxi-item&lt;/code&gt; appears in components such as Form and TabPanel&amp;nbsp; (causing potential confusion, especially with IntelliSense).&lt;/p&gt;
&lt;p&gt;Our new components are specific to each parent. For instance, Splitter now also uses &lt;code class="language-js"&gt;dxi-splitter-item&lt;/code&gt;, which only includes properties relevant to Splitter.&lt;/p&gt;
&lt;img src="https://community.devexpress.com:443/blogs/javascript/2024.2%20EAP/code@2x.png" alt="Splitter: new and old configuration components" style="width:1440px;height:400px;" class="small"&gt;&lt;p&gt;Similarly, other DevExtreme components use new configuration components that include parent name.&lt;/p&gt;
&lt;p&gt;Note: You can either use new components or the previous, but not both.&lt;/p&gt;
&lt;div data-survey-id="9dad11b3-81a5-4834-9892-ece6b34573ea" data-survey-auth-required="false"&gt;&lt;/div&gt;

&lt;a name="popup"&gt;&lt;/a&gt;
&lt;h2&gt;
    Angular — Service for Popup Open Operations&lt;/h2&gt;
&lt;p class="tags"&gt;
    &lt;span class="platform"&gt;Angular&lt;/span&gt;
&lt;/p&gt;
&lt;p&gt;In previous builds, you had to use a template to specify Popup content. This EAP introduces a new approach for this specific requirement. Use &lt;code class="language-js"&gt;DxPopupService&lt;/code&gt;&amp;nbsp;and its &lt;code class="language-js"&gt;open&lt;/code&gt;&amp;nbsp;method as necessary (this method takes a content component and a Popup configuration object).&lt;/p&gt;
&lt;pre&gt;&lt;code class="language-ts"&gt;import { DxPopupService } from “devextreme-angular/ui/popup”; 
// ... 
constructor(private popupService: DxPopupService) 
// ... 
popupService.open(ContentComponent, { showCloseButton: true }) &lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The&amp;nbsp;&lt;code class="language-js"&gt;open&lt;/code&gt; method returns both Popup and &lt;code class="language-js"&gt;contentComponent&lt;/code&gt;&amp;nbsp;instances. In the following example, these instances are used to close the Popup programmatically:&lt;/p&gt;
&lt;p&gt;&lt;a href="https://codesandbox.io/p/devbox/devextreme-dxpopupservice-demo-3tjh24?file=%2Fsrc%2Fapp%2Fapp.component.ts" target="_blank"&gt;Demo&lt;/a&gt;&lt;/p&gt;
&lt;div data-survey-id="d23ad3b9-719e-4713-8375-41fa50596d75" data-survey-auth-required="false"&gt;&lt;/div&gt;
&lt;a name="dotnet"&gt;&lt;/a&gt;
&lt;h2&gt;.NET&lt;br&gt;&lt;/h2&gt;&lt;h3&gt;.NET 9 Support&lt;/h3&gt;

&lt;p&gt;The DevExtreme product line now supports &lt;a href="https://devblogs.microsoft.com/dotnet/dotnet-9-release-candidate-1-is-now-available/" target="_blank"&gt;NET 9 RC1&lt;/a&gt; .&lt;/p&gt;

&lt;h3&gt;.NET 8, .NET Framework 4.6.2, Visual Studio 2019 Will Be Minimally Supported Versions for DevExpress Libraries (v24.2+)&lt;/h3&gt;

&lt;p&gt;
    Learn more about this global change in &lt;a href="https://community.devexpress.com/blogs/news/archive/2024/07/08/net-net-8-and-net-framework-4-6-2-are-minimally-supported-target-frameworks-for-devexpress-libraries-in-v24-2.aspx" target="_blank"&gt;this announcement&lt;/a&gt;.
&lt;/p&gt;</description>
      <pubDate>Thu, 19 Sep 2024 00:00:00 Z</pubDate>
      <dc:creator>Vlada Skorokhodova (DevExpress)</dc:creator>
      <dx:excerpt>Our next major release (v24.2) is a couple of months away. In this post, I&amp;#39;ll detail new features included in our Early Access Preview (EAP) build (for active DevExpress Universal or DXperience subscribers)</dx:excerpt>
    </item>
  </channel>
</rss>