Merge branch '25_1' of https://github.com/DevExpress/DevExtreme into 25_1

Author: GoodDayForSurf

.github/workflows/build_all.yml

@@ -49,9 +49,34 @@ jobs:
         run: pnpm run all:build
 
       - name: Copy build artifacts
-        uses: actions/upload-artifact@v3
+        uses: actions/upload-artifact@v4
         with:
           name: devextreme-npm-packages
           path: |
             artifacts/npm/*.tgz
           retention-days: 1
+
+  custom_bundles:
+    runs-on: devextreme-shr2
+    needs: build
+
+    steps:
+      - name: Download npm packages
+        uses: actions/download-artifact@v4
+        with:
+          name: devextreme-npm-packages
+          path: npm
+
+      - name: Move devextreme package
+        run: mv ./npm/devextreme-2*.tgz ./devextreme.tgz
+
+      - name: Setup deps
+        run: |
+          npm init -y
+          npm i webpack terser-webpack-plugin
+          npm i ./devextreme.tgz
+
+      - name: Build bundle
+        run: |
+          npx devextreme-bundler-init custom-bundle
+          npx devextreme-bundler custom-bundle

.github/workflows/demos_visual_tests.yml

@@ -20,7 +20,7 @@ env:
 
 jobs:
   build:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: Build devextreme
     timeout-minutes: 20
 
@@ -73,7 +73,7 @@ jobs:
     env:
       ACCESSIBILITY_TESTCAFE_REPORT_PATH: "accessibility_testcafe_report"
 
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: ${{ matrix.CONSTEL }}-${{ matrix.STRATEGY }}-${{ matrix.THEME }}
     timeout-minutes: 30
 

.github/workflows/demos_visual_tests_frameworks.yml

@@ -20,7 +20,7 @@ env:
 
 jobs:
   build-devextreme:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: Build DevExtreme
     timeout-minutes: 40
 
@@ -84,7 +84,7 @@ jobs:
           retention-days: 1
 
   build-demos:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: Build Demos
     timeout-minutes: 20
     needs: build-devextreme
@@ -156,7 +156,7 @@ jobs:
         retention-days: 1
 
   get-changes:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: Get changed demos
     timeout-minutes: 5
 
@@ -185,7 +185,7 @@ jobs:
       - build-devextreme
       - get-changes
 
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     timeout-minutes: 60
 
     strategy:
@@ -271,7 +271,7 @@ jobs:
 
   check_generated_demos:
     name: ${{ matrix.name }}
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     timeout-minutes: 10
     needs: build-demos
 
@@ -361,7 +361,7 @@ jobs:
         CONSTEL: [react(1/4), react(2/4), react(3/4), react(4/4), vue(1/4), vue(2/4), vue(3/4), vue(4/4), angular(1/4), angular(2/4), angular(3/4), angular(4/4)]
         THEME: ['generic.light', 'material.blue.light', 'fluent.blue.light']
 
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     name: testcafe-${{ matrix.CONSTEL }}-${{ matrix.THEME }}
     timeout-minutes: 60
 

.github/workflows/testcafe_tests.yml

@@ -124,8 +124,10 @@ jobs:
           { componentFolder: "scheduler/timezones", name: "scheduler (America/Los_Angeles)", timezone: "America/Los_Angeles" },
           { componentFolder: "form", name: "form (1/2)", indices: "1/2" },
           { componentFolder: "form", name: "form (2/2)", indices: "2/2" },
-          { componentFolder: "form", name: "form - material (1/2)", theme: 'material.blue.light', indices: "1/2" },
-          { componentFolder: "form", name: "form - material (2/2)", theme: 'material.blue.light', indices: "2/2" },
+          { componentFolder: "form", name: "form - material (1/4)", theme: 'material.blue.light', indices: "1/4" },
+          { componentFolder: "form", name: "form - material (2/4)", theme: 'material.blue.light', indices: "2/4" },
+          { componentFolder: "form", name: "form - material (3/4)", theme: 'material.blue.light', indices: "3/4" },
+          { componentFolder: "form", name: "form - material (4/4)", theme: 'material.blue.light', indices: "4/4" },
           { componentFolder: "form", name: "form - fluent (1/2)", theme: 'fluent.blue.light', indices: "1/2" },
           { componentFolder: "form", name: "form - fluent (2/2)", theme: 'fluent.blue.light', indices: "2/2" },
           { componentFolder: "editors", name: "editors (1/2)", indices: "1/2" },

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

@@ -44,11 +44,6 @@
   margin-bottom: 0;
 }
 
-::ng-deep .dx-chat-messagebubble-content ol,
-::ng-deep .dx-chat-messagebubble-content ul {
-  white-space: normal;
-}
-
 ::ng-deep .dx-chat-messagebubble-content h1,
 ::ng-deep .dx-chat-messagebubble-content h2,
 ::ng-deep .dx-chat-messagebubble-content h3,

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

@@ -5,10 +5,11 @@ import { unified } from 'unified';
 import remarkParse from 'remark-parse';
 import remarkRehype from 'remark-rehype';
 import rehypeStringify from 'rehype-stringify';
+import rehypeMinifyWhitespace from 'rehype-minify-whitespace';
 import {
   User,
   Alert,
-  MessageEnteredEvent
+  MessageEnteredEvent,
 } from 'devextreme/ui/chat';
 import DataSource from 'devextreme/data/data_source';
 import CustomStore from 'devextreme/data/custom_store';
@@ -26,9 +27,10 @@ export class AppService {
     apiVersion: '2024-02-01',
     endpoint: 'https://public-api.devexpress.com/demo-openai',
     apiKey: 'DEMO',
-  }
+  };
 
   REGENERATION_TEXT = 'Regeneration...';
+
   ALERT_TIMEOUT = 1000 * 60;
 
   user: User = {
@@ -41,7 +43,9 @@ export class AppService {
   };
 
   store: any[] = [];
+
   messages: any[] = [];
+
   alerts: Alert[] = [];
 
   customStore: CustomStore;
@@ -54,7 +58,7 @@ export class AppService {
 
   constructor() {
     this.chatService = new AzureOpenAI(this.AzureOpenAIConfig);
-    this.initDataSource()
+    this.initDataSource();
     this.typingUsersSubject.next([]);
     this.alertsSubject.next([]);
   }
@@ -73,28 +77,24 @@ export class AppService {
         'dxChat-emptyListMessage': 'Chat is Empty',
         'dxChat-emptyListPrompt': 'AI Assistant is ready to answer your questions.',
         'dxChat-textareaPlaceholder': 'Ask AI Assistant...',
-      }
-    }
+      },
+    };
   }
 
   initDataSource() {
     this.customStore = new CustomStore({
       key: 'id',
-      load: () => {
-        return new Promise((resolve) => {
-          setTimeout(() => {
-            resolve([...this.store]);
-          }, 0);
+      load: () => new Promise((resolve) => {
+        setTimeout(() => {
+          resolve([...this.store]);
+        }, 0);
+      }),
+      insert: (message) => new Promise((resolve) => {
+        setTimeout(() => {
+          this.store.push(message);
+          resolve(message);
         });
-      },
-      insert: (message) => {
-        return new Promise((resolve) => {
-          setTimeout(() => {
-            this.store.push(message);
-            resolve(message);
-          });
-        });
-      },
+      }),
     });
 
     this.dataSource = new DataSource({
@@ -160,7 +160,7 @@ export class AppService {
 
   alertLimitReached() {
     this.setAlerts([{
-      message: 'Request limit reached, try again in a minute.'
+      message: 'Request limit reached, try again in a minute.',
     }]);
 
     setTimeout(() => {
@@ -189,6 +189,7 @@ export class AppService {
     const result = unified()
       .use(remarkParse)
       .use(remarkRehype)
+      .use(rehypeMinifyWhitespace)
       .use(rehypeStringify)
       .processSync(value)
       .toString();

apps/demos/Demos/Chat/AIAndChatbotIntegration/React/Message.tsx

@@ -3,6 +3,7 @@ import Button from 'devextreme-react/button';
 import { unified } from 'unified';
 import remarkParse from 'remark-parse';
 import remarkRehype from 'remark-rehype';
+import rehypeMinifyWhitespace from 'rehype-minify-whitespace';
 import rehypeStringify from 'rehype-stringify';
 import HTMLReactParser from 'html-react-parser';
 
@@ -13,6 +14,7 @@ function convertToHtml(value: string): string {
   const result = unified()
     .use(remarkParse)
     .use(remarkRehype)
+    .use(rehypeMinifyWhitespace)
     .use(rehypeStringify)
     .processSync(value)
     .toString();

apps/demos/Demos/Chat/AIAndChatbotIntegration/React/styles.css

@@ -44,11 +44,6 @@
   margin-bottom: 0;
 }
 
-.dx-chat-messagebubble-content ol,
-.dx-chat-messagebubble-content ul {
-  white-space: normal;
-}
-
 .dx-chat-messagebubble-content h1,
 .dx-chat-messagebubble-content h2,
 .dx-chat-messagebubble-content h3,

apps/demos/Demos/Chat/AIAndChatbotIntegration/ReactJs/Message.js

@@ -3,6 +3,7 @@ import Button from 'devextreme-react/button';
 import { unified } from 'unified';
 import remarkParse from 'remark-parse';
 import remarkRehype from 'remark-rehype';
+import rehypeMinifyWhitespace from 'rehype-minify-whitespace';
 import rehypeStringify from 'rehype-stringify';
 import HTMLReactParser from 'html-react-parser';
 import { REGENERATION_TEXT } from './data.js';
@@ -11,6 +12,7 @@ function convertToHtml(value) {
   const result = unified()
     .use(remarkParse)
     .use(remarkRehype)
+    .use(rehypeMinifyWhitespace)
     .use(rehypeStringify)
     .processSync(value)
     .toString();

apps/demos/Demos/Chat/AIAndChatbotIntegration/ReactJs/styles.css

@@ -44,11 +44,6 @@
   margin-bottom: 0;
 }
 
-.dx-chat-messagebubble-content ol,
-.dx-chat-messagebubble-content ul {
-  white-space: normal;
-}
-
 .dx-chat-messagebubble-content h1,
 .dx-chat-messagebubble-content h2,
 .dx-chat-messagebubble-content h3,

apps/demos/Demos/Chat/AIAndChatbotIntegration/Vue/App.vue

@@ -26,8 +26,7 @@
           <div
             v-html="convertToHtml(data.message.text)"
             class="dx-chat-messagebubble-text"
-          >
-          </div>
+          />
           <div class="dx-bubble-button-container">
             <DxButton
               :icon="copyButtonIcon"
@@ -99,7 +98,7 @@ function toggleDisabledState(disabled, event = undefined) {
   } else {
     event?.target.focus();
   }
-};
+}
 
 function updateLastMessage(text = REGENERATION_TEXT) {
   const items = dataSource.items();
@@ -148,7 +147,7 @@ async function processMessageSending(message, event) {
 
 function alertLimitReached() {
   alerts.value = [{
-    message: 'Request limit reached, try again in a minute.'
+    message: 'Request limit reached, try again in a minute.',
   }];
 
   setTimeout(() => {
@@ -185,7 +184,7 @@ function onCopyButtonClick(message) {
   copyButtonIcon.value = 'check';
 
   setTimeout(() => {
-      copyButtonIcon.value = 'copy';
+    copyButtonIcon.value = 'copy';
   }, 2500);
 }
 
@@ -245,11 +244,6 @@ function onRegenerateButtonClick() {
   margin-bottom: 0;
 }
 
-.dx-chat-messagebubble-content ol,
-.dx-chat-messagebubble-content ul {
-  white-space: normal;
-}
-
 .dx-chat-messagebubble-content h1,
 .dx-chat-messagebubble-content h2,
 .dx-chat-messagebubble-content h3,