@progress/kendo-angular-layout 14.4.0-develop.9 → 15.0.0-develop.1

package/esm2020/card/card-actions.component.mjs

@@ -74,7 +74,7 @@ export class CardActionsComponent {
     }
 }
 CardActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-card-actions": "this.hostClass", "class.k-card-actions-stretched": "this.stretchedClass", "class.k-card-actions-start": "this.startClass", "class.k-card-actions-end": "this.endClass", "class.k-card-actions-center": "this.centerClass", "class.k-card-actions-vertical": "this.verticalClass", "class.k-card-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
+CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClass", "class.k-card-actions": "this.hostClass", "class.k-actions-stretched": "this.stretchedClass", "class.k-actions-start": "this.startClass", "class.k-actions-end": "this.endClass", "class.k-actions-center": "this.centerClass", "class.k-actions-vertical": "this.verticalClass", "class.k-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
         <ng-content *ngIf="!actionsArray && !actionsTemplate"></ng-content>
 
         <ng-container *ngIf="actionsArray">
@@ -124,26 +124,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-actions']
+            }, {
                 type: HostBinding,
                 args: ['class.k-card-actions']
             }], stretchedClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-stretched']
+                args: ['class.k-actions-stretched']
             }], startClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-start']
+                args: ['class.k-actions-start']
             }], endClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-end']
+                args: ['class.k-actions-end']
             }], centerClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-center']
+                args: ['class.k-actions-center']
             }], verticalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-vertical']
+                args: ['class.k-actions-vertical']
             }], horizontalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-horizontal']
+                args: ['class.k-actions-horizontal']
             }], orientation: [{
                 type: Input
             }], layout: [{

package/esm2020/card/card.component.mjs

@@ -52,7 +52,7 @@ export class CardComponent {
     }
 }
 CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-widget": "this.hostClass", "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
+CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
         LocalizationService,
         {
             provide: L10N_PREFIX,
@@ -77,9 +77,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; }, propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-widget']
-            }, {
                 type: HostBinding,
                 args: ['class.k-card']
             }], widthStyle: [{

package/esm2020/common/util.mjs

@@ -24,7 +24,7 @@ const SHAPE_TO_ROUNDED = {
  */
 export const parsePanelBarItems = (data) => {
     return data.map((item) => {
-        if (!item.id) {
+        if (!isPresent(item.id)) {
             item.id = `default-${nextId++}`;
         }
         if (item.children) {

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-layout',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1705406658,
-    version: '14.4.0-develop.9',
+    publishDate: 1706543891,
+    version: '15.0.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2020/panelbar/events/item-click-event.mjs

@@ -0,0 +1,9 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `itemClick` event of the PanelBar.
+ */
+export class PanelBarItemClickEvent {
+}

package/esm2020/panelbar/events.mjs

@@ -6,3 +6,4 @@ export { PanelBarCollapseEvent } from './events/collapse-event';
 export { PanelBarExpandEvent } from './events/expand-event';
 export { PanelBarSelectEvent } from './events/select-event';
 export { PanelBarStateChangeEvent } from './events/state-change-event';
+export { PanelBarItemClickEvent } from './events/item-click-event';

package/esm2020/panelbar/panelbar-item.component.mjs

@@ -170,6 +170,7 @@ export class PanelBarItemComponent {
      */
     onItemClick(e) {
         if (!isFocusable(e.target)) {
+            this.eventService.itemClick.next({ item: this.serialize(), originalEvent: e });
             this.onItemAction();
         }
     }
@@ -217,7 +218,8 @@ export class PanelBarItemComponent {
             id: this.id,
             imageUrl: this.imageUrl,
             selected: this.selected,
-            title: this.title
+            title: this.title,
+            children: this.items
         };
     }
     /**

package/esm2020/panelbar/panelbar.component.mjs

@@ -12,6 +12,7 @@ import { PanelBarItemComponent } from './panelbar-item.component';
 import { PanelBarService } from "./panelbar.service";
 import { PanelBarItemTemplateDirective } from "./panelbar-item-template.directive";
 import { parsePanelBarItems } from "../common/util";
+import { Subscription } from 'rxjs';
 import { isFocusable } from './../common/dom-queries';
 import { PanelBarSelectEvent, PanelBarExpandEvent, PanelBarCollapseEvent, PanelBarStateChangeEvent } from './events';
 import * as i0 from "@angular/core";
@@ -75,6 +76,10 @@ export class PanelBarComponent {
          * This event is preventable. If you cancel it, the item will remain expanded.
          */
         this.collapse = new EventEmitter();
+        /**
+         * Fires when the user clicks an item ([see example]({% slug events_panelbar %})).
+         */
+        this.itemClick = new EventEmitter();
         this.hostClasses = true;
         this.tabIndex = 0;
         this.role = 'tree';
@@ -86,6 +91,7 @@ export class PanelBarComponent {
         this.isViewInit = true;
         this.focused = false;
         this._keepItemContent = false;
+        this.subs = new Subscription();
         this.updateChildrenHeight = () => {
             let childrenHeight = 0;
             const panelbarHeight = this.elementRef.nativeElement.offsetHeight;
@@ -104,7 +110,8 @@ export class PanelBarComponent {
         this.keyBindings = this.computedKeys;
         this.elementRef = elementRef;
         this.eventService = eventService;
-        this.eventService.children$.subscribe(event => this.onItemAction(event));
+        this.subs.add(this.eventService.children$.subscribe(event => this.onItemAction(event)));
+        this.subs.add(this.eventService.itemClick.subscribe(ev => this.itemClick.emit(ev)));
     }
     /**
      * When set to `true`, the PanelBar renders the content of all items and they are persisted in the DOM
@@ -158,13 +165,10 @@ export class PanelBarComponent {
         };
     }
     ngOnDestroy() {
-        if (this.localizationChangeSubscription) {
-            this.localizationChangeSubscription.unsubscribe();
-        }
+        this.subs.unsubscribe();
     }
     ngOnInit() {
-        this.localizationChangeSubscription = this.localization
-            .changes.subscribe(() => this.keyBindings = this.computedKeys);
+        this.subs.add(this.localization.changes.subscribe(() => this.keyBindings = this.computedKeys));
         this.eventService.animate = this.animate;
         this.eventService.expandMode = this.expandMode;
     }
@@ -489,7 +493,7 @@ export class PanelBarComponent {
     }
 }
 PanelBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PanelBarComponent, deps: [{ token: i0.ElementRef }, { token: i1.PanelBarService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
+PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse", itemClick: "itemClick" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
         PanelBarService,
         LocalizationService,
         {
@@ -578,6 +582,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Output
             }], collapse: [{
                 type: Output
+            }], itemClick: [{
+                type: Output
             }], hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-panelbar']

package/esm2020/panelbar/panelbar.service.mjs

@@ -17,6 +17,7 @@ export class PanelBarService {
         this.parentSource = new Subject();
         this.keepContentSource = new BehaviorSubject(false);
         this.childSource = new Subject();
+        this.itemClick = new Subject();
         this.parent$ = this.parentSource.asObservable();
         this.children$ = this.childSource.asObservable();
         this.keepContent$ = this.keepContentSource.asObservable();

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

@@ -31,8 +31,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-layout',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1705406658,
-    version: '14.4.0-develop.9',
+    publishDate: 1706543891,
+    version: '15.0.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
@@ -146,7 +146,7 @@ const SHAPE_TO_ROUNDED = {
  */
 const parsePanelBarItems = (data) => {
     return data.map((item) => {
-        if (!item.id) {
+        if (!isPresent(item.id)) {
             item.id = `default-${nextId$1++}`;
         }
         if (item.children) {
@@ -261,6 +261,7 @@ class PanelBarService {
         this.parentSource = new Subject();
         this.keepContentSource = new BehaviorSubject(false);
         this.childSource = new Subject();
+        this.itemClick = new Subject();
         this.parent$ = this.parentSource.asObservable();
         this.children$ = this.childSource.asObservable();
         this.keepContent$ = this.keepContentSource.asObservable();
@@ -440,6 +441,7 @@ class PanelBarItemComponent {
      */
     onItemClick(e) {
         if (!isFocusable(e.target)) {
+            this.eventService.itemClick.next({ item: this.serialize(), originalEvent: e });
             this.onItemAction();
         }
     }
@@ -487,7 +489,8 @@ class PanelBarItemComponent {
             id: this.id,
             imageUrl: this.imageUrl,
             selected: this.selected,
-            title: this.title
+            title: this.title,
+            children: this.items
         };
     }
     /**
@@ -981,6 +984,12 @@ class PanelBarSelectEvent extends PreventableEvent {
 class PanelBarStateChangeEvent {
 }
 
+/**
+ * Arguments for the `itemClick` event of the PanelBar.
+ */
+class PanelBarItemClickEvent {
+}
+
 /**
  * Represents the [Kendo UI PanelBar component for Angular]({% slug overview_panelbar %}).
  */
@@ -1036,6 +1045,10 @@ class PanelBarComponent {
          * This event is preventable. If you cancel it, the item will remain expanded.
          */
         this.collapse = new EventEmitter();
+        /**
+         * Fires when the user clicks an item ([see example]({% slug events_panelbar %})).
+         */
+        this.itemClick = new EventEmitter();
         this.hostClasses = true;
         this.tabIndex = 0;
         this.role = 'tree';
@@ -1047,6 +1060,7 @@ class PanelBarComponent {
         this.isViewInit = true;
         this.focused = false;
         this._keepItemContent = false;
+        this.subs = new Subscription();
         this.updateChildrenHeight = () => {
             let childrenHeight = 0;
             const panelbarHeight = this.elementRef.nativeElement.offsetHeight;
@@ -1065,7 +1079,8 @@ class PanelBarComponent {
         this.keyBindings = this.computedKeys;
         this.elementRef = elementRef;
         this.eventService = eventService;
-        this.eventService.children$.subscribe(event => this.onItemAction(event));
+        this.subs.add(this.eventService.children$.subscribe(event => this.onItemAction(event)));
+        this.subs.add(this.eventService.itemClick.subscribe(ev => this.itemClick.emit(ev)));
     }
     /**
      * When set to `true`, the PanelBar renders the content of all items and they are persisted in the DOM
@@ -1119,13 +1134,10 @@ class PanelBarComponent {
         };
     }
     ngOnDestroy() {
-        if (this.localizationChangeSubscription) {
-            this.localizationChangeSubscription.unsubscribe();
-        }
+        this.subs.unsubscribe();
     }
     ngOnInit() {
-        this.localizationChangeSubscription = this.localization
-            .changes.subscribe(() => this.keyBindings = this.computedKeys);
+        this.subs.add(this.localization.changes.subscribe(() => this.keyBindings = this.computedKeys));
         this.eventService.animate = this.animate;
         this.eventService.expandMode = this.expandMode;
     }
@@ -1450,7 +1462,7 @@ class PanelBarComponent {
     }
 }
 PanelBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PanelBarComponent, deps: [{ token: i0.ElementRef }, { token: PanelBarService }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
+PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse", itemClick: "itemClick" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
         PanelBarService,
         LocalizationService,
         {
@@ -1539,6 +1551,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Output
             }], collapse: [{
                 type: Output
+            }], itemClick: [{
+                type: Output
             }], hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-panelbar']
@@ -7179,7 +7193,7 @@ class CardComponent {
     }
 }
 CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-widget": "this.hostClass", "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
+CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
         LocalizationService,
         {
             provide: L10N_PREFIX,
@@ -7204,9 +7218,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; }, propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-widget']
-            }, {
                 type: HostBinding,
                 args: ['class.k-card']
             }], widthStyle: [{
@@ -7371,7 +7382,7 @@ class CardActionsComponent {
     }
 }
 CardActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-card-actions": "this.hostClass", "class.k-card-actions-stretched": "this.stretchedClass", "class.k-card-actions-start": "this.startClass", "class.k-card-actions-end": "this.endClass", "class.k-card-actions-center": "this.centerClass", "class.k-card-actions-vertical": "this.verticalClass", "class.k-card-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
+CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClass", "class.k-card-actions": "this.hostClass", "class.k-actions-stretched": "this.stretchedClass", "class.k-actions-start": "this.startClass", "class.k-actions-end": "this.endClass", "class.k-actions-center": "this.centerClass", "class.k-actions-vertical": "this.verticalClass", "class.k-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
         <ng-content *ngIf="!actionsArray && !actionsTemplate"></ng-content>
 
         <ng-container *ngIf="actionsArray">
@@ -7421,26 +7432,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-actions']
+            }, {
                 type: HostBinding,
                 args: ['class.k-card-actions']
             }], stretchedClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-stretched']
+                args: ['class.k-actions-stretched']
             }], startClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-start']
+                args: ['class.k-actions-start']
             }], endClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-end']
+                args: ['class.k-actions-end']
             }], centerClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-center']
+                args: ['class.k-actions-center']
             }], verticalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-vertical']
+                args: ['class.k-actions-vertical']
             }], horizontalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-horizontal']
+                args: ['class.k-actions-horizontal']
             }], orientation: [{
                 type: Input
             }], layout: [{
@@ -10479,5 +10493,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AvatarComponent, AvatarCustomMessagesComponent, AvatarModule, CardAction, CardActionsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardMediaDirective, CardModule, CardSeparatorDirective, CardSubtitleDirective, CardTitleDirective, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DrawerFooterTemplateDirective, DrawerHeaderTemplateDirective, DrawerItemTemplateDirective, DrawerModule, DrawerSelectEvent, DrawerTemplateDirective, ExpansionPanelActionEvent, ExpansionPanelComponent, ExpansionPanelModule, ExpansionPanelTitleDirective, GridLayoutComponent, GridLayoutItemComponent, GridLayoutModule, LayoutModule, LocalizedAvatarMessagesDirective, LocalizedStepperMessagesDirective, LocalizedTabStripMessagesDirective, PanelBarCollapseEvent, PanelBarComponent, PanelBarContentDirective, PanelBarExpandEvent, PanelBarExpandMode, PanelBarItemComponent, PanelBarItemTemplateDirective, PanelBarItemTitleDirective, PanelBarModule, PanelBarSelectEvent, PanelBarStateChangeEvent, SelectEvent, SplitterComponent, SplitterModule, SplitterPaneComponent, StackLayoutComponent, StackLayoutModule, StepperActivateEvent, StepperComponent, StepperCustomMessagesComponent, StepperIndicatorTemplateDirective, StepperLabelTemplateDirective, StepperModule, StepperStepTemplateDirective, TabCloseEvent, TabComponent, TabContentDirective, TabStripComponent, TabStripCustomMessagesComponent, TabStripModule, TabStripTabComponent, TabTemplateDirective, TabTitleDirective, TileLayoutComponent, TileLayoutItemBodyComponent, TileLayoutItemComponent, TileLayoutItemHeaderComponent, TileLayoutModule, TileLayoutReorderEvent, TileLayoutResizeEvent, TileLayoutResizeHandleDirective };
+export { AvatarComponent, AvatarCustomMessagesComponent, AvatarModule, CardAction, CardActionsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardMediaDirective, CardModule, CardSeparatorDirective, CardSubtitleDirective, CardTitleDirective, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DrawerFooterTemplateDirective, DrawerHeaderTemplateDirective, DrawerItemTemplateDirective, DrawerModule, DrawerSelectEvent, DrawerTemplateDirective, ExpansionPanelActionEvent, ExpansionPanelComponent, ExpansionPanelModule, ExpansionPanelTitleDirective, GridLayoutComponent, GridLayoutItemComponent, GridLayoutModule, LayoutModule, LocalizedAvatarMessagesDirective, LocalizedStepperMessagesDirective, LocalizedTabStripMessagesDirective, PanelBarCollapseEvent, PanelBarComponent, PanelBarContentDirective, PanelBarExpandEvent, PanelBarExpandMode, PanelBarItemClickEvent, PanelBarItemComponent, PanelBarItemTemplateDirective, PanelBarItemTitleDirective, PanelBarModule, PanelBarSelectEvent, PanelBarStateChangeEvent, SelectEvent, SplitterComponent, SplitterModule, SplitterPaneComponent, StackLayoutComponent, StackLayoutModule, StepperActivateEvent, StepperComponent, StepperCustomMessagesComponent, StepperIndicatorTemplateDirective, StepperLabelTemplateDirective, StepperModule, StepperStepTemplateDirective, TabCloseEvent, TabComponent, TabContentDirective, TabStripComponent, TabStripCustomMessagesComponent, TabStripModule, TabStripTabComponent, TabTemplateDirective, TabTitleDirective, TileLayoutComponent, TileLayoutItemBodyComponent, TileLayoutItemComponent, TileLayoutItemHeaderComponent, TileLayoutModule, TileLayoutReorderEvent, TileLayoutResizeEvent, TileLayoutResizeHandleDirective };
 

package/fesm2020/progress-kendo-angular-layout.mjs

@@ -31,8 +31,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-layout',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1705406658,
-    version: '14.4.0-develop.9',
+    publishDate: 1706543891,
+    version: '15.0.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
@@ -75,6 +75,7 @@ class PanelBarService {
         this.parentSource = new Subject();
         this.keepContentSource = new BehaviorSubject(false);
         this.childSource = new Subject();
+        this.itemClick = new Subject();
         this.parent$ = this.parentSource.asObservable();
         this.children$ = this.childSource.asObservable();
         this.keepContent$ = this.keepContentSource.asObservable();
@@ -180,7 +181,7 @@ const SHAPE_TO_ROUNDED = {
  */
 const parsePanelBarItems = (data) => {
     return data.map((item) => {
-        if (!item.id) {
+        if (!isPresent(item.id)) {
             item.id = `default-${nextId$1++}`;
         }
         if (item.children) {
@@ -438,6 +439,7 @@ class PanelBarItemComponent {
      */
     onItemClick(e) {
         if (!isFocusable(e.target)) {
+            this.eventService.itemClick.next({ item: this.serialize(), originalEvent: e });
             this.onItemAction();
         }
     }
@@ -485,7 +487,8 @@ class PanelBarItemComponent {
             id: this.id,
             imageUrl: this.imageUrl,
             selected: this.selected,
-            title: this.title
+            title: this.title,
+            children: this.items
         };
     }
     /**
@@ -975,6 +978,12 @@ class PanelBarSelectEvent extends PreventableEvent {
 class PanelBarStateChangeEvent {
 }
 
+/**
+ * Arguments for the `itemClick` event of the PanelBar.
+ */
+class PanelBarItemClickEvent {
+}
+
 /**
  * Represents the [Kendo UI PanelBar component for Angular]({% slug overview_panelbar %}).
  */
@@ -1030,6 +1039,10 @@ class PanelBarComponent {
          * This event is preventable. If you cancel it, the item will remain expanded.
          */
         this.collapse = new EventEmitter();
+        /**
+         * Fires when the user clicks an item ([see example]({% slug events_panelbar %})).
+         */
+        this.itemClick = new EventEmitter();
         this.hostClasses = true;
         this.tabIndex = 0;
         this.role = 'tree';
@@ -1041,6 +1054,7 @@ class PanelBarComponent {
         this.isViewInit = true;
         this.focused = false;
         this._keepItemContent = false;
+        this.subs = new Subscription();
         this.updateChildrenHeight = () => {
             let childrenHeight = 0;
             const panelbarHeight = this.elementRef.nativeElement.offsetHeight;
@@ -1059,7 +1073,8 @@ class PanelBarComponent {
         this.keyBindings = this.computedKeys;
         this.elementRef = elementRef;
         this.eventService = eventService;
-        this.eventService.children$.subscribe(event => this.onItemAction(event));
+        this.subs.add(this.eventService.children$.subscribe(event => this.onItemAction(event)));
+        this.subs.add(this.eventService.itemClick.subscribe(ev => this.itemClick.emit(ev)));
     }
     /**
      * When set to `true`, the PanelBar renders the content of all items and they are persisted in the DOM
@@ -1113,13 +1128,10 @@ class PanelBarComponent {
         };
     }
     ngOnDestroy() {
-        if (this.localizationChangeSubscription) {
-            this.localizationChangeSubscription.unsubscribe();
-        }
+        this.subs.unsubscribe();
     }
     ngOnInit() {
-        this.localizationChangeSubscription = this.localization
-            .changes.subscribe(() => this.keyBindings = this.computedKeys);
+        this.subs.add(this.localization.changes.subscribe(() => this.keyBindings = this.computedKeys));
         this.eventService.animate = this.animate;
         this.eventService.expandMode = this.expandMode;
     }
@@ -1444,7 +1456,7 @@ class PanelBarComponent {
     }
 }
 PanelBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PanelBarComponent, deps: [{ token: i0.ElementRef }, { token: PanelBarService }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
+PanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PanelBarComponent, selector: "kendo-panelbar", inputs: { expandMode: "expandMode", selectable: "selectable", animate: "animate", height: "height", keepItemContent: "keepItemContent", items: "items" }, outputs: { stateChange: "stateChange", select: "select", expand: "expand", collapse: "collapse", itemClick: "itemClick" }, host: { listeners: { "click": "onComponentClick($event)", "focus": "onComponentFocus()", "blur": "onComponentBlur()", "keydown": "onComponentKeyDown($event)" }, properties: { "class.k-panelbar": "this.hostClasses", "class.k-pos-relative": "this.hostClasses", "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "attr.aria-activedescendant": "this.activeDescendant", "style.height": "this.hostHeight", "style.overflow": "this.overflow", "attr.dir": "this.dir" } }, providers: [
         PanelBarService,
         LocalizationService,
         {
@@ -1533,6 +1545,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Output
             }], collapse: [{
                 type: Output
+            }], itemClick: [{
+                type: Output
             }], hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-panelbar']
@@ -7154,7 +7168,7 @@ class CardComponent {
     }
 }
 CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-widget": "this.hostClass", "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
+CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardComponent, selector: "kendo-card", inputs: { orientation: "orientation", width: "width" }, host: { properties: { "class.k-card": "this.hostClass", "style.width": "this.widthStyle", "class.k-card-vertical": "this.vertical", "class.k-card-horizontal": "this.horizontal", "attr.dir": "this.direction" } }, providers: [
         LocalizationService,
         {
             provide: L10N_PREFIX,
@@ -7179,9 +7193,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; }, propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-widget']
-            }, {
                 type: HostBinding,
                 args: ['class.k-card']
             }], widthStyle: [{
@@ -7346,7 +7357,7 @@ class CardActionsComponent {
     }
 }
 CardActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-card-actions": "this.hostClass", "class.k-card-actions-stretched": "this.stretchedClass", "class.k-card-actions-start": "this.startClass", "class.k-card-actions-end": "this.endClass", "class.k-card-actions-center": "this.centerClass", "class.k-card-actions-vertical": "this.verticalClass", "class.k-card-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
+CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CardActionsComponent, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClass", "class.k-card-actions": "this.hostClass", "class.k-actions-stretched": "this.stretchedClass", "class.k-actions-start": "this.startClass", "class.k-actions-end": "this.endClass", "class.k-actions-center": "this.centerClass", "class.k-actions-vertical": "this.verticalClass", "class.k-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
         <ng-content *ngIf="!actionsArray && !actionsTemplate"></ng-content>
 
         <ng-container *ngIf="actionsArray">
@@ -7396,26 +7407,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     `
                 }]
         }], propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-actions']
+            }, {
                 type: HostBinding,
                 args: ['class.k-card-actions']
             }], stretchedClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-stretched']
+                args: ['class.k-actions-stretched']
             }], startClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-start']
+                args: ['class.k-actions-start']
             }], endClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-end']
+                args: ['class.k-actions-end']
             }], centerClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-center']
+                args: ['class.k-actions-center']
             }], verticalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-vertical']
+                args: ['class.k-actions-vertical']
             }], horizontalClass: [{
                 type: HostBinding,
-                args: ['class.k-card-actions-horizontal']
+                args: ['class.k-actions-horizontal']
             }], orientation: [{
                 type: Input
             }], layout: [{
@@ -10450,5 +10464,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AvatarComponent, AvatarCustomMessagesComponent, AvatarModule, CardAction, CardActionsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardMediaDirective, CardModule, CardSeparatorDirective, CardSubtitleDirective, CardTitleDirective, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DrawerFooterTemplateDirective, DrawerHeaderTemplateDirective, DrawerItemTemplateDirective, DrawerModule, DrawerSelectEvent, DrawerTemplateDirective, ExpansionPanelActionEvent, ExpansionPanelComponent, ExpansionPanelModule, ExpansionPanelTitleDirective, GridLayoutComponent, GridLayoutItemComponent, GridLayoutModule, LayoutModule, LocalizedAvatarMessagesDirective, LocalizedStepperMessagesDirective, LocalizedTabStripMessagesDirective, PanelBarCollapseEvent, PanelBarComponent, PanelBarContentDirective, PanelBarExpandEvent, PanelBarExpandMode, PanelBarItemComponent, PanelBarItemTemplateDirective, PanelBarItemTitleDirective, PanelBarModule, PanelBarSelectEvent, PanelBarStateChangeEvent, SelectEvent, SplitterComponent, SplitterModule, SplitterPaneComponent, StackLayoutComponent, StackLayoutModule, StepperActivateEvent, StepperComponent, StepperCustomMessagesComponent, StepperIndicatorTemplateDirective, StepperLabelTemplateDirective, StepperModule, StepperStepTemplateDirective, TabCloseEvent, TabComponent, TabContentDirective, TabStripComponent, TabStripCustomMessagesComponent, TabStripModule, TabStripTabComponent, TabTemplateDirective, TabTitleDirective, TileLayoutComponent, TileLayoutItemBodyComponent, TileLayoutItemComponent, TileLayoutItemHeaderComponent, TileLayoutModule, TileLayoutReorderEvent, TileLayoutResizeEvent, TileLayoutResizeHandleDirective };
+export { AvatarComponent, AvatarCustomMessagesComponent, AvatarModule, CardAction, CardActionsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardMediaDirective, CardModule, CardSeparatorDirective, CardSubtitleDirective, CardTitleDirective, DrawerComponent, DrawerContainerComponent, DrawerContentComponent, DrawerFooterTemplateDirective, DrawerHeaderTemplateDirective, DrawerItemTemplateDirective, DrawerModule, DrawerSelectEvent, DrawerTemplateDirective, ExpansionPanelActionEvent, ExpansionPanelComponent, ExpansionPanelModule, ExpansionPanelTitleDirective, GridLayoutComponent, GridLayoutItemComponent, GridLayoutModule, LayoutModule, LocalizedAvatarMessagesDirective, LocalizedStepperMessagesDirective, LocalizedTabStripMessagesDirective, PanelBarCollapseEvent, PanelBarComponent, PanelBarContentDirective, PanelBarExpandEvent, PanelBarExpandMode, PanelBarItemClickEvent, PanelBarItemComponent, PanelBarItemTemplateDirective, PanelBarItemTitleDirective, PanelBarModule, PanelBarSelectEvent, PanelBarStateChangeEvent, SelectEvent, SplitterComponent, SplitterModule, SplitterPaneComponent, StackLayoutComponent, StackLayoutModule, StepperActivateEvent, StepperComponent, StepperCustomMessagesComponent, StepperIndicatorTemplateDirective, StepperLabelTemplateDirective, StepperModule, StepperStepTemplateDirective, TabCloseEvent, TabComponent, TabContentDirective, TabStripComponent, TabStripCustomMessagesComponent, TabStripModule, TabStripTabComponent, TabTemplateDirective, TabTitleDirective, TileLayoutComponent, TileLayoutItemBodyComponent, TileLayoutItemComponent, TileLayoutItemHeaderComponent, TileLayoutModule, TileLayoutReorderEvent, TileLayoutResizeEvent, TileLayoutResizeHandleDirective };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-layout",
-  "version": "14.4.0-develop.9",
+  "version": "15.0.0-develop.1",
   "description": "Kendo UI for Angular Layout Package - a collection of components to create professional application layoyts",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -39,16 +39,16 @@
     "@angular/core": "13 - 17",
     "@angular/platform-browser": "13 - 17",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-common": "14.4.0-develop.9",
-    "@progress/kendo-angular-l10n": "14.4.0-develop.9",
-    "@progress/kendo-angular-progressbar": "14.4.0-develop.9",
-    "@progress/kendo-angular-icons": "14.4.0-develop.9",
-    "@progress/kendo-angular-buttons": "14.4.0-develop.9",
+    "@progress/kendo-angular-common": "15.0.0-develop.1",
+    "@progress/kendo-angular-l10n": "15.0.0-develop.1",
+    "@progress/kendo-angular-progressbar": "15.0.0-develop.1",
+    "@progress/kendo-angular-icons": "15.0.0-develop.1",
+    "@progress/kendo-angular-buttons": "15.0.0-develop.1",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "14.4.0-develop.9",
+    "@progress/kendo-angular-schematics": "15.0.0-develop.1",
     "@progress/kendo-draggable": "^3.0.2"
   },
   "schematics": "./schematics/collection.json",