Update demos to use platform-specific imports

apps/demos/Demos/Autocomplete/Overview/Angular/app/app.component.ts

@@ -4,8 +4,8 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 import { DxAutocompleteModule, DxTemplateModule } from 'devextreme-angular';
-import CustomStore from 'devextreme/data/custom_store';
-import ODataStore from 'devextreme/data/odata/store';
+import { CustomStore } from 'devextreme-angular/common/data';
+import { ODataStore } from 'devextreme-angular/common/data';
 import { Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/Autocomplete/Overview/React/App.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useState } from 'react';
-import ODataStore from 'devextreme/data/odata/store';
+import { ODataStore } from 'devextreme-react/common/data';
 import { Autocomplete, AutocompleteTypes } from 'devextreme-react/autocomplete';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-react/common/data';
 import 'whatwg-fetch';
 import { names, surnames, positions } from './data.ts';
 

apps/demos/Demos/Autocomplete/Overview/Vue/App.vue

@@ -97,9 +97,9 @@
 </template>
 <script setup lang="ts">
 import { ref } from 'vue';
-import ODataStore from 'devextreme/data/odata/store';
+import { ODataStore } from 'devextreme-vue/common/data';
 import { DxAutocomplete } from 'devextreme-vue/autocomplete';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 import 'whatwg-fetch';
 import { names, surnames, positions } from './data.ts';
 

apps/demos/Demos/Charts/BarSparklines/Angular/app/app.component.ts

@@ -5,8 +5,8 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 
 import { DxSparklineModule, DxSelectBoxModule } from 'devextreme-angular';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-angular/common/data';
+import { CustomStore } from 'devextreme-angular/common/data';
 
 if (!/localhost/.test(document.location.host)) {
   enableProdMode();

apps/demos/Demos/Charts/BarSparklines/React/App.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback } from 'react';
 import SelectBox, { SelectBoxTypes } from 'devextreme-react/select-box';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-react/common/data';
+import { CustomStore } from 'devextreme-react/common/data';
 import RowTemplate from './RowTemplate.tsx';
 
 const months = [12, 11, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];

apps/demos/Demos/Charts/BarSparklines/React/RowTemplate.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import Sparkline, {
   Tooltip,
 } from 'devextreme-react/sparkline';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-react/common/data';
 
 interface RowTemplateProps {
   key: number;

apps/demos/Demos/Charts/BarSparklines/Vue/App.vue

@@ -39,8 +39,8 @@
 
 <script setup lang="ts">
 import DxSelectBox from 'devextreme-vue/select-box';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-vue/common/data';
+import { CustomStore } from 'devextreme-vue/common/data';
 import RowTemplate from './RowTemplate.vue';
 
 const months = [12, 11, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];

apps/demos/Demos/Charts/ClientSideDataProcessing/Angular/app/app.component.ts

@@ -7,8 +7,8 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 
 import { DxChartModule, DxSelectBoxModule } from 'devextreme-angular';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-angular/common/data';
+import { CustomStore } from 'devextreme-angular/common/data';
 import query from 'devextreme/data/query';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/Charts/ClientSideDataProcessing/React/App.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-react/common/data';
+import { CustomStore } from 'devextreme-react/common/data';
 import Chart, {
   ValueAxis, Label, Legend, Series, Size, Export, LoadingIndicator,
 } from 'devextreme-react/chart';

apps/demos/Demos/Charts/ClientSideDataProcessing/Vue/App.vue

@@ -45,8 +45,8 @@ import DxChart, {
   DxLoadingIndicator,
 } from 'devextreme-vue/chart';
 import DxSelectBox from 'devextreme-vue/select-box';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-vue/common/data';
+import { CustomStore } from 'devextreme-vue/common/data';
 
 const temperature = [2, 4, 6, 8, 9, 10, 11];
 const palette = ['#c3a2cc', '#b7b5e0', '#e48cba'];

apps/demos/Demos/Charts/LoadDataOnDemand/Angular/app/app.component.ts

@@ -7,7 +7,7 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 import { DxChartComponent, DxChartModule } from 'devextreme-angular';
 import { VisualRange } from 'devextreme-angular/common/charts';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 
 if (!/localhost/.test(document.location.host)) {
   enableProdMode();

apps/demos/Demos/Charts/LoadDataOnDemand/React/App.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-react/common/data';
 import {
   Chart,
   ChartTypes,

apps/demos/Demos/Charts/LoadDataOnDemand/Vue/App.vue

@@ -54,7 +54,7 @@ import DxChart, {
   DxLoadingIndicator,
   DxLegend,
 } from 'devextreme-vue/chart';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-vue/common/data';
 import 'whatwg-fetch';
 
 const HALFDAY = 43200000;

apps/demos/Demos/Charts/ServerSideDataProcessing/Angular/app/app.component.ts

@@ -3,7 +3,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 import { DxChartModule, DxSelectBoxModule } from 'devextreme-angular';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 import 'devextreme/data/odata/store';
 
 import { Month, Service } from './app.service';

apps/demos/Demos/Charts/ServerSideDataProcessing/React/App.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-react/common/data';
 import 'devextreme/data/odata/store';
 import Chart, {
   ValueAxis,

apps/demos/Demos/Charts/ServerSideDataProcessing/Vue/App.vue

@@ -69,7 +69,7 @@ import DxChart, {
   DxLoadingIndicator,
 } from 'devextreme-vue/chart';
 import DxSelectBox from 'devextreme-vue/select-box';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-vue/common/data';
 import 'devextreme/data/odata/store';
 import { months } from './data.ts';
 

apps/demos/Demos/Charts/SignalRService/Angular/app/app.component.ts

@@ -5,7 +5,7 @@ import { DecimalPipe, CurrencyPipe } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { HubConnectionBuilder, HttpTransportType } from '@aspnet/signalr';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-angular/common/data';
 import { DxChartModule, DxChartComponent, DxChartTypes } from 'devextreme-angular/ui/chart';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/Charts/SignalRService/React/App.tsx

@@ -18,7 +18,7 @@ import Chart, {
   IAggregationProps,
 } from 'devextreme-react/chart';
 import { VisualRange } from 'devextreme-react/common/charts';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-react/common/data';
 import { HubConnectionBuilder, HttpTransportType } from '@aspnet/signalr';
 import TooltipTemplate from './TooltipTemplate.tsx';
 

apps/demos/Demos/Charts/SignalRService/Vue/App.vue

@@ -82,7 +82,7 @@ import {
   DxTooltip,
   DxCrosshair,
 } from 'devextreme-vue/chart';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 import { HubConnectionBuilder, HttpTransportType } from '@aspnet/signalr';
 import TooltipTemplate from './TooltipTemplate.vue';
 

apps/demos/Demos/Chat/AIAndChatbotIntegration/Angular/app/app.component.ts

@@ -13,7 +13,7 @@ import {
 import { Observable } from 'rxjs';
 import { AppService } from './app.service';
 import { loadMessages } from 'devextreme/localization';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 
 if (!/localhost/.test(document.location.host)) {
   enableProdMode();

apps/demos/Demos/Chat/AIAndChatbotIntegration/Angular/app/app.service.ts

@@ -10,8 +10,8 @@ import {
   Alert,
   MessageEnteredEvent
 } from 'devextreme/ui/chat';
-import DataSource from 'devextreme/data/data_source';
-import CustomStore from 'devextreme/data/custom_store';
+import { DataSource } from 'devextreme-angular/common/data';
+import { CustomStore } from 'devextreme-angular/common/data';
 
 @Injectable({
   providedIn: 'root',

apps/demos/Demos/Common/ActionAndListsOverview/Angular/app/app.component.ts

@@ -2,7 +2,7 @@ import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxTileViewModule, DxButtonModule, DxListModule } from 'devextreme-angular';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 
 import { Service, Hotel } from './app.service';
 

apps/demos/Demos/Common/ActionAndListsOverview/Angular/app/app.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import ArrayStore from 'devextreme/data/array_store';
-import DataSource from 'devextreme/data/data_source';
+import { ArrayStore } from 'devextreme-angular/common/data';
+import { DataSource } from 'devextreme-angular/common/data';
 
 export class Hotel {
   Id: number;

apps/demos/Demos/Common/ActionAndListsOverview/React/App.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useState } from 'react';
-import ArrayStore from 'devextreme/data/array_store';
+import { ArrayStore } from 'devextreme-react/common/data';
 import List, { ListTypes } from 'devextreme-react/list';
 import TileView from 'devextreme-react/tile-view';
 import { data } from './data.ts';

apps/demos/Demos/Common/ActionAndListsOverview/Vue/App.vue

@@ -71,7 +71,7 @@
 import { ref } from 'vue';
 import DxTileView from 'devextreme-vue/tile-view';
 import DxList from 'devextreme-vue/list';
-import ArrayStore from 'devextreme/data/array_store';
+import { ArrayStore } from 'devextreme-vue/common/data';
 import { data } from './data.ts';
 
 const currentHotel = ref(data[0]);

apps/demos/Demos/DataGrid/AdvancedMasterDetailView/Angular/app/app.component.ts

@@ -5,7 +5,7 @@ import {
   DxDataGridModule, DxFormModule, DxSelectBoxModule, DxTabPanelModule,
 } from 'devextreme-angular';
 import * as AspNetData from 'devextreme-aspnet-data-nojquery';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 import { DetailViewComponent } from './detail-view/detail-view.component';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/DataGrid/AdvancedMasterDetailView/Angular/app/detail-view/detail-view.component.ts

@@ -1,5 +1,5 @@
 import { Component, Input, AfterViewInit } from '@angular/core';
-import DataSource from 'devextreme/data/data_source';
+import { DataSource } from 'devextreme-angular/common/data';
 import * as AspNetData from 'devextreme-aspnet-data-nojquery';
 import { DxFormTypes } from 'devextreme-angular/ui/form';
 import { DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';

apps/demos/Demos/DataGrid/CRUDOperations/Angular/app/app.component.ts

@@ -4,7 +4,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
 import { lastValueFrom, Observable } from 'rxjs';
 import { DxDataGridModule, DxSelectBoxModule, DxButtonModule } from 'devextreme-angular';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-angular/common/data';
 import { formatDate } from 'devextreme/localization';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/DataGrid/CRUDOperations/React/App.tsx

@@ -7,7 +7,7 @@ import {
 import { Button } from 'devextreme-react/button';
 import { SelectBox, SelectBoxTypes } from 'devextreme-react/select-box';
 
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-react/common/data';
 import { formatDate } from 'devextreme/localization';
 import 'whatwg-fetch';
 

apps/demos/Demos/DataGrid/CRUDOperations/Vue/App.vue

@@ -95,7 +95,7 @@ import {
 } from 'devextreme-vue/data-grid';
 import { DxButton } from 'devextreme-vue/button';
 import { DxSelectBox } from 'devextreme-vue/select-box';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 import { formatDate } from 'devextreme/localization';
 import 'whatwg-fetch';
 

apps/demos/Demos/DataGrid/CellEditingAndEditingAPI/Angular/app/app.component.ts

@@ -4,7 +4,7 @@ import {
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxButtonModule } from 'devextreme-angular';
-import ArrayStore from 'devextreme/data/array_store';
+import { ArrayStore } from 'devextreme-angular/common/data';
 import { DxDataGridModule, DxDataGridComponent, DxDataGridTypes } from 'devextreme-angular/ui/data-grid';
 import { Service, State } from './app.service';
 

apps/demos/Demos/DataGrid/CellEditingAndEditingAPI/React/App.tsx

@@ -3,8 +3,8 @@ import DataGrid, {
   Column, Editing, Paging, Selection, Lookup, Toolbar, Item, DataGridTypes,
 } from 'devextreme-react/data-grid';
 import { Button } from 'devextreme-react/button';
-import ArrayStore from 'devextreme/data/array_store';
-import DataSource from 'devextreme/data/data_source';
+import { ArrayStore } from 'devextreme-react/common/data';
+import { DataSource } from 'devextreme-react/common/data';
 import { employees, states } from './data.ts';
 
 const dataSource = new DataSource({

apps/demos/Demos/DataGrid/CellEditingAndEditingAPI/Vue/App.vue

@@ -79,8 +79,8 @@ import {
 } from 'devextreme-vue/data-grid';
 import { DxButton } from 'devextreme-vue/button';
 
-import DataSource from 'devextreme/data/data_source';
-import ArrayStore from 'devextreme/data/array_store';
+import { DataSource } from 'devextreme-vue/common/data';
+import { ArrayStore } from 'devextreme-vue/common/data';
 
 import { Employee, employees, states } from './data.ts';
 

apps/demos/Demos/DataGrid/CollaborativeEditing/Angular/app/app.component.ts

@@ -2,7 +2,7 @@ import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxDataGridModule, DxTextBoxModule } from 'devextreme-angular';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-angular/common/data';
 import { CollaborativeEditingService } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {

apps/demos/Demos/DataGrid/CollaborativeEditing/Vue/Grid.vue

@@ -59,7 +59,7 @@ import {
 } from 'devextreme-vue/data-grid';
 
 import * as AspNetData from 'devextreme-aspnet-data-nojquery';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 
 defineProps<{
   dataSource: CustomStore

apps/demos/Demos/DataGrid/CustomDataSource/Angular/app/app.component.ts

@@ -4,8 +4,8 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 import { DxDataGridModule } from 'devextreme-angular';
-import CustomStore from 'devextreme/data/custom_store';
-import { LoadOptions } from 'devextreme/data';
+import { CustomStore } from 'devextreme-angular/common/data';
+import { LoadOptions } from 'devextreme-angular/common/data';
 
 if (!/localhost/.test(document.location.host)) {
   enableProdMode();

apps/demos/Demos/DataGrid/CustomDataSource/React/App.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import 'devextreme/data/odata/store';
 import DataGrid, { Column, Paging, Pager } from 'devextreme-react/data-grid';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-react/common/data';
 import 'whatwg-fetch';
 
 function isNotEmpty(value: string | undefined | null) {

apps/demos/Demos/DataGrid/CustomDataSource/Vue/App.vue

@@ -41,7 +41,7 @@
 import {
   DxDataGrid, DxColumn, DxPaging, DxPager,
 } from 'devextreme-vue/data-grid';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 import 'whatwg-fetch';
 
 const isNotEmpty = (value: any) => value !== undefined && value !== null && value !== '';

apps/demos/Demos/DataGrid/CustomEditors/Vue/EmployeeDropDownBoxComponent.vue

@@ -45,7 +45,7 @@ import {
   DxDataGridTypes,
 } from 'devextreme-vue/data-grid';
 import DxDropDownBox, { DxDropDownBoxTypes } from 'devextreme-vue/drop-down-box';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 
 const props = defineProps<{
   value: number,

apps/demos/Demos/DataGrid/CustomEditors/Vue/EmployeeTagBoxComponent.vue

@@ -18,7 +18,7 @@
 import { ref } from 'vue';
 import { DxDataGrid, DxDataGridTypes } from 'devextreme-vue/data-grid';
 import DxTagBox, { DxTagBoxTypes } from 'devextreme-vue/tag-box';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-vue/common/data';
 
 const props = defineProps<{
   cellInfo: DxDataGridTypes.ColumnEditCellTemplateData,

apps/demos/Demos/DataGrid/CustomNewRecordPosition/Angular/app/app.component.ts

@@ -2,7 +2,7 @@ import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import Guid from 'devextreme/core/guid';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-angular/common/data';
 import { DxSelectBoxModule } from 'devextreme-angular';
 import { DxDataGridModule, DxDataGridTypes } from 'devextreme-angular/ui/data-grid';
 import { Service } from './app.service';

apps/demos/Demos/DataGrid/DataValidation/Angular/app/app.component.ts

@@ -4,7 +4,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { DxDataGridModule } from 'devextreme-angular';
 import * as AspNetData from 'devextreme-aspnet-data-nojquery';
-import CustomStore from 'devextreme/data/custom_store';
+import { CustomStore } from 'devextreme-angular/common/data';
 import { lastValueFrom } from 'rxjs';
 
 if (!/localhost/.test(document.location.host)) {