Merge branch '26_1' into 26_1_wip_check_ci

Author: GoodDayForSurf

.github/workflows/packages_publishing.yml

@@ -20,8 +20,6 @@ env:
   NX_SKIP_NX_CACHE: true
   FILTER: ${{ github.event_name == 'workflow_dispatch' && inputs.filter || '' }}
   SET_TIMESTAMP_VERSION:  ${{ inputs.tag == 'daily' }}
-  MOVE_DAILY_TAG: ${{ inputs.tag == 'daily' }}
-  MOVE_STABLE_TAG: ${{ inputs.tag == 'stable' }}
 
 jobs:
   build:
@@ -155,32 +153,13 @@ jobs:
         working-directory: ${{ steps.scopedPackage.outputs.packageDir }}
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          pnpm set //npm.pkg.github.com/:_authToken="$NODE_AUTH_TOKEN";
-          pnpm publish --no-git-checks --quiet --ignore-scripts --registry https://npm.pkg.github.com;
-
-      - name: Move 'daily' tag
-        if: ${{ env.MOVE_DAILY_TAG == 'true' }}
-        env:
-          PACKAGE_NAME: ${{ steps.scopedPackage.outputs.name }}
-          PACKAGE_VERSION: ${{ steps.scopedPackage.outputs.version }}
-          PACKAGE_VERSION_MAJOR: ${{ steps.scopedPackage.outputs.majorVersion }}
-          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          pnpm set //npm.pkg.github.com/:_authToken="$NODE_AUTH_TOKEN"
-          pnpm dist-tag add $PACKAGE_NAME@$PACKAGE_VERSION $PACKAGE_VERSION_MAJOR-daily --registry=https://npm.pkg.github.com
-
-      - name: Move 'stable' tag
-        if: ${{ env.MOVE_STABLE_TAG == 'true' }}
-        env:
           PACKAGE_NAME: ${{ steps.scopedPackage.outputs.name }}
           PACKAGE_VERSION: ${{ steps.scopedPackage.outputs.version }}
           PACKAGE_VERSION_MAJOR: ${{ steps.scopedPackage.outputs.majorVersion }}
-          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
-          pnpm set //npm.pkg.github.com/:_authToken="$NODE_AUTH_TOKEN"
-          pnpm dist-tag add $PACKAGE_NAME@$PACKAGE_VERSION $PACKAGE_VERSION_MAJOR-stable --registry=https://npm.pkg.github.com
-
+          pnpm set //npm.pkg.github.com/:_authToken="$NODE_AUTH_TOKEN";
+          pnpm publish --no-git-checks --quiet --ignore-scripts --tag $PACKAGE_VERSION_MAJOR-${{ inputs.tag }} --registry https://npm.pkg.github.com;
+          pnpm dist-tag add $PACKAGE_NAME@$PACKAGE_VERSION latest --registry=https://npm.pkg.github.com;
 
   notify:
     runs-on: devextreme-shr2

apps/demos/Demos/DataGrid/AIAssistant/description.md

@@ -1,18 +1,29 @@
-With our v26.1 release, we will extend the AI-powered capabilities of both the DevExtreme [DataGrid](https://js.devexpress.com/Documentation/Guide/UI_Components/DataGrid/Overview/) and [TreeList](https://js.devexpress.com/Documentation/Guide/UI_Components/TreeList/Overview/). We plan to introduce a DevExtreme Chat-based AI assistant that will allow you to use natural language to interact with DataGrid/TreeList. The DataGrid/TreeList AI assistant will be able to complete the following actions:
-* Sort, filter, search, and group data.
-* Resize, reorder, fix/unfix, and show/hide columns.
-* Change pagination settings.
-<!--split-->
+The AI Assistant for the DevExtreme [DataGrid](/Documentation/Guide/UI_Components/DataGrid/Overview/) allows you to interact with the component using natural language. The Chat also supports [speech-to-text input](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#speechToTextEnabled), ideal for hands-free interactions or entering longer prompts.
+
+You can use/configure the following DataGrid features in the AI Assistant Chat prompts:
 
-This feature is particularly well suited for the following usage scenarios:
+- [Filtering and Searching](/Documentation/Guide/UI_Components/DataGrid/Filtering_and_Searching/)
+- [Sorting](/Documentation/Guide/UI_Components/DataGrid/Sorting/)
+- [Grouping](/Documentation/Guide/UI_Components/DataGrid/Grouping/)
+- [Paging](/Documentation/Guide/UI_Components/DataGrid/Paging/)
+- [Focused Row](/Documentation/Guide/UI_Components/DataGrid/Focused_Row/)
+- [Selection](/Documentation/Guide/UI_Components/DataGrid/Selection/)
+- [Summaries](/Documentation/Guide/UI_Components/DataGrid/Summaries/Predefined_Aggregate_Functions/)
+- [Column Fixing](/Documentation/Guide/UI_Components/DataGrid/Columns/Column_Fixing/), [Resizing](/Documentation/Guide/UI_Components/DataGrid/Columns/Column_Sizing/), and [Reordering](/Documentation/Guide/UI_Components/DataGrid/Columns/Column_Reordering/)
+
+The AI Assistant feature is also available for the DevExtreme [TreeList](/Documentation/ApiReference/UI_Components/dxTreeList/Configuration/#aiAssistant) component.
+<!--split-->
 
-* **Large Datasets**: Use the power of AI to browse large data sets. Apply complex filter values with natural language.
+In this demo, the AI Assistant is enabled for a DataGrid that displays mock sales data with over 1500 records.
 
+[note]
 
-* **Complex Grid Configurations**: Allow users to specify complex display preferences quickly.
+AI services used for this demo have been rate and data limited. As such, you may experience performance-related delays when exploring the capabilities of the DataGrid AI Assistant.
 
+When connected to your own AI model/service without rate and data limits, the AI Assistant will perform seamlessly, without artificial delays. Note that DevExtreme does not offer an AI REST API and does not ship any built-in LLMs/SLMs.
 
-* **Accessibility-first Applications**: Allow users to interact with your application in a manner that is most appropriate for each specific situation: while at their desk, or on the go (when their hands are busy and they require voice commands to interact with your app).
+[/note]
 
+To enable the AI Assistant, configure the [aiIntegration](/Documentation/ApiReference/UI_Components/dxDataGrid/Configuration/#aiIntegration) or **aiAssistant**.[aiIntegration](/Documentation/ApiReference/UI_Components/dxDataGrid/Configuration/aiAssistant/#aiIntegration) object and set the **aiAssistant**.[enabled](/Documentation/ApiReference/UI_Components/dxDataGrid/Configuration/aiAssistant/#enabled) property to `true`. Once activated, the DataGrid adds a predefined item (*"aiAssistantButton"*) to the toolbar. This button opens the AI Assistant Chat in a draggable pop-up window.
 
-* **Replicable Configurations**: Apply the same prompt to recreate complex grid configurations across sessions. Reduce time spent on tedious layout adjustments.
+This demo also configures [suggestions](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#suggestions) for the AI Assistant Chat. These buttons allow you to interact with the assistant in one click using predefined prompts. For additional information about suggestions, refer to the following demo: [DevExtreme Chat - Prompt Suggestions](/Demos/WidgetsGallery/Demo/Chat/PromptSuggestions/).

apps/demos/Demos/DataGrid/RowSelection/jQuery/index.html

@@ -16,7 +16,7 @@
     <div class="demo-container">
       <div id="gridContainer"></div>
       <div id="employeeInfo">
-        <img class="employeePhoto" alt="Employee photo" style="visibility: hidden" />
+        <img class="employeePhoto hidden" alt="Employee photo" />
         <p class="employeeNotes"></p>
       </div>
     </div>

apps/demos/Demos/DataGrid/RowSelection/jQuery/index.js

@@ -27,7 +27,10 @@ $(() => {
       const data = selectedItems.selectedRowsData[0];
       if (data) {
         $('.employeeNotes').text(data.Notes);
-        $('.employeePhoto').attr('src', data.Picture).attr('style', null);
+        $('.employeePhoto').attr('src', data.Picture).removeClass('hidden');
+      } else {
+        $('.employeeNotes').text('');
+        $('.employeePhoto').addClass('hidden');
       }
     },
   });

apps/demos/Demos/DataGrid/RowSelection/jQuery/styles.css

@@ -4,6 +4,10 @@
   padding: 20px;
 }
 
+#employeeInfo .employeePhoto.hidden {
+  visibility: hidden;
+}
+
 #employeeInfo .employeeNotes {
   padding-top: 20px;
   text-align: justify;

apps/demos/Demos/TreeList/Overview/Angular/app/app.component.css

@@ -15,10 +15,8 @@
 ::ng-deep .img {
   height: 50px;
   width: 50px;
+  object-fit: contain;
   margin-right: 10px;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
   border-radius: 25px;
   border: 1px solid lightgray;
   background-color: #fff;

apps/demos/Demos/TreeList/Overview/Angular/app/app.component.html

@@ -70,12 +70,11 @@
   ></dxi-tree-list-column>
   <div *dxTemplate="let options of 'employeeTemplate'">
     @if(options.data.Task_Assigned_Employee) {
-    <div
+    <img
       class="img"
-      style.background-image="url('{{
-        options.data.Task_Assigned_Employee.Picture
-      }}')"
-    ></div>
+      [src]="options.data.Task_Assigned_Employee.Picture"
+      alt=""
+    />
     } @if(options.data.Task_Assigned_Employee) {
     <span class="name">{{ options.data.Task_Assigned_Employee.Name }}</span>
     }

apps/demos/Demos/TreeList/Overview/React/EmployeeCell.tsx

@@ -10,7 +10,11 @@ const EmployeeCell = (props: TreeListTypes.ColumnCellTemplateData) => {
 
   return (
     <>
-      <div className="img" style={{ backgroundImage: `url(${employee.Picture})` }} />
+      <img
+        className="img"
+        src={employee.Picture}
+        alt=""
+      />
       &nbsp;
       <span className="name">{employee.Name}</span>
     </>

apps/demos/Demos/TreeList/Overview/React/styles.css

@@ -15,10 +15,8 @@
 .img {
   height: 50px;
   width: 50px;
+  object-fit: contain;
   margin-right: 10px;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
   border-radius: 25px;
   border: 1px solid lightgray;
   background-color: #fff;

apps/demos/Demos/TreeList/Overview/ReactJs/EmployeeCell.js

@@ -7,9 +7,10 @@ const EmployeeCell = (props) => {
   }
   return (
     <>
-      <div
+      <img
         className="img"
-        style={{ backgroundImage: `url(${employee.Picture})` }}
+        src={employee.Picture}
+        alt=""
       />
       &nbsp;
       <span className="name">{employee.Name}</span>