@progress/kendo-angular-layout 17.0.0-develop.35 → 17.0.0-develop.37

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.
@@ -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: 1730714497,
13
- version: '17.0.0-develop.35',
12
+ publishDate: 1730722699,
13
+ version: '17.0.0-develop.37',
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
  };
@@ -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
  >
@@ -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'
@@ -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: '',
@@ -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
  }] } });
@@ -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">
@@ -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']
@@ -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: 1730714497,
32
- version: '17.0.0-develop.35',
31
+ publishDate: 1730722699,
32
+ version: '17.0.0-develop.37',
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']
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-layout",
3
- "version": "17.0.0-develop.35",
3
+ "version": "17.0.0-develop.37",
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.35",
43
- "@progress/kendo-angular-l10n": "17.0.0-develop.35",
44
- "@progress/kendo-angular-progressbar": "17.0.0-develop.35",
45
- "@progress/kendo-angular-icons": "17.0.0-develop.35",
46
- "@progress/kendo-angular-buttons": "17.0.0-develop.35",
47
- "@progress/kendo-angular-intl": "17.0.0-develop.35",
42
+ "@progress/kendo-angular-common": "17.0.0-develop.37",
43
+ "@progress/kendo-angular-l10n": "17.0.0-develop.37",
44
+ "@progress/kendo-angular-progressbar": "17.0.0-develop.37",
45
+ "@progress/kendo-angular-icons": "17.0.0-develop.37",
46
+ "@progress/kendo-angular-buttons": "17.0.0-develop.37",
47
+ "@progress/kendo-angular-intl": "17.0.0-develop.37",
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.35",
52
+ "@progress/kendo-angular-schematics": "17.0.0-develop.37",
53
53
  "@progress/kendo-draggable": "^3.0.2"
54
54
  },
55
55
  "schematics": "./schematics/collection.json",
@@ -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
  }