@progress/kendo-angular-grid 16.8.0 → 16.9.0-develop.2

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 (6) hide show
  1. package/esm2020/grid.component.mjs +488 -488
  2. package/esm2020/package-metadata.mjs +2 -2
  3. package/fesm2015/progress-kendo-angular-grid.mjs +490 -490
  4. package/fesm2020/progress-kendo-angular-grid.mjs +490 -490
  5. package/package.json +16 -16
  6. package/schematics/ngAdd/index.js +4 -4
package/esm2020/grid.component.mjs CHANGED
@@ -2332,267 +2332,267 @@ GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
2332
2332
  <div #ariaRoot
2333
2333
  class="k-grid-aria-root"
2334
2334
  role="grid"
2335
+ kendoDragTargetContainer
2336
+ kendoDropTargetContainer
2337
+ mode="manual"
2338
+ [dragDisabled]="!rowReorderable"
2339
+ [dropDisabled]="!rowReorderable"
2340
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2341
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2342
+ [dragHandle]="getDefaultSelectors('handle')"
2343
+ [hint]="{hintTemplate: defaultHint}"
2344
+ (onPress)="handleReorderEvents($event, 'press')"
2345
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
2346
+ (onDrag)="handleReorderEvents($event, 'drag')"
2347
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2348
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2349
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2350
+ (onDrop)="handleReorderEvents($event, 'drop')"
2351
+ [dragData]="gridData"
2335
2352
  [id]="ariaRootId"
2336
2353
  [attr.aria-label]="ariaLabel"
2337
2354
  [attr.aria-rowcount]="ariaRowCount"
2338
2355
  [attr.aria-colcount]="ariaColCount">
2339
- <ng-container *ngIf="isScrollable">
2340
- <div *ngIf="!hideHeader"
2341
- class="k-grid-header"
2342
- role="presentation"
2343
- [style.padding]="headerPadding">
2344
- <div *ngIf="isLocked"
2345
- #lockedHeader
2356
+ <ng-container *ngIf="isScrollable">
2357
+ <div *ngIf="!hideHeader"
2358
+ class="k-grid-header"
2346
2359
  role="presentation"
2347
- class="k-grid-header-locked"
2348
- [style.width.px]="lockedWidth">
2349
- <table
2350
- kendoGridResizableTable
2351
- [locked]="true"
2360
+ [style.padding]="headerPadding">
2361
+ <div *ngIf="isLocked"
2362
+ #lockedHeader
2352
2363
  role="presentation"
2353
- class="k-grid-header-table"
2354
- [style.width.px]="lockedWidth"
2355
- kendoGridTable
2356
- [size]="size">
2357
- <colgroup kendoGridColGroup
2358
- [columns]="$any(lockedLeafColumns)"
2359
- [groups]="group"
2360
- [detailTemplate]="detailTemplate">
2361
- </colgroup>
2362
- <thead kendoGridHeader
2363
- role="rowgroup"
2364
- [resizable]="resizable"
2365
- [scrollable]="true"
2366
- [columns]="$any(lockedColumns)"
2367
- [totalColumnLevels]="totalColumnLevels"
2368
- [sort]="sort"
2369
- [groups]="group"
2370
- [filter]="filter"
2371
- [filterable]="filterable"
2372
- [groupable]="showGroupPanel"
2373
- [reorderable]="reorderable"
2374
- [sortable]="sortable"
2375
- [columnMenu]="columnMenuOptions"
2376
- [columnMenuTemplate]="columnMenuTemplate"
2377
- [totalColumnsCount]="leafColumns.length"
2378
- [totalColumns]="columnsContainer"
2379
- [detailTemplate]="detailTemplate"
2380
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2381
- </thead>
2382
- </table>
2383
- </div>
2384
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2385
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2386
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2387
- <table
2388
- role="presentation"
2389
- class="k-grid-header-table"
2390
- [style.width.px]="nonLockedWidth"
2391
- kendoGridResizableTable
2392
- [virtualColumns]="virtualColumns"
2393
- kendoGridTable
2394
- [size]="size">
2395
- <colgroup kendoGridColGroup
2396
- [columns]="headerLeafColumns"
2397
- [groups]="isLocked ? [] : group"
2398
- [detailTemplate]="detailTemplate">
2399
- </colgroup>
2400
- <thead kendoGridHeader
2401
- [resizable]="resizable"
2402
- role="rowgroup"
2403
- [scrollable]="true"
2404
- [columns]="headerColumns"
2405
- [totalColumnLevels]="totalColumnLevels"
2406
- [sort]="sort"
2407
- [filter]="filter"
2408
- [filterable]="filterable"
2409
- [groupable]="showGroupPanel"
2410
- [reorderable]="reorderable"
2411
- [groups]="isLocked ? [] : group"
2412
- [sortable]="sortable"
2413
- [columnMenu]="columnMenuOptions"
2414
- [columnMenuTemplate]="columnMenuTemplate"
2415
- [lockedColumnsCount]="lockedLeafColumns.length"
2416
- [totalColumnsCount]="leafColumns.length"
2417
- [totalColumns]="columnsContainer"
2418
- [detailTemplate]="detailTemplate"
2419
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2420
- </thead>
2421
- </table>
2422
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2423
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2364
+ class="k-grid-header-locked"
2365
+ [style.width.px]="lockedWidth">
2366
+ <table
2367
+ kendoGridResizableTable
2368
+ [locked]="true"
2369
+ role="presentation"
2370
+ class="k-grid-header-table"
2371
+ [style.width.px]="lockedWidth"
2372
+ kendoGridTable
2373
+ [size]="size">
2374
+ <colgroup kendoGridColGroup
2375
+ [columns]="$any(lockedLeafColumns)"
2376
+ [groups]="group"
2377
+ [detailTemplate]="detailTemplate">
2378
+ </colgroup>
2379
+ <thead kendoGridHeader
2380
+ role="rowgroup"
2381
+ [resizable]="resizable"
2382
+ [scrollable]="true"
2383
+ [columns]="$any(lockedColumns)"
2384
+ [totalColumnLevels]="totalColumnLevels"
2385
+ [sort]="sort"
2386
+ [groups]="group"
2387
+ [filter]="filter"
2388
+ [filterable]="filterable"
2389
+ [groupable]="showGroupPanel"
2390
+ [reorderable]="reorderable"
2391
+ [sortable]="sortable"
2392
+ [columnMenu]="columnMenuOptions"
2393
+ [columnMenuTemplate]="columnMenuTemplate"
2394
+ [totalColumnsCount]="leafColumns.length"
2395
+ [totalColumns]="columnsContainer"
2396
+ [detailTemplate]="detailTemplate"
2397
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2398
+ </thead>
2399
+ </table>
2400
+ </div>
2401
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2402
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2403
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2404
+ <table
2405
+ role="presentation"
2406
+ class="k-grid-header-table"
2407
+ [style.width.px]="nonLockedWidth"
2408
+ kendoGridResizableTable
2409
+ [virtualColumns]="virtualColumns"
2410
+ kendoGridTable
2411
+ [size]="size">
2412
+ <colgroup kendoGridColGroup
2413
+ [columns]="headerLeafColumns"
2414
+ [groups]="isLocked ? [] : group"
2415
+ [detailTemplate]="detailTemplate">
2416
+ </colgroup>
2417
+ <thead kendoGridHeader
2418
+ [resizable]="resizable"
2419
+ role="rowgroup"
2420
+ [scrollable]="true"
2421
+ [columns]="headerColumns"
2422
+ [totalColumnLevels]="totalColumnLevels"
2423
+ [sort]="sort"
2424
+ [filter]="filter"
2425
+ [filterable]="filterable"
2426
+ [groupable]="showGroupPanel"
2427
+ [reorderable]="reorderable"
2428
+ [groups]="isLocked ? [] : group"
2429
+ [sortable]="sortable"
2430
+ [columnMenu]="columnMenuOptions"
2431
+ [columnMenuTemplate]="columnMenuTemplate"
2432
+ [lockedColumnsCount]="lockedLeafColumns.length"
2433
+ [totalColumnsCount]="leafColumns.length"
2434
+ [totalColumns]="columnsContainer"
2435
+ [detailTemplate]="detailTemplate"
2436
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2437
+ </thead>
2438
+ </table>
2439
+ <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2440
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2441
+ </div>
2424
2442
  </div>
2425
2443
  </div>
2426
- </div>
2427
- <kendo-grid-list
2428
- kendoDragTargetContainer
2429
- kendoDropTargetContainer
2430
- mode="manual"
2431
- [dragDisabled]="!rowReorderable"
2432
- [dropDisabled]="!rowReorderable"
2433
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2434
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2435
- [dragHandle]="getDefaultSelectors('handle')"
2436
- [hint]="{hintTemplate: defaultHint}"
2437
- (onPress)="handleReorderEvents($event, 'press')"
2438
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
2439
- (onDrag)="handleReorderEvents($event, 'drag')"
2440
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2441
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2442
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2443
- (onDrop)="handleReorderEvents($event, 'drop')"
2444
- [dragData]="gridData"
2445
- [data]="$any(view)"
2446
- [rowHeight]="rowHeight"
2447
- [detailRowHeight]="detailRowHeight"
2448
- [total]="totalCount"
2449
- [take]="pageSize"
2450
- [groups]="group"
2451
- [groupable]="groupable"
2452
- [skip]="skip"
2453
- [trackBy]="trackBy"
2454
- [columns]="columnsContainer"
2455
- [selectable]="selectable"
2456
- [filterable]="filterable"
2457
- [detailTemplate]="detailTemplate"
2458
- [noRecordsTemplate]="noRecordsTemplate"
2459
- [size]="size"
2460
- (pageChange)="notifyPageChange('list', $event)"
2461
- [rowClass]="rowClass"
2462
- [rowSticky]="rowSticky"
2463
- [loading]="loading"
2464
- [isVirtual]="isVirtual"
2465
- [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
2466
- [loadingTemplate]="loadingTemplate?.templateRef"
2467
- [virtualColumns]="virtualColumns"
2468
- (scrollBottom)="notifyScrollBottom()"
2469
- (contentScroll)="contentScroll.emit($event)"
2470
- kendoDraggable
2471
- kendoGridSelectionMarquee
2472
- [enableDrag]="marqueeSelection"
2473
- [sort]="sort">
2474
- </kendo-grid-list>
2475
- <div
2476
- *ngIf="showFooter"
2477
- class="k-grid-footer"
2478
- [style.padding]="headerPadding">
2479
- <div
2480
- *ngIf="lockedLeafColumns.length"
2481
- class="k-grid-footer-locked"
2482
- [style.width.px]="lockedWidth">
2483
- <table
2484
- role="presentation"
2485
- class="k-grid-footer-table"
2486
- kendoGridResizableTable
2487
- [locked]="true"
2488
- [style.width.px]="lockedWidth"
2489
- kendoGridTable
2490
- [size]="size">
2491
- <colgroup kendoGridColGroup
2492
- [columns]="$any(lockedLeafColumns)"
2493
- [groups]="group"
2494
- [detailTemplate]="detailTemplate">
2495
- </colgroup>
2496
- <tfoot kendoGridFooter
2497
- [scrollable]="true"
2498
- [groups]="group"
2499
- [columns]="$any(lockedLeafColumns)"
2500
- [detailTemplate]="detailTemplate"
2501
- [logicalRowIndex]="ariaRowCount"
2502
- [totalColumns]="columnsContainer">
2503
- </tfoot>
2504
- </table>
2505
- </div>
2506
- <div #footer
2507
- class="k-grid-footer-wrap" data-scrollable
2508
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2509
- [lockedWidth]="lockedWidth + scrollbarWidth + 3">
2510
- <table
2511
- role="presentation"
2512
- class="k-grid-footer-table"
2513
- [style.width.px]="nonLockedWidth"
2514
- kendoGridTable
2515
- kendoGridResizableTable
2516
- [size]="size">
2517
- <colgroup kendoGridColGroup
2518
- [columns]="$any(headerLeafColumns)"
2519
- [groups]="isLocked ? [] : group"
2520
- [detailTemplate]="detailTemplate">
2521
- </colgroup>
2522
- <tfoot kendoGridFooter
2523
- [logicalRowIndex]="ariaRowCount"
2524
- [scrollable]="true"
2525
- [groups]="isLocked ? [] : group"
2526
- [columns]="$any(headerColumns)"
2527
- [lockedColumnsCount]="lockedLeafColumns.length"
2528
- [detailTemplate]="detailTemplate"
2529
- [totalColumns]="columnsContainer">
2530
- </tfoot>
2531
- </table>
2532
- </div>
2533
- </div>
2534
- </ng-container>
2535
- <ng-container *ngIf="!isScrollable">
2536
- <table
2537
- [style.table-layout]="resizable ? 'fixed' : null"
2538
- kendoGridTable
2539
- kendoGridResizableTable
2540
- role="presentation"
2541
- [size]="size">
2542
- <colgroup kendoGridColGroup
2543
- [columns]="$any(leafColumns)"
2544
- [groups]="group"
2545
- [detailTemplate]="detailTemplate">
2546
- </colgroup>
2547
- <thead kendoGridHeader
2548
- *ngIf="!hideHeader"
2549
- [resizable]="resizable"
2550
- [scrollable]="false"
2551
- [columns]="$any(visibleColumns)"
2552
- [totalColumnLevels]="totalColumnLevels"
2553
- [totalColumns]="columnsContainer"
2554
- [groups]="group"
2555
- [groupable]="showGroupPanel"
2556
- [reorderable]="reorderable"
2557
- [sort]="sort"
2558
- [sortable]="sortable"
2559
- [filter]="filter"
2560
- [filterable]="filterable"
2561
- [columnMenu]="columnMenuOptions"
2562
- [columnMenuTemplate]="columnMenuTemplate"
2563
- [detailTemplate]="detailTemplate"
2564
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2565
- </thead>
2566
- <tbody kendoGridTableBody
2567
- [isLoading]="loading"
2568
- [groups]="group"
2444
+ <kendo-grid-list
2569
2445
  [data]="$any(view)"
2446
+ [rowHeight]="rowHeight"
2447
+ [detailRowHeight]="detailRowHeight"
2448
+ [total]="totalCount"
2449
+ [take]="pageSize"
2450
+ [groups]="group"
2451
+ [groupable]="groupable"
2570
2452
  [skip]="skip"
2571
- [columns]="$any(leafColumns)"
2453
+ [trackBy]="trackBy"
2454
+ [columns]="columnsContainer"
2572
2455
  [selectable]="selectable"
2573
2456
  [filterable]="filterable"
2574
- [noRecordsTemplate]="noRecordsTemplate"
2575
2457
  [detailTemplate]="detailTemplate"
2576
- [showGroupFooters]="showGroupFooters"
2577
- [trackBy]="trackBy"
2458
+ [noRecordsTemplate]="noRecordsTemplate"
2459
+ [size]="size"
2460
+ (pageChange)="notifyPageChange('list', $event)"
2578
2461
  [rowClass]="rowClass"
2462
+ [rowSticky]="rowSticky"
2463
+ [loading]="loading"
2464
+ [isVirtual]="isVirtual"
2465
+ [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
2466
+ [loadingTemplate]="loadingTemplate?.templateRef"
2467
+ [virtualColumns]="virtualColumns"
2468
+ (scrollBottom)="notifyScrollBottom()"
2469
+ (contentScroll)="contentScroll.emit($event)"
2579
2470
  kendoDraggable
2580
2471
  kendoGridSelectionMarquee
2581
- [enableDrag]="marqueeSelection">
2582
- </tbody>
2583
- <tfoot kendoGridFooter
2472
+ [enableDrag]="marqueeSelection"
2473
+ [sort]="sort">
2474
+ </kendo-grid-list>
2475
+ <div
2584
2476
  *ngIf="showFooter"
2585
- [scrollable]="false"
2586
- [logicalRowIndex]="ariaRowCount"
2587
- [groups]="group"
2588
- [columns]="$any(leafColumns)"
2589
- [detailTemplate]="detailTemplate"
2590
- [totalColumns]="columnsContainer">
2591
- </tfoot>
2592
- </table>
2593
- </ng-container>
2594
- <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
2595
- </div>
2477
+ class="k-grid-footer"
2478
+ [style.padding]="headerPadding">
2479
+ <div
2480
+ *ngIf="lockedLeafColumns.length"
2481
+ class="k-grid-footer-locked"
2482
+ [style.width.px]="lockedWidth">
2483
+ <table
2484
+ role="presentation"
2485
+ class="k-grid-footer-table"
2486
+ kendoGridResizableTable
2487
+ [locked]="true"
2488
+ [style.width.px]="lockedWidth"
2489
+ kendoGridTable
2490
+ [size]="size">
2491
+ <colgroup kendoGridColGroup
2492
+ [columns]="$any(lockedLeafColumns)"
2493
+ [groups]="group"
2494
+ [detailTemplate]="detailTemplate">
2495
+ </colgroup>
2496
+ <tfoot kendoGridFooter
2497
+ [scrollable]="true"
2498
+ [groups]="group"
2499
+ [columns]="$any(lockedLeafColumns)"
2500
+ [detailTemplate]="detailTemplate"
2501
+ [logicalRowIndex]="ariaRowCount"
2502
+ [totalColumns]="columnsContainer">
2503
+ </tfoot>
2504
+ </table>
2505
+ </div>
2506
+ <div #footer
2507
+ class="k-grid-footer-wrap" data-scrollable
2508
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2509
+ [lockedWidth]="lockedWidth + scrollbarWidth + 3">
2510
+ <table
2511
+ role="presentation"
2512
+ class="k-grid-footer-table"
2513
+ [style.width.px]="nonLockedWidth"
2514
+ kendoGridTable
2515
+ kendoGridResizableTable
2516
+ [size]="size">
2517
+ <colgroup kendoGridColGroup
2518
+ [columns]="$any(headerLeafColumns)"
2519
+ [groups]="isLocked ? [] : group"
2520
+ [detailTemplate]="detailTemplate">
2521
+ </colgroup>
2522
+ <tfoot kendoGridFooter
2523
+ [logicalRowIndex]="ariaRowCount"
2524
+ [scrollable]="true"
2525
+ [groups]="isLocked ? [] : group"
2526
+ [columns]="$any(headerColumns)"
2527
+ [lockedColumnsCount]="lockedLeafColumns.length"
2528
+ [detailTemplate]="detailTemplate"
2529
+ [totalColumns]="columnsContainer">
2530
+ </tfoot>
2531
+ </table>
2532
+ </div>
2533
+ </div>
2534
+ </ng-container>
2535
+ <ng-container *ngIf="!isScrollable">
2536
+ <table
2537
+ [style.table-layout]="resizable ? 'fixed' : null"
2538
+ kendoGridTable
2539
+ kendoGridResizableTable
2540
+ role="presentation"
2541
+ [size]="size">
2542
+ <colgroup kendoGridColGroup
2543
+ [columns]="$any(leafColumns)"
2544
+ [groups]="group"
2545
+ [detailTemplate]="detailTemplate">
2546
+ </colgroup>
2547
+ <thead kendoGridHeader
2548
+ *ngIf="!hideHeader"
2549
+ [resizable]="resizable"
2550
+ [scrollable]="false"
2551
+ [columns]="$any(visibleColumns)"
2552
+ [totalColumnLevels]="totalColumnLevels"
2553
+ [totalColumns]="columnsContainer"
2554
+ [groups]="group"
2555
+ [groupable]="showGroupPanel"
2556
+ [reorderable]="reorderable"
2557
+ [sort]="sort"
2558
+ [sortable]="sortable"
2559
+ [filter]="filter"
2560
+ [filterable]="filterable"
2561
+ [columnMenu]="columnMenuOptions"
2562
+ [columnMenuTemplate]="columnMenuTemplate"
2563
+ [detailTemplate]="detailTemplate"
2564
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2565
+ </thead>
2566
+ <tbody kendoGridTableBody
2567
+ [isLoading]="loading"
2568
+ [groups]="group"
2569
+ [data]="$any(view)"
2570
+ [skip]="skip"
2571
+ [columns]="$any(leafColumns)"
2572
+ [selectable]="selectable"
2573
+ [filterable]="filterable"
2574
+ [noRecordsTemplate]="noRecordsTemplate"
2575
+ [detailTemplate]="detailTemplate"
2576
+ [showGroupFooters]="showGroupFooters"
2577
+ [trackBy]="trackBy"
2578
+ [rowClass]="rowClass"
2579
+ kendoDraggable
2580
+ kendoGridSelectionMarquee
2581
+ [enableDrag]="marqueeSelection">
2582
+ </tbody>
2583
+ <tfoot kendoGridFooter
2584
+ *ngIf="showFooter"
2585
+ [scrollable]="false"
2586
+ [logicalRowIndex]="ariaRowCount"
2587
+ [groups]="group"
2588
+ [columns]="$any(leafColumns)"
2589
+ [detailTemplate]="detailTemplate"
2590
+ [totalColumns]="columnsContainer">
2591
+ </tfoot>
2592
+ </table>
2593
+ </ng-container>
2594
+ <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
2595
+ </div>
2596
2596
  <kendo-grid-status-bar
2597
2597
  *ngIf="showStatusBar"
2598
2598
  [statusBarTemplate]="statusBarTemplate">
@@ -2969,267 +2969,267 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2969
2969
  <div #ariaRoot
2970
2970
  class="k-grid-aria-root"
2971
2971
  role="grid"
2972
+ kendoDragTargetContainer
2973
+ kendoDropTargetContainer
2974
+ mode="manual"
2975
+ [dragDisabled]="!rowReorderable"
2976
+ [dropDisabled]="!rowReorderable"
2977
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2978
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2979
+ [dragHandle]="getDefaultSelectors('handle')"
2980
+ [hint]="{hintTemplate: defaultHint}"
2981
+ (onPress)="handleReorderEvents($event, 'press')"
2982
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
2983
+ (onDrag)="handleReorderEvents($event, 'drag')"
2984
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2985
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2986
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2987
+ (onDrop)="handleReorderEvents($event, 'drop')"
2988
+ [dragData]="gridData"
2972
2989
  [id]="ariaRootId"
2973
2990
  [attr.aria-label]="ariaLabel"
2974
2991
  [attr.aria-rowcount]="ariaRowCount"
2975
2992
  [attr.aria-colcount]="ariaColCount">
2976
- <ng-container *ngIf="isScrollable">
2977
- <div *ngIf="!hideHeader"
2978
- class="k-grid-header"
2979
- role="presentation"
2980
- [style.padding]="headerPadding">
2981
- <div *ngIf="isLocked"
2982
- #lockedHeader
2993
+ <ng-container *ngIf="isScrollable">
2994
+ <div *ngIf="!hideHeader"
2995
+ class="k-grid-header"
2983
2996
  role="presentation"
2984
- class="k-grid-header-locked"
2985
- [style.width.px]="lockedWidth">
2986
- <table
2987
- kendoGridResizableTable
2988
- [locked]="true"
2997
+ [style.padding]="headerPadding">
2998
+ <div *ngIf="isLocked"
2999
+ #lockedHeader
2989
3000
  role="presentation"
2990
- class="k-grid-header-table"
2991
- [style.width.px]="lockedWidth"
2992
- kendoGridTable
2993
- [size]="size">
2994
- <colgroup kendoGridColGroup
2995
- [columns]="$any(lockedLeafColumns)"
2996
- [groups]="group"
2997
- [detailTemplate]="detailTemplate">
2998
- </colgroup>
2999
- <thead kendoGridHeader
3000
- role="rowgroup"
3001
- [resizable]="resizable"
3002
- [scrollable]="true"
3003
- [columns]="$any(lockedColumns)"
3004
- [totalColumnLevels]="totalColumnLevels"
3005
- [sort]="sort"
3006
- [groups]="group"
3007
- [filter]="filter"
3008
- [filterable]="filterable"
3009
- [groupable]="showGroupPanel"
3010
- [reorderable]="reorderable"
3011
- [sortable]="sortable"
3012
- [columnMenu]="columnMenuOptions"
3013
- [columnMenuTemplate]="columnMenuTemplate"
3014
- [totalColumnsCount]="leafColumns.length"
3015
- [totalColumns]="columnsContainer"
3016
- [detailTemplate]="detailTemplate"
3017
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3018
- </thead>
3019
- </table>
3020
- </div>
3021
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
3022
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3023
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
3024
- <table
3025
- role="presentation"
3026
- class="k-grid-header-table"
3027
- [style.width.px]="nonLockedWidth"
3028
- kendoGridResizableTable
3029
- [virtualColumns]="virtualColumns"
3030
- kendoGridTable
3031
- [size]="size">
3032
- <colgroup kendoGridColGroup
3033
- [columns]="headerLeafColumns"
3034
- [groups]="isLocked ? [] : group"
3035
- [detailTemplate]="detailTemplate">
3036
- </colgroup>
3037
- <thead kendoGridHeader
3038
- [resizable]="resizable"
3039
- role="rowgroup"
3040
- [scrollable]="true"
3041
- [columns]="headerColumns"
3042
- [totalColumnLevels]="totalColumnLevels"
3043
- [sort]="sort"
3044
- [filter]="filter"
3045
- [filterable]="filterable"
3046
- [groupable]="showGroupPanel"
3047
- [reorderable]="reorderable"
3048
- [groups]="isLocked ? [] : group"
3049
- [sortable]="sortable"
3050
- [columnMenu]="columnMenuOptions"
3051
- [columnMenuTemplate]="columnMenuTemplate"
3052
- [lockedColumnsCount]="lockedLeafColumns.length"
3053
- [totalColumnsCount]="leafColumns.length"
3054
- [totalColumns]="columnsContainer"
3055
- [detailTemplate]="detailTemplate"
3056
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3057
- </thead>
3058
- </table>
3059
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
3060
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
3001
+ class="k-grid-header-locked"
3002
+ [style.width.px]="lockedWidth">
3003
+ <table
3004
+ kendoGridResizableTable
3005
+ [locked]="true"
3006
+ role="presentation"
3007
+ class="k-grid-header-table"
3008
+ [style.width.px]="lockedWidth"
3009
+ kendoGridTable
3010
+ [size]="size">
3011
+ <colgroup kendoGridColGroup
3012
+ [columns]="$any(lockedLeafColumns)"
3013
+ [groups]="group"
3014
+ [detailTemplate]="detailTemplate">
3015
+ </colgroup>
3016
+ <thead kendoGridHeader
3017
+ role="rowgroup"
3018
+ [resizable]="resizable"
3019
+ [scrollable]="true"
3020
+ [columns]="$any(lockedColumns)"
3021
+ [totalColumnLevels]="totalColumnLevels"
3022
+ [sort]="sort"
3023
+ [groups]="group"
3024
+ [filter]="filter"
3025
+ [filterable]="filterable"
3026
+ [groupable]="showGroupPanel"
3027
+ [reorderable]="reorderable"
3028
+ [sortable]="sortable"
3029
+ [columnMenu]="columnMenuOptions"
3030
+ [columnMenuTemplate]="columnMenuTemplate"
3031
+ [totalColumnsCount]="leafColumns.length"
3032
+ [totalColumns]="columnsContainer"
3033
+ [detailTemplate]="detailTemplate"
3034
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3035
+ </thead>
3036
+ </table>
3037
+ </div>
3038
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
3039
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3040
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
3041
+ <table
3042
+ role="presentation"
3043
+ class="k-grid-header-table"
3044
+ [style.width.px]="nonLockedWidth"
3045
+ kendoGridResizableTable
3046
+ [virtualColumns]="virtualColumns"
3047
+ kendoGridTable
3048
+ [size]="size">
3049
+ <colgroup kendoGridColGroup
3050
+ [columns]="headerLeafColumns"
3051
+ [groups]="isLocked ? [] : group"
3052
+ [detailTemplate]="detailTemplate">
3053
+ </colgroup>
3054
+ <thead kendoGridHeader
3055
+ [resizable]="resizable"
3056
+ role="rowgroup"
3057
+ [scrollable]="true"
3058
+ [columns]="headerColumns"
3059
+ [totalColumnLevels]="totalColumnLevels"
3060
+ [sort]="sort"
3061
+ [filter]="filter"
3062
+ [filterable]="filterable"
3063
+ [groupable]="showGroupPanel"
3064
+ [reorderable]="reorderable"
3065
+ [groups]="isLocked ? [] : group"
3066
+ [sortable]="sortable"
3067
+ [columnMenu]="columnMenuOptions"
3068
+ [columnMenuTemplate]="columnMenuTemplate"
3069
+ [lockedColumnsCount]="lockedLeafColumns.length"
3070
+ [totalColumnsCount]="leafColumns.length"
3071
+ [totalColumns]="columnsContainer"
3072
+ [detailTemplate]="detailTemplate"
3073
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3074
+ </thead>
3075
+ </table>
3076
+ <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
3077
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
3078
+ </div>
3061
3079
  </div>
3062
3080
  </div>
3063
- </div>
3064
- <kendo-grid-list
3065
- kendoDragTargetContainer
3066
- kendoDropTargetContainer
3067
- mode="manual"
3068
- [dragDisabled]="!rowReorderable"
3069
- [dropDisabled]="!rowReorderable"
3070
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
3071
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
3072
- [dragHandle]="getDefaultSelectors('handle')"
3073
- [hint]="{hintTemplate: defaultHint}"
3074
- (onPress)="handleReorderEvents($event, 'press')"
3075
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
3076
- (onDrag)="handleReorderEvents($event, 'drag')"
3077
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
3078
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
3079
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
3080
- (onDrop)="handleReorderEvents($event, 'drop')"
3081
- [dragData]="gridData"
3082
- [data]="$any(view)"
3083
- [rowHeight]="rowHeight"
3084
- [detailRowHeight]="detailRowHeight"
3085
- [total]="totalCount"
3086
- [take]="pageSize"
3087
- [groups]="group"
3088
- [groupable]="groupable"
3089
- [skip]="skip"
3090
- [trackBy]="trackBy"
3091
- [columns]="columnsContainer"
3092
- [selectable]="selectable"
3093
- [filterable]="filterable"
3094
- [detailTemplate]="detailTemplate"
3095
- [noRecordsTemplate]="noRecordsTemplate"
3096
- [size]="size"
3097
- (pageChange)="notifyPageChange('list', $event)"
3098
- [rowClass]="rowClass"
3099
- [rowSticky]="rowSticky"
3100
- [loading]="loading"
3101
- [isVirtual]="isVirtual"
3102
- [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
3103
- [loadingTemplate]="loadingTemplate?.templateRef"
3104
- [virtualColumns]="virtualColumns"
3105
- (scrollBottom)="notifyScrollBottom()"
3106
- (contentScroll)="contentScroll.emit($event)"
3107
- kendoDraggable
3108
- kendoGridSelectionMarquee
3109
- [enableDrag]="marqueeSelection"
3110
- [sort]="sort">
3111
- </kendo-grid-list>
3112
- <div
3113
- *ngIf="showFooter"
3114
- class="k-grid-footer"
3115
- [style.padding]="headerPadding">
3116
- <div
3117
- *ngIf="lockedLeafColumns.length"
3118
- class="k-grid-footer-locked"
3119
- [style.width.px]="lockedWidth">
3120
- <table
3121
- role="presentation"
3122
- class="k-grid-footer-table"
3123
- kendoGridResizableTable
3124
- [locked]="true"
3125
- [style.width.px]="lockedWidth"
3126
- kendoGridTable
3127
- [size]="size">
3128
- <colgroup kendoGridColGroup
3129
- [columns]="$any(lockedLeafColumns)"
3130
- [groups]="group"
3131
- [detailTemplate]="detailTemplate">
3132
- </colgroup>
3133
- <tfoot kendoGridFooter
3134
- [scrollable]="true"
3135
- [groups]="group"
3136
- [columns]="$any(lockedLeafColumns)"
3137
- [detailTemplate]="detailTemplate"
3138
- [logicalRowIndex]="ariaRowCount"
3139
- [totalColumns]="columnsContainer">
3140
- </tfoot>
3141
- </table>
3142
- </div>
3143
- <div #footer
3144
- class="k-grid-footer-wrap" data-scrollable
3145
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3146
- [lockedWidth]="lockedWidth + scrollbarWidth + 3">
3147
- <table
3148
- role="presentation"
3149
- class="k-grid-footer-table"
3150
- [style.width.px]="nonLockedWidth"
3151
- kendoGridTable
3152
- kendoGridResizableTable
3153
- [size]="size">
3154
- <colgroup kendoGridColGroup
3155
- [columns]="$any(headerLeafColumns)"
3156
- [groups]="isLocked ? [] : group"
3157
- [detailTemplate]="detailTemplate">
3158
- </colgroup>
3159
- <tfoot kendoGridFooter
3160
- [logicalRowIndex]="ariaRowCount"
3161
- [scrollable]="true"
3162
- [groups]="isLocked ? [] : group"
3163
- [columns]="$any(headerColumns)"
3164
- [lockedColumnsCount]="lockedLeafColumns.length"
3165
- [detailTemplate]="detailTemplate"
3166
- [totalColumns]="columnsContainer">
3167
- </tfoot>
3168
- </table>
3169
- </div>
3170
- </div>
3171
- </ng-container>
3172
- <ng-container *ngIf="!isScrollable">
3173
- <table
3174
- [style.table-layout]="resizable ? 'fixed' : null"
3175
- kendoGridTable
3176
- kendoGridResizableTable
3177
- role="presentation"
3178
- [size]="size">
3179
- <colgroup kendoGridColGroup
3180
- [columns]="$any(leafColumns)"
3181
- [groups]="group"
3182
- [detailTemplate]="detailTemplate">
3183
- </colgroup>
3184
- <thead kendoGridHeader
3185
- *ngIf="!hideHeader"
3186
- [resizable]="resizable"
3187
- [scrollable]="false"
3188
- [columns]="$any(visibleColumns)"
3189
- [totalColumnLevels]="totalColumnLevels"
3190
- [totalColumns]="columnsContainer"
3191
- [groups]="group"
3192
- [groupable]="showGroupPanel"
3193
- [reorderable]="reorderable"
3194
- [sort]="sort"
3195
- [sortable]="sortable"
3196
- [filter]="filter"
3197
- [filterable]="filterable"
3198
- [columnMenu]="columnMenuOptions"
3199
- [columnMenuTemplate]="columnMenuTemplate"
3200
- [detailTemplate]="detailTemplate"
3201
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3202
- </thead>
3203
- <tbody kendoGridTableBody
3204
- [isLoading]="loading"
3205
- [groups]="group"
3081
+ <kendo-grid-list
3206
3082
  [data]="$any(view)"
3083
+ [rowHeight]="rowHeight"
3084
+ [detailRowHeight]="detailRowHeight"
3085
+ [total]="totalCount"
3086
+ [take]="pageSize"
3087
+ [groups]="group"
3088
+ [groupable]="groupable"
3207
3089
  [skip]="skip"
3208
- [columns]="$any(leafColumns)"
3090
+ [trackBy]="trackBy"
3091
+ [columns]="columnsContainer"
3209
3092
  [selectable]="selectable"
3210
3093
  [filterable]="filterable"
3211
- [noRecordsTemplate]="noRecordsTemplate"
3212
3094
  [detailTemplate]="detailTemplate"
3213
- [showGroupFooters]="showGroupFooters"
3214
- [trackBy]="trackBy"
3095
+ [noRecordsTemplate]="noRecordsTemplate"
3096
+ [size]="size"
3097
+ (pageChange)="notifyPageChange('list', $event)"
3215
3098
  [rowClass]="rowClass"
3099
+ [rowSticky]="rowSticky"
3100
+ [loading]="loading"
3101
+ [isVirtual]="isVirtual"
3102
+ [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
3103
+ [loadingTemplate]="loadingTemplate?.templateRef"
3104
+ [virtualColumns]="virtualColumns"
3105
+ (scrollBottom)="notifyScrollBottom()"
3106
+ (contentScroll)="contentScroll.emit($event)"
3216
3107
  kendoDraggable
3217
3108
  kendoGridSelectionMarquee
3218
- [enableDrag]="marqueeSelection">
3219
- </tbody>
3220
- <tfoot kendoGridFooter
3109
+ [enableDrag]="marqueeSelection"
3110
+ [sort]="sort">
3111
+ </kendo-grid-list>
3112
+ <div
3221
3113
  *ngIf="showFooter"
3222
- [scrollable]="false"
3223
- [logicalRowIndex]="ariaRowCount"
3224
- [groups]="group"
3225
- [columns]="$any(leafColumns)"
3226
- [detailTemplate]="detailTemplate"
3227
- [totalColumns]="columnsContainer">
3228
- </tfoot>
3229
- </table>
3230
- </ng-container>
3231
- <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
3232
- </div>
3114
+ class="k-grid-footer"
3115
+ [style.padding]="headerPadding">
3116
+ <div
3117
+ *ngIf="lockedLeafColumns.length"
3118
+ class="k-grid-footer-locked"
3119
+ [style.width.px]="lockedWidth">
3120
+ <table
3121
+ role="presentation"
3122
+ class="k-grid-footer-table"
3123
+ kendoGridResizableTable
3124
+ [locked]="true"
3125
+ [style.width.px]="lockedWidth"
3126
+ kendoGridTable
3127
+ [size]="size">
3128
+ <colgroup kendoGridColGroup
3129
+ [columns]="$any(lockedLeafColumns)"
3130
+ [groups]="group"
3131
+ [detailTemplate]="detailTemplate">
3132
+ </colgroup>
3133
+ <tfoot kendoGridFooter
3134
+ [scrollable]="true"
3135
+ [groups]="group"
3136
+ [columns]="$any(lockedLeafColumns)"
3137
+ [detailTemplate]="detailTemplate"
3138
+ [logicalRowIndex]="ariaRowCount"
3139
+ [totalColumns]="columnsContainer">
3140
+ </tfoot>
3141
+ </table>
3142
+ </div>
3143
+ <div #footer
3144
+ class="k-grid-footer-wrap" data-scrollable
3145
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3146
+ [lockedWidth]="lockedWidth + scrollbarWidth + 3">
3147
+ <table
3148
+ role="presentation"
3149
+ class="k-grid-footer-table"
3150
+ [style.width.px]="nonLockedWidth"
3151
+ kendoGridTable
3152
+ kendoGridResizableTable
3153
+ [size]="size">
3154
+ <colgroup kendoGridColGroup
3155
+ [columns]="$any(headerLeafColumns)"
3156
+ [groups]="isLocked ? [] : group"
3157
+ [detailTemplate]="detailTemplate">
3158
+ </colgroup>
3159
+ <tfoot kendoGridFooter
3160
+ [logicalRowIndex]="ariaRowCount"
3161
+ [scrollable]="true"
3162
+ [groups]="isLocked ? [] : group"
3163
+ [columns]="$any(headerColumns)"
3164
+ [lockedColumnsCount]="lockedLeafColumns.length"
3165
+ [detailTemplate]="detailTemplate"
3166
+ [totalColumns]="columnsContainer">
3167
+ </tfoot>
3168
+ </table>
3169
+ </div>
3170
+ </div>
3171
+ </ng-container>
3172
+ <ng-container *ngIf="!isScrollable">
3173
+ <table
3174
+ [style.table-layout]="resizable ? 'fixed' : null"
3175
+ kendoGridTable
3176
+ kendoGridResizableTable
3177
+ role="presentation"
3178
+ [size]="size">
3179
+ <colgroup kendoGridColGroup
3180
+ [columns]="$any(leafColumns)"
3181
+ [groups]="group"
3182
+ [detailTemplate]="detailTemplate">
3183
+ </colgroup>
3184
+ <thead kendoGridHeader
3185
+ *ngIf="!hideHeader"
3186
+ [resizable]="resizable"
3187
+ [scrollable]="false"
3188
+ [columns]="$any(visibleColumns)"
3189
+ [totalColumnLevels]="totalColumnLevels"
3190
+ [totalColumns]="columnsContainer"
3191
+ [groups]="group"
3192
+ [groupable]="showGroupPanel"
3193
+ [reorderable]="reorderable"
3194
+ [sort]="sort"
3195
+ [sortable]="sortable"
3196
+ [filter]="filter"
3197
+ [filterable]="filterable"
3198
+ [columnMenu]="columnMenuOptions"
3199
+ [columnMenuTemplate]="columnMenuTemplate"
3200
+ [detailTemplate]="detailTemplate"
3201
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3202
+ </thead>
3203
+ <tbody kendoGridTableBody
3204
+ [isLoading]="loading"
3205
+ [groups]="group"
3206
+ [data]="$any(view)"
3207
+ [skip]="skip"
3208
+ [columns]="$any(leafColumns)"
3209
+ [selectable]="selectable"
3210
+ [filterable]="filterable"
3211
+ [noRecordsTemplate]="noRecordsTemplate"
3212
+ [detailTemplate]="detailTemplate"
3213
+ [showGroupFooters]="showGroupFooters"
3214
+ [trackBy]="trackBy"
3215
+ [rowClass]="rowClass"
3216
+ kendoDraggable
3217
+ kendoGridSelectionMarquee
3218
+ [enableDrag]="marqueeSelection">
3219
+ </tbody>
3220
+ <tfoot kendoGridFooter
3221
+ *ngIf="showFooter"
3222
+ [scrollable]="false"
3223
+ [logicalRowIndex]="ariaRowCount"
3224
+ [groups]="group"
3225
+ [columns]="$any(leafColumns)"
3226
+ [detailTemplate]="detailTemplate"
3227
+ [totalColumns]="columnsContainer">
3228
+ </tfoot>
3229
+ </table>
3230
+ </ng-container>
3231
+ <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
3232
+ </div>
3233
3233
  <kendo-grid-status-bar
3234
3234
  *ngIf="showStatusBar"
3235
3235
  [statusBarTemplate]="statusBarTemplate">