@progress/kendo-angular-layout 17.0.0-develop.34 → 17.0.0-develop.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/esm2022/package-metadata.mjs +2 -2
  2. package/esm2022/panelbar/panelbar-item.component.mjs +2 -2
  3. package/esm2022/stepper/stepper.component.mjs +2 -2
  4. package/esm2022/tilelayout/dragging-service.mjs +0 -6
  5. package/esm2022/tilelayout/tilelayout-item-header.component.mjs +4 -26
  6. package/esm2022/tilelayout/tilelayout-item.component.mjs +7 -10
  7. package/esm2022/tilelayout/tilelayout.component.mjs +3 -6
  8. package/esm2022/timeline/timeline-horizontal.component.mjs +11 -10
  9. package/fesm2022/progress-kendo-angular-layout.mjs +29 -62
  10. package/package.json +8 -8
  11. package/tilelayout/tilelayout-item-header.component.d.ts +1 -9
  12. package/timeline/timeline-horizontal.component.d.ts +1 -1
package/esm2022/package-metadata.mjs CHANGED
@@ -9,7 +9,7 @@ export const packageMetadata = {
9
9
  name: '@progress/kendo-angular-layout',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1730712008,
13
- version: '17.0.0-develop.34',
12
+ publishDate: 1730720878,
13
+ version: '17.0.0-develop.36',
14
14
  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'
15
15
  };
package/esm2022/panelbar/panelbar-item.component.mjs CHANGED
@@ -350,7 +350,7 @@ export class PanelBarItemComponent {
350
350
  }"></ng-template>
351
351
  <kendo-icon-wrapper
352
352
  *ngIf="hasChildItems || hasContent"
353
- [name]="expanded ? 'arrow-chevron-up' : 'chevron-down'"
353
+ [name]="expanded ? 'chevron-up' : 'chevron-down'"
354
354
  [svgIcon]="expanderSVGIcon"
355
355
  [innerCssClass]="dirInnerCssClasses"
356
356
  >
@@ -504,7 +504,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
504
504
  }"></ng-template>
505
505
  <kendo-icon-wrapper
506
506
  *ngIf="hasChildItems || hasContent"
507
- [name]="expanded ? 'arrow-chevron-up' : 'chevron-down'"
507
+ [name]="expanded ? 'chevron-up' : 'chevron-down'"
508
508
  [svgIcon]="expanderSVGIcon"
509
509
  [innerCssClass]="dirInnerCssClasses"
510
510
  >
package/esm2022/stepper/stepper.component.mjs CHANGED
@@ -310,7 +310,7 @@ export class StepperComponent {
310
310
  [attr.aria-hidden]='true'
311
311
  [animation]='progressAnimation'
312
312
  [max]='steps.length - 1'
313
- [label]='false'
313
+ [label]='{position: "start", visible: false}'
314
314
  [orientation]='orientation'
315
315
  [reverse]='!isHorizontal'
316
316
  [value]='currentStep'
@@ -363,7 +363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
363
363
  [attr.aria-hidden]='true'
364
364
  [animation]='progressAnimation'
365
365
  [max]='steps.length - 1'
366
- [label]='false'
366
+ [label]='{position: "start", visible: false}'
367
367
  [orientation]='orientation'
368
368
  [reverse]='!isHorizontal'
369
369
  [value]='currentStep'
package/esm2022/tilelayout/dragging-service.mjs CHANGED
@@ -135,8 +135,6 @@ export class TileLayoutDraggingService {
135
135
  this.currentColStart = this.draggedItem.colStart;
136
136
  this.currentRowStart = this.draggedItem.rowStart;
137
137
  });
138
- const headerEl = this.draggedItem.elem.nativeElement.querySelector('.k-tilelayout-item-header');
139
- this.renderer.addClass(headerEl, 'k-cursor-grabbing');
140
138
  this.cdr.markForCheck();
141
139
  }
142
140
  else if (this.resizable && resizing) {
@@ -356,10 +354,6 @@ export class TileLayoutDraggingService {
356
354
  this.resizing = this.reordering = false;
357
355
  this.direction = null;
358
356
  if (this.draggedItemWrapper) {
359
- const grabHandle = this.draggedItemWrapper.querySelector('.k-cursor-grab');
360
- if (grabHandle) {
361
- this.renderer.removeClass(grabHandle, 'k-cursor-grabbing');
362
- }
363
357
  setElementStyles(this.renderer, this.draggedItemWrapper, {
364
358
  top: '',
365
359
  left: '',
package/esm2022/tilelayout/tilelayout-item-header.component.mjs CHANGED
@@ -2,36 +2,16 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Component, ElementRef, HostBinding, Input, Renderer2 } from '@angular/core';
5
+ import { Component, HostBinding } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
8
  * Holds the content of the header section of the TileLayoutItem component.
9
9
  * This is the area which can be dragged to reorder the items if reordering is enabled for this item.
10
10
  */
11
11
  export class TileLayoutItemHeaderComponent {
12
- hostEl;
13
- renderer;
14
12
  hostClass = true;
15
- /**
16
- * @hidden
17
- */
18
- set reorderable(value) {
19
- const hostElement = this.hostEl.nativeElement;
20
- if (value) {
21
- this.renderer.addClass(hostElement, 'k-touch-action-none');
22
- this.renderer.removeClass(hostElement, 'k-touch-action-auto');
23
- }
24
- else {
25
- this.renderer.addClass(hostElement, 'k-touch-action-auto');
26
- this.renderer.removeClass(hostElement, 'k-touch-action-none');
27
- }
28
- }
29
- constructor(hostEl, renderer) {
30
- this.hostEl = hostEl;
31
- this.renderer = renderer;
32
- }
33
- 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 });
34
- 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: `
13
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
14
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutItemHeaderComponent, isStandalone: true, selector: "kendo-tilelayout-item-header", host: { properties: { "class.k-tilelayout-item-header": "this.hostClass", "class.k-card-header": "this.hostClass" } }, ngImport: i0, template: `
35
15
  <ng-content></ng-content>
36
16
  `, isInline: true });
37
17
  }
@@ -44,12 +24,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
44
24
  `,
45
25
  standalone: true
46
26
  }]
47
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { hostClass: [{
27
+ }], propDecorators: { hostClass: [{
48
28
  type: HostBinding,
49
29
  args: ['class.k-tilelayout-item-header']
50
30
  }, {
51
31
  type: HostBinding,
52
32
  args: ['class.k-card-header']
53
- }], reorderable: [{
54
- type: Input
55
33
  }] } });
package/esm2022/tilelayout/tilelayout-item.component.mjs CHANGED
@@ -157,9 +157,6 @@ export class TileLayoutItemComponent {
157
157
  const keyboardNavigation = this.keyboardNavigationService;
158
158
  this.subs.add(this.draggingService.reorderable.subscribe(reorderable => {
159
159
  this.toggleCursorClass(reorderable && this.reorderable);
160
- if (this.headers?.first) {
161
- this.headers.first.reorderable = reorderable && this.reorderable;
162
- }
163
160
  }));
164
161
  this.subs.add(keyboardNavigation.navigable.subscribe(isNavigable => {
165
162
  if (isNavigable) {
@@ -201,42 +198,42 @@ export class TileLayoutItemComponent {
201
198
  return;
202
199
  }
203
200
  if (isReorderable) {
204
- this.renderer.addClass(headerEl, 'k-cursor-grab');
201
+ this.renderer.addClass(headerEl, 'k-cursor-move');
205
202
  }
206
203
  else {
207
- this.renderer.removeClass(headerEl, 'k-cursor-grab');
204
+ this.renderer.removeClass(headerEl, 'k-cursor-move');
208
205
  }
209
206
  }
210
207
  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 });
211
208
  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: `
212
- <kendo-tilelayout-item-header [reorderable]="isReorderable" *ngIf="title">
209
+ <kendo-tilelayout-item-header *ngIf="title">
213
210
  <h5 [id]="titleId" class="k-card-title">{{ title }}</h5>
214
211
  </kendo-tilelayout-item-header>
215
212
  <ng-content></ng-content>
216
213
  <ng-container *ngIf="resizable">
217
214
  <div
218
215
  *ngFor="let dir of resizeDirections"
219
- class="k-resize-handle k-cursor-{{dir}}-resize k-touch-action-none"
216
+ class="k-resize-handle k-cursor-{{dir}}-resize"
220
217
  kendoTileLayoutResizeHandle
221
218
  [rtl]="rtl"
222
219
  [resizeDirection]="dir">
223
220
  </div>
224
221
  </ng-container>
225
- `, 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"] }] });
222
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TileLayoutItemHeaderComponent, selector: "kendo-tilelayout-item-header" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TileLayoutResizeHandleDirective, selector: "[kendoTileLayoutResizeHandle]", inputs: ["resizeDirection", "rtl"] }] });
226
223
  }
227
224
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemComponent, decorators: [{
228
225
  type: Component,
229
226
  args: [{
230
227
  selector: 'kendo-tilelayout-item',
231
228
  template: `
232
- <kendo-tilelayout-item-header [reorderable]="isReorderable" *ngIf="title">
229
+ <kendo-tilelayout-item-header *ngIf="title">
233
230
  <h5 [id]="titleId" class="k-card-title">{{ title }}</h5>
234
231
  </kendo-tilelayout-item-header>
235
232
  <ng-content></ng-content>
236
233
  <ng-container *ngIf="resizable">
237
234
  <div
238
235
  *ngFor="let dir of resizeDirections"
239
- class="k-resize-handle k-cursor-{{dir}}-resize k-touch-action-none"
236
+ class="k-resize-handle k-cursor-{{dir}}-resize"
240
237
  kendoTileLayoutResizeHandle
241
238
  [rtl]="rtl"
242
239
  [resizeDirection]="dir">
package/esm2022/tilelayout/tilelayout.component.mjs CHANGED
@@ -266,7 +266,7 @@ export class TileLayoutComponent {
266
266
  });
267
267
  }
268
268
  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 });
269
- 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: [
269
+ 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", "attr.role": "this.hostRole", "style.gap": "this.gapStyle", "style.padding": "this.gapStyle", "attr.dir": "this.direction" } }, providers: [
270
270
  LocalizationService,
271
271
  TileLayoutDraggingService,
272
272
  TileLayoutKeyboardNavigationService,
@@ -276,7 +276,7 @@ export class TileLayoutComponent {
276
276
  }
277
277
  ], queries: [{ propertyName: "items", predicate: TileLayoutItemComponent }], viewQueries: [{ propertyName: "hint", first: true, predicate: ["hint"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
278
278
  <ng-content></ng-content>
279
- <div #hint class="k-layout-item-hint k-layout-item-hint-reorder"
279
+ <div #hint class="k-layout-item-hint"
280
280
  [style.display]="'none'"
281
281
  [style.order]="targetOrder"
282
282
  [style.gridColumnEnd]="draggedItemWrapper?.style.gridColumnEnd"
@@ -303,7 +303,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
303
303
  ],
304
304
  template: `
305
305
  <ng-content></ng-content>
306
- <div #hint class="k-layout-item-hint k-layout-item-hint-reorder"
306
+ <div #hint class="k-layout-item-hint"
307
307
  [style.display]="'none'"
308
308
  [style.order]="targetOrder"
309
309
  [style.gridColumnEnd]="draggedItemWrapper?.style.gridColumnEnd"
@@ -340,9 +340,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
340
340
  }], hostClass: [{
341
341
  type: HostBinding,
342
342
  args: ['class.k-tilelayout']
343
- }, {
344
- type: HostBinding,
345
- args: ['class.k-pos-relative']
346
343
  }], hostRole: [{
347
344
  type: HostBinding,
348
345
  args: ['attr.role']
package/esm2022/timeline/timeline-horizontal.component.mjs CHANGED
@@ -4,9 +4,9 @@
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { ChangeDetectorRef, Component, ElementRef, Input, NgZone, QueryList, Renderer2, ViewChild, ViewChildren, } from '@angular/core';
6
6
  import { caretAltLeftIcon, caretAltRightIcon } from '@progress/kendo-svg-icons';
7
- import { Subscription, fromEvent } from 'rxjs';
7
+ import { Subscription } from 'rxjs';
8
8
  import { TimelineCardComponent } from './timeline-card.component';
9
- import { Keys, guid, isChanged, isDocumentAvailable, isPresent } from '@progress/kendo-angular-common';
9
+ import { Keys, ResizeSensorComponent, guid, isChanged, isDocumentAvailable, isPresent } from '@progress/kendo-angular-common';
10
10
  import { animate, state, style, transition, trigger } from '@angular/animations';
11
11
  import { TimelineService } from './timeline.service';
12
12
  import { LocalizationService } from '@progress/kendo-angular-l10n';
@@ -92,7 +92,6 @@ export class TimelineHorizontalComponent {
92
92
  this.localization = localization;
93
93
  }
94
94
  ngOnInit() {
95
- this._zone.runOutsideAngular(() => isDocumentAvailable() && this.subscriptions.add(fromEvent(window, 'resize').subscribe(this.handleWindowResize.bind(this))));
96
95
  this.l10nChange();
97
96
  this.subscriptions.add(this.localization.changes.subscribe(this.l10nChange.bind(this)));
98
97
  if (this.events.length > 0) {
@@ -154,7 +153,7 @@ export class TimelineHorizontalComponent {
154
153
  ngOnDestroy() {
155
154
  this.subscriptions.unsubscribe();
156
155
  }
157
- handleWindowResize() {
156
+ onResize() {
158
157
  if (!isDocumentAvailable()) {
159
158
  return;
160
159
  }
@@ -486,24 +485,24 @@ export class TimelineHorizontalComponent {
486
485
  <button
487
486
  kendoButton
488
487
  [svgIcon]="svgLeftIcon"
488
+ icon="caret-alt-left"
489
489
  class="k-timeline-arrow k-timeline-arrow-left"
490
490
  rounded="full"
491
491
  [title]="previousTitle"
492
492
  (click)="previousClick()"
493
493
  [disabled]="isFirstRange"
494
- [attr.aria-hidden]="true"
495
494
  tabindex="-1"
496
495
  type="button"
497
496
  ></button>
498
497
  <button
499
498
  kendoButton
500
499
  [svgIcon]="svgRightIcon"
500
+ icon="caret-alt-right"
501
501
  class="k-timeline-arrow k-timeline-arrow-right"
502
502
  rounded="full"
503
503
  [title]="nextTitle"
504
504
  (click)="nextClick()"
505
505
  [disabled]="isLastRange"
506
- [attr.aria-hidden]="true"
507
506
  tabindex="-1"
508
507
  type="button"
509
508
  ></button>
@@ -577,8 +576,9 @@ export class TimelineHorizontalComponent {
577
576
  </kendo-timeline-card>
578
577
  </li>
579
578
  </ul>
579
+ <kendo-resize-sensor (resize)="onResize()" [rateLimit]="10"></kendo-resize-sensor>
580
580
  </div>
581
- `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TimelineCardComponent, selector: "kendo-timeline-card", inputs: ["event", "expanded", "collapsible", "reversed", "orientation", "navigable", "tabIndex", "animationDuration", "index", "eventWidth", "eventHeight", "headerTemplate", "bodyTemplate", "actionsTemplate", "calloutStyle"], exportAs: ["kendoTimelineCard"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }], animations: [
581
+ `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TimelineCardComponent, selector: "kendo-timeline-card", inputs: ["event", "expanded", "collapsible", "reversed", "orientation", "navigable", "tabIndex", "animationDuration", "index", "eventWidth", "eventHeight", "headerTemplate", "bodyTemplate", "actionsTemplate", "calloutStyle"], exportAs: ["kendoTimelineCard"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], animations: [
582
582
  trigger('trackSlide', [
583
583
  state('left', style({
584
584
  transform: `translateX({{transformValue}}%)`,
@@ -632,24 +632,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
632
632
  <button
633
633
  kendoButton
634
634
  [svgIcon]="svgLeftIcon"
635
+ icon="caret-alt-left"
635
636
  class="k-timeline-arrow k-timeline-arrow-left"
636
637
  rounded="full"
637
638
  [title]="previousTitle"
638
639
  (click)="previousClick()"
639
640
  [disabled]="isFirstRange"
640
- [attr.aria-hidden]="true"
641
641
  tabindex="-1"
642
642
  type="button"
643
643
  ></button>
644
644
  <button
645
645
  kendoButton
646
646
  [svgIcon]="svgRightIcon"
647
+ icon="caret-alt-right"
647
648
  class="k-timeline-arrow k-timeline-arrow-right"
648
649
  rounded="full"
649
650
  [title]="nextTitle"
650
651
  (click)="nextClick()"
651
652
  [disabled]="isLastRange"
652
- [attr.aria-hidden]="true"
653
653
  tabindex="-1"
654
654
  type="button"
655
655
  ></button>
@@ -723,10 +723,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
723
723
  </kendo-timeline-card>
724
724
  </li>
725
725
  </ul>
726
+ <kendo-resize-sensor (resize)="onResize()" [rateLimit]="10"></kendo-resize-sensor>
726
727
  </div>
727
728
  `,
728
729
  standalone: true,
729
- imports: [ButtonComponent, NgFor, NgIf, NgStyle, TimelineCardComponent, DatePipe]
730
+ imports: [ButtonComponent, NgFor, NgIf, NgStyle, TimelineCardComponent, DatePipe, ResizeSensorComponent]
730
731
  }]
731
732
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1.TimelineService }, { type: i2.LocalizationService }]; }, propDecorators: { events: [{
732
733
  type: Input
package/fesm2022/progress-kendo-angular-layout.mjs CHANGED
@@ -11,7 +11,7 @@ import { Keys, shouldShowValidationUI, WatermarkOverlayComponent, isDocumentAvai
11
11
  import { validatePackage } from '@progress/kendo-licensing';
12
12
  import * as i1$2 from '@angular/animations';
13
13
  import { trigger, state, style, transition, animate, AUTO_STYLE } from '@angular/animations';
14
- import { Subject, BehaviorSubject, Subscription, of, fromEvent } from 'rxjs';
14
+ import { Subject, BehaviorSubject, Subscription, of } from 'rxjs';
15
15
  import { chevronUpIcon, chevronDownIcon, caretAltLeftIcon, caretAltRightIcon, caretAltUpIcon, caretAltDownIcon, xIcon, checkCircleIcon, exclamationCircleIcon, chevronRightIcon } from '@progress/kendo-svg-icons';
16
16
  import { IconWrapperComponent } from '@progress/kendo-angular-icons';
17
17
  import { NgIf, NgTemplateOutlet, NgFor, NgStyle, NgClass } from '@angular/common';
@@ -28,8 +28,8 @@ const packageMetadata = {
28
28
  name: '@progress/kendo-angular-layout',
29
29
  productName: 'Kendo UI for Angular',
30
30
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
31
- publishDate: 1730712008,
32
- version: '17.0.0-develop.34',
31
+ publishDate: 1730720878,
32
+ version: '17.0.0-develop.36',
33
33
  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'
34
34
  };
35
35
 
@@ -630,7 +630,7 @@ class PanelBarItemComponent {
630
630
  }"></ng-template>
631
631
  <kendo-icon-wrapper
632
632
  *ngIf="hasChildItems || hasContent"
633
- [name]="expanded ? 'arrow-chevron-up' : 'chevron-down'"
633
+ [name]="expanded ? 'chevron-up' : 'chevron-down'"
634
634
  [svgIcon]="expanderSVGIcon"
635
635
  [innerCssClass]="dirInnerCssClasses"
636
636
  >
@@ -784,7 +784,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
784
784
  }"></ng-template>
785
785
  <kendo-icon-wrapper
786
786
  *ngIf="hasChildItems || hasContent"
787
- [name]="expanded ? 'arrow-chevron-up' : 'chevron-down'"
787
+ [name]="expanded ? 'chevron-up' : 'chevron-down'"
788
788
  [svgIcon]="expanderSVGIcon"
789
789
  [innerCssClass]="dirInnerCssClasses"
790
790
  >
@@ -7127,7 +7127,7 @@ class StepperComponent {
7127
7127
  [attr.aria-hidden]='true'
7128
7128
  [animation]='progressAnimation'
7129
7129
  [max]='steps.length - 1'
7130
- [label]='false'
7130
+ [label]='{position: "start", visible: false}'
7131
7131
  [orientation]='orientation'
7132
7132
  [reverse]='!isHorizontal'
7133
7133
  [value]='currentStep'
@@ -7180,7 +7180,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
7180
7180
  [attr.aria-hidden]='true'
7181
7181
  [animation]='progressAnimation'
7182
7182
  [max]='steps.length - 1'
7183
- [label]='false'
7183
+ [label]='{position: "start", visible: false}'
7184
7184
  [orientation]='orientation'
7185
7185
  [reverse]='!isHorizontal'
7186
7186
  [value]='currentStep'
@@ -9179,8 +9179,6 @@ class TileLayoutDraggingService {
9179
9179
  this.currentColStart = this.draggedItem.colStart;
9180
9180
  this.currentRowStart = this.draggedItem.rowStart;
9181
9181
  });
9182
- const headerEl = this.draggedItem.elem.nativeElement.querySelector('.k-tilelayout-item-header');
9183
- this.renderer.addClass(headerEl, 'k-cursor-grabbing');
9184
9182
  this.cdr.markForCheck();
9185
9183
  }
9186
9184
  else if (this.resizable && resizing) {
@@ -9400,10 +9398,6 @@ class TileLayoutDraggingService {
9400
9398
  this.resizing = this.reordering = false;
9401
9399
  this.direction = null;
9402
9400
  if (this.draggedItemWrapper) {
9403
- const grabHandle = this.draggedItemWrapper.querySelector('.k-cursor-grab');
9404
- if (grabHandle) {
9405
- this.renderer.removeClass(grabHandle, 'k-cursor-grabbing');
9406
- }
9407
9401
  setElementStyles(this.renderer, this.draggedItemWrapper, {
9408
9402
  top: '',
9409
9403
  left: '',
@@ -9613,29 +9607,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
9613
9607
  * This is the area which can be dragged to reorder the items if reordering is enabled for this item.
9614
9608
  */
9615
9609
  class TileLayoutItemHeaderComponent {
9616
- hostEl;
9617
- renderer;
9618
9610
  hostClass = true;
9619
- /**
9620
- * @hidden
9621
- */
9622
- set reorderable(value) {
9623
- const hostElement = this.hostEl.nativeElement;
9624
- if (value) {
9625
- this.renderer.addClass(hostElement, 'k-touch-action-none');
9626
- this.renderer.removeClass(hostElement, 'k-touch-action-auto');
9627
- }
9628
- else {
9629
- this.renderer.addClass(hostElement, 'k-touch-action-auto');
9630
- this.renderer.removeClass(hostElement, 'k-touch-action-none');
9631
- }
9632
- }
9633
- constructor(hostEl, renderer) {
9634
- this.hostEl = hostEl;
9635
- this.renderer = renderer;
9636
- }
9637
- 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 });
9638
- 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: `
9611
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
9612
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayoutItemHeaderComponent, isStandalone: true, selector: "kendo-tilelayout-item-header", host: { properties: { "class.k-tilelayout-item-header": "this.hostClass", "class.k-card-header": "this.hostClass" } }, ngImport: i0, template: `
9639
9613
  <ng-content></ng-content>
9640
9614
  `, isInline: true });
9641
9615
  }
@@ -9648,14 +9622,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
9648
9622
  `,
9649
9623
  standalone: true
9650
9624
  }]
9651
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { hostClass: [{
9625
+ }], propDecorators: { hostClass: [{
9652
9626
  type: HostBinding,
9653
9627
  args: ['class.k-tilelayout-item-header']
9654
9628
  }, {
9655
9629
  type: HostBinding,
9656
9630
  args: ['class.k-card-header']
9657
- }], reorderable: [{
9658
- type: Input
9659
9631
  }] } });
9660
9632
 
9661
9633
  /**
@@ -9853,9 +9825,6 @@ class TileLayoutItemComponent {
9853
9825
  const keyboardNavigation = this.keyboardNavigationService;
9854
9826
  this.subs.add(this.draggingService.reorderable.subscribe(reorderable => {
9855
9827
  this.toggleCursorClass(reorderable && this.reorderable);
9856
- if (this.headers?.first) {
9857
- this.headers.first.reorderable = reorderable && this.reorderable;
9858
- }
9859
9828
  }));
9860
9829
  this.subs.add(keyboardNavigation.navigable.subscribe(isNavigable => {
9861
9830
  if (isNavigable) {
@@ -9897,42 +9866,42 @@ class TileLayoutItemComponent {
9897
9866
  return;
9898
9867
  }
9899
9868
  if (isReorderable) {
9900
- this.renderer.addClass(headerEl, 'k-cursor-grab');
9869
+ this.renderer.addClass(headerEl, 'k-cursor-move');
9901
9870
  }
9902
9871
  else {
9903
- this.renderer.removeClass(headerEl, 'k-cursor-grab');
9872
+ this.renderer.removeClass(headerEl, 'k-cursor-move');
9904
9873
  }
9905
9874
  }
9906
9875
  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: TileLayoutDraggingService }, { token: TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
9907
9876
  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: `
9908
- <kendo-tilelayout-item-header [reorderable]="isReorderable" *ngIf="title">
9877
+ <kendo-tilelayout-item-header *ngIf="title">
9909
9878
  <h5 [id]="titleId" class="k-card-title">{{ title }}</h5>
9910
9879
  </kendo-tilelayout-item-header>
9911
9880
  <ng-content></ng-content>
9912
9881
  <ng-container *ngIf="resizable">
9913
9882
  <div
9914
9883
  *ngFor="let dir of resizeDirections"
9915
- class="k-resize-handle k-cursor-{{dir}}-resize k-touch-action-none"
9884
+ class="k-resize-handle k-cursor-{{dir}}-resize"
9916
9885
  kendoTileLayoutResizeHandle
9917
9886
  [rtl]="rtl"
9918
9887
  [resizeDirection]="dir">
9919
9888
  </div>
9920
9889
  </ng-container>
9921
- `, 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"] }] });
9890
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TileLayoutItemHeaderComponent, selector: "kendo-tilelayout-item-header" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TileLayoutResizeHandleDirective, selector: "[kendoTileLayoutResizeHandle]", inputs: ["resizeDirection", "rtl"] }] });
9922
9891
  }
9923
9892
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayoutItemComponent, decorators: [{
9924
9893
  type: Component,
9925
9894
  args: [{
9926
9895
  selector: 'kendo-tilelayout-item',
9927
9896
  template: `
9928
- <kendo-tilelayout-item-header [reorderable]="isReorderable" *ngIf="title">
9897
+ <kendo-tilelayout-item-header *ngIf="title">
9929
9898
  <h5 [id]="titleId" class="k-card-title">{{ title }}</h5>
9930
9899
  </kendo-tilelayout-item-header>
9931
9900
  <ng-content></ng-content>
9932
9901
  <ng-container *ngIf="resizable">
9933
9902
  <div
9934
9903
  *ngFor="let dir of resizeDirections"
9935
- class="k-resize-handle k-cursor-{{dir}}-resize k-touch-action-none"
9904
+ class="k-resize-handle k-cursor-{{dir}}-resize"
9936
9905
  kendoTileLayoutResizeHandle
9937
9906
  [rtl]="rtl"
9938
9907
  [resizeDirection]="dir">
@@ -10247,7 +10216,7 @@ class TileLayoutComponent {
10247
10216
  });
10248
10217
  }
10249
10218
  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: TileLayoutDraggingService }, { token: TileLayoutKeyboardNavigationService }], target: i0.ɵɵFactoryTarget.Component });
10250
- 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: [
10219
+ 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", "attr.role": "this.hostRole", "style.gap": "this.gapStyle", "style.padding": "this.gapStyle", "attr.dir": "this.direction" } }, providers: [
10251
10220
  LocalizationService,
10252
10221
  TileLayoutDraggingService,
10253
10222
  TileLayoutKeyboardNavigationService,
@@ -10257,7 +10226,7 @@ class TileLayoutComponent {
10257
10226
  }
10258
10227
  ], queries: [{ propertyName: "items", predicate: TileLayoutItemComponent }], viewQueries: [{ propertyName: "hint", first: true, predicate: ["hint"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
10259
10228
  <ng-content></ng-content>
10260
- <div #hint class="k-layout-item-hint k-layout-item-hint-reorder"
10229
+ <div #hint class="k-layout-item-hint"
10261
10230
  [style.display]="'none'"
10262
10231
  [style.order]="targetOrder"
10263
10232
  [style.gridColumnEnd]="draggedItemWrapper?.style.gridColumnEnd"
@@ -10284,7 +10253,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
10284
10253
  ],
10285
10254
  template: `
10286
10255
  <ng-content></ng-content>
10287
- <div #hint class="k-layout-item-hint k-layout-item-hint-reorder"
10256
+ <div #hint class="k-layout-item-hint"
10288
10257
  [style.display]="'none'"
10289
10258
  [style.order]="targetOrder"
10290
10259
  [style.gridColumnEnd]="draggedItemWrapper?.style.gridColumnEnd"
@@ -10321,9 +10290,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
10321
10290
  }], hostClass: [{
10322
10291
  type: HostBinding,
10323
10292
  args: ['class.k-tilelayout']
10324
- }, {
10325
- type: HostBinding,
10326
- args: ['class.k-pos-relative']
10327
10293
  }], hostRole: [{
10328
10294
  type: HostBinding,
10329
10295
  args: ['attr.role']
@@ -11509,7 +11475,6 @@ class TimelineHorizontalComponent {
11509
11475
  this.localization = localization;
11510
11476
  }
11511
11477
  ngOnInit() {
11512
- this._zone.runOutsideAngular(() => isDocumentAvailable() && this.subscriptions.add(fromEvent(window, 'resize').subscribe(this.handleWindowResize.bind(this))));
11513
11478
  this.l10nChange();
11514
11479
  this.subscriptions.add(this.localization.changes.subscribe(this.l10nChange.bind(this)));
11515
11480
  if (this.events.length > 0) {
@@ -11571,7 +11536,7 @@ class TimelineHorizontalComponent {
11571
11536
  ngOnDestroy() {
11572
11537
  this.subscriptions.unsubscribe();
11573
11538
  }
11574
- handleWindowResize() {
11539
+ onResize() {
11575
11540
  if (!isDocumentAvailable()) {
11576
11541
  return;
11577
11542
  }
@@ -11903,24 +11868,24 @@ class TimelineHorizontalComponent {
11903
11868
  <button
11904
11869
  kendoButton
11905
11870
  [svgIcon]="svgLeftIcon"
11871
+ icon="caret-alt-left"
11906
11872
  class="k-timeline-arrow k-timeline-arrow-left"
11907
11873
  rounded="full"
11908
11874
  [title]="previousTitle"
11909
11875
  (click)="previousClick()"
11910
11876
  [disabled]="isFirstRange"
11911
- [attr.aria-hidden]="true"
11912
11877
  tabindex="-1"
11913
11878
  type="button"
11914
11879
  ></button>
11915
11880
  <button
11916
11881
  kendoButton
11917
11882
  [svgIcon]="svgRightIcon"
11883
+ icon="caret-alt-right"
11918
11884
  class="k-timeline-arrow k-timeline-arrow-right"
11919
11885
  rounded="full"
11920
11886
  [title]="nextTitle"
11921
11887
  (click)="nextClick()"
11922
11888
  [disabled]="isLastRange"
11923
- [attr.aria-hidden]="true"
11924
11889
  tabindex="-1"
11925
11890
  type="button"
11926
11891
  ></button>
@@ -11994,8 +11959,9 @@ class TimelineHorizontalComponent {
11994
11959
  </kendo-timeline-card>
11995
11960
  </li>
11996
11961
  </ul>
11962
+ <kendo-resize-sensor (resize)="onResize()" [rateLimit]="10"></kendo-resize-sensor>
11997
11963
  </div>
11998
- `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TimelineCardComponent, selector: "kendo-timeline-card", inputs: ["event", "expanded", "collapsible", "reversed", "orientation", "navigable", "tabIndex", "animationDuration", "index", "eventWidth", "eventHeight", "headerTemplate", "bodyTemplate", "actionsTemplate", "calloutStyle"], exportAs: ["kendoTimelineCard"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }], animations: [
11964
+ `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TimelineCardComponent, selector: "kendo-timeline-card", inputs: ["event", "expanded", "collapsible", "reversed", "orientation", "navigable", "tabIndex", "animationDuration", "index", "eventWidth", "eventHeight", "headerTemplate", "bodyTemplate", "actionsTemplate", "calloutStyle"], exportAs: ["kendoTimelineCard"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], animations: [
11999
11965
  trigger('trackSlide', [
12000
11966
  state('left', style({
12001
11967
  transform: `translateX({{transformValue}}%)`,
@@ -12049,24 +12015,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12049
12015
  <button
12050
12016
  kendoButton
12051
12017
  [svgIcon]="svgLeftIcon"
12018
+ icon="caret-alt-left"
12052
12019
  class="k-timeline-arrow k-timeline-arrow-left"
12053
12020
  rounded="full"
12054
12021
  [title]="previousTitle"
12055
12022
  (click)="previousClick()"
12056
12023
  [disabled]="isFirstRange"
12057
- [attr.aria-hidden]="true"
12058
12024
  tabindex="-1"
12059
12025
  type="button"
12060
12026
  ></button>
12061
12027
  <button
12062
12028
  kendoButton
12063
12029
  [svgIcon]="svgRightIcon"
12030
+ icon="caret-alt-right"
12064
12031
  class="k-timeline-arrow k-timeline-arrow-right"
12065
12032
  rounded="full"
12066
12033
  [title]="nextTitle"
12067
12034
  (click)="nextClick()"
12068
12035
  [disabled]="isLastRange"
12069
- [attr.aria-hidden]="true"
12070
12036
  tabindex="-1"
12071
12037
  type="button"
12072
12038
  ></button>
@@ -12140,10 +12106,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12140
12106
  </kendo-timeline-card>
12141
12107
  </li>
12142
12108
  </ul>
12109
+ <kendo-resize-sensor (resize)="onResize()" [rateLimit]="10"></kendo-resize-sensor>
12143
12110
  </div>
12144
12111
  `,
12145
12112
  standalone: true,
12146
- imports: [ButtonComponent, NgFor, NgIf, NgStyle, TimelineCardComponent, DatePipe]
12113
+ imports: [ButtonComponent, NgFor, NgIf, NgStyle, TimelineCardComponent, DatePipe, ResizeSensorComponent]
12147
12114
  }]
12148
12115
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: TimelineService }, { type: i1.LocalizationService }]; }, propDecorators: { events: [{
12149
12116
  type: Input
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-layout",
3
- "version": "17.0.0-develop.34",
3
+ "version": "17.0.0-develop.36",
4
4
  "description": "Kendo UI for Angular Layout Package - a collection of components to create professional application layoyts",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -39,17 +39,17 @@
39
39
  "@angular/core": "16 - 18",
40
40
  "@angular/platform-browser": "16 - 18",
41
41
  "@progress/kendo-licensing": "^1.0.2",
42
- "@progress/kendo-angular-common": "17.0.0-develop.34",
43
- "@progress/kendo-angular-l10n": "17.0.0-develop.34",
44
- "@progress/kendo-angular-progressbar": "17.0.0-develop.34",
45
- "@progress/kendo-angular-icons": "17.0.0-develop.34",
46
- "@progress/kendo-angular-buttons": "17.0.0-develop.34",
47
- "@progress/kendo-angular-intl": "17.0.0-develop.34",
42
+ "@progress/kendo-angular-common": "17.0.0-develop.36",
43
+ "@progress/kendo-angular-l10n": "17.0.0-develop.36",
44
+ "@progress/kendo-angular-progressbar": "17.0.0-develop.36",
45
+ "@progress/kendo-angular-icons": "17.0.0-develop.36",
46
+ "@progress/kendo-angular-buttons": "17.0.0-develop.36",
47
+ "@progress/kendo-angular-intl": "17.0.0-develop.36",
48
48
  "rxjs": "^6.5.3 || ^7.0.0"
49
49
  },
50
50
  "dependencies": {
51
51
  "tslib": "^2.3.1",
52
- "@progress/kendo-angular-schematics": "17.0.0-develop.34",
52
+ "@progress/kendo-angular-schematics": "17.0.0-develop.36",
53
53
  "@progress/kendo-draggable": "^3.0.2"
54
54
  },
55
55
  "schematics": "./schematics/collection.json",
package/tilelayout/tilelayout-item-header.component.d.ts CHANGED
@@ -2,21 +2,13 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ElementRef, Renderer2 } from '@angular/core';
6
5
  import * as i0 from "@angular/core";
7
6
  /**
8
7
  * Holds the content of the header section of the TileLayoutItem component.
9
8
  * This is the area which can be dragged to reorder the items if reordering is enabled for this item.
10
9
  */
11
10
  export declare class TileLayoutItemHeaderComponent {
12
- private hostEl;
13
- private renderer;
14
11
  hostClass: boolean;
15
- /**
16
- * @hidden
17
- */
18
- set reorderable(value: boolean);
19
- constructor(hostEl: ElementRef, renderer: Renderer2);
20
12
  static ɵfac: i0.ɵɵFactoryDeclaration<TileLayoutItemHeaderComponent, never>;
21
- static ɵcmp: i0.ɵɵComponentDeclaration<TileLayoutItemHeaderComponent, "kendo-tilelayout-item-header", never, { "reorderable": { "alias": "reorderable"; "required": false; }; }, {}, never, ["*"], true, never>;
13
+ static ɵcmp: i0.ɵɵComponentDeclaration<TileLayoutItemHeaderComponent, "kendo-tilelayout-item-header", never, {}, {}, never, ["*"], true, never>;
22
14
  }
package/timeline/timeline-horizontal.component.d.ts CHANGED
@@ -66,7 +66,7 @@ export declare class TimelineHorizontalComponent implements OnInit, AfterViewIni
66
66
  ngAfterViewInit(): void;
67
67
  ngOnChanges(changes: SimpleChanges): void;
68
68
  ngOnDestroy(): void;
69
- handleWindowResize(): void;
69
+ onResize(): void;
70
70
  onTransitionEnd(): void;
71
71
  onTrackTransitionEnd(): void;
72
72
  onSlideDone(): void;