@progress/kendo-angular-grid 12.0.0-develop.9 → 12.0.0

package/esm2020/columns/column-base.mjs

@@ -36,9 +36,9 @@ export class ColumnBase {
          */
         this.matchesMedia = true;
         /**
-         * The column index after reordering.
+         * The column index after reordering. The `orderIndex` is a read-only property. Setting this field does not affect column order.
          *
-         * > `orderIndex` is a read-only property. Setting this field does not affect column order.
+         * @default 0
          */
         this.orderIndex = 0;
         /**
@@ -73,18 +73,22 @@ export class ColumnBase {
         this.sticky = false;
         /**
          * Specifies if the column can be locked or unlocked from the column menu or by reordering the columns.
+         * @default true
          */
         this.lockable = true;
         /**
          * Specifies if the column can be stuck or unstuck from the column menu.
+         * @default true
          */
         this.stickable = true;
         /**
          * Specifies if the column menu will be shown for the column.
+         * @default true
          */
         this.columnMenu = true;
         /**
          * Specifies if the column will be included in the column-chooser list.
+         * @default true
          */
         this.includeInChooser = true;
         /**
@@ -132,44 +136,6 @@ export class ColumnBase {
      *
      * @default false
      *
-     * @example
-     * ```ts
-     * _@Component({
-     *    selector: 'my-app',
-     *    template: `
-     *        <kendo-grid [data]="gridData" [scrollable]="scrollable" style="height: 200px">
-     *          <kendo-grid-column field="ProductID" title="Product ID" [width]="120" [locked]="true">
-     *          </kendo-grid-column>
-     *          <kendo-grid-column field="ProductName" title="Product Name" [width]="200">
-     *          </kendo-grid-column>
-     *          <kendo-grid-column field="UnitPrice" title="Unit Price" [width]="230">
-     *          </kendo-grid-column>
-     *        </kendo-grid>
-     *    `
-     * })
-     *
-     * class AppComponent {
-     *    public gridData: any[];
-     *
-     *    constructor() {
-     *        this.gridData = products;
-     *    }
-     * }
-     *
-     * const products = [{
-     *    "ProductID": 1,
-     *    "ProductName": "Chai",
-     *    "UnitPrice": 18.0000,
-     *    "Discontinued": true
-     *  }, {
-     *    "ProductID": 2,
-     *    "ProductName": "Chang",
-     *    "UnitPrice": 19.0000,
-     *    "Discontinued": false
-     *  }
-     * ];
-     *
-     * ```
      */
     set locked(value) {
         this._locked = value;

package/esm2020/common/preventable-event.mjs

@@ -18,7 +18,7 @@ export class PreventableEvent {
         this.prevented = true;
     }
     /**
-     * Returns `true` if the event was prevented
+     * Returns a respective boolean if the event was prevented
      * by any of its subscribers.
      *
      * @returns `true` if the default action was prevented.

package/esm2020/common/single-popup.service.mjs

@@ -35,7 +35,7 @@ export class PopupCloseEvent extends PreventableEvent {
 const DEFAULT_POPUP_CLASS = 'k-grid-filter-popup';
 /**
  * The service that is used for the popups of the filter and column menus
- * ([see example]({% slug filter_menu %}#toc-custom-filter-row-components)#toc-filter-menu-with-popup).
+ * ([see example]({% slug filter_menu %}#toc-filter-menu-with-popup)).
  */
 export class SinglePopupService {
     constructor(popupService, renderer, ngZone, scrollSyncService, localization) {

package/esm2020/excel/excel.module.mjs

@@ -15,29 +15,19 @@ const declarations = [ExcelComponent, ExcelCommandDirective];
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid and Excel modules
- * import { GridModule, ExcelModule } 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, ExcelModule } from '@progress/kendo-angular-grid';
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule, ExcelModule], // import Grid and Excel modules
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule, ExcelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export class ExcelModule {

package/esm2020/grid.component.mjs

@@ -631,7 +631,7 @@ export class GridComponent {
         return this.selectionService.enableMarquee || this.cellSelectionService.enableMarquee;
     }
     /**
-     * Enables the [row reordering]({% slug ToDo %}) of the Grid.
+     * Enables the [row reordering]({% slug reordering_rows_grid %}) of the Grid.
      * @default false
      */
     set rowReorderable(value) {

package/esm2020/grid.module.mjs

@@ -168,29 +168,19 @@ const declarations = [
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid module
- * import { GridModule } 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 { GridModule } from '@progress/kendo-angular-grid';
+ * import { BrowserModule } from "@angular/platform-browser";
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule], // import Grid module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export class GridModule {

package/esm2020/layout/sizing-options.service.mjs

@@ -5,6 +5,9 @@
 import { Injectable } from '@angular/core';
 import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
+/**
+ * @hidden
+*/
 export class SizingOptionsService {
     constructor() {
         this.changes = new Subject();

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1681884669,
-    version: '12.0.0-develop.9',
+    publishDate: 1682434440,
+    version: '12.0.0',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/pdf/pdf.module.mjs

@@ -27,28 +27,19 @@ const declarations = [
  *
  * @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/esm2020/rendering/toolbar/toolbar-position.mjs

@@ -2,4 +2,21 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+/**
+ * Defines the settings for `position` property of the  the Grid Toolbar Template. [See example](slug:toolbartemplate_grid#toc-setting-the-toolbar-position)
+ *
+ * The possible values are:
+ * * `top`—Displays the Toolbar a the top of the Grid.
+ * * `bottom`—Displays the Toolbar at the bottom of the Grid.
+ * * `both`—Displays the Toolbar at the top and bottom of the Grid.
+ *
+ * @example
+ * ```html
+ * <kendo-grid >
+ *   <ng-template kendoGridToolbarTemplate position="bottom" let-position="position">
+ *     <button (click)="onClick()">Custom action</button>
+ *   </ng-template>
+ * </kendo-grid>
+ * ```
+ */
 export {};

package/esm2020/row-reordering/row-reorder.service.mjs

@@ -22,6 +22,7 @@ export class RowReorderService {
     }
     press(ev) {
         this.dragTarget = ev.dragTarget;
+        this.offsetY = ev.dragEvent.offsetY;
     }
     dragStart() {
         this.createDropIndicator();
@@ -33,7 +34,7 @@ export class RowReorderService {
         }
         const position = {
             x: ev.dragEvent.clientX,
-            y: ev.dragEvent.clientY
+            y: ev.dragEvent.clientY - this.offsetY
         };
         if (isPresent(this.hintElement)) {
             this.renderer.setStyle(this.hintElement, 'left', `${position.x}px`);

package/excel/excel.module.d.ts

@@ -13,29 +13,19 @@ import * as i4 from "@progress/kendo-angular-excel-export";
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid and Excel modules
- * import { GridModule, ExcelModule } 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, ExcelModule } from '@progress/kendo-angular-grid';
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule, ExcelModule], // import Grid and Excel modules
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule, ExcelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export declare class ExcelModule {

package/fesm2015/progress-kendo-angular-grid.mjs

@@ -934,7 +934,7 @@ class PreventableEvent {
         this.prevented = true;
     }
     /**
-     * Returns `true` if the event was prevented
+     * Returns a respective boolean if the event was prevented
      * by any of its subscribers.
      *
      * @returns `true` if the default action was prevented.
@@ -2832,8 +2832,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1681884669,
-    version: '12.0.0-develop.9',
+    publishDate: 1682434440,
+    version: '12.0.0',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -3212,9 +3212,9 @@ class ColumnBase {
          */
         this.matchesMedia = true;
         /**
-         * The column index after reordering.
+         * The column index after reordering. The `orderIndex` is a read-only property. Setting this field does not affect column order.
          *
-         * > `orderIndex` is a read-only property. Setting this field does not affect column order.
+         * @default 0
          */
         this.orderIndex = 0;
         /**
@@ -3249,18 +3249,22 @@ class ColumnBase {
         this.sticky = false;
         /**
          * Specifies if the column can be locked or unlocked from the column menu or by reordering the columns.
+         * @default true
          */
         this.lockable = true;
         /**
          * Specifies if the column can be stuck or unstuck from the column menu.
+         * @default true
          */
         this.stickable = true;
         /**
          * Specifies if the column menu will be shown for the column.
+         * @default true
          */
         this.columnMenu = true;
         /**
          * Specifies if the column will be included in the column-chooser list.
+         * @default true
          */
         this.includeInChooser = true;
         /**
@@ -3308,44 +3312,6 @@ class ColumnBase {
      *
      * @default false
      *
-     * @example
-     * ```ts
-     * _@Component({
-     *    selector: 'my-app',
-     *    template: `
-     *        <kendo-grid [data]="gridData" [scrollable]="scrollable" style="height: 200px">
-     *          <kendo-grid-column field="ProductID" title="Product ID" [width]="120" [locked]="true">
-     *          </kendo-grid-column>
-     *          <kendo-grid-column field="ProductName" title="Product Name" [width]="200">
-     *          </kendo-grid-column>
-     *          <kendo-grid-column field="UnitPrice" title="Unit Price" [width]="230">
-     *          </kendo-grid-column>
-     *        </kendo-grid>
-     *    `
-     * })
-     *
-     * class AppComponent {
-     *    public gridData: any[];
-     *
-     *    constructor() {
-     *        this.gridData = products;
-     *    }
-     * }
-     *
-     * const products = [{
-     *    "ProductID": 1,
-     *    "ProductName": "Chai",
-     *    "UnitPrice": 18.0000,
-     *    "Discontinued": true
-     *  }, {
-     *    "ProductID": 2,
-     *    "ProductName": "Chang",
-     *    "UnitPrice": 19.0000,
-     *    "Discontinued": false
-     *  }
-     * ];
-     *
-     * ```
      */
     set locked(value) {
         this._locked = value;
@@ -5773,7 +5739,7 @@ class PopupCloseEvent extends PreventableEvent {
 const DEFAULT_POPUP_CLASS = 'k-grid-filter-popup';
 /**
  * The service that is used for the popups of the filter and column menus
- * ([see example]({% slug filter_menu %}#toc-custom-filter-row-components)#toc-filter-menu-with-popup).
+ * ([see example]({% slug filter_menu %}#toc-filter-menu-with-popup)).
  */
 class SinglePopupService {
     constructor(popupService, renderer, ngZone, scrollSyncService, localization) {
@@ -6369,6 +6335,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
 
+/**
+ * @hidden
+*/
 class SizingOptionsService {
     constructor() {
         this.changes = new Subject();
@@ -6479,6 +6448,7 @@ class RowReorderService {
     }
     press(ev) {
         this.dragTarget = ev.dragTarget;
+        this.offsetY = ev.dragEvent.offsetY;
     }
     dragStart() {
         this.createDropIndicator();
@@ -6490,7 +6460,7 @@ class RowReorderService {
         }
         const position = {
             x: ev.dragEvent.clientX,
-            y: ev.dragEvent.clientY
+            y: ev.dragEvent.clientY - this.offsetY
         };
         if (isPresent$1(this.hintElement)) {
             this.renderer.setStyle(this.hintElement, 'left', `${position.x}px`);
@@ -11352,27 +11322,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * [ColumnMenuTemplate]({% slug api_grid_columnmenutemplatedirective %}) directive.
  *
  * @example
- * ```ts-preview
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *       <kendo-grid [data]="data" [columnMenu]="true">
- *          <ng-template kendoGridColumnMenuTemplate let-service="service">
- *              <span class="k-icon k-i-x" (click)="service.close()"
- *                  style="position: absolute; right: 5px; top: 5px;cursor: pointer;"></span>
- *              <kendo-grid-columnmenu-sort [service]="service">
- *              </kendo-grid-columnmenu-sort>
- *          </ng-template>
- *          <kendo-grid-column field="Field1"></kendo-grid-column>
- *          <kendo-grid-column field="Field2"></kendo-grid-column>
- *       </kendo-grid>
- *     `
- * })
- *
- * class AppComponent {
- *   public data: any[] = [{ Field1: 'Foo', Field2: 'Bar' }];
- * }
+ * ```html
+ * <kendo-grid [data]="data" [columnMenu]="true">
+ *    <ng-template kendoGridColumnMenuTemplate let-service="service">
+ *       <span class="k-icon k-i-x" (click)="service.close()" </span>
+ *       <kendo-grid-columnmenu-sort [service]="service">
+ *       </kendo-grid-columnmenu-sort>
+ *    </ng-template>
+ *    <kendo-grid-column field="Field1"></kendo-grid-column>
+ * </kendo-grid>
  *
  * ```
  */
@@ -19504,7 +19462,7 @@ class GridComponent {
         return this.selectionService.enableMarquee || this.cellSelectionService.enableMarquee;
     }
     /**
-     * Enables the [row reordering]({% slug ToDo %}) of the Grid.
+     * Enables the [row reordering]({% slug reordering_rows_grid %}) of the Grid.
      * @default false
      */
     set rowReorderable(value) {
@@ -25931,29 +25889,19 @@ const declarations$2 = [
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid module
- * import { GridModule } 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 { GridModule } from '@progress/kendo-angular-grid';
+ * import { BrowserModule } from "@angular/platform-browser";
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule], // import Grid module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 class GridModule {
@@ -26573,28 +26521,19 @@ const declarations$1 = [
  *
  * @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 {}
  *
  * ```
  */
@@ -26854,29 +26793,19 @@ const declarations = [ExcelComponent, ExcelCommandDirective];
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Grid and Excel modules
- * import { GridModule, ExcelModule } 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, ExcelModule } from '@progress/kendo-angular-grid';
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, GridModule, ExcelModule], // import Grid and Excel modules
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, GridModule, ExcelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 class ExcelModule {