@progress/kendo-angular-grid 12.0.0-develop.1 → 12.0.0-develop.11

package/localization/messages.d.ts

@@ -421,6 +421,10 @@ export declare class GridMessages extends ComponentMessages {
      * The label for the group panel toolbar.
      */
     groupPanelLabel: string;
+    /**
+     * The label for the Grid drag row handle.
+     */
+    dragRowHandleLabel: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<GridMessages, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<GridMessages, "kendo-grid-messages-base", never, { "groupPanelEmpty": "groupPanelEmpty"; "noRecords": "noRecords"; "pagerLabel": "pagerLabel"; "pagerFirstPage": "pagerFirstPage"; "pagerLastPage": "pagerLastPage"; "pagerPreviousPage": "pagerPreviousPage"; "pagerNextPage": "pagerNextPage"; "pagerPage": "pagerPage"; "pagerItemsPerPage": "pagerItemsPerPage"; "pagerOf": "pagerOf"; "pagerItems": "pagerItems"; "pagerPageNumberInputTitle": "pagerPageNumberInputTitle"; "selectPage": "selectPage"; "filter": "filter"; "filterInputLabel": "filterInputLabel"; "filterMenuTitle": "filterMenuTitle"; "filterMenuOperatorsDropDownLabel": "filterMenuOperatorsDropDownLabel"; "filterMenuLogicDropDownLabel": "filterMenuLogicDropDownLabel"; "filterEqOperator": "filterEqOperator"; "filterNotEqOperator": "filterNotEqOperator"; "filterIsNullOperator": "filterIsNullOperator"; "filterIsNotNullOperator": "filterIsNotNullOperator"; "filterIsEmptyOperator": "filterIsEmptyOperator"; "filterIsNotEmptyOperator": "filterIsNotEmptyOperator"; "filterStartsWithOperator": "filterStartsWithOperator"; "filterContainsOperator": "filterContainsOperator"; "filterNotContainsOperator": "filterNotContainsOperator"; "filterEndsWithOperator": "filterEndsWithOperator"; "filterGteOperator": "filterGteOperator"; "filterGtOperator": "filterGtOperator"; "filterLteOperator": "filterLteOperator"; "filterLtOperator": "filterLtOperator"; "filterIsTrue": "filterIsTrue"; "filterIsFalse": "filterIsFalse"; "filterBooleanAll": "filterBooleanAll"; "filterAfterOrEqualOperator": "filterAfterOrEqualOperator"; "filterAfterOperator": "filterAfterOperator"; "filterBeforeOperator": "filterBeforeOperator"; "filterBeforeOrEqualOperator": "filterBeforeOrEqualOperator"; "filterFilterButton": "filterFilterButton"; "filterClearButton": "filterClearButton"; "filterAndLogic": "filterAndLogic"; "filterOrLogic": "filterOrLogic"; "loading": "loading"; "gridLabel": "gridLabel"; "columnMenu": "columnMenu"; "setColumnPosition": "setColumnPosition"; "columns": "columns"; "lock": "lock"; "unlock": "unlock"; "stick": "stick"; "unstick": "unstick"; "sortable": "sortable"; "sortAscending": "sortAscending"; "sortDescending": "sortDescending"; "autosizeThisColumn": "autosizeThisColumn"; "autosizeAllColumns": "autosizeAllColumns"; "sortedAscending": "sortedAscending"; "sortedDescending": "sortedDescending"; "sortedDefault": "sortedDefault"; "columnsApply": "columnsApply"; "columnsReset": "columnsReset"; "detailExpand": "detailExpand"; "detailCollapse": "detailCollapse"; "filterDateToday": "filterDateToday"; "filterDateToggle": "filterDateToggle"; "filterNumericDecrement": "filterNumericDecrement"; "filterNumericIncrement": "filterNumericIncrement"; "selectionCheckboxLabel": "selectionCheckboxLabel"; "selectAllCheckboxLabel": "selectAllCheckboxLabel"; "groupCollapse": "groupCollapse"; "groupExpand": "groupExpand"; "topToolbarLabel": "topToolbarLabel"; "bottomToolbarLabel": "bottomToolbarLabel"; "groupPanelLabel": "groupPanelLabel"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<GridMessages, "kendo-grid-messages-base", never, { "groupPanelEmpty": "groupPanelEmpty"; "noRecords": "noRecords"; "pagerLabel": "pagerLabel"; "pagerFirstPage": "pagerFirstPage"; "pagerLastPage": "pagerLastPage"; "pagerPreviousPage": "pagerPreviousPage"; "pagerNextPage": "pagerNextPage"; "pagerPage": "pagerPage"; "pagerItemsPerPage": "pagerItemsPerPage"; "pagerOf": "pagerOf"; "pagerItems": "pagerItems"; "pagerPageNumberInputTitle": "pagerPageNumberInputTitle"; "selectPage": "selectPage"; "filter": "filter"; "filterInputLabel": "filterInputLabel"; "filterMenuTitle": "filterMenuTitle"; "filterMenuOperatorsDropDownLabel": "filterMenuOperatorsDropDownLabel"; "filterMenuLogicDropDownLabel": "filterMenuLogicDropDownLabel"; "filterEqOperator": "filterEqOperator"; "filterNotEqOperator": "filterNotEqOperator"; "filterIsNullOperator": "filterIsNullOperator"; "filterIsNotNullOperator": "filterIsNotNullOperator"; "filterIsEmptyOperator": "filterIsEmptyOperator"; "filterIsNotEmptyOperator": "filterIsNotEmptyOperator"; "filterStartsWithOperator": "filterStartsWithOperator"; "filterContainsOperator": "filterContainsOperator"; "filterNotContainsOperator": "filterNotContainsOperator"; "filterEndsWithOperator": "filterEndsWithOperator"; "filterGteOperator": "filterGteOperator"; "filterGtOperator": "filterGtOperator"; "filterLteOperator": "filterLteOperator"; "filterLtOperator": "filterLtOperator"; "filterIsTrue": "filterIsTrue"; "filterIsFalse": "filterIsFalse"; "filterBooleanAll": "filterBooleanAll"; "filterAfterOrEqualOperator": "filterAfterOrEqualOperator"; "filterAfterOperator": "filterAfterOperator"; "filterBeforeOperator": "filterBeforeOperator"; "filterBeforeOrEqualOperator": "filterBeforeOrEqualOperator"; "filterFilterButton": "filterFilterButton"; "filterClearButton": "filterClearButton"; "filterAndLogic": "filterAndLogic"; "filterOrLogic": "filterOrLogic"; "loading": "loading"; "gridLabel": "gridLabel"; "columnMenu": "columnMenu"; "setColumnPosition": "setColumnPosition"; "columns": "columns"; "lock": "lock"; "unlock": "unlock"; "stick": "stick"; "unstick": "unstick"; "sortable": "sortable"; "sortAscending": "sortAscending"; "sortDescending": "sortDescending"; "autosizeThisColumn": "autosizeThisColumn"; "autosizeAllColumns": "autosizeAllColumns"; "sortedAscending": "sortedAscending"; "sortedDescending": "sortedDescending"; "sortedDefault": "sortedDefault"; "columnsApply": "columnsApply"; "columnsReset": "columnsReset"; "detailExpand": "detailExpand"; "detailCollapse": "detailCollapse"; "filterDateToday": "filterDateToday"; "filterDateToggle": "filterDateToggle"; "filterNumericDecrement": "filterNumericDecrement"; "filterNumericIncrement": "filterNumericIncrement"; "selectionCheckboxLabel": "selectionCheckboxLabel"; "selectAllCheckboxLabel": "selectAllCheckboxLabel"; "groupCollapse": "groupCollapse"; "groupExpand": "groupExpand"; "topToolbarLabel": "topToolbarLabel"; "bottomToolbarLabel": "bottomToolbarLabel"; "groupPanelLabel": "groupPanelLabel"; "dragRowHandleLabel": "dragRowHandleLabel"; }, {}, never>;
 }

package/navigation/focusable.directive.d.ts

@@ -11,47 +11,16 @@ import * as i0 from "@angular/core";
  * [focus in a navigable Grid]({% slug keyboard_navigation_grid %}).
  *
  * @example
- * ```ts-preview
- * _@Component({
- *    selector: 'my-app',
- *    template: `
- *      <input type="text" placeholder="Tab stop #0" style="margin-bottom: 8px;" />
- *      <kendo-grid [data]="data" [navigable]="true">
- *          <kendo-grid-column field="ProductID" title="Product ID" [width]="100">
- *          </kendo-grid-column>
- *          <kendo-grid-column field="ProductName" title="Product Name" [width]="150">
- *          </kendo-grid-column>
- *          <kendo-grid-column>
- *              <ng-template kendoGridCellTemplate let-dataItem>
- *                  <!-- The first focusable element will be focused when pressing Enter on the cell -->
- *                  <input type="text" kendoGridFocusable [value]="dataItem.ProductName" style="margin-right: 8px;" />
- *                  <button kendoGridFocusable>Update</button>
- *              </ng-template>
- *          </kendo-grid-column>
- *          <kendo-grid-column [width]="100">
- *              <ng-template kendoGridCellTemplate>
- *                  <!-- A single focusable element will be focused during navigation -->
- *                  <button kendoGridFocusable>Delete</button>
- *              </ng-template>
- *          </kendo-grid-column>
- *      </kendo-grid>
- *      <input type="text" placeholder="Tab stop #2" style="margin-top: 8px;" />
- *    `
- * })
- *
- * class AppComponent {
- *     public readonly data: any = [{
- *         "ProductID": 1,
- *         "ProductName": "Chai",
- *         "UnitPrice": 18.0000,
- *         "Discontinued": true
- *     }, {
- *         "ProductID": 2,
- *         "ProductName": "Chang",
- *         "UnitPrice": 19.0000,
- *         "Discontinued": false
- *     }];
- * }
+ * ```html
+ * <kendo-grid [data]="data" [navigable]="true">
+ *    <kendo-grid-column>
+ *       <ng-template kendoGridCellTemplate let-dataItem>
+ *          <!-- The first focusable element will be focused when pressing Enter on the cell -->
+ *          <input type="text" kendoGridFocusable [value]="dataItem.ProductName" style="margin-right: 8px;" />
+ *          <button kendoGridFocusable>Update</button>
+ *       </ng-template>
+ *    </kendo-grid-column>
+ * </kendo-grid>
  * ```
  */
 export declare class FocusableDirective implements FocusableElement, AfterViewInit, OnDestroy {

package/navigation/navigable-settings.d.ts

@@ -4,9 +4,23 @@
 *-------------------------------------------------------------------------------------------*/
 /**
  * Represents the possible navigable sections of the Grid ([see example]({% slug keyboard_navigation_grid %}#toc-navigable-sections)).
+ *
+ * The available values are:
+ * * `pager`—Includes the Grid pager and its internal elements
+ * * `table`—Includes the Grid pager and its internal elements
+ * * `toolbar`—Includes the Grid toolbars and the group panel when the Grid is groupable.
+ *
+ * @xample
+ * ```html
+ * <kendo-grid [navigable]="['pager', 'toolbar']"> </kendo-grid>
+ * ```
  */
 export declare type GridNavigableSection = 'pager' | 'table' | 'toolbar';
 /**
- * Represents the type of the Grid [`navigable`]({% slug api_grid_gridcomponent %}#toc-navigable) option.
+ * Represents the type of the Grid [`navigable`]({% slug api_grid_gridcomponent %}#toc-navigable) property.
+ *
+ * The available values are:
+ * * `boolean`
+ * * [`GridNavigableSection`](slug:api_grid_gridnavigablesection)
  */
 export declare type GridNavigableSettings = boolean | GridNavigableSection[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-grid",
-  "version": "12.0.0-develop.1",
+  "version": "12.0.0-develop.11",
   "description": "Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -32,23 +32,24 @@
     "@progress/kendo-data-query": "^1.0.0",
     "@progress/kendo-drawing": "^1.17.2",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-buttons": "12.0.0-develop.1",
-    "@progress/kendo-angular-common": "12.0.0-develop.1",
-    "@progress/kendo-angular-dateinputs": "12.0.0-develop.1",
-    "@progress/kendo-angular-dropdowns": "12.0.0-develop.1",
-    "@progress/kendo-angular-excel-export": "12.0.0-develop.1",
-    "@progress/kendo-angular-icons": "12.0.0-develop.1",
-    "@progress/kendo-angular-inputs": "12.0.0-develop.1",
-    "@progress/kendo-angular-intl": "12.0.0-develop.1",
-    "@progress/kendo-angular-l10n": "12.0.0-develop.1",
-    "@progress/kendo-angular-label": "12.0.0-develop.1",
-    "@progress/kendo-angular-pdf-export": "12.0.0-develop.1",
-    "@progress/kendo-angular-popup": "12.0.0-develop.1",
+    "@progress/kendo-angular-buttons": "12.0.0-develop.11",
+    "@progress/kendo-angular-common": "12.0.0-develop.11",
+    "@progress/kendo-angular-dateinputs": "12.0.0-develop.11",
+    "@progress/kendo-angular-dropdowns": "12.0.0-develop.11",
+    "@progress/kendo-angular-excel-export": "12.0.0-develop.11",
+    "@progress/kendo-angular-icons": "12.0.0-develop.11",
+    "@progress/kendo-angular-inputs": "12.0.0-develop.11",
+    "@progress/kendo-angular-intl": "12.0.0-develop.11",
+    "@progress/kendo-angular-l10n": "12.0.0-develop.11",
+    "@progress/kendo-angular-label": "12.0.0-develop.11",
+    "@progress/kendo-angular-pdf-export": "12.0.0-develop.11",
+    "@progress/kendo-angular-popup": "12.0.0-develop.11",
+    "@progress/kendo-angular-utils": "12.0.0-develop.11",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "12.0.0-develop.1",
+    "@progress/kendo-angular-schematics": "12.0.0-develop.11",
     "@progress/kendo-common": "^0.2.0",
     "@progress/kendo-file-saver": "^1.0.0"
   },

package/pager/pager-settings.d.ts

@@ -10,12 +10,10 @@
  * * `input`—Input for typing the page number.
  *
  * @example
- * ```html-no-run
- *
- * <kendo-grid
- *    [pageable]="{
- *        type: 'numeric'
- *    }">
+ * ```html
+ * <kendo-grid [pageable]="{ type: 'numeric' }">
+ *   <kendo-grid-column field="ProductID"></kendo-grid-column>
+ *   ...
  * </kendo-grid>
  * ```
  */
@@ -29,12 +27,10 @@ export declare type PagerType = 'numeric' | 'input';
  * * `both`&mdash;Two pagers are rendered - one above the Grid headers, and one - below the data table.
  *
  * @example
- * ```html-no-run
- *
- * <kendo-grid
- *    [pageable]="{
- *        position: 'both'
- *    }">
+ * ```html
+ * <kendo-grid [pageable]="{ position: 'both' }">
+ *   <kendo-grid-column field="ProductID"></kendo-grid-column>
+ *   ...
  * </kendo-grid>
  * ```
  */

package/pager/pager-template.directive.d.ts

@@ -6,7 +6,8 @@ import { TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
  * Represents the pager template which helps to customize the pager appearance in the Grid. To define a pager
- * template, nest an `<ng-template>` tag with the `kendoPagerTemplate` directive inside `<kendo-grid>`.
+ * template, nest an `<ng-template>` tag with the `kendoPagerTemplate` directive inside `<kendo-grid>` tag
+ * [see example](slug:pager_template_grid).
  *
  * The template context provides the following fields:
  * * `currentPage`&mdash;The index of the displayed page.
@@ -14,53 +15,19 @@ import * as i0 from "@angular/core";
  * * `skip`&mdash;The current skip value.
  * * `total`&mdash;The total number of records.
  * * `totalPages`&mdash;The total number of available pages.
- * *  Needs to be provided as an input to inner pager components used within the template when the Grid is navigable.
  *
  * @example
- * ```ts-preview
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *      <kendo-grid
- *        [kendoGridBinding]="gridData"
- *        [pageSize]="1"
- *        [pageable]="true"
- *      >
- *       <kendo-grid-column field="ProductID" title="ID" [width]="40">
- *       </kendo-grid-column>
- *       <kendo-grid-column field="ProductName" title="Name" [width]="250">
- *       </kendo-grid-column>
- *       <kendo-grid-column field="UnitPrice" title="Price" [width]="80" format="{0:c}">
- *       </kendo-grid-column>
- *
- *       <ng-template kendoPagerTemplate let-totalPages="totalPages" let-currentPage="currentPage">
- *          <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
- *          <kendo-pager-numeric-buttons [buttonCount]="10"></kendo-pager-numeric-buttons>
- *          <kendo-pager-next-buttons></kendo-pager-next-buttons>
- *          <kendo-pager-info></kendo-pager-info>
- *          Current page: {{currentPage}}
- *       </ng-template>
- *
- *    </kendo-grid>
- *     `
- * })
- *
- * class AppComponent {
- *     public gridData = [{
- *         "ProductID": 1,
- *         "ProductName": "Chai",
- *         "UnitPrice": 18.0000,
- *         "Discontinued": false
- *       }, {
- *         "ProductID": 2,
- *         "ProductName": "Chang",
- *         "UnitPrice": 19.0000,
- *         "Discontinued": true
- *       }
- *     ];
- * }
- *
+ * ```html
+ * <kendo-grid ... [pageable]="true">
+ *   <ng-template kendoPagerTemplate let-totalPages="totalPages" let-currentPage="currentPage">
+ *     <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
+ *     <kendo-pager-next-buttons></kendo-pager-next-buttons>
+ *     <kendo-pager-info></kendo-pager-info>
+ *       Current page: {{currentPage}}
+ *   </ng-template>
+ *   <kendo-grid-column field="ProductID"></kendo-grid-column>
+ *   <kendo-grid-column field="ProductName"></kendo-grid-column>
+ * </kendo-grid>
  * ```
  */
 export declare class PagerTemplateDirective {

package/pdf/pdf-template.directive.d.ts

@@ -7,50 +7,22 @@ import { PDFExportTemplateDirective } from '@progress/kendo-angular-pdf-export';
 import * as i0 from "@angular/core";
 /**
  * Represents the PDF page template of the Grid that helps to customize the PDF pages. To define a page template,
- * nest an `<ng-template>` tag with the `kendoGridPDFTemplate` directive inside `<kendo-grid-pdf>`.
+ * nest an `<ng-template>` tag with the `kendoGridPDFTemplate` directive inside `<kendo-grid-pdf>` tag.
  *
  * The template context provides the following fields:
  * - `pageNumber`&mdash;Defines PDF page number.
  * - `totalPages`&mdash;Defines the total number of PDF pages.
  *
  * @example
- * ```ts-preview
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-grid [data]="gridData">
- *             <ng-template kendoGridToolbarTemplate>
- *                 <button kendoGridPDFCommand icon="file-pdf">Export to PDF</button>
- *             </ng-template>
- *             <kendo-grid-column field="ProductName">
- *             </kendo-grid-column>
- *              <kendo-grid-column field="UnitPrice">
- *             </kendo-grid-column>
- *             <kendo-grid-pdf fileName="Products.pdf" paperSize="A4" [margin]="{ top: '1cm', left: '1cm', right: '1cm', bottom: '1cm' }">
- *                 <ng-template kendoGridPDFTemplate let-pageNum="pageNum" let-totalPages="totalPages">
- *                     <div style="position: absolute;top: 5px; left: 5px;">
- *                         Page {{ pageNum }} of {{ totalPages }}
- *                     </div>
- *                 </ng-template>
- *             </kendo-grid-pdf>
- *         </kendo-grid>
- *     `
- * })
- *
- * class AppComponent {
- *     public gridData = [{
- *         "ProductID": 1,
- *         "ProductName": "Chai",
- *         "UnitPrice": 18.0000
- *       }, {
- *         "ProductID": 2,
- *         "ProductName": "Chang",
- *         "UnitPrice": 19.0000
- *       }
- *     ];
- * }
- *
+ * ```html
+ * <kendo-grid [data]="gridData">
+ *   ...
+ *   <kendo-grid-pdf fileName="Products.pdf" paperSize="A4">
+ *     <ng-template kendoGridPDFTemplate let-pageNumber="pageNumber" let-totalPages="totalPages">
+ *         Page {{ pageNumber }} of {{ totalPages }}
+ *     </ng-template>
+ *   </kendo-grid-pdf>
+ * </kendo-grid>
  * ```
  */
 export declare class PDFTemplateDirective extends PDFExportTemplateDirective {

package/pdf/pdf.module.d.ts

@@ -14,28 +14,19 @@ import * as i5 from "@progress/kendo-angular-icons";
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid and PDF modules
- * import { GridModule, PDFModule } from '@progress/kendo-angular-grid';
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
+ * ```ts
  * import { NgModule } from '@angular/core';
- *
- * // Import the app component
+ * import { BrowserModule } from "@angular/platform-browser";
+ * import { GridModule, PDFModule } from '@progress/kendo-angular-grid';
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule, PDFModule], // import Grid and PDF modules
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule, PDFModule],
  *     bootstrap:    [AppComponent]
  * })
- * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
+ * export class AppModule {}
  *
  * ```
  */

package/rendering/body.module.d.ts

@@ -18,19 +18,20 @@ import * as i12 from "../editing/remove-command.directive";
 import * as i13 from "../editing/add-command.directive";
 import * as i14 from "./cell-loading.template.directive";
 import * as i15 from "./loading-template.directive";
-import * as i16 from "@angular/common";
-import * as i17 from "@angular/forms";
-import * as i18 from "../shared.module";
-import * as i19 from "../grouping/group.module";
-import * as i20 from "@progress/kendo-angular-inputs";
-import * as i21 from "@progress/kendo-angular-dateinputs";
-import * as i22 from "@progress/kendo-angular-common";
+import * as i16 from "../columns/reorder-column.component";
+import * as i17 from "@angular/common";
+import * as i18 from "@angular/forms";
+import * as i19 from "../shared.module";
+import * as i20 from "../grouping/group.module";
+import * as i21 from "@progress/kendo-angular-inputs";
+import * as i22 from "@progress/kendo-angular-dateinputs";
+import * as i23 from "@progress/kendo-angular-common";
 /**
  * @hidden
  */
 export declare class BodyModule {
     static exports(): any[];
     static ɵfac: i0.ɵɵFactoryDeclaration<BodyModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<BodyModule, [typeof i1.CommandColumnComponent, typeof i2.CheckboxColumnComponent, typeof i3.SelectionCheckboxDirective, typeof i4.CellTemplateDirective, typeof i5.EditTemplateDirective, typeof i6.TableBodyComponent, typeof i7.NoRecordsTemplateDirective, typeof i8.CellComponent, typeof i9.EditCommandDirective, typeof i10.CancelCommandDirective, typeof i11.SaveCommandDirective, typeof i12.RemoveCommandDirective, typeof i13.AddCommandDirective, typeof i14.CellLoadingTemplateDirective, typeof i15.LoadingTemplateDirective], [typeof i16.CommonModule, typeof i17.ReactiveFormsModule, typeof i17.FormsModule, typeof i18.SharedModule, typeof i19.GroupModule, typeof i20.NumericTextBoxModule, typeof i21.DatePickerModule, typeof i22.ResizeSensorModule], [typeof i1.CommandColumnComponent, typeof i2.CheckboxColumnComponent, typeof i3.SelectionCheckboxDirective, typeof i4.CellTemplateDirective, typeof i5.EditTemplateDirective, typeof i6.TableBodyComponent, typeof i7.NoRecordsTemplateDirective, typeof i8.CellComponent, typeof i9.EditCommandDirective, typeof i10.CancelCommandDirective, typeof i11.SaveCommandDirective, typeof i12.RemoveCommandDirective, typeof i13.AddCommandDirective, typeof i14.CellLoadingTemplateDirective, typeof i15.LoadingTemplateDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<BodyModule, [typeof i1.CommandColumnComponent, typeof i2.CheckboxColumnComponent, typeof i3.SelectionCheckboxDirective, typeof i4.CellTemplateDirective, typeof i5.EditTemplateDirective, typeof i6.TableBodyComponent, typeof i7.NoRecordsTemplateDirective, typeof i8.CellComponent, typeof i9.EditCommandDirective, typeof i10.CancelCommandDirective, typeof i11.SaveCommandDirective, typeof i12.RemoveCommandDirective, typeof i13.AddCommandDirective, typeof i14.CellLoadingTemplateDirective, typeof i15.LoadingTemplateDirective, typeof i16.RowReorderColumnComponent], [typeof i17.CommonModule, typeof i18.ReactiveFormsModule, typeof i18.FormsModule, typeof i19.SharedModule, typeof i20.GroupModule, typeof i21.NumericTextBoxModule, typeof i22.DatePickerModule, typeof i23.ResizeSensorModule], [typeof i1.CommandColumnComponent, typeof i2.CheckboxColumnComponent, typeof i3.SelectionCheckboxDirective, typeof i4.CellTemplateDirective, typeof i5.EditTemplateDirective, typeof i6.TableBodyComponent, typeof i7.NoRecordsTemplateDirective, typeof i8.CellComponent, typeof i9.EditCommandDirective, typeof i10.CancelCommandDirective, typeof i11.SaveCommandDirective, typeof i12.RemoveCommandDirective, typeof i13.AddCommandDirective, typeof i14.CellLoadingTemplateDirective, typeof i15.LoadingTemplateDirective, typeof i16.RowReorderColumnComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<BodyModule>;
 }

package/rendering/cell-loading.template.directive.d.ts

@@ -7,17 +7,20 @@ import * as i0 from "@angular/core";
 /**
  * Represents the virtual scrolling cell template of the Grid while loading new data. Provides an option to customize the
  * appearance of the indicator that is displayed while new data is loading. To define the loading cell template,
- * nest an `<ng-template>` tag with the `kendoGridCellLoadingTemplate` directive inside `<kendo-grid>` ([see example]({% slug virtualscrolling_grid %}#toc-custom-loading-skeleton)).
+ * nest an `<ng-template>` tag with the `kendoGridCellLoadingTemplate` directive inside `<kendo-grid>` tag [see example]({% slug virtualscrolling_grid %}#toc-custom-loading-skeleton).
  *
- * The template context is set to the current column, and utilizes the `let-x` syntax&mdash;for example, `let-column`.
+ *
+ * The template context is set to the current column and the following additional field is passed:
+ *
+ * - `column`&mdash;The current column instance. Represents the default context that will be assigned to any template variable which utilizes the `let-x` syntax (for example `let-column`).
  *
  * @example
- * ```ts-no-run
- *       <kendo-grid [data]="data" scrollable="virtual" [rowHeight]="36">
- *         <ng-template kendoGridCellLoadingTemplate let-column>
- *             ...
- *         </ng-template>
- *       </kendo-grid>
+ * ```html
+ * <kendo-grid ... scrollable="virtual" [rowHeight]="36" [height]="450">
+ *   <ng-template kendoGridCellLoadingTemplate let-column>
+ *    ...
+ *   </ng-template>
+ * </kendo-grid>
  * ```
  */
 export declare class CellLoadingTemplateDirective {

package/rendering/cell-template.directive.d.ts

@@ -5,9 +5,9 @@
 import { TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
- * Represents the column cell template of the Grid ([more information and example]({% slug templates_columns_grid %}#toc-cell-template)).
- * Helps to customize the content of the cells. To define the cell template, nest an `<ng-template>` tag
- * with the `kendoGridCellTemplate` directive inside a `<kendo-grid-column>` tag.
+ * Represents the column cell template of the Grid.
+ * Helps to customize the content of the cells. To define the cell template, nest an `<ng-template>` tag with the
+ * `kendoGridCellTemplate` directive inside a `<kendo-grid-column>` tag [see example](slug:templates_columns_grid#toc-cell-template).
  *
  * The template context is set to the current data item and the following additional fields are passed:
  * - `columnIndex`&mdash;The current column index. Use it as an alias for a template variable by utilizing the `let-columnIndex="columnIndex"` syntax.
@@ -16,38 +16,14 @@ import * as i0 from "@angular/core";
  * - `column`&mdash;The current column instance. Use it as an alias for a template variable by utilizing the `let-column="column"` syntax.
  *
  * @example
- * ```ts-preview
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-grid [data]="gridData">
- *             <kendo-grid-column field="ProductName">
- *                 <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
- *                     Data Row #: {{rowIndex}} /
- *                     <strong>{{dataItem.ProductName}}</strong>
- *                     ({{dataItem.Discontinued ? "discontinued" : "active"}})
- *                 </ng-template>
- *             </kendo-grid-column>
- *         </kendo-grid>
- *     `
- * })
- *
- * class AppComponent {
- *     public gridData = [{
- *         "ProductID": 1,
- *         "ProductName": "Chai",
- *         "UnitPrice": 18.0000,
- *         "Discontinued": false
- *       }, {
- *         "ProductID": 2,
- *         "ProductName": "Chang",
- *         "UnitPrice": 19.0000,
- *         "Discontinued": true
- *       }
- *     ];
- * }
- *
+ * ```html
+ * <kendo-grid [data]="gridData" ...>
+ *   <kendo-grid-column field="ProductName">
+ *     <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex" let-column="column">
+ *       Data Row: {{rowIndex}}
+ *     </ng-template>
+ *   </kendo-grid-column>
+ * </kendo-grid>
  * ```
  */
 export declare class CellTemplateDirective {

package/rendering/cell.component.d.ts

@@ -9,6 +9,7 @@ import { FormGroup } from '@angular/forms';
 import { CellContext } from './common/cell-context';
 import { IdService } from '../common/id.service';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { SVGIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -19,6 +20,8 @@ export declare class CellComponent implements DoCheck {
     private localizationService;
     private cellContext;
     get commandCellClass(): boolean;
+    get dragHandleCellClass(): boolean;
+    get dragRowHandleLabel(): string;
     column: any;
     columnIndex: number;
     isNew: boolean;
@@ -28,6 +31,7 @@ export declare class CellComponent implements DoCheck {
     set rowIndex(index: number);
     get rowIndex(): number;
     dataItem: any;
+    reorderIcon: SVGIcon;
     get isEdited(): boolean;
     get showLoading(): boolean;
     get formGroup(): FormGroup;
@@ -40,6 +44,7 @@ export declare class CellComponent implements DoCheck {
     get selectionCheckboxLabel(): string;
     get isSpanColumn(): boolean;
     get childColumns(): ColumnComponent[];
+    get isRowReorderColumn(): boolean;
     private _rowIndex;
     private get isColumnEditable();
     private _templateContext;

package/rendering/common/row-class.d.ts

@@ -11,9 +11,9 @@ export interface RowClassArgs extends RowArgs {
 }
 /**
  * Represents the callback that is used by the
- * [rowClass]({% slug api_grid_gridcomponent %}#toc-rowClass) property.
+ * [rowClass]({% slug api_grid_gridcomponent %}#toc-rowclass) property.
  *
- * ```ts-no-run
+ * ```ts
  *  rowCallback({ dataItem, index }) {
  *    const isEven = index % 2 === 0;
  *    return {
@@ -31,7 +31,7 @@ export declare type RowClassFn = (context: RowClassArgs) => string | string[] |
  * Represents the callback that is used by the
  * [rowSelected]({% slug api_grid_gridcomponent %}#toc-rowselected) property.
  *
- * ```ts-no-run
+ * ```ts
  * rowCallback({ dataItem, index }) {
  *   return index % 2 === 0;
  * }
@@ -41,7 +41,7 @@ export declare type RowSelectedFn = (context: RowArgs) => boolean;
 /**
  * Represents the callback that is used to determine whether a given data row will be sticky.
  *
- * ```ts-no-run
+ * ```ts
  * rowStickyCallback({ dataItem, index }) {
  *   return index % 2 === 0;
  * }

package/rendering/details/detail-template.directive.d.ts

@@ -19,64 +19,16 @@ export declare type DetailTemplateShowIfFn = (dataItem: any, index: number) => b
  * To define the detail template, nest an `<ng-template>` tag with the `kendoGridDetailTemplate` directive inside a `<kendo-grid>` tag.
  *
  * @example
- * ```ts-preview
- *
- * _@Component({
- *   selector: 'my-app',
- *   template: `
- *       <kendo-grid
- *         [data]="data"
- *         selectable="true"
- *         style="height: 160px"
- *         >
- *         <kendo-grid-column field="ProductID"></kendo-grid-column>
- *         <kendo-grid-column field="ProductName"></kendo-grid-column>
- *         <kendo-grid-column field="UnitPrice"></kendo-grid-column>
- *         <ng-template kendoGridDetailTemplate let-dataItem>
- *           <div *ngIf="dataItem.Category">
- *             <header>{{dataItem.Category?.CategoryName}}</header>
- *             <span>{{dataItem.Category?.Description}}</span>
- *           </div>
- *         </ng-template>
- *       </kendo-grid>
- *   `
- * })
- *
- * class AppComponent {
- *     public data = [{
- *         "ProductID": 1,
- *         "ProductName": "Chai",
- *         "UnitPrice": 18.0000,
- *         "Discontinued": false,
- *         "Category": {
- *             "CategoryID": 1,
- *             "CategoryName": "Beverages",
- *             "Description": "Soft drinks, coffees, teas, beers, and ales"
- *         }
- *       }, {
- *         "ProductID": 2,
- *         "ProductName": "Chang",
- *         "UnitPrice": 19.0000,
- *         "Discontinued": false,
- *         "Category": {
- *             "CategoryID": 1,
- *             "CategoryName": "Beverages",
- *             "Description": "Soft drinks, coffees, teas, beers, and ales"
- *         }
- *       }, {
- *         "ProductID": 3,
- *         "ProductName": "Aniseed Syrup",
- *         "UnitPrice": 10.0000,
- *         "Discontinued": false,
- *         "Category": {
- *             "CategoryID": 2,
- *             "CategoryName": "Condiments",
- *             "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
- *         }
- *     }];
- *
- * }
- *
+ * ```html
+ * <kendo-grid [data]="data" selectable="true" style="height: 160px">
+ *    <kendo-grid-column field="ProductName"></kendo-grid-column>
+ *    <ng-template kendoGridDetailTemplate let-dataItem>
+ *       <div *ngIf="dataItem.Category">
+ *          <header>{{dataItem.Category?.CategoryName}}</header>
+ *          span>{{dataItem.Category?.Description}}</span>
+ *       </div>
+ *    </ng-template>
+ * </kendo-grid>
  * ```
  *
  */

package/rendering/details-expand.directive.d.ts

@@ -8,7 +8,7 @@ import { Subscription } from 'rxjs';
 import { RowArgs } from './common/row-args';
 import * as i0 from "@angular/core";
 /**
- * A directive which controls the expanded state of the master detail rows.
+ * A directive which controls the expanded state of the master detail rows. ([see example](slug:master_detail_expanded_state_grid#toc-built-in-directive))
  */
 export declare class ExpandDetailsDirective implements OnChanges, OnDestroy {
     protected grid: GridComponent;