@progress/kendo-angular-grid 13.0.0-develop.13 → 13.0.0-develop.15

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.
@@ -75,6 +75,7 @@ import { SizingOptionsService } from './layout/sizing-options.service';
75
75
  import { guid } from '@progress/kendo-angular-common';
76
76
  import { DragTargetContainerDirective, DropTargetContainerDirective } from '@progress/kendo-angular-utils';
77
77
  import { RowReorderService } from './row-reordering/row-reorder.service';
78
+ import { StatusBarTemplateDirective } from './aggregates/status-bar-template.directive';
78
79
  import * as i0 from "@angular/core";
79
80
  import * as i1 from "./layout/browser-support.service";
80
81
  import * as i2 from "./selection/selection.service";
@@ -109,15 +110,16 @@ import * as i30 from "./rendering/list.component";
109
110
  import * as i31 from "./rendering/footer/footer.component";
110
111
  import * as i32 from "./rendering/table-body.component";
111
112
  import * as i33 from "./rendering/common/loading.component";
112
- import * as i34 from "@progress/kendo-angular-icons";
113
- import * as i35 from "./localization/localized-messages.directive";
114
- import * as i36 from "@angular/common";
115
- import * as i37 from "./column-resizing/table.directive";
116
- import * as i38 from "./rendering/grid-table.directive";
117
- import * as i39 from "./layout/resizable.directive";
118
- import * as i40 from "@progress/kendo-angular-utils";
119
- import * as i41 from "@progress/kendo-angular-common";
120
- import * as i42 from "./selection/marquee.directive";
113
+ import * as i34 from "./aggregates/status-bar.component";
114
+ import * as i35 from "@progress/kendo-angular-icons";
115
+ import * as i36 from "./localization/localized-messages.directive";
116
+ import * as i37 from "@angular/common";
117
+ import * as i38 from "./column-resizing/table.directive";
118
+ import * as i39 from "./rendering/grid-table.directive";
119
+ import * as i40 from "./layout/resizable.directive";
120
+ import * as i41 from "@progress/kendo-angular-utils";
121
+ import * as i42 from "@progress/kendo-angular-common";
122
+ import * as i43 from "./selection/marquee.directive";
121
123
  const createControl = (source) => (acc, key) => {
122
124
  acc[key] = new FormControl(source[key]);
123
125
  return acc;
@@ -509,6 +511,12 @@ export class GridComponent {
509
511
  get group() {
510
512
  return this._group;
511
513
  }
514
+ /**
515
+ * @hidden
516
+ */
517
+ get showStatusBar() {
518
+ return !!(this.selectable);
519
+ }
512
520
  /**
513
521
  * @hidden
514
522
  */
@@ -742,6 +750,15 @@ export class GridComponent {
742
750
  set loadingTemplate(loadingTemplate) {
743
751
  this._loadingTemplate = loadingTemplate;
744
752
  }
753
+ get statusBarTemplate() {
754
+ if (this._statusBarTemplate) {
755
+ return this._statusBarTemplate;
756
+ }
757
+ return this.statusBarTemplateChildren ? this.statusBarTemplateChildren.first : undefined;
758
+ }
759
+ set statusBarTemplate(statusBarTemplate) {
760
+ this._statusBarTemplate = statusBarTemplate;
761
+ }
745
762
  get noRecordsTemplate() {
746
763
  if (this._customNoRecordsTemplate) {
747
764
  return this._customNoRecordsTemplate;
@@ -2003,7 +2020,7 @@ GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
2003
2020
  ContextService,
2004
2021
  SizingOptionsService,
2005
2022
  RowReorderService
2006
- ], queries: [{ propertyName: "columns", predicate: ColumnBase }, { propertyName: "detailTemplateChildren", predicate: DetailTemplateDirective }, { propertyName: "cellLoadingTemplateChildren", predicate: CellLoadingTemplateDirective }, { propertyName: "loadingTemplateChildren", predicate: LoadingTemplateDirective }, { propertyName: "noRecordsTemplateChildren", predicate: NoRecordsTemplateDirective }, { propertyName: "pagerTemplateChildren", predicate: PagerTemplateDirective }, { propertyName: "toolbarTemplateChildren", predicate: ToolbarTemplateDirective }, { propertyName: "columnMenuTemplates", predicate: ColumnMenuTemplateDirective }], viewQueries: [{ propertyName: "lockedHeader", first: true, predicate: ["lockedHeader"], descendants: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "ariaRoot", first: true, predicate: ["ariaRoot"], descendants: true, static: true }, { propertyName: "dragTargetContainer", first: true, predicate: DragTargetContainerDirective, descendants: true }, { propertyName: "dropTargetContainer", first: true, predicate: DropTargetContainerDirective, descendants: true }, { propertyName: "footer", predicate: ["footer"], descendants: true }], exportAs: ["kendoGrid"], usesOnChanges: true, ngImport: i0, template: `
2023
+ ], queries: [{ propertyName: "columns", predicate: ColumnBase }, { propertyName: "detailTemplateChildren", predicate: DetailTemplateDirective }, { propertyName: "cellLoadingTemplateChildren", predicate: CellLoadingTemplateDirective }, { propertyName: "loadingTemplateChildren", predicate: LoadingTemplateDirective }, { propertyName: "statusBarTemplateChildren", predicate: StatusBarTemplateDirective }, { propertyName: "noRecordsTemplateChildren", predicate: NoRecordsTemplateDirective }, { propertyName: "pagerTemplateChildren", predicate: PagerTemplateDirective }, { propertyName: "toolbarTemplateChildren", predicate: ToolbarTemplateDirective }, { propertyName: "columnMenuTemplates", predicate: ColumnMenuTemplateDirective }], viewQueries: [{ propertyName: "lockedHeader", first: true, predicate: ["lockedHeader"], descendants: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "ariaRoot", first: true, predicate: ["ariaRoot"], descendants: true, static: true }, { propertyName: "dragTargetContainer", first: true, predicate: DragTargetContainerDirective, descendants: true }, { propertyName: "dropTargetContainer", first: true, predicate: DropTargetContainerDirective, descendants: true }, { propertyName: "footer", predicate: ["footer"], descendants: true }], exportAs: ["kendoGrid"], usesOnChanges: true, ngImport: i0, template: `
2007
2024
  <ng-container kendoGridLocalizedMessages
2008
2025
  i18n-groupPanelEmpty="kendo.grid.groupPanelEmpty|The label visible in the Grid group panel when it is empty"
2009
2026
  groupPanelEmpty="Drag a column header and drop it here to group by that column"
@@ -2251,285 +2268,288 @@ GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
2251
2268
  [navigable]="navigation.toolbarEnabled"
2252
2269
  [attr.aria-controls]="ariaRootId"
2253
2270
  position="top"></kendo-grid-toolbar>
2254
- <kendo-pager
2255
- *ngIf="showTopPager"
2256
- [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
2257
- [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
2258
- class="k-grid-pager-top k-pager"
2259
- [template]="pagerTemplate"
2260
- [pageSize]="pageSize"
2261
- [total]="view.total"
2262
- [skip]="skip"
2263
- [size]="size"
2264
- [options]="pageable"
2265
- (pageChange)="notifyPageChange('pager', $event)">
2266
- </kendo-pager>
2267
- <kendo-grid-group-panel
2268
- *ngIf="showGroupPanel"
2269
- [navigable]="navigation.toolbarEnabled"
2270
- [text]="groupableEmptyText"
2271
- [groups]="group"
2272
- role="toolbar"
2273
- [attr.aria-label]="messageFor('groupPanelLabel')"
2274
- [attr.aria-controls]="ariaRootId"
2275
- (change)="groupChange.emit($event)">
2276
- </kendo-grid-group-panel>
2277
- <div #ariaRoot
2278
- class="k-grid-aria-root"
2279
- role="grid"
2280
- [id]="ariaRootId"
2281
- [attr.aria-label]="ariaLabel"
2282
- [attr.aria-rowcount]="ariaRowCount"
2283
- [attr.aria-colcount]="ariaColCount">
2284
- <ng-container *ngIf="isScrollable">
2285
- <div *ngIf="!hideHeader"
2286
- class="k-grid-header"
2287
- role="presentation"
2288
- [style.padding]="headerPadding">
2289
- <div *ngIf="isLocked"
2290
- #lockedHeader
2291
- role="presentation"
2292
- class="k-grid-header-locked"
2293
- [style.width.px]="lockedWidth">
2294
- <table
2295
- [locked]="true"
2271
+ <kendo-pager
2272
+ *ngIf="showTopPager"
2273
+ [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
2274
+ [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
2275
+ class="k-grid-pager-top k-pager"
2276
+ [template]="pagerTemplate"
2277
+ [pageSize]="pageSize"
2278
+ [total]="view.total"
2279
+ [skip]="skip"
2280
+ [size]="size"
2281
+ [options]="pageable"
2282
+ (pageChange)="notifyPageChange('pager', $event)">
2283
+ </kendo-pager>
2284
+ <kendo-grid-group-panel
2285
+ *ngIf="showGroupPanel"
2286
+ [navigable]="navigation.toolbarEnabled"
2287
+ [text]="groupableEmptyText"
2288
+ [groups]="group"
2289
+ role="toolbar"
2290
+ [attr.aria-label]="messageFor('groupPanelLabel')"
2291
+ [attr.aria-controls]="ariaRootId"
2292
+ (change)="groupChange.emit($event)">
2293
+ </kendo-grid-group-panel>
2294
+ <div #ariaRoot
2295
+ class="k-grid-aria-root"
2296
+ role="grid"
2297
+ [id]="ariaRootId"
2298
+ [attr.aria-label]="ariaLabel"
2299
+ [attr.aria-rowcount]="ariaRowCount"
2300
+ [attr.aria-colcount]="ariaColCount">
2301
+ <ng-container *ngIf="isScrollable">
2302
+ <div *ngIf="!hideHeader"
2303
+ class="k-grid-header"
2304
+ role="presentation"
2305
+ [style.padding]="headerPadding">
2306
+ <div *ngIf="isLocked"
2307
+ #lockedHeader
2296
2308
  role="presentation"
2297
- class="k-grid-header-table"
2298
- [style.width.px]="lockedWidth"
2299
- kendoGridTable
2300
- [size]="size">
2301
- <colgroup kendoGridColGroup
2309
+ class="k-grid-header-locked"
2310
+ [style.width.px]="lockedWidth">
2311
+ <table
2312
+ [locked]="true"
2302
2313
  role="presentation"
2303
- [columns]="$any(lockedLeafColumns)"
2304
- [groups]="group"
2305
- [detailTemplate]="detailTemplate">
2306
- </colgroup>
2307
- <thead kendoGridHeader
2308
- role="rowgroup"
2309
- [resizable]="resizable"
2310
- [scrollable]="true"
2311
- [columns]="$any(lockedColumns)"
2312
- [totalColumnLevels]="totalColumnLevels"
2313
- [sort]="sort"
2314
- [groups]="group"
2315
- [filter]="filter"
2316
- [filterable]="filterable"
2317
- [groupable]="showGroupPanel"
2318
- [reorderable]="reorderable"
2319
- [sortable]="sortable"
2320
- [columnMenu]="columnMenuOptions"
2321
- [columnMenuTemplate]="columnMenuTemplate"
2322
- [totalColumnsCount]="leafColumns.length"
2323
- [detailTemplate]="detailTemplate"
2324
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2325
- </thead>
2326
- </table>
2327
- </div>
2328
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2329
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2330
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2331
- <table
2332
- role="presentation"
2333
- class="k-grid-header-table"
2334
- [style.width.px]="nonLockedWidth"
2335
- [virtualColumns]="virtualColumns"
2336
- kendoGridTable
2337
- [size]="size">
2338
- <colgroup kendoGridColGroup
2314
+ class="k-grid-header-table"
2315
+ [style.width.px]="lockedWidth"
2316
+ kendoGridTable
2317
+ [size]="size">
2318
+ <colgroup kendoGridColGroup
2319
+ role="presentation"
2320
+ [columns]="$any(lockedLeafColumns)"
2321
+ [groups]="group"
2322
+ [detailTemplate]="detailTemplate">
2323
+ </colgroup>
2324
+ <thead kendoGridHeader
2325
+ role="rowgroup"
2326
+ [resizable]="resizable"
2327
+ [scrollable]="true"
2328
+ [columns]="$any(lockedColumns)"
2329
+ [totalColumnLevels]="totalColumnLevels"
2330
+ [sort]="sort"
2331
+ [groups]="group"
2332
+ [filter]="filter"
2333
+ [filterable]="filterable"
2334
+ [groupable]="showGroupPanel"
2335
+ [reorderable]="reorderable"
2336
+ [sortable]="sortable"
2337
+ [columnMenu]="columnMenuOptions"
2338
+ [columnMenuTemplate]="columnMenuTemplate"
2339
+ [totalColumnsCount]="leafColumns.length"
2340
+ [detailTemplate]="detailTemplate"
2341
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2342
+ </thead>
2343
+ </table>
2344
+ </div>
2345
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2346
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2347
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2348
+ <table
2339
2349
  role="presentation"
2340
- [columns]="headerLeafColumns"
2341
- [groups]="isLocked ? [] : group"
2342
- [detailTemplate]="detailTemplate">
2343
- </colgroup>
2344
- <thead kendoGridHeader
2345
- [resizable]="resizable"
2346
- role="rowgroup"
2347
- [scrollable]="true"
2348
- [columns]="headerColumns"
2349
- [totalColumnLevels]="totalColumnLevels"
2350
- [sort]="sort"
2351
- [filter]="filter"
2352
- [filterable]="filterable"
2353
- [groupable]="showGroupPanel"
2354
- [reorderable]="reorderable"
2355
- [groups]="isLocked ? [] : group"
2356
- [sortable]="sortable"
2357
- [columnMenu]="columnMenuOptions"
2358
- [columnMenuTemplate]="columnMenuTemplate"
2359
- [lockedColumnsCount]="lockedLeafColumns.length"
2360
- [totalColumnsCount]="leafColumns.length"
2361
- [detailTemplate]="detailTemplate"
2362
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2363
- </thead>
2364
- </table>
2365
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2366
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2350
+ class="k-grid-header-table"
2351
+ [style.width.px]="nonLockedWidth"
2352
+ [virtualColumns]="virtualColumns"
2353
+ kendoGridTable
2354
+ [size]="size">
2355
+ <colgroup kendoGridColGroup
2356
+ role="presentation"
2357
+ [columns]="headerLeafColumns"
2358
+ [groups]="isLocked ? [] : group"
2359
+ [detailTemplate]="detailTemplate">
2360
+ </colgroup>
2361
+ <thead kendoGridHeader
2362
+ [resizable]="resizable"
2363
+ role="rowgroup"
2364
+ [scrollable]="true"
2365
+ [columns]="headerColumns"
2366
+ [totalColumnLevels]="totalColumnLevels"
2367
+ [sort]="sort"
2368
+ [filter]="filter"
2369
+ [filterable]="filterable"
2370
+ [groupable]="showGroupPanel"
2371
+ [reorderable]="reorderable"
2372
+ [groups]="isLocked ? [] : group"
2373
+ [sortable]="sortable"
2374
+ [columnMenu]="columnMenuOptions"
2375
+ [columnMenuTemplate]="columnMenuTemplate"
2376
+ [lockedColumnsCount]="lockedLeafColumns.length"
2377
+ [totalColumnsCount]="leafColumns.length"
2378
+ [detailTemplate]="detailTemplate"
2379
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2380
+ </thead>
2381
+ </table>
2382
+ <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2383
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2384
+ </div>
2367
2385
  </div>
2368
2386
  </div>
2369
- </div>
2370
- <kendo-grid-list
2371
- kendoDragTargetContainer
2372
- kendoDropTargetContainer
2373
- mode="manual"
2374
- [dragDisabled]="!rowReorderable"
2375
- [dropDisabled]="!rowReorderable"
2376
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2377
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2378
- [dragHandle]="getDefaultSelectors('handle')"
2379
- [hint]="{hintTemplate: defaultHint}"
2380
- (onPress)="handleReorderEvents($event, 'press')"
2381
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
2382
- (onDrag)="handleReorderEvents($event, 'drag')"
2383
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2384
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2385
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2386
- (onDrop)="handleReorderEvents($event, 'drop')"
2387
- [dragData]="gridData"
2388
- [data]="$any(view)"
2389
- [rowHeight]="rowHeight"
2390
- [detailRowHeight]="detailRowHeight"
2391
- [total]="totalCount"
2392
- [take]="pageSize"
2393
- [groups]="group"
2394
- [groupable]="groupable"
2395
- [skip]="skip"
2396
- [trackBy]="trackBy"
2397
- [columns]="columnsContainer"
2398
- [selectable]="selectable"
2399
- [filterable]="filterable"
2400
- [detailTemplate]="detailTemplate"
2401
- [noRecordsTemplate]="noRecordsTemplate"
2402
- [size]="size"
2403
- (pageChange)="notifyPageChange('list', $event)"
2404
- [rowClass]="rowClass"
2405
- [rowSticky]="rowSticky"
2406
- [loading]="loading"
2407
- [isVirtual]="isVirtual"
2408
- [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
2409
- [loadingTemplate]="loadingTemplate?.templateRef"
2410
- [virtualColumns]="virtualColumns"
2411
- (scrollBottom)="notifyScrollBottom()"
2412
- (contentScroll)="contentScroll.emit($event)"
2413
- kendoDraggable
2414
- kendoGridSelectionMarquee
2415
- [enableDrag]="marqueeSelection"
2416
- [sort]="sort"
2417
- >
2418
- </kendo-grid-list>
2419
- <div
2420
- *ngIf="showFooter"
2421
- class="k-grid-footer"
2422
- [style.padding]="headerPadding">
2423
- <div
2424
- *ngIf="lockedLeafColumns.length"
2425
- class="k-grid-footer-locked"
2426
- [style.width.px]="lockedWidth">
2427
- <table
2428
- role="presentation"
2429
- class="k-grid-footer-table"
2430
- [locked]="true"
2431
- [style.width.px]="lockedWidth"
2432
- kendoGridTable
2433
- [size]="size">
2434
- <colgroup kendoGridColGroup
2435
- [columns]="$any(lockedLeafColumns)"
2436
- [groups]="group"
2437
- [detailTemplate]="detailTemplate">
2438
- </colgroup>
2439
- <tfoot kendoGridFooter
2440
- [scrollable]="true"
2441
- [groups]="group"
2442
- [columns]="$any(lockedLeafColumns)"
2443
- [detailTemplate]="detailTemplate"
2444
- [logicalRowIndex]="ariaRowCount">
2445
- </tfoot>
2446
- </table>
2447
- </div>
2448
- <div #footer
2449
- class="k-grid-footer-wrap" data-scrollable
2450
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2451
- [lockedWidth]="lockedWidth + scrollbarWidth + 3">
2452
- <table
2453
- role="presentation"
2454
- class="k-grid-footer-table"
2455
- [style.width.px]="nonLockedWidth"
2456
- kendoGridTable
2457
- [size]="size">
2458
- <colgroup kendoGridColGroup
2459
- [columns]="$any(nonLockedLeafColumns)"
2460
- [groups]="isLocked ? [] : group"
2461
- [detailTemplate]="detailTemplate">
2462
- </colgroup>
2463
- <tfoot kendoGridFooter
2464
- [logicalRowIndex]="ariaRowCount"
2465
- [scrollable]="true"
2466
- [groups]="isLocked ? [] : group"
2467
- [columns]="$any(nonLockedLeafColumns)"
2468
- [lockedColumnsCount]="lockedLeafColumns.length"
2469
- [detailTemplate]="detailTemplate">
2470
- </tfoot>
2471
- </table>
2472
- </div>
2473
- </div>
2474
- </ng-container>
2475
- <ng-container *ngIf="!isScrollable">
2476
- <table
2477
- [style.table-layout]="resizable ? 'fixed' : null"
2478
- kendoGridTable
2479
- [size]="size">
2480
- <colgroup kendoGridColGroup
2481
- [columns]="$any(leafColumns)"
2482
- [groups]="group"
2483
- [detailTemplate]="detailTemplate">
2484
- </colgroup>
2485
- <thead kendoGridHeader
2486
- *ngIf="!hideHeader"
2487
- [resizable]="resizable"
2488
- [scrollable]="false"
2489
- [columns]="$any(visibleColumns)"
2490
- [totalColumnLevels]="totalColumnLevels"
2491
- [groups]="group"
2492
- [groupable]="showGroupPanel"
2493
- [reorderable]="reorderable"
2494
- [sort]="sort"
2495
- [sortable]="sortable"
2496
- [filter]="filter"
2497
- [filterable]="filterable"
2498
- [columnMenu]="columnMenuOptions"
2499
- [columnMenuTemplate]="columnMenuTemplate"
2500
- [detailTemplate]="detailTemplate"
2501
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2502
- </thead>
2503
- <tbody kendoGridTableBody
2504
- [isLoading]="loading"
2505
- [groups]="group"
2387
+ <kendo-grid-list
2388
+ kendoDragTargetContainer
2389
+ kendoDropTargetContainer
2390
+ mode="manual"
2391
+ [dragDisabled]="!rowReorderable"
2392
+ [dropDisabled]="!rowReorderable"
2393
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2394
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2395
+ [dragHandle]="getDefaultSelectors('handle')"
2396
+ [hint]="{hintTemplate: defaultHint}"
2397
+ (onPress)="handleReorderEvents($event, 'press')"
2398
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
2399
+ (onDrag)="handleReorderEvents($event, 'drag')"
2400
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2401
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2402
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2403
+ (onDrop)="handleReorderEvents($event, 'drop')"
2404
+ [dragData]="gridData"
2506
2405
  [data]="$any(view)"
2406
+ [rowHeight]="rowHeight"
2407
+ [detailRowHeight]="detailRowHeight"
2408
+ [total]="totalCount"
2409
+ [take]="pageSize"
2410
+ [groups]="group"
2411
+ [groupable]="groupable"
2507
2412
  [skip]="skip"
2508
- [columns]="$any(leafColumns)"
2413
+ [trackBy]="trackBy"
2414
+ [columns]="columnsContainer"
2509
2415
  [selectable]="selectable"
2510
2416
  [filterable]="filterable"
2511
- [noRecordsTemplate]="noRecordsTemplate"
2512
2417
  [detailTemplate]="detailTemplate"
2513
- [showGroupFooters]="showGroupFooters"
2514
- [trackBy]="trackBy"
2418
+ [noRecordsTemplate]="noRecordsTemplate"
2419
+ [size]="size"
2420
+ (pageChange)="notifyPageChange('list', $event)"
2515
2421
  [rowClass]="rowClass"
2422
+ [rowSticky]="rowSticky"
2423
+ [loading]="loading"
2424
+ [isVirtual]="isVirtual"
2425
+ [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
2426
+ [loadingTemplate]="loadingTemplate?.templateRef"
2427
+ [virtualColumns]="virtualColumns"
2428
+ (scrollBottom)="notifyScrollBottom()"
2429
+ (contentScroll)="contentScroll.emit($event)"
2516
2430
  kendoDraggable
2517
2431
  kendoGridSelectionMarquee
2518
- [enableDrag]="marqueeSelection">
2519
- </tbody>
2520
- <tfoot kendoGridFooter
2432
+ [enableDrag]="marqueeSelection"
2433
+ [sort]="sort">
2434
+ </kendo-grid-list>
2435
+ <div
2521
2436
  *ngIf="showFooter"
2522
- [scrollable]="false"
2523
- [logicalRowIndex]="ariaRowCount"
2524
- [groups]="group"
2525
- [columns]="$any(leafColumns)"
2526
- [detailTemplate]="detailTemplate">
2527
- </tfoot>
2528
- </table>
2529
- </ng-container>
2530
- <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading>
2531
- </div>
2437
+ class="k-grid-footer"
2438
+ [style.padding]="headerPadding">
2439
+ <div
2440
+ *ngIf="lockedLeafColumns.length"
2441
+ class="k-grid-footer-locked"
2442
+ [style.width.px]="lockedWidth">
2443
+ <table
2444
+ role="presentation"
2445
+ class="k-grid-footer-table"
2446
+ [locked]="true"
2447
+ [style.width.px]="lockedWidth"
2448
+ kendoGridTable
2449
+ [size]="size">
2450
+ <colgroup kendoGridColGroup
2451
+ [columns]="$any(lockedLeafColumns)"
2452
+ [groups]="group"
2453
+ [detailTemplate]="detailTemplate">
2454
+ </colgroup>
2455
+ <tfoot kendoGridFooter
2456
+ [scrollable]="true"
2457
+ [groups]="group"
2458
+ [columns]="$any(lockedLeafColumns)"
2459
+ [detailTemplate]="detailTemplate"
2460
+ [logicalRowIndex]="ariaRowCount">
2461
+ </tfoot>
2462
+ </table>
2463
+ </div>
2464
+ <div #footer
2465
+ class="k-grid-footer-wrap" data-scrollable
2466
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2467
+ [lockedWidth]="lockedWidth + scrollbarWidth + 3">
2468
+ <table
2469
+ role="presentation"
2470
+ class="k-grid-footer-table"
2471
+ [style.width.px]="nonLockedWidth"
2472
+ kendoGridTable
2473
+ [size]="size">
2474
+ <colgroup kendoGridColGroup
2475
+ [columns]="$any(nonLockedLeafColumns)"
2476
+ [groups]="isLocked ? [] : group"
2477
+ [detailTemplate]="detailTemplate">
2478
+ </colgroup>
2479
+ <tfoot kendoGridFooter
2480
+ [logicalRowIndex]="ariaRowCount"
2481
+ [scrollable]="true"
2482
+ [groups]="isLocked ? [] : group"
2483
+ [columns]="$any(nonLockedLeafColumns)"
2484
+ [lockedColumnsCount]="lockedLeafColumns.length"
2485
+ [detailTemplate]="detailTemplate">
2486
+ </tfoot>
2487
+ </table>
2488
+ </div>
2489
+ </div>
2490
+ </ng-container>
2491
+ <ng-container *ngIf="!isScrollable">
2492
+ <table
2493
+ [style.table-layout]="resizable ? 'fixed' : null"
2494
+ kendoGridTable
2495
+ [size]="size">
2496
+ <colgroup kendoGridColGroup
2497
+ [columns]="$any(leafColumns)"
2498
+ [groups]="group"
2499
+ [detailTemplate]="detailTemplate">
2500
+ </colgroup>
2501
+ <thead kendoGridHeader
2502
+ *ngIf="!hideHeader"
2503
+ [resizable]="resizable"
2504
+ [scrollable]="false"
2505
+ [columns]="$any(visibleColumns)"
2506
+ [totalColumnLevels]="totalColumnLevels"
2507
+ [groups]="group"
2508
+ [groupable]="showGroupPanel"
2509
+ [reorderable]="reorderable"
2510
+ [sort]="sort"
2511
+ [sortable]="sortable"
2512
+ [filter]="filter"
2513
+ [filterable]="filterable"
2514
+ [columnMenu]="columnMenuOptions"
2515
+ [columnMenuTemplate]="columnMenuTemplate"
2516
+ [detailTemplate]="detailTemplate"
2517
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2518
+ </thead>
2519
+ <tbody kendoGridTableBody
2520
+ [isLoading]="loading"
2521
+ [groups]="group"
2522
+ [data]="$any(view)"
2523
+ [skip]="skip"
2524
+ [columns]="$any(leafColumns)"
2525
+ [selectable]="selectable"
2526
+ [filterable]="filterable"
2527
+ [noRecordsTemplate]="noRecordsTemplate"
2528
+ [detailTemplate]="detailTemplate"
2529
+ [showGroupFooters]="showGroupFooters"
2530
+ [trackBy]="trackBy"
2531
+ [rowClass]="rowClass"
2532
+ kendoDraggable
2533
+ kendoGridSelectionMarquee
2534
+ [enableDrag]="marqueeSelection">
2535
+ </tbody>
2536
+ <tfoot kendoGridFooter
2537
+ *ngIf="showFooter"
2538
+ [scrollable]="false"
2539
+ [logicalRowIndex]="ariaRowCount"
2540
+ [groups]="group"
2541
+ [columns]="$any(leafColumns)"
2542
+ [detailTemplate]="detailTemplate">
2543
+ </tfoot>
2544
+ </table>
2545
+ </ng-container>
2546
+ <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
2532
2547
  </div>
2548
+ <kendo-grid-status-bar
2549
+ *ngIf="showStatusBar"
2550
+ [selectableSettings]="selectable"
2551
+ [statusBarTemplate]="statusBarTemplate">
2552
+ </kendo-grid-status-bar>
2533
2553
  <kendo-pager
2534
2554
  *ngIf="showBottomPager"
2535
2555
  [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
@@ -2561,7 +2581,7 @@ GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
2561
2581
  </kendo-icon-wrapper>
2562
2582
  {{hintText}}
2563
2583
  </ng-template>
2564
- `, isInline: true, components: [{ type: i25.ToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { type: i26.PagerComponent, selector: "kendo-pager", inputs: ["total", "skip", "pageSize", "options", "size", "template"], outputs: ["pageChange"] }, { type: i27.GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { type: i28.ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { type: i29.HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "tabIndex", "size"] }, { type: i30.ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { type: i31.FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex"] }, { type: i32.TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "rowClass"] }, { type: i33.LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { type: i34.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i35.LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { type: i36.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i37.TableDirective, selector: "table", inputs: ["locked", "virtualColumns"] }, { type: i38.GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { type: i39.ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { type: i40.DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { type: i40.DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { type: i41.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i42.GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }], encapsulation: i0.ViewEncapsulation.None });
2584
+ `, isInline: true, components: [{ type: i25.ToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { type: i26.PagerComponent, selector: "kendo-pager", inputs: ["total", "skip", "pageSize", "options", "size", "template"], outputs: ["pageChange"] }, { type: i27.GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { type: i28.ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { type: i29.HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "tabIndex", "size"] }, { type: i30.ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { type: i31.FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex"] }, { type: i32.TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "rowClass"] }, { type: i33.LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { type: i34.StatusBarComponent, selector: "kendo-grid-status-bar", inputs: ["selectableSettings", "statusBarTemplate"] }, { type: i35.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i36.LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { type: i37.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i38.TableDirective, selector: "table", inputs: ["locked", "virtualColumns"] }, { type: i39.GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { type: i40.ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { type: i41.DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { type: i41.DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { type: i42.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i43.GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }], encapsulation: i0.ViewEncapsulation.None });
2565
2585
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GridComponent, decorators: [{
2566
2586
  type: Component,
2567
2587
  args: [{
@@ -2860,285 +2880,288 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2860
2880
  [navigable]="navigation.toolbarEnabled"
2861
2881
  [attr.aria-controls]="ariaRootId"
2862
2882
  position="top"></kendo-grid-toolbar>
2863
- <kendo-pager
2864
- *ngIf="showTopPager"
2865
- [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
2866
- [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
2867
- class="k-grid-pager-top k-pager"
2868
- [template]="pagerTemplate"
2869
- [pageSize]="pageSize"
2870
- [total]="view.total"
2871
- [skip]="skip"
2872
- [size]="size"
2873
- [options]="pageable"
2874
- (pageChange)="notifyPageChange('pager', $event)">
2875
- </kendo-pager>
2876
- <kendo-grid-group-panel
2877
- *ngIf="showGroupPanel"
2878
- [navigable]="navigation.toolbarEnabled"
2879
- [text]="groupableEmptyText"
2880
- [groups]="group"
2881
- role="toolbar"
2882
- [attr.aria-label]="messageFor('groupPanelLabel')"
2883
- [attr.aria-controls]="ariaRootId"
2884
- (change)="groupChange.emit($event)">
2885
- </kendo-grid-group-panel>
2886
- <div #ariaRoot
2887
- class="k-grid-aria-root"
2888
- role="grid"
2889
- [id]="ariaRootId"
2890
- [attr.aria-label]="ariaLabel"
2891
- [attr.aria-rowcount]="ariaRowCount"
2892
- [attr.aria-colcount]="ariaColCount">
2893
- <ng-container *ngIf="isScrollable">
2894
- <div *ngIf="!hideHeader"
2895
- class="k-grid-header"
2896
- role="presentation"
2897
- [style.padding]="headerPadding">
2898
- <div *ngIf="isLocked"
2899
- #lockedHeader
2900
- role="presentation"
2901
- class="k-grid-header-locked"
2902
- [style.width.px]="lockedWidth">
2903
- <table
2904
- [locked]="true"
2883
+ <kendo-pager
2884
+ *ngIf="showTopPager"
2885
+ [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
2886
+ [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
2887
+ class="k-grid-pager-top k-pager"
2888
+ [template]="pagerTemplate"
2889
+ [pageSize]="pageSize"
2890
+ [total]="view.total"
2891
+ [skip]="skip"
2892
+ [size]="size"
2893
+ [options]="pageable"
2894
+ (pageChange)="notifyPageChange('pager', $event)">
2895
+ </kendo-pager>
2896
+ <kendo-grid-group-panel
2897
+ *ngIf="showGroupPanel"
2898
+ [navigable]="navigation.toolbarEnabled"
2899
+ [text]="groupableEmptyText"
2900
+ [groups]="group"
2901
+ role="toolbar"
2902
+ [attr.aria-label]="messageFor('groupPanelLabel')"
2903
+ [attr.aria-controls]="ariaRootId"
2904
+ (change)="groupChange.emit($event)">
2905
+ </kendo-grid-group-panel>
2906
+ <div #ariaRoot
2907
+ class="k-grid-aria-root"
2908
+ role="grid"
2909
+ [id]="ariaRootId"
2910
+ [attr.aria-label]="ariaLabel"
2911
+ [attr.aria-rowcount]="ariaRowCount"
2912
+ [attr.aria-colcount]="ariaColCount">
2913
+ <ng-container *ngIf="isScrollable">
2914
+ <div *ngIf="!hideHeader"
2915
+ class="k-grid-header"
2916
+ role="presentation"
2917
+ [style.padding]="headerPadding">
2918
+ <div *ngIf="isLocked"
2919
+ #lockedHeader
2905
2920
  role="presentation"
2906
- class="k-grid-header-table"
2907
- [style.width.px]="lockedWidth"
2908
- kendoGridTable
2909
- [size]="size">
2910
- <colgroup kendoGridColGroup
2921
+ class="k-grid-header-locked"
2922
+ [style.width.px]="lockedWidth">
2923
+ <table
2924
+ [locked]="true"
2911
2925
  role="presentation"
2912
- [columns]="$any(lockedLeafColumns)"
2913
- [groups]="group"
2914
- [detailTemplate]="detailTemplate">
2915
- </colgroup>
2916
- <thead kendoGridHeader
2917
- role="rowgroup"
2918
- [resizable]="resizable"
2919
- [scrollable]="true"
2920
- [columns]="$any(lockedColumns)"
2921
- [totalColumnLevels]="totalColumnLevels"
2922
- [sort]="sort"
2923
- [groups]="group"
2924
- [filter]="filter"
2925
- [filterable]="filterable"
2926
- [groupable]="showGroupPanel"
2927
- [reorderable]="reorderable"
2928
- [sortable]="sortable"
2929
- [columnMenu]="columnMenuOptions"
2930
- [columnMenuTemplate]="columnMenuTemplate"
2931
- [totalColumnsCount]="leafColumns.length"
2932
- [detailTemplate]="detailTemplate"
2933
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2934
- </thead>
2935
- </table>
2936
- </div>
2937
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2938
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2939
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2940
- <table
2941
- role="presentation"
2942
- class="k-grid-header-table"
2943
- [style.width.px]="nonLockedWidth"
2944
- [virtualColumns]="virtualColumns"
2945
- kendoGridTable
2946
- [size]="size">
2947
- <colgroup kendoGridColGroup
2926
+ class="k-grid-header-table"
2927
+ [style.width.px]="lockedWidth"
2928
+ kendoGridTable
2929
+ [size]="size">
2930
+ <colgroup kendoGridColGroup
2931
+ role="presentation"
2932
+ [columns]="$any(lockedLeafColumns)"
2933
+ [groups]="group"
2934
+ [detailTemplate]="detailTemplate">
2935
+ </colgroup>
2936
+ <thead kendoGridHeader
2937
+ role="rowgroup"
2938
+ [resizable]="resizable"
2939
+ [scrollable]="true"
2940
+ [columns]="$any(lockedColumns)"
2941
+ [totalColumnLevels]="totalColumnLevels"
2942
+ [sort]="sort"
2943
+ [groups]="group"
2944
+ [filter]="filter"
2945
+ [filterable]="filterable"
2946
+ [groupable]="showGroupPanel"
2947
+ [reorderable]="reorderable"
2948
+ [sortable]="sortable"
2949
+ [columnMenu]="columnMenuOptions"
2950
+ [columnMenuTemplate]="columnMenuTemplate"
2951
+ [totalColumnsCount]="leafColumns.length"
2952
+ [detailTemplate]="detailTemplate"
2953
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2954
+ </thead>
2955
+ </table>
2956
+ </div>
2957
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2958
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
2959
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2960
+ <table
2948
2961
  role="presentation"
2949
- [columns]="headerLeafColumns"
2950
- [groups]="isLocked ? [] : group"
2951
- [detailTemplate]="detailTemplate">
2952
- </colgroup>
2953
- <thead kendoGridHeader
2954
- [resizable]="resizable"
2955
- role="rowgroup"
2956
- [scrollable]="true"
2957
- [columns]="headerColumns"
2958
- [totalColumnLevels]="totalColumnLevels"
2959
- [sort]="sort"
2960
- [filter]="filter"
2961
- [filterable]="filterable"
2962
- [groupable]="showGroupPanel"
2963
- [reorderable]="reorderable"
2964
- [groups]="isLocked ? [] : group"
2965
- [sortable]="sortable"
2966
- [columnMenu]="columnMenuOptions"
2967
- [columnMenuTemplate]="columnMenuTemplate"
2968
- [lockedColumnsCount]="lockedLeafColumns.length"
2969
- [totalColumnsCount]="leafColumns.length"
2970
- [detailTemplate]="detailTemplate"
2971
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2972
- </thead>
2973
- </table>
2974
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2975
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2962
+ class="k-grid-header-table"
2963
+ [style.width.px]="nonLockedWidth"
2964
+ [virtualColumns]="virtualColumns"
2965
+ kendoGridTable
2966
+ [size]="size">
2967
+ <colgroup kendoGridColGroup
2968
+ role="presentation"
2969
+ [columns]="headerLeafColumns"
2970
+ [groups]="isLocked ? [] : group"
2971
+ [detailTemplate]="detailTemplate">
2972
+ </colgroup>
2973
+ <thead kendoGridHeader
2974
+ [resizable]="resizable"
2975
+ role="rowgroup"
2976
+ [scrollable]="true"
2977
+ [columns]="headerColumns"
2978
+ [totalColumnLevels]="totalColumnLevels"
2979
+ [sort]="sort"
2980
+ [filter]="filter"
2981
+ [filterable]="filterable"
2982
+ [groupable]="showGroupPanel"
2983
+ [reorderable]="reorderable"
2984
+ [groups]="isLocked ? [] : group"
2985
+ [sortable]="sortable"
2986
+ [columnMenu]="columnMenuOptions"
2987
+ [columnMenuTemplate]="columnMenuTemplate"
2988
+ [lockedColumnsCount]="lockedLeafColumns.length"
2989
+ [totalColumnsCount]="leafColumns.length"
2990
+ [detailTemplate]="detailTemplate"
2991
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
2992
+ </thead>
2993
+ </table>
2994
+ <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2995
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2996
+ </div>
2976
2997
  </div>
2977
2998
  </div>
2978
- </div>
2979
- <kendo-grid-list
2980
- kendoDragTargetContainer
2981
- kendoDropTargetContainer
2982
- mode="manual"
2983
- [dragDisabled]="!rowReorderable"
2984
- [dropDisabled]="!rowReorderable"
2985
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2986
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2987
- [dragHandle]="getDefaultSelectors('handle')"
2988
- [hint]="{hintTemplate: defaultHint}"
2989
- (onPress)="handleReorderEvents($event, 'press')"
2990
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
2991
- (onDrag)="handleReorderEvents($event, 'drag')"
2992
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2993
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2994
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2995
- (onDrop)="handleReorderEvents($event, 'drop')"
2996
- [dragData]="gridData"
2997
- [data]="$any(view)"
2998
- [rowHeight]="rowHeight"
2999
- [detailRowHeight]="detailRowHeight"
3000
- [total]="totalCount"
3001
- [take]="pageSize"
3002
- [groups]="group"
3003
- [groupable]="groupable"
3004
- [skip]="skip"
3005
- [trackBy]="trackBy"
3006
- [columns]="columnsContainer"
3007
- [selectable]="selectable"
3008
- [filterable]="filterable"
3009
- [detailTemplate]="detailTemplate"
3010
- [noRecordsTemplate]="noRecordsTemplate"
3011
- [size]="size"
3012
- (pageChange)="notifyPageChange('list', $event)"
3013
- [rowClass]="rowClass"
3014
- [rowSticky]="rowSticky"
3015
- [loading]="loading"
3016
- [isVirtual]="isVirtual"
3017
- [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
3018
- [loadingTemplate]="loadingTemplate?.templateRef"
3019
- [virtualColumns]="virtualColumns"
3020
- (scrollBottom)="notifyScrollBottom()"
3021
- (contentScroll)="contentScroll.emit($event)"
3022
- kendoDraggable
3023
- kendoGridSelectionMarquee
3024
- [enableDrag]="marqueeSelection"
3025
- [sort]="sort"
3026
- >
3027
- </kendo-grid-list>
3028
- <div
3029
- *ngIf="showFooter"
3030
- class="k-grid-footer"
3031
- [style.padding]="headerPadding">
3032
- <div
3033
- *ngIf="lockedLeafColumns.length"
3034
- class="k-grid-footer-locked"
3035
- [style.width.px]="lockedWidth">
3036
- <table
3037
- role="presentation"
3038
- class="k-grid-footer-table"
3039
- [locked]="true"
3040
- [style.width.px]="lockedWidth"
3041
- kendoGridTable
3042
- [size]="size">
3043
- <colgroup kendoGridColGroup
3044
- [columns]="$any(lockedLeafColumns)"
3045
- [groups]="group"
3046
- [detailTemplate]="detailTemplate">
3047
- </colgroup>
3048
- <tfoot kendoGridFooter
3049
- [scrollable]="true"
3050
- [groups]="group"
3051
- [columns]="$any(lockedLeafColumns)"
3052
- [detailTemplate]="detailTemplate"
3053
- [logicalRowIndex]="ariaRowCount">
3054
- </tfoot>
3055
- </table>
3056
- </div>
3057
- <div #footer
3058
- class="k-grid-footer-wrap" data-scrollable
3059
- [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3060
- [lockedWidth]="lockedWidth + scrollbarWidth + 3">
3061
- <table
3062
- role="presentation"
3063
- class="k-grid-footer-table"
3064
- [style.width.px]="nonLockedWidth"
3065
- kendoGridTable
3066
- [size]="size">
3067
- <colgroup kendoGridColGroup
3068
- [columns]="$any(nonLockedLeafColumns)"
3069
- [groups]="isLocked ? [] : group"
3070
- [detailTemplate]="detailTemplate">
3071
- </colgroup>
3072
- <tfoot kendoGridFooter
3073
- [logicalRowIndex]="ariaRowCount"
3074
- [scrollable]="true"
3075
- [groups]="isLocked ? [] : group"
3076
- [columns]="$any(nonLockedLeafColumns)"
3077
- [lockedColumnsCount]="lockedLeafColumns.length"
3078
- [detailTemplate]="detailTemplate">
3079
- </tfoot>
3080
- </table>
3081
- </div>
3082
- </div>
3083
- </ng-container>
3084
- <ng-container *ngIf="!isScrollable">
3085
- <table
3086
- [style.table-layout]="resizable ? 'fixed' : null"
3087
- kendoGridTable
3088
- [size]="size">
3089
- <colgroup kendoGridColGroup
3090
- [columns]="$any(leafColumns)"
3091
- [groups]="group"
3092
- [detailTemplate]="detailTemplate">
3093
- </colgroup>
3094
- <thead kendoGridHeader
3095
- *ngIf="!hideHeader"
3096
- [resizable]="resizable"
3097
- [scrollable]="false"
3098
- [columns]="$any(visibleColumns)"
3099
- [totalColumnLevels]="totalColumnLevels"
3100
- [groups]="group"
3101
- [groupable]="showGroupPanel"
3102
- [reorderable]="reorderable"
3103
- [sort]="sort"
3104
- [sortable]="sortable"
3105
- [filter]="filter"
3106
- [filterable]="filterable"
3107
- [columnMenu]="columnMenuOptions"
3108
- [columnMenuTemplate]="columnMenuTemplate"
3109
- [detailTemplate]="detailTemplate"
3110
- [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3111
- </thead>
3112
- <tbody kendoGridTableBody
3113
- [isLoading]="loading"
3114
- [groups]="group"
2999
+ <kendo-grid-list
3000
+ kendoDragTargetContainer
3001
+ kendoDropTargetContainer
3002
+ mode="manual"
3003
+ [dragDisabled]="!rowReorderable"
3004
+ [dropDisabled]="!rowReorderable"
3005
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
3006
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
3007
+ [dragHandle]="getDefaultSelectors('handle')"
3008
+ [hint]="{hintTemplate: defaultHint}"
3009
+ (onPress)="handleReorderEvents($event, 'press')"
3010
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
3011
+ (onDrag)="handleReorderEvents($event, 'drag')"
3012
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
3013
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
3014
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
3015
+ (onDrop)="handleReorderEvents($event, 'drop')"
3016
+ [dragData]="gridData"
3115
3017
  [data]="$any(view)"
3018
+ [rowHeight]="rowHeight"
3019
+ [detailRowHeight]="detailRowHeight"
3020
+ [total]="totalCount"
3021
+ [take]="pageSize"
3022
+ [groups]="group"
3023
+ [groupable]="groupable"
3116
3024
  [skip]="skip"
3117
- [columns]="$any(leafColumns)"
3025
+ [trackBy]="trackBy"
3026
+ [columns]="columnsContainer"
3118
3027
  [selectable]="selectable"
3119
3028
  [filterable]="filterable"
3120
- [noRecordsTemplate]="noRecordsTemplate"
3121
3029
  [detailTemplate]="detailTemplate"
3122
- [showGroupFooters]="showGroupFooters"
3123
- [trackBy]="trackBy"
3030
+ [noRecordsTemplate]="noRecordsTemplate"
3031
+ [size]="size"
3032
+ (pageChange)="notifyPageChange('list', $event)"
3124
3033
  [rowClass]="rowClass"
3034
+ [rowSticky]="rowSticky"
3035
+ [loading]="loading"
3036
+ [isVirtual]="isVirtual"
3037
+ [cellLoadingTemplate]="cellLoadingTemplate?.templateRef"
3038
+ [loadingTemplate]="loadingTemplate?.templateRef"
3039
+ [virtualColumns]="virtualColumns"
3040
+ (scrollBottom)="notifyScrollBottom()"
3041
+ (contentScroll)="contentScroll.emit($event)"
3125
3042
  kendoDraggable
3126
3043
  kendoGridSelectionMarquee
3127
- [enableDrag]="marqueeSelection">
3128
- </tbody>
3129
- <tfoot kendoGridFooter
3044
+ [enableDrag]="marqueeSelection"
3045
+ [sort]="sort">
3046
+ </kendo-grid-list>
3047
+ <div
3130
3048
  *ngIf="showFooter"
3131
- [scrollable]="false"
3132
- [logicalRowIndex]="ariaRowCount"
3133
- [groups]="group"
3134
- [columns]="$any(leafColumns)"
3135
- [detailTemplate]="detailTemplate">
3136
- </tfoot>
3137
- </table>
3138
- </ng-container>
3139
- <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading>
3140
- </div>
3049
+ class="k-grid-footer"
3050
+ [style.padding]="headerPadding">
3051
+ <div
3052
+ *ngIf="lockedLeafColumns.length"
3053
+ class="k-grid-footer-locked"
3054
+ [style.width.px]="lockedWidth">
3055
+ <table
3056
+ role="presentation"
3057
+ class="k-grid-footer-table"
3058
+ [locked]="true"
3059
+ [style.width.px]="lockedWidth"
3060
+ kendoGridTable
3061
+ [size]="size">
3062
+ <colgroup kendoGridColGroup
3063
+ [columns]="$any(lockedLeafColumns)"
3064
+ [groups]="group"
3065
+ [detailTemplate]="detailTemplate">
3066
+ </colgroup>
3067
+ <tfoot kendoGridFooter
3068
+ [scrollable]="true"
3069
+ [groups]="group"
3070
+ [columns]="$any(lockedLeafColumns)"
3071
+ [detailTemplate]="detailTemplate"
3072
+ [logicalRowIndex]="ariaRowCount">
3073
+ </tfoot>
3074
+ </table>
3075
+ </div>
3076
+ <div #footer
3077
+ class="k-grid-footer-wrap" data-scrollable
3078
+ [kendoGridResizableContainer]="lockedLeafColumns.length > 0"
3079
+ [lockedWidth]="lockedWidth + scrollbarWidth + 3">
3080
+ <table
3081
+ role="presentation"
3082
+ class="k-grid-footer-table"
3083
+ [style.width.px]="nonLockedWidth"
3084
+ kendoGridTable
3085
+ [size]="size">
3086
+ <colgroup kendoGridColGroup
3087
+ [columns]="$any(nonLockedLeafColumns)"
3088
+ [groups]="isLocked ? [] : group"
3089
+ [detailTemplate]="detailTemplate">
3090
+ </colgroup>
3091
+ <tfoot kendoGridFooter
3092
+ [logicalRowIndex]="ariaRowCount"
3093
+ [scrollable]="true"
3094
+ [groups]="isLocked ? [] : group"
3095
+ [columns]="$any(nonLockedLeafColumns)"
3096
+ [lockedColumnsCount]="lockedLeafColumns.length"
3097
+ [detailTemplate]="detailTemplate">
3098
+ </tfoot>
3099
+ </table>
3100
+ </div>
3101
+ </div>
3102
+ </ng-container>
3103
+ <ng-container *ngIf="!isScrollable">
3104
+ <table
3105
+ [style.table-layout]="resizable ? 'fixed' : null"
3106
+ kendoGridTable
3107
+ [size]="size">
3108
+ <colgroup kendoGridColGroup
3109
+ [columns]="$any(leafColumns)"
3110
+ [groups]="group"
3111
+ [detailTemplate]="detailTemplate">
3112
+ </colgroup>
3113
+ <thead kendoGridHeader
3114
+ *ngIf="!hideHeader"
3115
+ [resizable]="resizable"
3116
+ [scrollable]="false"
3117
+ [columns]="$any(visibleColumns)"
3118
+ [totalColumnLevels]="totalColumnLevels"
3119
+ [groups]="group"
3120
+ [groupable]="showGroupPanel"
3121
+ [reorderable]="reorderable"
3122
+ [sort]="sort"
3123
+ [sortable]="sortable"
3124
+ [filter]="filter"
3125
+ [filterable]="filterable"
3126
+ [columnMenu]="columnMenuOptions"
3127
+ [columnMenuTemplate]="columnMenuTemplate"
3128
+ [detailTemplate]="detailTemplate"
3129
+ [tabIndex]="navigation.tableEnabled ? '-1' : '0'">
3130
+ </thead>
3131
+ <tbody kendoGridTableBody
3132
+ [isLoading]="loading"
3133
+ [groups]="group"
3134
+ [data]="$any(view)"
3135
+ [skip]="skip"
3136
+ [columns]="$any(leafColumns)"
3137
+ [selectable]="selectable"
3138
+ [filterable]="filterable"
3139
+ [noRecordsTemplate]="noRecordsTemplate"
3140
+ [detailTemplate]="detailTemplate"
3141
+ [showGroupFooters]="showGroupFooters"
3142
+ [trackBy]="trackBy"
3143
+ [rowClass]="rowClass"
3144
+ kendoDraggable
3145
+ kendoGridSelectionMarquee
3146
+ [enableDrag]="marqueeSelection">
3147
+ </tbody>
3148
+ <tfoot kendoGridFooter
3149
+ *ngIf="showFooter"
3150
+ [scrollable]="false"
3151
+ [logicalRowIndex]="ariaRowCount"
3152
+ [groups]="group"
3153
+ [columns]="$any(leafColumns)"
3154
+ [detailTemplate]="detailTemplate">
3155
+ </tfoot>
3156
+ </table>
3157
+ </ng-container>
3158
+ <div [loadingTemplate]="loadingTemplate" *ngIf="loading" kendoGridLoading></div>
3141
3159
  </div>
3160
+ <kendo-grid-status-bar
3161
+ *ngIf="showStatusBar"
3162
+ [selectableSettings]="selectable"
3163
+ [statusBarTemplate]="statusBarTemplate">
3164
+ </kendo-grid-status-bar>
3142
3165
  <kendo-pager
3143
3166
  *ngIf="showBottomPager"
3144
3167
  [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
@@ -3321,6 +3344,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3321
3344
  }], loadingTemplateChildren: [{
3322
3345
  type: ContentChildren,
3323
3346
  args: [LoadingTemplateDirective]
3347
+ }], statusBarTemplateChildren: [{
3348
+ type: ContentChildren,
3349
+ args: [StatusBarTemplateDirective]
3324
3350
  }], noRecordsTemplateChildren: [{
3325
3351
  type: ContentChildren,
3326
3352
  args: [NoRecordsTemplateDirective]