@progress/kendo-angular-layout 17.0.0-develop.21 → 17.0.0-develop.23

package/{esm2020 → esm2022}/tilelayout/dragging-service.mjs

@@ -16,21 +16,15 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class TileLayoutDraggingService {
-    constructor(zone, renderer, cdr, localization) {
-        this.zone = zone;
-        this.renderer = renderer;
-        this.cdr = cdr;
-        this.localization = localization;
-        this.reorderable = new BehaviorSubject(null);
-        this.resizable = new BehaviorSubject(null);
-        this.reorder = new Subject();
-        this.resize = new Subject();
-        this.lastDragCursorOffset = {
-            x: 0,
-            y: 0
-        };
-        this.localizationSubscription = this.localization.changes.subscribe(({ rtl }) => this.rtl = rtl);
-    }
+    zone;
+    renderer;
+    cdr;
+    localization;
+    reorderable = new BehaviorSubject(null);
+    resizable = new BehaviorSubject(null);
+    reorder = new Subject();
+    resize = new Subject();
+    tileLayoutSettings;
     get colStart() {
         return this.currentColStart;
     }
@@ -43,6 +37,33 @@ export class TileLayoutDraggingService {
     get order() {
         return this.targetOrder;
     }
+    draggedItem;
+    draggedItemWrapper;
+    reordering;
+    resizing;
+    offset;
+    targetSize;
+    cellSize;
+    targetOrder;
+    currentColStart;
+    currentRowStart;
+    startingPoint;
+    currentResizingColSpan;
+    currentResizingRowSpan;
+    direction;
+    lastDragCursorOffset = {
+        x: 0,
+        y: 0
+    };
+    localizationSubscription;
+    rtl;
+    constructor(zone, renderer, cdr, localization) {
+        this.zone = zone;
+        this.renderer = renderer;
+        this.cdr = cdr;
+        this.localization = localization;
+        this.localizationSubscription = this.localization.changes.subscribe(({ rtl }) => this.rtl = rtl);
+    }
     ngOnDestroy() {
         this.localizationSubscription.unsubscribe();
     }
@@ -396,9 +417,9 @@ export class TileLayoutDraggingService {
         const hintHeight = totalHintCellsHeight + totalHintGapsHeight - HINT_BORDERS_HEIGHT;
         return hintHeight;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutDraggingService, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutDraggingService });
 }
-TileLayoutDraggingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutDraggingService, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
-TileLayoutDraggingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutDraggingService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutDraggingService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutDraggingService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i1.LocalizationService }]; } });

package/{esm2020 → esm2022}/tilelayout/keyboard-navigation.service.mjs

@@ -15,11 +15,16 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class TileLayoutKeyboardNavigationService {
+    zone;
+    renderer;
+    localization;
+    navigable = new BehaviorSubject(false);
+    localizationSubscription;
+    rtl;
     constructor(zone, renderer, localization) {
         this.zone = zone;
         this.renderer = renderer;
         this.localization = localization;
-        this.navigable = new BehaviorSubject(false);
         this.localizationSubscription = this.localization.changes.subscribe(({ rtl }) => this.rtl = rtl);
     }
     ngOnDestroy() {
@@ -138,9 +143,9 @@ export class TileLayoutKeyboardNavigationService {
     targetTile(focusedTile, items, offset) {
         return items.find(item => item.order === focusedTile.order + offset);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutKeyboardNavigationService, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutKeyboardNavigationService });
 }
-TileLayoutKeyboardNavigationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutKeyboardNavigationService, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
-TileLayoutKeyboardNavigationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutKeyboardNavigationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutKeyboardNavigationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutKeyboardNavigationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1.LocalizationService }]; } });

package/{esm2020 → esm2022}/tilelayout/reorder-event.mjs

@@ -8,6 +8,14 @@ import { PreventableEvent } from '@progress/kendo-angular-common';
  * positions of the items is changed via the UI. If you prevent the event, the change is canceled ([see example]({% slug reordering_tilelayout %}#toc-handling-the-reorder-event)).
  */
 export class TileLayoutReorderEvent extends PreventableEvent {
+    item;
+    items;
+    newIndex;
+    oldIndex;
+    newCol;
+    oldCol;
+    newRow;
+    oldRow;
     /**
      * Constructs the event arguments for the `reorder` event.
      * @param item - The TileLayoutItem being reordered.

package/{esm2020 → esm2022}/tilelayout/resize-event.mjs

@@ -8,6 +8,12 @@ import { PreventableEvent } from '@progress/kendo-angular-common';
  * is changed from the UI. If you cancel the event, the change is prevented ([see example]({% slug resizing_tilelayout %}#toc-handling-the-resize-event)).
  */
 export class TileLayoutResizeEvent extends PreventableEvent {
+    item;
+    items;
+    newRowSpan;
+    oldRowSpan;
+    newColSpan;
+    oldColSpan;
     /**
      * Constructs the event arguments for the `resize` event.
      * @param item - The TileLayoutItem being resized

package/{esm2020 → esm2022}/tilelayout/tilelayout-item-body.component.mjs

@@ -8,16 +8,14 @@ import * as i0 from "@angular/core";
  * Holds the main content of the TileLayoutItem component.
  */
 export class TileLayoutItemBodyComponent {
-    constructor() {
-        this.hostClass = true;
-        this.minHeight = 0;
-    }
-}
-TileLayoutItemBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TileLayoutItemBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TileLayoutItemBodyComponent, isStandalone: true, selector: "kendo-tilelayout-item-body", host: { properties: { "class.k-tilelayout-item-body": "this.hostClass", "class.k-card-body": "this.hostClass", "style.min-height": "this.minHeight" } }, ngImport: i0, template: `
+    hostClass = true;
+    minHeight = 0;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutItemBodyComponent, isStandalone: true, selector: "kendo-tilelayout-item-body", host: { properties: { "class.k-tilelayout-item-body": "this.hostClass", "class.k-card-body": "this.hostClass", "style.min-height": "this.minHeight" } }, ngImport: i0, template: `
         <ng-content></ng-content>
     `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemBodyComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemBodyComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-tilelayout-item-body',

package/{esm2020 → esm2022}/tilelayout/tilelayout-item-header.component.mjs

@@ -9,11 +9,9 @@ import * as i0 from "@angular/core";
  * This is the area which can be dragged to reorder the items if reordering is enabled for this item.
  */
 export class TileLayoutItemHeaderComponent {
-    constructor(hostEl, renderer) {
-        this.hostEl = hostEl;
-        this.renderer = renderer;
-        this.hostClass = true;
-    }
+    hostEl;
+    renderer;
+    hostClass = true;
     /**
      * @hidden
      */
@@ -28,12 +26,16 @@ export class TileLayoutItemHeaderComponent {
             this.renderer.removeClass(hostElement, 'k-touch-action-none');
         }
     }
-}
-TileLayoutItemHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemHeaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-TileLayoutItemHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TileLayoutItemHeaderComponent, isStandalone: true, selector: "kendo-tilelayout-item-header", inputs: { reorderable: "reorderable" }, host: { properties: { "class.k-tilelayout-item-header": "this.hostClass", "class.k-card-header": "this.hostClass" } }, ngImport: i0, template: `
+    constructor(hostEl, renderer) {
+        this.hostEl = hostEl;
+        this.renderer = renderer;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemHeaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutItemHeaderComponent, isStandalone: true, selector: "kendo-tilelayout-item-header", inputs: { reorderable: "reorderable" }, host: { properties: { "class.k-tilelayout-item-header": "this.hostClass", "class.k-card-header": "this.hostClass" } }, ngImport: i0, template: `
         <ng-content></ng-content>
     `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemHeaderComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-tilelayout-item-header',

package/{esm2020 → esm2022}/tilelayout/tilelayout-item.component.mjs

@@ -21,50 +21,26 @@ import * as i3 from "./keyboard-navigation.service";
  * Represents a tile item within the TileLayoutComponent.
  */
 export class TileLayoutItemComponent {
-    constructor(elem, zone, renderer, localization, draggingService, keyboardNavigationService) {
-        this.elem = elem;
-        this.zone = zone;
-        this.renderer = renderer;
-        this.localization = localization;
-        this.draggingService = draggingService;
-        this.keyboardNavigationService = keyboardNavigationService;
-        /**
-         * Determines how many rows will the tile item span ([see example](slug:tiles_tilelayout#toc-programmatic-resizing)).
-         * @default 1
-         */
-        this.rowSpan = 1;
-        /**
-         * Determines how many columns will the tile item span ([see example](slug:tiles_tilelayout#toc-programmatic-resizing)).
-         * @default 1
-         */
-        this.colSpan = 1;
-        /**
-         * Determines whether the item can be reordered. By default all items are reorderable when the [reorderable]({% slug api_layout_tilelayoutcomponent %}#toc-reorderable) property of the TileLayoutComponent is set to `true` ([see example]({% slug reordering_tilelayout %}#toc-disabling-reordering)).
-         *
-         * @default true
-         */
-        this.reorderable = true;
-        /**
-         * Determines whether the item can be resized. By default all items are resizable when the [resizable]({% slug api_layout_tilelayoutcomponent %}#resizable) property of the TileLayoutComponent is set to `true` ([see example](slug:resizing_tilelayout#toc-disabling-resizing)).
-         * @default true
-         */
-        this.resizable = true;
-        this.itemClass = true;
-        this.hostRole = 'listitem';
-        /**
-         * @hidden
-         */
-        this.titleId = '';
-        this.subs = new Subscription();
-        this.subs.add(this.localization.changes.subscribe(({ rtl }) => {
-            this.rtl = rtl;
-        }));
-        this.subs.add(this.draggingService.resizable.subscribe(resizable => {
-            this.resizeDirections = resizable && this.resizable ?
-                this.rtl ? RTL_RESIZE_DIRECTIONS : RESIZE_DIRECTIONS : undefined;
-        }));
-        this.titleId = getId('k-tilelayout-title');
-    }
+    elem;
+    zone;
+    renderer;
+    localization;
+    draggingService;
+    keyboardNavigationService;
+    /**
+     * The title that will be rendered in the item header ([see example]({% slug tiles_tilelayout %}#toc-tiles-configuration)).
+     */
+    title;
+    /**
+     * Determines how many rows will the tile item span ([see example](slug:tiles_tilelayout#toc-programmatic-resizing)).
+     * @default 1
+     */
+    rowSpan = 1;
+    /**
+     * Determines how many columns will the tile item span ([see example](slug:tiles_tilelayout#toc-programmatic-resizing)).
+     * @default 1
+     */
+    colSpan = 1;
     /**
      * Determines the order of the tile items within the TileLayout.
      * If not set, the items will receive increasing sequential order in accordance with
@@ -77,6 +53,27 @@ export class TileLayoutItemComponent {
     get order() {
         return this._order;
     }
+    /**
+     * Sets the starting column of the item ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
+     */
+    col;
+    /**
+     * Sets the starting row of the item ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
+     */
+    row;
+    /**
+     * Determines whether the item can be reordered. By default all items are reorderable when the [reorderable]({% slug api_layout_tilelayoutcomponent %}#toc-reorderable) property of the TileLayoutComponent is set to `true` ([see example]({% slug reordering_tilelayout %}#toc-disabling-reordering)).
+     *
+     * @default true
+     */
+    reorderable = true;
+    /**
+     * Determines whether the item can be resized. By default all items are resizable when the [resizable]({% slug api_layout_tilelayoutcomponent %}#resizable) property of the TileLayoutComponent is set to `true` ([see example](slug:resizing_tilelayout#toc-disabling-resizing)).
+     * @default true
+     */
+    resizable = true;
+    itemClass = true;
+    hostRole = 'listitem';
     get hostDropEffect() {
         return this.isResizable || this.isReorderable ? 'execute' : undefined;
     }
@@ -122,6 +119,39 @@ export class TileLayoutItemComponent {
     get isResizable() {
         return this.resizable && this.draggingService.resizable.getValue();
     }
+    /**
+     * @hidden
+     */
+    resizeDirections;
+    /**
+     * @hidden
+     */
+    rtl;
+    headers;
+    /**
+     * @hidden
+     */
+    titleId = '';
+    subs = new Subscription();
+    keyboardNavigationSubs;
+    focusableItems;
+    _order;
+    constructor(elem, zone, renderer, localization, draggingService, keyboardNavigationService) {
+        this.elem = elem;
+        this.zone = zone;
+        this.renderer = renderer;
+        this.localization = localization;
+        this.draggingService = draggingService;
+        this.keyboardNavigationService = keyboardNavigationService;
+        this.subs.add(this.localization.changes.subscribe(({ rtl }) => {
+            this.rtl = rtl;
+        }));
+        this.subs.add(this.draggingService.resizable.subscribe(resizable => {
+            this.resizeDirections = resizable && this.resizable ?
+                this.rtl ? RTL_RESIZE_DIRECTIONS : RESIZE_DIRECTIONS : undefined;
+        }));
+        this.titleId = getId('k-tilelayout-title');
+    }
     ngAfterViewInit() {
         const elem = this.elem.nativeElement;
         const keyboardNavigation = this.keyboardNavigationService;
@@ -177,9 +207,8 @@ export class TileLayoutItemComponent {
             this.renderer.removeClass(headerEl, 'k-cursor-grab');
         }
     }
-}
-TileLayoutItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2.TileLayoutDraggingService }, { token: i3.TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
-TileLayoutItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TileLayoutItemComponent, isStandalone: true, selector: "kendo-tilelayout-item", inputs: { title: "title", rowSpan: "rowSpan", colSpan: "colSpan", order: "order", col: "col", row: "row", reorderable: "reorderable", resizable: "resizable" }, host: { properties: { "class.k-tilelayout-item": "this.itemClass", "class.k-card": "this.itemClass", "attr.role": "this.hostRole", "attr.aria-dropeffect": "this.hostDropEffect", "attr.tabindex": "this.hostTabindex", "attr.aria-keyshortcuts": "this.ariaKeyShortcuts", "attr.aria-grabbed": "this.hostGrabbed", "attr.aria-labelledby": "this.hostLabelledBy", "style.grid-column-end": "this.colEnd", "style.grid-row-end": "this.rowEnd", "style.grid-column-start": "this.colStart", "style.grid-row-start": "this.rowStart" } }, queries: [{ propertyName: "headers", predicate: TileLayoutItemHeaderComponent }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2.TileLayoutDraggingService }, { token: i3.TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutItemComponent, isStandalone: true, selector: "kendo-tilelayout-item", inputs: { title: "title", rowSpan: "rowSpan", colSpan: "colSpan", order: "order", col: "col", row: "row", reorderable: "reorderable", resizable: "resizable" }, host: { properties: { "class.k-tilelayout-item": "this.itemClass", "class.k-card": "this.itemClass", "attr.role": "this.hostRole", "attr.aria-dropeffect": "this.hostDropEffect", "attr.tabindex": "this.hostTabindex", "attr.aria-keyshortcuts": "this.ariaKeyShortcuts", "attr.aria-grabbed": "this.hostGrabbed", "attr.aria-labelledby": "this.hostLabelledBy", "style.grid-column-end": "this.colEnd", "style.grid-row-end": "this.rowEnd", "style.grid-column-start": "this.colStart", "style.grid-row-start": "this.rowStart" } }, queries: [{ propertyName: "headers", predicate: TileLayoutItemHeaderComponent }], usesOnChanges: true, ngImport: i0, template: `
         <kendo-tilelayout-item-header [reorderable]="isReorderable" *ngIf="title">
             <h5 [id]="titleId" class="k-card-title">{{ title }}</h5>
         </kendo-tilelayout-item-header>
@@ -194,7 +223,8 @@ TileLayoutItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
             </div>
         </ng-container>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TileLayoutItemHeaderComponent, selector: "kendo-tilelayout-item-header", inputs: ["reorderable"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TileLayoutResizeHandleDirective, selector: "[kendoTileLayoutResizeHandle]", inputs: ["resizeDirection", "rtl"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutItemComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-tilelayout-item',

package/{esm2020 → esm2022}/tilelayout/tilelayout-resize-handle.directive.mjs

@@ -9,6 +9,10 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class TileLayoutResizeHandleDirective {
+    el;
+    renderer;
+    resizeDirection;
+    rtl;
     constructor(el, renderer) {
         this.el = el;
         this.renderer = renderer;
@@ -41,10 +45,10 @@ export class TileLayoutResizeHandleDirective {
             this.setBottom(element);
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutResizeHandleDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutResizeHandleDirective, isStandalone: true, selector: "[kendoTileLayoutResizeHandle]", inputs: { resizeDirection: "resizeDirection", rtl: "rtl" }, ngImport: i0 });
 }
-TileLayoutResizeHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutResizeHandleDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-TileLayoutResizeHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: TileLayoutResizeHandleDirective, isStandalone: true, selector: "[kendoTileLayoutResizeHandle]", inputs: { resizeDirection: "resizeDirection", rtl: "rtl" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutResizeHandleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutResizeHandleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoTileLayoutResizeHandle]',

package/{esm2020 → esm2022}/tilelayout/tilelayout.component.mjs

@@ -28,82 +28,22 @@ const autoFlowClasses = {
  * Represents the [Kendo UI TileLayout component for Angular]({% slug overview_tilelayout %})
  */
 export class TileLayoutComponent {
-    constructor(zone, elem, renderer, localization, draggingService, navigationService) {
-        this.zone = zone;
-        this.elem = elem;
-        this.renderer = renderer;
-        this.localization = localization;
-        this.draggingService = draggingService;
-        this.navigationService = navigationService;
-        /**
-         * Defines the number of columns ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
-         * @default 1
-         */
-        this.columns = 1;
-        /**
-         * Determines the width of the columns. Numeric values are treated as pixels ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
-         * @default '1fr'
-         */
-        this.columnWidth = '1fr';
-        /**
-         * Determines whether the reordering functionality will be enabled ([see example]({% slug reordering_tilelayout %})).
-         * @default false
-         */
-        this.reorderable = false;
-        /**
-         * Determines whether the resizing functionality will be enabled ([see example]({% slug resizing_tilelayout %})).
-         * @default false
-         */
-        this.resizable = false;
-        /**
-         * Determines the height of the rows. Numeric values are treated as pixels ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
-         * @default '1fr'
-         */
-        this.rowHeight = '1fr';
-        /**
-         * Controls how the auto-placement algorithm works, specifying exactly how auto-placed items are flowed in the TileLayout ([see example]({% slug tiles_autoflow_tilelayout %})).
-         * For further reference, check the [grid-auto-flow CSS article](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow).
-         *
-         * The possible values are:
-         * * (Default) `column`
-         * * `row`
-         * * `row dense`
-         * * `column dense`
-         * * `none`
-         *
-         */
-        this.autoFlow = 'column';
-        /**
-         * If set to true, the user can use dedicated shortcuts to interact with the TileLayout.
-         * By default, navigation is disabled and focusable TileLayout content is a part of the natural tab sequence of the page.
-         *
-         * @default false
-         */
-        this.navigable = false;
-        /**
-         * Fires when the user completes the reordering of the item ([see example]({% slug reordering_tilelayout %})).
-         * This event is preventable. If you cancel it, the item will not be reordered.
-         */
-        this.reorder = new EventEmitter();
-        /**
-         * Fires when the user completes the resizing of the item ([see example]({% slug resizing_tilelayout %})).
-         * This event is preventable. If you cancel it, the item will not be resized.
-         */
-        this.resize = new EventEmitter();
-        this.hostClass = true;
-        this.hostRole = 'list';
-        /**
-         * @hidden
-         */
-        this.showLicenseWatermark = false;
-        this.subs = new Subscription();
-        this._gap = {
-            rows: 16,
-            columns: 16
-        };
-        const isValid = validatePackage(packageMetadata);
-        this.showLicenseWatermark = shouldShowValidationUI(isValid);
-    }
+    zone;
+    elem;
+    renderer;
+    localization;
+    draggingService;
+    navigationService;
+    /**
+     * Defines the number of columns ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
+     * @default 1
+     */
+    columns = 1;
+    /**
+     * Determines the width of the columns. Numeric values are treated as pixels ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
+     * @default '1fr'
+     */
+    columnWidth = '1fr';
     /**
      * The numeric values which determine the spacing in pixels between the layout items horizontally and vertically.
      * Properties:
@@ -118,9 +58,57 @@ export class TileLayoutComponent {
     get gap() {
         return this._gap;
     }
+    /**
+     * Determines whether the reordering functionality will be enabled ([see example]({% slug reordering_tilelayout %})).
+     * @default false
+     */
+    reorderable = false;
+    /**
+     * Determines whether the resizing functionality will be enabled ([see example]({% slug resizing_tilelayout %})).
+     * @default false
+     */
+    resizable = false;
+    /**
+     * Determines the height of the rows. Numeric values are treated as pixels ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
+     * @default '1fr'
+     */
+    rowHeight = '1fr';
+    /**
+     * Controls how the auto-placement algorithm works, specifying exactly how auto-placed items are flowed in the TileLayout ([see example]({% slug tiles_autoflow_tilelayout %})).
+     * For further reference, check the [grid-auto-flow CSS article](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow).
+     *
+     * The possible values are:
+     * * (Default) `column`
+     * * `row`
+     * * `row dense`
+     * * `column dense`
+     * * `none`
+     *
+     */
+    autoFlow = 'column';
+    /**
+     * If set to true, the user can use dedicated shortcuts to interact with the TileLayout.
+     * By default, navigation is disabled and focusable TileLayout content is a part of the natural tab sequence of the page.
+     *
+     * @default false
+     */
+    navigable = false;
+    /**
+     * Fires when the user completes the reordering of the item ([see example]({% slug reordering_tilelayout %})).
+     * This event is preventable. If you cancel it, the item will not be reordered.
+     */
+    reorder = new EventEmitter();
+    /**
+     * Fires when the user completes the resizing of the item ([see example]({% slug resizing_tilelayout %})).
+     * This event is preventable. If you cancel it, the item will not be resized.
+     */
+    resize = new EventEmitter();
+    hostClass = true;
+    hostRole = 'list';
     get gapStyle() {
         return `${this.gap.rows}px ${this.gap.columns}px`;
     }
+    direction;
     get currentColStart() {
         return this.draggingService.colStart;
     }
@@ -133,6 +121,31 @@ export class TileLayoutComponent {
     get targetOrder() {
         return this.draggingService.order;
     }
+    /**
+     * A query list of all declared [TileLayoutItemComponent]({% slug api_layout_tilelayoutitemcomponent %}) items.
+     */
+    items;
+    hint;
+    /**
+     * @hidden
+     */
+    showLicenseWatermark = false;
+    draggable;
+    subs = new Subscription();
+    _gap = {
+        rows: 16,
+        columns: 16
+    };
+    constructor(zone, elem, renderer, localization, draggingService, navigationService) {
+        this.zone = zone;
+        this.elem = elem;
+        this.renderer = renderer;
+        this.localization = localization;
+        this.draggingService = draggingService;
+        this.navigationService = navigationService;
+        const isValid = validatePackage(packageMetadata);
+        this.showLicenseWatermark = shouldShowValidationUI(isValid);
+    }
     ngOnInit() {
         this.applyColStyling();
         this.applyRowStyling();
@@ -252,17 +265,16 @@ export class TileLayoutComponent {
             }
         });
     }
-}
-TileLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2.TileLayoutDraggingService }, { token: i3.TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
-TileLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TileLayoutComponent, isStandalone: true, selector: "kendo-tilelayout", inputs: { columns: "columns", columnWidth: "columnWidth", gap: "gap", reorderable: "reorderable", resizable: "resizable", rowHeight: "rowHeight", autoFlow: "autoFlow", navigable: "navigable" }, outputs: { reorder: "reorder", resize: "resize" }, host: { properties: { "class.k-tilelayout": "this.hostClass", "class.k-pos-relative": "this.hostClass", "attr.role": "this.hostRole", "style.gap": "this.gapStyle", "style.padding": "this.gapStyle", "attr.dir": "this.direction" } }, providers: [
-        LocalizationService,
-        TileLayoutDraggingService,
-        TileLayoutKeyboardNavigationService,
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.tilelayout.component'
-        }
-    ], queries: [{ propertyName: "items", predicate: TileLayoutItemComponent }], viewQueries: [{ propertyName: "hint", first: true, predicate: ["hint"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2.TileLayoutDraggingService }, { token: i3.TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutComponent, isStandalone: true, selector: "kendo-tilelayout", inputs: { columns: "columns", columnWidth: "columnWidth", gap: "gap", reorderable: "reorderable", resizable: "resizable", rowHeight: "rowHeight", autoFlow: "autoFlow", navigable: "navigable" }, outputs: { reorder: "reorder", resize: "resize" }, host: { properties: { "class.k-tilelayout": "this.hostClass", "class.k-pos-relative": "this.hostClass", "attr.role": "this.hostRole", "style.gap": "this.gapStyle", "style.padding": "this.gapStyle", "attr.dir": "this.direction" } }, providers: [
+            LocalizationService,
+            TileLayoutDraggingService,
+            TileLayoutKeyboardNavigationService,
+            {
+                provide: L10N_PREFIX,
+                useValue: 'kendo.tilelayout.component'
+            }
+        ], queries: [{ propertyName: "items", predicate: TileLayoutItemComponent }], viewQueries: [{ propertyName: "hint", first: true, predicate: ["hint"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
         <ng-content></ng-content>
         <div #hint class="k-layout-item-hint k-layout-item-hint-reorder"
             [style.display]="'none'"
@@ -275,7 +287,8 @@ TileLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
         </div>
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-tilelayout',

package/{esm2020 → esm2022}/tilelayout.module.mjs

@@ -21,11 +21,11 @@ import * as i4 from "./tilelayout/tilelayout-item-header.component";
  * - `TileLayoutItemBodyComponent`—The `TileLayoutItemBodyComponent` component class.
  */
 export class TileLayoutModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutModule, imports: [i1.TileLayoutComponent, i2.TileLayoutItemBodyComponent, i3.TileLayoutItemComponent, i4.TileLayoutItemHeaderComponent], exports: [i1.TileLayoutComponent, i2.TileLayoutItemBodyComponent, i3.TileLayoutItemComponent, i4.TileLayoutItemHeaderComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutModule, imports: [i1.TileLayoutComponent] });
 }
-TileLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TileLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutModule, imports: [i1.TileLayoutComponent, i2.TileLayoutItemBodyComponent, i3.TileLayoutItemComponent, i4.TileLayoutItemHeaderComponent], exports: [i1.TileLayoutComponent, i2.TileLayoutItemBodyComponent, i3.TileLayoutItemComponent, i4.TileLayoutItemHeaderComponent] });
-TileLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutModule, imports: [KENDO_TILELAYOUT] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TileLayoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_TILELAYOUT],