diff --git a/.github/workflows/demos_visual_tests_frameworks.yml b/.github/workflows/demos_visual_tests_frameworks.yml
index e909f943d89d..f9b61931d5ef 100644
--- a/.github/workflows/demos_visual_tests_frameworks.yml
+++ b/.github/workflows/demos_visual_tests_frameworks.yml
@@ -451,7 +451,7 @@ jobs:
       working-directory: apps/demos
       env:
         CHANGEDFILEINFOSPATH: changed-files.json
-        BROWSERS: chrome:headless --disable-gpu --window-size=1200,800 --js-flags=--random-seed=2147483647
+        BROWSERS: chrome:headless --window-size=1200,800 --disable-partial-raster --disable-skia-runtime-opts --run-all-compositor-stages-before-draw --disable-new-content-rendering-timeout --disable-threaded-animation --disable-threaded-scrolling --disable-checker-imaging --disable-image-animation-resync --use-gl="swiftshader" --disable-features=PaintHolding --js-flags=--random-seed=2147483647 --font-render-hinting=none --disable-font-subpixel-positioning
         # DEBUG: hammerhead:*,testcafe:*
         CONCURRENCY: 4
         TCQUARANTINE: true
diff --git a/apps/demos/Demos/Chat/Customization/jQuery/index.js b/apps/demos/Demos/Chat/Customization/jQuery/index.js
index 47de3344c96f..b6381e0deed9 100644
--- a/apps/demos/Demos/Chat/Customization/jQuery/index.js
+++ b/apps/demos/Demos/Chat/Customization/jQuery/index.js
@@ -10,30 +10,6 @@ $(() => {
     messageTimestampFormat: messageTimestampFormat[0],
   }).dxChat('instance');
 
-  $('#chat-disabled').dxCheckBox({
-    value: false,
-    text: 'Disable Chat',
-    onValueChanged(data) {
-      chat.option('disabled', data.value);
-    },
-  });
-
-  $('#show-day-headers').dxCheckBox({
-    value: true,
-    text: 'Show Day Headers',
-    onValueChanged(data) {
-      chat.option('showDayHeaders', data.value);
-    },
-  });
-
-  $('#show-message-timestamp').dxCheckBox({
-    value: true,
-    text: 'Show Message Timestamp',
-    onValueChanged(data) {
-      chat.option('showMessageTimestamp', data.value);
-    },
-  });
-
   $('#show-avatar').dxCheckBox({
     value: true,
     text: 'Show Avatar',
@@ -50,6 +26,14 @@ $(() => {
     },
   });
 
+  $('#show-day-headers').dxCheckBox({
+    value: true,
+    text: 'Show Day Headers',
+    onValueChanged(data) {
+      chat.option('showDayHeaders', data.value);
+    },
+  });
+
   $('#day-headers-format').dxSelectBox({
     items: dayHeaderFormat,
     value: dayHeaderFormat[0],
@@ -59,6 +43,14 @@ $(() => {
     },
   });
 
+  $('#show-message-timestamp').dxCheckBox({
+    value: true,
+    text: 'Show Message Timestamp',
+    onValueChanged(data) {
+      chat.option('showMessageTimestamp', data.value);
+    },
+  });
+
   $('#message-timestamp-format').dxSelectBox({
     items: messageTimestampFormat,
     value: messageTimestampFormat[0],
@@ -67,4 +59,12 @@ $(() => {
       chat.option('messageTimestampFormat', data.value);
     },
   });
+
+  $('#chat-disabled').dxCheckBox({
+    value: false,
+    text: 'Disable Chat',
+    onValueChanged(data) {
+      chat.option('disabled', data.value);
+    },
+  });
 });
diff --git a/apps/demos/Demos/Chat/Overview/Vue/App.vue b/apps/demos/Demos/Chat/Overview/Vue/App.vue
index e39b85502c55..0141f6fff784 100644
--- a/apps/demos/Demos/Chat/Overview/Vue/App.vue
+++ b/apps/demos/Demos/Chat/Overview/Vue/App.vue
@@ -1,62 +1,67 @@
 <template>
-    <DxChat
-        v-model:items="messages"
-        v-model:user="currentUser"
-        v-model:typing-users="userChatTypingUsers"
-        @message-entered="onMessageEntered($event)"
-        @typing-start="userChatTypingStart()"
-        @typing-end="userChatTypingEnd()"
-    ></DxChat>
-    <DxChat
-        v-model:items="messages"
-        v-model:user="supportAgent"
-        v-model:typing-users="supportChatTypingUsers"
-        @message-entered="onMessageEntered($event)"
-        @typing-start="supportChatTypingStart()"
-        @typing-end="supportChatTypingEnd()"
-    ></DxChat>
+  <DxChat
+    v-model:items="messages"
+    v-model:user="currentUser"
+    v-model:typing-users="userChatTypingUsers"
+    @message-entered="onMessageEntered($event)"
+    @typing-start="userChatTypingStart()"
+    @typing-end="userChatTypingEnd()"
+  />
+  <DxChat
+    v-model:items="messages"
+    v-model:user="supportAgent"
+    v-model:typing-users="supportChatTypingUsers"
+    @message-entered="onMessageEntered($event)"
+    @typing-start="supportChatTypingStart()"
+    @typing-end="supportChatTypingEnd()"
+  />
 </template>
 
-<style scoped>
-    #app {
-        display: flex;
-        gap: 20px;
-    }
-
-    .dx-chat {
-        height: 710px;
-    }
-
-    .dx-avatar {
-        border: 1px solid var(--dx-color-border);
-    }
-</style>
-
 <script setup lang="ts">
-    import { ref } from 'vue';
-    import DxChat from 'devextreme-vue/chat';
-    import { messages, supportAgent, currentUser } from './data.ts';
-
-    const userChatTypingUsers = ref([]);
-    const supportChatTypingUsers = ref([]);
-
-    function onMessageEntered(event) {
-        messages.value = [...messages.value, event.message];
-    }
-
-    function userChatTypingStart() {
-        supportChatTypingUsers.value = [currentUser.value];
-    }
-    
-    function userChatTypingEnd() {
-        supportChatTypingUsers.value = [];
-    }
-    
-    function supportChatTypingStart() {
-        userChatTypingUsers.value = [supportAgent.value];
-    }
-    
-    function supportChatTypingEnd() {
-        userChatTypingUsers.value = [];
-    }
+import { ref } from 'vue';
+import DxChat from 'devextreme-vue/chat';
+import {
+  messages as initialMessages,
+  supportAgent,
+  currentUser,
+} from './data.ts';
+
+const messages = ref(initialMessages);
+const userChatTypingUsers = ref([]);
+const supportChatTypingUsers = ref([]);
+
+function onMessageEntered(event) {
+  messages.value = [...messages.value, event.message];
+}
+
+function userChatTypingStart() {
+  supportChatTypingUsers.value = [currentUser];
+}
+
+function userChatTypingEnd() {
+  supportChatTypingUsers.value = [];
+}
+
+function supportChatTypingStart() {
+  userChatTypingUsers.value = [supportAgent];
+}
+
+function supportChatTypingEnd() {
+  userChatTypingUsers.value = [];
+}
 </script>
+
+<style scoped>
+#app {
+  display: flex;
+  gap: 20px;
+}
+
+.dx-chat {
+  height: 710px;
+}
+
+.dx-avatar {
+  border: 1px solid var(--dx-color-border);
+}
+</style>
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.css b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.css
new file mode 100644
index 000000000000..f65579fc60ad
--- /dev/null
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.css
@@ -0,0 +1,100 @@
+body {
+  overflow-x: hidden;
+}
+
+.demo-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.container {
+  min-width: 720px;
+  width: 100%;
+}
+
+::ng-deep .employees {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  min-height: 644px;
+  padding-bottom: 24px;
+}
+
+::ng-deep employee-card {
+  width: 100%;
+  max-height: 312px;
+  align-self: stretch;
+  overflow: hidden;
+  border: var(--dx-border-width) solid var(--dx-color-border);
+  border-radius: var(--dx-border-radius);
+  background-color: var(--dx-component-color-bg);
+}
+
+::ng-deep .employees.employees--forth employee-card {
+  min-width: 250px;
+  width: 390px;
+  flex-basis: calc(50% - 10px);
+}
+
+::ng-deep .employees.employees--six employee-card {
+  flex-basis: calc(33.3% - 12.5px);
+}
+
+::ng-deep .employees__img-wrapper {
+  height: 180px;
+  position: relative;
+  overflow: hidden;
+  border-bottom: var(--dx-border-width) solid var(--dx-color-border);
+  background-color: #fff;
+}
+
+::ng-deep .employees__img {
+  display: block;
+  height: 220px;
+  position: absolute;
+  content: "";
+  left: 50%;
+  top: 0;
+  transform: translateX(-50%);
+}
+
+::ng-deep .employees__info {
+  padding: 24px;
+}
+
+::ng-deep .employees__info-row {
+  margin-bottom: 8px;
+  text-wrap: nowrap;
+}
+
+::ng-deep .employees__info-label {
+  display: inline-block;
+  font-weight: 600;
+  vertical-align: middle;
+}
+
+::ng-deep .employees.employees--forth .employees__info-label {
+  width: 160px;
+}
+
+::ng-deep .employees.employees--six .employees__info-label {
+  width: 80px;
+}
+
+::ng-deep .employees__info-value {
+  display: inline-block;
+  text-wrap: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+  overflow: hidden;
+  white-space:nowrap
+}
+
+::ng-deep .employees.employees--forth .employees__info-value {
+  max-width: 180px;
+}
+
+::ng-deep .employees.employees--six .employees__info-value {
+  max-width: 120px;
+}
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.html b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.html
index ddc4ed8f5862..175a0142f5e6 100644
--- a/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.html
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.html
@@ -1,7 +1,22 @@
-<dx-data-grid
-  id="gridContainer"
-  [dataSource]="customers"
-  [columns]="['CompanyName', 'City', 'State', 'Phone', 'Fax']"
-  [showBorders]="true"
->
-</dx-data-grid>
+<div class="container">
+  <div
+    class="employees"
+    [ngClass]="pageSize === 4 ? 'employees--forth' : 'employees--six'"
+  >
+    @for (employee of pageEmployees; track employee.ID) {
+    <employee-card [employee]="employee"></employee-card>
+    }
+  </div>
+
+  <dx-pagination
+    [showInfo]="showInfo"
+    [showNavigationButtons]="showNavigationButtons"
+    [allowedPageSizes]="allowedPageSizes"
+    [itemCount]="itemCount"
+    [pageIndex]="pageIndex"
+    [pageSize]="pageSize"
+    (pageIndexChange)="onPageIndexChange($event)"
+    (pageSizeChange)="onPageSizeChange($event)"
+  >
+  </dx-pagination>
+</div>
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.ts b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.ts
index 7ea2d957c548..125f11487eca 100644
--- a/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.ts
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/app.component.ts
@@ -1,8 +1,9 @@
 import { NgModule, Component, enableProdMode } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { DxDataGridModule } from 'devextreme-angular';
-import { Customer, Service } from './app.service';
+import { DxPaginationModule } from 'devextreme-angular';
+import { Employee, Service } from './app.service';
+import { EmployeeCard } from './employee-card/employee-card.component';
 
 if (!/localhost/.test(document.location.host)) {
   enableProdMode();
@@ -17,22 +18,53 @@ if (window && window.config.packageConfigPaths) {
 @Component({
   selector: 'demo-app',
   templateUrl: `.${modulePrefix}/app.component.html`,
+  styleUrls: [`.${modulePrefix}/app.component.css`],
   providers: [Service],
 })
 export class AppComponent {
-  customers: Customer[];
+  employees: Employee[];
+
+  pageEmployees: Employee[];
+
+  itemCount: number;
+
+  readonly allowedPageSizes = [4, 6];
+
+  showInfo = true;
+
+  showNavigationButtons = true;
+
+  pageIndex = 1;
+  
+  pageSize = 4;
+
+  onPageIndexChange(val) {
+    this.pageIndex = val;
+    this.setPageEmployees();
+  }
+
+  onPageSizeChange(val) {
+    this.pageSize = val;
+    this.setPageEmployees();
+  }
+
+  setPageEmployees() {
+    this.pageEmployees = this.employees.slice((this.pageIndex - 1) * this.pageSize, this.pageIndex * this.pageSize);
+  }
 
   constructor(service: Service) {
-    this.customers = service.getCustomers();
+    this.employees = service.getEmployees();
+    this.itemCount = this.employees.length;
+    this.setPageEmployees();
   }
 }
 
 @NgModule({
   imports: [
     BrowserModule,
-    DxDataGridModule,
+    DxPaginationModule,
   ],
-  declarations: [AppComponent],
+  declarations: [AppComponent, EmployeeCard],
   bootstrap: [AppComponent],
 })
 export class AppModule { }
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/app.service.ts b/apps/demos/Demos/Pagination/Overview/Angular/app/app.service.ts
index db238661893a..32d2a4fbb35d 100644
--- a/apps/demos/Demos/Pagination/Overview/Angular/app/app.service.ts
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/app.service.ts
@@ -1,150 +1,434 @@
 import { Injectable } from '@angular/core';
 
-export class Customer {
+export class Employee {
   ID: number;
 
-  CompanyName: string;
+  FullName: string;
 
-  Address: string;
+  Title: string;
 
-  City: string;
+  Employee_Picture: string;
 
-  State: string;
+  Picture: string;
 
-  Zipcode: number;
+  MobilePhone: string;
 
-  Phone: string;
-
-  Fax: string;
-
-  Website: string;
 }
 
-let customers: Customer[] = [{
-  ID: 1,
-  CompanyName: 'Super Mart of the West',
-  Address: '702 SW 8th Street',
-  City: 'Bentonville',
-  State: 'Arkansas',
-  Zipcode: 72716,
-  Phone: '(800) 555-2797',
-  Fax: '(800) 555-2171',
-  Website: 'http://www.nowebsitesupermart.dx',
-}, {
-  ID: 2,
-  CompanyName: 'Electronics Depot',
-  Address: '2455 Paces Ferry Road NW',
-  City: 'Atlanta',
-  State: 'Georgia',
-  Zipcode: 30339,
-  Phone: '(800) 595-3232',
-  Fax: '(800) 595-3231',
-  Website: 'http://www.nowebsitedepot.dx',
-}, {
-  ID: 3,
-  CompanyName: 'K&S Music',
-  Address: '1000 Nicllet Mall',
-  City: 'Minneapolis',
-  State: 'Minnesota',
-  Zipcode: 55403,
-  Phone: '(612) 304-6073',
-  Fax: '(612) 304-6074',
-  Website: 'http://www.nowebsitemusic.dx',
-}, {
-  ID: 4,
-  CompanyName: "Tom's Club",
-  Address: '999 Lake Drive',
-  City: 'Issaquah',
-  State: 'Washington',
-  Zipcode: 98027,
-  Phone: '(800) 955-2292',
-  Fax: '(800) 955-2293',
-  Website: 'http://www.nowebsitetomsclub.dx',
-}, {
-  ID: 5,
-  CompanyName: 'E-Mart',
-  Address: '3333 Beverly Rd',
-  City: 'Hoffman Estates',
-  State: 'Illinois',
-  Zipcode: 60179,
-  Phone: '(847) 286-2500',
-  Fax: '(847) 286-2501',
-  Website: 'http://www.nowebsiteemart.dx',
-}, {
-  ID: 6,
-  CompanyName: 'Walters',
-  Address: '200 Wilmot Rd',
-  City: 'Deerfield',
-  State: 'Illinois',
-  Zipcode: 60015,
-  Phone: '(847) 940-2500',
-  Fax: '(847) 940-2501',
-  Website: 'http://www.nowebsitewalters.dx',
-}, {
-  ID: 7,
-  CompanyName: 'StereoShack',
-  Address: '400 Commerce S',
-  City: 'Fort Worth',
-  State: 'Texas',
-  Zipcode: 76102,
-  Phone: '(817) 820-0741',
-  Fax: '(817) 820-0742',
-  Website: 'http://www.nowebsiteshack.dx',
-}, {
-  ID: 8,
-  CompanyName: 'Circuit Town',
-  Address: '2200 Kensington Court',
-  City: 'Oak Brook',
-  State: 'Illinois',
-  Zipcode: 60523,
-  Phone: '(800) 955-2929',
-  Fax: '(800) 955-9392',
-  Website: 'http://www.nowebsitecircuittown.dx',
-}, {
-  ID: 9,
-  CompanyName: 'Premier Buy',
-  Address: '7601 Penn Avenue South',
-  City: 'Richfield',
-  State: 'Minnesota',
-  Zipcode: 55423,
-  Phone: '(612) 291-1000',
-  Fax: '(612) 291-2001',
-  Website: 'http://www.nowebsitepremierbuy.dx',
-}, {
-  ID: 10,
-  CompanyName: 'ElectrixMax',
-  Address: '263 Shuman Blvd',
-  City: 'Naperville',
-  State: 'Illinois',
-  Zipcode: 60563,
-  Phone: '(630) 438-7800',
-  Fax: '(630) 438-7801',
-  Website: 'http://www.nowebsiteelectrixmax.dx',
-}, {
-  ID: 11,
-  CompanyName: 'Video Emporium',
-  Address: '1201 Elm Street',
-  City: 'Dallas',
-  State: 'Texas',
-  Zipcode: 75270,
-  Phone: '(214) 854-3000',
-  Fax: '(214) 854-3001',
-  Website: 'http://www.nowebsitevideoemporium.dx',
-}, {
-  ID: 12,
-  CompanyName: 'Screen Shop',
-  Address: '1000 Lowes Blvd',
-  City: 'Mooresville',
-  State: 'North Carolina',
-  Zipcode: 28117,
-  Phone: '(800) 445-6937',
-  Fax: '(800) 445-6938',
-  Website: 'http://www.nowebsitescreenshop.dx',
-}];
+const employees: Employee[] = [
+  {
+    ID: 1,
+    FullName: 'John Heart',
+    Title: 'CEO',
+    Employee_Picture: '01.png',
+    Picture: '../../../../images/employees/01.png',
+    MobilePhone: '2135559392',
+  },
+  {
+    ID: 2,
+    FullName: 'Samantha Bright',
+    Title: 'COO',
+    Employee_Picture: '30.png',
+    Picture: '../../../../images/employees/30.png',
+    MobilePhone: '2135552858',
+  },
+  {
+    ID: 3,
+    FullName: 'Arthur Miller',
+    Title: 'CTO',
+    Employee_Picture: '10.png',
+    Picture: '../../../../images/employees/10.png',
+    MobilePhone: '3105558583',
+  },
+  {
+    ID: 4,
+    FullName: 'Robert Reagan',
+    Title: 'CMO',
+    Employee_Picture: '03.png',
+    Picture: '../../../../images/employees/03.png',
+    MobilePhone: '8185552387',
+  },
+  {
+    ID: 5,
+    FullName: 'Greta Sims',
+    Title: 'HR Manager',
+    Employee_Picture: '04.png',
+    Picture: '../../../../images/employees/04.png',
+    MobilePhone: '8185556546',
+  },
+  {
+    ID: 6,
+    FullName: 'Brett Wade',
+    Title: 'IT Manager',
+    Employee_Picture: '05.png',
+    Picture: '../../../../images/employees/05.png',
+    MobilePhone: '6265550358',
+  },
+  {
+    ID: 7,
+    FullName: 'Sandra Johnson',
+    Title: 'Controller',
+    Employee_Picture: '06.png',
+    Picture: '../../../../images/employees/06.png',
+    MobilePhone: '5625552082',
+  },
+  {
+    ID: 8,
+    FullName: 'Ed Holmes',
+    Title: 'Sales Manager',
+    Employee_Picture: '11.png',
+    Picture: '../../../../images/employees/11.png',
+    MobilePhone: '3105551288',
+  },
+  {
+    ID: 9,
+    FullName: 'Barb Banks',
+    Title: 'Support Manager',
+    Employee_Picture: '20.png',
+    Picture: '../../../../images/employees/20.png',
+    MobilePhone: '3105553355',
+  },
+  {
+    ID: 10,
+    FullName: 'Kevin Carter',
+    Title: 'Shipping Manager',
+    Employee_Picture: '07.png',
+    Picture: '../../../../images/employees/07.png',
+    MobilePhone: '2135552840',
+  },
+  {
+    ID: 11,
+    FullName: 'Cindy Stanwick',
+    Title: 'HR Assistant',
+    Employee_Picture: '08.png',
+    Picture: '../../../../images/employees/08.png',
+    MobilePhone: '8185556655',
+  },
+  {
+    ID: 12,
+    FullName: 'Sammy Hill',
+    Title: 'Sales Assistant',
+    Employee_Picture: '12.png',
+    Picture: '../../../../images/employees/12.png',
+    MobilePhone: '6265557292',
+  },
+  {
+    ID: 13,
+    FullName: 'Davey Jones',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '13.png',
+    Picture: '../../../../images/employees/13.png',
+    MobilePhone: '6265550281',
+  },
+  {
+    ID: 14,
+    FullName: 'Victor Norris',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '14.png',
+    Picture: '../../../../images/employees/14.png',
+    MobilePhone: '2135559278',
+  },
+  {
+    ID: 15,
+    FullName: 'Mary Stern',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '15.png',
+    Picture: '../../../../images/employees/15.png',
+    MobilePhone: '8185557857',
+  },
+  {
+    ID: 16,
+    FullName: 'Robin Cosworth',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '16.png',
+    Picture: '../../../../images/employees/16.png',
+    MobilePhone: '8185550942',
+  },
+  {
+    ID: 17,
+    FullName: 'Kelly Rodriguez',
+    Title: 'Support Assistant',
+    Employee_Picture: '17.png',
+    Picture: '../../../../images/employees/17.png',
+    MobilePhone: '8185559248',
+  },
+  {
+    ID: 18,
+    FullName: 'James Anderson',
+    Title: 'Support Assistant',
+    Employee_Picture: '18.png',
+    Picture: '../../../../images/employees/18.png',
+    MobilePhone: '3235554702',
+  },
+  {
+    ID: 19,
+    FullName: 'Antony Remmen',
+    Title: 'Support Assistant',
+    Employee_Picture: '19.png',
+    Picture: '../../../../images/employees/19.png',
+    MobilePhone: '3105556625',
+  },
+  {
+    ID: 20,
+    FullName: 'Olivia Peyton',
+    Title: 'Sales Assistant',
+    Employee_Picture: '09.png',
+    Picture: '../../../../images/employees/09.png',
+    MobilePhone: '3105552728',
+  },
+  {
+    ID: 21,
+    FullName: 'Taylor Riley',
+    Title: 'Network Admin',
+    Employee_Picture: '21.png',
+    Picture: '../../../../images/employees/21.png',
+    MobilePhone: '3105557276',
+  },
+  {
+    ID: 22,
+    FullName: 'Amelia Harper',
+    Title: 'Network Admin',
+    Employee_Picture: '22.png',
+    Picture: '../../../../images/employees/22.png',
+    MobilePhone: '2135554276',
+  },
+  {
+    ID: 23,
+    FullName: 'Wally Hobbs',
+    Title: 'Programmer',
+    Employee_Picture: '23.png',
+    Picture: '../../../../images/employees/23.png',
+    MobilePhone: '8185558872',
+  },
+  {
+    ID: 24,
+    FullName: 'Brad Jameson',
+    Title: 'Programmer',
+    Employee_Picture: '24.png',
+    Picture: '../../../../images/employees/24.png',
+    MobilePhone: '8185554646',
+  },
+  {
+    ID: 25,
+    FullName: 'Karen Goodson',
+    Title: 'Programmer',
+    Employee_Picture: '25.png',
+    Picture: '../../../../images/employees/25.png',
+    MobilePhone: '6265550908',
+  },
+  {
+    ID: 26,
+    FullName: 'Marcus Orbison',
+    Title: 'Travel Coordinator',
+    Employee_Picture: '26.png',
+    Picture: '../../../../images/employees/26.png',
+    MobilePhone: '2135557098',
+  },
+  {
+    ID: 27,
+    FullName: 'Sandy Bright',
+    Title: 'Benefits Coordinator',
+    Employee_Picture: '27.png',
+    Picture: '../../../../images/employees/27.png',
+    MobilePhone: '8185550524',
+  },
+  {
+    ID: 28,
+    FullName: 'Morgan Kennedy',
+    Title: 'Graphic Designer',
+    Employee_Picture: '28.png',
+    Picture: '../../../../images/employees/28.png',
+    MobilePhone: '8185558238',
+  },
+  {
+    ID: 29,
+    FullName: 'Violet Bailey',
+    Title: 'Jr Graphic Designer',
+    Employee_Picture: '29.png',
+    Picture: '../../../../images/employees/29.png',
+    MobilePhone: '8185552478',
+  },
+  {
+    ID: 30,
+    FullName: 'Ken Samuelson',
+    Title: 'Ombudsman',
+    Employee_Picture: '02.png',
+    Picture: '../../../../images/employees/02.png',
+    MobilePhone: '5625559282',
+  },
+  {
+    ID: 31,
+    FullName: 'Nat Maguiree',
+    Title: 'Trainer',
+    Employee_Picture: '31.png',
+    Picture: '../../../../images/employees/31.png',
+    MobilePhone: '5625558377',
+  },
+  {
+    ID: 32,
+    FullName: 'Bart Arnaz',
+    Title: 'Director of Engineering',
+    Employee_Picture: '32.png',
+    Picture: '../../../../images/employees/32.png',
+    MobilePhone: '7145552000',
+  },
+  {
+    ID: 33,
+    FullName: 'Leah Simpson',
+    Title: 'Test Coordinator',
+    Employee_Picture: '33.png',
+    Picture: '../../../../images/employees/33.png',
+    MobilePhone: '5625595830',
+  },
+  {
+    ID: 34,
+    FullName: 'Arnie Schwartz',
+    Title: 'Engineer',
+    Employee_Picture: '34.png',
+    Picture: '../../../../images/employees/34.png',
+    MobilePhone: '7145558882',
+  },
+  {
+    ID: 35,
+    FullName: 'Billy Zimmer',
+    Title: 'Engineer',
+    Employee_Picture: '51.png',
+    Picture: '../../../../images/employees/51.png',
+    MobilePhone: '9095556939',
+  },
+  {
+    ID: 36,
+    FullName: 'Samantha Piper',
+    Title: 'Engineer',
+    Employee_Picture: '35.png',
+    Picture: '../../../../images/employees/35.png',
+    MobilePhone: '3235554512',
+  },
+  {
+    ID: 37,
+    FullName: 'Maggie Boxter',
+    Title: 'Engineer',
+    Employee_Picture: '36.png',
+    Picture: '../../../../images/employees/36.png',
+    MobilePhone: '7145557239',
+  },
+  {
+    ID: 38,
+    FullName: 'Terry Bradley',
+    Title: 'QA Engineer',
+    Employee_Picture: '37.png',
+    Picture: '../../../../images/employees/37.png',
+    MobilePhone: '8055552788',
+  },
+  {
+    ID: 39,
+    FullName: 'Gabe Jones',
+    Title: 'Retail Coordinator',
+    Employee_Picture: '38.png',
+    Picture: '../../../../images/employees/38.png',
+    MobilePhone: '3105555395',
+  },
+  {
+    ID: 40,
+    FullName: 'Lucy Ball',
+    Title: 'Sales Assistant',
+    Employee_Picture: '39.png',
+    Picture: '../../../../images/employees/39.png',
+    MobilePhone: '3105553357',
+  },
+  {
+    ID: 41,
+    FullName: 'Jim Packard',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '40.png',
+    Picture: '../../../../images/employees/40.png',
+    MobilePhone: '6615558224',
+  },
+  {
+    ID: 42,
+    FullName: 'Hannah Brookly',
+    Title: 'Online Sales Manager',
+    Employee_Picture: '41.png',
+    Picture: '../../../../images/employees/41.png',
+    MobilePhone: '8055553627',
+  },
+  {
+    ID: 43,
+    FullName: 'Harv Mudd',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '42.png',
+    Picture: '../../../../images/employees/42.png',
+    MobilePhone: '8315553895',
+  },
+  {
+    ID: 44,
+    FullName: 'Clark Morgan',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '43.png',
+    Picture: '../../../../images/employees/43.png',
+    MobilePhone: '9255552525',
+  },
+  {
+    ID: 45,
+    FullName: 'Todd Hoffman',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '44.png',
+    Picture: '../../../../images/employees/44.png',
+    MobilePhone: '9255553579',
+  },
+  {
+    ID: 46,
+    FullName: 'Jackie Garmin',
+    Title: 'Support Assistant',
+    Employee_Picture: '45.png',
+    Picture: '../../../../images/employees/45.png',
+    MobilePhone: '2135551824',
+  },
+  {
+    ID: 47,
+    FullName: 'Lincoln Bartlett',
+    Title: 'Sales Assistant',
+    Employee_Picture: '46.png',
+    Picture: '../../../../images/employees/46.png',
+    MobilePhone: '2135558272',
+  },
+  {
+    ID: 48,
+    FullName: 'Brad Farkus',
+    Title: 'Engineer',
+    Employee_Picture: '47.png',
+    Picture: '../../../../images/employees/47.png',
+    MobilePhone: '2135553626',
+  },
+  {
+    ID: 49,
+    FullName: 'Jenny Hobbs',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '48.png',
+    Picture: '../../../../images/employees/48.png',
+    MobilePhone: '3105552668',
+  },
+  {
+    ID: 50,
+    FullName: 'Dallas Lou',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '49.png',
+    Picture: '../../../../images/employees/49.png',
+    MobilePhone: '2135558357',
+  },
+  {
+    ID: 51,
+    FullName: 'Stu Pizaro',
+    Title: 'Engineer',
+    Employee_Picture: '50.png',
+    Picture: '../../../../images/employees/50.png',
+    MobilePhone: '2135552552',
+  },
+];
 
 @Injectable()
 export class Service {
-  getCustomers() {
-    return customers;
+  getEmployees() {
+    return employees;
   }
 }
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.html b/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.html
new file mode 100644
index 000000000000..436ef5afdbfc
--- /dev/null
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.html
@@ -0,0 +1,21 @@
+<div class="employees__img-wrapper">
+  <img
+    class="employees__img"
+    [src]="employee.Picture"
+    [alt]="employee.FullName"
+  />
+</div>
+<div class="employees__info">
+  <div class="employees__info-row">
+    <span class="employees__info-label">Full Name:</span>
+    <span class="employees__info-value">{{ employee.FullName }}</span>
+  </div>
+  <div class="employees__info-row">
+    <span class="employees__info-label">Position:</span>
+    <span class="employees__info-value">{{ employee.Title }}</span>
+  </div>
+  <div class="employees__info-row">
+    <span class="employees__info-label">Phone:</span>
+    <span class="employees__info-value">{{ employee.MobilePhone }}</span>
+  </div>
+</div>
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.ts b/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.ts
new file mode 100644
index 000000000000..7f112f55fbdb
--- /dev/null
+++ b/apps/demos/Demos/Pagination/Overview/Angular/app/employee-card/employee-card.component.ts
@@ -0,0 +1,16 @@
+import { Component, Input } from '@angular/core';
+import { Employee } from '../app.service';
+
+let modulePrefix = '';
+// @ts-ignore
+if (window && window.config.packageConfigPaths) {
+  modulePrefix = '/app';
+}
+
+@Component({
+  selector: 'employee-card',
+  templateUrl: `.${modulePrefix}/employee-card/employee-card.component.html`,
+})
+export class EmployeeCard {
+  @Input() employee: Employee;
+}
diff --git a/apps/demos/Demos/Pagination/Overview/Angular/index.html b/apps/demos/Demos/Pagination/Overview/Angular/index.html
index 3bb93e38968b..d6cce972f42b 100644
--- a/apps/demos/Demos/Pagination/Overview/Angular/index.html
+++ b/apps/demos/Demos/Pagination/Overview/Angular/index.html
@@ -8,7 +8,7 @@
     <link rel="stylesheet" type="text/css" href="../../../../node_modules/devextreme/dist/css/dx.light.css" />
 
     <script src="../../../../node_modules/core-js/client/shim.min.js"></script>
-    <script src="../../../../node_modules/zone.js/dist/zone.js"></script>
+    <script src="../../../../node_modules/zone.js/bundles/zone.umd.js"></script>
     <script src="../../../../node_modules/reflect-metadata/Reflect.js"></script>
     <script src="../../../../node_modules/systemjs/dist/system.js"></script>
 
diff --git a/apps/demos/Demos/Pagination/Overview/React/App.tsx b/apps/demos/Demos/Pagination/Overview/React/App.tsx
index 62e519df1408..43ffc99aae3b 100644
--- a/apps/demos/Demos/Pagination/Overview/React/App.tsx
+++ b/apps/demos/Demos/Pagination/Overview/React/App.tsx
@@ -1,13 +1,14 @@
 import React, { useState } from 'react';
 import Pagination from 'devextreme-react/pagination';
 import EmployeeGallery from './EmployeesGallery.tsx';
+
 import { employees } from './data.ts';
 
 const PAGE_SIZES = [4, 6];
 
 const App = () => {
-  const [pageSize, setPageSize] = useState<number>(4);
-  const [pageIndex, setPageIndex] = useState<number>(1);
+  const [pageSize, setPageSize] = useState(4);
+  const [pageIndex, setPageIndex] = useState(1);
 
   return (
     <>
diff --git a/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx b/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx
index b2256729a59a..cf450dd52775 100644
--- a/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx
+++ b/apps/demos/Demos/Pagination/Overview/React/EmployeeCard.tsx
@@ -1,13 +1,5 @@
 import React from 'react';
-
-interface Employee {
-  ID: number;
-  FullName: string;
-  Title: string;
-  Employee_Picture: string;
-  Picture: string;
-  MobilePhone: string;
-}
+import { 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
index e6fe26410b53..c8667c9b344f 100644
--- a/apps/demos/Demos/Pagination/Overview/React/EmployeesGallery.tsx
+++ b/apps/demos/Demos/Pagination/Overview/React/EmployeesGallery.tsx
@@ -1,14 +1,6 @@
 import React from 'react';
 import EmployeeCard from './EmployeeCard.tsx';
-
-interface Employee {
-  ID: number;
-  FullName: string;
-  Title: string;
-  Employee_Picture: string;
-  Picture: string;
-  MobilePhone: string;
-}
+import { Employee } from './data';
 
 interface EmployeeGalleryProps {
   employees: Employee[];
diff --git a/apps/demos/Demos/Pagination/Overview/React/data.ts b/apps/demos/Demos/Pagination/Overview/React/data.ts
index ba137678f19b..bd2e43e18ba2 100644
--- a/apps/demos/Demos/Pagination/Overview/React/data.ts
+++ b/apps/demos/Demos/Pagination/Overview/React/data.ts
@@ -1,4 +1,13 @@
-export const employees = [
+export interface Employee {
+  ID: number;
+  FullName: string;
+  Title: string;
+  Employee_Picture: string;
+  Picture: string;
+  MobilePhone: string;
+}
+
+export const employees: Employee[] = [
   {
     ID: 1,
     FullName: 'John Heart',
diff --git a/apps/demos/Demos/Pagination/Overview/Vue/App.vue b/apps/demos/Demos/Pagination/Overview/Vue/App.vue
index ad7848d2eb91..ab1ada0a0e04 100644
--- a/apps/demos/Demos/Pagination/Overview/Vue/App.vue
+++ b/apps/demos/Demos/Pagination/Overview/Vue/App.vue
@@ -1,24 +1,159 @@
 <template>
-  <DxDataGrid
-    :data-source="dataSource"
-    :columns="columns"
-    :show-borders="true"
+  <div class="employees" :class="{ 
+    'employees--forth': pageSize === 4,
+    'employees--six': pageSize === 6,
+   }">
+    <div class="employees__card" v-for="employee in pageEmployees">
+      <div class="employees__img-wrapper">
+        <img class="employees__img"
+         :src="employee.Picture" 
+         :alt="employee.FullName" 
+        />
+      </div>
+      <div class="employees__info">
+        <div class="employees__info-row">
+          <span class="employees__info-label">Full Name:</span>
+          <span class="employees__info-value">{{ employee.FullName }}</span>
+        </div>
+        <div class="employees__info-row">
+          <span class="employees__info-label">Position:</span>
+          <span class="employees__info-value">{{ employee.Title }}</span>
+        </div>
+        <div class="employees__info-row">
+          <span class="employees__info-label">Phone:</span>
+          <span class="employees__info-value">{{ employee.MobilePhone }}</span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <DxPagination
+    :show-info="showInfo"
+    :show-navigation-buttons="showPageSizeSelector"
+    :allowed-page-sizes="pageSizes"
+    v-model:page-index="pageIndex"
+    v-model:page-size="pageSize"
+    :item-count="itemCount"
   />
 </template>
-<script>
-
-import DxDataGrid from 'devextreme-vue/data-grid';
-import { customers } from './data.js';
-
-export default {
-  components: {
-    DxDataGrid,
-  },
-  data() {
-    return {
-      dataSource: customers,
-      columns: ['CompanyName', 'City', 'State', 'Phone', 'Fax'],
-    };
-  },
-};
+
+<script setup lang="ts">
+import { computed, ref } from 'vue';
+import DxPagination from 'devextreme-vue/pagination';
+import { employees } from './data.ts';
+
+const getPageEmployees = (pageIndex, pageSize) => {
+  return employees.slice((pageIndex - 1) * pageSize, pageIndex * pageSize);
+}
+
+const pageSizes = [4, 6];
+const showInfo = true;
+const showPageSizeSelector = true;
+const pageIndex = ref(1);
+const pageSize = ref(4);
+const itemCount = employees.length;
+const pageEmployees = computed(() => getPageEmployees(pageIndex.value, pageSize.value));
 </script>
+
+<style>
+body {
+  overflow-x: hidden;
+}
+
+.demo-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.container {
+  min-width: 720px;
+  width: 100%;
+}
+
+.employees {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  min-height: 644px;
+  padding-bottom: 24px;
+}
+
+.employees__card {
+  width: 100%;
+  max-height: 312px;
+  align-self: stretch;
+  overflow: hidden;
+  border: var(--dx-border-width) solid var(--dx-color-border);
+  border-radius: var(--dx-border-radius);
+  background-color: var(--dx-component-color-bg);
+}
+
+.employees.employees--forth .employees__card {
+  min-width: 250px;
+  width: 390px;
+  flex-basis: calc(50% - 10px);
+}
+
+.employees.employees--six .employees__card {
+  flex-basis: calc(33.3% - 12.5px);
+}
+
+.employees__img-wrapper {
+  height: 180px;
+  position: relative;
+  overflow: hidden;
+  border-bottom: var(--dx-border-width) solid var(--dx-color-border);
+  background-color: #fff;
+}
+
+.employees__img {
+  display: block;
+  height: 220px;
+  position: absolute;
+  content: "";
+  left: 50%;
+  top: 0;
+  transform: translateX(-50%);
+}
+
+.employees__info {
+  padding: 24px;
+}
+
+.employees__info-row {
+  margin-bottom: 8px;
+  text-wrap: nowrap;
+}
+
+.employees__info-label {
+  display: inline-block;
+  font-weight: 600;
+  vertical-align: middle;
+}
+
+.employees.employees--forth .employees__info-label {
+  width: 160px;
+}
+
+.employees.employees--six .employees__info-label {
+  width: 80px;
+}
+
+.employees__info-value {
+  display: inline-block;
+  text-wrap: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+  overflow: hidden;
+  white-space:nowrap
+}
+
+.employees.employees--forth .employees__info-value {
+  max-width: 180px;
+}
+
+.employees.employees--six .employees__info-value {
+  max-width: 120px;
+}
+</style>
\ No newline at end of file
diff --git a/apps/demos/Demos/Pagination/Overview/Vue/data.js b/apps/demos/Demos/Pagination/Overview/Vue/data.js
deleted file mode 100644
index 6380157422df..000000000000
--- a/apps/demos/Demos/Pagination/Overview/Vue/data.js
+++ /dev/null
@@ -1,121 +0,0 @@
-export const customers = [{
-  ID: 1,
-  CompanyName: 'Super Mart of the West',
-  Address: '702 SW 8th Street',
-  City: 'Bentonville',
-  State: 'Arkansas',
-  Zipcode: 72716,
-  Phone: '(800) 555-2797',
-  Fax: '(800) 555-2171',
-  Website: 'http://www.nowebsitesupermart.dx',
-}, {
-  ID: 2,
-  CompanyName: 'Electronics Depot',
-  Address: '2455 Paces Ferry Road NW',
-  City: 'Atlanta',
-  State: 'Georgia',
-  Zipcode: 30339,
-  Phone: '(800) 595-3232',
-  Fax: '(800) 595-3231',
-  Website: 'http://www.nowebsitedepot.dx',
-}, {
-  ID: 3,
-  CompanyName: 'K&S Music',
-  Address: '1000 Nicllet Mall',
-  City: 'Minneapolis',
-  State: 'Minnesota',
-  Zipcode: 55403,
-  Phone: '(612) 304-6073',
-  Fax: '(612) 304-6074',
-  Website: 'http://www.nowebsitemusic.dx',
-}, {
-  ID: 4,
-  CompanyName: "Tom's Club",
-  Address: '999 Lake Drive',
-  City: 'Issaquah',
-  State: 'Washington',
-  Zipcode: 98027,
-  Phone: '(800) 955-2292',
-  Fax: '(800) 955-2293',
-  Website: 'http://www.nowebsitetomsclub.dx',
-}, {
-  ID: 5,
-  CompanyName: 'E-Mart',
-  Address: '3333 Beverly Rd',
-  City: 'Hoffman Estates',
-  State: 'Illinois',
-  Zipcode: 60179,
-  Phone: '(847) 286-2500',
-  Fax: '(847) 286-2501',
-  Website: 'http://www.nowebsiteemart.dx',
-}, {
-  ID: 6,
-  CompanyName: 'Walters',
-  Address: '200 Wilmot Rd',
-  City: 'Deerfield',
-  State: 'Illinois',
-  Zipcode: 60015,
-  Phone: '(847) 940-2500',
-  Fax: '(847) 940-2501',
-  Website: 'http://www.nowebsitewalters.dx',
-}, {
-  ID: 7,
-  CompanyName: 'StereoShack',
-  Address: '400 Commerce S',
-  City: 'Fort Worth',
-  State: 'Texas',
-  Zipcode: 76102,
-  Phone: '(817) 820-0741',
-  Fax: '(817) 820-0742',
-  Website: 'http://www.nowebsiteshack.dx',
-}, {
-  ID: 8,
-  CompanyName: 'Circuit Town',
-  Address: '2200 Kensington Court',
-  City: 'Oak Brook',
-  State: 'Illinois',
-  Zipcode: 60523,
-  Phone: '(800) 955-2929',
-  Fax: '(800) 955-9392',
-  Website: 'http://www.nowebsitecircuittown.dx',
-}, {
-  ID: 9,
-  CompanyName: 'Premier Buy',
-  Address: '7601 Penn Avenue South',
-  City: 'Richfield',
-  State: 'Minnesota',
-  Zipcode: 55423,
-  Phone: '(612) 291-1000',
-  Fax: '(612) 291-2001',
-  Website: 'http://www.nowebsitepremierbuy.dx',
-}, {
-  ID: 10,
-  CompanyName: 'ElectrixMax',
-  Address: '263 Shuman Blvd',
-  City: 'Naperville',
-  State: 'Illinois',
-  Zipcode: 60563,
-  Phone: '(630) 438-7800',
-  Fax: '(630) 438-7801',
-  Website: 'http://www.nowebsiteelectrixmax.dx',
-}, {
-  ID: 11,
-  CompanyName: 'Video Emporium',
-  Address: '1201 Elm Street',
-  City: 'Dallas',
-  State: 'Texas',
-  Zipcode: 75270,
-  Phone: '(214) 854-3000',
-  Fax: '(214) 854-3001',
-  Website: 'http://www.nowebsitevideoemporium.dx',
-}, {
-  ID: 12,
-  CompanyName: 'Screen Shop',
-  Address: '1000 Lowes Blvd',
-  City: 'Mooresville',
-  State: 'North Carolina',
-  Zipcode: 28117,
-  Phone: '(800) 445-6937',
-  Fax: '(800) 445-6938',
-  Website: 'http://www.nowebsitescreenshop.dx',
-}];
diff --git a/apps/demos/Demos/Pagination/Overview/Vue/data.ts b/apps/demos/Demos/Pagination/Overview/Vue/data.ts
new file mode 100644
index 000000000000..ee0d580fe540
--- /dev/null
+++ b/apps/demos/Demos/Pagination/Overview/Vue/data.ts
@@ -0,0 +1,419 @@
+export interface Employee {
+  ID: number;
+  FullName: string;
+  Title: string;
+  Employee_Picture: string;
+  Picture: string;
+  MobilePhone: string;
+}
+
+export const employees: Employee[] = [
+  {
+    ID: 1,
+    FullName: 'John Heart',
+    Title: 'CEO',
+    Employee_Picture: '01.png',
+    Picture: '../../../../images/employees/01.png',
+    MobilePhone: '2135559392',
+  },
+  {
+    ID: 2,
+    FullName: 'Samantha Bright',
+    Title: 'COO',
+    Employee_Picture: '30.png',
+    Picture: '../../../../images/employees/30.png',
+    MobilePhone: '2135552858',
+  },
+  {
+    ID: 3,
+    FullName: 'Arthur Miller',
+    Title: 'CTO',
+    Employee_Picture: '10.png',
+    Picture: '../../../../images/employees/10.png',
+    MobilePhone: '3105558583',
+  },
+  {
+    ID: 4,
+    FullName: 'Robert Reagan',
+    Title: 'CMO',
+    Employee_Picture: '03.png',
+    Picture: '../../../../images/employees/03.png',
+    MobilePhone: '8185552387',
+  },
+  {
+    ID: 5,
+    FullName: 'Greta Sims',
+    Title: 'HR Manager',
+    Employee_Picture: '04.png',
+    Picture: '../../../../images/employees/04.png',
+    MobilePhone: '8185556546',
+  },
+  {
+    ID: 6,
+    FullName: 'Brett Wade',
+    Title: 'IT Manager',
+    Employee_Picture: '05.png',
+    Picture: '../../../../images/employees/05.png',
+    MobilePhone: '6265550358',
+  },
+  {
+    ID: 7,
+    FullName: 'Sandra Johnson',
+    Title: 'Controller',
+    Employee_Picture: '06.png',
+    Picture: '../../../../images/employees/06.png',
+    MobilePhone: '5625552082',
+  },
+  {
+    ID: 8,
+    FullName: 'Ed Holmes',
+    Title: 'Sales Manager',
+    Employee_Picture: '11.png',
+    Picture: '../../../../images/employees/11.png',
+    MobilePhone: '3105551288',
+  },
+  {
+    ID: 9,
+    FullName: 'Barb Banks',
+    Title: 'Support Manager',
+    Employee_Picture: '20.png',
+    Picture: '../../../../images/employees/20.png',
+    MobilePhone: '3105553355',
+  },
+  {
+    ID: 10,
+    FullName: 'Kevin Carter',
+    Title: 'Shipping Manager',
+    Employee_Picture: '07.png',
+    Picture: '../../../../images/employees/07.png',
+    MobilePhone: '2135552840',
+  },
+  {
+    ID: 11,
+    FullName: 'Cindy Stanwick',
+    Title: 'HR Assistant',
+    Employee_Picture: '08.png',
+    Picture: '../../../../images/employees/08.png',
+    MobilePhone: '8185556655',
+  },
+  {
+    ID: 12,
+    FullName: 'Sammy Hill',
+    Title: 'Sales Assistant',
+    Employee_Picture: '12.png',
+    Picture: '../../../../images/employees/12.png',
+    MobilePhone: '6265557292',
+  },
+  {
+    ID: 13,
+    FullName: 'Davey Jones',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '13.png',
+    Picture: '../../../../images/employees/13.png',
+    MobilePhone: '6265550281',
+  },
+  {
+    ID: 14,
+    FullName: 'Victor Norris',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '14.png',
+    Picture: '../../../../images/employees/14.png',
+    MobilePhone: '2135559278',
+  },
+  {
+    ID: 15,
+    FullName: 'Mary Stern',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '15.png',
+    Picture: '../../../../images/employees/15.png',
+    MobilePhone: '8185557857',
+  },
+  {
+    ID: 16,
+    FullName: 'Robin Cosworth',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '16.png',
+    Picture: '../../../../images/employees/16.png',
+    MobilePhone: '8185550942',
+  },
+  {
+    ID: 17,
+    FullName: 'Kelly Rodriguez',
+    Title: 'Support Assistant',
+    Employee_Picture: '17.png',
+    Picture: '../../../../images/employees/17.png',
+    MobilePhone: '8185559248',
+  },
+  {
+    ID: 18,
+    FullName: 'James Anderson',
+    Title: 'Support Assistant',
+    Employee_Picture: '18.png',
+    Picture: '../../../../images/employees/18.png',
+    MobilePhone: '3235554702',
+  },
+  {
+    ID: 19,
+    FullName: 'Antony Remmen',
+    Title: 'Support Assistant',
+    Employee_Picture: '19.png',
+    Picture: '../../../../images/employees/19.png',
+    MobilePhone: '3105556625',
+  },
+  {
+    ID: 20,
+    FullName: 'Olivia Peyton',
+    Title: 'Sales Assistant',
+    Employee_Picture: '09.png',
+    Picture: '../../../../images/employees/09.png',
+    MobilePhone: '3105552728',
+  },
+  {
+    ID: 21,
+    FullName: 'Taylor Riley',
+    Title: 'Network Admin',
+    Employee_Picture: '21.png',
+    Picture: '../../../../images/employees/21.png',
+    MobilePhone: '3105557276',
+  },
+  {
+    ID: 22,
+    FullName: 'Amelia Harper',
+    Title: 'Network Admin',
+    Employee_Picture: '22.png',
+    Picture: '../../../../images/employees/22.png',
+    MobilePhone: '2135554276',
+  },
+  {
+    ID: 23,
+    FullName: 'Wally Hobbs',
+    Title: 'Programmer',
+    Employee_Picture: '23.png',
+    Picture: '../../../../images/employees/23.png',
+    MobilePhone: '8185558872',
+  },
+  {
+    ID: 24,
+    FullName: 'Brad Jameson',
+    Title: 'Programmer',
+    Employee_Picture: '24.png',
+    Picture: '../../../../images/employees/24.png',
+    MobilePhone: '8185554646',
+  },
+  {
+    ID: 25,
+    FullName: 'Karen Goodson',
+    Title: 'Programmer',
+    Employee_Picture: '25.png',
+    Picture: '../../../../images/employees/25.png',
+    MobilePhone: '6265550908',
+  },
+  {
+    ID: 26,
+    FullName: 'Marcus Orbison',
+    Title: 'Travel Coordinator',
+    Employee_Picture: '26.png',
+    Picture: '../../../../images/employees/26.png',
+    MobilePhone: '2135557098',
+  },
+  {
+    ID: 27,
+    FullName: 'Sandy Bright',
+    Title: 'Benefits Coordinator',
+    Employee_Picture: '27.png',
+    Picture: '../../../../images/employees/27.png',
+    MobilePhone: '8185550524',
+  },
+  {
+    ID: 28,
+    FullName: 'Morgan Kennedy',
+    Title: 'Graphic Designer',
+    Employee_Picture: '28.png',
+    Picture: '../../../../images/employees/28.png',
+    MobilePhone: '8185558238',
+  },
+  {
+    ID: 29,
+    FullName: 'Violet Bailey',
+    Title: 'Jr Graphic Designer',
+    Employee_Picture: '29.png',
+    Picture: '../../../../images/employees/29.png',
+    MobilePhone: '8185552478',
+  },
+  {
+    ID: 30,
+    FullName: 'Ken Samuelson',
+    Title: 'Ombudsman',
+    Employee_Picture: '02.png',
+    Picture: '../../../../images/employees/02.png',
+    MobilePhone: '5625559282',
+  },
+  {
+    ID: 31,
+    FullName: 'Nat Maguiree',
+    Title: 'Trainer',
+    Employee_Picture: '31.png',
+    Picture: '../../../../images/employees/31.png',
+    MobilePhone: '5625558377',
+  },
+  {
+    ID: 32,
+    FullName: 'Bart Arnaz',
+    Title: 'Director of Engineering',
+    Employee_Picture: '32.png',
+    Picture: '../../../../images/employees/32.png',
+    MobilePhone: '7145552000',
+  },
+  {
+    ID: 33,
+    FullName: 'Leah Simpson',
+    Title: 'Test Coordinator',
+    Employee_Picture: '33.png',
+    Picture: '../../../../images/employees/33.png',
+    MobilePhone: '5625595830',
+  },
+  {
+    ID: 34,
+    FullName: 'Arnie Schwartz',
+    Title: 'Engineer',
+    Employee_Picture: '34.png',
+    Picture: '../../../../images/employees/34.png',
+    MobilePhone: '7145558882',
+  },
+  {
+    ID: 35,
+    FullName: 'Billy Zimmer',
+    Title: 'Engineer',
+    Employee_Picture: '51.png',
+    Picture: '../../../../images/employees/51.png',
+    MobilePhone: '9095556939',
+  },
+  {
+    ID: 36,
+    FullName: 'Samantha Piper',
+    Title: 'Engineer',
+    Employee_Picture: '35.png',
+    Picture: '../../../../images/employees/35.png',
+    MobilePhone: '3235554512',
+  },
+  {
+    ID: 37,
+    FullName: 'Maggie Boxter',
+    Title: 'Engineer',
+    Employee_Picture: '36.png',
+    Picture: '../../../../images/employees/36.png',
+    MobilePhone: '7145557239',
+  },
+  {
+    ID: 38,
+    FullName: 'Terry Bradley',
+    Title: 'QA Engineer',
+    Employee_Picture: '37.png',
+    Picture: '../../../../images/employees/37.png',
+    MobilePhone: '8055552788',
+  },
+  {
+    ID: 39,
+    FullName: 'Gabe Jones',
+    Title: 'Retail Coordinator',
+    Employee_Picture: '38.png',
+    Picture: '../../../../images/employees/38.png',
+    MobilePhone: '3105555395',
+  },
+  {
+    ID: 40,
+    FullName: 'Lucy Ball',
+    Title: 'Sales Assistant',
+    Employee_Picture: '39.png',
+    Picture: '../../../../images/employees/39.png',
+    MobilePhone: '3105553357',
+  },
+  {
+    ID: 41,
+    FullName: 'Jim Packard',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '40.png',
+    Picture: '../../../../images/employees/40.png',
+    MobilePhone: '6615558224',
+  },
+  {
+    ID: 42,
+    FullName: 'Hannah Brookly',
+    Title: 'Online Sales Manager',
+    Employee_Picture: '41.png',
+    Picture: '../../../../images/employees/41.png',
+    MobilePhone: '8055553627',
+  },
+  {
+    ID: 43,
+    FullName: 'Harv Mudd',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '42.png',
+    Picture: '../../../../images/employees/42.png',
+    MobilePhone: '8315553895',
+  },
+  {
+    ID: 44,
+    FullName: 'Clark Morgan',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '43.png',
+    Picture: '../../../../images/employees/43.png',
+    MobilePhone: '9255552525',
+  },
+  {
+    ID: 45,
+    FullName: 'Todd Hoffman',
+    Title: 'Retail Sales Manager',
+    Employee_Picture: '44.png',
+    Picture: '../../../../images/employees/44.png',
+    MobilePhone: '9255553579',
+  },
+  {
+    ID: 46,
+    FullName: 'Jackie Garmin',
+    Title: 'Support Assistant',
+    Employee_Picture: '45.png',
+    Picture: '../../../../images/employees/45.png',
+    MobilePhone: '2135551824',
+  },
+  {
+    ID: 47,
+    FullName: 'Lincoln Bartlett',
+    Title: 'Sales Assistant',
+    Employee_Picture: '46.png',
+    Picture: '../../../../images/employees/46.png',
+    MobilePhone: '2135558272',
+  },
+  {
+    ID: 48,
+    FullName: 'Brad Farkus',
+    Title: 'Engineer',
+    Employee_Picture: '47.png',
+    Picture: '../../../../images/employees/47.png',
+    MobilePhone: '2135553626',
+  },
+  {
+    ID: 49,
+    FullName: 'Jenny Hobbs',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '48.png',
+    Picture: '../../../../images/employees/48.png',
+    MobilePhone: '3105552668',
+  },
+  {
+    ID: 50,
+    FullName: 'Dallas Lou',
+    Title: 'Shipping Assistant',
+    Employee_Picture: '49.png',
+    Picture: '../../../../images/employees/49.png',
+    MobilePhone: '2135558357',
+  },
+  {
+    ID: 51,
+    FullName: 'Stu Pizaro',
+    Title: 'Engineer',
+    Employee_Picture: '50.png',
+    Picture: '../../../../images/employees/50.png',
+    MobilePhone: '2135552552',
+  },
+];
diff --git a/apps/demos/Demos/Pagination/Overview/Vue/index.html b/apps/demos/Demos/Pagination/Overview/Vue/index.html
index ec140a786d7e..7ebc7f30a85a 100644
--- a/apps/demos/Demos/Pagination/Overview/Vue/index.html
+++ b/apps/demos/Demos/Pagination/Overview/Vue/index.html
@@ -17,13 +17,13 @@
     <script src="../../../../node_modules/systemjs/dist/system.js"></script>
     <script type="text/javascript" src="config.js"></script>
     <script type="text/javascript">
-      System.import("./index.js");
+      System.import("./index.ts");
     </script>
   </head>
 
   <body class="dx-viewport">
     <div class="demo-container">
-      <div id="app"></div>
+      <div class="container"></div>
     </div>
   </body>
 </html>
diff --git a/apps/demos/Demos/Pagination/Overview/Vue/index.js b/apps/demos/Demos/Pagination/Overview/Vue/index.ts
similarity index 63%
rename from apps/demos/Demos/Pagination/Overview/Vue/index.js
rename to apps/demos/Demos/Pagination/Overview/Vue/index.ts
index 684d04215d72..0c2ce8315988 100644
--- a/apps/demos/Demos/Pagination/Overview/Vue/index.js
+++ b/apps/demos/Demos/Pagination/Overview/Vue/index.ts
@@ -1,4 +1,4 @@
 import { createApp } from 'vue';
 import App from './App.vue';
 
-createApp(App).mount('#app');
+createApp(App).mount('.container');
diff --git a/apps/demos/Demos/Pagination/Overview/description.md b/apps/demos/Demos/Pagination/Overview/description.md
new file mode 100644
index 000000000000..ada1cc79830e
--- /dev/null
+++ b/apps/demos/Demos/Pagination/Overview/description.md
@@ -0,0 +1,10 @@
+DevExpress Pagination UI component allows users to navigate between pages and adjust page size at runtime. The Pagination component in this demo allows users to browse employee cards.
+
+To set up a Pagination component, specify the following options: 
+
+- [itemCount](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#itemCount): the total number of elements in the target control. 
+- [pageSize](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#pageSize): the number of items per page. 
+- [allowedPageSizes](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#allowedPageSizes) : available page size choices.
+- [pageIndex](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#pageIndex): page displayed first.
+- [showNavigationButtons](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#showNavigationButtons): navigation button visibility.
+- [showInfo](/Documentation/ApiReference/UI_Components/dxPagination/Configuration/#showInfo): information pane visibility.
\ No newline at end of file
diff --git a/apps/demos/Demos/Popup/Overview/Angular/app/app.component.html b/apps/demos/Demos/Popup/Overview/Angular/app/app.component.html
index 354825cb012d..f4a06540c4a3 100644
--- a/apps/demos/Demos/Popup/Overview/Angular/app/app.component.html
+++ b/apps/demos/Demos/Popup/Overview/Angular/app/app.component.html
@@ -30,27 +30,27 @@
     container=".dx-viewport"
     [(visible)]="popupVisible"
   >
-    <dxi-toolbar-item
+    <dxi-popup-toolbar-item
       widget="dxButton"
       toolbar="top"
       locateInMenu="always"
       [options]="moreInfoButtonOptions"
     >
-    </dxi-toolbar-item>
-    <dxi-toolbar-item
+    </dxi-popup-toolbar-item>
+    <dxi-popup-toolbar-item
       widget="dxButton"
       toolbar="bottom"
       location="before"
       [options]="emailButtonOptions"
     >
-    </dxi-toolbar-item>
-    <dxi-toolbar-item
+    </dxi-popup-toolbar-item>
+    <dxi-popup-toolbar-item
       widget="dxButton"
       toolbar="bottom"
       location="after"
       [options]="closeButtonOptions"
     >
-    </dxi-toolbar-item>
+    </dxi-popup-toolbar-item>
     <dxo-position at="bottom" my="center" [of]="positionOf" collision="fit">
     </dxo-position>
     <div *dxTemplate="let data of 'content'">
diff --git a/apps/demos/Demos/Popup/Scrolling/Angular/app/app.component.html b/apps/demos/Demos/Popup/Scrolling/Angular/app/app.component.html
index dd66dbaf138c..8d3273ede786 100644
--- a/apps/demos/Demos/Popup/Scrolling/Angular/app/app.component.html
+++ b/apps/demos/Demos/Popup/Scrolling/Angular/app/app.component.html
@@ -57,13 +57,13 @@
       </div>
     </div>
   </div>
-  <dxi-toolbar-item
+  <dxi-popup-toolbar-item
     widget="dxButton"
     toolbar="bottom"
     location="center"
     [options]="bookButtonOptions"
   >
-  </dxi-toolbar-item>
+  </dxi-popup-toolbar-item>
 </dx-popup>
 
 <dx-popup
@@ -102,11 +102,11 @@
       </div>
     </dx-scroll-view>
   </div>
-  <dxi-toolbar-item
+  <dxi-popup-toolbar-item
     widget="dxButton"
     toolbar="bottom"
     location="center"
     [options]="bookButtonOptions"
   >
-  </dxi-toolbar-item>
+  </dxi-popup-toolbar-item>
 </dx-popup>
diff --git a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css
index afd43782211e..a4c619487f71 100644
--- a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css
+++ b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css
@@ -1,35 +1,62 @@
+::ng-deep .dx-scheduler-group-header,
+::ng-deep .dx-scheduler-date-table-cell {
+  position: relative;
+}
+
+::ng-deep .dx-color-scheme-light,
+::ng-deep .dx-color-scheme-carmine,
+::ng-deep .dx-color-scheme-softblue,
+::ng-deep .dx-color-scheme-blue-light,
+::ng-deep .dx-color-scheme-saas-light,
+::ng-deep .dx-color-scheme-lime-light,
+::ng-deep .dx-color-scheme-orange-light,
+::ng-deep .dx-color-scheme-purple-light,
+::ng-deep .dx-color-scheme-teal-light {
+  --text-color-1: rgba(0, 0, 0, .6);
+  --text-color-2: rgba(255, 255, 255, 1);
+  --disabled-color: rgba(0, 0, 0, 0.38);
+  --background-color-1: rgba(50, 134, 56, 1);
+  --background-color-2: rgba(194, 81, 0, 1);
+}
+
+::ng-deep .dx-color-scheme-dark,
+::ng-deep .dx-color-scheme-darkviolet,
+::ng-deep .dx-color-scheme-darkmoon,
+::ng-deep .dx-color-scheme-blue-dark,
+::ng-deep .dx-color-scheme-saas-dark,
+::ng-deep .dx-color-scheme-lime-dark,
+::ng-deep .dx-color-scheme-orange-dark,
+::ng-deep .dx-color-scheme-purple-dark,
+::ng-deep .dx-color-scheme-teal-dark {
+  --text-color-1: rgba(255, 255, 255, 1);
+  --text-color-2: rgba(54, 54, 64, 1);
+  --disabled-color: rgba(255, 255, 255, 0.38);
+  --background-color-1: rgba(159, 213, 161, 1);
+  --background-color-2: rgba(255, 181, 127, 1);
+
+}
+
+::ng-deep .dx-scheduler-header .dx-toolbar .dx-button,
+::ng-deep .dx-scheduler-header .dx-toolbar .dx-button .dx-icon {
+  color: var(--text-color-1);
+}
+
 ::ng-deep .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
-  color: rgba(0, 0, 0, 0.3) !important;
-}
-
-::ng-deep .dx-color-scheme-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-carmine .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-softblue .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-blue-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-saas-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-lime-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-orange-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-purple-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-teal-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(0, 0, 0, .6);
-}
-
-::ng-deep .dx-color-scheme-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-darkviolet .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-darkmoon .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-blue-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-saas-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-lime-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-orange-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-purple-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-::ng-deep .dx-color-scheme-teal-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(255, 255, 255, 1);
+  color: var(--disabled-color) !important;
 }
 
-::ng-deep .dx-scheduler-group-header-content,
-::ng-deep .dx-scheduler-date-table-cell {
-  position: relative;
+::ng-deep .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
+  color: var(--text-color-1);
+}
+
+::ng-deep .dx-scheduler-work-space-month .dx-scheduler-appointment {
+  color: var(--text-color-2);
+  line-height: 22px;
+}
+
+::ng-deep .dx-scheduler-work-space-month .dx-scheduler-appointment .dx-scheduler-appointment-content {
+  padding-top: 0;
 }
 
 ::ng-deep .dx-scheduler-date-table-cell .dx-template-wrapper {
@@ -39,12 +66,32 @@
   padding-right: 6px;
 }
 
-::ng-deep .avatar {
-  width: 155px;
+::ng-deep  .avatar {
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+::ng-deep .avatar img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+}
+
+::ng-deep .avatar[title="John Heart"] img {
+  top: 5px;
+  left: 3px;
+}
+
+::ng-deep .avatar[title="Greta Sims"] img {
+  top: 5px;
+  left: -7px;
 }
 
 ::ng-deep .name {
@@ -55,52 +102,65 @@
 }
 
 ::ng-deep .name h2 {
-  color: #fff;
+  color: var(--text-color-2);
   font-size: 28px;
   text-align: left;
-  padding: 0 0 5px 175px;
+  padding: 0 0 0 170px;
   margin: 0;
+  height: 40px;
+  line-height: 40px;
 }
 
 ::ng-deep .info {
   width: auto;
   text-align: left;
   height: 100%;
-  font-size: 11pt;
+  font-size: 14px;
+  line-height: 20px;
   font-weight: normal;
-  padding: 25px 20px;
+  padding: 25px 20px 25px 40px;
+  color: #707070;
+}
+
+::ng-deep .dx-color-scheme-contrast .info {
+  color: #fff;
 }
 
 ::ng-deep .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+::ng-deep .dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 ::ng-deep .employee-1 {
-  background-color: rgba(86, 202, 133, 0.1);
+  background-color: rgba(55, 126, 58, 0.08);
 }
 
 ::ng-deep .employee-2 {
-  background-color: rgba(255, 151, 71, 0.1);
+  background-color: rgba(194, 81, 0, 0.08);
 }
 
 ::ng-deep .employee-weekend-1 {
-  background-color: rgba(86, 202, 133, 0.2);
+  background-color: rgba(55, 126, 58, 0.12);
 }
 
 ::ng-deep .employee-weekend-2 {
-  background-color: rgba(255, 151, 71, 0.2);
+  background-color: rgba(194, 81, 0, 0.12);
 }
 
 ::ng-deep .training-background-0 {
-  background-image: url("../../../../images/gym/icon-abs.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-abs.png");
 }
 
 ::ng-deep .training-background-1 {
-  background-image: url("../../../../images/gym/icon-step.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-step.png");
 }
 
 ::ng-deep .training-background-2 {
-  background-image: url("../../../../images/gym/icon-fitball.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-fitball.png");
 }
diff --git a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.html b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.html
index 7e3bb9b44064..2cd0fee88166 100644
--- a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.html
+++ b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.html
@@ -8,7 +8,7 @@
   [startDayHour]="8"
   [endDayHour]="18"
   [showAllDayPanel]="false"
-  [height]="600"
+  [height]="710"
   [groups]="['employeeID']"
   resourceCellTemplate="resourceCellTemplate"
   dataCellTemplate="dataCellTemplate"
@@ -25,7 +25,7 @@
     <div class="name" [style.background]="employee.color">
       <h2>{{ employee.text }}</h2>
     </div>
-    <div class="avatar">
+    <div class="avatar" title="{{ employee.text }}">
       <img [src]="employee.data.avatar" alt="{{ employee.text }} photo" />
     </div>
     <div class="info" [style.color]="employee.color">
diff --git a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts
index ccb593f1e824..6a0b62221343 100644
--- a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts
+++ b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts
@@ -27,15 +27,15 @@ export class Data {
 const employees: Employee[] = [{
   text: 'John Heart',
   id: 1,
-  color: '#56ca85',
-  avatar: '../../../../images/gym/coach-man.png',
+  color: 'var(--background-color-1)',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
-  text: 'Sandra Johnson',
+  text: 'Greta Sims',
   id: 2,
-  color: '#ff9747',
-  avatar: '../../../../images/gym/coach-woman.png',
+  color: 'var(--background-color-2)',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];
diff --git a/apps/demos/Demos/Scheduler/Overview/React/App.tsx b/apps/demos/Demos/Scheduler/Overview/React/App.tsx
index efb027610670..87977bb0326e 100644
--- a/apps/demos/Demos/Scheduler/Overview/React/App.tsx
+++ b/apps/demos/Demos/Scheduler/Overview/React/App.tsx
@@ -20,7 +20,7 @@ const App = () => (
     views={views}
     defaultCurrentView="month"
     defaultCurrentDate={currentDate}
-    height={600}
+    height={710}
     showAllDayPanel={true}
     firstDayOfWeek={1}
     startDayHour={8}
diff --git a/apps/demos/Demos/Scheduler/Overview/React/ResourceCell.tsx b/apps/demos/Demos/Scheduler/Overview/React/ResourceCell.tsx
index 2ea79a94aa97..99f4f0595e21 100644
--- a/apps/demos/Demos/Scheduler/Overview/React/ResourceCell.tsx
+++ b/apps/demos/Demos/Scheduler/Overview/React/ResourceCell.tsx
@@ -12,7 +12,7 @@ const ResourceCell = (props: ResourceCellProps) => {
       <div className="name" style={{ background: color }}>
         <h2>{text}</h2>
       </div>
-      <div className="avatar">
+      <div className="avatar" title={text}>
         <img
           src={avatar}
           alt={`${text} photo`}
diff --git a/apps/demos/Demos/Scheduler/Overview/React/data.ts b/apps/demos/Demos/Scheduler/Overview/React/data.ts
index 47e3f6bf005f..b02f5c26162d 100644
--- a/apps/demos/Demos/Scheduler/Overview/React/data.ts
+++ b/apps/demos/Demos/Scheduler/Overview/React/data.ts
@@ -82,15 +82,15 @@ export const data: Appointment[] = [
 export const employees: Resource[] = [{
   text: 'John Heart',
   id: 1,
-  color: '#56ca85',
-  avatar: '../../../../images/gym/coach-man.png',
+  color: 'var(--background-color-1)',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
-  text: 'Sandra Johnson',
+  text: 'Greta Sims',
   id: 2,
-  color: '#ff9747',
-  avatar: '../../../../images/gym/coach-woman.png',
+  color: 'var(--background-color-2)',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];
diff --git a/apps/demos/Demos/Scheduler/Overview/React/styles.css b/apps/demos/Demos/Scheduler/Overview/React/styles.css
index aad79c347951..1f104cd1c477 100644
--- a/apps/demos/Demos/Scheduler/Overview/React/styles.css
+++ b/apps/demos/Demos/Scheduler/Overview/React/styles.css
@@ -1,35 +1,62 @@
+.dx-scheduler-group-header,
+.dx-scheduler-date-table-cell {
+  position: relative;
+}
+
+.dx-color-scheme-light,
+.dx-color-scheme-carmine,
+.dx-color-scheme-softblue,
+.dx-color-scheme-blue-light,
+.dx-color-scheme-saas-light,
+.dx-color-scheme-lime-light,
+.dx-color-scheme-orange-light,
+.dx-color-scheme-purple-light,
+.dx-color-scheme-teal-light {
+  --text-color-1: rgba(0, 0, 0, .6);
+  --text-color-2: rgba(255, 255, 255, 1);
+  --disabled-color: rgba(0, 0, 0, 0.38);
+  --background-color-1: rgba(50, 134, 56, 1);
+  --background-color-2: rgba(194, 81, 0, 1);
+}
+
+.dx-color-scheme-dark,
+.dx-color-scheme-darkviolet,
+.dx-color-scheme-darkmoon,
+.dx-color-scheme-blue-dark,
+.dx-color-scheme-saas-dark,
+.dx-color-scheme-lime-dark,
+.dx-color-scheme-orange-dark,
+.dx-color-scheme-purple-dark,
+.dx-color-scheme-teal-dark {
+  --text-color-1: rgba(255, 255, 255, 1);
+  --text-color-2: rgba(54, 54, 64, 1);
+  --disabled-color: rgba(255, 255, 255, 0.38);
+  --background-color-1: rgba(159, 213, 161, 1);
+  --background-color-2: rgba(255, 181, 127, 1);
+
+}
+
+.dx-scheduler-header .dx-toolbar .dx-button,
+.dx-scheduler-header .dx-toolbar .dx-button .dx-icon {
+  color: var(--text-color-1);
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
-  color: rgba(0, 0, 0, 0.3) !important;
-}
-
-.dx-color-scheme-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-carmine .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-softblue .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(0, 0, 0, .6);
-}
-
-.dx-color-scheme-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkviolet .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkmoon .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(255, 255, 255, 1);
+  color: var(--disabled-color) !important;
 }
 
-.dx-template-wrapper,
-.dx-scheduler-date-table-cell {
-  position: relative;
+.dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
+  color: var(--text-color-1);
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment {
+  color: var(--text-color-2);
+  line-height: 22px;
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment .dx-scheduler-appointment-content {
+  padding-top: 0;
 }
 
 .dx-scheduler-date-table-cell .dx-template-wrapper {
@@ -40,11 +67,31 @@
 }
 
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+}
+
+.avatar[title="John Heart"] img {
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Greta Sims"] img {
+  top: 5px;
+  left: -7px;
 }
 
 .name {
@@ -55,20 +102,23 @@
 }
 
 .name h2 {
-  color: #fff;
+  color: var(--text-color-2);
   font-size: 28px;
   text-align: left;
-  padding: 0 0 5px 175px;
+  padding: 0 0 0 170px;
   margin: 0;
+  height: 40px;
+  line-height: 40px;
 }
 
 .info {
   width: auto;
   text-align: left;
   height: 100%;
-  font-size: 11pt;
+  font-size: 14px;
+  line-height: 20px;
   font-weight: normal;
-  padding: 25px 20px;
+  padding: 25px 20px 25px 40px;
   color: #707070;
 }
 
@@ -77,35 +127,40 @@
 }
 
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
-  background-color: rgba(86, 202, 133, 0.1);
+  background-color: rgba(55, 126, 58, 0.08);
 }
 
 .employee-2 {
-  background-color: rgba(255, 151, 71, 0.1);
+  background-color: rgba(194, 81, 0, 0.08);
 }
 
 .employee-weekend-1 {
-  background-color: rgba(86, 202, 133, 0.2);
+  background-color: rgba(55, 126, 58, 0.12);
 }
 
 .employee-weekend-2 {
-  background-color: rgba(255, 151, 71, 0.2);
+  background-color: rgba(194, 81, 0, 0.12);
 }
 
 .training-background-0 {
-  background-image: url("../../../../images/gym/icon-abs.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-abs.png");
 }
 
 .training-background-1 {
-  background-image: url("../../../../images/gym/icon-step.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-step.png");
 }
 
 .training-background-2 {
-  background-image: url("../../../../images/gym/icon-fitball.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-fitball.png");
 }
diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/App.js b/apps/demos/Demos/Scheduler/Overview/ReactJs/App.js
index cd9dd1b7bdd1..24f97380ef38 100644
--- a/apps/demos/Demos/Scheduler/Overview/ReactJs/App.js
+++ b/apps/demos/Demos/Scheduler/Overview/ReactJs/App.js
@@ -17,7 +17,7 @@ const App = () => (
     views={views}
     defaultCurrentView="month"
     defaultCurrentDate={currentDate}
-    height={600}
+    height={710}
     showAllDayPanel={true}
     firstDayOfWeek={1}
     startDayHour={8}
diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/ResourceCell.js b/apps/demos/Demos/Scheduler/Overview/ReactJs/ResourceCell.js
index 61681cc2fceb..6f080eb30b8a 100644
--- a/apps/demos/Demos/Scheduler/Overview/ReactJs/ResourceCell.js
+++ b/apps/demos/Demos/Scheduler/Overview/ReactJs/ResourceCell.js
@@ -16,7 +16,10 @@ const ResourceCell = (props) => {
       >
         <h2>{text}</h2>
       </div>
-      <div className="avatar">
+      <div
+        className="avatar"
+        title={text}
+      >
         <img
           src={avatar}
           alt={`${text} photo`}
diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js b/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js
index 1dd54ec77c44..2ae3c1170144 100644
--- a/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js
+++ b/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js
@@ -82,16 +82,16 @@ export const employees = [
   {
     text: 'John Heart',
     id: 1,
-    color: '#56ca85',
-    avatar: '../../../../images/gym/coach-man.png',
+    color: 'var(--background-color-1)',
+    avatar: '../../../../images/employees/19.png',
     age: 27,
     discipline: 'ABS, Fitball, StepFit',
   },
   {
-    text: 'Sandra Johnson',
+    text: 'Greta Sims',
     id: 2,
-    color: '#ff9747',
-    avatar: '../../../../images/gym/coach-woman.png',
+    color: 'var(--background-color-2)',
+    avatar: '../../../../images/employees/31.png',
     age: 25,
     discipline: 'ABS, Fitball, StepFit',
   },
diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css b/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css
index aad79c347951..1f104cd1c477 100644
--- a/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css
+++ b/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css
@@ -1,35 +1,62 @@
+.dx-scheduler-group-header,
+.dx-scheduler-date-table-cell {
+  position: relative;
+}
+
+.dx-color-scheme-light,
+.dx-color-scheme-carmine,
+.dx-color-scheme-softblue,
+.dx-color-scheme-blue-light,
+.dx-color-scheme-saas-light,
+.dx-color-scheme-lime-light,
+.dx-color-scheme-orange-light,
+.dx-color-scheme-purple-light,
+.dx-color-scheme-teal-light {
+  --text-color-1: rgba(0, 0, 0, .6);
+  --text-color-2: rgba(255, 255, 255, 1);
+  --disabled-color: rgba(0, 0, 0, 0.38);
+  --background-color-1: rgba(50, 134, 56, 1);
+  --background-color-2: rgba(194, 81, 0, 1);
+}
+
+.dx-color-scheme-dark,
+.dx-color-scheme-darkviolet,
+.dx-color-scheme-darkmoon,
+.dx-color-scheme-blue-dark,
+.dx-color-scheme-saas-dark,
+.dx-color-scheme-lime-dark,
+.dx-color-scheme-orange-dark,
+.dx-color-scheme-purple-dark,
+.dx-color-scheme-teal-dark {
+  --text-color-1: rgba(255, 255, 255, 1);
+  --text-color-2: rgba(54, 54, 64, 1);
+  --disabled-color: rgba(255, 255, 255, 0.38);
+  --background-color-1: rgba(159, 213, 161, 1);
+  --background-color-2: rgba(255, 181, 127, 1);
+
+}
+
+.dx-scheduler-header .dx-toolbar .dx-button,
+.dx-scheduler-header .dx-toolbar .dx-button .dx-icon {
+  color: var(--text-color-1);
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
-  color: rgba(0, 0, 0, 0.3) !important;
-}
-
-.dx-color-scheme-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-carmine .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-softblue .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(0, 0, 0, .6);
-}
-
-.dx-color-scheme-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkviolet .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkmoon .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(255, 255, 255, 1);
+  color: var(--disabled-color) !important;
 }
 
-.dx-template-wrapper,
-.dx-scheduler-date-table-cell {
-  position: relative;
+.dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
+  color: var(--text-color-1);
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment {
+  color: var(--text-color-2);
+  line-height: 22px;
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment .dx-scheduler-appointment-content {
+  padding-top: 0;
 }
 
 .dx-scheduler-date-table-cell .dx-template-wrapper {
@@ -40,11 +67,31 @@
 }
 
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+}
+
+.avatar[title="John Heart"] img {
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Greta Sims"] img {
+  top: 5px;
+  left: -7px;
 }
 
 .name {
@@ -55,20 +102,23 @@
 }
 
 .name h2 {
-  color: #fff;
+  color: var(--text-color-2);
   font-size: 28px;
   text-align: left;
-  padding: 0 0 5px 175px;
+  padding: 0 0 0 170px;
   margin: 0;
+  height: 40px;
+  line-height: 40px;
 }
 
 .info {
   width: auto;
   text-align: left;
   height: 100%;
-  font-size: 11pt;
+  font-size: 14px;
+  line-height: 20px;
   font-weight: normal;
-  padding: 25px 20px;
+  padding: 25px 20px 25px 40px;
   color: #707070;
 }
 
@@ -77,35 +127,40 @@
 }
 
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
-  background-color: rgba(86, 202, 133, 0.1);
+  background-color: rgba(55, 126, 58, 0.08);
 }
 
 .employee-2 {
-  background-color: rgba(255, 151, 71, 0.1);
+  background-color: rgba(194, 81, 0, 0.08);
 }
 
 .employee-weekend-1 {
-  background-color: rgba(86, 202, 133, 0.2);
+  background-color: rgba(55, 126, 58, 0.12);
 }
 
 .employee-weekend-2 {
-  background-color: rgba(255, 151, 71, 0.2);
+  background-color: rgba(194, 81, 0, 0.12);
 }
 
 .training-background-0 {
-  background-image: url("../../../../images/gym/icon-abs.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-abs.png");
 }
 
 .training-background-1 {
-  background-image: url("../../../../images/gym/icon-step.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-step.png");
 }
 
 .training-background-2 {
-  background-image: url("../../../../images/gym/icon-fitball.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-fitball.png");
 }
diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/App.vue b/apps/demos/Demos/Scheduler/Overview/Vue/App.vue
index 64f32cf302b7..2bcfe477aed7 100644
--- a/apps/demos/Demos/Scheduler/Overview/Vue/App.vue
+++ b/apps/demos/Demos/Scheduler/Overview/Vue/App.vue
@@ -5,7 +5,7 @@
     :current-date="currentDate"
     :views="views"
     :groups="groups"
-    :height="600"
+    :height="710"
     :show-all-day-panel="true"
     :first-day-of-week="1"
     :start-day-hour="8"
@@ -51,40 +51,71 @@ const dataSource = data;
   position: relative;
 }
 
+.dx-color-scheme-light,
+.dx-color-scheme-carmine,
+.dx-color-scheme-softblue,
+.dx-color-scheme-blue-light,
+.dx-color-scheme-saas-light,
+.dx-color-scheme-lime-light,
+.dx-color-scheme-orange-light,
+.dx-color-scheme-purple-light,
+.dx-color-scheme-teal-light {
+  --text-color-1: rgba(0, 0, 0, .6);
+  --text-color-2: rgba(255, 255, 255, 1);
+  --disabled-color: rgba(0, 0, 0, 0.38);
+  --background-color-1: rgba(50, 134, 56, 1);
+  --background-color-2: rgba(194, 81, 0, 1);
+}
+
+.dx-color-scheme-dark,
+.dx-color-scheme-darkviolet,
+.dx-color-scheme-darkmoon,
+.dx-color-scheme-blue-dark,
+.dx-color-scheme-saas-dark,
+.dx-color-scheme-lime-dark,
+.dx-color-scheme-orange-dark,
+.dx-color-scheme-purple-dark,
+.dx-color-scheme-teal-dark {
+  --text-color-1: rgba(255, 255, 255, 1);
+  --text-color-2: rgba(54, 54, 64, 1);
+  --disabled-color: rgba(255, 255, 255, 0.38);
+  --background-color-1: rgba(159, 213, 161, 1);
+  --background-color-2: rgba(255, 181, 127, 1);
+
+}
+
+.dx-scheduler-header .dx-toolbar .dx-button,
+.dx-scheduler-header .dx-toolbar .dx-button .dx-icon {
+  color: var(--text-color-1);
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
-  color: rgba(0, 0, 0, 0.3) !important;
+  color: var(--disabled-color) !important;
 }
 
-.dx-color-scheme-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-carmine .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-softblue .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(0, 0, 0, .6);
+.dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
+  color: var(--text-color-1);
 }
 
-.dx-color-scheme-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkviolet .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkmoon .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(255, 255, 255, 1);
+.dx-scheduler-work-space-month .dx-scheduler-appointment {
+  color: var(--text-color-2);
+  line-height: 22px;
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment .dx-scheduler-appointment-content {
+  padding-top: 0;
 }
 
 .dx-scheduler-date-table-cell .dx-template-wrapper {
   position: absolute;
-  width: 100%;
   height: 100%;
+  width: 100%;
   padding-right: 6px;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 </style>
diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue b/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue
index c1b31e2ec7aa..c3e656a2ff4f 100644
--- a/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue
+++ b/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue
@@ -43,36 +43,41 @@ function getCurrentTraining(date, employeeID) {
 </script>
 <style>
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
-  background-color: rgba(86, 202, 133, 0.1);
+  background-color: rgba(55, 126, 58, 0.08);
 }
 
 .employee-2 {
-  background-color: rgba(255, 151, 71, 0.1);
+  background-color: rgba(194, 81, 0, 0.08);
 }
 
 .employee-weekend-1 {
-  background-color: rgba(86, 202, 133, 0.2);
+  background-color: rgba(55, 126, 58, 0.12);
 }
 
 .employee-weekend-2 {
-  background-color: rgba(255, 151, 71, 0.2);
+  background-color: rgba(194, 81, 0, 0.12);
 }
 
 .training-background-0 {
-  background-image: url("../../../../images/gym/icon-abs.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-abs.png");
 }
 
 .training-background-1 {
-  background-image: url("../../../../images/gym/icon-step.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-step.png");
 }
 
 .training-background-2 {
-  background-image: url("../../../../images/gym/icon-fitball.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-fitball.png");
 }
 </style>
diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue b/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue
index 13e00db3a192..e2d3b3ca4ef8 100644
--- a/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue
+++ b/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue
@@ -6,7 +6,7 @@
     >
       <h2>{{ employee.text }}</h2>
     </div>
-    <div class="avatar">
+    <div class="avatar" :title="employee.text">
       <img :src="employee.data.avatar" :alt="`${employee.text} photo`">
     </div>
     <div
@@ -28,11 +28,31 @@ withDefaults(defineProps<{
 </script>
 <style>
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+}
+
+.avatar[title="John Heart"] img {
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Greta Sims"] img {
+  top: 5px;
+  left: -7px;
 }
 
 .name {
@@ -43,20 +63,23 @@ withDefaults(defineProps<{
 }
 
 .name h2 {
-  color: #fff;
+  color: var(--text-color-2);
   font-size: 28px;
   text-align: left;
-  padding: 0 0 5px 175px;
+  padding: 0 0 0 170px;
   margin: 0;
+  height: 40px;
+  line-height: 40px;
 }
 
 .info {
   width: auto;
   text-align: left;
   height: 100%;
-  font-size: 11pt;
+  font-size: 14px;
+  line-height: 20px;
   font-weight: normal;
-  padding: 25px 20px;
+  padding: 25px 20px 25px 40px;
   color: #707070;
 }
 
diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/data.ts b/apps/demos/Demos/Scheduler/Overview/Vue/data.ts
index 65c01a4bbf73..a4c5b52fa50b 100644
--- a/apps/demos/Demos/Scheduler/Overview/Vue/data.ts
+++ b/apps/demos/Demos/Scheduler/Overview/Vue/data.ts
@@ -1,15 +1,15 @@
 export const employees = [{
   text: 'John Heart',
   id: 1,
-  color: '#56ca85',
-  avatar: '../../../../images/gym/coach-man.png',
+  color: 'var(--background-color-1)',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
-  text: 'Sandra Johnson',
+  text: 'Greta Sims',
   id: 2,
-  color: '#ff9747',
-  avatar: '../../../../images/gym/coach-woman.png',
+  color: 'var(--background-color-2)',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];
diff --git a/apps/demos/Demos/Scheduler/Overview/jQuery/data.js b/apps/demos/Demos/Scheduler/Overview/jQuery/data.js
index 2088202dcee2..d753b921c9d5 100644
--- a/apps/demos/Demos/Scheduler/Overview/jQuery/data.js
+++ b/apps/demos/Demos/Scheduler/Overview/jQuery/data.js
@@ -1,15 +1,15 @@
 const employees = [{
   text: 'John Heart',
   id: 1,
-  color: '#56ca85',
-  avatar: '../../../../images/gym/coach-man.png',
+  color: 'var(--background-color-1)',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
-  text: 'Sandra Johnson',
+  text: 'Greta Sims',
   id: 2,
-  color: '#ff9747',
-  avatar: '../../../../images/gym/coach-woman.png',
+  color: 'var(--background-color-2)',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];
diff --git a/apps/demos/Demos/Scheduler/Overview/jQuery/index.js b/apps/demos/Demos/Scheduler/Overview/jQuery/index.js
index 3e367a6c7f94..bead8561ab16 100644
--- a/apps/demos/Demos/Scheduler/Overview/jQuery/index.js
+++ b/apps/demos/Demos/Scheduler/Overview/jQuery/index.js
@@ -9,7 +9,7 @@ $(() => {
     startDayHour: 8,
     endDayHour: 18,
     showAllDayPanel: false,
-    height: 600,
+    height: 710,
     groups: ['employeeID'],
     resources: [
       {
diff --git a/apps/demos/Demos/Scheduler/Overview/jQuery/styles.css b/apps/demos/Demos/Scheduler/Overview/jQuery/styles.css
index 4b73b8a54c2e..1f104cd1c477 100644
--- a/apps/demos/Demos/Scheduler/Overview/jQuery/styles.css
+++ b/apps/demos/Demos/Scheduler/Overview/jQuery/styles.css
@@ -3,33 +3,60 @@
   position: relative;
 }
 
+.dx-color-scheme-light,
+.dx-color-scheme-carmine,
+.dx-color-scheme-softblue,
+.dx-color-scheme-blue-light,
+.dx-color-scheme-saas-light,
+.dx-color-scheme-lime-light,
+.dx-color-scheme-orange-light,
+.dx-color-scheme-purple-light,
+.dx-color-scheme-teal-light {
+  --text-color-1: rgba(0, 0, 0, .6);
+  --text-color-2: rgba(255, 255, 255, 1);
+  --disabled-color: rgba(0, 0, 0, 0.38);
+  --background-color-1: rgba(50, 134, 56, 1);
+  --background-color-2: rgba(194, 81, 0, 1);
+}
+
+.dx-color-scheme-dark,
+.dx-color-scheme-darkviolet,
+.dx-color-scheme-darkmoon,
+.dx-color-scheme-blue-dark,
+.dx-color-scheme-saas-dark,
+.dx-color-scheme-lime-dark,
+.dx-color-scheme-orange-dark,
+.dx-color-scheme-purple-dark,
+.dx-color-scheme-teal-dark {
+  --text-color-1: rgba(255, 255, 255, 1);
+  --text-color-2: rgba(54, 54, 64, 1);
+  --disabled-color: rgba(255, 255, 255, 0.38);
+  --background-color-1: rgba(159, 213, 161, 1);
+  --background-color-2: rgba(255, 181, 127, 1);
+
+}
+
+.dx-scheduler-header .dx-toolbar .dx-button,
+.dx-scheduler-header .dx-toolbar .dx-button .dx-icon {
+  color: var(--text-color-1);
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
-  color: rgba(0, 0, 0, 0.3) !important;
-}
-
-.dx-color-scheme-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-carmine .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-softblue .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-light .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(0, 0, 0, .6);
-}
-
-.dx-color-scheme-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkviolet .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-darkmoon .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-blue-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-saas-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-lime-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-orange-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-purple-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell,
-.dx-color-scheme-teal-dark .dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
-  color: rgba(255, 255, 255, 1);
+  color: var(--disabled-color) !important;
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
+  color: var(--text-color-1);
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment {
+  color: var(--text-color-2);
+  line-height: 22px;
+}
+
+.dx-scheduler-work-space-month .dx-scheduler-appointment .dx-scheduler-appointment-content {
+  padding-top: 0;
 }
 
 .dx-scheduler-date-table-cell .dx-template-wrapper {
@@ -40,11 +67,31 @@
 }
 
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+}
+
+.avatar[title="John Heart"] img {
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Greta Sims"] img {
+  top: 5px;
+  left: -7px;
 }
 
 .name {
@@ -55,20 +102,23 @@
 }
 
 .name h2 {
-  color: #fff;
+  color: var(--text-color-2);
   font-size: 28px;
   text-align: left;
-  padding: 0 0 5px 175px;
+  padding: 0 0 0 170px;
   margin: 0;
+  height: 40px;
+  line-height: 40px;
 }
 
 .info {
   width: auto;
   text-align: left;
   height: 100%;
-  font-size: 11pt;
+  font-size: 14px;
+  line-height: 20px;
   font-weight: normal;
-  padding: 25px 20px;
+  padding: 25px 20px 25px 40px;
   color: #707070;
 }
 
@@ -83,30 +133,34 @@
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
-  background-color: rgba(86, 202, 133, 0.1);
+  background-color: rgba(55, 126, 58, 0.08);
 }
 
 .employee-2 {
-  background-color: rgba(255, 151, 71, 0.1);
+  background-color: rgba(194, 81, 0, 0.08);
 }
 
 .employee-weekend-1 {
-  background-color: rgba(86, 202, 133, 0.2);
+  background-color: rgba(55, 126, 58, 0.12);
 }
 
 .employee-weekend-2 {
-  background-color: rgba(255, 151, 71, 0.2);
+  background-color: rgba(194, 81, 0, 0.12);
 }
 
 .training-background-0 {
-  background-image: url("../../../../images/gym/icon-abs.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-abs.png");
 }
 
 .training-background-1 {
-  background-image: url("../../../../images/gym/icon-step.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-step.png");
 }
 
 .training-background-2 {
-  background-image: url("../../../../images/gym/icon-fitball.png");
+  background-image: url("../../../../images/Scheduler/Overview/icon-fitball.png");
 }
diff --git a/apps/demos/images/gym/icon-abs.png b/apps/demos/images/Scheduler/Overview/icon-abs.png
similarity index 100%
rename from apps/demos/images/gym/icon-abs.png
rename to apps/demos/images/Scheduler/Overview/icon-abs.png
diff --git a/apps/demos/images/gym/icon-fitball.png b/apps/demos/images/Scheduler/Overview/icon-fitball.png
similarity index 100%
rename from apps/demos/images/gym/icon-fitball.png
rename to apps/demos/images/Scheduler/Overview/icon-fitball.png
diff --git a/apps/demos/images/gym/icon-step.png b/apps/demos/images/Scheduler/Overview/icon-step.png
similarity index 100%
rename from apps/demos/images/gym/icon-step.png
rename to apps/demos/images/Scheduler/Overview/icon-step.png
diff --git a/apps/demos/images/gym/coach-man.png b/apps/demos/images/gym/coach-man.png
deleted file mode 100644
index 927523575b26..000000000000
Binary files a/apps/demos/images/gym/coach-man.png and /dev/null differ
diff --git a/apps/demos/images/gym/coach-woman.png b/apps/demos/images/gym/coach-woman.png
deleted file mode 100644
index 376a54e4afa8..000000000000
Binary files a/apps/demos/images/gym/coach-woman.png and /dev/null differ
diff --git a/apps/demos/testing/common.test.js b/apps/demos/testing/common.test.js
index 75c201d1881d..d71bf8f3cc76 100644
--- a/apps/demos/testing/common.test.js
+++ b/apps/demos/testing/common.test.js
@@ -66,7 +66,6 @@ const SKIPPED_TESTS = {
       { demo: 'TaskTemplate', themes: [THEME.generic, THEME.material, THEME.fluent] },
       { demo: 'Validation', themes: [THEME.generic, THEME.material, THEME.fluent] },
     ],
-    Pagination: ['Overview'],
   },
   Angular: {
     DataGrid: [
@@ -132,9 +131,11 @@ const SKIPPED_TESTS = {
       { demo: 'TooltipHTMLSupport', themes: [THEME.material] },
       { demo: 'CustomMapData', themes: [THEME.material] },
     ],
-    Pagination: [{ demo: 'Overview', themes: [THEME.generic, THEME.material, THEME.fluent] }],
   },
   React: {
+    Common: [
+      { demo: 'ActionAndListsOverview', themes: [THEME.generic, THEME.material] },
+    ],
     Charts: [
       { demo: 'PiesWithEqualSize', themes: [THEME.material] },
       { demo: 'CustomAnnotations', themes: [THEME.material] },
@@ -179,9 +180,11 @@ const SKIPPED_TESTS = {
       { demo: 'DifferentValueIndicatorTypesLinearGauge', themes: [THEME.material] },
       { demo: 'ScaleLabelFormatting', themes: [THEME.material] },
     ],
-    Pagination: ['Overview'],
   },
   Vue: {
+    Common: [
+      { demo: 'ActionAndListsOverview', themes: [THEME.generic, THEME.material] },
+    ],
     Charts: [
       { demo: 'TilingAlgorithms', themes: [THEME.material] },
       { demo: 'ExportAndPrintingAPI', themes: [THEME.material] },
diff --git a/apps/demos/testing/etalons/Pagination-Overview (fluent.blue.light).png b/apps/demos/testing/etalons/Pagination-Overview (fluent.blue.light).png
index b111c107ad0f..628a26a51f3a 100644
Binary files a/apps/demos/testing/etalons/Pagination-Overview (fluent.blue.light).png and b/apps/demos/testing/etalons/Pagination-Overview (fluent.blue.light).png differ
diff --git a/apps/demos/testing/etalons/Pagination-Overview (material.blue.light).png b/apps/demos/testing/etalons/Pagination-Overview (material.blue.light).png
index 7448a0a08293..6acc0aff08bc 100644
Binary files a/apps/demos/testing/etalons/Pagination-Overview (material.blue.light).png and b/apps/demos/testing/etalons/Pagination-Overview (material.blue.light).png differ
diff --git a/apps/demos/testing/etalons/Pagination-Overview.png b/apps/demos/testing/etalons/Pagination-Overview.png
index fcd6ed8fb5e7..e3343dc95a6f 100644
Binary files a/apps/demos/testing/etalons/Pagination-Overview.png and b/apps/demos/testing/etalons/Pagination-Overview.png differ
diff --git a/apps/demos/testing/etalons/Scheduler-Overview (fluent.blue.light).png b/apps/demos/testing/etalons/Scheduler-Overview (fluent.blue.light).png
index 0b0f23137f33..b77f80b6baf2 100644
Binary files a/apps/demos/testing/etalons/Scheduler-Overview (fluent.blue.light).png and b/apps/demos/testing/etalons/Scheduler-Overview (fluent.blue.light).png differ
diff --git a/apps/demos/testing/etalons/Scheduler-Overview (material.blue.light).png b/apps/demos/testing/etalons/Scheduler-Overview (material.blue.light).png
index addd7df07e17..9e9518481fe4 100644
Binary files a/apps/demos/testing/etalons/Scheduler-Overview (material.blue.light).png and b/apps/demos/testing/etalons/Scheduler-Overview (material.blue.light).png differ
diff --git a/apps/demos/testing/etalons/Scheduler-Overview.png b/apps/demos/testing/etalons/Scheduler-Overview.png
index 2d998fd200e0..e0d9643cd098 100644
Binary files a/apps/demos/testing/etalons/Scheduler-Overview.png and b/apps/demos/testing/etalons/Scheduler-Overview.png differ
diff --git a/apps/demos/testing/known-warnings.json b/apps/demos/testing/known-warnings.json
index ad94147e74a6..27e6e7c27d98 100644
--- a/apps/demos/testing/known-warnings.json
+++ b/apps/demos/testing/known-warnings.json
@@ -3,6 +3,5 @@
   "W0019 -",
   "W0022 -",
   "W2108 -",
-  "[Vue warn]: Invalid prop: type check failed for prop",
-  "NG0912: Component ID generation collision detected"
+  "[Vue warn]: Invalid prop: type check failed for prop"
 ]
diff --git a/apps/demos/testing/widgets/accordion/Accordion.test.js b/apps/demos/testing/widgets/accordion/Accordion.test.js
index 801b7c730154..6ce0213357d5 100644
--- a/apps/demos/testing/widgets/accordion/Accordion.test.js
+++ b/apps/demos/testing/widgets/accordion/Accordion.test.js
@@ -12,7 +12,7 @@ fixture('Accordion.Overview')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Accordion', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Accordion', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Overview Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/Crosshair.test.js b/apps/demos/testing/widgets/charts/Crosshair.test.js
index 4c331b4a3581..7ceae26e05cf 100644
--- a/apps/demos/testing/widgets/charts/Crosshair.test.js
+++ b/apps/demos/testing/widgets/charts/Crosshair.test.js
@@ -9,7 +9,7 @@ fixture('Charts.Crosshair')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'Crosshair', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'Crosshair', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Chart.Crosshair', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/CustomAnnotationsDrag.test.js b/apps/demos/testing/widgets/charts/CustomAnnotationsDrag.test.js
index 5047f38cd986..b6e3703dcb41 100644
--- a/apps/demos/testing/widgets/charts/CustomAnnotationsDrag.test.js
+++ b/apps/demos/testing/widgets/charts/CustomAnnotationsDrag.test.js
@@ -9,7 +9,7 @@ fixture('Charts.CustomAnnotations')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'CustomAnnotations', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'CustomAnnotations', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('CustomAnnotations. Drag', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/CustomLegendMarkers.test.js b/apps/demos/testing/widgets/charts/CustomLegendMarkers.test.js
index c9f53b6835a4..df1ed90f9d3a 100644
--- a/apps/demos/testing/widgets/charts/CustomLegendMarkers.test.js
+++ b/apps/demos/testing/widgets/charts/CustomLegendMarkers.test.js
@@ -9,7 +9,7 @@ fixture('Charts.CustomLegendMarkers')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'CustomLegendMarkers', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'CustomLegendMarkers', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('CustomLegendMarkers', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/LoadDataOnDemand.test.js b/apps/demos/testing/widgets/charts/LoadDataOnDemand.test.js
index 11c09bde3c54..dbb191fcf4fd 100644
--- a/apps/demos/testing/widgets/charts/LoadDataOnDemand.test.js
+++ b/apps/demos/testing/widgets/charts/LoadDataOnDemand.test.js
@@ -9,7 +9,7 @@ fixture('Charts.LoadDataOnDemand')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'LoadDataOnDemand', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'LoadDataOnDemand', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('LoadDataOnDemand', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/Overview.test.js b/apps/demos/testing/widgets/charts/Overview.test.js
index b34352ed7d61..ff5c016abd27 100644
--- a/apps/demos/testing/widgets/charts/Overview.test.js
+++ b/apps/demos/testing/widgets/charts/Overview.test.js
@@ -9,7 +9,7 @@ fixture('Charts.Overview')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Tooltip', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/PieLabelsOverlapping.test.js b/apps/demos/testing/widgets/charts/PieLabelsOverlapping.test.js
index 981b7449547b..6239c31a4664 100644
--- a/apps/demos/testing/widgets/charts/PieLabelsOverlapping.test.js
+++ b/apps/demos/testing/widgets/charts/PieLabelsOverlapping.test.js
@@ -9,7 +9,7 @@ fixture('PieWithResolvedLabelOverlapping')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'PieWithResolvedLabelOverlapping', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'PieWithResolvedLabelOverlapping', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('PieWithResolvedLabelOverlapping', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
     const showSelectBoxItems = () => t.click($('.options .dx-dropdowneditor-input-wrapper input.dx-texteditor-input'));
diff --git a/apps/demos/testing/widgets/charts/ZoomingAndScrollingAPI.test.js b/apps/demos/testing/widgets/charts/ZoomingAndScrollingAPI.test.js
index 68d1cfd330e6..72ee7bbebfdf 100644
--- a/apps/demos/testing/widgets/charts/ZoomingAndScrollingAPI.test.js
+++ b/apps/demos/testing/widgets/charts/ZoomingAndScrollingAPI.test.js
@@ -9,7 +9,7 @@ fixture('Charts.ZoomingAndScrollingAPI')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'ZoomingAndScrollingAPI', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'ZoomingAndScrollingAPI', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('ZoomingAndScrollingAPI. RangeSelector drag', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/charts/ZoomingOnAreaSelection.test.js b/apps/demos/testing/widgets/charts/ZoomingOnAreaSelection.test.js
index cb50f5d08aef..bbe37eb89c99 100644
--- a/apps/demos/testing/widgets/charts/ZoomingOnAreaSelection.test.js
+++ b/apps/demos/testing/widgets/charts/ZoomingOnAreaSelection.test.js
@@ -9,7 +9,7 @@ fixture('Charts.ZoomingOnAreaSelection')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Charts', 'ZoomingOnAreaSelection', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Charts', 'ZoomingOnAreaSelection', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('ZoomingOnAreaSelection. Drag', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/common/EditorAppearanceVariants.test.js b/apps/demos/testing/widgets/common/EditorAppearanceVariants.test.js
index 8dd0cdd733ae..9069e4e768e8 100644
--- a/apps/demos/testing/widgets/common/EditorAppearanceVariants.test.js
+++ b/apps/demos/testing/widgets/common/EditorAppearanceVariants.test.js
@@ -10,7 +10,7 @@ fixture('Common.EditorAppearanceVariants')
     ctx.initialWindowSize = [900, 800];
   });
 
-runManualTest('Common', 'EditorAppearanceVariants', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Common', 'EditorAppearanceVariants', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('EditorAppearanceVariants', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/contextmenu/ContextMenu.test.js b/apps/demos/testing/widgets/contextmenu/ContextMenu.test.js
index dc28bc98ca11..61293813d248 100644
--- a/apps/demos/testing/widgets/contextmenu/ContextMenu.test.js
+++ b/apps/demos/testing/widgets/contextmenu/ContextMenu.test.js
@@ -10,7 +10,7 @@ fixture('ContextMenu.Templates')
 
 const IMAGE_ID = 'image';
 
-runManualTest('ContextMenu', 'Templates', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('ContextMenu', 'Templates', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Template Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/contextmenu/ContextMenuScrolling.test.js b/apps/demos/testing/widgets/contextmenu/ContextMenuScrolling.test.js
index c8ce8407db9d..b6aad9af6543 100644
--- a/apps/demos/testing/widgets/contextmenu/ContextMenuScrolling.test.js
+++ b/apps/demos/testing/widgets/contextmenu/ContextMenuScrolling.test.js
@@ -12,7 +12,7 @@ fixture('ContextMenu.Scrolling')
 const TARGET_AREA = 'target-area';
 const MENU_ITEM_TEXT_CLASS = 'dx-menu-item-text';
 
-runManualTest('ContextMenu', 'Scrolling', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('ContextMenu', 'Scrolling', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Template Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/contextmenu/ContextMenuShare.test.js b/apps/demos/testing/widgets/contextmenu/ContextMenuShare.test.js
index f59439f4c18b..f3cc19dbff68 100644
--- a/apps/demos/testing/widgets/contextmenu/ContextMenuShare.test.js
+++ b/apps/demos/testing/widgets/contextmenu/ContextMenuShare.test.js
@@ -12,7 +12,7 @@ fixture('ContextMenu.Templates')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('ContextMenu', 'Templates', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('ContextMenu', 'Templates', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Template Share Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/AdvancedMasterDetailView.test.js b/apps/demos/testing/widgets/datagrid/AdvancedMasterDetailView.test.js
index 9f21543135c9..795faa126e46 100644
--- a/apps/demos/testing/widgets/datagrid/AdvancedMasterDetailView.test.js
+++ b/apps/demos/testing/widgets/datagrid/AdvancedMasterDetailView.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.AdvancedMasterDetailView')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'AdvancedMasterDetailView', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'AdvancedMasterDetailView', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('AdvancedMasterDetailView', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/AjaxRequest.test.js b/apps/demos/testing/widgets/datagrid/AjaxRequest.test.js
index ebbca03a82d0..d1040ff5f315 100644
--- a/apps/demos/testing/widgets/datagrid/AjaxRequest.test.js
+++ b/apps/demos/testing/widgets/datagrid/AjaxRequest.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.AjaxRequest')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'AjaxRequest', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'AjaxRequest', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('AjaxRequest', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/Appearance.test.js b/apps/demos/testing/widgets/datagrid/Appearance.test.js
index 94ef197131dc..f899e9864a5d 100644
--- a/apps/demos/testing/widgets/datagrid/Appearance.test.js
+++ b/apps/demos/testing/widgets/datagrid/Appearance.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.Appearance')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'Appearance', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'Appearance', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/BatchEditing.test.js b/apps/demos/testing/widgets/datagrid/BatchEditing.test.js
index cc7f24c5f792..da33cba6e643 100644
--- a/apps/demos/testing/widgets/datagrid/BatchEditing.test.js
+++ b/apps/demos/testing/widgets/datagrid/BatchEditing.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.BatchEditing')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'BatchEditing', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'BatchEditing', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('BatchEditing', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/BatchUpdateRequest.test.js b/apps/demos/testing/widgets/datagrid/BatchUpdateRequest.test.js
index bafbb5943683..610054faeeda 100644
--- a/apps/demos/testing/widgets/datagrid/BatchUpdateRequest.test.js
+++ b/apps/demos/testing/widgets/datagrid/BatchUpdateRequest.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.BatchUpdateRequest')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'BatchUpdateRequest', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'BatchUpdateRequest', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('BatchUpdateRequest', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/CellEditingAndEditingAPI.test.js b/apps/demos/testing/widgets/datagrid/CellEditingAndEditingAPI.test.js
index 5c5aef7c0001..6545046e81e6 100644
--- a/apps/demos/testing/widgets/datagrid/CellEditingAndEditingAPI.test.js
+++ b/apps/demos/testing/widgets/datagrid/CellEditingAndEditingAPI.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.CellEditingAndEditingAPI')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'CellEditingAndEditingAPI', ['jQuery', 'React', 'Vue'/* , 'Angular' */], (test) => {
+runManualTest('DataGrid', 'CellEditingAndEditingAPI', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('CellEditingAndEditingAPI', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/CustomNewRecordPosition.test.js b/apps/demos/testing/widgets/datagrid/CustomNewRecordPosition.test.js
index e20832fe33d0..a21094127a98 100644
--- a/apps/demos/testing/widgets/datagrid/CustomNewRecordPosition.test.js
+++ b/apps/demos/testing/widgets/datagrid/CustomNewRecordPosition.test.js
@@ -45,7 +45,7 @@ const newRowPositionTestTemplate = ({ newRowPosition, pageNumber }) => async (t)
     .ok(compareResults.errorMessages());
 };
 
-runManualTest('DataGrid', 'CustomNewRecordPosition', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'CustomNewRecordPosition', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   newRowPositionOptions.forEach((newRowPosition) => {
     test(`newRowPosition - ${newRowPosition}`, newRowPositionTestTemplate({
       newRowPosition,
diff --git a/apps/demos/testing/widgets/datagrid/DataValidation.test.js b/apps/demos/testing/widgets/datagrid/DataValidation.test.js
index 4aa965292238..b228312f835b 100644
--- a/apps/demos/testing/widgets/datagrid/DataValidation.test.js
+++ b/apps/demos/testing/widgets/datagrid/DataValidation.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.DataValidation')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'DataValidation', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'DataValidation', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('DataValidation', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/EditStateManagement.test.js b/apps/demos/testing/widgets/datagrid/EditStateManagement.test.js
index 2dface0b6ab9..fdd110c5fa1a 100644
--- a/apps/demos/testing/widgets/datagrid/EditStateManagement.test.js
+++ b/apps/demos/testing/widgets/datagrid/EditStateManagement.test.js
@@ -98,7 +98,7 @@ runManualTest('DataGrid', 'EditStateManagement', ['jQuery', 'React', 'Vue', 'Ang
   });
 });
 
-runManualTest('DataGrid', 'EditStateManagement', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'EditStateManagement', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('EditStateManagement - remove row', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/Filtering.test.js b/apps/demos/testing/widgets/datagrid/Filtering.test.js
index e49a6a3fd31d..f3b0ab28dc3f 100644
--- a/apps/demos/testing/widgets/datagrid/Filtering.test.js
+++ b/apps/demos/testing/widgets/datagrid/Filtering.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.Filtering')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'Filtering', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'Filtering', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Filtering', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/FilteringAPI.test.js b/apps/demos/testing/widgets/datagrid/FilteringAPI.test.js
index 582926584b69..3674ede79a54 100644
--- a/apps/demos/testing/widgets/datagrid/FilteringAPI.test.js
+++ b/apps/demos/testing/widgets/datagrid/FilteringAPI.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.FilteringAPI')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'FilteringAPI', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'FilteringAPI', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('FilteringAPI', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/GroupSummaries.test.js b/apps/demos/testing/widgets/datagrid/GroupSummaries.test.js
index 4c3390b2be20..7421aad16f3e 100644
--- a/apps/demos/testing/widgets/datagrid/GroupSummaries.test.js
+++ b/apps/demos/testing/widgets/datagrid/GroupSummaries.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.GroupSummaries')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'GroupSummaries', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'GroupSummaries', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('GroupSummaries', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/InfiniteScrolling.test.js b/apps/demos/testing/widgets/datagrid/InfiniteScrolling.test.js
index 6c4ef75c8a4e..8691203a72d2 100644
--- a/apps/demos/testing/widgets/datagrid/InfiniteScrolling.test.js
+++ b/apps/demos/testing/widgets/datagrid/InfiniteScrolling.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.InfiniteScrolling')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'InfiniteScrolling', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'InfiniteScrolling', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('InfiniteScrolling', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/MasterDetailAPI.test.js b/apps/demos/testing/widgets/datagrid/MasterDetailAPI.test.js
index 42fbdbf2d919..4363f443c3cd 100644
--- a/apps/demos/testing/widgets/datagrid/MasterDetailAPI.test.js
+++ b/apps/demos/testing/widgets/datagrid/MasterDetailAPI.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.MasterDetailAPI')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'MasterDetailAPI', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'MasterDetailAPI', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('MasterDetailAPI', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/MasterDetailView.test.js b/apps/demos/testing/widgets/datagrid/MasterDetailView.test.js
index ea1b35eca10e..82d2acaf4254 100644
--- a/apps/demos/testing/widgets/datagrid/MasterDetailView.test.js
+++ b/apps/demos/testing/widgets/datagrid/MasterDetailView.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.MasterDetailView')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'MasterDetailView', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'MasterDetailView', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('MasterDetailView', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/MultipleRecordSelectionAPI.test.js b/apps/demos/testing/widgets/datagrid/MultipleRecordSelectionAPI.test.js
index 1ceff131df9a..88097fa1de8b 100644
--- a/apps/demos/testing/widgets/datagrid/MultipleRecordSelectionAPI.test.js
+++ b/apps/demos/testing/widgets/datagrid/MultipleRecordSelectionAPI.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.MultipleRecordSelectionAPI')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'MultipleRecordSelectionAPI', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'MultipleRecordSelectionAPI', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('MultipleRecordSelectionAPI', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/MultipleSorting.test.js b/apps/demos/testing/widgets/datagrid/MultipleSorting.test.js
index 09725ce596a8..837cb867697a 100644
--- a/apps/demos/testing/widgets/datagrid/MultipleSorting.test.js
+++ b/apps/demos/testing/widgets/datagrid/MultipleSorting.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.MultipleSorting')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'MultipleSorting', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'MultipleSorting', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('MultipleSorting', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/OdataService.test.js b/apps/demos/testing/widgets/datagrid/OdataService.test.js
index a235119a903b..cd4f5d132830 100644
--- a/apps/demos/testing/widgets/datagrid/OdataService.test.js
+++ b/apps/demos/testing/widgets/datagrid/OdataService.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.OdataService')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'OdataService', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'OdataService', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('OdataService', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/RecordGrouping.test.js b/apps/demos/testing/widgets/datagrid/RecordGrouping.test.js
index b565d7ed0be7..1b2a090fea88 100644
--- a/apps/demos/testing/widgets/datagrid/RecordGrouping.test.js
+++ b/apps/demos/testing/widgets/datagrid/RecordGrouping.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.RecordGrouping')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'RecordGrouping', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'RecordGrouping', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('RecordGrouping', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/RecordPaging.test.js b/apps/demos/testing/widgets/datagrid/RecordPaging.test.js
index c003e1f17108..763282039bb7 100644
--- a/apps/demos/testing/widgets/datagrid/RecordPaging.test.js
+++ b/apps/demos/testing/widgets/datagrid/RecordPaging.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.RecordPaging')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'RecordPaging', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'RecordPaging', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('RecordPaging', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/RowEditingAndEditingEvents.test.js b/apps/demos/testing/widgets/datagrid/RowEditingAndEditingEvents.test.js
index 78a34f49fe2b..9622017c6ad4 100644
--- a/apps/demos/testing/widgets/datagrid/RowEditingAndEditingEvents.test.js
+++ b/apps/demos/testing/widgets/datagrid/RowEditingAndEditingEvents.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.RowEditingAndEditingEvents')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'RowEditingAndEditingEvents', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'RowEditingAndEditingEvents', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('RowEditingAndEditingEvents', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/RowSelection.test.js b/apps/demos/testing/widgets/datagrid/RowSelection.test.js
index 3b86575edba2..edc6218d7128 100644
--- a/apps/demos/testing/widgets/datagrid/RowSelection.test.js
+++ b/apps/demos/testing/widgets/datagrid/RowSelection.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.RowSelection')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'RowSelection', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'RowSelection', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('RowSelection', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/SimpleArray.test.js b/apps/demos/testing/widgets/datagrid/SimpleArray.test.js
index 63dc37c62323..99c4757343d1 100644
--- a/apps/demos/testing/widgets/datagrid/SimpleArray.test.js
+++ b/apps/demos/testing/widgets/datagrid/SimpleArray.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.SimpleArray')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'SimpleArray', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'SimpleArray', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('SimpleArray', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/datagrid/VirtualScrolling.test.js b/apps/demos/testing/widgets/datagrid/VirtualScrolling.test.js
index a8b5c4ea0c44..3af409d6ada2 100644
--- a/apps/demos/testing/widgets/datagrid/VirtualScrolling.test.js
+++ b/apps/demos/testing/widgets/datagrid/VirtualScrolling.test.js
@@ -9,7 +9,7 @@ fixture('DataGrid.VirtualScrolling')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DataGrid', 'VirtualScrolling', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DataGrid', 'VirtualScrolling', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('VirtualScrolling', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/dropdownbox/MultipleSelection.test.js b/apps/demos/testing/widgets/dropdownbox/MultipleSelection.test.js
index 1e82319e58a6..d04c71eedc0b 100644
--- a/apps/demos/testing/widgets/dropdownbox/MultipleSelection.test.js
+++ b/apps/demos/testing/widgets/dropdownbox/MultipleSelection.test.js
@@ -9,7 +9,7 @@ fixture('DropDownBox.MultipleSelection')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DropDownBox', 'MultipleSelection', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DropDownBox', 'MultipleSelection', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('MultipleSelection', async (t) => {
     const DROP_DOWN_BOX_CLASS = 'dx-dropdownbox';
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
diff --git a/apps/demos/testing/widgets/dropdownbutton/DropDownButton.test.js b/apps/demos/testing/widgets/dropdownbutton/DropDownButton.test.js
index 8901b4a5ab7d..d439a1a3a529 100644
--- a/apps/demos/testing/widgets/dropdownbutton/DropDownButton.test.js
+++ b/apps/demos/testing/widgets/dropdownbutton/DropDownButton.test.js
@@ -12,7 +12,7 @@ fixture('DropDownButton.Overview')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('DropDownButton', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('DropDownButton', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Overview Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/gauges/GaugeVariableNumberBars.test.js b/apps/demos/testing/widgets/gauges/GaugeVariableNumberBars.test.js
index d9cb8500282e..8c0f5178e5aa 100644
--- a/apps/demos/testing/widgets/gauges/GaugeVariableNumberBars.test.js
+++ b/apps/demos/testing/widgets/gauges/GaugeVariableNumberBars.test.js
@@ -9,7 +9,7 @@ fixture('Gauges.VariableNumberOfBars')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Gauges', 'VariableNumberOfBars', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Gauges', 'VariableNumberOfBars', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Bars visibility changing', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/list/ItemDragging.test.js b/apps/demos/testing/widgets/list/ItemDragging.test.js
index 5253b44d406d..21de9c783565 100644
--- a/apps/demos/testing/widgets/list/ItemDragging.test.js
+++ b/apps/demos/testing/widgets/list/ItemDragging.test.js
@@ -9,7 +9,7 @@ fixture('List.ItemDragging')
     ctx.initialWindowSize = [900, WINDOW_WIDTH];
   });
 
-runManualTest('List', 'ItemDragging', ['jQuery', 'React', 'Vue'/* , 'Angular' */], (test) => {
+runManualTest('List', 'ItemDragging', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('ItemDragging', async (t) => {
     const REORDER_HANDLE_CLASS = 'dx-list-reorder-handle';
     const LIST_CLASS = 'dx-list';
diff --git a/apps/demos/testing/widgets/lookup/Lookup.test.js b/apps/demos/testing/widgets/lookup/Lookup.test.js
index f254486fb1b7..af6a6de9b6da 100644
--- a/apps/demos/testing/widgets/lookup/Lookup.test.js
+++ b/apps/demos/testing/widgets/lookup/Lookup.test.js
@@ -11,7 +11,7 @@ fixture('Lookup.Basics')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Lookup', 'Basics', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Lookup', 'Basics', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Custom Lookup Appearance', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/pivotgrid/IntegratedFieldChooser.test.js b/apps/demos/testing/widgets/pivotgrid/IntegratedFieldChooser.test.js
index b54370a73849..d91c7d5a229e 100644
--- a/apps/demos/testing/widgets/pivotgrid/IntegratedFieldChooser.test.js
+++ b/apps/demos/testing/widgets/pivotgrid/IntegratedFieldChooser.test.js
@@ -14,7 +14,7 @@ fixture('PivotGrid.IntegratedFieldChooser')
     ctx.initialWindowSize = [900, 800];
   });
 
-runManualTest('PivotGrid', 'IntegratedFieldChooser', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('PivotGrid', 'IntegratedFieldChooser', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('IntegratedFieldChooser', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/popup/Scrolling.test.js b/apps/demos/testing/widgets/popup/Scrolling.test.js
index 11e49df7209d..2578f6a61a84 100644
--- a/apps/demos/testing/widgets/popup/Scrolling.test.js
+++ b/apps/demos/testing/widgets/popup/Scrolling.test.js
@@ -14,7 +14,7 @@ fixture('Popup.Scrolling')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Popup', 'Scrolling', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Popup', 'Scrolling', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Scrolling', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/scheduler/cellTemplates.test.js b/apps/demos/testing/widgets/scheduler/cellTemplates.test.js
index 3f40600bb243..3b81161b16ef 100644
--- a/apps/demos/testing/widgets/scheduler/cellTemplates.test.js
+++ b/apps/demos/testing/widgets/scheduler/cellTemplates.test.js
@@ -9,7 +9,7 @@ fixture('Scheduler.CellTemplates')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Scheduler', 'CellTemplates', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Scheduler', 'CellTemplates', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('CellTemplates', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/scheduler/customDragAndDrop.test.js b/apps/demos/testing/widgets/scheduler/customDragAndDrop.test.js
index 76d7852c8aa7..9fe89c81cb7d 100644
--- a/apps/demos/testing/widgets/scheduler/customDragAndDrop.test.js
+++ b/apps/demos/testing/widgets/scheduler/customDragAndDrop.test.js
@@ -28,7 +28,7 @@ fixture('Scheduler.CustomDragAndDrop')
   fromName,
   toName,
 ]) => {
-  runManualTest('Scheduler', 'CustomDragAndDrop', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+  runManualTest('Scheduler', 'CustomDragAndDrop', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
     test(`Should drag-and-drop from ${fromName} to ${toName}`, async (t) => {
       const {
         takeScreenshot,
diff --git a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (fluent.blue.light).png b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (fluent.blue.light).png
index 58681ffb0088..2dc0af17afbc 100644
Binary files a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (fluent.blue.light).png and b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (fluent.blue.light).png differ
diff --git a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (material.blue.light).png b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (material.blue.light).png
index baeb103df86c..29163b12aa46 100644
Binary files a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (material.blue.light).png and b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection (material.blue.light).png differ
diff --git a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection.png b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection.png
index da60e3c7c171..a136bce0faa7 100644
Binary files a/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection.png and b/apps/demos/testing/widgets/scheduler/etalons/scheduler_overview_selection.png differ
diff --git a/apps/demos/testing/widgets/scheduler/resources.test.js b/apps/demos/testing/widgets/scheduler/resources.test.js
index a2b15e168b62..2ace99dc7c52 100644
--- a/apps/demos/testing/widgets/scheduler/resources.test.js
+++ b/apps/demos/testing/widgets/scheduler/resources.test.js
@@ -8,7 +8,7 @@ fixture('Scheduler.Resources')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Scheduler', 'Resources', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Scheduler', 'Resources', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Resource fields shouldn\'t empty', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/scheduler/templates.test.js b/apps/demos/testing/widgets/scheduler/templates.test.js
index 503fc47c4bc6..3375c2a2e6be 100644
--- a/apps/demos/testing/widgets/scheduler/templates.test.js
+++ b/apps/demos/testing/widgets/scheduler/templates.test.js
@@ -11,7 +11,7 @@ fixture('Scheduler.Overview')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Scheduler', 'Overview', ['jQuery'/* , 'React' */], (test) => {
+runManualTest('Scheduler', 'Overview', ['jQuery', 'React'], (test) => {
   test('Overview cell selection (T1041269)', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/sortable/kanban.test.js b/apps/demos/testing/widgets/sortable/kanban.test.js
index 3816ed80a15f..d02fdc4600d6 100644
--- a/apps/demos/testing/widgets/sortable/kanban.test.js
+++ b/apps/demos/testing/widgets/sortable/kanban.test.js
@@ -14,7 +14,7 @@ fixture('Sortable.Kanban')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Sortable', 'Kanban', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Sortable', 'Kanban', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Drag-n-drop kanban columns', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
@@ -26,7 +26,7 @@ runManualTest('Sortable', 'Kanban', ['jQuery'/* , 'React', 'Vue', 'Angular' */],
   });
 });
 
-runManualTest('Sortable', 'Kanban', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Sortable', 'Kanban', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Drag-n-drop card inside the same column', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
@@ -38,7 +38,7 @@ runManualTest('Sortable', 'Kanban', ['jQuery'/* , 'React', 'Vue', 'Angular' */],
   });
 });
 
-runManualTest('Sortable', 'Kanban', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Sortable', 'Kanban', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Drag-n-drop card to a different column', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/splitter/Overview.test.js b/apps/demos/testing/widgets/splitter/Overview.test.js
index b94dbbf8f0dc..de1a25c4f404 100644
--- a/apps/demos/testing/widgets/splitter/Overview.test.js
+++ b/apps/demos/testing/widgets/splitter/Overview.test.js
@@ -11,7 +11,7 @@ fixture('Splitter.Overview')
     ctx.initialWindowSize = [900, 800];
   });
 
-runManualTest('Splitter', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Splitter', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Correct Focus styles on every Item Panes', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/tabpanel/Overview.test.js b/apps/demos/testing/widgets/tabpanel/Overview.test.js
index a92c59f0d02f..fefa51d1c7e8 100644
--- a/apps/demos/testing/widgets/tabpanel/Overview.test.js
+++ b/apps/demos/testing/widgets/tabpanel/Overview.test.js
@@ -14,7 +14,7 @@ fixture('TabPanel.Overview')
     ctx.initialWindowSize = [900, 1200];
   });
 
-runManualTest('TabPanel', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('TabPanel', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Overview', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/tabs/Overview.test.js b/apps/demos/testing/widgets/tabs/Overview.test.js
index 01b45da93f16..8bc5928c4b3e 100644
--- a/apps/demos/testing/widgets/tabs/Overview.test.js
+++ b/apps/demos/testing/widgets/tabs/Overview.test.js
@@ -15,7 +15,7 @@ fixture('Tabs.Overview')
     ctx.initialWindowSize = [900, 1200];
   });
 
-runManualTest('Tabs', 'Overview', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Tabs', 'Overview', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Overview', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/toolbar/Adaptability.test.js b/apps/demos/testing/widgets/toolbar/Adaptability.test.js
index 91a627886c22..bd34ecabb6c7 100644
--- a/apps/demos/testing/widgets/toolbar/Adaptability.test.js
+++ b/apps/demos/testing/widgets/toolbar/Adaptability.test.js
@@ -15,7 +15,7 @@ fixture('Toolbar.Adaptability')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('Toolbar', 'Adaptability', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('Toolbar', 'Adaptability', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('Adaptability', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
diff --git a/apps/demos/testing/widgets/vectormap/VectorMapZooming.test.js b/apps/demos/testing/widgets/vectormap/VectorMapZooming.test.js
index 278ead9aa8af..b6e4d736ca59 100644
--- a/apps/demos/testing/widgets/vectormap/VectorMapZooming.test.js
+++ b/apps/demos/testing/widgets/vectormap/VectorMapZooming.test.js
@@ -9,7 +9,7 @@ fixture('VectorMap.DynamicViewport')
     ctx.initialWindowSize = [900, 600];
   });
 
-runManualTest('VectorMap', 'DynamicViewport', ['jQuery'/* , 'React', 'Vue', 'Angular' */], (test) => {
+runManualTest('VectorMap', 'DynamicViewport', ['jQuery', 'React', 'Vue', 'Angular'], (test) => {
   test('VectorMap.DynamicViewport', async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
     const zoomButton = $($('#vector-map .dxm-control-bar g').nth(1)).find('circle').nth(0);
diff --git a/apps/demos/utils/visual-tests/matrix-test-helper.js b/apps/demos/utils/visual-tests/matrix-test-helper.js
index d1ca6e9a2fc1..2890237c0b4c 100644
--- a/apps/demos/utils/visual-tests/matrix-test-helper.js
+++ b/apps/demos/utils/visual-tests/matrix-test-helper.js
@@ -187,25 +187,65 @@ const SKIPPED_TESTS = {
       { demo: 'TaskTemplate', themes: [THEME.generic, THEME.material, THEME.fluent] },
       { demo: 'Validation', themes: [THEME.generic, THEME.material, THEME.fluent] },
     ],
-    Pagination: ['Overview'],
   },
   Angular: {
+    Accordion: [
+      { demo: 'Overview', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
+    Common: [
+      { demo: 'EditorAppearanceVariants', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
+    DropDownButton: [
+      { demo: 'Overview', themes: [THEME.material] },
+    ],
     Charts: [
       { demo: 'Overview', themes: [THEME.material] },
-      { demo: 'ZoomingAndScrollingAPI', themes: [THEME.material] },
+      { demo: 'Crosshair', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'CustomAnnotations', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'LoadDataOnDemand', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'CustomLegendMarkers', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'PieWithResolvedLabelOverlapping', themes: [THEME.generic, THEME.material] },
+      { demo: 'ZoomingAndScrollingAPI', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'ZoomingOnAreaSelection', themes: [THEME.generic, THEME.material, THEME.fluent] },
       { demo: 'TooltipHTMLSupport', themes: [THEME.material] },
     ],
     VectorMap: [
       { demo: 'TooltipHTMLSupport', themes: [THEME.material] },
     ],
+    DropDownBox: [
+      { demo: 'MultipleSelection', themes: [THEME.generic, THEME.material] },
+    ],
+    List: [
+      { demo: 'ItemDragging', themes: [THEME.generic] },
+    ],
+    Gauges: [
+      { demo: 'VariableNumberOfBars', themes: [THEME.material, THEME.fluent] },
+    ],
     DataGrid: [
-      { demo: 'BatchEditing', themes: [THEME.fluent] },
-      { demo: 'CustomNewRecordPosition', themes: [THEME.fluent] },
-      { demo: 'CellEditingAndEditingAPI', themes: [THEME.fluent, THEME.material] },
-      { demo: 'MultipleRecordSelectionAPI', themes: [THEME.fluent, THEME.material] },
-      { demo: 'RemoteGrouping', themes: [THEME.fluent, THEME.material] },
-      { demo: 'RowEditingAndEditingEvents', themes: [THEME.fluent, THEME.material] },
-      { demo: 'EditStateManagement', themes: [THEME.fluent, THEME.material] },
+      { demo: 'Appearance', themes: [THEME.generic, THEME.material] },
+      { demo: 'AdvancedMasterDetailView', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'BatchEditing', themes: [THEME.material, THEME.fluent] },
+      { demo: 'AjaxRequest', themes: [THEME.generic, THEME.material, THEME.fluent ] },
+      { demo: 'InfiniteScrolling', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'MasterDetailView', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'SimpleArray', themes: [THEME.generic, THEME.material] },
+      { demo: 'MasterDetailAPI', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'DataValidation', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'MultipleSorting', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'OdataService', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'CustomNewRecordPosition', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Filtering', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'FilteringAPI', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'GroupSummaries', themes: [THEME.material, THEME.fluent ] },
+      { demo: 'RecordPaging', themes: [THEME.material, THEME.fluent] },
+      { demo: 'RowSelection', themes: [THEME.material, THEME.fluent] },
+      { demo: 'MultipleSelection', themes: [THEME.material, THEME.fluent] },
+      { demo: 'CellEditingAndEditingAPI', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'MultipleRecordSelectionAPI', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'RemoteGrouping', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'RowEditingAndEditingEvents', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'EditStateManagement', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'RecordGrouping', themes: [THEME.material, THEME.fluent] },
     ],
     Form: [
       'CustomizeItem',
@@ -213,8 +253,21 @@ const SKIPPED_TESTS = {
     ],
     Scheduler: [
       'CustomDragAndDrop',
+      { demo: 'Resources', themes: [THEME.fluent] },
+      { demo: 'CellTemplates', themes: [THEME.generic] },
+    ],
+    Popup: [
+      { demo: 'Scrolling', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
+    Sortable: [
+      { demo: 'Kanban', themes: [THEME.generic, THEME.material, THEME.fluent] },
     ],
-    Pagination: [{ demo: 'Overview', themes: [THEME.generic, THEME.material, THEME.fluent] }],
+    PivotGrid: [
+      { demo: 'IntegratedFieldChooser', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
+    Toolbar: [
+      { demo: 'Adaptability', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ]
   },
   Vue: {
     Charts: [
@@ -232,15 +285,17 @@ const SKIPPED_TESTS = {
       { demo: 'CellEditingAndEditingAPI', themes: [THEME.fluent, THEME.material] },
       { demo: 'MultipleRecordSelectionAPI', themes: [THEME.fluent, THEME.material] },
       { demo: 'RemoteGrouping', themes: [THEME.fluent, THEME.material] },
-      { demo: 'RowEditingAndEditingEvents', themes: [THEME.fluent, THEME.material] },
-      { demo: 'EditStateManagement', themes: [THEME.fluent, THEME.material] },
+      { demo: 'RowEditingAndEditingEvents', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'EditStateManagement', themes: [THEME.generic, THEME.fluent, THEME.material] },
       { demo: 'FilteringAPI', themes: [THEME.material] },
       'StatePersistence',
     ],
     Drawer: [
       { demo: 'TopOrBottomPosition', themes: [THEME.material] },
     ],
-    Pagination: ['Overview'],
+    Toolbar: [
+      { demo: 'Adaptability', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ]
   },
   React: {
     Charts: [
@@ -253,8 +308,8 @@ const SKIPPED_TESTS = {
       { demo: 'CellEditingAndEditingAPI', themes: [THEME.fluent, THEME.material] },
       { demo: 'MultipleRecordSelectionAPI', themes: [THEME.fluent, THEME.material] },
       { demo: 'RemoteGrouping', themes: [THEME.fluent, THEME.material] },
-      { demo: 'RowEditingAndEditingEvents', themes: [THEME.fluent, THEME.material] },
-      { demo: 'EditStateManagement', themes: [THEME.fluent, THEME.material] },
+      { demo: 'RowEditingAndEditingEvents', themes: [THEME.generic, THEME.fluent, THEME.material] },
+      { demo: 'EditStateManagement', themes: [THEME.generic, THEME.fluent, THEME.material] },
       { demo: 'Filtering', themes: [THEME.fluent, THEME.material] },
       { demo: 'RecordGrouping', themes: [THEME.material] },
     ],
@@ -262,7 +317,6 @@ const SKIPPED_TESTS = {
       { demo: 'Overview', themes: [THEME.fluent, THEME.material] },
       { demo: 'Templates', themes: [THEME.fluent, THEME.material] },
     ],
-    Pagination: ['Overview'],
   },
 };
 
diff --git a/e2e/testcafe-devextreme/tests/container.html b/e2e/testcafe-devextreme/tests/container.html
index 7ca423929c01..6878c1968237 100644
--- a/e2e/testcafe-devextreme/tests/container.html
+++ b/e2e/testcafe-devextreme/tests/container.html
@@ -15,6 +15,7 @@
     <link rel="dx-theme" data-theme="fluent.blue.dark" href="../../../packages/devextreme/artifacts/css/dx.fluent.blue.dark.css" data-active="false">
     <link rel="dx-theme" data-theme="fluent.saas.light" href="../../../packages/devextreme/artifacts/css/dx.fluent.saas.light.css" data-active="false">
     <link rel="dx-theme" data-theme="fluent.saas.dark" href="../../../packages/devextreme/artifacts/css/dx.fluent.saas.dark.css" data-active="false">
+    <link rel="dx-theme" data-theme="generic.greenmist" href="../../../packages/devextreme/artifacts/css/dx.greenmist.css" data-active="false">
 
     <script type="text/javascript" src="../../../packages/devextreme/artifacts/js/jquery.min.js"></script>
     <script type="text/javascript" src="../../../packages/devextreme/artifacts/js/dx-quill.min.js"></script>
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_header_hover_with_fixed_columns_(generic.greenmist).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_header_hover_with_fixed_columns_(generic.greenmist).png
new file mode 100644
index 000000000000..5c2dfcbbccbb
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_header_hover_with_fixed_columns_(generic.greenmist).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(fluent.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(fluent.blue.light).png
new file mode 100644
index 000000000000..060c2967dd13
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(fluent.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.greenmist).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.greenmist).png
new file mode 100644
index 000000000000..61a8472d53c8
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.greenmist).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.light).png
new file mode 100644
index 000000000000..7f787e6a0d2e
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(generic.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(material.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(material.blue.light).png
new file mode 100644
index 000000000000..2690c941b54e
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_alt_with_fixed_columns_(material.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_hover_with_fixed_columns_(generic.greenmist).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_hover_with_fixed_columns_(generic.greenmist).png
new file mode 100644
index 000000000000..9543bde5403f
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/datagrid_row_hover_with_fixed_columns_(generic.greenmist).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_1.png
new file mode 100644
index 000000000000..58e432391684
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_2.png
new file mode 100644
index 000000000000..46cbe4f61758
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_and_command_columns_band_headers_navigation_by_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_1.png
new file mode 100644
index 000000000000..e523467a8bbf
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_2.png
new file mode 100644
index 000000000000..e32261901cbb
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_1.png
new file mode 100644
index 000000000000..9b700201e060
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_2.png
new file mode 100644
index 000000000000..0ebd98b045d8
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_and_adaptability_headers_navigation_by_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_1.png
new file mode 100644
index 000000000000..2fc74ea9e9a9
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_2.png
new file mode 100644
index 000000000000..9164957b4f95
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_shift_and_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_1.png
new file mode 100644
index 000000000000..abdb301da8ec
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_2.png
new file mode 100644
index 000000000000..a84f9b89bd03
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_band_headers_navigation_by_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_1.png
index 78859fca5d11..99505a36c308 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_1.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_2.png
index a6c01d199576..ce3ec14fe057 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_2.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_shift_and_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_1.png
index a1388bb6bdb1..978c0f657419 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_1.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_2.png
index 1dcb0ee32aff..7c90e246a7bd 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_2.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_data_cells_navigation_by_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_shift_and_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_shift_and_tab_2.png
index f3c79ac48cae..51444b601352 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_shift_and_tab_2.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_shift_and_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_1.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_1.png
index aabcc4d5e1cb..6f5ad3a56099 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_1.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_1.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_2.png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_2.png
index 2c993dd10371..a34d0a439a70 100644
Binary files a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_2.png and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_headers_navigation_by_tab_2.png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(fluent.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(fluent.blue.light).png
new file mode 100644
index 000000000000..db08680141e6
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(fluent.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(generic.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(generic.light).png
new file mode 100644
index 000000000000..7b5dfafd8b08
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(generic.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(material.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(material.blue.light).png
new file mode 100644
index 000000000000..6067fa50d8c3
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_125%_zoom_(material.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(fluent.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(fluent.blue.light).png
new file mode 100644
index 000000000000..a51ca9e2f9e6
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(fluent.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(generic.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(generic.light).png
new file mode 100644
index 000000000000..96f8ca80f508
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(generic.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(material.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(material.blue.light).png
new file mode 100644
index 000000000000..374bba84fb00
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_150%_zoom_(material.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(fluent.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(fluent.blue.light).png
new file mode 100644
index 000000000000..1b009ba0de51
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(fluent.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(generic.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(generic.light).png
new file mode 100644
index 000000000000..a394c71670e4
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(generic.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(material.blue.light).png b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(material.blue.light).png
new file mode 100644
index 000000000000..7b9817c07ed1
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/etalons/fixed_columns_with_90%_zoom_(material.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/focusOverlay.ts b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/focusOverlay.ts
index a23da83399ea..abac05359f60 100644
--- a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/focusOverlay.ts
+++ b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/focusOverlay.ts
@@ -17,7 +17,7 @@ test('Focus overlay should be displayed correctly if sticky columns are turned o
   await t.expect(dataGrid.isReady()).ok();
 
   await t
-    .click(dataGrid.getGroupRow(0).element)
+    .click(dataGrid.getGroupRow(0).getCell(1).element)
     .pressKey('tab');
 
   await takeScreenshot('datagrid_group_row_focused.png', dataGrid.element);
@@ -29,7 +29,7 @@ test('Focus overlay should be displayed correctly if sticky columns are turned o
   await takeScreenshot('datagrid_adaptive_item_focused.png', dataGrid.element);
 
   await t
-    .click(dataGrid.getGroupFooterRow().nth(0))
+    .click(dataGrid.getGroupFooterRow().nth(0), { offsetX: 5, offsetY: 5 })
     .pressKey('tab');
 
   await takeScreenshot('datagrid_group_footer_row_focused.png', dataGrid.element);
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/stickyColumns.ts b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/stickyColumns.ts
index 8285cd6be963..fb473246a65e 100644
--- a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/stickyColumns.ts
+++ b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/stickyColumns.ts
@@ -1,6 +1,6 @@
 import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
 import DataGrid from 'devextreme-testcafe-models/dataGrid';
-import { Selector } from 'testcafe';
+import { ClientFunction, Selector } from 'testcafe';
 import { safeSizeTest } from '../../../helpers/safeSizeTest';
 import { createWidget } from '../../../helpers/createWidget';
 import { getData } from '../helpers/generateDataSourceData';
@@ -1193,7 +1193,12 @@ safeSizeTest('The simulated scrollbar should display correctly when there are st
   },
 }));
 
-[Themes.genericLight, Themes.materialBlue, Themes.fluentBlue].forEach((theme) => {
+[
+  Themes.genericLight,
+  Themes.materialBlue,
+  Themes.fluentBlue,
+  Themes.genericGreenMist,
+].forEach((theme) => {
   safeSizeTest(`Header hover should display correctly when there are fixed columns (${theme} theme)`, async (t) => {
     const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
     const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
@@ -1276,4 +1281,89 @@ safeSizeTest('The simulated scrollbar should display correctly when there are st
       await t.hover(Selector('body'));
       await changeTheme(Themes.genericLight);
     });
+
+  safeSizeTest(`Alternating rows should display correctly when there are fixed columns (${theme} theme)`, async (t) => {
+    const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+    const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+
+    await t.expect(dataGrid.isReady()).ok();
+
+    await takeScreenshot(`datagrid_row_alt_with_fixed_columns_(${theme}).png`, dataGrid.element);
+
+    await t
+      .expect(compareResults.isValid())
+      .ok(compareResults.errorMessages());
+  }, [900, 800])
+    .before(async () => {
+      await changeTheme(theme);
+      await createWidget('dxDataGrid', {
+        dataSource: getData(20, 15),
+        columnWidth: 100,
+        columnAutoWidth: true,
+        rowAlternationEnabled: true,
+        customizeColumns: (columns) => {
+          columns[5].fixed = true;
+          columns[5].fixedPosition = 'left';
+          columns[6].fixed = true;
+          columns[6].fixedPosition = 'left';
+
+          columns[8].fixed = true;
+          columns[8].fixedPosition = 'right';
+          columns[9].fixed = true;
+          columns[9].fixedPosition = 'right';
+        },
+      });
+    })
+    .after(async () => {
+      await changeTheme(Themes.genericLight);
+    });
+});
+
+[
+  Themes.genericLight,
+  Themes.materialBlue,
+  Themes.fluentBlue,
+].forEach((theme) => {
+  [0.9, 1.25, 1.5].forEach((zoom) => {
+    safeSizeTest(`Fixed columns should display correctly at ${zoom * 100}% zoom (${theme} theme)`, async (t) => {
+      const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+      const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+
+      await t.expect(dataGrid.isReady()).ok();
+
+      await takeScreenshot(`fixed_columns_with_${zoom * 100}%_zoom_(${theme}).png`, dataGrid.element);
+
+      await t
+        .expect(compareResults.isValid())
+        .ok(compareResults.errorMessages());
+    }, [900, 800])
+      .before(async () => {
+        await ClientFunction((zoomValue: number) => {
+          $('body').css('zoom', zoomValue);
+        })(zoom);
+        await changeTheme(theme);
+        await createWidget('dxDataGrid', {
+          dataSource: getData(20, 15),
+          columnWidth: 100,
+          columnAutoWidth: true,
+          customizeColumns: (columns) => {
+            columns[5].fixed = true;
+            columns[5].fixedPosition = 'left';
+            columns[6].fixed = true;
+            columns[6].fixedPosition = 'left';
+
+            columns[8].fixed = true;
+            columns[8].fixedPosition = 'right';
+            columns[9].fixed = true;
+            columns[9].fixedPosition = 'right';
+          },
+        });
+      })
+      .after(async () => {
+        await ClientFunction(() => {
+          $('body').css('zoom', '');
+        })();
+        await changeTheme(Themes.genericLight);
+      });
+  });
 });
diff --git a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/withKeyboardNavigation.ts b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/withKeyboardNavigation.ts
index eff013d73f8a..c24f40447c8b 100644
--- a/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/withKeyboardNavigation.ts
+++ b/e2e/testcafe-devextreme/tests/dataGrid/stickyColumns/withKeyboardNavigation.ts
@@ -1,40 +1,11 @@
 import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
 import DataGrid from 'devextreme-testcafe-models/dataGrid';
-import { ClientFunction } from 'testcafe';
 import { safeSizeTest } from '../../../helpers/safeSizeTest';
 import { createWidget } from '../../../helpers/createWidget';
 import url from '../../../helpers/getPageUrl';
 import { defaultConfig } from './data';
 
-function getScrollPadding(scrollContainer, paddingSide): Promise<string> {
-  return ClientFunction((element, side) => element().style[`scrollPadding${side}`])(scrollContainer, paddingSide);
-}
-
-function cellIsVisibleInViewport(cell, scrollContainer): Promise<boolean> {
-  return ClientFunction((element, container) => {
-    const cellElement = element();
-    const cellRect = cellElement.getBoundingClientRect();
-    const scrollContainerElement = container();
-    const scrollPaddingLeft = parseFloat(scrollContainerElement.style.scrollPaddingLeft);
-    const scrollPaddingRight = parseFloat(scrollContainerElement.style.scrollPaddingRight);
-    const {
-      left: scrollContainerOffsetLeft,
-      right: scrollContainerOffsetRight,
-    }: { left: number; right: number } = scrollContainerElement.getBoundingClientRect();
-
-    if (cellRect.right < (scrollContainerOffsetLeft + scrollPaddingLeft)) {
-      return false;
-    }
-
-    if (cellRect.left > (scrollContainerOffsetRight - scrollPaddingRight)) {
-      return false;
-    }
-
-    return true;
-  })(cell, scrollContainer);
-}
-
-const navigateToNextCell = async (t, $headerCell, scrollContainer) => {
+const navigateToNextCell = async (t, $headerCell) => {
   // act
   await t
     .pressKey('tab');
@@ -42,12 +13,10 @@ const navigateToNextCell = async (t, $headerCell, scrollContainer) => {
   // assert
   await t
     .expect($headerCell.isFocused)
-    .ok()
-    .expect(cellIsVisibleInViewport($headerCell.element, scrollContainer))
     .ok();
 };
 
-const navigateToPrevCell = async (t, $headerCell, scrollContainer) => {
+const navigateToPrevCell = async (t, $headerCell) => {
   // act
   await t
     .pressKey('shift+tab');
@@ -55,25 +24,9 @@ const navigateToPrevCell = async (t, $headerCell, scrollContainer) => {
   // assert
   await t
     .expect($headerCell.isFocused)
-    .ok()
-    .expect(cellIsVisibleInViewport($headerCell.element, scrollContainer))
     .ok();
 };
 
-const checkScrollPadding = async (
-  t,
-  scrollContainer,
-  scrollPaddingLeft,
-  scrollPaddingRight,
-) => {
-  // assert
-  await t
-    .expect(getScrollPadding(scrollContainer, 'Left'))
-    .eql(scrollPaddingLeft)
-    .expect(getScrollPadding(scrollContainer, 'Right'))
-    .eql(scrollPaddingRight);
-};
-
 const DATA_GRID_SELECTOR = '#container';
 
 fixture.disablePageReloads`Fixed Columns - keyboard navigation`
@@ -84,14 +37,10 @@ safeSizeTest('Headers navigation by Tab key when there are fixed columns', async
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
   const headers = dataGrid.getHeaders();
-  const headersScrollContainer = headers.getContent();
   const headerRow = headers.getHeaderRow(0);
 
   await t.expect(dataGrid.isReady()).ok();
 
-  // assert
-  await checkScrollPadding(t, headersScrollContainer, '130px', '285px');
-
   // act
   await t.click(headerRow.getHeaderCell(0).element);
 
@@ -101,32 +50,28 @@ safeSizeTest('Headers navigation by Tab key when there are fixed columns', async
     .ok();
 
   // act
-  await navigateToNextCell(t, headerRow.getHeaderCell(1), headersScrollContainer);
-  await navigateToNextCell(t, headerRow.getHeaderCell(2), headersScrollContainer);
-  await navigateToNextCell(t, headerRow.getHeaderCell(3), headersScrollContainer);
-
-  // assert
-  await checkScrollPadding(t, headersScrollContainer, '130px', '160px');
+  await navigateToNextCell(t, headerRow.getHeaderCell(1));
+  await navigateToNextCell(t, headerRow.getHeaderCell(2));
+  await navigateToNextCell(t, headerRow.getHeaderCell(3));
 
   await takeScreenshot('fixed_columns_headers_navigation_by_tab_1.png', dataGrid.element);
 
   // act
-  await navigateToNextCell(t, headerRow.getHeaderCell(4), headersScrollContainer);
-  await navigateToNextCell(t, headerRow.getHeaderCell(5), headersScrollContainer);
-  await navigateToNextCell(t, headerRow.getHeaderCell(6), headersScrollContainer);
-
-  // assert
-  await checkScrollPadding(t, headersScrollContainer, '255px', '160px');
+  await navigateToNextCell(t, headerRow.getHeaderCell(4));
+  await navigateToNextCell(t, headerRow.getHeaderCell(5));
 
   await takeScreenshot('fixed_columns_headers_navigation_by_tab_2.png', dataGrid.element);
 
+  // act
+  await navigateToNextCell(t, headerRow.getHeaderCell(6));
+
   // assert
   await t
     .expect(compareResults.isValid())
     .ok(compareResults.errorMessages());
 }, [900, 800]).before(async () => createWidget('dxDataGrid', {
   ...defaultConfig,
-  width: 550,
+  width: 600,
   customizeColumns(columns) {
     columns[4].width = 125;
     columns[4].fixed = true;
@@ -139,14 +84,10 @@ safeSizeTest('Headers navigation by Shift and Tab keys when there are fixed colu
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
   const headers = dataGrid.getHeaders();
-  const headersScrollContainer = headers.getContent();
   const headerRow = headers.getHeaderRow(0);
 
   await t.expect(dataGrid.isReady()).ok();
 
-  // assert
-  await checkScrollPadding(t, headersScrollContainer, '130px', '285px');
-
   // act
   await t.click(headerRow.getHeaderCell(6).element);
 
@@ -156,24 +97,64 @@ safeSizeTest('Headers navigation by Shift and Tab keys when there are fixed colu
     .ok();
 
   // act
-  await navigateToPrevCell(t, headerRow.getHeaderCell(5), headersScrollContainer);
+  await navigateToPrevCell(t, headerRow.getHeaderCell(5));
+
+  await takeScreenshot('fixed_columns_headers_navigation_by_shift_and_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, headerRow.getHeaderCell(4));
+  await navigateToPrevCell(t, headerRow.getHeaderCell(3));
+  await navigateToPrevCell(t, headerRow.getHeaderCell(2));
+  await navigateToPrevCell(t, headerRow.getHeaderCell(1));
+
+  await takeScreenshot('fixed_columns_headers_navigation_by_shift_and_tab_2.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, headerRow.getHeaderCell(0));
 
   // assert
-  await checkScrollPadding(t, headersScrollContainer, '130px', '160px');
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [900, 800]).before(async () => createWidget('dxDataGrid', {
+  ...defaultConfig,
+  width: 625,
+  customizeColumns(columns) {
+    columns[4].width = 125;
+    columns[4].fixed = true;
+    columns[4].fixedPosition = 'sticky';
+  },
+}));
 
-  await takeScreenshot('fixed_columns_headers_navigation_by_shift_and_tab_1.png', dataGrid.element);
+safeSizeTest('Headers navigation by Tab key when there are fixed columns and adaptability is enabled', async (t) => {
+  // arrange
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+  const headers = dataGrid.getHeaders();
+  const headerRow = headers.getHeaderRow(0);
+
+  await t.expect(dataGrid.isReady()).ok();
 
   // act
-  await navigateToPrevCell(t, headerRow.getHeaderCell(4), headersScrollContainer);
-  await navigateToPrevCell(t, headerRow.getHeaderCell(3), headersScrollContainer);
-  await navigateToPrevCell(t, headerRow.getHeaderCell(2), headersScrollContainer);
-  await navigateToPrevCell(t, headerRow.getHeaderCell(1), headersScrollContainer);
-  await navigateToPrevCell(t, headerRow.getHeaderCell(0), headersScrollContainer);
+  await t.click(headerRow.getHeaderCell(0).element);
 
   // assert
-  await checkScrollPadding(t, headersScrollContainer, '130px', '285px');
+  await t
+    .expect(headerRow.getHeaderCell(0).isFocused)
+    .ok();
 
-  await takeScreenshot('fixed_columns_headers_navigation_by_shift_and_tab_2.png', dataGrid.element);
+  // act
+  await navigateToNextCell(t, headerRow.getHeaderCell(1));
+  await navigateToNextCell(t, headerRow.getHeaderCell(2));
+  await navigateToNextCell(t, headerRow.getHeaderCell(3));
+
+  await takeScreenshot('fixed_columns_and_adaptability_headers_navigation_by_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToNextCell(t, headerRow.getHeaderCell(4));
+  await navigateToNextCell(t, headerRow.getHeaderCell(6));
+
+  await takeScreenshot('fixed_columns_and_adaptability_headers_navigation_by_tab_2.png', dataGrid.element);
 
   // assert
   await t
@@ -181,11 +162,205 @@ safeSizeTest('Headers navigation by Shift and Tab keys when there are fixed colu
     .ok(compareResults.errorMessages());
 }, [900, 800]).before(async () => createWidget('dxDataGrid', {
   ...defaultConfig,
-  width: 625,
+  width: 650,
+  columnWidth: 150,
+  customizeColumns(columns) {
+    columns[4].width = 125;
+    columns[4].fixed = true;
+    columns[4].fixedPosition = 'sticky';
+    columns[5].hidingPriority = 0;
+  },
+}));
+
+safeSizeTest('Headers navigation by Shift and Tab keys when there are fixed columns and adaptability is enabled', async (t) => {
+  // arrange
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+  const headers = dataGrid.getHeaders();
+  const headerRow = headers.getHeaderRow(0);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  // act
+  await t.click(headerRow.getHeaderCell(6).element);
+
+  // assert
+  await t
+    .expect(headerRow.getHeaderCell(6).isFocused)
+    .ok();
+
+  // act
+  await navigateToPrevCell(t, headerRow.getHeaderCell(4));
+
+  await takeScreenshot('fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, headerRow.getHeaderCell(3));
+
+  await takeScreenshot('fixed_columns_and_adaptability_headers_navigation_by_shift_and_tab_2.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, headerRow.getHeaderCell(2));
+  await navigateToPrevCell(t, headerRow.getHeaderCell(1));
+  await navigateToPrevCell(t, headerRow.getHeaderCell(0));
+
+  // assert
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [900, 800]).before(async () => createWidget('dxDataGrid', {
+  ...defaultConfig,
+  width: 650,
+  columnWidth: 150,
   customizeColumns(columns) {
     columns[4].width = 125;
     columns[4].fixed = true;
     columns[4].fixedPosition = 'sticky';
+    columns[5].hidingPriority = 0;
+  },
+}));
+
+safeSizeTest('Band headers navigation by Tab key when there are fixed columns', async (t) => {
+  // arrange
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+  const headers = dataGrid.getHeaders();
+  const firstHeaderRow = headers.getHeaderRow(0);
+  const secondHeaderRow = headers.getHeaderRow(1);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  // act
+  await t.click(firstHeaderRow.getHeaderCell(0).element);
+
+  // assert
+  await t
+    .expect(firstHeaderRow.getHeaderCell(0).isFocused)
+    .ok();
+
+  // act
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(1));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(2));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(3));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(4));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(5));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(6));
+
+  await takeScreenshot('fixed_columns_band_headers_navigation_by_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToNextCell(t, secondHeaderRow.getHeaderCell(0));
+
+  await takeScreenshot('fixed_columns_band_headers_navigation_by_tab_2.png', dataGrid.element);
+
+  // assert
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [900, 800]).before(async () => createWidget('dxDataGrid', {
+  ...defaultConfig,
+  width: 600,
+  customizeColumns(columns) {
+    columns[3] = {
+      caption: 'Band columns',
+      columns: [{ dataField: 'CustomerStoreCity', width: 150 }],
+    };
+  },
+}));
+
+safeSizeTest('Band headers navigation by Shift and Tab key when there are fixed columns', async (t) => {
+  // arrange
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+  const headers = dataGrid.getHeaders();
+  const firstHeaderRow = headers.getHeaderRow(0);
+  const secondHeaderRow = headers.getHeaderRow(1);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  // act
+  await t.click(dataGrid.getDataCell(0, 0).element);
+  await navigateToPrevCell(t, secondHeaderRow.getHeaderCell(0));
+
+  await takeScreenshot('fixed_columns_band_headers_navigation_by_shift_and_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(6));
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(5));
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(4));
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(3));
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(2));
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(1));
+
+  await takeScreenshot('fixed_columns_band_headers_navigation_by_shift_and_tab_2.png', dataGrid.element);
+
+  // act
+  await navigateToPrevCell(t, firstHeaderRow.getHeaderCell(0));
+
+  // assert
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [900, 800]).before(async () => createWidget('dxDataGrid', {
+  ...defaultConfig,
+  width: 550,
+  columnWidth: 200,
+  customizeColumns(columns) {
+    columns[5] = {
+      caption: 'Band columns',
+      columns: [{ dataField: 'SaleAmount', width: 150 }],
+    };
+  },
+}));
+
+safeSizeTest('Band headers navigation by Tab key when there are fixed and command columns', async (t) => {
+  // arrange
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
+  const headers = dataGrid.getHeaders();
+  const firstHeaderRow = headers.getHeaderRow(0);
+  const secondHeaderRow = headers.getHeaderRow(1);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  // act
+  await t.click(firstHeaderRow.getHeaderCell(0).element);
+
+  // assert
+  await t
+    .expect(firstHeaderRow.getHeaderCell(0).isFocused)
+    .ok();
+
+  // act
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(1));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(2));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(3));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(4));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(5));
+  await navigateToNextCell(t, firstHeaderRow.getHeaderCell(6));
+
+  await takeScreenshot('fixed_and_command_columns_band_headers_navigation_by_tab_1.png', dataGrid.element);
+
+  // act
+  await navigateToNextCell(t, secondHeaderRow.getHeaderCell(0));
+
+  await takeScreenshot('fixed_and_command_columns_band_headers_navigation_by_tab_2.png', dataGrid.element);
+
+  // assert
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [900, 800]).before(async () => createWidget('dxDataGrid', {
+  ...defaultConfig,
+  width: 600,
+  editing: {
+    allowUpdating: true,
+  },
+  customizeColumns(columns) {
+    columns[3] = {
+      caption: 'Band columns',
+      columns: [{ dataField: 'CustomerStoreCity', width: 150 }],
+    };
   },
 }));
 
@@ -193,32 +368,33 @@ safeSizeTest('Data cells navigation by Tab key when there are fixed columns', as
   // arrange
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
-  const scrollContainer = dataGrid.getScrollContainer();
 
   await t.expect(dataGrid.isReady()).ok();
 
   // act
   await t.click(dataGrid.getDataCell(0, 0).element);
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 1), scrollContainer);
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 2), scrollContainer);
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 3), scrollContainer);
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 1));
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 2));
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 3));
 
   await takeScreenshot('fixed_columns_data_cells_navigation_by_tab_1.png', dataGrid.element);
 
   // act
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 4), scrollContainer);
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 5), scrollContainer);
-  await navigateToNextCell(t, dataGrid.getDataCell(0, 6), scrollContainer);
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 4));
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 5));
 
   await takeScreenshot('fixed_columns_data_cells_navigation_by_tab_2.png', dataGrid.element);
 
+  // act
+  await navigateToNextCell(t, dataGrid.getDataCell(0, 6));
+
   // assert
   await t
     .expect(compareResults.isValid())
     .ok(compareResults.errorMessages());
 }, [900, 800]).before(async () => createWidget('dxDataGrid', {
   ...defaultConfig,
-  width: 550,
+  width: 600,
   customizeColumns(columns) {
     columns[4].width = 125;
     columns[4].fixed = true;
@@ -230,35 +406,36 @@ safeSizeTest('Data cells navigation by Shift and Tab keys when there are fixed c
   // arrange
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid(DATA_GRID_SELECTOR);
-  const scrollContainer = dataGrid.getScrollContainer();
 
   await t.expect(dataGrid.isReady()).ok();
 
   // act
   await t.click(dataGrid.getDataCell(0, 6).element);
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 5), scrollContainer);
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 4), scrollContainer);
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 5));
 
   await takeScreenshot('fixed_columns_data_cells_navigation_by_shift_and_tab_1.png', dataGrid.element);
 
   // act
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 3), scrollContainer);
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 2), scrollContainer);
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 1), scrollContainer);
-  await navigateToPrevCell(t, dataGrid.getDataCell(0, 0), scrollContainer);
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 4));
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 3));
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 2));
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 1));
 
   await takeScreenshot('fixed_columns_data_cells_navigation_by_shift_and_tab_2.png', dataGrid.element);
 
+  // act
+  await navigateToPrevCell(t, dataGrid.getDataCell(0, 0));
+
   // assert
   await t
     .expect(compareResults.isValid())
     .ok(compareResults.errorMessages());
 }, [900, 800]).before(async () => createWidget('dxDataGrid', {
   ...defaultConfig,
-  width: 550,
+  width: 625,
   customizeColumns(columns) {
-    columns[3].width = 125;
-    columns[3].fixed = true;
-    columns[3].fixedPosition = 'sticky';
+    columns[4].width = 125;
+    columns[4].fixed = true;
+    columns[4].fixedPosition = 'sticky';
   },
 }));
diff --git a/e2e/testcafe-devextreme/tests/scheduler/a11y/appointment.ts b/e2e/testcafe-devextreme/tests/scheduler/a11y/appointment.ts
index 8aa84907dbba..ffd48cf6aaab 100644
--- a/e2e/testcafe-devextreme/tests/scheduler/a11y/appointment.ts
+++ b/e2e/testcafe-devextreme/tests/scheduler/a11y/appointment.ts
@@ -1,6 +1,8 @@
 import Scheduler from 'devextreme-testcafe-models/scheduler';
+import { a11yCheck } from '../../../helpers/accessibility/utils';
 import { createWidget } from '../../../helpers/createWidget';
 import url from '../../../helpers/getPageUrl';
+import { checkOptions } from './axe_options';
 
 fixture.disablePageReloads`a11y - appointment`
   .page(url(__dirname, '../../container.html'));
@@ -14,6 +16,8 @@ fixture.disablePageReloads`a11y - appointment`
         scheduler.getAppointment('App 1').element.attributes['aria-label'],
       )
       .eql(undefined);
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       dataSource: [{
@@ -34,6 +38,8 @@ fixture.disablePageReloads`a11y - appointment`
     await t
       .expect(attrs['aria-roledescription'])
       .eql('February 1, 2021, Group: resource1, ');
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       dataSource: [{
@@ -65,6 +71,8 @@ fixture.disablePageReloads`a11y - appointment`
     await t
       .expect(attrs['aria-roledescription'])
       .eql('February 1, 2021, Group: resource11, resource21, ');
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       dataSource: [{
@@ -103,6 +111,8 @@ fixture.disablePageReloads`a11y - appointment`
     await t
       .expect(recurrenceIcon.getAttribute('aria-label'))
       .eql('Recurring appointment');
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       timeZone: 'America/Los_Angeles',
@@ -123,14 +133,21 @@ fixture.disablePageReloads`a11y - appointment`
   test('appointments should have right role', async (t) => {
     const scheduler = new Scheduler('#container');
     const appt = scheduler.getAppointment('Website Re-Design Plan');
+    const contentId = await appt.element.find('.dx-scheduler-appointment-content').getAttribute('id');
 
     await t
       .expect(appt.element.getAttribute('role'))
       .eql('application');
 
+    await t
+      .expect(appt.element.getAttribute('aria-describedby'))
+      .eql(contentId);
+
     await t
       .expect(appt.element.getAttribute('aria-activedescendant'))
       .eql(null);
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       timeZone: 'America/Los_Angeles',
@@ -186,6 +203,8 @@ fixture.disablePageReloads`a11y - appointment`
     await t.expect(apptLabels[0]).eql(labels[0]);
     await t.expect(apptLabels[1]).eql(labels[1]);
     await t.expect(apptLabels[2]).eql(labels[2]);
+
+    await a11yCheck(t, checkOptions, '#container');
   }).before(async () => {
     await createWidget('dxScheduler', {
       dataSource: [{
@@ -252,6 +271,8 @@ test('appointments & collector buttons can be navigated', async (t) => {
   await t.expect(
     scheduler.appointmentTooltip.element.count,
   ).eql(1);
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     dataSource: [
@@ -301,6 +322,8 @@ test('Scheduler a11y: Disabled time ranges are not supported', async (t) => {
     .eql(expectedAriaLabels.prev)
     .expect(actualNextAriaLabel)
     .eql(expectedAriaLabels.next);
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     dataSource: [
@@ -322,6 +345,8 @@ test('Scheduler a11y: appointments does not have info about reccurence', async (
   await t
     .expect(recurrenceIcon.getAttribute('aria-label'))
     .eql('Recurring appointment');
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     timeZone: 'America/Los_Angeles',
@@ -350,6 +375,8 @@ test('Scheduler a11y: Appointment collector button doesn\'t have info about date
     .ok()
     .expect(schedulerCollector.element().getAttribute('aria-roledescription'))
     .contains(dateText);
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     timeZone: 'America/Los_Angeles',
@@ -387,6 +414,8 @@ test('appointment aria label should contain date with right timezone', async (t)
   await t
     .expect(appt.element.getAttribute('aria-roledescription'))
     .eql('March 29, 2021, ');
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     timeZone: 'America/Los_Angeles',
diff --git a/e2e/testcafe-devextreme/tests/scheduler/a11y/axe_options.ts b/e2e/testcafe-devextreme/tests/scheduler/a11y/axe_options.ts
new file mode 100644
index 000000000000..5489ea69e9b9
--- /dev/null
+++ b/e2e/testcafe-devextreme/tests/scheduler/a11y/axe_options.ts
@@ -0,0 +1,5 @@
+export const checkOptions = {
+  rules: {
+    'color-contrast': { enabled: false },
+  },
+};
diff --git a/e2e/testcafe-devextreme/tests/scheduler/a11y/scheduler.ts b/e2e/testcafe-devextreme/tests/scheduler/a11y/scheduler.ts
index bbc98cc334b4..8105a2509771 100644
--- a/e2e/testcafe-devextreme/tests/scheduler/a11y/scheduler.ts
+++ b/e2e/testcafe-devextreme/tests/scheduler/a11y/scheduler.ts
@@ -3,16 +3,11 @@ import { a11yCheck } from '../../../helpers/accessibility/utils';
 import { createWidget } from '../../../helpers/createWidget';
 import url from '../../../helpers/getPageUrl';
 import { changeTheme } from '../../../helpers/changeTheme';
+import { checkOptions } from './axe_options';
 
 fixture.disablePageReloads`a11y - appointment`
   .page(url(__dirname, '../../container.html'));
 
-const checkOptions = {
-  rules: {
-    'color-contrast': { enabled: false },
-  },
-};
-
 test('Scheduler should have right aria attributes', async (t) => {
   const scheduler = new Scheduler('#container');
 
@@ -29,6 +24,8 @@ test('Scheduler should have right aria attributes', async (t) => {
   await t.expect(
     scheduler.element.getAttribute('aria-label'),
   ).eql('Scheduler. Week view');
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     dataSource: [],
@@ -47,6 +44,8 @@ test('Scheduler table elements have right aria attributes', async (t) => {
       tables.nth(i).getAttribute('aria-hidden'),
     ).eql('true');
   }
+
+  await a11yCheck(t, checkOptions, '#container');
 }).before(async () => {
   await createWidget('dxScheduler', {
     dataSource: [],
diff --git a/e2e/testcafe-devextreme/tests/treeList/etalons/T1053931-material.blue.light.png b/e2e/testcafe-devextreme/tests/treeList/etalons/T1053931-material.blue.light.png
index d6b2bc3c6728..7516b6d73cfe 100644
Binary files a/e2e/testcafe-devextreme/tests/treeList/etalons/T1053931-material.blue.light.png and b/e2e/testcafe-devextreme/tests/treeList/etalons/T1053931-material.blue.light.png differ
diff --git a/e2e/testcafe-devextreme/tests/treeList/etalons/T1054312-material.blue.light.png b/e2e/testcafe-devextreme/tests/treeList/etalons/T1054312-material.blue.light.png
index 67b5ba1143d8..a17cb90a9df0 100644
Binary files a/e2e/testcafe-devextreme/tests/treeList/etalons/T1054312-material.blue.light.png and b/e2e/testcafe-devextreme/tests/treeList/etalons/T1054312-material.blue.light.png differ
diff --git a/package.json b/package.json
index 4bbc346a3036..054fd5899a65 100644
--- a/package.json
+++ b/package.json
@@ -44,7 +44,7 @@
     "axe-core": "4.10.2",
     "cheerio": "1.0.0-rc.10",
     "codelyzer": "6.0.2",
-    "devextreme-internal-tools": "16.0.0-beta.16",
+    "devextreme-internal-tools": "16.0.0-beta.18",
     "http-server": "14.1.1",
     "husky": "8.0.3",
     "jest": "29.7.0",
diff --git a/packages/devextreme-angular/.gitignore b/packages/devextreme-angular/.gitignore
index 24b093125678..850a120dc4da 100644
--- a/packages/devextreme-angular/.gitignore
+++ b/packages/devextreme-angular/.gitignore
@@ -1,2 +1 @@
 metadata
-!metadata/DeprecatedComponentsMetadata.json
diff --git a/packages/devextreme-angular/build.config.js b/packages/devextreme-angular/build.config.js
index 5512130fa7cb..d338e587bd20 100644
--- a/packages/devextreme-angular/build.config.js
+++ b/packages/devextreme-angular/build.config.js
@@ -3,7 +3,6 @@ module.exports = {
         metadataGenerator: {
             sourceMetadataFilePath: './metadata/NGMetaData.json',
             imdMetadataFilePath: './metadata/integration-data.json',
-            deprecatedMetadataFilePath: './metadata/DeprecatedComponentsMetadata.json',
             outputFolderPath: './metadata/generated',
             nestedPathPart: 'nested',
             basePathPart: 'base',
diff --git a/packages/devextreme-angular/metadata/DeprecatedComponentsMetadata.json b/packages/devextreme-angular/metadata/DeprecatedComponentsMetadata.json
deleted file mode 100644
index 0fd85dc51724..000000000000
--- a/packages/devextreme-angular/metadata/DeprecatedComponentsMetadata.json
+++ /dev/null
@@ -1,394 +0,0 @@
-{
-  "Widgets": {
-    "dxPivotGrid": {
-      "Options": {
-        "dataSource": {
-          "ComplexTypes": [
-            "PivotGridDataSource"
-          ]
-        }
-      }
-    }
-  },
-  "ExtraObjects": {
-    "PivotGridDataSource": {
-      "Description": "An object that provides access to data for the PivotGrid widget.",
-      "Module": "ui/pivot_grid/data_source",
-      "Options": {
-        "fields": {
-          "ItemPrimitiveTypes": [
-            "any"
-          ],
-          "IsCollection": true,
-          "SingularName": "field",
-          "Description": "An array of pivot grid fields.",
-          "Options": {
-            "allowCrossGroupCalculation": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether to allow the predefined summary post-processing functions ('absoluteVariation' and 'percentVariation') and runningTotal to take values of different groups into account."
-            },
-            "allowExpandAll": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Allows an end-user to expand/collapse all header items within a header level."
-            },
-            "allowFiltering": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Allows a user to filter fields by selecting or deselecting values in the popup menu."
-            },
-            "allowSorting": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Allows an end-user to change sorting options."
-            },
-            "allowSortingBySummary": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Allows an end-user to sort columns by summary values."
-            },
-            "area": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Type of the area where the field is located."
-            },
-            "areaIndex": {
-              "PrimitiveTypes": [
-                "number"
-              ],
-              "Description": "Index among the other fields displayed within the same area."
-            },
-            "calculateCustomSummary": {
-              "PrimitiveTypes": [
-                "Function"
-              ],
-              "IsFunc": true,
-              "Description": "Allows you to use a custom aggregate function to calculate the summary values. Cannot be used for the XmlaStore store type."
-            },
-            "calculateSummaryValue": {
-              "PrimitiveTypes": [
-                "Function"
-              ],
-              "IsFunc": true,
-              "Description": "Specifies a callback function that allows you to modify summary values after they are calculated."
-            },
-            "caption": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "A caption that will be displayed in the pivot grid's field chooser and field panel to identify the field."
-            },
-            "customizeText": {
-              "PrimitiveTypes": [
-                "Function"
-              ],
-              "IsFunc": true,
-              "Description": "Specifies a callback function that returns the text to be displayed in the cells of a field."
-            },
-            "dataField": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Name of the data source field containing data for the pivot grid field."
-            },
-            "dataType": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies a type of field values."
-            },
-            "displayFolder": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "The name of the folder in which the field is located."
-            },
-            "expanded": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Indicates whether all header items of the field's header level are expanded."
-            },
-            "filterType": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies whether a user can change the current filter by including (selecting) or excluding (clearing the selection) values. Applies only if allowFiltering is true."
-            },
-            "filterValues": {
-              "ItemPrimitiveTypes": [
-                "any"
-              ],
-              "IsCollection": true,
-              "SingularName": "filterValue",
-              "Description": "Specifies by which values the field is filtered."
-            },
-            "format": {
-              "PrimitiveTypes": [
-                "format",
-                "string"
-              ],
-              "ComplexTypes": [
-                "Format"
-              ],
-              "TypeImports": [
-                {
-                  "Name": "format",
-                  "Path": "ui/widget/ui.widget"
-                }
-              ],
-              "Description": "Specifies a display format for field values."
-            },
-            "groupIndex": {
-              "PrimitiveTypes": [
-                "number"
-              ],
-              "Description": "The index of the field within a group."
-            },
-            "groupInterval": {
-              "PrimitiveTypes": [
-                "number",
-                "string"
-              ],
-              "Description": "Specifies how the values of the current field are combined into groups. Cannot be used for the XmlaStore store type."
-            },
-            "groupName": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "The name of the group to which the field belongs."
-            },
-            "headerFilter": {
-              "Description": "Configures the header filter feature.",
-              "Options": {
-                "allowSearch": {
-                  "PrimitiveTypes": [
-                    "boolean"
-                  ],
-                  "Description": "Specifies whether searching is enabled in the header filter."
-                },
-                "height": {
-                  "PrimitiveTypes": [
-                    "number"
-                  ],
-                  "Description": "Specifies the height of the popup menu containing filtering values."
-                },
-                "width": {
-                  "PrimitiveTypes": [
-                    "number"
-                  ],
-                  "Description": "Specifies the width of the popup menu containing filtering values."
-                }
-              }
-            },
-            "isMeasure": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether the field should be treated as a Data Field."
-            },
-            "precision": {
-              "PrimitiveTypes": [
-                "number"
-              ],
-              "IsDeprecated": true,
-              "Description": "Use the format.precision option instead."
-            },
-            "runningTotal": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies whether to summarize each next summary value with the previous one by rows or columns."
-            },
-            "selector": {
-              "PrimitiveTypes": [
-                "Function"
-              ],
-              "IsFunc": true,
-              "Description": "Specifies the function that determines how to split data from the data source into ranges for header items. Cannot be used for the XmlaStore store type and along with remote operations."
-            },
-            "showGrandTotals": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether or not to display Grand Total values for the field."
-            },
-            "showTotals": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether or not to display Total values for the field."
-            },
-            "showValues": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether or not to display summary values. Applies only to the fields whose area is \"data\". Inherits the value of showTotals by default."
-            },
-            "sortBy": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies how field data should be sorted. Can be used for the XmlaStore store type only."
-            },
-            "sortBySummaryField": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Sorts the header items of this field by the summary values of another field."
-            },
-            "sortBySummaryPath": {
-              "ItemPrimitiveTypes": [
-                "number",
-                "string"
-              ],
-              "IsCollection": true,
-              "SingularName": "sortBySummaryPath",
-              "Description": "The array of field names that specify a path to column/row whose summary field is used for sorting of this field's header items."
-            },
-            "sortingMethod": {
-              "PrimitiveTypes": [
-                "Function"
-              ],
-              "IsFunc": true,
-              "Description": "Specifies how to sort header items."
-            },
-            "sortOrder": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies the sort order of field values."
-            },
-            "summaryDisplayMode": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies the summary post-processing algorithm."
-            },
-            "summaryType": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies how to aggregate field data. Cannot be used for the XmlaStore store type."
-            },
-            "visible": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "A boolean value specifying whether or not the field is visible in the pivot grid and the Field Chooser."
-            },
-            "width": {
-              "PrimitiveTypes": [
-                "number"
-              ],
-              "Description": "Specifies the absolute width of the field in the pivot grid."
-            },
-            "wordWrapEnabled": {
-              "PrimitiveTypes": [
-                "boolean"
-              ],
-              "Description": "Specifies whether or not long text in header items should be wrapped."
-            }
-          }
-        },
-        "filter": {
-          "PrimitiveTypes": [
-            "any"
-          ],
-          "IsFilterExpr": true,
-          "Description": "Specifies data filtering conditions. Cannot be used for the XmlaStore store type."
-        },
-        "onChanged": {
-          "PrimitiveTypes": [
-            "Function"
-          ],
-          "IsFunc": true,
-          "IsEvent": true,
-          "Description": "A handler for the changed event."
-        },
-        "onFieldsPrepared": {
-          "PrimitiveTypes": [
-            "Function"
-          ],
-          "IsFunc": true,
-          "IsEvent": true,
-          "Description": "A handler for the fieldsPrepared event."
-        },
-        "onLoadError": {
-          "PrimitiveTypes": [
-            "Function"
-          ],
-          "IsFunc": true,
-          "IsEvent": true,
-          "Description": "A handler for the loadError event."
-        },
-        "onLoadingChanged": {
-          "PrimitiveTypes": [
-            "Function"
-          ],
-          "IsFunc": true,
-          "IsEvent": true,
-          "Description": "A handler for the loadingChanged event."
-        },
-        "remoteOperations": {
-          "PrimitiveTypes": [
-            "boolean"
-          ],
-          "Description": "Specifies whether or not all the operations (filtering, grouping and summary calculation) are performed remotely."
-        },
-        "retrieveFields": {
-          "PrimitiveTypes": [
-            "boolean"
-          ],
-          "Description": "Indicates whether or not the automatic field generation from data in the Store is enabled."
-        },
-        "store": {
-          "PrimitiveTypes": [
-            "Store",
-            "StoreOptions",
-            "XmlaStore",
-            "XmlaStoreOptions"
-          ],
-          "ItemPrimitiveTypes": [
-            "any"
-          ],
-          "TypeImports": [
-            {
-              "Name": "Store",
-              "Path": "data"
-            },
-            {
-              "Name": "StoreOptions",
-              "Path": "data"
-            },
-            {
-              "Name": "default",
-              "Alias": "XmlaStore",
-              "Path": "ui/pivot_grid/xmla_store"
-            },
-            {
-              "Name": "XmlaStoreOptions",
-              "Path": "ui/pivot_grid/xmla_store"
-            }
-          ],
-          "Description": "Specifies the underlying Store instance used to access data.",
-          "Options": {
-            "type": {
-              "PrimitiveTypes": [
-                "string"
-              ],
-              "Description": "Specifies the type of the store used to access data."
-            }
-          }
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/packages/devextreme-angular/src/ui/nested/base/filter-builder-field-dxi.ts b/packages/devextreme-angular/src/ui/nested/base/filter-builder-field-dxi.ts
index 2be58f7a5be1..0ce11e619bab 100644
--- a/packages/devextreme-angular/src/ui/nested/base/filter-builder-field-dxi.ts
+++ b/packages/devextreme-angular/src/ui/nested/base/filter-builder-field-dxi.ts
@@ -10,7 +10,6 @@ import { Store } from 'devextreme/data';
 import { Options as DataSourceOptions } from 'devextreme/data/data_source';
 import { Format } from 'devextreme/localization';
 import { FilterBuilderOperation } from 'devextreme/ui/filter_builder';
-import { format } from 'devextreme/ui/widget/ui.widget';
 
 @Component({
     template: ''
@@ -44,10 +43,10 @@ export abstract class DxiFilterBuilderField extends CollectionNestedOption {
         this._setOption('dataField', value);
     }
 
-    get dataType(): DataType | string {
+    get dataType(): DataType {
         return this._getOption('dataType');
     }
-    set dataType(value: DataType | string) {
+    set dataType(value: DataType) {
         this._setOption('dataType', value);
     }
 
@@ -79,10 +78,10 @@ export abstract class DxiFilterBuilderField extends CollectionNestedOption {
         this._setOption('filterOperations', value);
     }
 
-    get format(): Format | string | format {
+    get format(): Format | string {
         return this._getOption('format');
     }
-    set format(value: Format | string | format) {
+    set format(value: Format | string) {
         this._setOption('format', value);
     }
 
@@ -106,242 +105,4 @@ export abstract class DxiFilterBuilderField extends CollectionNestedOption {
     set trueText(value: string) {
         this._setOption('trueText', value);
     }
-
-    get allowCrossGroupCalculation(): boolean {
-        return this._getOption('allowCrossGroupCalculation');
-    }
-    set allowCrossGroupCalculation(value: boolean) {
-        this._setOption('allowCrossGroupCalculation', value);
-    }
-
-    get allowExpandAll(): boolean {
-        return this._getOption('allowExpandAll');
-    }
-    set allowExpandAll(value: boolean) {
-        this._setOption('allowExpandAll', value);
-    }
-
-    get allowFiltering(): boolean {
-        return this._getOption('allowFiltering');
-    }
-    set allowFiltering(value: boolean) {
-        this._setOption('allowFiltering', value);
-    }
-
-    get allowSorting(): boolean {
-        return this._getOption('allowSorting');
-    }
-    set allowSorting(value: boolean) {
-        this._setOption('allowSorting', value);
-    }
-
-    get allowSortingBySummary(): boolean {
-        return this._getOption('allowSortingBySummary');
-    }
-    set allowSortingBySummary(value: boolean) {
-        this._setOption('allowSortingBySummary', value);
-    }
-
-    get area(): string {
-        return this._getOption('area');
-    }
-    set area(value: string) {
-        this._setOption('area', value);
-    }
-
-    get areaIndex(): number {
-        return this._getOption('areaIndex');
-    }
-    set areaIndex(value: number) {
-        this._setOption('areaIndex', value);
-    }
-
-    get calculateCustomSummary(): Function {
-        return this._getOption('calculateCustomSummary');
-    }
-    set calculateCustomSummary(value: Function) {
-        this._setOption('calculateCustomSummary', value);
-    }
-
-    get calculateSummaryValue(): Function {
-        return this._getOption('calculateSummaryValue');
-    }
-    set calculateSummaryValue(value: Function) {
-        this._setOption('calculateSummaryValue', value);
-    }
-
-    get displayFolder(): string {
-        return this._getOption('displayFolder');
-    }
-    set displayFolder(value: string) {
-        this._setOption('displayFolder', value);
-    }
-
-    get expanded(): boolean {
-        return this._getOption('expanded');
-    }
-    set expanded(value: boolean) {
-        this._setOption('expanded', value);
-    }
-
-    get filterType(): string {
-        return this._getOption('filterType');
-    }
-    set filterType(value: string) {
-        this._setOption('filterType', value);
-    }
-
-    get filterValues(): Array<any> {
-        return this._getOption('filterValues');
-    }
-    set filterValues(value: Array<any>) {
-        this._setOption('filterValues', value);
-    }
-
-    get groupIndex(): number {
-        return this._getOption('groupIndex');
-    }
-    set groupIndex(value: number) {
-        this._setOption('groupIndex', value);
-    }
-
-    get groupInterval(): number | string {
-        return this._getOption('groupInterval');
-    }
-    set groupInterval(value: number | string) {
-        this._setOption('groupInterval', value);
-    }
-
-    get groupName(): string {
-        return this._getOption('groupName');
-    }
-    set groupName(value: string) {
-        this._setOption('groupName', value);
-    }
-
-    get headerFilter(): { allowSearch?: boolean, height?: number, width?: number } {
-        return this._getOption('headerFilter');
-    }
-    set headerFilter(value: { allowSearch?: boolean, height?: number, width?: number }) {
-        this._setOption('headerFilter', value);
-    }
-
-    get isMeasure(): boolean {
-        return this._getOption('isMeasure');
-    }
-    set isMeasure(value: boolean) {
-        this._setOption('isMeasure', value);
-    }
-
-    get precision(): number {
-        return this._getOption('precision');
-    }
-    set precision(value: number) {
-        this._setOption('precision', value);
-    }
-
-    get runningTotal(): string {
-        return this._getOption('runningTotal');
-    }
-    set runningTotal(value: string) {
-        this._setOption('runningTotal', value);
-    }
-
-    get selector(): Function {
-        return this._getOption('selector');
-    }
-    set selector(value: Function) {
-        this._setOption('selector', value);
-    }
-
-    get showGrandTotals(): boolean {
-        return this._getOption('showGrandTotals');
-    }
-    set showGrandTotals(value: boolean) {
-        this._setOption('showGrandTotals', value);
-    }
-
-    get showTotals(): boolean {
-        return this._getOption('showTotals');
-    }
-    set showTotals(value: boolean) {
-        this._setOption('showTotals', value);
-    }
-
-    get showValues(): boolean {
-        return this._getOption('showValues');
-    }
-    set showValues(value: boolean) {
-        this._setOption('showValues', value);
-    }
-
-    get sortBy(): string {
-        return this._getOption('sortBy');
-    }
-    set sortBy(value: string) {
-        this._setOption('sortBy', value);
-    }
-
-    get sortBySummaryField(): string {
-        return this._getOption('sortBySummaryField');
-    }
-    set sortBySummaryField(value: string) {
-        this._setOption('sortBySummaryField', value);
-    }
-
-    get sortBySummaryPath(): Array<number | string> {
-        return this._getOption('sortBySummaryPath');
-    }
-    set sortBySummaryPath(value: Array<number | string>) {
-        this._setOption('sortBySummaryPath', value);
-    }
-
-    get sortingMethod(): Function {
-        return this._getOption('sortingMethod');
-    }
-    set sortingMethod(value: Function) {
-        this._setOption('sortingMethod', value);
-    }
-
-    get sortOrder(): string {
-        return this._getOption('sortOrder');
-    }
-    set sortOrder(value: string) {
-        this._setOption('sortOrder', value);
-    }
-
-    get summaryDisplayMode(): string {
-        return this._getOption('summaryDisplayMode');
-    }
-    set summaryDisplayMode(value: string) {
-        this._setOption('summaryDisplayMode', value);
-    }
-
-    get summaryType(): string {
-        return this._getOption('summaryType');
-    }
-    set summaryType(value: string) {
-        this._setOption('summaryType', value);
-    }
-
-    get visible(): boolean {
-        return this._getOption('visible');
-    }
-    set visible(value: boolean) {
-        this._setOption('visible', value);
-    }
-
-    get width(): number {
-        return this._getOption('width');
-    }
-    set width(value: number) {
-        this._setOption('width', value);
-    }
-
-    get wordWrapEnabled(): boolean {
-        return this._getOption('wordWrapEnabled');
-    }
-    set wordWrapEnabled(value: boolean) {
-        this._setOption('wordWrapEnabled', value);
-    }
 }
diff --git a/packages/devextreme-angular/src/ui/nested/base/index.ts b/packages/devextreme-angular/src/ui/nested/base/index.ts
index a6e272d7e18a..0f0a3b1e3d89 100644
--- a/packages/devextreme-angular/src/ui/nested/base/index.ts
+++ b/packages/devextreme-angular/src/ui/nested/base/index.ts
@@ -41,7 +41,6 @@ export * from './html-editor-table-context-menu';
 export * from './html-editor-table-resizing';
 export * from './html-editor-variables';
 export * from './pager';
-export * from './pivot-grid-data-source';
 export * from './popup-options';
 export * from './position-config';
 export * from './scheduler-scrolling';
diff --git a/packages/devextreme-angular/src/ui/nested/base/pivot-grid-data-source.ts b/packages/devextreme-angular/src/ui/nested/base/pivot-grid-data-source.ts
deleted file mode 100644
index 2443dd1f19ad..000000000000
--- a/packages/devextreme-angular/src/ui/nested/base/pivot-grid-data-source.ts
+++ /dev/null
@@ -1,78 +0,0 @@
-/* tslint:disable:max-line-length */
-
-import { NestedOption } from 'devextreme-angular/core';
-import {
-    Component,
-} from '@angular/core';
-
-import { Store, StoreOptions } from 'devextreme/data';
-import XmlaStore, { XmlaStoreOptions } from 'devextreme/ui/pivot_grid/xmla_store';
-import { format } from 'devextreme/ui/widget/ui.widget';
-
-@Component({
-    template: ''
-})
-export abstract class DxoPivotGridDataSource extends NestedOption {
-    get fields(): Array<any | { allowCrossGroupCalculation?: boolean, allowExpandAll?: boolean, allowFiltering?: boolean, allowSorting?: boolean, allowSortingBySummary?: boolean, area?: string, areaIndex?: number, calculateCustomSummary?: Function, calculateSummaryValue?: Function, caption?: string, customizeText?: Function, dataField?: string, dataType?: string, displayFolder?: string, expanded?: boolean, filterType?: string, filterValues?: Array<any>, format?: format | string, groupIndex?: number, groupInterval?: number | string, groupName?: string, headerFilter?: { allowSearch?: boolean, height?: number, width?: number }, isMeasure?: boolean, precision?: number, runningTotal?: string, selector?: Function, showGrandTotals?: boolean, showTotals?: boolean, showValues?: boolean, sortBy?: string, sortBySummaryField?: string, sortBySummaryPath?: Array<number | string>, sortingMethod?: Function, sortOrder?: string, summaryDisplayMode?: string, summaryType?: string, visible?: boolean, width?: number, wordWrapEnabled?: boolean }> {
-        return this._getOption('fields');
-    }
-    set fields(value: Array<any | { allowCrossGroupCalculation?: boolean, allowExpandAll?: boolean, allowFiltering?: boolean, allowSorting?: boolean, allowSortingBySummary?: boolean, area?: string, areaIndex?: number, calculateCustomSummary?: Function, calculateSummaryValue?: Function, caption?: string, customizeText?: Function, dataField?: string, dataType?: string, displayFolder?: string, expanded?: boolean, filterType?: string, filterValues?: Array<any>, format?: format | string, groupIndex?: number, groupInterval?: number | string, groupName?: string, headerFilter?: { allowSearch?: boolean, height?: number, width?: number }, isMeasure?: boolean, precision?: number, runningTotal?: string, selector?: Function, showGrandTotals?: boolean, showTotals?: boolean, showValues?: boolean, sortBy?: string, sortBySummaryField?: string, sortBySummaryPath?: Array<number | string>, sortingMethod?: Function, sortOrder?: string, summaryDisplayMode?: string, summaryType?: string, visible?: boolean, width?: number, wordWrapEnabled?: boolean }>) {
-        this._setOption('fields', value);
-    }
-
-    get filter(): any {
-        return this._getOption('filter');
-    }
-    set filter(value: any) {
-        this._setOption('filter', value);
-    }
-
-    get onChanged(): Function {
-        return this._getOption('onChanged');
-    }
-    set onChanged(value: Function) {
-        this._setOption('onChanged', value);
-    }
-
-    get onFieldsPrepared(): Function {
-        return this._getOption('onFieldsPrepared');
-    }
-    set onFieldsPrepared(value: Function) {
-        this._setOption('onFieldsPrepared', value);
-    }
-
-    get onLoadError(): Function {
-        return this._getOption('onLoadError');
-    }
-    set onLoadError(value: Function) {
-        this._setOption('onLoadError', value);
-    }
-
-    get onLoadingChanged(): Function {
-        return this._getOption('onLoadingChanged');
-    }
-    set onLoadingChanged(value: Function) {
-        this._setOption('onLoadingChanged', value);
-    }
-
-    get remoteOperations(): boolean {
-        return this._getOption('remoteOperations');
-    }
-    set remoteOperations(value: boolean) {
-        this._setOption('remoteOperations', value);
-    }
-
-    get retrieveFields(): boolean {
-        return this._getOption('retrieveFields');
-    }
-    set retrieveFields(value: boolean) {
-        this._setOption('retrieveFields', value);
-    }
-
-    get store(): Store | StoreOptions | XmlaStore | XmlaStoreOptions | { type?: string } | Array<any> {
-        return this._getOption('store');
-    }
-    set store(value: Store | StoreOptions | XmlaStore | XmlaStoreOptions | { type?: string } | Array<any>) {
-        this._setOption('store', value);
-    }
-}
diff --git a/packages/devextreme-angular/src/ui/nested/base/user-dxi.ts b/packages/devextreme-angular/src/ui/nested/base/user-dxi.ts
index 42185f061230..8a49fc7cfcf7 100644
--- a/packages/devextreme-angular/src/ui/nested/base/user-dxi.ts
+++ b/packages/devextreme-angular/src/ui/nested/base/user-dxi.ts
@@ -7,6 +7,7 @@ import {
 
 
 @Component({
+    selector: 'base-dxi-user',
     template: ''
 })
 export abstract class DxiUser extends CollectionNestedOption {
diff --git a/packages/devextreme-angular/src/ui/nested/data-source.ts b/packages/devextreme-angular/src/ui/nested/data-source.ts
deleted file mode 100644
index 3ba5bd94434d..000000000000
--- a/packages/devextreme-angular/src/ui/nested/data-source.ts
+++ /dev/null
@@ -1,93 +0,0 @@
-/* tslint:disable:max-line-length */
-
-/* tslint:disable:use-input-property-decorator */
-
-import {
-    Component,
-    OnInit,
-    OnDestroy,
-    NgModule,
-    Host,
-    SkipSelf,
-    ContentChildren,
-    forwardRef,
-    QueryList
-} from '@angular/core';
-
-
-
-
-
-import {
-    NestedOptionHost,
-} from 'devextreme-angular/core';
-import { DxoPivotGridDataSource } from './base/pivot-grid-data-source';
-import { DxiFieldComponent } from './field-dxi';
-
-
-@Component({
-    selector: 'dxo-data-source',
-    template: '',
-    styles: [''],
-    providers: [NestedOptionHost],
-    inputs: [
-        'fields',
-        'filter',
-        'onChanged',
-        'onFieldsPrepared',
-        'onLoadError',
-        'onLoadingChanged',
-        'remoteOperations',
-        'retrieveFields',
-        'store'
-    ]
-})
-export class DxoDataSourceComponent extends DxoPivotGridDataSource implements OnDestroy, OnInit  {
-
-    protected get _optionPath() {
-        return 'dataSource';
-    }
-
-
-    @ContentChildren(forwardRef(() => DxiFieldComponent))
-    get fieldsChildren(): QueryList<DxiFieldComponent> {
-        return this._getOption('fields');
-    }
-    set fieldsChildren(value) {
-        this.setChildren('fields', value);
-    }
-
-    constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
-            @Host() optionHost: NestedOptionHost) {
-        super();
-        parentOptionHost.setNestedOption(this);
-        optionHost.setHost(this, this._fullOptionPath.bind(this));
-        if ((console) && (console.warn)) {
-            console.warn('The nested \'dxo-data-source\' component is deprecated in 17.2. ' +
-                'Use the \'dataSource\' option instead. ' +
-                'See:\nhttps://github.com/DevExpress/devextreme-angular/blob/master/CHANGELOG.md#17.2.3'
-            );
-        }
-    }
-
-
-    ngOnInit() {
-        this._addRecreatedComponent();
-    }
-
-    ngOnDestroy() {
-        this._addRemovedOption(this._getOptionPath());
-    }
-
-
-}
-
-@NgModule({
-  declarations: [
-    DxoDataSourceComponent
-  ],
-  exports: [
-    DxoDataSourceComponent
-  ],
-})
-export class DxoDataSourceModule { }
diff --git a/packages/devextreme-angular/src/ui/nested/field-dxi.ts b/packages/devextreme-angular/src/ui/nested/field-dxi.ts
index ed2429d0ad35..9347c02c85c0 100644
--- a/packages/devextreme-angular/src/ui/nested/field-dxi.ts
+++ b/packages/devextreme-angular/src/ui/nested/field-dxi.ts
@@ -37,41 +37,7 @@ import { DxiFilterBuilderField } from './base/filter-builder-field-dxi';
         'format',
         'lookup',
         'name',
-        'trueText',
-        'allowCrossGroupCalculation',
-        'allowExpandAll',
-        'allowFiltering',
-        'allowSorting',
-        'allowSortingBySummary',
-        'area',
-        'areaIndex',
-        'calculateCustomSummary',
-        'calculateSummaryValue',
-        'displayFolder',
-        'expanded',
-        'filterType',
-        'filterValues',
-        'groupIndex',
-        'groupInterval',
-        'groupName',
-        'headerFilter',
-        'isMeasure',
-        'precision',
-        'runningTotal',
-        'selector',
-        'showGrandTotals',
-        'showTotals',
-        'showValues',
-        'sortBy',
-        'sortBySummaryField',
-        'sortBySummaryPath',
-        'sortingMethod',
-        'sortOrder',
-        'summaryDisplayMode',
-        'summaryType',
-        'visible',
-        'width',
-        'wordWrapEnabled'
+        'trueText'
     ]
 })
 export class DxiFieldComponent extends DxiFilterBuilderField {
diff --git a/packages/devextreme-angular/src/ui/nested/index.ts b/packages/devextreme-angular/src/ui/nested/index.ts
index 5760fc26e23e..7c291f7dc04e 100644
--- a/packages/devextreme-angular/src/ui/nested/index.ts
+++ b/packages/devextreme-angular/src/ui/nested/index.ts
@@ -56,7 +56,6 @@ export * from './cursor-offset';
 export * from './custom-operation-dxi';
 export * from './custom-shape-dxi';
 export * from './data-prepare-settings';
-export * from './data-source';
 export * from './day-header-format';
 export * from './default-item-properties';
 export * from './delay';
@@ -207,7 +206,6 @@ export * from './state-storing';
 export * from './steparea';
 export * from './stepline';
 export * from './stock';
-export * from './store';
 export * from './strip-dxi';
 export * from './strip-line-dxi';
 export * from './strip-style';
diff --git a/packages/devextreme-angular/src/ui/nested/store.ts b/packages/devextreme-angular/src/ui/nested/store.ts
deleted file mode 100644
index 7f4d94fbfdc6..000000000000
--- a/packages/devextreme-angular/src/ui/nested/store.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-/* tslint:disable:max-line-length */
-
-
-import {
-    Component,
-    OnInit,
-    OnDestroy,
-    NgModule,
-    Host,
-    SkipSelf,
-    Input
-} from '@angular/core';
-
-
-
-
-
-import {
-    NestedOptionHost,
-} from 'devextreme-angular/core';
-import { NestedOption } from 'devextreme-angular/core';
-
-
-@Component({
-    selector: 'dxo-store',
-    template: '',
-    styles: [''],
-    providers: [NestedOptionHost]
-})
-export class DxoStoreComponent extends NestedOption implements OnDestroy, OnInit  {
-    @Input()
-    get type(): string {
-        return this._getOption('type');
-    }
-    set type(value: string) {
-        this._setOption('type', value);
-    }
-
-
-    protected get _optionPath() {
-        return 'store';
-    }
-
-
-    constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
-            @Host() optionHost: NestedOptionHost) {
-        super();
-        parentOptionHost.setNestedOption(this);
-        optionHost.setHost(this, this._fullOptionPath.bind(this));
-    }
-
-
-    ngOnInit() {
-        this._addRecreatedComponent();
-    }
-
-    ngOnDestroy() {
-        this._addRemovedOption(this._getOptionPath());
-    }
-
-
-}
-
-@NgModule({
-  declarations: [
-    DxoStoreComponent
-  ],
-  exports: [
-    DxoStoreComponent
-  ],
-})
-export class DxoStoreModule { }
diff --git a/packages/devextreme-angular/src/ui/pivot-grid/index.ts b/packages/devextreme-angular/src/ui/pivot-grid/index.ts
index 5358e15f587d..bf37de7fa9af 100644
--- a/packages/devextreme-angular/src/ui/pivot-grid/index.ts
+++ b/packages/devextreme-angular/src/ui/pivot-grid/index.ts
@@ -39,15 +39,11 @@ import {
     WatcherHelper
 } from 'devextreme-angular/core';
 
-import { DxoDataSourceModule } from 'devextreme-angular/ui/nested';
-import { DxiFieldModule } from 'devextreme-angular/ui/nested';
-import { DxoFormatModule } from 'devextreme-angular/ui/nested';
-import { DxoHeaderFilterModule } from 'devextreme-angular/ui/nested';
-import { DxoStoreModule } from 'devextreme-angular/ui/nested';
 import { DxoExportModule } from 'devextreme-angular/ui/nested';
 import { DxoFieldChooserModule } from 'devextreme-angular/ui/nested';
 import { DxoTextsModule } from 'devextreme-angular/ui/nested';
 import { DxoFieldPanelModule } from 'devextreme-angular/ui/nested';
+import { DxoHeaderFilterModule } from 'devextreme-angular/ui/nested';
 import { DxoSearchModule } from 'devextreme-angular/ui/nested';
 import { DxoLoadPanelModule } from 'devextreme-angular/ui/nested';
 import { DxoScrollingModule } from 'devextreme-angular/ui/nested';
@@ -893,15 +889,11 @@ export class DxPivotGridComponent extends DxComponent implements OnDestroy, OnCh
 
 @NgModule({
   imports: [
-    DxoDataSourceModule,
-    DxiFieldModule,
-    DxoFormatModule,
-    DxoHeaderFilterModule,
-    DxoStoreModule,
     DxoExportModule,
     DxoFieldChooserModule,
     DxoTextsModule,
     DxoFieldPanelModule,
+    DxoHeaderFilterModule,
     DxoSearchModule,
     DxoLoadPanelModule,
     DxoScrollingModule,
@@ -927,15 +919,11 @@ export class DxPivotGridComponent extends DxComponent implements OnDestroy, OnCh
   ],
   exports: [
     DxPivotGridComponent,
-    DxoDataSourceModule,
-    DxiFieldModule,
-    DxoFormatModule,
-    DxoHeaderFilterModule,
-    DxoStoreModule,
     DxoExportModule,
     DxoFieldChooserModule,
     DxoTextsModule,
     DxoFieldPanelModule,
+    DxoHeaderFilterModule,
     DxoSearchModule,
     DxoLoadPanelModule,
     DxoScrollingModule,
diff --git a/packages/devextreme-scss/scss/widgets/base/_gridBase.scss b/packages/devextreme-scss/scss/widgets/base/_gridBase.scss
index 487bc7badfff..dafdbbcf18af 100644
--- a/packages/devextreme-scss/scss/widgets/base/_gridBase.scss
+++ b/packages/devextreme-scss/scss/widgets/base/_gridBase.scss
@@ -625,6 +625,7 @@
   .dx-#{$widget-name}-headers {
     position: relative;
     outline: 0;
+    min-height: 1px;
 
     @include user-select(none);
   }
diff --git a/packages/devextreme-scss/scss/widgets/fluent/gridBase/_index.scss b/packages/devextreme-scss/scss/widgets/fluent/gridBase/_index.scss
index b02c0834a666..ef7744ed3d00 100644
--- a/packages/devextreme-scss/scss/widgets/fluent/gridBase/_index.scss
+++ b/packages/devextreme-scss/scss/widgets/fluent/gridBase/_index.scss
@@ -674,10 +674,16 @@ $fluent-grid-base-group-panel-message-line-height: $fluent-button-text-line-heig
   .dx-#{$widget-name}-headers {
     color: $datagrid-columnchooser-item-color;
     touch-action: pinch-zoom;
-    border-bottom: $datagrid-border;
 
-    .dx-#{$widget-name}-content {
-      margin-bottom: -1px;
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      pointer-events: none;
+      border-bottom: $datagrid-border;
     }
 
     .dx-#{$widget-name}-table {
diff --git a/packages/devextreme-scss/scss/widgets/generic/gridBase/_colors.scss b/packages/devextreme-scss/scss/widgets/generic/gridBase/_colors.scss
index c9ba1688ed4d..5513d9d14b74 100644
--- a/packages/devextreme-scss/scss/widgets/generic/gridBase/_colors.scss
+++ b/packages/devextreme-scss/scss/widgets/generic/gridBase/_colors.scss
@@ -432,7 +432,7 @@ $datagrid-draggable-column-text-color: null !default;
   $datagrid-row-selected-color: lighten($base-text-color, 100%) !default;
   $datagrid-row-focused-color: $base-inverted-text-color !default;
   $datagrid-row-focused-bg: mix($base-bg, $base-accent, 20%) !default;
-  $datagrid-hover-bg: color.change(darken($base-bg, 9%), $alpha: 0.4) !default;
+  $datagrid-hover-bg: darken($base-bg, 3%) !default;
   $datagrid-row-hovered-color: $base-hover-color !default;
   $datagrid-menu-icon-color: $base-icon-color !default;
   $datagrid-cell-modified-border-color: color.change($base-success, $alpha: 0.5) !default;
@@ -448,7 +448,7 @@ $datagrid-draggable-column-text-color: null !default;
   $datagrid-editor-bg: $base-bg !default;
   $datagrid-drop-highlight-bg: $base-accent !default;
   $datagrid-columnchooser-bg: $base-bg !default;
-  $datagrid-row-alternation-bg: color.change(darken($base-bg, 9%), $alpha: 0.4) !default;
+  $datagrid-row-alternation-bg: darken($base-bg, 3%) !default;
   $datagrid-columnchooser-item-bg: $datagrid-columnchooser-bg !default;
   $datagrid-summary-color: $base-label-color !default;
   $datagrid-columnchooser-message-color: lighten($datagrid-base-color, 40%) !default;
diff --git a/packages/devextreme-scss/scss/widgets/generic/gridBase/_index.scss b/packages/devextreme-scss/scss/widgets/generic/gridBase/_index.scss
index 6c1016ddc59a..87ad7929bf10 100644
--- a/packages/devextreme-scss/scss/widgets/generic/gridBase/_index.scss
+++ b/packages/devextreme-scss/scss/widgets/generic/gridBase/_index.scss
@@ -489,10 +489,16 @@ $generic-grid-base-cell-input-height: round($generic-base-line-height * $generic
     color: $datagrid-columnchooser-item-color;
     font-weight: $datagrid-columnchooser-font-weight;
     touch-action: pinch-zoom;
-    border-bottom: $datagrid-border;
 
-    .dx-#{$widget-name}-content {
-      margin-bottom: -1px;
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      pointer-events: none;
+      border-bottom: $datagrid-border;
     }
 
     .dx-#{$widget-name}-table {
diff --git a/packages/devextreme-scss/scss/widgets/material/gridBase/_index.scss b/packages/devextreme-scss/scss/widgets/material/gridBase/_index.scss
index 8de491ce6b60..75bcbec0bf06 100644
--- a/packages/devextreme-scss/scss/widgets/material/gridBase/_index.scss
+++ b/packages/devextreme-scss/scss/widgets/material/gridBase/_index.scss
@@ -642,10 +642,16 @@ $material-grid-base-group-panel-message-line-height: $material-button-text-line-
   .dx-#{$widget-name}-headers {
     color: $datagrid-columnchooser-item-color;
     touch-action: pinch-zoom;
-    border-bottom: $datagrid-border;
 
-    .dx-#{$widget-name}-content {
-      margin-bottom: -1px;
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      pointer-events: none;
+      border-bottom: $datagrid-border;
     }
 
     .dx-#{$widget-name}-table {
diff --git a/packages/devextreme/js/__internal/core/r1/config_provider.tsx b/packages/devextreme/js/__internal/core/r1/config_provider.tsx
index 8ffff42a3d93..9c1607665c9a 100644
--- a/packages/devextreme/js/__internal/core/r1/config_provider.tsx
+++ b/packages/devextreme/js/__internal/core/r1/config_provider.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-return */
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { BaseInfernoComponent } from '@devextreme/runtime/inferno';
 
@@ -10,20 +11,28 @@ export interface ConfigProviderProps {
 
 export const ConfigProviderDefaultProps = {};
 export class ConfigProvider extends BaseInfernoComponent<ConfigProviderProps> {
-  public state: any = {};
+  private readonly __getterCache: any = {};
 
-  getConfig(): ConfigContextValue {
-    return {
+  get config(): ConfigContextValue {
+    if (this.__getterCache.config !== undefined) {
+      return this.__getterCache.config;
+    }
+    // eslint-disable-next-line no-return-assign
+    return this.__getterCache.config = ((): any => ({
       rtlEnabled: this.props.rtlEnabled,
-    };
+    }))();
+  }
+
+  componentWillUpdate(nextProps: ConfigProviderProps): void {
+    if (this.props.rtlEnabled !== nextProps.rtlEnabled) {
+      this.__getterCache.config = undefined;
+    }
   }
 
   getChildContext(): any {
     return {
       ...this.context,
-      ...{
-        [ConfigContext.id]: this.getConfig() || ConfigContext.defaultValue,
-      },
+      [ConfigContext.id]: this.config || ConfigContext.defaultValue,
     };
   }
 
diff --git a/packages/devextreme/js/__internal/core/r1/template_wrapper.ts b/packages/devextreme/js/__internal/core/r1/template_wrapper.ts
index 6246ab9f5694..7abbb47d241c 100644
--- a/packages/devextreme/js/__internal/core/r1/template_wrapper.ts
+++ b/packages/devextreme/js/__internal/core/r1/template_wrapper.ts
@@ -160,6 +160,10 @@ export class TemplateWrapper extends InfernoComponent<TemplateWrapperProps> {
       return true;
     }
 
+    if (!isDefined(data) || !isDefined(nextData)) {
+      return model !== nextModel;
+    }
+
     return !equalityComparer(data, nextData);
   }
 
diff --git a/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/m_keyboard_navigation.ts b/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/m_keyboard_navigation.ts
index 96222c594410..a7b43ddb972c 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/m_keyboard_navigation.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/m_keyboard_navigation.ts
@@ -101,7 +101,9 @@ export class KeyboardNavigationController extends modules.ViewController {
 
   private focusedHandlerWithContext!: ($element: dxElementWrapper) => void;
 
-  private renderCompletedWithContext!: (e: any) => void;
+  private rowsViewRenderCompletedWithContext!: (e: any) => void;
+
+  private columnHeadersViewRenderCompletedWithContext!: (e: any) => void;
 
   private rowsViewFocusHandlerContext!: (event: any) => void;
 
@@ -119,7 +121,9 @@ export class KeyboardNavigationController extends modules.ViewController {
 
   private _pointerEventAction: any;
 
-  private _keyDownListener: any;
+  private _rowsViewKeyDownListener: any;
+
+  private _columnHeadersViewKeyDownListener: any;
 
   private focusType: any;
 
@@ -135,6 +139,8 @@ export class KeyboardNavigationController extends modules.ViewController {
 
   protected _rowsView!: Views['rowsView'];
 
+  protected _columnHeadersView!: Views['columnHeadersView'];
+
   protected _columnsController!: Controllers['columns'];
 
   private _editorFactory!: Controllers['editorFactory'];
@@ -152,6 +158,7 @@ export class KeyboardNavigationController extends modules.ViewController {
     this._editingController = this.getController('editing');
     this._headerPanel = this.getView('headerPanel');
     this._rowsView = this.getView('rowsView');
+    this._columnHeadersView = this.getView('columnHeadersView');
     this._columnsController = this.getController('columns');
     this._editorFactory = this.getController('editorFactory');
     this._focusController = this.getController('focus');
@@ -162,7 +169,8 @@ export class KeyboardNavigationController extends modules.ViewController {
     this._memoFireFocusedRowChanged = memoize(this._memoFireFocusedRowChanged.bind(this), { compareType: 'value' });
 
     this.focusedHandlerWithContext = this.focusedHandlerWithContext || this.focusedHandler.bind(this);
-    this.renderCompletedWithContext = this.renderCompletedWithContext || this.renderCompleted.bind(this);
+    this.columnHeadersViewRenderCompletedWithContext = this.columnHeadersViewRenderCompletedWithContext || this.columnHeadersViewRenderCompleted.bind(this);
+    this.rowsViewRenderCompletedWithContext = this.rowsViewRenderCompletedWithContext || this.rowsViewRenderCompleted.bind(this);
     this.rowsViewFocusHandlerContext = this.rowsViewFocusHandlerContext || this.rowsViewFocusHandler.bind(this);
     this.rowsViewFocusOutHandlerContext = this.rowsViewFocusOutHandlerContext
       ?? this.rowsViewFocusOutHandler.bind(this);
@@ -181,14 +189,16 @@ export class KeyboardNavigationController extends modules.ViewController {
       this._editorFactory?.focused.remove(this.focusedHandlerWithContext);
     }
 
-    this.initViewHandlers();
+    this.initColumnHeadersViewHandler();
+    this.initRowsViewHandlers();
     this.initDocumentHandlers();
   }
 
   public dispose() {
     super.dispose();
     this._resetFocusedView();
-    keyboard.off(this._keyDownListener);
+    keyboard.off(this._rowsViewKeyDownListener);
+    keyboard.off(this._columnHeadersViewKeyDownListener);
     eventsEngine.off(
       domAdapter.getDocument(),
       addNamespace(pointerEvents.down, 'dxDataGridKeyboardNavigation'),
@@ -264,7 +274,11 @@ export class KeyboardNavigationController extends modules.ViewController {
     eventsEngine.off($rowsView, 'focusout', this.rowsViewFocusOutHandlerContext);
   }
 
-  protected renderCompleted(e: any): void {
+  protected columnHeadersViewRenderCompleted(): void {
+    this.initColumnHeadersViewKeyDownHandler();
+  }
+
+  protected rowsViewRenderCompleted(e: any): void {
     const $rowsView = this._rowsView.element();
     const isFullUpdate = !e || e.changeType === 'refresh';
     const isFocusedViewCorrect = this._focusedView && this._focusedView.name === this._rowsView.name;
@@ -279,7 +293,7 @@ export class KeyboardNavigationController extends modules.ViewController {
     this.subscribeToRowsViewFocusEvent();
 
     this.initPointerEventHandler();
-    this.initKeyDownHandler();
+    this.initRowsViewKeyDownHandler();
     this._setRowsViewAttributes();
 
     if (isFocusedViewCorrect && isFocusedElementCorrect) {
@@ -290,15 +304,25 @@ export class KeyboardNavigationController extends modules.ViewController {
     }
   }
 
-  private initViewHandlers(): void {
+  private initColumnHeadersViewHandler(): void {
+    this.unsubscribeFromColumnHeadersViewKeyDownEvent();
+
+    this._columnHeadersView?.renderCompleted?.remove(this.columnHeadersViewRenderCompletedWithContext);
+
+    if (this.isKeyboardEnabled()) {
+      this._columnHeadersView?.renderCompleted?.add(this.columnHeadersViewRenderCompletedWithContext);
+    }
+  }
+
+  private initRowsViewHandlers(): void {
     this.unsubscribeFromRowsViewFocusEvent();
     this.unsubscribeFromPointerEvent();
-    this.unsubscribeFromKeyDownEvent();
+    this.unsubscribeFromRowsViewKeyDownEvent();
 
-    this._rowsView?.renderCompleted?.remove(this.renderCompletedWithContext);
+    this._rowsView?.renderCompleted?.remove(this.rowsViewRenderCompletedWithContext);
 
     if (this.isKeyboardEnabled()) {
-      this._rowsView.renderCompleted.add(this.renderCompletedWithContext);
+      this._rowsView.renderCompleted.add(this.rowsViewRenderCompletedWithContext);
     }
   }
 
@@ -376,19 +400,36 @@ export class KeyboardNavigationController extends modules.ViewController {
     this.subscribeToPointerEvent();
   }
 
-  private unsubscribeFromKeyDownEvent(): void {
-    keyboard.off(this._keyDownListener);
+  private unsubscribeFromColumnHeadersViewKeyDownEvent(): void {
+    if (this._columnHeadersViewKeyDownListener) {
+      keyboard.off(this._columnHeadersViewKeyDownListener);
+    }
   }
 
-  private subscribeToKeyDownEvent(): void {
+  private subscribeToColumnHeadersViewKeyDownEvent(): void {
+    const $columnHeadersView = this._columnHeadersView.element();
+
+    this._columnHeadersViewKeyDownListener = keyboard.on($columnHeadersView, null, (e) => this._columnHeadersViewKeyDownHandler(e));
+  }
+
+  private initColumnHeadersViewKeyDownHandler(): void {
+    this.unsubscribeFromColumnHeadersViewKeyDownEvent();
+    this.subscribeToColumnHeadersViewKeyDownEvent();
+  }
+
+  private unsubscribeFromRowsViewKeyDownEvent(): void {
+    keyboard.off(this._rowsViewKeyDownListener);
+  }
+
+  private subscribeToRowsViewKeyDownEvent(): void {
     const $rowsView = this._getRowsViewElement();
 
-    this._keyDownListener = keyboard.on($rowsView, null, (e) => this._keyDownHandler(e));
+    this._rowsViewKeyDownListener = keyboard.on($rowsView, null, (e) => this._rowsViewKeyDownHandler(e));
   }
 
-  private initKeyDownHandler(): void {
-    this._keyDownListener && this.unsubscribeFromKeyDownEvent();
-    this.subscribeToKeyDownEvent();
+  private initRowsViewKeyDownHandler(): void {
+    this._rowsViewKeyDownListener && this.unsubscribeFromRowsViewKeyDownEvent();
+    this.subscribeToRowsViewKeyDownEvent();
   }
 
   // #endregion Initialization
@@ -431,7 +472,17 @@ export class KeyboardNavigationController extends modules.ViewController {
   // #endregion Options
 
   // #region Key_Handlers
-  private _keyDownHandler(e) {
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  protected headerTabKeyHandler(e) {}
+
+  private _columnHeadersViewKeyDownHandler(e) {
+    if (e.keyName === 'tab') {
+      this.headerTabKeyHandler(e);
+    }
+  }
+
+  private _rowsViewKeyDownHandler(e) {
     let needStopPropagation = true;
     this._isNeedFocus = true;
     this._isNeedScroll = true;
diff --git a/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/scrollable_a11y.ts b/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/scrollable_a11y.ts
index 3fbf21a882db..81ad18c6b6fc 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/scrollable_a11y.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/scrollable_a11y.ts
@@ -55,11 +55,11 @@ export const keyboardNavigationScrollableA11yExtender = (Base: ModuleType<Keyboa
     }
   }
 
-  protected renderCompleted(e: any): void {
+  protected rowsViewRenderCompleted(e: any): void {
     this._$firstNotFixedCell = this.getFirstNotFixedCell();
     this.makeScrollableFocusableIfNeed();
 
-    super.renderCompleted(e);
+    super.rowsViewRenderCompleted(e);
   }
 
   public _focus($cell: any, disableFocus?: any, skipFocusEvent?: any): void {
diff --git a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/dom.ts b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/dom.ts
index 7bbf223295d7..b19249d84b45 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/dom.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/dom.ts
@@ -86,13 +86,6 @@ const isStickyCellPinned = (
 ): boolean => isStickyCellPinnedToLeft($cell, $container, addWidgetPrefix)
   || isStickyCellPinnedToRight($cell, $container, addWidgetPrefix);
 
-const isFixedCellPinnedToLeft = (
-  $cell: dxElementWrapper,
-  $container: dxElementWrapper,
-  addWidgetPrefix,
-): boolean => $cell.hasClass(addWidgetPrefix(CLASSES.stickyColumnLeft))
-  || isStickyCellPinnedToLeft($cell, $container, addWidgetPrefix);
-
 const isFixedCellPinnedToRight = (
   $cell: dxElementWrapper,
   $container: dxElementWrapper,
@@ -132,22 +125,6 @@ const getRightFixedCells = ($cells: dxElementWrapper, addWidgetPrefix): dxElemen
   // @ts-expect-error
   .filter((_, cell: HTMLElement) => $(cell).hasClass(addWidgetPrefix(CLASSES.stickyColumnRight)));
 
-const getFixedCellsPinnedToLeft = (
-  $cells: dxElementWrapper,
-  $container: dxElementWrapper,
-  addWidgetPrefix,
-): dxElementWrapper => $cells
-  // @ts-expect-error
-  .filter((_, cell: HTMLElement) => isFixedCellPinnedToLeft($(cell), $container, addWidgetPrefix));
-
-const getFixedCellsPinnedToRight = (
-  $cells: dxElementWrapper,
-  $container: dxElementWrapper,
-  addWidgetPrefix,
-): dxElementWrapper => $cells
-  // @ts-expect-error
-  .filter((_, cell: HTMLElement) => isFixedCellPinnedToRight($(cell), $container, addWidgetPrefix));
-
 const getNonFixedAndStickyCells = (
   $cells: dxElementWrapper,
   addWidgetPrefix,
@@ -313,31 +290,15 @@ const getScrollPadding = (
   left: number;
   right: number;
 } => {
-  const left = getFixedCellsPinnedToLeft($cells, $container, addWidgetPrefix)
-    .toArray()
-    .reduce((sum, cell) => sum + cell.getBoundingClientRect().width, 0);
-  const right = getFixedCellsPinnedToRight($cells, $container, addWidgetPrefix)
-    .toArray()
-    .reduce((sum, cell) => sum + cell.getBoundingClientRect().width, 0);
+  const containerRect = getBoundingRect($container.get(0));
+  const nonFixedAreaBoundingRect = getNonFixedAreaBoundingRect($cells, $container, addWidgetPrefix);
 
   return {
-    left,
-    right,
+    left: nonFixedAreaBoundingRect.left - containerRect.left,
+    right: containerRect.right - nonFixedAreaBoundingRect.right,
   };
 };
 
-const setScrollPadding = (
-  $cells: dxElementWrapper,
-  $container: dxElementWrapper,
-  addWidgetPrefix,
-): void => {
-  const scrollPadding = getScrollPadding($cells, $container, addWidgetPrefix);
-  $container.css({
-    scrollPaddingLeft: scrollPadding.left,
-    scrollPaddingRight: scrollPadding.right,
-  });
-};
-
 const isOutsideVisibleArea = (
   $element: dxElementWrapper,
   $cells: dxElementWrapper,
@@ -363,6 +324,30 @@ const isLastCell = ($cell: dxElementWrapper): boolean => {
   return $cell[0] === $lastCell[0];
 };
 
+const needToSkipHeaderCell = ($cell: dxElementWrapper): boolean => !$cell.is('[tabindex]');
+
+const getNextHeaderCell = (
+  $cell: dxElementWrapper,
+  direction = 'next',
+): dxElementWrapper => {
+  let $nextCell = $cell;
+  let $nextRow = $cell.parent();
+
+  do {
+    $nextCell = direction === 'next' ? $nextCell.next() : $nextCell.prev();
+
+    if (!$nextCell.length) {
+      $nextRow = direction === 'next' ? $nextRow.next() : $nextRow.prev();
+
+      if ($nextRow.length) {
+        $nextCell = direction === 'next' ? $nextRow.children().first() : $nextRow.children().last();
+      }
+    }
+  } while ($nextCell.length && needToSkipHeaderCell($nextCell));
+
+  return $nextCell;
+};
+
 export const GridCoreStickyColumnsDom = {
   toggleFirstHeaderClass,
   toggleColumnNoBorderClass,
@@ -375,6 +360,7 @@ export const GridCoreStickyColumnsDom = {
   getRightFixedCells,
   getNonFixedAndStickyCells,
   getScrollPadding,
+  getNextHeaderCell,
   noNeedToCreateResizingPoint,
   isFixedCellPinnedToRight,
   noNeedToCreateReorderingPoint,
@@ -383,5 +369,4 @@ export const GridCoreStickyColumnsDom = {
   isStickyCellPinned,
   isOutsideVisibleArea,
   isLastCell,
-  setScrollPadding,
 };
diff --git a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/m_sticky_columns.ts b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/m_sticky_columns.ts
index 4a039585c4f0..7177887f521d 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/m_sticky_columns.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/m_sticky_columns.ts
@@ -6,6 +6,7 @@ import { getBoundingRect } from '@js/core/utils/position';
 import { setWidth } from '@js/core/utils/size';
 import type { EditorFactory } from '@ts/grids/grid_core/editor_factory/m_editor_factory';
 import type { ResizingController } from '@ts/grids/grid_core/views/m_grid_view';
+import { getElementLocationInternal } from '@ts/ui/scroll_view/utils/get_element_location_internal';
 
 import { HIDDEN_COLUMNS_WIDTH } from '../adaptivity/const';
 import type { ColumnHeadersView } from '../column_headers/m_column_headers';
@@ -13,6 +14,7 @@ import type {
   ColumnsResizerViewController,
   DraggingHeaderViewController,
 } from '../columns_resizing_reordering/m_columns_resizing_reordering';
+import type { KeyboardNavigationController } from '../keyboard_navigation/m_keyboard_navigation';
 import {
   isAdaptiveItem,
   isGroupFooterRow,
@@ -29,7 +31,6 @@ import { GridCoreStickyColumnsDom } from './dom';
 import {
   getColumnFixedPosition,
   getStickyOffset,
-  hasFixedColumnsWithStickyPosition,
   isFirstFixedColumn,
   isFixedEdge,
   isLastFixedColumn,
@@ -273,14 +274,6 @@ const columnHeadersView = (
     }
   }
 
-  protected _resizeCore() {
-    super._resizeCore();
-
-    if (this.hasStickyColumns()) {
-      this.updateScrollPadding();
-    }
-  }
-
   public getContextMenuItems(options) {
     const { column } = options;
     const columnsController = this._columnsController;
@@ -363,17 +356,6 @@ const columnHeadersView = (
     }
     return items;
   }
-
-  public updateScrollPadding(): void {
-    const $scrollContainer = $(this.getContent());
-    const $cells = $(this.getColumnElements());
-
-    GridCoreStickyColumnsDom.setScrollPadding(
-      $cells,
-      $scrollContainer,
-      this.addWidgetPrefix.bind(this),
-    );
-  }
 };
 
 const rowsView = (
@@ -498,22 +480,25 @@ const rowsView = (
 
         editorFactoryController.focus($focusedElement);
       }
-
-      if (hasFixedColumnsWithStickyPosition(this._columnsController)) {
-        // @ts-expect-error
-        this._columnHeadersView?.updateScrollPadding();
-      }
     }
   }
 
   public _scrollToElement($element, offset?) {
     let scrollOffset = offset;
     const hasStickyColumns = this.hasStickyColumns();
-    const $row = $element?.closest('tr');
-    const $cells = $row?.children();
-    const $scrollContainer = this.getScrollable()?.container();
 
-    if (hasStickyColumns && $cells.length) {
+    if (hasStickyColumns) {
+      const isFixedCell = GridCoreStickyColumnsDom
+        .isFixedCell($element, this.addWidgetPrefix.bind(this));
+
+      if (!$element.is('td') || isFixedCell) {
+        return;
+      }
+
+      const $row = $element?.closest('tr');
+      const $cells = $row?.children();
+      const $scrollContainer = this.getScrollable()?.container();
+
       scrollOffset = GridCoreStickyColumnsDom
         .getScrollPadding($cells, $scrollContainer, this.addWidgetPrefix.bind(this));
     }
@@ -804,6 +789,56 @@ const resizing = (Base: ModuleType<ResizingController>) => class ResizingStickyC
   }
 };
 
+const keyboardNavigation = (Base: ModuleType<KeyboardNavigationController>) => class KeyboardNavigationStickyColumnsExtender extends Base {
+  // TODO Salimov: Most likely, we will need to remove the subscription
+  // for headers after we implement sticky headers (pqKdLLL1).
+  // Perhaps the headers will be rendered in the same table with data cells.
+  // And this code will no longer be needed.
+  protected headerTabKeyHandler({ originalEvent, shift }) {
+    // @ts-expect-error columnHeadersView's method
+    const hasStickyColumns = this._columnHeadersView?.hasStickyColumns();
+    const scrollable = this._rowsView?.getScrollable();
+
+    if (hasStickyColumns && scrollable) {
+      const $cell = $(originalEvent.target).closest('td');
+      const $nextCell = GridCoreStickyColumnsDom.getNextHeaderCell(
+        $cell,
+        shift ? 'previous' : 'next',
+      );
+      const isFixedCell = GridCoreStickyColumnsDom
+        .isFixedCell($nextCell, this.addWidgetPrefix.bind(this));
+
+      if ($nextCell.length && !isFixedCell) {
+        const $cells = $(this._columnHeadersView.getColumnElements());
+        const cellIsOutsideVisibleArea = GridCoreStickyColumnsDom.isOutsideVisibleArea(
+          $nextCell,
+          $cells,
+          $(this._columnHeadersView.getContent()),
+          this.addWidgetPrefix.bind(this),
+        );
+
+        if (cellIsOutsideVisibleArea) {
+          const scrollPadding = GridCoreStickyColumnsDom.getScrollPadding(
+            $cells,
+            scrollable.container(),
+            this.addWidgetPrefix.bind(this),
+          );
+          const scrollPosition = getElementLocationInternal(
+            $nextCell[0],
+            'horizontal',
+            $(this._columnHeadersView.getContent())[0],
+            scrollable.scrollOffset(),
+            scrollPadding,
+            this.addWidgetPrefix('table'),
+          );
+
+          scrollable.scrollTo({ x: scrollPosition });
+        }
+      }
+    }
+  }
+};
+
 export const stickyColumnsModule = {
   extenders: {
     views: {
@@ -816,6 +851,7 @@ export const stickyColumnsModule = {
       draggingHeader,
       editorFactory,
       resizing,
+      keyboardNavigation,
     },
   },
 };
diff --git a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/utils.ts b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/utils.ts
index 97e0cb2346b2..f2dc48961a21 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/utils.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/sticky_columns/utils.ts
@@ -33,18 +33,6 @@ export const needToDisableStickyColumn = function (
   return that.isVirtualMode() && !!column.fixed && column.fixedPosition === StickyPosition.Sticky;
 };
 
-/* TODO: Need to rename this method to hasStickyColumns
-   after removing old fixed columns implementation */
-export const hasFixedColumnsWithStickyPosition = function (that: ColumnsController): boolean {
-  if (that.isVirtualMode()) {
-    return false;
-  }
-
-  return !!that
-    .getStickyColumns()
-    .filter((column) => column.fixedPosition === StickyPosition.Sticky).length;
-};
-
 export const processFixedColumns = function (
   that: ColumnsController,
   columns: object[],
diff --git a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment.ts b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment.ts
index ec15fd4ff892..98e1ca14256c 100644
--- a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment.ts
+++ b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment.ts
@@ -2,6 +2,7 @@
 import { move } from '@js/animation/translator';
 import registerComponent from '@js/core/component_registrator';
 import DOMComponent from '@js/core/dom_component';
+import Guid from '@js/core/guid';
 import type { dxElementWrapper } from '@js/core/renderer';
 import $ from '@js/core/renderer';
 import { Deferred } from '@js/core/utils/deferred';
@@ -212,6 +213,11 @@ export class Appointment extends DOMComponent {
       .filter((label) => !!label)
       .join(', ');
     $element.attr('aria-roledescription', `${ariaLabel}, `);
+
+    const id = `dx-${new Guid()}`;
+
+    $element.attr('aria-describedby', id);
+    $element.find('.dx-item-content').attr('id', id);
   }
 
   _renderAppointmentGeometry() {
diff --git a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_collection.ts b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_collection.ts
index e93f891be91f..cfb444240ae6 100644
--- a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_collection.ts
+++ b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_collection.ts
@@ -465,6 +465,10 @@ class SchedulerAppointments extends CollectionWidget {
     const $target = $(e.currentTarget);
     const data = (this as any)._getItemData($target);
 
+    if ($target.is('.dx-scheduler-appointment-collector')) {
+      return;
+    }
+
     if (e.type === 'keydown' || isFakeClickEvent(e)) {
       this.notifyObserver('showEditAppointmentPopup', { data, target: $target });
       return;
diff --git a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_layout.ts b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_layout.ts
index 460f0fbd9ca7..d57f55f56d4b 100644
--- a/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_layout.ts
+++ b/packages/devextreme/js/__internal/scheduler/appointments/m_appointment_layout.ts
@@ -24,7 +24,10 @@ export const createAppointmentLayout = (formatText, config) => {
   $('<div>').addClass(APPOINTMENT_CONTENT_CLASSES.APPOINTMENT_DATE).text(formatText.formatDate).appendTo($contentDetails);
 
   config.isRecurrence
-        && $('<span>').addClass(`${APPOINTMENT_CONTENT_CLASSES.RECURRING_ICON} dx-icon-repeat`).attr('aria-label', recurringText)
+        && $('<span>')
+          .addClass(`${APPOINTMENT_CONTENT_CLASSES.RECURRING_ICON} dx-icon-repeat`)
+          .attr('aria-label', recurringText)
+          .attr('role', 'img')
           .appendTo(result);
 
   config.isAllDay
diff --git a/packages/devextreme/js/__internal/scheduler/m_compact_appointments_helper.ts b/packages/devextreme/js/__internal/scheduler/m_compact_appointments_helper.ts
index c43e764f13c9..28b5cd402aec 100644
--- a/packages/devextreme/js/__internal/scheduler/m_compact_appointments_helper.ts
+++ b/packages/devextreme/js/__internal/scheduler/m_compact_appointments_helper.ts
@@ -76,6 +76,7 @@ export class CompactAppointmentsHelper {
       dragBehavior: options.allowDrag && this._createTooltipDragBehavior($appointmentCollector).bind(this),
       dropDownAppointmentTemplate: this.instance.option().dropDownAppointmentTemplate, // TODO deprecated option
       isButtonClick: true,
+      _loopFocus: true,
     };
   }
 
diff --git a/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts b/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts
index 2b37d4249bba..4e52ba124577 100644
--- a/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts
+++ b/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts
@@ -1,3 +1,4 @@
+import messageLocalization from '@js/localization/message';
 import supportUtils from '@ts/core/utils/m_support';
 import Tooltip from '@ts/ui/m_tooltip';
 
@@ -40,16 +41,24 @@ export class DesktopTooltipStrategy extends TooltipStrategyBase {
   }
 
   _createTooltip(target, dataList) {
-    const tooltip = this._createTooltipElement(APPOINTMENT_TOOLTIP_WRAPPER_CLASS);
+    const tooltipElement = this._createTooltipElement(APPOINTMENT_TOOLTIP_WRAPPER_CLASS);
 
-    return this._options.createComponent(tooltip, Tooltip, {
+    const tooltip = this._options.createComponent(tooltipElement, Tooltip, {
       target,
       maxHeight: MAX_TOOLTIP_HEIGHT,
       rtlEnabled: this._extraOptions.rtlEnabled,
       onShown: this._onShown.bind(this),
       contentTemplate: this._getContentTemplate(dataList),
       wrapperAttr: { class: APPOINTMENT_TOOLTIP_WRAPPER_CLASS },
+      _loopFocus: this._extraOptions._loopFocus,
     });
+
+    tooltip.setAria({
+      role: 'dialog',
+      label: messageLocalization.format('dxScheduler-appointmentListAriaLabel'),
+    });
+
+    return tooltip;
   }
 
   _onListRender(e) {
diff --git a/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_tooltip_strategy_base.ts b/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_tooltip_strategy_base.ts
index 45e7b84294c4..f0502dca159a 100644
--- a/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_tooltip_strategy_base.ts
+++ b/packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_tooltip_strategy_base.ts
@@ -1,5 +1,6 @@
 import $ from '@js/core/renderer';
 import { FunctionTemplate } from '@js/core/templates/function_template';
+import { isRenderer } from '@js/core/utils/type';
 import Button from '@js/ui/button';
 import { createPromise } from '@ts/core/utils/promise';
 import List from '@ts/ui/list/m_list.edit';
@@ -40,6 +41,8 @@ export class TooltipStrategyBase {
   }
 
   _showCore(target, dataList) {
+    const describedByValue = isRenderer(target) && target.attr('aria-describedby') as string;
+
     if (!this._tooltip) {
       this._tooltip = this._createTooltip(target, dataList);
     } else {
@@ -49,6 +52,8 @@ export class TooltipStrategyBase {
 
     this._prepareBeforeVisibleChanged(dataList);
     this._tooltip.option('visible', true);
+
+    describedByValue && target.attr('aria-describedby', describedByValue);
   }
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -61,6 +66,10 @@ export class TooltipStrategyBase {
       const listElement = $('<div>');
       $(container).append(listElement);
       this._list = this._createList(listElement, dataList);
+      this._list.registerKeyHandler?.('escape', () => {
+        this.hide();
+        this._tooltip.option('target').focus();
+      });
     };
   }
 
diff --git a/packages/devextreme/js/__internal/ui/scroll_view/utils/get_element_location_internal.ts b/packages/devextreme/js/__internal/ui/scroll_view/utils/get_element_location_internal.ts
index 85081f29f8ee..596805b4550e 100644
--- a/packages/devextreme/js/__internal/ui/scroll_view/utils/get_element_location_internal.ts
+++ b/packages/devextreme/js/__internal/ui/scroll_view/utils/get_element_location_internal.ts
@@ -18,6 +18,7 @@ export function getElementLocationInternal(
   containerElement: HTMLDivElement,
   scrollOffset: ScrollOffset,
   offset?: ElementOffset,
+  scrollableContentClass = SCROLLABLE_CONTENT_CLASS,
 ): number {
   const additionalOffset = {
     top: 0,
@@ -47,7 +48,7 @@ export function getElementLocationInternal(
 
   // T162489
   const relativeElementOffset = getRelativeOffset(
-    SCROLLABLE_CONTENT_CLASS,
+    scrollableContentClass,
     targetElement,
   )[prop] / scale;
 
diff --git a/packages/devextreme/js/localization/messages/ar.json b/packages/devextreme/js/localization/messages/ar.json
index 65228a55697a..333d1899dc8c 100644
--- a/packages/devextreme/js/localization/messages/ar.json
+++ b/packages/devextreme/js/localization/messages/ar.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "الموضوع",
         "dxScheduler-editorLabelStartDate": "تاريخ البدء",
         "dxScheduler-editorLabelEndDate": "تاريخ الانتهاء",
diff --git a/packages/devextreme/js/localization/messages/ca.json b/packages/devextreme/js/localization/messages/ca.json
index 410ba2ddb2d9..3215478be21d 100644
--- a/packages/devextreme/js/localization/messages/ca.json
+++ b/packages/devextreme/js/localization/messages/ca.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Assignatura",
         "dxScheduler-editorLabelStartDate": "Data d'inici",
         "dxScheduler-editorLabelEndDate": "Data de finalització",
diff --git a/packages/devextreme/js/localization/messages/cs.json b/packages/devextreme/js/localization/messages/cs.json
index 03051ab8f007..16733cff1295 100644
--- a/packages/devextreme/js/localization/messages/cs.json
+++ b/packages/devextreme/js/localization/messages/cs.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Předmět",
         "dxScheduler-editorLabelStartDate": "Počáteční datum",
         "dxScheduler-editorLabelEndDate": "Koncové datum",
diff --git a/packages/devextreme/js/localization/messages/de.json b/packages/devextreme/js/localization/messages/de.json
index 6cca61636786..71dfb3a9a765 100644
--- a/packages/devextreme/js/localization/messages/de.json
+++ b/packages/devextreme/js/localization/messages/de.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Betreff",
         "dxScheduler-editorLabelStartDate": "Anfangszeit",
         "dxScheduler-editorLabelEndDate": "Endzeit",
diff --git a/packages/devextreme/js/localization/messages/el.json b/packages/devextreme/js/localization/messages/el.json
index ca16d98d683a..46c447951600 100644
--- a/packages/devextreme/js/localization/messages/el.json
+++ b/packages/devextreme/js/localization/messages/el.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Θέμα",
         "dxScheduler-editorLabelStartDate": "Ημερομηνία έναρξης",
         "dxScheduler-editorLabelEndDate": "Ημερομηνία λήξης",
diff --git a/packages/devextreme/js/localization/messages/en.json b/packages/devextreme/js/localization/messages/en.json
index dafe6cdd7985..30a1389442ff 100644
--- a/packages/devextreme/js/localization/messages/en.json
+++ b/packages/devextreme/js/localization/messages/en.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Subject",
         "dxScheduler-editorLabelStartDate": "Start Date",
         "dxScheduler-editorLabelEndDate": "End Date",
diff --git a/packages/devextreme/js/localization/messages/es.json b/packages/devextreme/js/localization/messages/es.json
index 872a33ef5d17..9a4d21a64c70 100644
--- a/packages/devextreme/js/localization/messages/es.json
+++ b/packages/devextreme/js/localization/messages/es.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Asunto",
         "dxScheduler-editorLabelStartDate": "Fecha inicial",
         "dxScheduler-editorLabelEndDate": "Fecha final",
diff --git a/packages/devextreme/js/localization/messages/fa.json b/packages/devextreme/js/localization/messages/fa.json
index 36274fc31f52..94d282c87ed3 100644
--- a/packages/devextreme/js/localization/messages/fa.json
+++ b/packages/devextreme/js/localization/messages/fa.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "موضوع",
         "dxScheduler-editorLabelStartDate": "تاریخ شروع",
         "dxScheduler-editorLabelEndDate": "تاریخ پایان",
diff --git a/packages/devextreme/js/localization/messages/fi.json b/packages/devextreme/js/localization/messages/fi.json
index c3d3f12c5cee..4af2997994dc 100644
--- a/packages/devextreme/js/localization/messages/fi.json
+++ b/packages/devextreme/js/localization/messages/fi.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Aihe",
         "dxScheduler-editorLabelStartDate": "Alkamispäivä",
         "dxScheduler-editorLabelEndDate": "Päättymispäivä",
diff --git a/packages/devextreme/js/localization/messages/fr.json b/packages/devextreme/js/localization/messages/fr.json
index b0468e7acb8c..09de3725fc56 100644
--- a/packages/devextreme/js/localization/messages/fr.json
+++ b/packages/devextreme/js/localization/messages/fr.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Titre",
         "dxScheduler-editorLabelStartDate": "Date de début",
         "dxScheduler-editorLabelEndDate": "Date de fin",
diff --git a/packages/devextreme/js/localization/messages/hu.json b/packages/devextreme/js/localization/messages/hu.json
index 393220e3b7dc..20e963e5e1e0 100644
--- a/packages/devextreme/js/localization/messages/hu.json
+++ b/packages/devextreme/js/localization/messages/hu.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Tárgy",
         "dxScheduler-editorLabelStartDate": "Kezdés dátuma",
         "dxScheduler-editorLabelEndDate": "Befejezés dátuma",
diff --git a/packages/devextreme/js/localization/messages/it.json b/packages/devextreme/js/localization/messages/it.json
index fddc4babd0b5..82fa7868b794 100644
--- a/packages/devextreme/js/localization/messages/it.json
+++ b/packages/devextreme/js/localization/messages/it.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Oggetto",
         "dxScheduler-editorLabelStartDate": "Data inizio",
         "dxScheduler-editorLabelEndDate": "Data fine",
diff --git a/packages/devextreme/js/localization/messages/ja.json b/packages/devextreme/js/localization/messages/ja.json
index b7940b62e4d3..9733fd7ea4ef 100644
--- a/packages/devextreme/js/localization/messages/ja.json
+++ b/packages/devextreme/js/localization/messages/ja.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "件名",
         "dxScheduler-editorLabelStartDate": "開始時刻",
         "dxScheduler-editorLabelEndDate": "終了時刻",
diff --git a/packages/devextreme/js/localization/messages/lt.json b/packages/devextreme/js/localization/messages/lt.json
index 22b38788ef08..e84d0392b587 100644
--- a/packages/devextreme/js/localization/messages/lt.json
+++ b/packages/devextreme/js/localization/messages/lt.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Tema",
         "dxScheduler-editorLabelStartDate": "Pradžios data",
         "dxScheduler-editorLabelEndDate": "Pabaigos data",
diff --git a/packages/devextreme/js/localization/messages/lv.json b/packages/devextreme/js/localization/messages/lv.json
index 178ff2738117..3a78ba533c88 100644
--- a/packages/devextreme/js/localization/messages/lv.json
+++ b/packages/devextreme/js/localization/messages/lv.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Nosaukums",
         "dxScheduler-editorLabelStartDate": "Sākuma Datums",
         "dxScheduler-editorLabelEndDate": "Beigu Datums",
diff --git a/packages/devextreme/js/localization/messages/nb.json b/packages/devextreme/js/localization/messages/nb.json
index 46d6bf7e9399..3bb8d7df6746 100644
--- a/packages/devextreme/js/localization/messages/nb.json
+++ b/packages/devextreme/js/localization/messages/nb.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Emne",
         "dxScheduler-editorLabelStartDate": "Startdato",
         "dxScheduler-editorLabelEndDate": "Sluttdato",
diff --git a/packages/devextreme/js/localization/messages/nl.json b/packages/devextreme/js/localization/messages/nl.json
index 35d652d2b97d..406f5c3f3735 100644
--- a/packages/devextreme/js/localization/messages/nl.json
+++ b/packages/devextreme/js/localization/messages/nl.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Onderwerp",
         "dxScheduler-editorLabelStartDate": "Startdatum",
         "dxScheduler-editorLabelEndDate": "Einddatum",
diff --git a/packages/devextreme/js/localization/messages/pl.json b/packages/devextreme/js/localization/messages/pl.json
index e663073bc636..b1b4adc838e1 100644
--- a/packages/devextreme/js/localization/messages/pl.json
+++ b/packages/devextreme/js/localization/messages/pl.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Dotyczy",
         "dxScheduler-editorLabelStartDate": "Czas rozpoczęcia",
         "dxScheduler-editorLabelEndDate": "Czas zakończenia",
diff --git a/packages/devextreme/js/localization/messages/pt.json b/packages/devextreme/js/localization/messages/pt.json
index aafee7918c61..e67f21c6156e 100644
--- a/packages/devextreme/js/localization/messages/pt.json
+++ b/packages/devextreme/js/localization/messages/pt.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Assunto",
         "dxScheduler-editorLabelStartDate": "Data de Início",
         "dxScheduler-editorLabelEndDate": "Data Final",
diff --git a/packages/devextreme/js/localization/messages/ro.json b/packages/devextreme/js/localization/messages/ro.json
index 13dfa0bb5fdd..5455ff34e2c4 100644
--- a/packages/devextreme/js/localization/messages/ro.json
+++ b/packages/devextreme/js/localization/messages/ro.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Subiect",
         "dxScheduler-editorLabelStartDate": "Data de început",
         "dxScheduler-editorLabelEndDate": "Data de încheiere",
diff --git a/packages/devextreme/js/localization/messages/ru.json b/packages/devextreme/js/localization/messages/ru.json
index 64aeee0fd4d9..5c3d320c1042 100644
--- a/packages/devextreme/js/localization/messages/ru.json
+++ b/packages/devextreme/js/localization/messages/ru.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Название",
         "dxScheduler-editorLabelStartDate": "Дата начала",
         "dxScheduler-editorLabelEndDate": "Дата завершения",
diff --git a/packages/devextreme/js/localization/messages/sl.json b/packages/devextreme/js/localization/messages/sl.json
index b7fc4f96a3b2..2f7f4197794e 100644
--- a/packages/devextreme/js/localization/messages/sl.json
+++ b/packages/devextreme/js/localization/messages/sl.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Predmet",
         "dxScheduler-editorLabelStartDate": "Datum začetka",
         "dxScheduler-editorLabelEndDate": "Datum konca",
diff --git a/packages/devextreme/js/localization/messages/sv.json b/packages/devextreme/js/localization/messages/sv.json
index 1b5feaefa4a2..3141f9302fce 100644
--- a/packages/devextreme/js/localization/messages/sv.json
+++ b/packages/devextreme/js/localization/messages/sv.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Ämne",
         "dxScheduler-editorLabelStartDate": "Startdatum",
         "dxScheduler-editorLabelEndDate": "Slutdatum",
diff --git a/packages/devextreme/js/localization/messages/tr.json b/packages/devextreme/js/localization/messages/tr.json
index 6ec988021ec8..9ebc7dd1bc2c 100644
--- a/packages/devextreme/js/localization/messages/tr.json
+++ b/packages/devextreme/js/localization/messages/tr.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Konu",
         "dxScheduler-editorLabelStartDate": "Başlangıç Tarihi",
         "dxScheduler-editorLabelEndDate": "Bitiş Tarihi",
diff --git a/packages/devextreme/js/localization/messages/vi.json b/packages/devextreme/js/localization/messages/vi.json
index afc15c878990..c54a3fe15e53 100644
--- a/packages/devextreme/js/localization/messages/vi.json
+++ b/packages/devextreme/js/localization/messages/vi.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "Chủ đề",
         "dxScheduler-editorLabelStartDate": "Ngày bắt đầu",
         "dxScheduler-editorLabelEndDate": "Ngày kết thúc",
diff --git a/packages/devextreme/js/localization/messages/zh-tw.json b/packages/devextreme/js/localization/messages/zh-tw.json
index d366e540023d..f1bb88b78a73 100644
--- a/packages/devextreme/js/localization/messages/zh-tw.json
+++ b/packages/devextreme/js/localization/messages/zh-tw.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "標題",
         "dxScheduler-editorLabelStartDate": "開始日期",
         "dxScheduler-editorLabelEndDate": "結束日期",
diff --git a/packages/devextreme/js/localization/messages/zh.json b/packages/devextreme/js/localization/messages/zh.json
index adf31adfffd2..3f429d8119b7 100644
--- a/packages/devextreme/js/localization/messages/zh.json
+++ b/packages/devextreme/js/localization/messages/zh.json
@@ -255,6 +255,9 @@
         "dxScheduler-appointmentAriaLabel-group": "Group: {0}",
         "dxScheduler-appointmentAriaLabel-recurring": "Recurring appointment",
 
+        "dxScheduler-appointmentListAriaLabel": "Appointment list",
+
+
         "dxScheduler-editorLabelTitle": "标题",
         "dxScheduler-editorLabelStartDate": "开始日期",
         "dxScheduler-editorLabelEndDate": "结束日期",
diff --git a/packages/devextreme/js/ui/shared/accessibility.js b/packages/devextreme/js/ui/shared/accessibility.js
index ea60e4a209a1..d238cc56fe37 100644
--- a/packages/devextreme/js/ui/shared/accessibility.js
+++ b/packages/devextreme/js/ui/shared/accessibility.js
@@ -71,7 +71,7 @@ function getActiveAccessibleElements(ariaLabel, viewElement) {
     let $activeElements;
 
     if(ariaLabel) {
-        const escapedAriaLabel = ariaLabel?.replace(/"/g, '\\"');
+        const escapedAriaLabel = ariaLabel?.replace(/\\/g, '\\\\').replace(/"/g, '\\"');
         $activeElements = $viewElement.find(`[aria-label="${escapedAriaLabel}"][tabindex]`);
     } else {
         $activeElements = $viewElement.find('[tabindex]');
diff --git a/packages/devextreme/testing/helpers/grid/keyboardNavigationHelper.js b/packages/devextreme/testing/helpers/grid/keyboardNavigationHelper.js
index 6678469e366f..8493ddbda084 100644
--- a/packages/devextreme/testing/helpers/grid/keyboardNavigationHelper.js
+++ b/packages/devextreme/testing/helpers/grid/keyboardNavigationHelper.js
@@ -129,7 +129,7 @@ export function triggerKeyDown(key, ctrl, shift, target, result) {
         ctrl = ctrl.ctrl;
     }
 
-    const keyboardListenerId = this.keyboardNavigationController._keyDownListener;
+    const keyboardListenerId = this.keyboardNavigationController._rowsViewKeyDownListener;
     keyboard._getProcessor(keyboardListenerId).process({
         key: KEYS[key] || key,
         keyName: key,
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.integration.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.integration.tests.js
index d82e79dcc79b..ea186dd1c2b2 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.integration.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.integration.tests.js
@@ -2141,7 +2141,7 @@ QUnit.module('Editing', baseModuleConfig, () => {
             this.clock.tick(10);
 
             const navigationController = dataGrid.getController('keyboardNavigation');
-            navigationController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.getCellElement(0, 0)) }) });
+            navigationController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.getCellElement(0, 0)) }) });
             this.clock.tick(10);
 
             // assert
@@ -3960,7 +3960,7 @@ QUnit.module('Editing', baseModuleConfig, () => {
 
             const emulateEnterKeyPress = () => {
                 const event = $.Event('keydown', { target: $('#qunit-fixture').find(':focus').get(0) });
-                navigationController._keyDownHandler({ key: 'Enter', keyName: 'enter', originalEvent: event });
+                navigationController._rowsViewKeyDownHandler({ key: 'Enter', keyName: 'enter', originalEvent: event });
             };
 
             // act
@@ -5288,7 +5288,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
 
         // act
         const event = $.Event('keydown', { target: $('#qunit-fixture').find(':focus').get(0) });
-        navigationController._keyDownHandler({ key: 'Enter', keyName: 'enter', originalEvent: event });
+        navigationController._rowsViewKeyDownHandler({ key: 'Enter', keyName: 'enter', originalEvent: event });
         this.clock.tick(10);
 
         // assert
@@ -5617,7 +5617,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
             width: 400
         });
         const triggerTabPress = function($target) {
-            dataGrid.getController('keyboardNavigation')._keyDownHandler({
+            dataGrid.getController('keyboardNavigation')._rowsViewKeyDownHandler({
                 key: 'Tab',
                 keyName: 'tab',
                 originalEvent: {
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/focus.integration.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/focus.integration.tests.js
index 0df103874d93..93cf67b56db3 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/focus.integration.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/focus.integration.tests.js
@@ -657,7 +657,7 @@ QUnit.module('Initialization', baseModuleConfig, () => {
         $(dataGrid.getRowElement(0)).find('.dx-command-edit > .dx-link-edit').trigger(pointerEvents.up).click();
         this.clock.tick(10);
 
-        navigationController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.getCellElement(0, 0)) }) });
+        navigationController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.getCellElement(0, 0)) }) });
 
         $(dataGrid.getCellElement(0, 1)).trigger(pointerEvents.up);
         this.clock.tick(10);
@@ -1038,7 +1038,7 @@ QUnit.module('Initialization', baseModuleConfig, () => {
         // act
         dataGrid.focus(dataGrid.getCellElement(1, 2));
         const keyboardController = dataGrid.getController('keyboardNavigation');
-        keyboardController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(':focus').get(0) }) });
+        keyboardController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(':focus').get(0) }) });
         this.clock.tick(10);
 
         const $cell = $(dataGrid.element()).find('.dx-focused');
@@ -2144,7 +2144,7 @@ QUnit.module('View\'s focus', {
 
         // act
         const navigationController = this.dataGrid.getController('keyboardNavigation');
-        navigationController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(this.dataGrid.getCellElement(0, 0)) }) });
+        navigationController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(this.dataGrid.getCellElement(0, 0)) }) });
         this.clock.tick(10);
 
         // assert
@@ -4451,7 +4451,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
         this.clock.tick(10);
 
         $(dataGrid.$element()).find('.dx-textbox').dxTextBox('instance').option('value', 'Test');
-        navigationController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.$element()).find('input').get(0) }) });
+        navigationController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.$element()).find('input').get(0) }) });
         this.clock.tick(10);
 
         // assert
@@ -4498,7 +4498,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
         this.clock.tick(10);
 
         $(dataGrid.$element()).find('.dx-textbox').dxTextBox('instance').option('value', 'Test');
-        navigationController._keyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.$element()).find('input').get(0) }) });
+        navigationController._rowsViewKeyDownHandler({ key: 'Tab', keyName: 'tab', originalEvent: $.Event('keydown', { target: $(dataGrid.$element()).find('input').get(0) }) });
         this.clock.tick(10);
 
         // assert
@@ -4563,7 +4563,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
         });
         const keyboardNavigationController = dataGrid.getController('keyboardNavigation');
         const triggerTabPress = function($target, isShiftPressed) {
-            keyboardNavigationController._keyDownHandler({
+            keyboardNavigationController._rowsViewKeyDownHandler({
                 key: 'Tab',
                 keyName: 'tab',
                 shift: !!isShiftPressed,
@@ -4636,7 +4636,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
         });
         const keyboardNavigationController = dataGrid.getController('keyboardNavigation');
         const triggerTabPress = function($target, isShiftPressed) {
-            keyboardNavigationController._keyDownHandler({
+            keyboardNavigationController._rowsViewKeyDownHandler({
                 key: 'Tab',
                 keyName: 'tab',
                 shift: !!isShiftPressed,
@@ -4723,7 +4723,7 @@ QUnit.module('API methods', baseModuleConfig, () => {
                 }, 'lastName']
         });
         const triggerTabPress = function(target) {
-            const keyboardListenerId = dataGrid.getController('keyboardNavigation')._keyDownListener;
+            const keyboardListenerId = dataGrid.getController('keyboardNavigation')._rowsViewKeyDownListener;
 
             keyboard._getProcessor(keyboardListenerId).process({
                 key: 'Tab',
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardController.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardController.tests.js
index 8570f588de8c..80895419e3b9 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardController.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardController.tests.js
@@ -495,7 +495,7 @@ QUnit.module('Keyboard controller', {
         };
 
         // act
-        navigationController._keyDownHandler({
+        navigationController._rowsViewKeyDownHandler({
             keyName: 'leftArrow',
             originalEvent: {
                 preventDefault: commonUtils.noop,
@@ -526,7 +526,7 @@ QUnit.module('Keyboard controller', {
         };
 
         // act
-        navigationController._keyDownHandler({
+        navigationController._rowsViewKeyDownHandler({
             keyName: 'leftArrow',
             originalEvent: {
                 preventDefault: commonUtils.noop,
@@ -561,7 +561,7 @@ QUnit.module('Keyboard controller', {
         navigationController._isLegacyNavigation = () => true;
 
         // act
-        navigationController._keyDownHandler({
+        navigationController._rowsViewKeyDownHandler({
             keyName: 'downArrow',
             originalEvent: {
                 preventDefault: commonUtils.noop,
@@ -596,7 +596,7 @@ QUnit.module('Keyboard controller', {
         navigationController._isLegacyNavigation = () => true;
 
         // act
-        navigationController._keyDownHandler({
+        navigationController._rowsViewKeyDownHandler({
             keyName: 'upArrow',
             originalEvent: {
                 preventDefault: commonUtils.noop,
@@ -722,7 +722,7 @@ QUnit.module('Keyboard controller', {
     });
 
     // T1178858
-    QUnit.testInActiveWindow('Unsubscribe from events when changing the keyboardNavigation.enabled option to false', function(assert) {
+    QUnit.testInActiveWindow('Rows view: Unsubscribe from events when changing the keyboardNavigation.enabled option to false', function(assert) {
         // arrange
         this.options.keyboardNavigation = {
             enabled: true
@@ -743,12 +743,12 @@ QUnit.module('Keyboard controller', {
         callViewsRenderCompleted(this.component._views);
 
         // assert
-        assert.ok(editorFactory.focused.has(navigationController._focusedHandlerWithContext), 'subscribed to the "editorFactory.focused" callback');
-        assert.ok(rowsView.renderCompleted.has(navigationController._renderCompletedWithContext), 'subscribed to the "rowsView.renderCompleted" callback');
+        assert.ok(editorFactory.focused.has(navigationController.focusedHandlerWithContext), 'subscribed to the "editorFactory.focused" callback');
+        assert.ok(rowsView.renderCompleted.has(navigationController.rowsViewRenderCompletedWithContext), 'subscribed to the "rowsView.renderCompleted" callback');
         assert.ok(onSpy.calledWith(document, 'visibilitychange'), 'subscribed to the "visibilitychange" event');
         assert.ok(onSpy.calledWith(element, 'focusin'), 'subscribed to the "focusin" event');
         assert.ok(onSpy.calledWith(element, CLICK_EVENT), 'subscribed to the "pointerdown" event');
-        assert.ok(keyboard._getProcessor(navigationController._keyDownListener), 'subscribed to the "keydown" event');
+        assert.ok(keyboard._getProcessor(navigationController._rowsViewKeyDownListener), 'subscribed to the "keydown" event');
 
         // arrange
         onSpy.resetHistory();
@@ -759,17 +759,17 @@ QUnit.module('Keyboard controller', {
         callViewsRenderCompleted(this.component._views);
 
         // assert
-        assert.notOk(editorFactory.focused.has(navigationController._focusedHandlerWithContext), 'unsubscribed from the "editorFactory.focused" callback');
-        assert.notOk(rowsView.renderCompleted.has(navigationController._renderCompletedWithContext), 'unsubscribed from the "rowsView.renderCompleted" callback');
+        assert.notOk(editorFactory.focused.has(navigationController.focusedHandlerWithContext), 'unsubscribed from the "editorFactory.focused" callback');
+        assert.notOk(rowsView.renderCompleted.has(navigationController.rowsViewRenderCompletedWithContext), 'unsubscribed from the "rowsView.renderCompleted" callback');
         assert.strictEqual(onSpy.callCount, 0, 'call count of the "eventsEngine.on" method');
         assert.ok(offSpy.calledWith(document, 'visibilitychange'), 'unsubscribed from the "visibilitychange" event');
         assert.ok(offSpy.calledWith(element, 'focusin'), 'unsubscribed from the "focusin" event');
         assert.ok(offSpy.calledWith(element, CLICK_EVENT), 'unsubscribed from the "pointerdown" event');
-        assert.notOk(keyboard._getProcessor(navigationController._keyDownListener), 'unsubscribed from the "keydown" event');
+        assert.notOk(keyboard._getProcessor(navigationController._rowsViewKeyDownListener), 'unsubscribed from the "keydown" event');
     });
 
     // T1178858
-    QUnit.testInActiveWindow('Subscribe to events when changing the keyboardNavigation.enabled option to true', function(assert) {
+    QUnit.testInActiveWindow('Rows view: Subscribe to events when changing the keyboardNavigation.enabled option to true', function(assert) {
         // arrange
         this.options.keyboardNavigation = {
             enabled: false
@@ -790,12 +790,12 @@ QUnit.module('Keyboard controller', {
         callViewsRenderCompleted(this.component._views);
 
         // assert
-        assert.notOk(editorFactory.focused.has(navigationController._focusedHandlerWithContext), 'not subscribed to the "editorFactory.focused" callback');
-        assert.notOk(rowsView.renderCompleted.has(navigationController._renderCompletedWithContext), 'not subscribed to the "rowsView.renderCompleted" callback');
+        assert.notOk(editorFactory.focused.has(navigationController.focusedHandlerWithContext), 'not subscribed to the "editorFactory.focused" callback');
+        assert.notOk(rowsView.renderCompleted.has(navigationController.rowsViewRenderCompletedWithContext), 'not subscribed to the "rowsView.renderCompleted" callback');
         assert.notOk(onSpy.calledWith(document, 'visibilitychange'), 'not subscribed to the "visibilitychange" event');
         assert.notOk(onSpy.calledWith(element, 'focusin'), 'not subscribed to the "focusin" event');
         assert.notOk(onSpy.calledWith(element, CLICK_EVENT), 'not subscribed to the "pointerdown" event');
-        assert.notOk(keyboard._getProcessor(navigationController._keyDownListener), 'not subscribed to the "keydown" event');
+        assert.notOk(keyboard._getProcessor(navigationController._rowsViewKeyDownListener), 'not subscribed to the "keydown" event');
 
         // arrange
         onSpy.resetHistory();
@@ -806,11 +806,80 @@ QUnit.module('Keyboard controller', {
         callViewsRenderCompleted(this.component._views);
 
         // assert
-        assert.ok(editorFactory.focused.has(navigationController._focusedHandlerWithContext), 'subscribed to the "editorFactory.focused" callback');
-        assert.ok(rowsView.renderCompleted.has(navigationController._renderCompletedWithContext), 'subscribed to the "rowsView.renderCompleted" callback');
+        assert.ok(editorFactory.focused.has(navigationController.focusedHandlerWithContext), 'subscribed to the "editorFactory.focused" callback');
+        assert.ok(rowsView.renderCompleted.has(navigationController.rowsViewRenderCompletedWithContext), 'subscribed to the "rowsView.renderCompleted" callback');
         assert.ok(onSpy.calledWith(document, 'visibilitychange'), 'subscribed to the "visibilitychange" event');
         assert.ok(onSpy.calledWith(element, 'focusin'), 'subscribed to the "focusin" event');
         assert.ok(onSpy.calledWith(element, CLICK_EVENT), 'subscribed to the "pointerdown" event');
-        assert.ok(keyboard._getProcessor(navigationController._keyDownListener), 'subscribed to the "keydown" event');
+        assert.ok(keyboard._getProcessor(navigationController._rowsViewKeyDownListener), 'subscribed to the "keydown" event');
+    });
+
+    QUnit.testInActiveWindow('Column headers view: Unsubscribe from events when changing the keyboardNavigation.enabled option to false', function(assert) {
+        // arrange
+        this.options.keyboardNavigation = {
+            enabled: true
+        };
+
+        const onSpy = sinon.spy();
+        const offSpy = sinon.spy();
+        const columnHeadersView = this.getView('columnHeadersView');
+        const navigationController = new KeyboardNavigationController(this.component);
+
+        eventsEngine.on = onSpy;
+        eventsEngine.off = offSpy;
+
+        navigationController.init();
+        callViewsRenderCompleted(this.component._views);
+
+        // assert
+        assert.ok(columnHeadersView.renderCompleted.has(navigationController.columnHeadersViewRenderCompletedWithContext), 'subscribed to the "columnHeadersView.renderCompleted" callback');
+        assert.ok(keyboard._getProcessor(navigationController._columnHeadersViewKeyDownListener), 'subscribed to the "keydown" event');
+
+        // arrange
+        onSpy.resetHistory();
+
+        // act
+        navigationController.option('keyboardNavigation.enabled', false);
+        navigationController.optionChanged({ name: 'keyboardNavigation', fullName: 'keyboardNavigation.enabled' });
+        callViewsRenderCompleted(this.component._views);
+
+        // assert
+        assert.notOk(columnHeadersView.renderCompleted.has(navigationController.columnHeadersViewRenderCompletedWithContext), 'unsubscribed from the "columnHeadersView.renderCompleted" callback');
+        assert.notOk(keyboard._getProcessor(navigationController._columnHeadersViewKeyDownListener), 'unsubscribed from the "keydown" event');
+    });
+
+    // T1178858
+    QUnit.testInActiveWindow('Column headers view: Subscribe to events when changing the keyboardNavigation.enabled option to true', function(assert) {
+        // arrange
+        this.options.keyboardNavigation = {
+            enabled: false
+        };
+
+        const onSpy = sinon.spy();
+        const offSpy = sinon.spy();
+        const columnHeadersView = this.getView('columnHeadersView');
+        const navigationController = new KeyboardNavigationController(this.component);
+
+        eventsEngine.on = onSpy;
+        eventsEngine.off = offSpy;
+
+        navigationController.init();
+        callViewsRenderCompleted(this.component._views);
+
+        // assert
+        assert.notOk(columnHeadersView.renderCompleted.has(navigationController.columnHeadersViewRenderCompletedWithContext), 'not subscribed to the "columnHeadersView.renderCompleted" callback');
+        assert.notOk(keyboard._getProcessor(navigationController._columnHeadersViewKeyDownListener), 'not subscribed to the "keydown" event');
+
+        // arrange
+        onSpy.resetHistory();
+
+        // act
+        navigationController.option('keyboardNavigation.enabled', true);
+        navigationController.optionChanged({ name: 'keyboardNavigation', fullName: 'keyboardNavigation.enabled' });
+        callViewsRenderCompleted(this.component._views);
+
+        // assert
+        assert.ok(columnHeadersView.renderCompleted.has(navigationController.columnHeadersViewRenderCompletedWithContext), 'subscribed to the "columnHeadersView.renderCompleted" callback');
+        assert.ok(keyboard._getProcessor(navigationController._columnHeadersViewKeyDownListener), 'subscribed to the "keydown" event');
     });
 });
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardKeys.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardKeys.tests.js
index 5ce5e971a74f..5996aab4694e 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardKeys.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/keyboardNavigation.keyboardKeys.tests.js
@@ -1523,7 +1523,7 @@ QUnit.module('Keyboard keys', {
             isLeftArrow = true;
         };
 
-        this.keyboardNavigationController._keyDownHandler({
+        this.keyboardNavigationController._rowsViewKeyDownHandler({
             keyName: 'leftArrow',
             originalEvent: {
                 isDefaultPrevented: commonUtils.noop,
@@ -1561,7 +1561,7 @@ QUnit.module('Keyboard keys', {
         this.keyboardNavigationController._leftRightKeysHandler = function() {
             isLeftArrow = true;
         };
-        this.keyboardNavigationController._keyDownHandler({
+        this.keyboardNavigationController._rowsViewKeyDownHandler({
             keyName: 'leftArrow',
             originalEvent: {
                 isDefaultPrevented: commonUtils.noop,
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.scheduler/desktopTooltip.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.scheduler/desktopTooltip.tests.js
index 81cda6e8319d..9459e8919f24 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.scheduler/desktopTooltip.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.scheduler/desktopTooltip.tests.js
@@ -9,6 +9,7 @@ import support from '__internal/core/utils/m_support';
 const stubComponent = {
     option: sinon.stub().returns('stubOption'),
     focus: sinon.stub(),
+    setAria: () => {},
 };
 const stubCreateComponent = sinon.stub().returns(stubComponent);
 const stubShowAppointmentPopup = sinon.stub();
@@ -93,7 +94,7 @@ QUnit.test('createComponent should be called with correct options', function(ass
 
     assert.equal(stubCreateComponent.getCall(0).args[0][0].className, 'dx-scheduler-appointment-tooltip-wrapper');
     assert.deepEqual(stubCreateComponent.getCall(0).args[1], Tooltip);
-    assert.equal(Object.keys(stubCreateComponent.getCall(0).args[2]).length, 6);
+    assert.equal(Object.keys(stubCreateComponent.getCall(0).args[2]).length, 7);
     assert.equal(stubCreateComponent.getCall(0).args[2].target, 'target');
     assert.equal(stubCreateComponent.getCall(0).args[2].maxHeight, 200);
     assert.equal(stubCreateComponent.getCall(0).args[2].rtlEnabled, true);
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.treeList/treeList.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.treeList/treeList.tests.js
index 7cc3faaffd12..b1c0fdd16403 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.treeList/treeList.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.treeList/treeList.tests.js
@@ -283,14 +283,14 @@ QUnit.module('Initialization', defaultModuleConfig, () => {
         this.clock.tick(10);
 
         // act
-        navigationController._keyDownHandler({ keyName: 'rightArrow', key: 'ArrowRight', ctrl: true, originalEvent: $.Event('keydown', { target: treeList.getCellElement(1, 0), ctrlKey: true }) });
+        navigationController._rowsViewKeyDownHandler({ keyName: 'rightArrow', key: 'ArrowRight', ctrl: true, originalEvent: $.Event('keydown', { target: treeList.getCellElement(1, 0), ctrlKey: true }) });
         this.clock.tick(10);
 
         // assert
         assert.ok(treeList.isRowExpanded(2), 'second row is expanded');
 
         // act
-        navigationController._keyDownHandler({ keyName: 'leftArrow', key: 'ArrowLeft', ctrl: true, originalEvent: $.Event('keydown', { target: treeList.getCellElement(1, 0), ctrlKey: true }) });
+        navigationController._rowsViewKeyDownHandler({ keyName: 'leftArrow', key: 'ArrowLeft', ctrl: true, originalEvent: $.Event('keydown', { target: treeList.getCellElement(1, 0), ctrlKey: true }) });
         this.clock.tick(10);
 
         // assert
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/button.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/button.tests.js
index 57114da29bf7..812ed5a8a285 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/button.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/button.tests.js
@@ -60,6 +60,17 @@ QUnit.module('Button', function() {
             assert.ok(this.element.hasClass(BUTTON_HAS_TEXT_CLASS, 'button with text has text class'));
         });
 
+        QUnit.test('no error should be raised when hovering if svg icon is used (T1266442)', function(assert) {
+            this.instance.option('icon', '<svg></svg>');
+            try {
+                this.element.trigger('dxhoverstart');
+            } catch(e) {
+                assert.ok(false, `error is handled: ${e}`);
+            }
+
+            assert.ok(this.element.hasClass('dx-state-hover'), 'hovered class is added');
+        });
+
         QUnit.test('onClick', function(assert) {
             const clickHandler = sinon.spy();
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9a096df18f84..a0af0f306016 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -10,13 +10,13 @@ importers:
     devDependencies:
       '@nx/devkit':
         specifier: 18.3.4
-        version: 18.3.4(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+        version: 18.3.4(nx@19.4.2(@swc/core@1.9.2))
       '@nx/jest':
         specifier: 19.4.2
-        version: 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
+        version: 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2))(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
       '@nx/js':
         specifier: 19.4.2
-        version: 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)
+        version: 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)
       '@types/jest':
         specifier: 29.5.12
         version: 29.5.12
@@ -45,8 +45,8 @@ importers:
         specifier: 6.0.2
         version: 6.0.2(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10))(tslint@6.1.3(typescript@5.4.5))
       devextreme-internal-tools:
-        specifier: 16.0.0-beta.16
-        version: 16.0.0-beta.16
+        specifier: 16.0.0-beta.18
+        version: 16.0.0-beta.18
       http-server:
         specifier: 14.1.1
         version: 14.1.1
@@ -55,7 +55,7 @@ importers:
         version: 8.0.3
       jest:
         specifier: 29.7.0
-        version: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+        version: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jspdf-autotable:
         specifier: 3.8.3
         version: 3.8.3(jspdf@2.5.2)
@@ -64,7 +64,7 @@ importers:
         version: 14.0.1(enquirer@2.4.1)
       nx:
         specifier: 19.4.2
-        version: 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+        version: 19.4.2(@swc/core@1.9.2)
       nx-cloud:
         specifier: 19.0.0
         version: 19.0.0
@@ -85,7 +85,7 @@ importers:
         version: 3.0.6
       ts-node:
         specifier: 10.9.2
-        version: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)
+        version: 10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)
       vue:
         specifier: 3.4.27
         version: 3.4.27(typescript@5.4.5)
@@ -143,7 +143,7 @@ importers:
     devDependencies:
       '@angular-devkit/build-angular':
         specifier: 17.3.8
-        version: 17.3.8(ta2xvmedzeu3mme5vju3d2neh4)
+        version: 17.3.8(oj6kjp7stymmgwnpvro3bc4ivi)
       '@angular/cli':
         specifier: 17.3.11
         version: 17.3.11(chokidar@3.6.0)
@@ -164,7 +164,7 @@ importers:
         version: 7.0.3
       ts-node:
         specifier: 10.9.2
-        version: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)
+        version: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)
       typescript:
         specifier: 5.4.5
         version: 5.4.5
@@ -489,7 +489,7 @@ importers:
         version: 1.1.4
       jest:
         specifier: 29.7.0
-        version: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+        version: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-environment-node:
         specifier: 29.7.0
         version: 29.7.0
@@ -537,7 +537,7 @@ importers:
         version: 2.6.2
       ts-node:
         specifier: 10.9.2
-        version: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)
+        version: 10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)
 
   apps/react:
     dependencies:
@@ -562,22 +562,22 @@ importers:
         version: 18.0.11
       css-loader:
         specifier: 6.10.0
-        version: 6.10.0(webpack@5.94.0)
+        version: 6.10.0(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       source-map-loader:
         specifier: 4.0.2
-        version: 4.0.2(webpack@5.94.0)
+        version: 4.0.2(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       style-loader:
         specifier: 3.3.4
-        version: 3.3.4(webpack@5.94.0)
+        version: 3.3.4(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       ts-loader:
         specifier: 9.5.1
-        version: 9.5.1(typescript@5.4.5)(webpack@5.94.0)
+        version: 9.5.1(typescript@5.4.5)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       tsconfig-paths-webpack-plugin:
         specifier: 4.1.0
         version: 4.1.0
       webpack:
         specifier: 5.94.0
-        version: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+        version: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli:
         specifier: 5.1.4
         version: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
@@ -657,19 +657,19 @@ importers:
         version: 2.0.0-beta.7(vue@3.2.47)
       css-loader:
         specifier: 6.10.0
-        version: 6.10.0(webpack@5.94.0)
+        version: 6.10.0(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       minimatch:
         specifier: 4.2.3
         version: 4.2.3
       source-map-loader:
         specifier: 4.0.2
-        version: 4.0.2(webpack@5.94.0)
+        version: 4.0.2(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       style-loader:
         specifier: 3.3.4
-        version: 3.3.4(webpack@5.94.0)
+        version: 3.3.4(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       ts-loader:
         specifier: 9.5.1
-        version: 9.5.1(typescript@4.9.5)(webpack@5.94.0)
+        version: 9.5.1(typescript@4.9.5)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       tsconfig-paths-webpack-plugin:
         specifier: 4.1.0
         version: 4.1.0
@@ -678,16 +678,16 @@ importers:
         version: 4.9.5
       url-loader:
         specifier: 1.1.2
-        version: 1.1.2(webpack@5.94.0)
+        version: 1.1.2(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       vue-loader:
         specifier: 17.4.2
-        version: 17.4.2(@vue/compiler-sfc@3.3.4)(vue@3.2.47)(webpack@5.94.0)
+        version: 17.4.2(@vue/compiler-sfc@3.3.4)(vue@3.2.47)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       vue-router:
         specifier: 4.2.5
         version: 4.2.5(vue@3.2.47)
       webpack:
         specifier: 5.94.0
-        version: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+        version: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli:
         specifier: 5.1.4
         version: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
@@ -744,7 +744,7 @@ importers:
         version: 5.4.11(@types/node@20.12.8)(less@4.2.0)(lightningcss@1.28.1)(sass-embedded@1.66.0)(sass@1.81.0)(terser@5.36.0)
       webpack:
         specifier: 5.94.0
-        version: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@4.10.0)
+        version: 5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0)
       webpack-cli:
         specifier: 4.10.0
         version: 4.10.0(webpack@5.94.0)
@@ -853,25 +853,25 @@ importers:
         version: 7.23.9(@babel/core@7.23.9)
       '@devextreme-generator/angular':
         specifier: 3.0.12
-        version: 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+        version: 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       '@devextreme-generator/build-helpers':
         specifier: 3.0.12
-        version: 3.0.12(ectyjufymdsezb24bv2esmeafq)
+        version: 3.0.12(jx45iv34cplwvde5i3ekp234ua)
       '@devextreme-generator/core':
         specifier: 3.0.12
-        version: 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+        version: 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       '@devextreme-generator/declarations':
         specifier: 3.0.12
         version: 3.0.12
       '@devextreme-generator/inferno':
         specifier: 3.0.12
-        version: 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+        version: 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       '@devextreme-generator/react':
         specifier: 3.0.12
-        version: 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+        version: 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       '@devextreme-generator/vue':
         specifier: 3.0.12
-        version: 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+        version: 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       '@jest/globals':
         specifier: 29.7.0
         version: 29.7.0
@@ -958,7 +958,7 @@ importers:
         version: 17.1.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-devextreme:
         specifier: 1.1.5
-        version: 1.1.5(2wu47vven6w2q4wadgy2aiclqi)
+        version: 1.1.5(dviz67724z5lsegdjr2jecno6q)
       eslint-plugin-i18n:
         specifier: 2.3.0
         version: 2.3.0
@@ -967,7 +967,7 @@ importers:
         version: 2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
       eslint-plugin-jest:
         specifier: 27.6.0
-        version: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+        version: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       eslint-plugin-jest-formatting:
         specifier: 3.1.0
         version: 3.1.0(eslint@8.56.0)
@@ -1195,7 +1195,7 @@ importers:
         version: 1.3.0
       string-replace-loader:
         specifier: 3.1.0
-        version: 3.1.0(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+        version: 3.1.0(webpack@5.94.0(@swc/core@1.9.2))
       stylelint:
         specifier: 15.11.0
         version: 15.11.0(typescript@4.9.5)
@@ -1219,13 +1219,13 @@ importers:
         version: 0.0.11
       terser-webpack-plugin:
         specifier: 5.3.9
-        version: 5.3.9(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+        version: 5.3.9(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2))
       through2:
         specifier: 2.0.5
         version: 2.0.5
       ts-jest:
         specifier: 29.1.2
-        version: 29.1.2(@babel/core@7.23.9)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.23.9))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+        version: 29.1.2(@babel/core@7.23.9)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.23.9))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       tsc-alias:
         specifier: 1.8.10
         version: 1.8.10
@@ -1246,10 +1246,10 @@ importers:
         version: 1.1.0
       webpack:
         specifier: 5.94.0
-        version: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+        version: 5.94.0(@swc/core@1.9.2)
       webpack-stream:
         specifier: 7.0.0
-        version: 7.0.0(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+        version: 7.0.0(webpack@5.94.0(@swc/core@1.9.2))
       yaml:
         specifier: 2.5.0
         version: 2.5.0
@@ -1362,7 +1362,7 @@ importers:
         version: 2.0.1(karma@6.4.4)
       karma-webpack:
         specifier: 5.0.1
-        version: 5.0.1(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+        version: 5.0.1(webpack@5.94.0(@swc/core@1.9.2))
       ng-packagr:
         specifier: 17.3.0
         version: 17.3.0(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(tslib@2.6.3)(typescript@5.4.5)
@@ -1386,7 +1386,7 @@ importers:
         version: 5.4.5
       webpack:
         specifier: 5.94.0
-        version: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+        version: 5.94.0(@swc/core@1.9.2)
       yargs:
         specifier: 17.7.2
         version: 17.7.2
@@ -1402,7 +1402,7 @@ importers:
         version: 29.5.12
       ts-jest:
         specifier: 29.1.3
-        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5)
+        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5)
 
   packages/devextreme-react:
     dependencies:
@@ -1439,7 +1439,7 @@ importers:
         version: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-devextreme:
         specifier: 1.1.5
-        version: 1.1.5(7y2kapk54x3chxrybrye64ikau)
+        version: 1.1.5(6j36mkhhhj37fby37wfpgi52ue)
       gulp:
         specifier: 4.0.2
         version: 4.0.2
@@ -1463,7 +1463,7 @@ importers:
         version: 18.0.0(react@18.0.0)
       ts-jest:
         specifier: 29.1.3
-        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       typescript:
         specifier: 4.9.5
         version: 4.9.5
@@ -1518,7 +1518,7 @@ importers:
         version: 2.0.5
       ts-jest:
         specifier: 29.1.2
-        version: 29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5)
+        version: 29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5)
 
   packages/devextreme-themebuilder:
     dependencies:
@@ -1564,7 +1564,7 @@ importers:
         version: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-devextreme:
         specifier: 1.1.5
-        version: 1.1.5(s7hytideue6mgyvvaok756vzia)
+        version: 1.1.5(zsmfaq7l2ubx6arjipvaytbeca)
       express:
         specifier: 4.20.0
         version: 4.20.0
@@ -1585,10 +1585,10 @@ importers:
         version: 18.0.1
       ts-jest:
         specifier: 29.1.2
-        version: 29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5)
+        version: 29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5)
       ts-node:
         specifier: 10.9.2
-        version: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)
+        version: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)
       typescript:
         specifier: 4.9.5
         version: 4.9.5
@@ -1622,7 +1622,7 @@ importers:
         version: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-devextreme:
         specifier: 1.1.5
-        version: 1.1.5(7y2kapk54x3chxrybrye64ikau)
+        version: 1.1.5(6j36mkhhhj37fby37wfpgi52ue)
       eslint-plugin-spellcheck:
         specifier: 0.0.20
         version: 0.0.20(eslint@8.56.0)
@@ -1643,7 +1643,7 @@ importers:
         version: 29.7.0
       ts-jest:
         specifier: 29.1.3
-        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+        version: 29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       typescript:
         specifier: 4.9.5
         version: 4.9.5
@@ -8106,8 +8106,8 @@ packages:
   devextreme-cldr-data@1.0.3:
     resolution: {integrity: sha512-xd+uWv1KzEhr+ZH/MOWfDei3GFz+NAYyKUR9HgjM9BBwPel7PpMElYp4whM+PtAjziBaTssQnA//ob5c3BovTA==}
 
-  devextreme-internal-tools@16.0.0-beta.16:
-    resolution: {integrity: sha512-yTDikY771EVyribuPu5i+4muK8tgdO/J3Efi785UYhScZqAhQObLwkQgq09PWyK70+e77e+CB+2eDO7wgQvlyw==}
+  devextreme-internal-tools@16.0.0-beta.18:
+    resolution: {integrity: sha512-5JYaE3LGZnO/vFyDWiQzHRAH5gWUO9EplS2ScKn5UwrytJiFcP9+F9LyMuapsw7METKjyJPcYI4gTZDOSdCmhg==}
     engines: {node: '>=12.0.0'}
     hasBin: true
 
@@ -9441,7 +9441,7 @@ packages:
     resolution: {integrity: sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==}
     engines: {node: '>= 4.0'}
     os: [darwin]
-    deprecated: Upgrade to fsevents v2 to mitigate potential security issues
+    deprecated: The v1 package contains DANGEROUS / INSECURE binaries. Upgrade to safe fsevents v2
 
   fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
@@ -16408,11 +16408,11 @@ snapshots:
     transitivePeerDependencies:
       - chokidar
 
-  '@angular-devkit/build-angular@17.3.8(ta2xvmedzeu3mme5vju3d2neh4)':
+  '@angular-devkit/build-angular@17.3.8(oj6kjp7stymmgwnpvro3bc4ivi)':
     dependencies:
       '@ampproject/remapping': 2.3.0
       '@angular-devkit/architect': 0.1703.8(chokidar@3.6.0)
-      '@angular-devkit/build-webpack': 0.1703.8(chokidar@3.6.0)(webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      '@angular-devkit/build-webpack': 0.1703.8(chokidar@3.6.0)(webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       '@angular-devkit/core': 17.3.8(chokidar@3.6.0)
       '@angular/compiler-cli': 17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5)
       '@babel/core': 7.24.0
@@ -16425,16 +16425,16 @@ snapshots:
       '@babel/preset-env': 7.24.0(@babel/core@7.24.0)
       '@babel/runtime': 7.24.0
       '@discoveryjs/json-ext': 0.5.7
-      '@ngtools/webpack': 17.3.8(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      '@ngtools/webpack': 17.3.8(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       '@vitejs/plugin-basic-ssl': 1.1.0(vite@5.1.7(@types/node@20.11.17)(less@4.2.0)(lightningcss@1.28.1)(sass@1.71.1)(terser@5.29.1))
       ansi-colors: 4.1.3
       autoprefixer: 10.4.18(postcss@8.4.35)
-      babel-loader: 9.1.3(@babel/core@7.24.0)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      babel-loader: 9.1.3(@babel/core@7.24.0)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       babel-plugin-istanbul: 6.1.1
       browserslist: 4.24.2
-      copy-webpack-plugin: 11.0.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      copy-webpack-plugin: 11.0.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       critters: 0.0.22
-      css-loader: 6.10.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      css-loader: 6.10.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       esbuild-wasm: 0.20.1
       fast-glob: 3.3.2
       http-proxy-middleware: 2.0.6(@types/express@4.17.21)
@@ -16443,11 +16443,11 @@ snapshots:
       jsonc-parser: 3.2.1
       karma-source-map-support: 1.4.0
       less: 4.2.0
-      less-loader: 11.1.0(less@4.2.0)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
-      license-webpack-plugin: 4.0.2(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      less-loader: 11.1.0(less@4.2.0)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
+      license-webpack-plugin: 4.0.2(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       loader-utils: 3.2.1
       magic-string: 0.30.8
-      mini-css-extract-plugin: 2.8.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      mini-css-extract-plugin: 2.8.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       mrmime: 2.0.0
       open: 8.4.2
       ora: 5.4.1
@@ -16455,13 +16455,13 @@ snapshots:
       picomatch: 4.0.1
       piscina: 4.4.0
       postcss: 8.4.35
-      postcss-loader: 8.1.1(postcss@8.4.35)(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      postcss-loader: 8.1.1(postcss@8.4.35)(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       resolve-url-loader: 5.0.0
       rxjs: 7.8.1
       sass: 1.71.1
-      sass-loader: 14.1.1(sass-embedded@1.66.0)(sass@1.71.1)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      sass-loader: 14.1.1(sass-embedded@1.66.0)(sass@1.71.1)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       semver: 7.6.0
-      source-map-loader: 5.0.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      source-map-loader: 5.0.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       source-map-support: 0.5.21
       terser: 5.29.1
       tree-kill: 1.2.2
@@ -16470,15 +16470,15 @@ snapshots:
       undici: 6.11.1
       vite: 5.1.7(@types/node@20.11.17)(less@4.2.0)(lightningcss@1.28.1)(sass@1.71.1)(terser@5.29.1)
       watchpack: 2.4.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
-      webpack-dev-middleware: 6.1.2(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
-      webpack-dev-server: 4.15.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
+      webpack-dev-middleware: 6.1.2(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
+      webpack-dev-server: 4.15.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       webpack-merge: 5.10.0
-      webpack-subresource-integrity: 5.1.0(html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      webpack-subresource-integrity: 5.1.0(html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
     optionalDependencies:
       '@angular/platform-server': 17.3.12(@angular/animations@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/common@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10))(@angular/platform-browser@17.3.12(@angular/animations@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/common@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))
       esbuild: 0.20.1
-      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       jest-environment-jsdom: 29.7.0
       karma: 6.4.4
       ng-packagr: 17.3.0(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(tslib@2.6.3)(typescript@5.4.5)
@@ -16501,12 +16501,12 @@ snapshots:
       - utf-8-validate
       - webpack-cli
 
-  '@angular-devkit/build-webpack@0.1703.8(chokidar@3.6.0)(webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))':
+  '@angular-devkit/build-webpack@0.1703.8(chokidar@3.6.0)(webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))':
     dependencies:
       '@angular-devkit/architect': 0.1703.8(chokidar@3.6.0)
       rxjs: 7.8.1
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
-      webpack-dev-server: 4.15.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
+      webpack-dev-server: 4.15.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
     transitivePeerDependencies:
       - chokidar
 
@@ -18360,9 +18360,9 @@ snapshots:
     dependencies:
       tslib: 2.3.1
 
-  '@devextreme-generator/angular@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/angular@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
       - eslint
@@ -18377,17 +18377,17 @@ snapshots:
       - eslint-plugin-spellcheck
       - supports-color
 
-  '@devextreme-generator/build-helpers@3.0.12(ectyjufymdsezb24bv2esmeafq)':
+  '@devextreme-generator/build-helpers@3.0.12(jx45iv34cplwvde5i3ekp234ua)':
     dependencies:
-      '@devextreme-generator/angular': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/inferno': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/preact': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/react': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/angular': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/inferno': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/preact': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/react': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       loader-utils: 2.0.4
       typescript: 4.3.5
       vinyl: 2.2.1
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)
     transitivePeerDependencies:
       - '@swc/core'
       - '@typescript-eslint/eslint-plugin'
@@ -18406,10 +18406,10 @@ snapshots:
       - uglify-js
       - webpack-cli
 
-  '@devextreme-generator/core@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/core@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
       code-block-writer: 10.1.1
-      eslint-config-devextreme: 0.2.0(mktse5lvs4n2jhnoaohf3tcuti)
+      eslint-config-devextreme: 0.2.0(atnximysgm2qhxoullfrc4ld7m)
       prettier: 2.8.8
       prettier-eslint: 13.0.0
       typescript: 4.3.5
@@ -18432,11 +18432,11 @@ snapshots:
       react: 17.0.2
       react-dom: 17.0.2(react@17.0.2)
 
-  '@devextreme-generator/inferno@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/inferno@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/preact': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/react': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/preact': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/react': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
       - eslint
@@ -18451,10 +18451,10 @@ snapshots:
       - eslint-plugin-spellcheck
       - supports-color
 
-  '@devextreme-generator/preact@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/preact@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/react': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/react': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
       - eslint
@@ -18469,9 +18469,9 @@ snapshots:
       - eslint-plugin-spellcheck
       - supports-color
 
-  '@devextreme-generator/react@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/react@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
       - eslint
@@ -18486,10 +18486,10 @@ snapshots:
       - eslint-plugin-spellcheck
       - supports-color
 
-  '@devextreme-generator/vue@3.0.12(mktse5lvs4n2jhnoaohf3tcuti)':
+  '@devextreme-generator/vue@3.0.12(atnximysgm2qhxoullfrc4ld7m)':
     dependencies:
-      '@devextreme-generator/angular': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
-      '@devextreme-generator/core': 3.0.12(mktse5lvs4n2jhnoaohf3tcuti)
+      '@devextreme-generator/angular': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
+      '@devextreme-generator/core': 3.0.12(atnximysgm2qhxoullfrc4ld7m)
       prettier: 2.8.8
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
@@ -19015,7 +19015,7 @@ snapshots:
       jest-util: 29.7.0
       slash: 3.0.0
 
-  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))':
+  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))':
     dependencies:
       '@jest/console': 29.7.0
       '@jest/reporters': 29.7.0(node-notifier@9.0.1)
@@ -19029,7 +19029,7 @@ snapshots:
       exit: 0.1.2
       graceful-fs: 4.2.11
       jest-changed-files: 29.7.0
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       jest-haste-map: 29.7.0
       jest-message-util: 29.7.0
       jest-regex-util: 29.6.3
@@ -19052,7 +19052,7 @@ snapshots:
       - supports-color
       - ts-node
 
-  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))':
+  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))':
     dependencies:
       '@jest/console': 29.7.0
       '@jest/reporters': 29.7.0(node-notifier@9.0.1)
@@ -19066,7 +19066,7 @@ snapshots:
       exit: 0.1.2
       graceful-fs: 4.2.11
       jest-changed-files: 29.7.0
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       jest-haste-map: 29.7.0
       jest-message-util: 29.7.0
       jest-regex-util: 29.6.3
@@ -19090,7 +19090,7 @@ snapshots:
       - ts-node
     optional: true
 
-  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))':
+  '@jest/core@29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))':
     dependencies:
       '@jest/console': 29.7.0
       '@jest/reporters': 29.7.0(node-notifier@9.0.1)
@@ -19104,7 +19104,7 @@ snapshots:
       exit: 0.1.2
       graceful-fs: 4.2.11
       jest-changed-files: 29.7.0
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-haste-map: 29.7.0
       jest-message-util: 29.7.0
       jest-regex-util: 29.6.3
@@ -19420,11 +19420,11 @@ snapshots:
       pump: 3.0.2
       tar-fs: 2.1.1
 
-  '@ngtools/webpack@17.3.8(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))':
+  '@ngtools/webpack@17.3.8(@angular/compiler-cli@17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5))(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))':
     dependencies:
       '@angular/compiler-cli': 17.3.12(@angular/compiler@17.3.12(@angular/core@17.3.12(rxjs@7.8.1)(zone.js@0.14.10)))(typescript@5.4.5)
       typescript: 5.4.5
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   '@nicolo-ribaudo/eslint-scope-5-internals@5.1.1-v1':
     dependencies:
@@ -19506,21 +19506,21 @@ snapshots:
       - bluebird
       - supports-color
 
-  '@nrwl/devkit@18.3.4(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))':
+  '@nrwl/devkit@18.3.4(nx@19.4.2(@swc/core@1.9.2))':
     dependencies:
-      '@nx/devkit': 18.3.4(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      '@nx/devkit': 18.3.4(nx@19.4.2(@swc/core@1.9.2))
     transitivePeerDependencies:
       - nx
 
-  '@nrwl/devkit@19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))':
+  '@nrwl/devkit@19.4.2(nx@19.4.2(@swc/core@1.9.2))':
     dependencies:
-      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2))
     transitivePeerDependencies:
       - nx
 
-  '@nrwl/jest@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)':
+  '@nrwl/jest@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2))(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)':
     dependencies:
-      '@nx/jest': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
+      '@nx/jest': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2))(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
     transitivePeerDependencies:
       - '@babel/traverse'
       - '@swc-node/register'
@@ -19536,9 +19536,9 @@ snapshots:
       - typescript
       - verdaccio
 
-  '@nrwl/js@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)':
+  '@nrwl/js@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)':
     dependencies:
-      '@nx/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)
+      '@nx/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)
     transitivePeerDependencies:
       - '@babel/traverse'
       - '@swc-node/register'
@@ -19557,59 +19557,59 @@ snapshots:
     transitivePeerDependencies:
       - debug
 
-  '@nrwl/tao@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))':
+  '@nrwl/tao@19.4.2(@swc/core@1.9.2)':
     dependencies:
-      nx: 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      nx: 19.4.2(@swc/core@1.9.2)
       tslib: 2.6.3
     transitivePeerDependencies:
       - '@swc-node/register'
       - '@swc/core'
       - debug
 
-  '@nrwl/workspace@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))':
+  '@nrwl/workspace@19.4.2(@swc/core@1.9.2)':
     dependencies:
-      '@nx/workspace': 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      '@nx/workspace': 19.4.2(@swc/core@1.9.2)
     transitivePeerDependencies:
       - '@swc-node/register'
       - '@swc/core'
       - debug
 
-  '@nx/devkit@18.3.4(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))':
+  '@nx/devkit@18.3.4(nx@19.4.2(@swc/core@1.9.2))':
     dependencies:
-      '@nrwl/devkit': 18.3.4(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      '@nrwl/devkit': 18.3.4(nx@19.4.2(@swc/core@1.9.2))
       ejs: 3.1.10
       enquirer: 2.3.6
       ignore: 5.3.1
-      nx: 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      nx: 19.4.2(@swc/core@1.9.2)
       semver: 7.6.3
       tmp: 0.2.3
       tslib: 2.6.3
       yargs-parser: 21.1.1
 
-  '@nx/devkit@19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))':
+  '@nx/devkit@19.4.2(nx@19.4.2(@swc/core@1.9.2))':
     dependencies:
-      '@nrwl/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      '@nrwl/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2))
       ejs: 3.1.10
       enquirer: 2.3.6
       ignore: 5.3.1
       minimatch: 9.0.3
-      nx: 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      nx: 19.4.2(@swc/core@1.9.2)
       semver: 7.6.3
       tmp: 0.2.3
       tslib: 2.6.3
       yargs-parser: 21.1.1
 
-  '@nx/jest@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)':
+  '@nx/jest@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2))(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)':
     dependencies:
       '@jest/reporters': 29.7.0(node-notifier@9.0.1)
       '@jest/test-result': 29.7.0
-      '@nrwl/jest': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
-      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
-      '@nx/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)
+      '@nrwl/jest': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(node-notifier@9.0.1)(nx@19.4.2(@swc/core@1.9.2))(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))(typescript@5.4.5)
+      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2))
+      '@nx/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)
       '@phenomnomnominal/tsquery': 5.0.1(typescript@5.4.5)
       chalk: 4.1.2
       identity-obj-proxy: 3.0.0
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-resolve: 29.7.0
       jest-util: 29.7.0
       minimatch: 9.0.3
@@ -19631,7 +19631,7 @@ snapshots:
       - typescript
       - verdaccio
 
-  '@nx/js@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)':
+  '@nx/js@19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)':
     dependencies:
       '@babel/core': 7.23.9
       '@babel/plugin-proposal-decorators': 7.25.9(@babel/core@7.23.9)
@@ -19640,9 +19640,9 @@ snapshots:
       '@babel/preset-env': 7.23.9(@babel/core@7.23.9)
       '@babel/preset-typescript': 7.26.0(@babel/core@7.23.9)
       '@babel/runtime': 7.26.0
-      '@nrwl/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))(typescript@5.4.5)
-      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
-      '@nx/workspace': 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      '@nrwl/js': 19.4.2(@babel/traverse@7.25.9)(@swc/core@1.9.2)(@types/node@20.12.8)(nx@19.4.2(@swc/core@1.9.2))(typescript@5.4.5)
+      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2))
+      '@nx/workspace': 19.4.2(@swc/core@1.9.2)
       babel-plugin-const-enum: 1.2.0(@babel/core@7.23.9)
       babel-plugin-macros: 2.8.0
       babel-plugin-transform-typescript-metadata: 0.3.2(@babel/core@7.23.9)(@babel/traverse@7.25.9)
@@ -19659,7 +19659,7 @@ snapshots:
       ora: 5.3.0
       semver: 7.6.3
       source-map-support: 0.5.19
-      ts-node: 10.9.1(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)
+      ts-node: 10.9.1(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)
       tsconfig-paths: 4.2.0
       tslib: 2.6.3
     transitivePeerDependencies:
@@ -19703,13 +19703,13 @@ snapshots:
   '@nx/nx-win32-x64-msvc@19.4.2':
     optional: true
 
-  '@nx/workspace@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))':
+  '@nx/workspace@19.4.2(@swc/core@1.9.2)':
     dependencies:
-      '@nrwl/workspace': 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
-      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      '@nrwl/workspace': 19.4.2(@swc/core@1.9.2)
+      '@nx/devkit': 19.4.2(nx@19.4.2(@swc/core@1.9.2))
       chalk: 4.1.2
       enquirer: 2.3.6
-      nx: 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      nx: 19.4.2(@swc/core@1.9.2)
       tslib: 2.6.3
       yargs-parser: 21.1.1
     transitivePeerDependencies:
@@ -22719,33 +22719,33 @@ snapshots:
 
   '@webcomponents/custom-elements@1.6.0': {}
 
-  '@webpack-cli/configtest@1.2.0(webpack-cli@4.10.0)(webpack@5.94.0)':
+  '@webpack-cli/configtest@1.2.0(webpack-cli@4.10.0(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0))':
     dependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@4.10.0)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0)
       webpack-cli: 4.10.0(webpack@5.94.0)
 
-  '@webpack-cli/configtest@2.1.1(webpack-cli@5.1.4)(webpack@5.94.0)':
+  '@webpack-cli/configtest@2.1.1(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))':
     dependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
 
-  '@webpack-cli/info@1.5.0(webpack-cli@4.10.0)':
+  '@webpack-cli/info@1.5.0(webpack-cli@4.10.0(webpack@5.94.0))':
     dependencies:
       envinfo: 7.14.0
       webpack-cli: 4.10.0(webpack@5.94.0)
 
-  '@webpack-cli/info@2.0.2(webpack-cli@5.1.4)(webpack@5.94.0)':
+  '@webpack-cli/info@2.0.2(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))':
     dependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
 
-  '@webpack-cli/serve@1.7.0(webpack-cli@4.10.0)':
+  '@webpack-cli/serve@1.7.0(webpack-cli@4.10.0(webpack@5.94.0))':
     dependencies:
       webpack-cli: 4.10.0(webpack@5.94.0)
 
-  '@webpack-cli/serve@2.0.5(webpack-cli@5.1.4)(webpack-dev-server@4.15.1)(webpack@5.94.0)':
+  '@webpack-cli/serve@2.0.5(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))':
     dependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
     optionalDependencies:
       webpack-dev-server: 4.15.1(webpack-cli@5.1.4)(webpack@5.94.0)
@@ -23437,12 +23437,12 @@ snapshots:
       - supports-color
     optional: true
 
-  babel-loader@9.1.3(@babel/core@7.24.0)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  babel-loader@9.1.3(@babel/core@7.24.0)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       '@babel/core': 7.24.0
       find-cache-dir: 4.0.0
       schema-utils: 4.2.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   babel-loader@9.2.1(@babel/core@7.23.9)(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)):
     dependencies:
@@ -24678,7 +24678,7 @@ snapshots:
       each-props: 1.3.2
       is-plain-object: 5.0.0
 
-  copy-webpack-plugin@11.0.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  copy-webpack-plugin@11.0.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       fast-glob: 3.3.2
       glob-parent: 6.0.2
@@ -24686,7 +24686,7 @@ snapshots:
       normalize-path: 3.0.0
       schema-utils: 4.2.0
       serialize-javascript: 6.0.2
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   core-js-compat@3.39.0:
     dependencies:
@@ -24790,13 +24790,13 @@ snapshots:
       safe-buffer: 5.2.1
       sha.js: 2.4.11
 
-  create-jest@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)):
+  create-jest@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)):
     dependencies:
       '@jest/types': 29.6.3
       chalk: 4.1.2
       exit: 0.1.2
       graceful-fs: 4.2.11
-      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       jest-util: 29.7.0
       prompts: 2.4.2
     transitivePeerDependencies:
@@ -24805,13 +24805,13 @@ snapshots:
       - supports-color
       - ts-node
 
-  create-jest@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)):
+  create-jest@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)):
     dependencies:
       '@jest/types': 29.6.3
       chalk: 4.1.2
       exit: 0.1.2
       graceful-fs: 4.2.11
-      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       jest-util: 29.7.0
       prompts: 2.4.2
     transitivePeerDependencies:
@@ -24821,13 +24821,13 @@ snapshots:
       - ts-node
     optional: true
 
-  create-jest@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)):
+  create-jest@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)):
     dependencies:
       '@jest/types': 29.6.3
       chalk: 4.1.2
       exit: 0.1.2
       graceful-fs: 4.2.11
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       prompts: 2.4.2
     transitivePeerDependencies:
@@ -24892,7 +24892,7 @@ snapshots:
       utrie: 1.0.2
     optional: true
 
-  css-loader@6.10.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  css-loader@6.10.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       icss-utils: 5.1.0(postcss@8.4.38)
       postcss: 8.4.38
@@ -24903,7 +24903,7 @@ snapshots:
       postcss-value-parser: 4.2.0
       semver: 7.6.3
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   css-loader@6.10.0(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)):
     dependencies:
@@ -24918,7 +24918,7 @@ snapshots:
     optionalDependencies:
       webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)
 
-  css-loader@6.10.0(webpack@5.94.0):
+  css-loader@6.10.0(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       icss-utils: 5.1.0(postcss@8.4.38)
       postcss: 8.4.38
@@ -24929,7 +24929,7 @@ snapshots:
       postcss-value-parser: 4.2.0
       semver: 7.6.3
     optionalDependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
   css-select@4.3.0:
     dependencies:
@@ -25370,7 +25370,7 @@ snapshots:
 
   devextreme-cldr-data@1.0.3: {}
 
-  devextreme-internal-tools@16.0.0-beta.16:
+  devextreme-internal-tools@16.0.0-beta.18:
     dependencies:
       dasherize: 2.0.0
       deepmerge: 4.3.1
@@ -26194,60 +26194,60 @@ snapshots:
       eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
 
-  eslint-config-devextreme@0.2.0(mktse5lvs4n2jhnoaohf3tcuti):
+  eslint-config-devextreme@0.2.0(atnximysgm2qhxoullfrc4ld7m):
     dependencies:
       '@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
       eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-plugin-import: 2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
-      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       eslint-plugin-jest-formatting: 3.1.0(eslint@8.56.0)
       eslint-plugin-jsx-a11y: 6.8.0(eslint@8.56.0)
       eslint-plugin-qunit: 7.3.4(eslint@8.56.0)
       eslint-plugin-rulesdir: 0.2.2
       eslint-plugin-spellcheck: 0.0.20(eslint@8.56.0)
 
-  eslint-config-devextreme@1.1.5(2wu47vven6w2q4wadgy2aiclqi):
+  eslint-config-devextreme@1.1.5(6j36mkhhhj37fby37wfpgi52ue):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
+      '@typescript-eslint/eslint-plugin': 6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
-      eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
-      eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
-      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
-      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+      eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
+      eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
+      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
+      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       eslint-plugin-jest-formatting: 3.1.0(eslint@8.56.0)
       eslint-plugin-jsx-a11y: 6.8.0(eslint@8.56.0)
       eslint-plugin-qunit: 7.3.4(eslint@8.56.0)
       eslint-plugin-rulesdir: 0.2.2
       eslint-plugin-spellcheck: 0.0.20(eslint@8.56.0)
-      stylelint: 15.11.0(typescript@4.9.5)
-      stylelint-config-standard: 35.0.0(stylelint@15.11.0(typescript@4.9.5))
+      stylelint: 16.5.0(typescript@4.9.5)
+      stylelint-config-standard: 35.0.0(stylelint@16.5.0(typescript@4.9.5))
 
-  eslint-config-devextreme@1.1.5(7y2kapk54x3chxrybrye64ikau):
+  eslint-config-devextreme@1.1.5(dviz67724z5lsegdjr2jecno6q):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
+      '@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
-      eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
-      eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
-      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
-      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
+      eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
+      eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
+      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
+      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5)
       eslint-plugin-jest-formatting: 3.1.0(eslint@8.56.0)
       eslint-plugin-jsx-a11y: 6.8.0(eslint@8.56.0)
       eslint-plugin-qunit: 7.3.4(eslint@8.56.0)
       eslint-plugin-rulesdir: 0.2.2
       eslint-plugin-spellcheck: 0.0.20(eslint@8.56.0)
-      stylelint: 16.5.0(typescript@4.9.5)
-      stylelint-config-standard: 35.0.0(stylelint@16.5.0(typescript@4.9.5))
+      stylelint: 15.11.0(typescript@4.9.5)
+      stylelint-config-standard: 35.0.0(stylelint@15.11.0(typescript@4.9.5))
 
-  eslint-config-devextreme@1.1.5(s7hytideue6mgyvvaok756vzia):
+  eslint-config-devextreme@1.1.5(zsmfaq7l2ubx6arjipvaytbeca):
     dependencies:
       '@typescript-eslint/eslint-plugin': 6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
       eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-config-airbnb-typescript: 17.1.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0))(eslint@8.56.0)
       eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)
-      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5)
+      eslint-plugin-jest: 27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5)
       eslint-plugin-jest-formatting: 3.1.0(eslint@8.56.0)
       eslint-plugin-jsx-a11y: 6.8.0(eslint@8.56.0)
       eslint-plugin-qunit: 7.3.4(eslint@8.56.0)
@@ -26360,35 +26360,35 @@ snapshots:
     dependencies:
       eslint: 8.56.0
 
-  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
+  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
     dependencies:
       '@typescript-eslint/utils': 5.62.0(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
     optionalDependencies:
       '@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
     transitivePeerDependencies:
       - supports-color
       - typescript
 
-  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5):
+  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5):
     dependencies:
       '@typescript-eslint/utils': 5.62.0(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
     optionalDependencies:
       '@typescript-eslint/eslint-plugin': 6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
-      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
     transitivePeerDependencies:
       - supports-color
       - typescript
 
-  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
+  eslint-plugin-jest@27.6.0(@typescript-eslint/eslint-plugin@6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
     dependencies:
       '@typescript-eslint/utils': 5.62.0(eslint@8.56.0)(typescript@4.9.5)
       eslint: 8.56.0
     optionalDependencies:
       '@typescript-eslint/eslint-plugin': 6.21.0(@typescript-eslint/parser@6.21.0(eslint@8.56.0)(typescript@4.9.5))(eslint@8.56.0)(typescript@4.9.5)
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -28224,7 +28224,7 @@ snapshots:
 
   html-void-elements@3.0.0: {}
 
-  html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       '@types/html-minifier-terser': 6.1.0
       html-minifier-terser: 6.1.0
@@ -28232,7 +28232,7 @@ snapshots:
       pretty-error: 4.0.0
       tapable: 2.2.1
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
     optional: true
 
   html-webpack-plugin@5.6.3(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)):
@@ -29065,16 +29065,16 @@ snapshots:
       - babel-plugin-macros
       - supports-color
 
-  jest-cli@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)):
+  jest-cli@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       '@jest/test-result': 29.7.0
       '@jest/types': 29.6.3
       chalk: 4.1.2
-      create-jest: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      create-jest: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       exit: 0.1.2
       import-local: 3.2.0
-      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       jest-util: 29.7.0
       jest-validate: 29.7.0
       yargs: 17.7.2
@@ -29086,16 +29086,16 @@ snapshots:
       - supports-color
       - ts-node
 
-  jest-cli@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)):
+  jest-cli@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       '@jest/test-result': 29.7.0
       '@jest/types': 29.6.3
       chalk: 4.1.2
-      create-jest: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      create-jest: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       exit: 0.1.2
       import-local: 3.2.0
-      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       jest-util: 29.7.0
       jest-validate: 29.7.0
       yargs: 17.7.2
@@ -29108,16 +29108,16 @@ snapshots:
       - ts-node
     optional: true
 
-  jest-cli@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)):
+  jest-cli@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       '@jest/test-result': 29.7.0
       '@jest/types': 29.6.3
       chalk: 4.1.2
-      create-jest: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      create-jest: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       exit: 0.1.2
       import-local: 3.2.0
-      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest-config: 29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       jest-validate: 29.7.0
       yargs: 17.7.2
@@ -29129,7 +29129,7 @@ snapshots:
       - supports-color
       - ts-node
 
-  jest-config@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)):
+  jest-config@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)):
     dependencies:
       '@babel/core': 7.23.9
       '@jest/test-sequencer': 29.7.0
@@ -29155,12 +29155,12 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.11.17
-      ts-node: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)
+      ts-node: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
 
-  jest-config@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)):
+  jest-config@29.7.0(@types/node@20.11.17)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)):
     dependencies:
       '@babel/core': 7.23.9
       '@jest/test-sequencer': 29.7.0
@@ -29186,13 +29186,13 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.11.17
-      ts-node: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)
+      ts-node: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
     optional: true
 
-  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)):
+  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)):
     dependencies:
       '@babel/core': 7.23.9
       '@jest/test-sequencer': 29.7.0
@@ -29218,12 +29218,12 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.12.8
-      ts-node: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)
+      ts-node: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
 
-  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)):
+  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)):
     dependencies:
       '@babel/core': 7.23.9
       '@jest/test-sequencer': 29.7.0
@@ -29249,13 +29249,13 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.12.8
-      ts-node: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)
+      ts-node: 10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
     optional: true
 
-  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)):
+  jest-config@29.7.0(@types/node@20.12.8)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)):
     dependencies:
       '@babel/core': 7.23.9
       '@jest/test-sequencer': 29.7.0
@@ -29281,7 +29281,7 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.12.8
-      ts-node: 10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)
+      ts-node: 10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
@@ -29527,12 +29527,12 @@ snapshots:
       merge-stream: 2.0.0
       supports-color: 8.1.1
 
-  jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)):
+  jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       '@jest/types': 29.6.3
       import-local: 3.2.0
-      jest-cli: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest-cli: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
     optionalDependencies:
       node-notifier: 9.0.1
     transitivePeerDependencies:
@@ -29541,12 +29541,12 @@ snapshots:
       - supports-color
       - ts-node
 
-  jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5)):
+  jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
       '@jest/types': 29.6.3
       import-local: 3.2.0
-      jest-cli: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5))
+      jest-cli: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5))
     optionalDependencies:
       node-notifier: 9.0.1
     transitivePeerDependencies:
@@ -29556,12 +29556,12 @@ snapshots:
       - ts-node
     optional: true
 
-  jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)):
+  jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)):
     dependencies:
-      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      '@jest/core': 29.7.0(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       '@jest/types': 29.6.3
       import-local: 3.2.0
-      jest-cli: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest-cli: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
     optionalDependencies:
       node-notifier: 9.0.1
     transitivePeerDependencies:
@@ -29809,11 +29809,11 @@ snapshots:
     dependencies:
       source-map-support: 0.5.21
 
-  karma-webpack@5.0.1(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))):
+  karma-webpack@5.0.1(webpack@5.94.0(@swc/core@1.9.2)):
     dependencies:
       glob: 7.2.3
       minimatch: 9.0.5
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)
       webpack-merge: 4.2.2
 
   karma@6.4.4:
@@ -29923,11 +29923,11 @@ snapshots:
 
   lead@4.0.0: {}
 
-  less-loader@11.1.0(less@4.2.0)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  less-loader@11.1.0(less@4.2.0)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       klona: 2.0.6
       less: 4.2.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   less@4.2.0:
     dependencies:
@@ -29950,11 +29950,11 @@ snapshots:
       prelude-ls: 1.2.1
       type-check: 0.4.0
 
-  license-webpack-plugin@4.0.2(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  license-webpack-plugin@4.0.2(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       webpack-sources: 3.2.3
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   lie@3.3.0:
     dependencies:
@@ -30709,11 +30709,11 @@ snapshots:
 
   min-indent@1.0.1: {}
 
-  mini-css-extract-plugin@2.8.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  mini-css-extract-plugin@2.8.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       schema-utils: 4.2.0
       tapable: 2.2.1
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   minimalistic-assert@1.0.1: {}
 
@@ -31251,9 +31251,9 @@ snapshots:
     transitivePeerDependencies:
       - debug
 
-  nx@19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15)):
+  nx@19.4.2(@swc/core@1.9.2):
     dependencies:
-      '@nrwl/tao': 19.4.2(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      '@nrwl/tao': 19.4.2(@swc/core@1.9.2)
       '@yarnpkg/lockfile': 1.1.0
       '@yarnpkg/parsers': 3.0.0-rc.46
       '@zkochan/js-yaml': 0.0.7
@@ -31934,14 +31934,14 @@ snapshots:
       postcss: 8.4.38
       postcss-safe-parser: 6.0.0(postcss@8.4.38)
 
-  postcss-loader@8.1.1(postcss@8.4.35)(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  postcss-loader@8.1.1(postcss@8.4.35)(typescript@5.4.5)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       cosmiconfig: 9.0.0(typescript@5.4.5)
       jiti: 1.21.6
       postcss: 8.4.35
       semver: 7.6.0
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
     transitivePeerDependencies:
       - typescript
 
@@ -33100,13 +33100,13 @@ snapshots:
       sass-embedded-win32-ia32: 1.66.0
       sass-embedded-win32-x64: 1.66.0
 
-  sass-loader@14.1.1(sass-embedded@1.66.0)(sass@1.71.1)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  sass-loader@14.1.1(sass-embedded@1.66.0)(sass@1.71.1)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       neo-async: 2.6.2
     optionalDependencies:
       sass: 1.71.1
       sass-embedded: 1.66.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   sass-lookup@5.0.1:
     dependencies:
@@ -33473,17 +33473,17 @@ snapshots:
 
   source-map-js@1.2.1: {}
 
-  source-map-loader@4.0.2(webpack@5.94.0):
+  source-map-loader@4.0.2(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       iconv-lite: 0.6.3
       source-map-js: 1.2.1
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
-  source-map-loader@5.0.0(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  source-map-loader@5.0.0(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       iconv-lite: 0.6.3
       source-map-js: 1.2.1
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   source-map-resolve@0.5.3:
     dependencies:
@@ -33716,11 +33716,11 @@ snapshots:
       char-regex: 1.0.2
       strip-ansi: 6.0.1
 
-  string-replace-loader@3.1.0(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))):
+  string-replace-loader@3.1.0(webpack@5.94.0(@swc/core@1.9.2)):
     dependencies:
       loader-utils: 2.0.4
       schema-utils: 3.3.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)
 
   string-width@1.0.2:
     dependencies:
@@ -33857,9 +33857,9 @@ snapshots:
     dependencies:
       webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)
 
-  style-loader@3.3.4(webpack@5.94.0):
+  style-loader@3.3.4(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
   style-search@0.1.0: {}
 
@@ -34332,37 +34332,48 @@ snapshots:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
       esbuild: 0.18.20
 
-  terser-webpack-plugin@5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  terser-webpack-plugin@5.3.10(@swc/core@1.9.2)(esbuild@0.20.1)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.2
       terser: 5.36.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
       esbuild: 0.20.1
 
-  terser-webpack-plugin@5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))):
+  terser-webpack-plugin@5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0)):
+    dependencies:
+      '@jridgewell/trace-mapping': 0.3.25
+      jest-worker: 27.5.1
+      schema-utils: 3.3.0
+      serialize-javascript: 6.0.2
+      terser: 5.36.0
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0)
+    optionalDependencies:
+      '@swc/core': 1.9.2(@swc/helpers@0.5.15)
+
+  terser-webpack-plugin@5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.2
       terser: 5.36.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
-  terser-webpack-plugin@5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0):
+  terser-webpack-plugin@5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.2
       terser: 5.36.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
@@ -34378,14 +34389,14 @@ snapshots:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
       esbuild: 0.18.20
 
-  terser-webpack-plugin@5.3.9(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))):
+  terser-webpack-plugin@5.3.9(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.2
       terser: 5.36.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
@@ -34974,11 +34985,11 @@ snapshots:
 
   ts-dedent@2.2.0: {}
 
-  ts-jest@29.1.2(@babel/core@7.23.9)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.23.9))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
+  ts-jest@29.1.2(@babel/core@7.23.9)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.23.9))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       json5: 2.2.3
       lodash.memoize: 4.1.2
@@ -34991,11 +35002,11 @@ snapshots:
       '@jest/types': 29.6.3
       babel-jest: 29.7.0(@babel/core@7.23.9)
 
-  ts-jest@29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5):
+  ts-jest@29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5)))(typescript@4.9.5):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5))
+      jest: 29.7.0(@types/node@20.11.17)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5))
       jest-util: 29.7.0
       json5: 2.2.3
       lodash.memoize: 4.1.2
@@ -35008,11 +35019,11 @@ snapshots:
       '@jest/types': 29.6.3
       babel-jest: 29.7.0(@babel/core@7.24.0)
 
-  ts-jest@29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5):
+  ts-jest@29.1.2(@babel/core@7.24.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       json5: 2.2.3
       lodash.memoize: 4.1.2
@@ -35025,11 +35036,11 @@ snapshots:
       '@jest/types': 29.6.3
       babel-jest: 29.7.0(@babel/core@7.24.0)
 
-  ts-jest@29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
+  ts-jest@29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@4.9.5):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       json5: 2.2.3
       lodash.memoize: 4.1.2
@@ -35043,11 +35054,11 @@ snapshots:
       '@jest/types': 29.6.3
       babel-jest: 29.7.0(@babel/core@7.24.0)
 
-  ts-jest@29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5):
+  ts-jest@29.1.3(@babel/core@7.24.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.24.0))(jest@29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5)))(typescript@5.4.5):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5))
+      jest: 29.7.0(@types/node@20.12.8)(node-notifier@9.0.1)(ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5))
       jest-util: 29.7.0
       json5: 2.2.3
       lodash.memoize: 4.1.2
@@ -35061,7 +35072,7 @@ snapshots:
       '@jest/types': 29.6.3
       babel-jest: 29.7.0(@babel/core@7.24.0)
 
-  ts-loader@9.5.1(typescript@4.9.5)(webpack@5.94.0):
+  ts-loader@9.5.1(typescript@4.9.5)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       chalk: 4.1.2
       enhanced-resolve: 5.17.1
@@ -35069,9 +35080,9 @@ snapshots:
       semver: 7.6.3
       source-map: 0.7.4
       typescript: 4.9.5
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
-  ts-loader@9.5.1(typescript@5.4.5)(webpack@5.94.0):
+  ts-loader@9.5.1(typescript@5.4.5)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       chalk: 4.1.2
       enhanced-resolve: 5.17.1
@@ -35079,9 +35090,9 @@ snapshots:
       semver: 7.6.3
       source-map: 0.7.4
       typescript: 5.4.5
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
-  ts-node@10.9.1(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5):
+  ts-node@10.9.1(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
       '@tsconfig/node10': 1.0.11
@@ -35101,7 +35112,7 @@ snapshots:
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
-  ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@4.9.5):
+  ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@4.9.5):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
       '@tsconfig/node10': 1.0.11
@@ -35121,7 +35132,7 @@ snapshots:
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
-  ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.11.17)(typescript@5.4.5):
+  ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.11.17)(typescript@5.4.5):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
       '@tsconfig/node10': 1.0.11
@@ -35141,7 +35152,7 @@ snapshots:
     optionalDependencies:
       '@swc/core': 1.9.2(@swc/helpers@0.5.15)
 
-  ts-node@10.9.2(@swc/core@1.9.2(@swc/helpers@0.5.15))(@types/node@20.12.8)(typescript@5.4.5):
+  ts-node@10.9.2(@swc/core@1.9.2)(@types/node@20.12.8)(typescript@5.4.5):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
       '@tsconfig/node10': 1.0.11
@@ -35526,12 +35537,12 @@ snapshots:
 
   url-join@4.0.1: {}
 
-  url-loader@1.1.2(webpack@5.94.0):
+  url-loader@1.1.2(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       loader-utils: 1.4.2
       mime: 2.6.0
       schema-utils: 1.0.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
   url-parse@1.5.10:
     dependencies:
@@ -35820,12 +35831,12 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  vue-loader@17.4.2(@vue/compiler-sfc@3.3.4)(vue@3.2.47)(webpack@5.94.0):
+  vue-loader@17.4.2(@vue/compiler-sfc@3.3.4)(vue@3.2.47)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       chalk: 4.1.2
       hash-sum: 2.0.0
       watchpack: 2.4.2
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
     optionalDependencies:
       '@vue/compiler-sfc': 3.3.4
       vue: 3.2.47
@@ -35896,9 +35907,9 @@ snapshots:
   webpack-cli@4.10.0(webpack@5.94.0):
     dependencies:
       '@discoveryjs/json-ext': 0.5.7
-      '@webpack-cli/configtest': 1.2.0(webpack-cli@4.10.0)(webpack@5.94.0)
-      '@webpack-cli/info': 1.5.0(webpack-cli@4.10.0)
-      '@webpack-cli/serve': 1.7.0(webpack-cli@4.10.0)
+      '@webpack-cli/configtest': 1.2.0(webpack-cli@4.10.0(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0))
+      '@webpack-cli/info': 1.5.0(webpack-cli@4.10.0(webpack@5.94.0))
+      '@webpack-cli/serve': 1.7.0(webpack-cli@4.10.0(webpack@5.94.0))
       colorette: 2.0.20
       commander: 7.2.0
       cross-spawn: 7.0.6
@@ -35906,15 +35917,15 @@ snapshots:
       import-local: 3.2.0
       interpret: 2.2.0
       rechoir: 0.7.1
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@4.10.0)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0)
       webpack-merge: 5.10.0
 
   webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0):
     dependencies:
       '@discoveryjs/json-ext': 0.5.7
-      '@webpack-cli/configtest': 2.1.1(webpack-cli@5.1.4)(webpack@5.94.0)
-      '@webpack-cli/info': 2.0.2(webpack-cli@5.1.4)(webpack@5.94.0)
-      '@webpack-cli/serve': 2.0.5(webpack-cli@5.1.4)(webpack-dev-server@4.15.1)(webpack@5.94.0)
+      '@webpack-cli/configtest': 2.1.1(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
+      '@webpack-cli/info': 2.0.2(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
+      '@webpack-cli/serve': 2.0.5(webpack-cli@5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0))(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       colorette: 2.0.20
       commander: 10.0.1
       cross-spawn: 7.0.6
@@ -35923,19 +35934,19 @@ snapshots:
       import-local: 3.2.0
       interpret: 3.1.1
       rechoir: 0.8.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-merge: 5.10.0
     optionalDependencies:
       webpack-dev-server: 4.15.1(webpack-cli@5.1.4)(webpack@5.94.0)
 
-  webpack-dev-middleware@5.3.4(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  webpack-dev-middleware@5.3.4(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       colorette: 2.0.20
       memfs: 3.5.3
       mime-types: 2.1.35
       range-parser: 1.2.1
       schema-utils: 4.2.0
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   webpack-dev-middleware@5.3.4(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)):
     dependencies:
@@ -35947,16 +35958,16 @@ snapshots:
       webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)
     optional: true
 
-  webpack-dev-middleware@5.3.4(webpack@5.94.0):
+  webpack-dev-middleware@5.3.4(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)):
     dependencies:
       colorette: 2.0.20
       memfs: 3.5.3
       mime-types: 2.1.35
       range-parser: 1.2.1
       schema-utils: 4.2.0
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
 
-  webpack-dev-middleware@6.1.2(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  webpack-dev-middleware@6.1.2(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       colorette: 2.0.20
       memfs: 3.5.3
@@ -35964,7 +35975,7 @@ snapshots:
       range-parser: 1.2.1
       schema-utils: 4.2.0
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
 
   webpack-dev-middleware@6.1.3(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)):
     dependencies:
@@ -36006,10 +36017,10 @@ snapshots:
       serve-index: 1.9.1
       sockjs: 0.3.24
       spdy: 4.0.2
-      webpack-dev-middleware: 5.3.4(webpack@5.94.0)
+      webpack-dev-middleware: 5.3.4(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       ws: 8.18.0
     optionalDependencies:
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4)
+      webpack: 5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4)
       webpack-cli: 5.1.4(webpack-dev-server@4.15.1)(webpack@5.94.0)
     transitivePeerDependencies:
       - bufferutil
@@ -36017,7 +36028,7 @@ snapshots:
       - supports-color
       - utf-8-validate
 
-  webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  webpack-dev-server@4.15.1(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       '@types/bonjour': 3.5.13
       '@types/connect-history-api-fallback': 1.5.4
@@ -36047,10 +36058,10 @@ snapshots:
       serve-index: 1.9.1
       sockjs: 0.3.24
       spdy: 4.0.2
-      webpack-dev-middleware: 5.3.4(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      webpack-dev-middleware: 5.3.4(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       ws: 8.18.0
     optionalDependencies:
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
     transitivePeerDependencies:
       - bufferutil
       - debug
@@ -36116,7 +36127,7 @@ snapshots:
 
   webpack-sources@3.2.3: {}
 
-  webpack-stream@7.0.0(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))):
+  webpack-stream@7.0.0(webpack@5.94.0(@swc/core@1.9.2)):
     dependencies:
       fancy-log: 1.3.3
       lodash.clone: 4.5.0
@@ -36126,20 +36137,20 @@ snapshots:
       supports-color: 8.1.1
       through: 2.3.8
       vinyl: 2.2.1
-      webpack: 5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))
+      webpack: 5.94.0(@swc/core@1.9.2)
 
-  webpack-subresource-integrity@5.1.0(html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)):
+  webpack-subresource-integrity@5.1.0(html-webpack-plugin@5.6.3(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)))(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)):
     dependencies:
       typed-assert: 1.0.9
-      webpack: 5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)
+      webpack: 5.90.3(@swc/core@1.9.2)(esbuild@0.20.1)
     optionalDependencies:
-      html-webpack-plugin: 5.6.3(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      html-webpack-plugin: 5.6.3(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
 
   webpack-virtual-modules@0.5.0: {}
 
   webpack-virtual-modules@0.6.2: {}
 
-  webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1):
+  webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1):
     dependencies:
       '@types/eslint-scope': 3.7.7
       '@types/estree': 1.0.6
@@ -36162,7 +36173,7 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 3.3.0
       tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1)(webpack@5.90.3(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.20.1))
+      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2)(esbuild@0.20.1)(webpack@5.90.3(@swc/core@1.9.2)(esbuild@0.20.1))
       watchpack: 2.4.0
       webpack-sources: 3.2.3
     transitivePeerDependencies:
@@ -36170,7 +36181,7 @@ snapshots:
       - esbuild
       - uglify-js
 
-  webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)):
+  webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20):
     dependencies:
       '@types/estree': 1.0.6
       '@webassemblyjs/ast': 1.14.1
@@ -36192,7 +36203,7 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 3.3.0
       tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15)))
+      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20))
       watchpack: 2.4.2
       webpack-sources: 3.2.3
     transitivePeerDependencies:
@@ -36200,7 +36211,7 @@ snapshots:
       - esbuild
       - uglify-js
 
-  webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20):
+  webpack@5.94.0(@swc/core@1.9.2):
     dependencies:
       '@types/estree': 1.0.6
       '@webassemblyjs/ast': 1.14.1
@@ -36222,7 +36233,7 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 3.3.0
       tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20)(webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(esbuild@0.18.20))
+      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2))
       watchpack: 2.4.2
       webpack-sources: 3.2.3
     transitivePeerDependencies:
@@ -36230,7 +36241,7 @@ snapshots:
       - esbuild
       - uglify-js
 
-  webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@4.10.0):
+  webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0):
     dependencies:
       '@types/estree': 1.0.6
       '@webassemblyjs/ast': 1.14.1
@@ -36252,7 +36263,7 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 3.3.0
       tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0)
+      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@4.10.0))
       watchpack: 2.4.2
       webpack-sources: 3.2.3
     optionalDependencies:
@@ -36262,7 +36273,7 @@ snapshots:
       - esbuild
       - uglify-js
 
-  webpack@5.94.0(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack-cli@5.1.4):
+  webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4):
     dependencies:
       '@types/estree': 1.0.6
       '@webassemblyjs/ast': 1.14.1
@@ -36284,7 +36295,7 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 3.3.0
       tapable: 2.2.1
-      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2(@swc/helpers@0.5.15))(webpack@5.94.0)
+      terser-webpack-plugin: 5.3.10(@swc/core@1.9.2)(webpack@5.94.0(@swc/core@1.9.2)(webpack-cli@5.1.4))
       watchpack: 2.4.2
       webpack-sources: 3.2.3
     optionalDependencies: