fix ts issues

pharret31 · pharret31 · commit 9161eb6c028b · 2025-12-10T17:10:14.000+01:00
diff --git a/.github/workflows/demos_visual_tests.yml b/.github/workflows/demos_visual_tests.yml
@@ -314,13 +314,13 @@ jobs:
         working-directory: apps/demos
         run: pnpm run ts-check-vue
 
-      # - name: Run check TS for Angular
-      #   working-directory: apps/demos
-      #   run: pnpm run ts-check-ng
+      - name: Run check TS for Angular
+        working-directory: apps/demos
+        run: pnpm run ts-check-ng
 
-      # - name: Run check TS for React
-      #   working-directory: apps/demos
-      #   run: pnpm run ts-check-react
+      - name: Run check TS for React
+        working-directory: apps/demos
+        run: pnpm run ts-check-react
 
   lint:
     name: Lint code base
diff --git a/apps/demos/Demos/Drawer/LeftOrRightPosition/Angular/app/app.component.ts b/apps/demos/Demos/Drawer/LeftOrRightPosition/Angular/app/app.component.ts
@@ -4,7 +4,8 @@ import {
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxListModule, DxRadioGroupModule, DxToolbarModule } from 'devextreme-angular';
-import { DxDrawerModule, DxDrawerComponent, DxDrawerTypes } from 'devextreme-angular/ui/drawer';
+import { DxDrawerModule, DxDrawerComponent } from 'devextreme-angular/ui/drawer';
+import type { DxDrawerTypes } from 'devextreme-angular/ui/drawer';
 import { List, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/Drawer/TopOrBottomPosition/Angular/app/app.component.ts b/apps/demos/Demos/Drawer/TopOrBottomPosition/Angular/app/app.component.ts
@@ -4,7 +4,8 @@ import {
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxListModule, DxRadioGroupModule, DxToolbarModule } from 'devextreme-angular';
-import { DxDrawerComponent, DxDrawerModule, DxDrawerTypes } from 'devextreme-angular/ui/drawer';
+import { DxDrawerComponent, DxDrawerModule } from 'devextreme-angular/ui/drawer';
+import type { DxDrawerTypes } from 'devextreme-angular/ui/drawer';
 import { List, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/List/DragAndDrop/Angular/app/app.component.ts b/apps/demos/Demos/List/DragAndDrop/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 { DxListModule } from 'devextreme-angular';
-import { DxSortableTypes } from 'devextreme-angular/ui/sortable';
+import type { DxSortableTypes } from 'devextreme-angular/ui/sortable';
 import { Task, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/List/DragAndDrop/React/App.tsx b/apps/demos/Demos/List/DragAndDrop/React/App.tsx
@@ -1,6 +1,7 @@
 import React, { useCallback, useState } from 'react';
-import List, { IItemDraggingProps, ItemDragging } from 'devextreme-react/list';
-import { plannedTasks, doingTasks } from './data.ts';
+import List, { ItemDragging } from 'devextreme-react/list';
+import type { IItemDraggingProps } from 'devextreme-react/list';
+import { plannedTasks, doingTasks } from './data';
 
 const App = () => {
   const [plannedTasksState, setPlannedTasksState] = useState(plannedTasks);
diff --git a/apps/demos/Demos/List/ItemDeletion/Angular/app/app.component.ts b/apps/demos/Demos/List/ItemDeletion/Angular/app/app.component.ts
@@ -2,7 +2,8 @@ import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxSelectBoxModule, DxCheckBoxModule } from 'devextreme-angular';
-import { DxListModule, DxListTypes } from 'devextreme-angular/ui/list';
+import { DxListModule } from 'devextreme-angular/ui/list';
+import type { DxListTypes } from 'devextreme-angular/ui/list';
 import { Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/List/Selection/Angular/app/app.component.ts b/apps/demos/Demos/List/Selection/Angular/app/app.component.ts
@@ -3,8 +3,9 @@ import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DataSource, ArrayStore } from 'devextreme-angular/common/data';
 import { DxSelectBoxModule, DxCheckBoxModule } from 'devextreme-angular';
-import { SingleMultipleAllOrNone } from 'devextreme-angular/common';
-import { DxListModule, DxListTypes } from 'devextreme-angular/ui/list';
+import type { SingleMultipleAllOrNone } from 'devextreme-angular/common';
+import { DxListModule } from 'devextreme-angular/ui/list';
+import type { DxListTypes } from 'devextreme-angular/ui/list';
 import { Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx b/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Employee } from './data';
+import type { Employee } from './data';
 
 interface EmployeeCardProps {
   employee: Employee;
diff --git a/apps/demos/Demos/Pagination/Overview/React/EmployeesGallery.tsx b/apps/demos/Demos/Pagination/Overview/React/EmployeesGallery.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import EmployeeCard from './EmployeeCard.tsx';
-import { Employee } from './data';
+import type { Employee } from './data';
 
 interface EmployeeGalleryProps {
   employees: Employee[];
diff --git a/apps/demos/Demos/Stepper/FormIntegration/Angular/app/app.component.ts b/apps/demos/Demos/Stepper/FormIntegration/Angular/app/app.component.ts
@@ -12,7 +12,7 @@ import {
 } from 'devextreme-angular';
 import { DxStepperModule, type DxStepperTypes } from 'devextreme-angular/ui/stepper';
 import { AppService } from './app.service';
-import { BookingFormData } from './app.types';
+import type { BookingFormData } from './app.types';
 import { DatesFormComponent } from './dates-form/dates-form.component';
 import { GuestsFormComponent } from './guests-form/guests-form.component';
 import { RoomMealPlanFormComponent } from './room-meal-plan-form/room-meal-plan-form.component';
diff --git a/apps/demos/Demos/Stepper/FormIntegration/Angular/app/app.service.ts b/apps/demos/Demos/Stepper/FormIntegration/Angular/app/app.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { type DxStepperTypes } from 'devextreme-angular/ui/stepper';
-import { BookingFormData } from "./app.types";
+import type { BookingFormData } from "./app.types";
 
 @Injectable({
   providedIn: 'root',
diff --git a/apps/demos/Demos/Stepper/FormIntegration/Angular/app/dates-form/dates-form.component.ts b/apps/demos/Demos/Stepper/FormIntegration/Angular/app/dates-form/dates-form.component.ts
@@ -1,4 +1,5 @@
-import { Component, Input, SimpleChanges, ViewChild } from '@angular/core';
+import { Component, Input, ViewChild } from '@angular/core';
+import type { SimpleChanges } from '@angular/core';
 import { DxFormComponent, type DxFormTypes } from 'devextreme-angular/ui/form';
 import { type DxDateRangeBoxTypes } from 'devextreme-angular/ui/date-range-box';
 import type { BookingFormData } from '../app.types';
diff --git a/apps/demos/Demos/Stepper/FormIntegration/Angular/app/guests-form/guests-form.component.ts b/apps/demos/Demos/Stepper/FormIntegration/Angular/app/guests-form/guests-form.component.ts
@@ -1,4 +1,5 @@
-import { Component, Input, SimpleChanges, ViewChild } from '@angular/core';
+import { Component, Input, ViewChild } from '@angular/core';
+import type { SimpleChanges } from '@angular/core';
 import { DxFormComponent, type DxFormTypes } from 'devextreme-angular/ui/form';
 import { type DxNumberBoxTypes } from 'devextreme-angular/ui/number-box';
 import type { BookingFormData } from '../app.types';
diff --git a/apps/demos/Demos/Stepper/FormIntegration/Angular/app/room-meal-plan-form/room-meal-plan-form.component.ts b/apps/demos/Demos/Stepper/FormIntegration/Angular/app/room-meal-plan-form/room-meal-plan-form.component.ts
@@ -1,4 +1,5 @@
-import { Component, Input, SimpleChanges, ViewChild } from '@angular/core';
+import { Component, Input, ViewChild } from '@angular/core';
+import type { SimpleChanges } from '@angular/core';
 import { DxFormComponent, type DxFormTypes } from 'devextreme-angular/ui/form';
 import { type DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
 import type { BookingFormData } from '../app.types';
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/AdditionalForm.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/AdditionalForm.tsx
@@ -1,8 +1,9 @@
-import React, { FC, memo } from 'react';
+import React, { memo } from 'react';
+import type { FC } from 'react';
 import 'devextreme-react/text-area';
 import { Form, SimpleItem } from 'devextreme-react/form';
 
-import { FormProps } from './types.ts';
+import type { FormProps } from './types';
 
 const AdditionalForm: FC<FormProps> = memo(({ formData }) => (
   <React.Fragment>
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/App.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/App.tsx
@@ -10,8 +10,8 @@ import RoomMealPlanForm from './RoomMealPlanForm.tsx';
 import AdditionalForm from './AdditionalForm.tsx';
 import Confirmation from './Confirmation.tsx';
 
-import { initialSteps, getInitialFormData } from './data.ts';
-import { BookingFormData } from './types.ts';
+import { initialSteps, getInitialFormData } from './data';
+import type { BookingFormData } from './types';
 
 const validationGroups = ['dates', 'guests', 'roomAndMealPlan'];
 
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/Confirmation.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/Confirmation.tsx
@@ -1,7 +1,8 @@
-import React, { FC } from 'react';
+import React from 'react';
+import type { FC } from 'react';
 import 'devextreme-react/date-range-box';
 
-import { BookingFormData } from './types.ts';
+import type { BookingFormData } from './types';
 
 interface ConfirmationProps {
   formData: BookingFormData;
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/DatesForm.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/DatesForm.tsx
@@ -1,8 +1,9 @@
-import React, { FC, memo } from 'react';
+import React, { memo } from 'react';
+import type { FC } from 'react';
 import 'devextreme-react/date-range-box';
 import { Form, SimpleItem } from 'devextreme-react/form';
 
-import { FormProps } from './types.ts';
+import type { FormProps } from './types';
 
 const DatesForm: FC<FormProps> = memo(({ formData, validationGroup }) => (
   <React.Fragment>
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/GuestsForm.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/GuestsForm.tsx
@@ -1,8 +1,9 @@
-import React, { FC, memo } from 'react';
+import React, { memo } from 'react';
+import type { FC } from 'react';
 import { Form, RangeRule, SimpleItem } from 'devextreme-react/form';
 import 'devextreme-react/number-box';
 
-import { FormProps } from './types.ts';
+import type { FormProps } from './types';
 
 const GuestsForm: FC<FormProps> = memo(({ formData, validationGroup }) => (
   <React.Fragment>
diff --git a/apps/demos/Demos/Stepper/FormIntegration/React/RoomMealPlanForm.tsx b/apps/demos/Demos/Stepper/FormIntegration/React/RoomMealPlanForm.tsx
@@ -1,9 +1,10 @@
-import React, { FC, memo } from 'react';
+import React, { memo } from 'react';
+import type { FC } from 'react';
 import 'devextreme-react/select-box';
 import { Form, SimpleItem } from 'devextreme-react/form';
 
-import { FormProps } from './types.ts';
-import { mealPlans, roomTypes } from './data.ts';
+import type { FormProps } from './types';
+import { mealPlans, roomTypes } from './data';
 
 const RoomMealPlanForm: FC<FormProps> = memo(({ formData, validationGroup }) => (
   <React.Fragment>
diff --git a/apps/demos/Demos/TabPanel/DragAndDrop/Angular/app/app.component.ts b/apps/demos/Demos/TabPanel/DragAndDrop/Angular/app/app.component.ts
@@ -4,7 +4,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import {
   DxButtonModule, DxSortableModule, DxTabPanelModule, DxListModule,
 } from 'devextreme-angular';
-import { DxSortableTypes } from 'devextreme-angular/ui/sortable';
+import type { DxSortableTypes } from 'devextreme-angular/ui/sortable';
 import { Employee, Service, Task } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TabPanel/Overview/Angular/app/app.component.ts b/apps/demos/Demos/TabPanel/Overview/Angular/app/app.component.ts
@@ -4,7 +4,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import {
   DxTabPanelModule, DxCheckBoxModule, DxSelectBoxModule,
 } from 'devextreme-angular';
-import { DxTabPanelTypes } from 'devextreme-angular/ui/tab-panel';
+import type { DxTabPanelTypes } from 'devextreme-angular/ui/tab-panel';
 import { TabPanelItem, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TabPanel/Overview/React/data.ts b/apps/demos/Demos/TabPanel/Overview/React/data.ts
@@ -1,4 +1,4 @@
-import { Position, TabsIconPosition, TabsStyle } from 'devextreme/common';
+import type { Position, TabsIconPosition, TabsStyle } from 'devextreme/common';
 
 export const tabsPositionsSelectBoxLabel = { 'aria-label': 'Tab position' };
 
diff --git a/apps/demos/Demos/Tabs/Overview/Angular/app/app.component.ts b/apps/demos/Demos/Tabs/Overview/Angular/app/app.component.ts
@@ -3,9 +3,12 @@ import {
 } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxSelectBoxModule, DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
-import { DxCheckBoxModule, DxCheckBoxTypes } from 'devextreme-angular/ui/check-box';
-import { DxTabsModule, DxTabsComponent, DxTabsTypes } from 'devextreme-angular/ui/tabs';
+import { DxSelectBoxModule } from 'devextreme-angular/ui/select-box';
+import type { DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
+import { DxCheckBoxModule } from 'devextreme-angular/ui/check-box';
+import type { DxCheckBoxTypes } from 'devextreme-angular/ui/check-box';
+import { DxTabsModule, DxTabsComponent } from 'devextreme-angular/ui/tabs';
+import type { DxTabsTypes } from 'devextreme-angular/ui/tabs';
 import { Tab, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/Tabs/Overview/React/data.ts b/apps/demos/Demos/Tabs/Overview/React/data.ts
@@ -1,4 +1,4 @@
-import { Orientation, TabsIconPosition, TabsStyle } from 'devextreme/common';
+import type { Orientation, TabsIconPosition, TabsStyle } from 'devextreme/common';
 
 export const tabsText = [
   {
diff --git a/apps/demos/Demos/Tabs/Selection/React/App.tsx b/apps/demos/Demos/Tabs/Selection/React/App.tsx
@@ -4,7 +4,7 @@ import Tabs from 'devextreme-react/tabs';
 import SelectBox from 'devextreme-react/select-box';
 import MultiView from 'devextreme-react/multi-view';
 
-import { employees, selectBoxLabel } from './data.ts';
+import { employees, selectBoxLabel } from './data';
 
 class EmployeeInfo extends React.Component<{
   data: {
diff --git a/apps/demos/Demos/Toolbar/Overview/Angular/app/app.component.ts b/apps/demos/Demos/Toolbar/Overview/Angular/app/app.component.ts
@@ -4,8 +4,8 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxListModule, DxToolbarModule, DxSelectBoxModule } from 'devextreme-angular';
 import { DataSource } from 'devextreme-angular/common/data';
 import notify from 'devextreme/ui/notify';
-import { DxButtonTypes } from 'devextreme-angular/ui/button';
-import { DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
+import type { DxButtonTypes } from 'devextreme-angular/ui/button';
+import type { DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
 import { ProductType, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/DragAndDropHierarchicalDataStructure/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/DragAndDropHierarchicalDataStructure/Angular/app/app.component.ts
@@ -3,8 +3,10 @@ import {
 } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxSortableModule, DxSortableTypes } from 'devextreme-angular/ui/sortable';
-import { DxTreeViewModule, DxTreeViewComponent, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxSortableModule } from 'devextreme-angular/ui/sortable';
+import type { DxSortableTypes } from 'devextreme-angular/ui/sortable';
+import { DxTreeViewModule, DxTreeViewComponent } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { Service, FileSystemItem } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/DragAndDropHierarchicalDataStructure/React/App.tsx b/apps/demos/Demos/TreeView/DragAndDropHierarchicalDataStructure/React/App.tsx
@@ -1,8 +1,9 @@
 import React, { useCallback, useRef, useState } from 'react';
-import TreeView, { type TreeViewTypes, TreeViewRef } from 'devextreme-react/tree-view';
+import TreeView from 'devextreme-react/tree-view';
+import type { TreeViewTypes, TreeViewRef } from 'devextreme-react/tree-view';
 import Sortable, { type SortableTypes } from 'devextreme-react/sortable';
 
-import service from './data.ts';
+import service from './data';
 import type { FileSystemItem } from './types';
 
 type Node = TreeViewTypes.Node<FileSystemItem>;
diff --git a/apps/demos/Demos/TreeView/DragAndDropPlainDataStructure/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/DragAndDropPlainDataStructure/Angular/app/app.component.ts
@@ -3,8 +3,10 @@ import {
 } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxSortableModule, DxSortableTypes } from 'devextreme-angular/ui/sortable';
-import { DxTreeViewModule, DxTreeViewComponent, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxSortableModule } from 'devextreme-angular/ui/sortable';
+import type { DxSortableTypes } from 'devextreme-angular/ui/sortable';
+import { DxTreeViewModule, DxTreeViewComponent } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { Service, FileSystemItem } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/DragAndDropPlainDataStructure/React/App.tsx b/apps/demos/Demos/TreeView/DragAndDropPlainDataStructure/React/App.tsx
@@ -1,8 +1,9 @@
 import React, { useCallback, useRef, useState } from 'react';
-import TreeView, { type TreeViewTypes, TreeViewRef } from 'devextreme-react/tree-view';
+import TreeView from 'devextreme-react/tree-view';
+import type { TreeViewTypes, TreeViewRef } from 'devextreme-react/tree-view';
 import Sortable, { type SortableTypes } from 'devextreme-react/sortable';
 
-import service from './data.ts';
+import service from './data';
 import type { FileSystemItem } from './types';
 
 type Node = TreeViewTypes.Node<FileSystemItem>;
diff --git a/apps/demos/Demos/TreeView/FlatDataStructure/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/FlatDataStructure/Angular/app/app.component.ts
@@ -1,7 +1,8 @@
 import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxTreeViewModule, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxTreeViewModule } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { Product, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/HierarchicalDataStructure/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/HierarchicalDataStructure/Angular/app/app.component.ts
@@ -1,7 +1,8 @@
 import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxTreeViewModule, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxTreeViewModule } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { Product, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/ItemSelectionAndCustomization/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/ItemSelectionAndCustomization/Angular/app/app.component.ts
@@ -1,11 +1,14 @@
 import {
-  NgModule, Component, Pipe, PipeTransform, enableProdMode, ViewChild,
+  NgModule, Component, Pipe, enableProdMode, ViewChild,
 } from '@angular/core';
+import type { PipeTransform } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxListModule, DxCheckBoxModule } from 'devextreme-angular';
-import { DxTreeViewModule, DxTreeViewComponent, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
-import { DxSelectBoxModule, DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
+import { DxTreeViewModule, DxTreeViewComponent } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxSelectBoxModule } from 'devextreme-angular/ui/select-box';
+import type { DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
 import { Service, Employee } from './app.service';
 
 @Pipe({ name: 'title' })
diff --git a/apps/demos/Demos/TreeView/TreeViewWithSearchBar/Angular/app/app.component.ts b/apps/demos/Demos/TreeView/TreeViewWithSearchBar/Angular/app/app.component.ts
@@ -2,7 +2,8 @@ import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { DxSelectBoxModule } from 'devextreme-angular';
-import { DxTreeViewModule, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
+import { DxTreeViewModule } from 'devextreme-angular/ui/tree-view';
+import type { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { Product, Service } from './app.service';
 
 if (!/localhost/.test(document.location.host)) {
diff --git a/apps/demos/Demos/TreeView/TreeViewWithSearchBar/React/App.tsx b/apps/demos/Demos/TreeView/TreeViewWithSearchBar/React/App.tsx
@@ -1,10 +1,10 @@
 import React, { useCallback, useState } from 'react';
 
-import { SearchMode } from 'devextreme-react/common';
+import type { SearchMode } from 'devextreme-react/common';
 import { TreeView } from 'devextreme-react/tree-view';
 import { SelectBox, type SelectBoxTypes } from 'devextreme-react/select-box';
 
-import { products, searchModeLabel } from './data.ts';
+import { products, searchModeLabel } from './data';
 
 const options: SearchMode[] = ['contains', 'startswith', 'equals'];
 
diff --git a/apps/demos/tsconfig.ngc-check.json b/apps/demos/tsconfig.ngc-check.json
diff --git a/apps/demos/tsconfig.react-check.json b/apps/demos/tsconfig.react-check.json
