@progress/kendo-angular-treelist 21.1.1-develop.2 → 21.2.0-develop.10

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 (33) hide show
  1. package/esm2022/column-menu/column-list.component.mjs +77 -71
  2. package/esm2022/column-menu/column-menu-autosize-all.component.mjs +12 -11
  3. package/esm2022/column-menu/column-menu-autosize.component.mjs +12 -11
  4. package/esm2022/column-menu/column-menu-item.component.mjs +137 -57
  5. package/esm2022/column-menu/column-menu.component.mjs +145 -122
  6. package/esm2022/editing/add-command.directive.mjs +27 -17
  7. package/esm2022/editing/base-command.directive.mjs +27 -17
  8. package/esm2022/editing/cancel-command.directive.mjs +27 -17
  9. package/esm2022/editing/edit-command.directive.mjs +27 -17
  10. package/esm2022/editing/remove-command.directive.mjs +27 -17
  11. package/esm2022/editing/save-command.directive.mjs +27 -17
  12. package/esm2022/excel/excel-command.directive.mjs +27 -17
  13. package/esm2022/filtering/cell/filter-cell-operators.component.mjs +20 -17
  14. package/esm2022/filtering/cell/filter-cell.component.mjs +35 -33
  15. package/esm2022/filtering/filter-row.component.mjs +26 -23
  16. package/esm2022/filtering/menu/boolean-filter-menu.component.mjs +32 -29
  17. package/esm2022/filtering/menu/date-filter-menu.component.mjs +52 -49
  18. package/esm2022/filtering/menu/filter-menu-container.component.mjs +75 -73
  19. package/esm2022/filtering/menu/numeric-filter-menu.component.mjs +50 -47
  20. package/esm2022/filtering/menu/string-filter-menu.component.mjs +36 -33
  21. package/esm2022/navigation/navigation.service.mjs +4 -4
  22. package/esm2022/package-metadata.mjs +2 -2
  23. package/esm2022/pdf/pdf-command.directive.mjs +27 -17
  24. package/esm2022/rendering/cell.component.mjs +167 -145
  25. package/esm2022/rendering/common/col-group.component.mjs +10 -8
  26. package/esm2022/rendering/header/header.component.mjs +373 -333
  27. package/esm2022/rendering/list.component.mjs +187 -160
  28. package/esm2022/rendering/table-body.component.mjs +199 -169
  29. package/esm2022/rendering/toolbar/toolbar.component.mjs +15 -13
  30. package/esm2022/treelist.component.mjs +896 -849
  31. package/fesm2022/progress-kendo-angular-treelist.mjs +2757 -2364
  32. package/package.json +18 -18
  33. package/schematics/ngAdd/index.js +3 -3
@@ -4,7 +4,7 @@
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  /* eslint-disable @typescript-eslint/no-explicit-any */
6
6
  import { Component, ContentChildren, ElementRef, EventEmitter, HostBinding, Input, Output, Renderer2, QueryList, ViewChild, isDevMode, NgZone, ViewChildren, ChangeDetectorRef, ViewEncapsulation, ChangeDetectionStrategy, forwardRef } from '@angular/core';
7
- import { NgIf, NgTemplateOutlet } from '@angular/common';
7
+ import { NgTemplateOutlet } from '@angular/common';
8
8
  import { FormControl, FormGroup } from '@angular/forms';
9
9
  import { Subscription, merge, isObservable } from 'rxjs';
10
10
  import { map, tap, take, filter, switchMap, takeUntil } from 'rxjs/operators';
@@ -895,6 +895,9 @@ export class TreeListComponent {
895
895
  if (!args.isDefaultPrevented()) {
896
896
  this.changeDetectorRef.markForCheck();
897
897
  this.view.clear();
898
+ if (this.lockedLeafColumns.length) {
899
+ this.ngZone.onStable.pipe(take(1)).subscribe(() => this.changeNotification.notify());
900
+ }
898
901
  this.expandStateChange.emit(args);
899
902
  }
900
903
  if (this.rowReorderable) {
@@ -1854,7 +1857,7 @@ export class TreeListComponent {
1854
1857
  this.dropTargetContainer?.notify();
1855
1858
  }
1856
1859
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TreeListComponent, deps: [{ token: i1.BrowserSupportService }, { token: i0.ElementRef }, { token: i2.ChangeNotificationService }, { token: i3.EditService }, { token: i4.FilterService }, { token: i5.PDFService }, { token: i6.ResponsiveService }, { token: i0.Renderer2 }, { token: i7.ExcelService }, { token: i0.NgZone }, { token: i8.ScrollSyncService }, { token: i9.DomEventsService }, { token: i10.ColumnResizingService }, { token: i0.ChangeDetectorRef }, { token: i11.ColumnReorderService }, { token: i12.ColumnInfoService }, { token: i13.NavigationService }, { token: i14.SortService }, { token: i15.ScrollRequestService }, { token: i16.ExpandStateService }, { token: i17.OptionChangesService }, { token: i18.SelectionService }, { token: i19.LocalizationService }, { token: i20.ContextService }, { token: i21.RowReorderService }], target: i0.ɵɵFactoryTarget.Component });
1857
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: TreeListComponent, isStandalone: true, selector: "kendo-treelist", inputs: { ariaLabel: ["aria-label", "ariaLabel"], data: "data", pageSize: "pageSize", height: "height", rowHeight: "rowHeight", skip: "skip", scrollable: "scrollable", sort: "sort", trackBy: "trackBy", filter: "filter", virtualColumns: "virtualColumns", filterable: "filterable", sortable: "sortable", pageable: "pageable", navigable: "navigable", autoSize: "autoSize", rowClass: "rowClass", resizable: "resizable", reorderable: "reorderable", loading: "loading", columnMenu: "columnMenu", hideHeader: "hideHeader", idField: "idField", selectable: "selectable", isSelected: "isSelected", rowReorderable: "rowReorderable", columnsRef: ["columns", "columnsRef"], fetchChildren: "fetchChildren", hasChildren: "hasChildren", isExpanded: "isExpanded" }, outputs: { selectionChange: "selectionChange", filterChange: "filterChange", pageChange: "pageChange", sortChange: "sortChange", dataStateChange: "dataStateChange", edit: "edit", cancel: "cancel", save: "save", remove: "remove", add: "add", cellClose: "cellClose", cellClick: "cellClick", pdfExport: "pdfExport", excelExport: "excelExport", columnResize: "columnResize", columnReorder: "columnReorder", columnVisibilityChange: "columnVisibilityChange", columnLockedChange: "columnLockedChange", scrollBottom: "scrollBottom", contentScroll: "contentScroll", expandEvent: "expand", collapseEvent: "collapse", expandStateChange: "expandStateChange", rowReorder: "rowReorder" }, host: { properties: { "attr.dir": "this.dir", "class.k-grid": "this.hostClasses", "class.k-grid-md": "this.hostClasses", "class.k-treelist": "this.hostClasses", "class.k-grid-lockedcolumns": "this.lockedClasses", "class.k-grid-virtual": "this.virtualClasses", "class.k-grid-no-scrollbar": "this.noScrollbarClass" } }, providers: [
1860
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: TreeListComponent, isStandalone: true, selector: "kendo-treelist", inputs: { ariaLabel: ["aria-label", "ariaLabel"], data: "data", pageSize: "pageSize", height: "height", rowHeight: "rowHeight", skip: "skip", scrollable: "scrollable", sort: "sort", trackBy: "trackBy", filter: "filter", virtualColumns: "virtualColumns", filterable: "filterable", sortable: "sortable", pageable: "pageable", navigable: "navigable", autoSize: "autoSize", rowClass: "rowClass", resizable: "resizable", reorderable: "reorderable", loading: "loading", columnMenu: "columnMenu", hideHeader: "hideHeader", idField: "idField", selectable: "selectable", isSelected: "isSelected", rowReorderable: "rowReorderable", columnsRef: ["columns", "columnsRef"], fetchChildren: "fetchChildren", hasChildren: "hasChildren", isExpanded: "isExpanded" }, outputs: { selectionChange: "selectionChange", filterChange: "filterChange", pageChange: "pageChange", sortChange: "sortChange", dataStateChange: "dataStateChange", edit: "edit", cancel: "cancel", save: "save", remove: "remove", add: "add", cellClose: "cellClose", cellClick: "cellClick", pdfExport: "pdfExport", excelExport: "excelExport", columnResize: "columnResize", columnReorder: "columnReorder", columnVisibilityChange: "columnVisibilityChange", columnLockedChange: "columnLockedChange", scrollBottom: "scrollBottom", contentScroll: "contentScroll", expandEvent: "expand", collapseEvent: "collapse", expandStateChange: "expandStateChange", rowReorder: "rowReorder" }, host: { properties: { "attr.dir": "this.dir", "class.k-grid": "this.hostClasses", "class.k-grid-md": "this.hostClasses", "class.k-treelist": "this.hostClasses", "class.k-grid-lockedcolumns": "this.lockedClasses", "class.k-grid-virtual": "this.virtualClasses", "class.k-grid-no-scrollbar": "this.noScrollbarClass" } }, providers: [
1858
1861
  BrowserSupportService,
1859
1862
  LocalizationService,
1860
1863
  ColumnInfoService,
@@ -1900,387 +1903,397 @@ export class TreeListComponent {
1900
1903
  RowReorderService
1901
1904
  ], queries: [{ propertyName: "columns", predicate: ColumnBase }, { 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: "listComponent", first: true, predicate: ListComponent, descendants: true }, { propertyName: "footer", predicate: ["footer"], descendants: true }], exportAs: ["kendoTreeList"], usesOnChanges: true, ngImport: i0, template: `
1902
1905
  <ng-container kendoTreeListLocalizedMessages
1903
- i18n-noRecords="kendo.treelist.noRecords|The label visible in the TreeList when there are no records"
1904
- noRecords="No records available."
1905
-
1906
- i18n-pagerLabel="kendo.treelist.pagerLabel|The label for the TreeList pager"
1907
- pagerLabel="{{ 'Page navigation, page {currentPage} of {totalPages}' }}"
1908
-
1909
- i18n-pagerFirstPage="kendo.treelist.pagerFirstPage|The label for the first page button in TreeList pager"
1910
- pagerFirstPage="Go to the first page"
1911
-
1912
- i18n-pagerPreviousPage="kendo.treelist.pagerPreviousPage|The label for the previous page button in TreeList pager"
1913
- pagerPreviousPage="Go to the previous page"
1914
-
1915
- i18n-pagerNextPage="kendo.treelist.pagerNextPage|The label for the next page button in TreeList pager"
1916
- pagerNextPage="Go to the next page"
1917
-
1918
- i18n-pagerLastPage="kendo.treelist.pagerLastPage|The label for the last page button in TreeList pager"
1919
- pagerLastPage="Go to the last page"
1920
-
1921
- i18n-pagerPage="kendo.treelist.pagerPage|The label before the current page number in the TreeList pager"
1922
- pagerPage="Page"
1923
-
1924
- i18n-pagerOf="kendo.treelist.pagerOf|The label before the total pages number in the TreeList pager"
1925
- pagerOf="of"
1926
-
1927
- i18n-pagerPageNumberInputTitle="kendo.treelist.pagerPageNumberInputTitle|The label for the pager input in the Treelist pager"
1928
- pagerPageNumberInputTitle="Page Number"
1929
-
1930
- i18n-pagerItemsPerPage="kendo.treelist.pagerItemsPerPage|The label for the page size chooser in the TreeList pager"
1931
- pagerItemsPerPage="items per page"
1932
-
1933
- i18n-pagerItemsTotal="kendo.treelist.pagerItemsTotal|The label after the total items count in the TreeList pager"
1934
- pagerItemsTotal="items total"
1935
-
1936
- i18n-pagerInputLabel="kendo.treelist.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
1937
- pagerInputLabel="Type a page number"
1938
-
1939
- i18n-filterCellOperatorLabel="kendo.treelist.filterCellOperatorLabel|The label of the filter cell operators dropdown"
1940
- filterCellOperatorLabel="{{ 'Filter cell operators for {columnName}' }}"
1941
-
1942
- i18n-booleanFilterCellLabel="kendo.treelist.booleanFilterCellLabel|The label of the boolean filter cell dropdown"
1943
- booleanFilterCellLabel="{{ 'Boolean filter cell for {columnName}' }}"
1944
-
1945
- i18n-filter="kendo.treelist.filter|The label of the filter cell or icon"
1946
- filter="Filter"
1947
-
1948
- i18n-filterEqOperator="kendo.treelist.filterEqOperator|The text of the equal filter operator"
1949
- filterEqOperator="Is equal to"
1950
-
1951
- i18n-filterNotEqOperator="kendo.treelist.filterNotEqOperator|The text of the not equal filter operator"
1952
- filterNotEqOperator="Is not equal to"
1953
-
1954
- i18n-filterIsNullOperator="kendo.treelist.filterIsNullOperator|The text of the is null filter operator"
1955
- filterIsNullOperator="Is null"
1956
-
1957
- i18n-filterIsNotNullOperator="kendo.treelist.filterIsNotNullOperator|The text of the is not null filter operator"
1958
- filterIsNotNullOperator="Is not null"
1959
-
1960
- i18n-filterIsEmptyOperator="kendo.treelist.filterIsEmptyOperator|The text of the is empty filter operator"
1961
- filterIsEmptyOperator="Is empty"
1962
-
1963
- i18n-filterIsNotEmptyOperator="kendo.treelist.filterIsNotEmptyOperator|The text of the is not empty filter operator"
1964
- filterIsNotEmptyOperator="Is not empty"
1965
-
1966
- i18n-filterStartsWithOperator="kendo.treelist.filterStartsWithOperator|The text of the starts with filter operator"
1967
- filterStartsWithOperator="Starts with"
1968
-
1969
- i18n-filterContainsOperator="kendo.treelist.filterContainsOperator|The text of the contains filter operator"
1970
- filterContainsOperator="Contains"
1971
-
1972
- i18n-filterNotContainsOperator="kendo.treelist.filterNotContainsOperator|The text of the does not contain filter operator"
1973
- filterNotContainsOperator="Does not contain"
1974
-
1975
- i18n-filterEndsWithOperator="kendo.treelist.filterEndsWithOperator|The text of the ends with filter operator"
1976
- filterEndsWithOperator="Ends with"
1977
-
1978
- i18n-filterGteOperator="kendo.treelist.filterGteOperator|The text of the greater than or equal filter operator"
1979
- filterGteOperator="Is greater than or equal to"
1980
-
1981
- i18n-filterGtOperator="kendo.treelist.filterGtOperator|The text of the greater than filter operator"
1982
- filterGtOperator="Is greater than"
1983
-
1984
- i18n-filterLteOperator="kendo.treelist.filterLteOperator|The text of the less than or equal filter operator"
1985
- filterLteOperator="Is less than or equal to"
1986
-
1987
- i18n-filterLtOperator="kendo.treelist.filterLtOperator|The text of the less than filter operator"
1988
- filterLtOperator="Is less than"
1989
-
1990
- i18n-filterIsTrue="kendo.treelist.filterIsTrue|The text of the IsTrue boolean filter option"
1991
- filterIsTrue="Is True"
1992
-
1993
- i18n-filterIsFalse="kendo.treelist.filterIsFalse|The text of the IsFalse boolean filter option"
1994
- filterIsFalse="Is False"
1995
-
1996
- i18n-filterBooleanAll="kendo.treelist.filterBooleanAll|The text of the (All) boolean filter option"
1997
- filterBooleanAll="(All)"
1998
-
1999
- i18n-filterAfterOrEqualOperator="kendo.treelist.filterAfterOrEqualOperator|The text of the after or equal date filter operator"
2000
- filterAfterOrEqualOperator="Is after or equal to"
2001
-
2002
- i18n-filterAfterOperator="kendo.treelist.filterAfterOperator|The text of the after date filter operator"
2003
- filterAfterOperator="Is after"
2004
-
2005
- i18n-filterBeforeOperator="kendo.treelist.filterBeforeOperator|The text of the before date filter operator"
2006
- filterBeforeOperator="Is before"
2007
-
2008
- i18n-filterBeforeOrEqualOperator="kendo.treelist.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"
2009
- filterBeforeOrEqualOperator="Is before or equal to"
2010
-
2011
- i18n-filterFilterButton="kendo.treelist.filterFilterButton|The text of the filter button"
2012
- filterFilterButton="Filter"
2013
-
2014
- i18n-filterClearButton="kendo.treelist.filterClearButton|The text of the clear filter button"
2015
- filterClearButton="Clear"
2016
-
2017
- i18n-filterAndLogic="kendo.treelist.filterAndLogic|The text of the And filter logic"
2018
- filterAndLogic="And"
2019
-
2020
- i18n-filterOrLogic="kendo.treelist.filterOrLogic|The text of the Or filter logic"
2021
- filterOrLogic="Or"
2022
-
2023
- i18n-filterDateToday="kendo.treelist.filterDateToday|The text of the Today button of the Date filter."
2024
- filterDateToday="TODAY"
2025
-
2026
- i18n-filterDateToggle="kendo.treelist.filterDateToggle|The title of the Toggle button of the Date filter."
2027
- filterDateToggle="Toggle Calendar"
2028
-
2029
- i18n-filterNumericDecrement="kendo.treelist.filterNumericDecrement|The title of the Decrement button of the Numeric filter."
2030
- filterNumericDecrement="Decrement"
2031
-
2032
- i18n-filterNumericIncrement="kendo.treelist.filterNumericIncrement|The title of the Increment button of the Numeric filter."
2033
- filterNumericIncrement="Increment"
2034
-
2035
- i18n-loading="kendo.treelist.loading|The loading text"
2036
- loading="Loading"
2037
-
2038
- i18n-filterInputLabel="kendo.treelist.filterInputLabel|The label of the filter row and menu inputs"
2039
- filterInputLabel="{{ '{columnName} Filter' }}"
2040
-
2041
- i18n-filterMenuLogicDropDownLabel="kendo.treelist.filterMenuLogicDropDownLabel|The label of the filter menu logic dropdown"
2042
- filterMenuLogicDropDownLabel="{{ '{columnName} Filter Logic' }}"
2043
-
2044
- i18n-filterMenuOperatorsDropDownLabel="kendo.treelist.filterMenuOperatorsDropDownLabel|The label of the filter menu operators dropdown"
2045
- filterMenuOperatorsDropDownLabel="{{ '{columnName} Filter Operators' }}"
2046
-
2047
- i18n-filterMenuTitle="kendo.treelist.filterMenuTitle|The title of the filter menu icon"
2048
- filterMenuTitle="{{ '{columnName} Filter Menu' }}"
2049
-
2050
- i18n-columnMenu="kendo.treelist.columnMenu|The title of the column menu icon"
2051
- columnMenu="{{ '{columnName} Column Menu' }}"
2052
-
2053
- i18n-columns="kendo.treelist.columns|The text shown in the column menu for the columns item"
2054
- columns="Columns"
2055
-
2056
- i18n-lock="kendo.treelist.lock|The text shown in the column menu for the lock item"
2057
- lock="Lock"
2058
-
2059
- i18n-unlock="kendo.treelist.unlock|The text shown in the column menu for the unlock item"
2060
- unlock="Unlock"
2061
-
2062
- i18n-sortable="kendo.treelist.sortable|The label of the sort icon"
2063
- sortable="Sortable"
2064
-
2065
- i18n-sortAscending="kendo.treelist.sortAscending|The text shown in the column menu for the sort ascending item"
2066
- sortAscending="Sort Ascending"
2067
-
2068
- i18n-sortDescending="kendo.treelist.sortDescending|The text shown in the column menu for the sort descending item"
2069
- sortDescending="Sort Descending"
2070
-
2071
- i18n-sortedDefault="kendo.treelist.sortedDefault|The status announcement when a column is no longer sorted"
2072
- sortedDefault="Not Sorted"
2073
-
2074
- i18n-columnsApply="kendo.treelist.columnsApply|The text shown in the column menu or column chooser for the columns apply button"
2075
- columnsApply="Apply"
2076
-
2077
- i18n-columnsReset="kendo.treelist.columnsReset|The text shown in the column menu or column chooser for the columns reset button"
2078
- columnsReset="Reset"
2079
-
2080
- i18n-pagerSelectPage="kendo.treelist.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the TreeList Pager"
2081
- pagerSelectPage="Select page"
2082
-
2083
- i18n-topToolbarLabel="kendo.treelist.topToolbarLabel|The label of the TreeList top toolbar"
2084
- topToolbarLabel="Top toolbar"
2085
-
2086
- i18n-bottomToolbarLabel="kendo.treelist.bottomToolbarLabel|The label of the TreeList bottom toolbar"
2087
- bottomToolbarLabel="Bottom toolbar"
2088
-
2089
- i18n-dragRowHandleLabel="kendo.treelist.dragRowHandleLabel|The label for the TreeList drag row handle"
2090
- dragRowHandleLabel="Drag row"
2091
-
2092
- i18n-selectRowCheckboxLabel="kendo.treelist.selectRowCheckboxLabel|The label for the select row checkbox"
2093
- selectRowCheckboxLabel="Select row"
2094
-
2095
- i18n-selectAllRowsCheckboxLabel="kendo.treelist.selectAllRowsCheckboxLabel|The label for the select all rows checkbox"
2096
- selectAllRowsCheckboxLabel="Select all rows"
2097
-
2098
- i18n-autosizeAllColumns="kendo.treelist.autosizeAllColumns|The text shown in the column menu for the autosize all columns item"
2099
- autosizeAllColumns="Autosize All Columns"
2100
-
2101
- i18n-autosizeThisColumn="kendo.treelist.autosizeThisColumn|The text shown in the column menu for the autosize this column item"
2102
- autosizeThisColumn="Autosize This Column"
2103
- >
1906
+ i18n-noRecords="kendo.treelist.noRecords|The label visible in the TreeList when there are no records"
1907
+ noRecords="No records available."
1908
+
1909
+ i18n-pagerLabel="kendo.treelist.pagerLabel|The label for the TreeList pager"
1910
+ pagerLabel="{{ 'Page navigation, page {currentPage} of {totalPages}' }}"
1911
+
1912
+ i18n-pagerFirstPage="kendo.treelist.pagerFirstPage|The label for the first page button in TreeList pager"
1913
+ pagerFirstPage="Go to the first page"
1914
+
1915
+ i18n-pagerPreviousPage="kendo.treelist.pagerPreviousPage|The label for the previous page button in TreeList pager"
1916
+ pagerPreviousPage="Go to the previous page"
1917
+
1918
+ i18n-pagerNextPage="kendo.treelist.pagerNextPage|The label for the next page button in TreeList pager"
1919
+ pagerNextPage="Go to the next page"
1920
+
1921
+ i18n-pagerLastPage="kendo.treelist.pagerLastPage|The label for the last page button in TreeList pager"
1922
+ pagerLastPage="Go to the last page"
1923
+
1924
+ i18n-pagerPage="kendo.treelist.pagerPage|The label before the current page number in the TreeList pager"
1925
+ pagerPage="Page"
1926
+
1927
+ i18n-pagerOf="kendo.treelist.pagerOf|The label before the total pages number in the TreeList pager"
1928
+ pagerOf="of"
1929
+
1930
+ i18n-pagerPageNumberInputTitle="kendo.treelist.pagerPageNumberInputTitle|The label for the pager input in the Treelist pager"
1931
+ pagerPageNumberInputTitle="Page Number"
1932
+
1933
+ i18n-pagerItemsPerPage="kendo.treelist.pagerItemsPerPage|The label for the page size chooser in the TreeList pager"
1934
+ pagerItemsPerPage="items per page"
1935
+
1936
+ i18n-pagerItemsTotal="kendo.treelist.pagerItemsTotal|The label after the total items count in the TreeList pager"
1937
+ pagerItemsTotal="items total"
1938
+
1939
+ i18n-pagerInputLabel="kendo.treelist.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
1940
+ pagerInputLabel="Type a page number"
1941
+
1942
+ i18n-filterCellOperatorLabel="kendo.treelist.filterCellOperatorLabel|The label of the filter cell operators dropdown"
1943
+ filterCellOperatorLabel="{{ 'Filter cell operators for {columnName}' }}"
1944
+
1945
+ i18n-booleanFilterCellLabel="kendo.treelist.booleanFilterCellLabel|The label of the boolean filter cell dropdown"
1946
+ booleanFilterCellLabel="{{ 'Boolean filter cell for {columnName}' }}"
1947
+
1948
+ i18n-filter="kendo.treelist.filter|The label of the filter cell or icon"
1949
+ filter="Filter"
1950
+
1951
+ i18n-filterEqOperator="kendo.treelist.filterEqOperator|The text of the equal filter operator"
1952
+ filterEqOperator="Is equal to"
1953
+
1954
+ i18n-filterNotEqOperator="kendo.treelist.filterNotEqOperator|The text of the not equal filter operator"
1955
+ filterNotEqOperator="Is not equal to"
1956
+
1957
+ i18n-filterIsNullOperator="kendo.treelist.filterIsNullOperator|The text of the is null filter operator"
1958
+ filterIsNullOperator="Is null"
1959
+
1960
+ i18n-filterIsNotNullOperator="kendo.treelist.filterIsNotNullOperator|The text of the is not null filter operator"
1961
+ filterIsNotNullOperator="Is not null"
1962
+
1963
+ i18n-filterIsEmptyOperator="kendo.treelist.filterIsEmptyOperator|The text of the is empty filter operator"
1964
+ filterIsEmptyOperator="Is empty"
1965
+
1966
+ i18n-filterIsNotEmptyOperator="kendo.treelist.filterIsNotEmptyOperator|The text of the is not empty filter operator"
1967
+ filterIsNotEmptyOperator="Is not empty"
1968
+
1969
+ i18n-filterStartsWithOperator="kendo.treelist.filterStartsWithOperator|The text of the starts with filter operator"
1970
+ filterStartsWithOperator="Starts with"
1971
+
1972
+ i18n-filterContainsOperator="kendo.treelist.filterContainsOperator|The text of the contains filter operator"
1973
+ filterContainsOperator="Contains"
1974
+
1975
+ i18n-filterNotContainsOperator="kendo.treelist.filterNotContainsOperator|The text of the does not contain filter operator"
1976
+ filterNotContainsOperator="Does not contain"
1977
+
1978
+ i18n-filterEndsWithOperator="kendo.treelist.filterEndsWithOperator|The text of the ends with filter operator"
1979
+ filterEndsWithOperator="Ends with"
1980
+
1981
+ i18n-filterGteOperator="kendo.treelist.filterGteOperator|The text of the greater than or equal filter operator"
1982
+ filterGteOperator="Is greater than or equal to"
1983
+
1984
+ i18n-filterGtOperator="kendo.treelist.filterGtOperator|The text of the greater than filter operator"
1985
+ filterGtOperator="Is greater than"
1986
+
1987
+ i18n-filterLteOperator="kendo.treelist.filterLteOperator|The text of the less than or equal filter operator"
1988
+ filterLteOperator="Is less than or equal to"
1989
+
1990
+ i18n-filterLtOperator="kendo.treelist.filterLtOperator|The text of the less than filter operator"
1991
+ filterLtOperator="Is less than"
1992
+
1993
+ i18n-filterIsTrue="kendo.treelist.filterIsTrue|The text of the IsTrue boolean filter option"
1994
+ filterIsTrue="Is True"
1995
+
1996
+ i18n-filterIsFalse="kendo.treelist.filterIsFalse|The text of the IsFalse boolean filter option"
1997
+ filterIsFalse="Is False"
1998
+
1999
+ i18n-filterBooleanAll="kendo.treelist.filterBooleanAll|The text of the (All) boolean filter option"
2000
+ filterBooleanAll="(All)"
2001
+
2002
+ i18n-filterAfterOrEqualOperator="kendo.treelist.filterAfterOrEqualOperator|The text of the after or equal date filter operator"
2003
+ filterAfterOrEqualOperator="Is after or equal to"
2004
+
2005
+ i18n-filterAfterOperator="kendo.treelist.filterAfterOperator|The text of the after date filter operator"
2006
+ filterAfterOperator="Is after"
2007
+
2008
+ i18n-filterBeforeOperator="kendo.treelist.filterBeforeOperator|The text of the before date filter operator"
2009
+ filterBeforeOperator="Is before"
2010
+
2011
+ i18n-filterBeforeOrEqualOperator="kendo.treelist.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"
2012
+ filterBeforeOrEqualOperator="Is before or equal to"
2013
+
2014
+ i18n-filterFilterButton="kendo.treelist.filterFilterButton|The text of the filter button"
2015
+ filterFilterButton="Filter"
2016
+
2017
+ i18n-filterClearButton="kendo.treelist.filterClearButton|The text of the clear filter button"
2018
+ filterClearButton="Clear"
2019
+
2020
+ i18n-filterAndLogic="kendo.treelist.filterAndLogic|The text of the And filter logic"
2021
+ filterAndLogic="And"
2022
+
2023
+ i18n-filterOrLogic="kendo.treelist.filterOrLogic|The text of the Or filter logic"
2024
+ filterOrLogic="Or"
2025
+
2026
+ i18n-filterDateToday="kendo.treelist.filterDateToday|The text of the Today button of the Date filter."
2027
+ filterDateToday="TODAY"
2028
+
2029
+ i18n-filterDateToggle="kendo.treelist.filterDateToggle|The title of the Toggle button of the Date filter."
2030
+ filterDateToggle="Toggle Calendar"
2031
+
2032
+ i18n-filterNumericDecrement="kendo.treelist.filterNumericDecrement|The title of the Decrement button of the Numeric filter."
2033
+ filterNumericDecrement="Decrement"
2034
+
2035
+ i18n-filterNumericIncrement="kendo.treelist.filterNumericIncrement|The title of the Increment button of the Numeric filter."
2036
+ filterNumericIncrement="Increment"
2037
+
2038
+ i18n-loading="kendo.treelist.loading|The loading text"
2039
+ loading="Loading"
2040
+
2041
+ i18n-filterInputLabel="kendo.treelist.filterInputLabel|The label of the filter row and menu inputs"
2042
+ filterInputLabel="{{ '{columnName} Filter' }}"
2043
+
2044
+ i18n-filterMenuLogicDropDownLabel="kendo.treelist.filterMenuLogicDropDownLabel|The label of the filter menu logic dropdown"
2045
+ filterMenuLogicDropDownLabel="{{ '{columnName} Filter Logic' }}"
2046
+
2047
+ i18n-filterMenuOperatorsDropDownLabel="kendo.treelist.filterMenuOperatorsDropDownLabel|The label of the filter menu operators dropdown"
2048
+ filterMenuOperatorsDropDownLabel="{{ '{columnName} Filter Operators' }}"
2049
+
2050
+ i18n-filterMenuTitle="kendo.treelist.filterMenuTitle|The title of the filter menu icon"
2051
+ filterMenuTitle="{{ '{columnName} Filter Menu' }}"
2052
+
2053
+ i18n-columnMenu="kendo.treelist.columnMenu|The title of the column menu icon"
2054
+ columnMenu="{{ '{columnName} Column Menu' }}"
2055
+
2056
+ i18n-columns="kendo.treelist.columns|The text shown in the column menu for the columns item"
2057
+ columns="Columns"
2058
+
2059
+ i18n-lock="kendo.treelist.lock|The text shown in the column menu for the lock item"
2060
+ lock="Lock"
2061
+
2062
+ i18n-unlock="kendo.treelist.unlock|The text shown in the column menu for the unlock item"
2063
+ unlock="Unlock"
2064
+
2065
+ i18n-sortable="kendo.treelist.sortable|The label of the sort icon"
2066
+ sortable="Sortable"
2067
+
2068
+ i18n-sortAscending="kendo.treelist.sortAscending|The text shown in the column menu for the sort ascending item"
2069
+ sortAscending="Sort Ascending"
2070
+
2071
+ i18n-sortDescending="kendo.treelist.sortDescending|The text shown in the column menu for the sort descending item"
2072
+ sortDescending="Sort Descending"
2073
+
2074
+ i18n-sortedDefault="kendo.treelist.sortedDefault|The status announcement when a column is no longer sorted"
2075
+ sortedDefault="Not Sorted"
2076
+
2077
+ i18n-columnsApply="kendo.treelist.columnsApply|The text shown in the column menu or column chooser for the columns apply button"
2078
+ columnsApply="Apply"
2079
+
2080
+ i18n-columnsReset="kendo.treelist.columnsReset|The text shown in the column menu or column chooser for the columns reset button"
2081
+ columnsReset="Reset"
2082
+
2083
+ i18n-pagerSelectPage="kendo.treelist.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the TreeList Pager"
2084
+ pagerSelectPage="Select page"
2085
+
2086
+ i18n-topToolbarLabel="kendo.treelist.topToolbarLabel|The label of the TreeList top toolbar"
2087
+ topToolbarLabel="Top toolbar"
2088
+
2089
+ i18n-bottomToolbarLabel="kendo.treelist.bottomToolbarLabel|The label of the TreeList bottom toolbar"
2090
+ bottomToolbarLabel="Bottom toolbar"
2091
+
2092
+ i18n-dragRowHandleLabel="kendo.treelist.dragRowHandleLabel|The label for the TreeList drag row handle"
2093
+ dragRowHandleLabel="Drag row"
2094
+
2095
+ i18n-selectRowCheckboxLabel="kendo.treelist.selectRowCheckboxLabel|The label for the select row checkbox"
2096
+ selectRowCheckboxLabel="Select row"
2097
+
2098
+ i18n-selectAllRowsCheckboxLabel="kendo.treelist.selectAllRowsCheckboxLabel|The label for the select all rows checkbox"
2099
+ selectAllRowsCheckboxLabel="Select all rows"
2100
+
2101
+ i18n-autosizeAllColumns="kendo.treelist.autosizeAllColumns|The text shown in the column menu for the autosize all columns item"
2102
+ autosizeAllColumns="Autosize All Columns"
2103
+
2104
+ i18n-autosizeThisColumn="kendo.treelist.autosizeThisColumn|The text shown in the column menu for the autosize this column item"
2105
+ autosizeThisColumn="Autosize This Column"
2106
+ >
2104
2107
  </ng-container>
2105
- <kendo-treelist-toolbar
2106
- *ngIf="showTopToolbar"
2108
+ @if (showTopToolbar) {
2109
+ <kendo-treelist-toolbar
2107
2110
  position="top"
2108
2111
  [navigable]="navigable"
2109
2112
  [attr.aria-label]="messageFor('topToolbarLabel')"
2110
- [attr.aria-controls]="ariaRootId"></kendo-treelist-toolbar>
2113
+ [attr.aria-controls]="ariaRootId"></kendo-treelist-toolbar>
2114
+ }
2111
2115
  <ng-content select="kendo-toolbar"></ng-content>
2112
2116
  <div #ariaRoot
2113
- class="k-grid-aria-root"
2114
- role="treegrid"
2115
- [id]="ariaRootId"
2116
- [attr.aria-rowcount]="ariaRowCount"
2117
- [attr.aria-colcount]="ariaColCount"
2118
- [attr.aria-multiselectable]="ariaMultiselectable"
2119
- [attr.aria-label]="ariaLabel"
2120
- kendoDragTargetContainer
2121
- kendoDropTargetContainer
2122
- mode="manual"
2123
- [dragDisabled]="!rowReorderable"
2124
- [dropDisabled]="!rowReorderable"
2125
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2126
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2127
- [dragHandle]="getDefaultSelectors('handle')"
2128
- [hint]="{hintTemplate: defaultHint}"
2129
- (onPress)="handleReorderEvents($event, 'press')"
2130
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
2131
- (onDrag)="handleReorderEvents($event, 'drag')"
2132
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2133
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2134
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2135
- (onDrop)="handleReorderEvents($event, 'drop')"
2136
- [dragData]="treeListData">
2137
- <ng-template [ngIf]="isScrollable">
2138
- <div *ngIf="!hideHeader"
2139
- class="k-grid-header"
2140
- role="presentation"
2141
- [style.padding]="headerPadding">
2142
- <div *ngIf="isLocked"
2143
- #lockedHeader
2144
- role="presentation"
2145
- class="k-grid-header-locked"
2146
- [style.width.px]="lockedWidth">
2147
- <table
2148
- kendoTreeListResizableTable
2149
- [locked]="true"
2150
- role="presentation"
2151
- [style.width.px]="lockedWidth"
2152
- class="k-grid-header-table k-table k-table-md">
2153
- <colgroup
2154
- kendoTreeListColGroup
2155
- [columns]="$any(lockedLeafColumns)">
2156
- </colgroup>
2157
- <thead kendoTreeListHeader
2158
- role="rowgroup"
2159
- [resizable]="resizable"
2160
- [scrollable]="true"
2161
- [columns]="$any(lockedColumns)"
2162
- [totalColumnLevels]="totalColumnLevels"
2163
- [sort]="sort"
2164
- [filter]="filter"
2165
- [filterable]="filterable"
2166
- [reorderable]="reorderable"
2167
- [sortable]="sortable"
2168
- [columnMenu]="columnMenuOptions"
2169
- [columnMenuTemplate]="columnMenuTemplate"
2170
- [totalColumnsCount]="leafColumns.length"
2171
- [totalColumns]="columnsContainer"
2172
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2173
- </thead>
2174
- </table>
2175
- </div>
2176
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2177
- [kendoTreeListResizableContainer]="lockedLeafColumns.length > 0"
2178
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2179
- <table
2180
- role="presentation"
2181
- [style.width.px]="nonLockedWidth"
2182
- kendoTreeListResizableTable
2183
- [virtualColumns]="virtualColumns"
2184
- class="k-grid-header-table k-table k-table-md">
2185
- <colgroup
2186
- kendoTreeListColGroup
2187
- [columns]="headerLeafColumns">
2188
- </colgroup>
2189
- <thead kendoTreeListHeader
2190
- [resizable]="resizable"
2191
- role="rowgroup"
2192
- [scrollable]="true"
2193
- [columns]="headerColumns"
2194
- [totalColumnLevels]="totalColumnLevels"
2195
- [sort]="sort"
2196
- [filter]="filter"
2197
- [filterable]="filterable"
2198
- [reorderable]="reorderable"
2199
- [sortable]="sortable"
2200
- [columnMenu]="columnMenuOptions"
2201
- [columnMenuTemplate]="columnMenuTemplate"
2202
- [lockedColumnsCount]="lockedLeafColumns.length"
2203
- [totalColumnsCount]="leafColumns.length"
2204
- [totalColumns]="columnsContainer"
2205
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2206
- </thead>
2207
- </table>
2208
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2209
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2210
- </div>
2211
- </div>
2212
- </div>
2213
- <kendo-treelist-list
2214
- [view]="view"
2215
- [loading]="showLoading"
2216
- [rowHeight]="rowHeight"
2217
- [total]="totalCount"
2218
- [take]="pageSize"
2219
- [skip]="skip"
2220
- [trackBy]="trackBy"
2221
- [columns]="columnsContainer"
2222
- [filterable]="filterable"
2223
- [noRecordsTemplate]="noRecordsTemplate"
2224
- (pageChange)="notifyPageChange('list', $event)"
2225
- [rowClass]="rowClass"
2226
- [isVirtual]="isVirtual"
2227
- [virtualColumns]="virtualColumns"
2228
- [expandIcons]="expandIcons"
2229
- (scrollBottom)="notifyScrollBottom()"
2230
- (contentScroll)="contentScroll.emit($event)"
2231
- kendoDraggable
2232
- kendoTreeListSelectionMarquee
2233
- [enableDrag]="marqueeSelection">
2234
- </kendo-treelist-list>
2235
- </ng-template>
2236
- <ng-template [ngIf]="!isScrollable">
2237
- <table
2238
- class="k-table k-table-md k-grid-header-table"
2117
+ class="k-grid-aria-root"
2118
+ role="treegrid"
2119
+ [id]="ariaRootId"
2120
+ [attr.aria-rowcount]="ariaRowCount"
2121
+ [attr.aria-colcount]="ariaColCount"
2122
+ [attr.aria-multiselectable]="ariaMultiselectable"
2123
+ [attr.aria-label]="ariaLabel"
2124
+ kendoDragTargetContainer
2125
+ kendoDropTargetContainer
2126
+ mode="manual"
2127
+ [dragDisabled]="!rowReorderable"
2128
+ [dropDisabled]="!rowReorderable"
2129
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2130
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2131
+ [dragHandle]="getDefaultSelectors('handle')"
2132
+ [hint]="{hintTemplate: defaultHint}"
2133
+ (onPress)="handleReorderEvents($event, 'press')"
2134
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
2135
+ (onDrag)="handleReorderEvents($event, 'drag')"
2136
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2137
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2138
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2139
+ (onDrop)="handleReorderEvents($event, 'drop')"
2140
+ [dragData]="treeListData">
2141
+ @if (isScrollable) {
2142
+ @if (!hideHeader) {
2143
+ <div
2144
+ class="k-grid-header"
2145
+ role="presentation"
2146
+ [style.padding]="headerPadding">
2147
+ @if (isLocked) {
2148
+ <div
2149
+ #lockedHeader
2239
2150
  role="presentation"
2240
- [style.table-layout]="resizable ? 'fixed' : null"
2241
- kendoTreeListResizableTable>
2242
- <colgroup
2151
+ class="k-grid-header-locked"
2152
+ [style.width.px]="lockedWidth">
2153
+ <table
2154
+ kendoTreeListResizableTable
2155
+ [locked]="true"
2156
+ role="presentation"
2157
+ [style.width.px]="lockedWidth"
2158
+ class="k-grid-header-table k-table k-table-md">
2159
+ <colgroup
2243
2160
  kendoTreeListColGroup
2244
- [columns]="$any(leafColumns)">
2161
+ [columns]="$any(lockedLeafColumns)">
2245
2162
  </colgroup>
2246
2163
  <thead kendoTreeListHeader
2247
- *ngIf="!hideHeader"
2248
- role="rowgroup"
2249
- [resizable]="resizable"
2250
- [scrollable]="false"
2251
- [columns]="$any(visibleColumns)"
2252
- [totalColumnLevels]="totalColumnLevels"
2253
- [reorderable]="reorderable"
2254
- [sort]="sort"
2255
- [sortable]="sortable"
2256
- [filter]="filter"
2257
- [filterable]="filterable"
2258
- [columnMenu]="columnMenuOptions"
2259
- [columnMenuTemplate]="columnMenuTemplate"
2260
- [totalColumns]="columnsContainer"
2261
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2164
+ role="rowgroup"
2165
+ [resizable]="resizable"
2166
+ [scrollable]="true"
2167
+ [columns]="$any(lockedColumns)"
2168
+ [totalColumnLevels]="totalColumnLevels"
2169
+ [sort]="sort"
2170
+ [filter]="filter"
2171
+ [filterable]="filterable"
2172
+ [reorderable]="reorderable"
2173
+ [sortable]="sortable"
2174
+ [columnMenu]="columnMenuOptions"
2175
+ [columnMenuTemplate]="columnMenuTemplate"
2176
+ [totalColumnsCount]="leafColumns.length"
2177
+ [totalColumns]="columnsContainer"
2178
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2262
2179
  </thead>
2263
- <tbody kendoTreeListTableBody
2264
- [view]="view"
2265
- [skip]="skip"
2266
- [columns]="$any(leafColumns)"
2267
- [filterable]="filterable"
2268
- [noRecordsTemplate]="noRecordsTemplate"
2269
- [trackBy]="trackBy"
2270
- [rowClass]="rowClass"
2271
- [expandIcons]="expandIcons"
2272
- kendoDraggable
2273
- kendoTreeListSelectionMarquee
2274
- [enableDrag]="marqueeSelection">
2275
- </tbody>
2276
- </table>
2277
- <div *ngIf="showLoading" kendoTreeListLoading>
2180
+ </table>
2278
2181
  </div>
2279
- </ng-template>
2182
+ }
2183
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2184
+ [kendoTreeListResizableContainer]="lockedLeafColumns.length > 0"
2185
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2186
+ <table
2187
+ role="presentation"
2188
+ [style.width.px]="nonLockedWidth"
2189
+ kendoTreeListResizableTable
2190
+ [virtualColumns]="virtualColumns"
2191
+ class="k-grid-header-table k-table k-table-md">
2192
+ <colgroup
2193
+ kendoTreeListColGroup
2194
+ [columns]="headerLeafColumns">
2195
+ </colgroup>
2196
+ <thead kendoTreeListHeader
2197
+ [resizable]="resizable"
2198
+ role="rowgroup"
2199
+ [scrollable]="true"
2200
+ [columns]="headerColumns"
2201
+ [totalColumnLevels]="totalColumnLevels"
2202
+ [sort]="sort"
2203
+ [filter]="filter"
2204
+ [filterable]="filterable"
2205
+ [reorderable]="reorderable"
2206
+ [sortable]="sortable"
2207
+ [columnMenu]="columnMenuOptions"
2208
+ [columnMenuTemplate]="columnMenuTemplate"
2209
+ [lockedColumnsCount]="lockedLeafColumns.length"
2210
+ [totalColumnsCount]="leafColumns.length"
2211
+ [totalColumns]="columnsContainer"
2212
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2213
+ </thead>
2214
+ </table>
2215
+ @if (virtualColumns) {
2216
+ <div class="k-width-container" role="presentation">
2217
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2218
+ </div>
2219
+ }
2220
+ </div>
2221
+ </div>
2222
+ }
2223
+ <kendo-treelist-list
2224
+ [view]="view"
2225
+ [loading]="showLoading"
2226
+ [rowHeight]="rowHeight"
2227
+ [total]="totalCount"
2228
+ [take]="pageSize"
2229
+ [skip]="skip"
2230
+ [trackBy]="trackBy"
2231
+ [columns]="columnsContainer"
2232
+ [filterable]="filterable"
2233
+ [noRecordsTemplate]="noRecordsTemplate"
2234
+ (pageChange)="notifyPageChange('list', $event)"
2235
+ [rowClass]="rowClass"
2236
+ [isVirtual]="isVirtual"
2237
+ [virtualColumns]="virtualColumns"
2238
+ [expandIcons]="expandIcons"
2239
+ (scrollBottom)="notifyScrollBottom()"
2240
+ (contentScroll)="contentScroll.emit($event)"
2241
+ kendoDraggable
2242
+ kendoTreeListSelectionMarquee
2243
+ [enableDrag]="marqueeSelection">
2244
+ </kendo-treelist-list>
2245
+ }
2246
+ @if (!isScrollable) {
2247
+ <table
2248
+ class="k-table k-table-md k-grid-header-table"
2249
+ role="presentation"
2250
+ [style.table-layout]="resizable ? 'fixed' : null"
2251
+ kendoTreeListResizableTable>
2252
+ <colgroup
2253
+ kendoTreeListColGroup
2254
+ [columns]="$any(leafColumns)">
2255
+ </colgroup>
2256
+ @if (!hideHeader) {
2257
+ <thead kendoTreeListHeader
2258
+ role="rowgroup"
2259
+ [resizable]="resizable"
2260
+ [scrollable]="false"
2261
+ [columns]="$any(visibleColumns)"
2262
+ [totalColumnLevels]="totalColumnLevels"
2263
+ [reorderable]="reorderable"
2264
+ [sort]="sort"
2265
+ [sortable]="sortable"
2266
+ [filter]="filter"
2267
+ [filterable]="filterable"
2268
+ [columnMenu]="columnMenuOptions"
2269
+ [columnMenuTemplate]="columnMenuTemplate"
2270
+ [totalColumns]="columnsContainer"
2271
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2272
+ </thead>
2273
+ }
2274
+ <tbody kendoTreeListTableBody
2275
+ [view]="view"
2276
+ [skip]="skip"
2277
+ [columns]="$any(leafColumns)"
2278
+ [filterable]="filterable"
2279
+ [noRecordsTemplate]="noRecordsTemplate"
2280
+ [trackBy]="trackBy"
2281
+ [rowClass]="rowClass"
2282
+ [expandIcons]="expandIcons"
2283
+ kendoDraggable
2284
+ kendoTreeListSelectionMarquee
2285
+ [enableDrag]="marqueeSelection">
2286
+ </tbody>
2287
+ </table>
2288
+ @if (showLoading) {
2289
+ <div kendoTreeListLoading>
2290
+ </div>
2291
+ }
2292
+ }
2280
2293
  </div>
2281
- <kendo-pager
2294
+ @if (showPager) {
2295
+ <kendo-pager
2282
2296
  #pager
2283
- *ngIf="showPager"
2284
2297
  class="k-grid-pager"
2285
2298
  [navigable]="navigable"
2286
2299
  [pageSize]="pageSize"
@@ -2297,75 +2310,88 @@ export class TreeListComponent {
2297
2310
  (pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
2298
2311
  (itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
2299
2312
  <ng-template kendoPagerTemplate>
2300
- <ng-container
2301
- [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
2302
- [ngTemplateOutletContext]="pager.templateContext"></ng-container>
2313
+ <ng-container
2314
+ [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
2315
+ [ngTemplateOutletContext]="pager.templateContext"></ng-container>
2303
2316
  </ng-template>
2304
2317
  <kendo-pager-messages
2305
- [ariaLabel]="messageFor('pagerLabel')"
2306
- [firstPage]="messageFor('pagerFirstPage')"
2307
- [inputLabel]="messageFor('pagerInputLabel')"
2308
- [previousPage]="messageFor('pagerPreviousPage')"
2309
- [nextPage]="messageFor('pagerNextPage')"
2310
- [lastPage]="messageFor('pagerLastPage')"
2311
- [selectPage]="messageFor('pagerSelectPage')"
2312
- [page]="messageFor('pagerPage')"
2313
- [itemsPerPage]="messageFor('pagerItemsPerPage')"
2314
- [items]="messageFor('pagerItems')"
2315
- [of]="messageFor('pagerOf')"
2316
- [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2318
+ [ariaLabel]="messageFor('pagerLabel')"
2319
+ [firstPage]="messageFor('pagerFirstPage')"
2320
+ [inputLabel]="messageFor('pagerInputLabel')"
2321
+ [previousPage]="messageFor('pagerPreviousPage')"
2322
+ [nextPage]="messageFor('pagerNextPage')"
2323
+ [lastPage]="messageFor('pagerLastPage')"
2324
+ [selectPage]="messageFor('pagerSelectPage')"
2325
+ [page]="messageFor('pagerPage')"
2326
+ [itemsPerPage]="messageFor('pagerItemsPerPage')"
2327
+ [items]="messageFor('pagerItems')"
2328
+ [of]="messageFor('pagerOf')"
2329
+ [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2317
2330
  </kendo-pager-messages>
2318
- </kendo-pager>
2319
- <kendo-treelist-toolbar
2320
- *ngIf="showBottomToolbar"
2331
+ </kendo-pager>
2332
+ }
2333
+ @if (showBottomToolbar) {
2334
+ <kendo-treelist-toolbar
2321
2335
  class="k-grid-toolbar-bottom"
2322
2336
  position="bottom"
2323
2337
  [navigable]="navigable"
2324
2338
  [attr.aria-label]="messageFor('bottomToolbarLabel')"
2325
2339
  [attr.aria-controls]="ariaRootId">
2326
- </kendo-treelist-toolbar>
2327
-
2340
+ </kendo-treelist-toolbar>
2341
+ }
2342
+
2328
2343
  <ng-template #defaultHint>
2329
- <kendo-icon-wrapper
2330
- [name]="getHintSettings('hintIcon')"
2331
- [svgIcon]="getHintSettings('hintSVGIcon')"
2332
- innerCssClass="k-drag-status">
2333
- </kendo-icon-wrapper>
2334
- {{hintText}}
2344
+ <kendo-icon-wrapper
2345
+ [name]="getHintSettings('hintIcon')"
2346
+ [svgIcon]="getHintSettings('hintSVGIcon')"
2347
+ innerCssClass="k-drag-status">
2348
+ </kendo-icon-wrapper>
2349
+ {{hintText}}
2335
2350
  </ng-template>
2336
-
2351
+
2337
2352
  <ng-template #defaultPager>
2338
- <div class="k-pager-numbers-wrap">
2339
- <kendo-pager-prev-buttons *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-prev-buttons>
2340
- <kendo-pager-numeric-buttons
2341
- *ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
2342
- [buttonCount]="normalizedPageableSettings.buttonCount">
2343
- </kendo-pager-numeric-buttons>
2344
- <kendo-pager-input *ngIf="normalizedPageableSettings.type === 'input' || showPagerInput" [showPageText]="showPagerPageText"></kendo-pager-input>
2345
- <kendo-pager-next-buttons *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
2346
- </div>
2347
- <kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
2348
- [pageSizes]="normalizedPageableSettings.pageSizes"
2349
- [showItemsText]="showPagerItemsText">
2353
+ <div class="k-pager-numbers-wrap">
2354
+ @if (normalizedPageableSettings.previousNext) {
2355
+ <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
2356
+ }
2357
+ @if (normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0) {
2358
+ <kendo-pager-numeric-buttons
2359
+ [buttonCount]="normalizedPageableSettings.buttonCount">
2360
+ </kendo-pager-numeric-buttons>
2361
+ }
2362
+ @if (normalizedPageableSettings.type === 'input' || showPagerInput) {
2363
+ <kendo-pager-input [showPageText]="showPagerPageText"></kendo-pager-input>
2364
+ }
2365
+ @if (normalizedPageableSettings.previousNext) {
2366
+ <kendo-pager-next-buttons></kendo-pager-next-buttons>
2367
+ }
2368
+ </div>
2369
+ @if (normalizedPageableSettings.pageSizes) {
2370
+ <kendo-pager-page-sizes
2371
+ [pageSizes]="normalizedPageableSettings.pageSizes"
2372
+ [showItemsText]="showPagerItemsText">
2350
2373
  </kendo-pager-page-sizes>
2351
- <kendo-pager-info *ngIf="normalizedPageableSettings.info">
2374
+ }
2375
+ @if (normalizedPageableSettings.info) {
2376
+ <kendo-pager-info>
2352
2377
  </kendo-pager-info>
2353
- <kendo-pager-messages
2354
- [ariaLabel]="messageFor('pagerLabel')"
2355
- [firstPage]="messageFor('pagerFirstPage')"
2356
- [inputLabel]="messageFor('pagerInputLabel')"
2357
- [previousPage]="messageFor('pagerPreviousPage')"
2358
- [nextPage]="messageFor('pagerNextPage')"
2359
- [lastPage]="messageFor('pagerLastPage')"
2360
- [selectPage]="messageFor('pagerSelectPage')"
2361
- [page]="messageFor('pagerPage')"
2362
- [itemsPerPage]="messageFor('pagerItemsPerPage')"
2363
- [items]="messageFor('pagerItems')"
2364
- [of]="messageFor('pagerOf')"
2365
- [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2366
- </kendo-pager-messages>
2378
+ }
2379
+ <kendo-pager-messages
2380
+ [ariaLabel]="messageFor('pagerLabel')"
2381
+ [firstPage]="messageFor('pagerFirstPage')"
2382
+ [inputLabel]="messageFor('pagerInputLabel')"
2383
+ [previousPage]="messageFor('pagerPreviousPage')"
2384
+ [nextPage]="messageFor('pagerNextPage')"
2385
+ [lastPage]="messageFor('pagerLastPage')"
2386
+ [selectPage]="messageFor('pagerSelectPage')"
2387
+ [page]="messageFor('pagerPage')"
2388
+ [itemsPerPage]="messageFor('pagerItemsPerPage')"
2389
+ [items]="messageFor('pagerItems')"
2390
+ [of]="messageFor('pagerOf')"
2391
+ [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2392
+ </kendo-pager-messages>
2367
2393
  </ng-template>
2368
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoTreeListLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ToolbarComponent, selector: "kendo-treelist-toolbar", inputs: ["position", "navigable"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode", "cursorStyle", "hintContext"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: TableDirective, selector: "[kendoTreeListResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoTreeListColGroup]", inputs: ["columns"] }, { kind: "component", type: HeaderComponent, selector: "[kendoTreeListHeader]", inputs: ["totalColumnLevels", "columns", "scrollable", "filterable", "sort", "filter", "sortable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoTreeListResizableContainer]", inputs: ["lockedWidth", "kendoTreeListResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-treelist-list", inputs: ["view", "total", "rowHeight", "take", "skip", "columns", "noRecordsTemplate", "filterable", "rowClass", "loading", "trackBy", "virtualColumns", "isVirtual", "expandIcons"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: MarqueeDirective, selector: "[kendoTreeListSelectionMarquee]" }, { kind: "component", type: TableBodyComponent, selector: "[kendoTreeListTableBody]", inputs: ["columns", "allColumns", "noRecordsTemplate", "view", "skip", "filterable", "noRecordsText", "isLocked", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "expandIcons", "trackBy", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoTreeListLoading]" }, { kind: "component", type: i22.CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: i22.PagerInfoComponent, selector: "kendo-datapager-info, kendo-pager-info" }, { kind: "component", type: i22.PagerInputComponent, selector: "kendo-datapager-input, kendo-pager-input", inputs: ["showPageText", "size"] }, { kind: "component", type: i22.PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons, kendo-pager-next-buttons", inputs: ["size"] }, { kind: "component", type: i22.PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons, kendo-pager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: i22.PagerPageSizesComponent, selector: "kendo-datapager-page-sizes, kendo-pager-page-sizes", inputs: ["showItemsText", "pageSizes", "size", "adaptiveMode"] }, { kind: "component", type: i22.PagerPrevButtonsComponent, selector: "kendo-datapager-prev-buttons, kendo-pager-prev-buttons", inputs: ["size"] }, { kind: "directive", type: i22.PagerTemplateDirective, selector: "[kendoDataPagerTemplate], [kendoPagerTemplate]" }, { kind: "component", type: i22.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange", "pagerInputVisibilityChange", "pageTextVisibilityChange", "itemsTextVisibilityChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2394
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoTreeListLocalizedMessages]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ToolbarComponent, selector: "kendo-treelist-toolbar", inputs: ["position", "navigable"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode", "cursorStyle", "hintContext"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: TableDirective, selector: "[kendoTreeListResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoTreeListColGroup]", inputs: ["columns"] }, { kind: "component", type: HeaderComponent, selector: "[kendoTreeListHeader]", inputs: ["totalColumnLevels", "columns", "scrollable", "filterable", "sort", "filter", "sortable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoTreeListResizableContainer]", inputs: ["lockedWidth", "kendoTreeListResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-treelist-list", inputs: ["view", "total", "rowHeight", "take", "skip", "columns", "noRecordsTemplate", "filterable", "rowClass", "loading", "trackBy", "virtualColumns", "isVirtual", "expandIcons"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: MarqueeDirective, selector: "[kendoTreeListSelectionMarquee]" }, { kind: "component", type: TableBodyComponent, selector: "[kendoTreeListTableBody]", inputs: ["columns", "allColumns", "noRecordsTemplate", "view", "skip", "filterable", "noRecordsText", "isLocked", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "expandIcons", "trackBy", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoTreeListLoading]" }, { kind: "component", type: i22.CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: i22.PagerInfoComponent, selector: "kendo-datapager-info, kendo-pager-info" }, { kind: "component", type: i22.PagerInputComponent, selector: "kendo-datapager-input, kendo-pager-input", inputs: ["showPageText", "size"] }, { kind: "component", type: i22.PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons, kendo-pager-next-buttons", inputs: ["size"] }, { kind: "component", type: i22.PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons, kendo-pager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: i22.PagerPageSizesComponent, selector: "kendo-datapager-page-sizes, kendo-pager-page-sizes", inputs: ["showItemsText", "pageSizes", "size", "adaptiveMode"] }, { kind: "component", type: i22.PagerPrevButtonsComponent, selector: "kendo-datapager-prev-buttons, kendo-pager-prev-buttons", inputs: ["size"] }, { kind: "directive", type: i22.PagerTemplateDirective, selector: "[kendoDataPagerTemplate], [kendoPagerTemplate]" }, { kind: "component", type: i22.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange", "pagerInputVisibilityChange", "pageTextVisibilityChange", "itemsTextVisibilityChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2369
2395
  }
2370
2396
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TreeListComponent, decorators: [{
2371
2397
  type: Component,
@@ -2421,387 +2447,397 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
2421
2447
  selector: 'kendo-treelist',
2422
2448
  template: `
2423
2449
  <ng-container kendoTreeListLocalizedMessages
2424
- i18n-noRecords="kendo.treelist.noRecords|The label visible in the TreeList when there are no records"
2425
- noRecords="No records available."
2426
-
2427
- i18n-pagerLabel="kendo.treelist.pagerLabel|The label for the TreeList pager"
2428
- pagerLabel="{{ 'Page navigation, page {currentPage} of {totalPages}' }}"
2429
-
2430
- i18n-pagerFirstPage="kendo.treelist.pagerFirstPage|The label for the first page button in TreeList pager"
2431
- pagerFirstPage="Go to the first page"
2432
-
2433
- i18n-pagerPreviousPage="kendo.treelist.pagerPreviousPage|The label for the previous page button in TreeList pager"
2434
- pagerPreviousPage="Go to the previous page"
2435
-
2436
- i18n-pagerNextPage="kendo.treelist.pagerNextPage|The label for the next page button in TreeList pager"
2437
- pagerNextPage="Go to the next page"
2438
-
2439
- i18n-pagerLastPage="kendo.treelist.pagerLastPage|The label for the last page button in TreeList pager"
2440
- pagerLastPage="Go to the last page"
2441
-
2442
- i18n-pagerPage="kendo.treelist.pagerPage|The label before the current page number in the TreeList pager"
2443
- pagerPage="Page"
2444
-
2445
- i18n-pagerOf="kendo.treelist.pagerOf|The label before the total pages number in the TreeList pager"
2446
- pagerOf="of"
2447
-
2448
- i18n-pagerPageNumberInputTitle="kendo.treelist.pagerPageNumberInputTitle|The label for the pager input in the Treelist pager"
2449
- pagerPageNumberInputTitle="Page Number"
2450
-
2451
- i18n-pagerItemsPerPage="kendo.treelist.pagerItemsPerPage|The label for the page size chooser in the TreeList pager"
2452
- pagerItemsPerPage="items per page"
2453
-
2454
- i18n-pagerItemsTotal="kendo.treelist.pagerItemsTotal|The label after the total items count in the TreeList pager"
2455
- pagerItemsTotal="items total"
2456
-
2457
- i18n-pagerInputLabel="kendo.treelist.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
2458
- pagerInputLabel="Type a page number"
2459
-
2460
- i18n-filterCellOperatorLabel="kendo.treelist.filterCellOperatorLabel|The label of the filter cell operators dropdown"
2461
- filterCellOperatorLabel="{{ 'Filter cell operators for {columnName}' }}"
2462
-
2463
- i18n-booleanFilterCellLabel="kendo.treelist.booleanFilterCellLabel|The label of the boolean filter cell dropdown"
2464
- booleanFilterCellLabel="{{ 'Boolean filter cell for {columnName}' }}"
2465
-
2466
- i18n-filter="kendo.treelist.filter|The label of the filter cell or icon"
2467
- filter="Filter"
2468
-
2469
- i18n-filterEqOperator="kendo.treelist.filterEqOperator|The text of the equal filter operator"
2470
- filterEqOperator="Is equal to"
2471
-
2472
- i18n-filterNotEqOperator="kendo.treelist.filterNotEqOperator|The text of the not equal filter operator"
2473
- filterNotEqOperator="Is not equal to"
2474
-
2475
- i18n-filterIsNullOperator="kendo.treelist.filterIsNullOperator|The text of the is null filter operator"
2476
- filterIsNullOperator="Is null"
2477
-
2478
- i18n-filterIsNotNullOperator="kendo.treelist.filterIsNotNullOperator|The text of the is not null filter operator"
2479
- filterIsNotNullOperator="Is not null"
2480
-
2481
- i18n-filterIsEmptyOperator="kendo.treelist.filterIsEmptyOperator|The text of the is empty filter operator"
2482
- filterIsEmptyOperator="Is empty"
2483
-
2484
- i18n-filterIsNotEmptyOperator="kendo.treelist.filterIsNotEmptyOperator|The text of the is not empty filter operator"
2485
- filterIsNotEmptyOperator="Is not empty"
2486
-
2487
- i18n-filterStartsWithOperator="kendo.treelist.filterStartsWithOperator|The text of the starts with filter operator"
2488
- filterStartsWithOperator="Starts with"
2489
-
2490
- i18n-filterContainsOperator="kendo.treelist.filterContainsOperator|The text of the contains filter operator"
2491
- filterContainsOperator="Contains"
2492
-
2493
- i18n-filterNotContainsOperator="kendo.treelist.filterNotContainsOperator|The text of the does not contain filter operator"
2494
- filterNotContainsOperator="Does not contain"
2495
-
2496
- i18n-filterEndsWithOperator="kendo.treelist.filterEndsWithOperator|The text of the ends with filter operator"
2497
- filterEndsWithOperator="Ends with"
2498
-
2499
- i18n-filterGteOperator="kendo.treelist.filterGteOperator|The text of the greater than or equal filter operator"
2500
- filterGteOperator="Is greater than or equal to"
2501
-
2502
- i18n-filterGtOperator="kendo.treelist.filterGtOperator|The text of the greater than filter operator"
2503
- filterGtOperator="Is greater than"
2504
-
2505
- i18n-filterLteOperator="kendo.treelist.filterLteOperator|The text of the less than or equal filter operator"
2506
- filterLteOperator="Is less than or equal to"
2507
-
2508
- i18n-filterLtOperator="kendo.treelist.filterLtOperator|The text of the less than filter operator"
2509
- filterLtOperator="Is less than"
2510
-
2511
- i18n-filterIsTrue="kendo.treelist.filterIsTrue|The text of the IsTrue boolean filter option"
2512
- filterIsTrue="Is True"
2513
-
2514
- i18n-filterIsFalse="kendo.treelist.filterIsFalse|The text of the IsFalse boolean filter option"
2515
- filterIsFalse="Is False"
2516
-
2517
- i18n-filterBooleanAll="kendo.treelist.filterBooleanAll|The text of the (All) boolean filter option"
2518
- filterBooleanAll="(All)"
2519
-
2520
- i18n-filterAfterOrEqualOperator="kendo.treelist.filterAfterOrEqualOperator|The text of the after or equal date filter operator"
2521
- filterAfterOrEqualOperator="Is after or equal to"
2522
-
2523
- i18n-filterAfterOperator="kendo.treelist.filterAfterOperator|The text of the after date filter operator"
2524
- filterAfterOperator="Is after"
2525
-
2526
- i18n-filterBeforeOperator="kendo.treelist.filterBeforeOperator|The text of the before date filter operator"
2527
- filterBeforeOperator="Is before"
2528
-
2529
- i18n-filterBeforeOrEqualOperator="kendo.treelist.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"
2530
- filterBeforeOrEqualOperator="Is before or equal to"
2531
-
2532
- i18n-filterFilterButton="kendo.treelist.filterFilterButton|The text of the filter button"
2533
- filterFilterButton="Filter"
2534
-
2535
- i18n-filterClearButton="kendo.treelist.filterClearButton|The text of the clear filter button"
2536
- filterClearButton="Clear"
2537
-
2538
- i18n-filterAndLogic="kendo.treelist.filterAndLogic|The text of the And filter logic"
2539
- filterAndLogic="And"
2540
-
2541
- i18n-filterOrLogic="kendo.treelist.filterOrLogic|The text of the Or filter logic"
2542
- filterOrLogic="Or"
2543
-
2544
- i18n-filterDateToday="kendo.treelist.filterDateToday|The text of the Today button of the Date filter."
2545
- filterDateToday="TODAY"
2546
-
2547
- i18n-filterDateToggle="kendo.treelist.filterDateToggle|The title of the Toggle button of the Date filter."
2548
- filterDateToggle="Toggle Calendar"
2549
-
2550
- i18n-filterNumericDecrement="kendo.treelist.filterNumericDecrement|The title of the Decrement button of the Numeric filter."
2551
- filterNumericDecrement="Decrement"
2552
-
2553
- i18n-filterNumericIncrement="kendo.treelist.filterNumericIncrement|The title of the Increment button of the Numeric filter."
2554
- filterNumericIncrement="Increment"
2555
-
2556
- i18n-loading="kendo.treelist.loading|The loading text"
2557
- loading="Loading"
2558
-
2559
- i18n-filterInputLabel="kendo.treelist.filterInputLabel|The label of the filter row and menu inputs"
2560
- filterInputLabel="{{ '{columnName} Filter' }}"
2561
-
2562
- i18n-filterMenuLogicDropDownLabel="kendo.treelist.filterMenuLogicDropDownLabel|The label of the filter menu logic dropdown"
2563
- filterMenuLogicDropDownLabel="{{ '{columnName} Filter Logic' }}"
2564
-
2565
- i18n-filterMenuOperatorsDropDownLabel="kendo.treelist.filterMenuOperatorsDropDownLabel|The label of the filter menu operators dropdown"
2566
- filterMenuOperatorsDropDownLabel="{{ '{columnName} Filter Operators' }}"
2567
-
2568
- i18n-filterMenuTitle="kendo.treelist.filterMenuTitle|The title of the filter menu icon"
2569
- filterMenuTitle="{{ '{columnName} Filter Menu' }}"
2570
-
2571
- i18n-columnMenu="kendo.treelist.columnMenu|The title of the column menu icon"
2572
- columnMenu="{{ '{columnName} Column Menu' }}"
2573
-
2574
- i18n-columns="kendo.treelist.columns|The text shown in the column menu for the columns item"
2575
- columns="Columns"
2576
-
2577
- i18n-lock="kendo.treelist.lock|The text shown in the column menu for the lock item"
2578
- lock="Lock"
2579
-
2580
- i18n-unlock="kendo.treelist.unlock|The text shown in the column menu for the unlock item"
2581
- unlock="Unlock"
2582
-
2583
- i18n-sortable="kendo.treelist.sortable|The label of the sort icon"
2584
- sortable="Sortable"
2585
-
2586
- i18n-sortAscending="kendo.treelist.sortAscending|The text shown in the column menu for the sort ascending item"
2587
- sortAscending="Sort Ascending"
2588
-
2589
- i18n-sortDescending="kendo.treelist.sortDescending|The text shown in the column menu for the sort descending item"
2590
- sortDescending="Sort Descending"
2591
-
2592
- i18n-sortedDefault="kendo.treelist.sortedDefault|The status announcement when a column is no longer sorted"
2593
- sortedDefault="Not Sorted"
2594
-
2595
- i18n-columnsApply="kendo.treelist.columnsApply|The text shown in the column menu or column chooser for the columns apply button"
2596
- columnsApply="Apply"
2597
-
2598
- i18n-columnsReset="kendo.treelist.columnsReset|The text shown in the column menu or column chooser for the columns reset button"
2599
- columnsReset="Reset"
2600
-
2601
- i18n-pagerSelectPage="kendo.treelist.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the TreeList Pager"
2602
- pagerSelectPage="Select page"
2603
-
2604
- i18n-topToolbarLabel="kendo.treelist.topToolbarLabel|The label of the TreeList top toolbar"
2605
- topToolbarLabel="Top toolbar"
2606
-
2607
- i18n-bottomToolbarLabel="kendo.treelist.bottomToolbarLabel|The label of the TreeList bottom toolbar"
2608
- bottomToolbarLabel="Bottom toolbar"
2609
-
2610
- i18n-dragRowHandleLabel="kendo.treelist.dragRowHandleLabel|The label for the TreeList drag row handle"
2611
- dragRowHandleLabel="Drag row"
2612
-
2613
- i18n-selectRowCheckboxLabel="kendo.treelist.selectRowCheckboxLabel|The label for the select row checkbox"
2614
- selectRowCheckboxLabel="Select row"
2615
-
2616
- i18n-selectAllRowsCheckboxLabel="kendo.treelist.selectAllRowsCheckboxLabel|The label for the select all rows checkbox"
2617
- selectAllRowsCheckboxLabel="Select all rows"
2618
-
2619
- i18n-autosizeAllColumns="kendo.treelist.autosizeAllColumns|The text shown in the column menu for the autosize all columns item"
2620
- autosizeAllColumns="Autosize All Columns"
2621
-
2622
- i18n-autosizeThisColumn="kendo.treelist.autosizeThisColumn|The text shown in the column menu for the autosize this column item"
2623
- autosizeThisColumn="Autosize This Column"
2624
- >
2450
+ i18n-noRecords="kendo.treelist.noRecords|The label visible in the TreeList when there are no records"
2451
+ noRecords="No records available."
2452
+
2453
+ i18n-pagerLabel="kendo.treelist.pagerLabel|The label for the TreeList pager"
2454
+ pagerLabel="{{ 'Page navigation, page {currentPage} of {totalPages}' }}"
2455
+
2456
+ i18n-pagerFirstPage="kendo.treelist.pagerFirstPage|The label for the first page button in TreeList pager"
2457
+ pagerFirstPage="Go to the first page"
2458
+
2459
+ i18n-pagerPreviousPage="kendo.treelist.pagerPreviousPage|The label for the previous page button in TreeList pager"
2460
+ pagerPreviousPage="Go to the previous page"
2461
+
2462
+ i18n-pagerNextPage="kendo.treelist.pagerNextPage|The label for the next page button in TreeList pager"
2463
+ pagerNextPage="Go to the next page"
2464
+
2465
+ i18n-pagerLastPage="kendo.treelist.pagerLastPage|The label for the last page button in TreeList pager"
2466
+ pagerLastPage="Go to the last page"
2467
+
2468
+ i18n-pagerPage="kendo.treelist.pagerPage|The label before the current page number in the TreeList pager"
2469
+ pagerPage="Page"
2470
+
2471
+ i18n-pagerOf="kendo.treelist.pagerOf|The label before the total pages number in the TreeList pager"
2472
+ pagerOf="of"
2473
+
2474
+ i18n-pagerPageNumberInputTitle="kendo.treelist.pagerPageNumberInputTitle|The label for the pager input in the Treelist pager"
2475
+ pagerPageNumberInputTitle="Page Number"
2476
+
2477
+ i18n-pagerItemsPerPage="kendo.treelist.pagerItemsPerPage|The label for the page size chooser in the TreeList pager"
2478
+ pagerItemsPerPage="items per page"
2479
+
2480
+ i18n-pagerItemsTotal="kendo.treelist.pagerItemsTotal|The label after the total items count in the TreeList pager"
2481
+ pagerItemsTotal="items total"
2482
+
2483
+ i18n-pagerInputLabel="kendo.treelist.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
2484
+ pagerInputLabel="Type a page number"
2485
+
2486
+ i18n-filterCellOperatorLabel="kendo.treelist.filterCellOperatorLabel|The label of the filter cell operators dropdown"
2487
+ filterCellOperatorLabel="{{ 'Filter cell operators for {columnName}' }}"
2488
+
2489
+ i18n-booleanFilterCellLabel="kendo.treelist.booleanFilterCellLabel|The label of the boolean filter cell dropdown"
2490
+ booleanFilterCellLabel="{{ 'Boolean filter cell for {columnName}' }}"
2491
+
2492
+ i18n-filter="kendo.treelist.filter|The label of the filter cell or icon"
2493
+ filter="Filter"
2494
+
2495
+ i18n-filterEqOperator="kendo.treelist.filterEqOperator|The text of the equal filter operator"
2496
+ filterEqOperator="Is equal to"
2497
+
2498
+ i18n-filterNotEqOperator="kendo.treelist.filterNotEqOperator|The text of the not equal filter operator"
2499
+ filterNotEqOperator="Is not equal to"
2500
+
2501
+ i18n-filterIsNullOperator="kendo.treelist.filterIsNullOperator|The text of the is null filter operator"
2502
+ filterIsNullOperator="Is null"
2503
+
2504
+ i18n-filterIsNotNullOperator="kendo.treelist.filterIsNotNullOperator|The text of the is not null filter operator"
2505
+ filterIsNotNullOperator="Is not null"
2506
+
2507
+ i18n-filterIsEmptyOperator="kendo.treelist.filterIsEmptyOperator|The text of the is empty filter operator"
2508
+ filterIsEmptyOperator="Is empty"
2509
+
2510
+ i18n-filterIsNotEmptyOperator="kendo.treelist.filterIsNotEmptyOperator|The text of the is not empty filter operator"
2511
+ filterIsNotEmptyOperator="Is not empty"
2512
+
2513
+ i18n-filterStartsWithOperator="kendo.treelist.filterStartsWithOperator|The text of the starts with filter operator"
2514
+ filterStartsWithOperator="Starts with"
2515
+
2516
+ i18n-filterContainsOperator="kendo.treelist.filterContainsOperator|The text of the contains filter operator"
2517
+ filterContainsOperator="Contains"
2518
+
2519
+ i18n-filterNotContainsOperator="kendo.treelist.filterNotContainsOperator|The text of the does not contain filter operator"
2520
+ filterNotContainsOperator="Does not contain"
2521
+
2522
+ i18n-filterEndsWithOperator="kendo.treelist.filterEndsWithOperator|The text of the ends with filter operator"
2523
+ filterEndsWithOperator="Ends with"
2524
+
2525
+ i18n-filterGteOperator="kendo.treelist.filterGteOperator|The text of the greater than or equal filter operator"
2526
+ filterGteOperator="Is greater than or equal to"
2527
+
2528
+ i18n-filterGtOperator="kendo.treelist.filterGtOperator|The text of the greater than filter operator"
2529
+ filterGtOperator="Is greater than"
2530
+
2531
+ i18n-filterLteOperator="kendo.treelist.filterLteOperator|The text of the less than or equal filter operator"
2532
+ filterLteOperator="Is less than or equal to"
2533
+
2534
+ i18n-filterLtOperator="kendo.treelist.filterLtOperator|The text of the less than filter operator"
2535
+ filterLtOperator="Is less than"
2536
+
2537
+ i18n-filterIsTrue="kendo.treelist.filterIsTrue|The text of the IsTrue boolean filter option"
2538
+ filterIsTrue="Is True"
2539
+
2540
+ i18n-filterIsFalse="kendo.treelist.filterIsFalse|The text of the IsFalse boolean filter option"
2541
+ filterIsFalse="Is False"
2542
+
2543
+ i18n-filterBooleanAll="kendo.treelist.filterBooleanAll|The text of the (All) boolean filter option"
2544
+ filterBooleanAll="(All)"
2545
+
2546
+ i18n-filterAfterOrEqualOperator="kendo.treelist.filterAfterOrEqualOperator|The text of the after or equal date filter operator"
2547
+ filterAfterOrEqualOperator="Is after or equal to"
2548
+
2549
+ i18n-filterAfterOperator="kendo.treelist.filterAfterOperator|The text of the after date filter operator"
2550
+ filterAfterOperator="Is after"
2551
+
2552
+ i18n-filterBeforeOperator="kendo.treelist.filterBeforeOperator|The text of the before date filter operator"
2553
+ filterBeforeOperator="Is before"
2554
+
2555
+ i18n-filterBeforeOrEqualOperator="kendo.treelist.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"
2556
+ filterBeforeOrEqualOperator="Is before or equal to"
2557
+
2558
+ i18n-filterFilterButton="kendo.treelist.filterFilterButton|The text of the filter button"
2559
+ filterFilterButton="Filter"
2560
+
2561
+ i18n-filterClearButton="kendo.treelist.filterClearButton|The text of the clear filter button"
2562
+ filterClearButton="Clear"
2563
+
2564
+ i18n-filterAndLogic="kendo.treelist.filterAndLogic|The text of the And filter logic"
2565
+ filterAndLogic="And"
2566
+
2567
+ i18n-filterOrLogic="kendo.treelist.filterOrLogic|The text of the Or filter logic"
2568
+ filterOrLogic="Or"
2569
+
2570
+ i18n-filterDateToday="kendo.treelist.filterDateToday|The text of the Today button of the Date filter."
2571
+ filterDateToday="TODAY"
2572
+
2573
+ i18n-filterDateToggle="kendo.treelist.filterDateToggle|The title of the Toggle button of the Date filter."
2574
+ filterDateToggle="Toggle Calendar"
2575
+
2576
+ i18n-filterNumericDecrement="kendo.treelist.filterNumericDecrement|The title of the Decrement button of the Numeric filter."
2577
+ filterNumericDecrement="Decrement"
2578
+
2579
+ i18n-filterNumericIncrement="kendo.treelist.filterNumericIncrement|The title of the Increment button of the Numeric filter."
2580
+ filterNumericIncrement="Increment"
2581
+
2582
+ i18n-loading="kendo.treelist.loading|The loading text"
2583
+ loading="Loading"
2584
+
2585
+ i18n-filterInputLabel="kendo.treelist.filterInputLabel|The label of the filter row and menu inputs"
2586
+ filterInputLabel="{{ '{columnName} Filter' }}"
2587
+
2588
+ i18n-filterMenuLogicDropDownLabel="kendo.treelist.filterMenuLogicDropDownLabel|The label of the filter menu logic dropdown"
2589
+ filterMenuLogicDropDownLabel="{{ '{columnName} Filter Logic' }}"
2590
+
2591
+ i18n-filterMenuOperatorsDropDownLabel="kendo.treelist.filterMenuOperatorsDropDownLabel|The label of the filter menu operators dropdown"
2592
+ filterMenuOperatorsDropDownLabel="{{ '{columnName} Filter Operators' }}"
2593
+
2594
+ i18n-filterMenuTitle="kendo.treelist.filterMenuTitle|The title of the filter menu icon"
2595
+ filterMenuTitle="{{ '{columnName} Filter Menu' }}"
2596
+
2597
+ i18n-columnMenu="kendo.treelist.columnMenu|The title of the column menu icon"
2598
+ columnMenu="{{ '{columnName} Column Menu' }}"
2599
+
2600
+ i18n-columns="kendo.treelist.columns|The text shown in the column menu for the columns item"
2601
+ columns="Columns"
2602
+
2603
+ i18n-lock="kendo.treelist.lock|The text shown in the column menu for the lock item"
2604
+ lock="Lock"
2605
+
2606
+ i18n-unlock="kendo.treelist.unlock|The text shown in the column menu for the unlock item"
2607
+ unlock="Unlock"
2608
+
2609
+ i18n-sortable="kendo.treelist.sortable|The label of the sort icon"
2610
+ sortable="Sortable"
2611
+
2612
+ i18n-sortAscending="kendo.treelist.sortAscending|The text shown in the column menu for the sort ascending item"
2613
+ sortAscending="Sort Ascending"
2614
+
2615
+ i18n-sortDescending="kendo.treelist.sortDescending|The text shown in the column menu for the sort descending item"
2616
+ sortDescending="Sort Descending"
2617
+
2618
+ i18n-sortedDefault="kendo.treelist.sortedDefault|The status announcement when a column is no longer sorted"
2619
+ sortedDefault="Not Sorted"
2620
+
2621
+ i18n-columnsApply="kendo.treelist.columnsApply|The text shown in the column menu or column chooser for the columns apply button"
2622
+ columnsApply="Apply"
2623
+
2624
+ i18n-columnsReset="kendo.treelist.columnsReset|The text shown in the column menu or column chooser for the columns reset button"
2625
+ columnsReset="Reset"
2626
+
2627
+ i18n-pagerSelectPage="kendo.treelist.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the TreeList Pager"
2628
+ pagerSelectPage="Select page"
2629
+
2630
+ i18n-topToolbarLabel="kendo.treelist.topToolbarLabel|The label of the TreeList top toolbar"
2631
+ topToolbarLabel="Top toolbar"
2632
+
2633
+ i18n-bottomToolbarLabel="kendo.treelist.bottomToolbarLabel|The label of the TreeList bottom toolbar"
2634
+ bottomToolbarLabel="Bottom toolbar"
2635
+
2636
+ i18n-dragRowHandleLabel="kendo.treelist.dragRowHandleLabel|The label for the TreeList drag row handle"
2637
+ dragRowHandleLabel="Drag row"
2638
+
2639
+ i18n-selectRowCheckboxLabel="kendo.treelist.selectRowCheckboxLabel|The label for the select row checkbox"
2640
+ selectRowCheckboxLabel="Select row"
2641
+
2642
+ i18n-selectAllRowsCheckboxLabel="kendo.treelist.selectAllRowsCheckboxLabel|The label for the select all rows checkbox"
2643
+ selectAllRowsCheckboxLabel="Select all rows"
2644
+
2645
+ i18n-autosizeAllColumns="kendo.treelist.autosizeAllColumns|The text shown in the column menu for the autosize all columns item"
2646
+ autosizeAllColumns="Autosize All Columns"
2647
+
2648
+ i18n-autosizeThisColumn="kendo.treelist.autosizeThisColumn|The text shown in the column menu for the autosize this column item"
2649
+ autosizeThisColumn="Autosize This Column"
2650
+ >
2625
2651
  </ng-container>
2626
- <kendo-treelist-toolbar
2627
- *ngIf="showTopToolbar"
2652
+ @if (showTopToolbar) {
2653
+ <kendo-treelist-toolbar
2628
2654
  position="top"
2629
2655
  [navigable]="navigable"
2630
2656
  [attr.aria-label]="messageFor('topToolbarLabel')"
2631
- [attr.aria-controls]="ariaRootId"></kendo-treelist-toolbar>
2657
+ [attr.aria-controls]="ariaRootId"></kendo-treelist-toolbar>
2658
+ }
2632
2659
  <ng-content select="kendo-toolbar"></ng-content>
2633
2660
  <div #ariaRoot
2634
- class="k-grid-aria-root"
2635
- role="treegrid"
2636
- [id]="ariaRootId"
2637
- [attr.aria-rowcount]="ariaRowCount"
2638
- [attr.aria-colcount]="ariaColCount"
2639
- [attr.aria-multiselectable]="ariaMultiselectable"
2640
- [attr.aria-label]="ariaLabel"
2641
- kendoDragTargetContainer
2642
- kendoDropTargetContainer
2643
- mode="manual"
2644
- [dragDisabled]="!rowReorderable"
2645
- [dropDisabled]="!rowReorderable"
2646
- [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2647
- [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2648
- [dragHandle]="getDefaultSelectors('handle')"
2649
- [hint]="{hintTemplate: defaultHint}"
2650
- (onPress)="handleReorderEvents($event, 'press')"
2651
- (onDragStart)="handleReorderEvents($event, 'dragStart')"
2652
- (onDrag)="handleReorderEvents($event, 'drag')"
2653
- (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2654
- (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2655
- (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2656
- (onDrop)="handleReorderEvents($event, 'drop')"
2657
- [dragData]="treeListData">
2658
- <ng-template [ngIf]="isScrollable">
2659
- <div *ngIf="!hideHeader"
2660
- class="k-grid-header"
2661
- role="presentation"
2662
- [style.padding]="headerPadding">
2663
- <div *ngIf="isLocked"
2664
- #lockedHeader
2665
- role="presentation"
2666
- class="k-grid-header-locked"
2667
- [style.width.px]="lockedWidth">
2668
- <table
2669
- kendoTreeListResizableTable
2670
- [locked]="true"
2671
- role="presentation"
2672
- [style.width.px]="lockedWidth"
2673
- class="k-grid-header-table k-table k-table-md">
2674
- <colgroup
2675
- kendoTreeListColGroup
2676
- [columns]="$any(lockedLeafColumns)">
2677
- </colgroup>
2678
- <thead kendoTreeListHeader
2679
- role="rowgroup"
2680
- [resizable]="resizable"
2681
- [scrollable]="true"
2682
- [columns]="$any(lockedColumns)"
2683
- [totalColumnLevels]="totalColumnLevels"
2684
- [sort]="sort"
2685
- [filter]="filter"
2686
- [filterable]="filterable"
2687
- [reorderable]="reorderable"
2688
- [sortable]="sortable"
2689
- [columnMenu]="columnMenuOptions"
2690
- [columnMenuTemplate]="columnMenuTemplate"
2691
- [totalColumnsCount]="leafColumns.length"
2692
- [totalColumns]="columnsContainer"
2693
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2694
- </thead>
2695
- </table>
2696
- </div>
2697
- <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2698
- [kendoTreeListResizableContainer]="lockedLeafColumns.length > 0"
2699
- [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2700
- <table
2701
- role="presentation"
2702
- [style.width.px]="nonLockedWidth"
2703
- kendoTreeListResizableTable
2704
- [virtualColumns]="virtualColumns"
2705
- class="k-grid-header-table k-table k-table-md">
2706
- <colgroup
2707
- kendoTreeListColGroup
2708
- [columns]="headerLeafColumns">
2709
- </colgroup>
2710
- <thead kendoTreeListHeader
2711
- [resizable]="resizable"
2712
- role="rowgroup"
2713
- [scrollable]="true"
2714
- [columns]="headerColumns"
2715
- [totalColumnLevels]="totalColumnLevels"
2716
- [sort]="sort"
2717
- [filter]="filter"
2718
- [filterable]="filterable"
2719
- [reorderable]="reorderable"
2720
- [sortable]="sortable"
2721
- [columnMenu]="columnMenuOptions"
2722
- [columnMenuTemplate]="columnMenuTemplate"
2723
- [lockedColumnsCount]="lockedLeafColumns.length"
2724
- [totalColumnsCount]="leafColumns.length"
2725
- [totalColumns]="columnsContainer"
2726
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2727
- </thead>
2728
- </table>
2729
- <div *ngIf="virtualColumns" class="k-width-container" role="presentation">
2730
- <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2731
- </div>
2732
- </div>
2733
- </div>
2734
- <kendo-treelist-list
2735
- [view]="view"
2736
- [loading]="showLoading"
2737
- [rowHeight]="rowHeight"
2738
- [total]="totalCount"
2739
- [take]="pageSize"
2740
- [skip]="skip"
2741
- [trackBy]="trackBy"
2742
- [columns]="columnsContainer"
2743
- [filterable]="filterable"
2744
- [noRecordsTemplate]="noRecordsTemplate"
2745
- (pageChange)="notifyPageChange('list', $event)"
2746
- [rowClass]="rowClass"
2747
- [isVirtual]="isVirtual"
2748
- [virtualColumns]="virtualColumns"
2749
- [expandIcons]="expandIcons"
2750
- (scrollBottom)="notifyScrollBottom()"
2751
- (contentScroll)="contentScroll.emit($event)"
2752
- kendoDraggable
2753
- kendoTreeListSelectionMarquee
2754
- [enableDrag]="marqueeSelection">
2755
- </kendo-treelist-list>
2756
- </ng-template>
2757
- <ng-template [ngIf]="!isScrollable">
2758
- <table
2759
- class="k-table k-table-md k-grid-header-table"
2661
+ class="k-grid-aria-root"
2662
+ role="treegrid"
2663
+ [id]="ariaRootId"
2664
+ [attr.aria-rowcount]="ariaRowCount"
2665
+ [attr.aria-colcount]="ariaColCount"
2666
+ [attr.aria-multiselectable]="ariaMultiselectable"
2667
+ [attr.aria-label]="ariaLabel"
2668
+ kendoDragTargetContainer
2669
+ kendoDropTargetContainer
2670
+ mode="manual"
2671
+ [dragDisabled]="!rowReorderable"
2672
+ [dropDisabled]="!rowReorderable"
2673
+ [dragTargetFilter]="getDefaultSelectors('dragTarget')"
2674
+ [dropTargetFilter]="getDefaultSelectors('dropTarget')"
2675
+ [dragHandle]="getDefaultSelectors('handle')"
2676
+ [hint]="{hintTemplate: defaultHint}"
2677
+ (onPress)="handleReorderEvents($event, 'press')"
2678
+ (onDragStart)="handleReorderEvents($event, 'dragStart')"
2679
+ (onDrag)="handleReorderEvents($event, 'drag')"
2680
+ (onDragEnter)="handleReorderEvents($event, 'dragEnter')"
2681
+ (onDragLeave)="handleReorderEvents($event, 'dragLeave')"
2682
+ (onDragEnd)="handleReorderEvents($event, 'dragEnd')"
2683
+ (onDrop)="handleReorderEvents($event, 'drop')"
2684
+ [dragData]="treeListData">
2685
+ @if (isScrollable) {
2686
+ @if (!hideHeader) {
2687
+ <div
2688
+ class="k-grid-header"
2689
+ role="presentation"
2690
+ [style.padding]="headerPadding">
2691
+ @if (isLocked) {
2692
+ <div
2693
+ #lockedHeader
2760
2694
  role="presentation"
2761
- [style.table-layout]="resizable ? 'fixed' : null"
2762
- kendoTreeListResizableTable>
2763
- <colgroup
2695
+ class="k-grid-header-locked"
2696
+ [style.width.px]="lockedWidth">
2697
+ <table
2698
+ kendoTreeListResizableTable
2699
+ [locked]="true"
2700
+ role="presentation"
2701
+ [style.width.px]="lockedWidth"
2702
+ class="k-grid-header-table k-table k-table-md">
2703
+ <colgroup
2764
2704
  kendoTreeListColGroup
2765
- [columns]="$any(leafColumns)">
2705
+ [columns]="$any(lockedLeafColumns)">
2766
2706
  </colgroup>
2767
2707
  <thead kendoTreeListHeader
2768
- *ngIf="!hideHeader"
2769
- role="rowgroup"
2770
- [resizable]="resizable"
2771
- [scrollable]="false"
2772
- [columns]="$any(visibleColumns)"
2773
- [totalColumnLevels]="totalColumnLevels"
2774
- [reorderable]="reorderable"
2775
- [sort]="sort"
2776
- [sortable]="sortable"
2777
- [filter]="filter"
2778
- [filterable]="filterable"
2779
- [columnMenu]="columnMenuOptions"
2780
- [columnMenuTemplate]="columnMenuTemplate"
2781
- [totalColumns]="columnsContainer"
2782
- [tabIndex]="navigation.enabled ? '-1' : '0'">
2708
+ role="rowgroup"
2709
+ [resizable]="resizable"
2710
+ [scrollable]="true"
2711
+ [columns]="$any(lockedColumns)"
2712
+ [totalColumnLevels]="totalColumnLevels"
2713
+ [sort]="sort"
2714
+ [filter]="filter"
2715
+ [filterable]="filterable"
2716
+ [reorderable]="reorderable"
2717
+ [sortable]="sortable"
2718
+ [columnMenu]="columnMenuOptions"
2719
+ [columnMenuTemplate]="columnMenuTemplate"
2720
+ [totalColumnsCount]="leafColumns.length"
2721
+ [totalColumns]="columnsContainer"
2722
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2783
2723
  </thead>
2784
- <tbody kendoTreeListTableBody
2785
- [view]="view"
2786
- [skip]="skip"
2787
- [columns]="$any(leafColumns)"
2788
- [filterable]="filterable"
2789
- [noRecordsTemplate]="noRecordsTemplate"
2790
- [trackBy]="trackBy"
2791
- [rowClass]="rowClass"
2792
- [expandIcons]="expandIcons"
2793
- kendoDraggable
2794
- kendoTreeListSelectionMarquee
2795
- [enableDrag]="marqueeSelection">
2796
- </tbody>
2797
- </table>
2798
- <div *ngIf="showLoading" kendoTreeListLoading>
2724
+ </table>
2799
2725
  </div>
2800
- </ng-template>
2726
+ }
2727
+ <div #header class="k-grid-header-wrap" role="presentation" data-scrollable
2728
+ [kendoTreeListResizableContainer]="lockedLeafColumns.length > 0"
2729
+ [lockedWidth]="lockedWidth + scrollbarWidth + 2">
2730
+ <table
2731
+ role="presentation"
2732
+ [style.width.px]="nonLockedWidth"
2733
+ kendoTreeListResizableTable
2734
+ [virtualColumns]="virtualColumns"
2735
+ class="k-grid-header-table k-table k-table-md">
2736
+ <colgroup
2737
+ kendoTreeListColGroup
2738
+ [columns]="headerLeafColumns">
2739
+ </colgroup>
2740
+ <thead kendoTreeListHeader
2741
+ [resizable]="resizable"
2742
+ role="rowgroup"
2743
+ [scrollable]="true"
2744
+ [columns]="headerColumns"
2745
+ [totalColumnLevels]="totalColumnLevels"
2746
+ [sort]="sort"
2747
+ [filter]="filter"
2748
+ [filterable]="filterable"
2749
+ [reorderable]="reorderable"
2750
+ [sortable]="sortable"
2751
+ [columnMenu]="columnMenuOptions"
2752
+ [columnMenuTemplate]="columnMenuTemplate"
2753
+ [lockedColumnsCount]="lockedLeafColumns.length"
2754
+ [totalColumnsCount]="leafColumns.length"
2755
+ [totalColumns]="columnsContainer"
2756
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2757
+ </thead>
2758
+ </table>
2759
+ @if (virtualColumns) {
2760
+ <div class="k-width-container" role="presentation">
2761
+ <div [style.width.px]="columnsContainer.unlockedWidth"></div>
2762
+ </div>
2763
+ }
2764
+ </div>
2765
+ </div>
2766
+ }
2767
+ <kendo-treelist-list
2768
+ [view]="view"
2769
+ [loading]="showLoading"
2770
+ [rowHeight]="rowHeight"
2771
+ [total]="totalCount"
2772
+ [take]="pageSize"
2773
+ [skip]="skip"
2774
+ [trackBy]="trackBy"
2775
+ [columns]="columnsContainer"
2776
+ [filterable]="filterable"
2777
+ [noRecordsTemplate]="noRecordsTemplate"
2778
+ (pageChange)="notifyPageChange('list', $event)"
2779
+ [rowClass]="rowClass"
2780
+ [isVirtual]="isVirtual"
2781
+ [virtualColumns]="virtualColumns"
2782
+ [expandIcons]="expandIcons"
2783
+ (scrollBottom)="notifyScrollBottom()"
2784
+ (contentScroll)="contentScroll.emit($event)"
2785
+ kendoDraggable
2786
+ kendoTreeListSelectionMarquee
2787
+ [enableDrag]="marqueeSelection">
2788
+ </kendo-treelist-list>
2789
+ }
2790
+ @if (!isScrollable) {
2791
+ <table
2792
+ class="k-table k-table-md k-grid-header-table"
2793
+ role="presentation"
2794
+ [style.table-layout]="resizable ? 'fixed' : null"
2795
+ kendoTreeListResizableTable>
2796
+ <colgroup
2797
+ kendoTreeListColGroup
2798
+ [columns]="$any(leafColumns)">
2799
+ </colgroup>
2800
+ @if (!hideHeader) {
2801
+ <thead kendoTreeListHeader
2802
+ role="rowgroup"
2803
+ [resizable]="resizable"
2804
+ [scrollable]="false"
2805
+ [columns]="$any(visibleColumns)"
2806
+ [totalColumnLevels]="totalColumnLevels"
2807
+ [reorderable]="reorderable"
2808
+ [sort]="sort"
2809
+ [sortable]="sortable"
2810
+ [filter]="filter"
2811
+ [filterable]="filterable"
2812
+ [columnMenu]="columnMenuOptions"
2813
+ [columnMenuTemplate]="columnMenuTemplate"
2814
+ [totalColumns]="columnsContainer"
2815
+ [tabIndex]="navigation.enabled ? '-1' : '0'">
2816
+ </thead>
2817
+ }
2818
+ <tbody kendoTreeListTableBody
2819
+ [view]="view"
2820
+ [skip]="skip"
2821
+ [columns]="$any(leafColumns)"
2822
+ [filterable]="filterable"
2823
+ [noRecordsTemplate]="noRecordsTemplate"
2824
+ [trackBy]="trackBy"
2825
+ [rowClass]="rowClass"
2826
+ [expandIcons]="expandIcons"
2827
+ kendoDraggable
2828
+ kendoTreeListSelectionMarquee
2829
+ [enableDrag]="marqueeSelection">
2830
+ </tbody>
2831
+ </table>
2832
+ @if (showLoading) {
2833
+ <div kendoTreeListLoading>
2834
+ </div>
2835
+ }
2836
+ }
2801
2837
  </div>
2802
- <kendo-pager
2838
+ @if (showPager) {
2839
+ <kendo-pager
2803
2840
  #pager
2804
- *ngIf="showPager"
2805
2841
  class="k-grid-pager"
2806
2842
  [navigable]="navigable"
2807
2843
  [pageSize]="pageSize"
@@ -2818,79 +2854,90 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
2818
2854
  (pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
2819
2855
  (itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
2820
2856
  <ng-template kendoPagerTemplate>
2821
- <ng-container
2822
- [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
2823
- [ngTemplateOutletContext]="pager.templateContext"></ng-container>
2857
+ <ng-container
2858
+ [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
2859
+ [ngTemplateOutletContext]="pager.templateContext"></ng-container>
2824
2860
  </ng-template>
2825
2861
  <kendo-pager-messages
2826
- [ariaLabel]="messageFor('pagerLabel')"
2827
- [firstPage]="messageFor('pagerFirstPage')"
2828
- [inputLabel]="messageFor('pagerInputLabel')"
2829
- [previousPage]="messageFor('pagerPreviousPage')"
2830
- [nextPage]="messageFor('pagerNextPage')"
2831
- [lastPage]="messageFor('pagerLastPage')"
2832
- [selectPage]="messageFor('pagerSelectPage')"
2833
- [page]="messageFor('pagerPage')"
2834
- [itemsPerPage]="messageFor('pagerItemsPerPage')"
2835
- [items]="messageFor('pagerItems')"
2836
- [of]="messageFor('pagerOf')"
2837
- [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2862
+ [ariaLabel]="messageFor('pagerLabel')"
2863
+ [firstPage]="messageFor('pagerFirstPage')"
2864
+ [inputLabel]="messageFor('pagerInputLabel')"
2865
+ [previousPage]="messageFor('pagerPreviousPage')"
2866
+ [nextPage]="messageFor('pagerNextPage')"
2867
+ [lastPage]="messageFor('pagerLastPage')"
2868
+ [selectPage]="messageFor('pagerSelectPage')"
2869
+ [page]="messageFor('pagerPage')"
2870
+ [itemsPerPage]="messageFor('pagerItemsPerPage')"
2871
+ [items]="messageFor('pagerItems')"
2872
+ [of]="messageFor('pagerOf')"
2873
+ [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2838
2874
  </kendo-pager-messages>
2839
- </kendo-pager>
2840
- <kendo-treelist-toolbar
2841
- *ngIf="showBottomToolbar"
2875
+ </kendo-pager>
2876
+ }
2877
+ @if (showBottomToolbar) {
2878
+ <kendo-treelist-toolbar
2842
2879
  class="k-grid-toolbar-bottom"
2843
2880
  position="bottom"
2844
2881
  [navigable]="navigable"
2845
2882
  [attr.aria-label]="messageFor('bottomToolbarLabel')"
2846
2883
  [attr.aria-controls]="ariaRootId">
2847
- </kendo-treelist-toolbar>
2848
-
2884
+ </kendo-treelist-toolbar>
2885
+ }
2886
+
2849
2887
  <ng-template #defaultHint>
2850
- <kendo-icon-wrapper
2851
- [name]="getHintSettings('hintIcon')"
2852
- [svgIcon]="getHintSettings('hintSVGIcon')"
2853
- innerCssClass="k-drag-status">
2854
- </kendo-icon-wrapper>
2855
- {{hintText}}
2888
+ <kendo-icon-wrapper
2889
+ [name]="getHintSettings('hintIcon')"
2890
+ [svgIcon]="getHintSettings('hintSVGIcon')"
2891
+ innerCssClass="k-drag-status">
2892
+ </kendo-icon-wrapper>
2893
+ {{hintText}}
2856
2894
  </ng-template>
2857
-
2895
+
2858
2896
  <ng-template #defaultPager>
2859
- <div class="k-pager-numbers-wrap">
2860
- <kendo-pager-prev-buttons *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-prev-buttons>
2861
- <kendo-pager-numeric-buttons
2862
- *ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
2863
- [buttonCount]="normalizedPageableSettings.buttonCount">
2864
- </kendo-pager-numeric-buttons>
2865
- <kendo-pager-input *ngIf="normalizedPageableSettings.type === 'input' || showPagerInput" [showPageText]="showPagerPageText"></kendo-pager-input>
2866
- <kendo-pager-next-buttons *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
2867
- </div>
2868
- <kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
2869
- [pageSizes]="normalizedPageableSettings.pageSizes"
2870
- [showItemsText]="showPagerItemsText">
2897
+ <div class="k-pager-numbers-wrap">
2898
+ @if (normalizedPageableSettings.previousNext) {
2899
+ <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
2900
+ }
2901
+ @if (normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0) {
2902
+ <kendo-pager-numeric-buttons
2903
+ [buttonCount]="normalizedPageableSettings.buttonCount">
2904
+ </kendo-pager-numeric-buttons>
2905
+ }
2906
+ @if (normalizedPageableSettings.type === 'input' || showPagerInput) {
2907
+ <kendo-pager-input [showPageText]="showPagerPageText"></kendo-pager-input>
2908
+ }
2909
+ @if (normalizedPageableSettings.previousNext) {
2910
+ <kendo-pager-next-buttons></kendo-pager-next-buttons>
2911
+ }
2912
+ </div>
2913
+ @if (normalizedPageableSettings.pageSizes) {
2914
+ <kendo-pager-page-sizes
2915
+ [pageSizes]="normalizedPageableSettings.pageSizes"
2916
+ [showItemsText]="showPagerItemsText">
2871
2917
  </kendo-pager-page-sizes>
2872
- <kendo-pager-info *ngIf="normalizedPageableSettings.info">
2918
+ }
2919
+ @if (normalizedPageableSettings.info) {
2920
+ <kendo-pager-info>
2873
2921
  </kendo-pager-info>
2874
- <kendo-pager-messages
2875
- [ariaLabel]="messageFor('pagerLabel')"
2876
- [firstPage]="messageFor('pagerFirstPage')"
2877
- [inputLabel]="messageFor('pagerInputLabel')"
2878
- [previousPage]="messageFor('pagerPreviousPage')"
2879
- [nextPage]="messageFor('pagerNextPage')"
2880
- [lastPage]="messageFor('pagerLastPage')"
2881
- [selectPage]="messageFor('pagerSelectPage')"
2882
- [page]="messageFor('pagerPage')"
2883
- [itemsPerPage]="messageFor('pagerItemsPerPage')"
2884
- [items]="messageFor('pagerItems')"
2885
- [of]="messageFor('pagerOf')"
2886
- [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2887
- </kendo-pager-messages>
2922
+ }
2923
+ <kendo-pager-messages
2924
+ [ariaLabel]="messageFor('pagerLabel')"
2925
+ [firstPage]="messageFor('pagerFirstPage')"
2926
+ [inputLabel]="messageFor('pagerInputLabel')"
2927
+ [previousPage]="messageFor('pagerPreviousPage')"
2928
+ [nextPage]="messageFor('pagerNextPage')"
2929
+ [lastPage]="messageFor('pagerLastPage')"
2930
+ [selectPage]="messageFor('pagerSelectPage')"
2931
+ [page]="messageFor('pagerPage')"
2932
+ [itemsPerPage]="messageFor('pagerItemsPerPage')"
2933
+ [items]="messageFor('pagerItems')"
2934
+ [of]="messageFor('pagerOf')"
2935
+ [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
2936
+ </kendo-pager-messages>
2888
2937
  </ng-template>
2889
- `,
2938
+ `,
2890
2939
  standalone: true,
2891
- imports: [LocalizedMessagesDirective, NgIf, NgTemplateOutlet, ToolbarComponent, DragTargetContainerDirective, DropTargetContainerDirective,
2892
- TableDirective, ColGroupComponent, HeaderComponent, ResizableContainerDirective, ListComponent, DraggableDirective, MarqueeDirective,
2893
- TableBodyComponent, LoadingComponent, ...KENDO_PAGER, IconWrapperComponent]
2940
+ imports: [LocalizedMessagesDirective, NgTemplateOutlet, ToolbarComponent, DragTargetContainerDirective, DropTargetContainerDirective, TableDirective, ColGroupComponent, HeaderComponent, ResizableContainerDirective, ListComponent, DraggableDirective, MarqueeDirective, TableBodyComponent, LoadingComponent, ...KENDO_PAGER, IconWrapperComponent]
2894
2941
  }]
2895
2942
  }], ctorParameters: () => [{ type: i1.BrowserSupportService }, { type: i0.ElementRef }, { type: i2.ChangeNotificationService }, { type: i3.EditService }, { type: i4.FilterService }, { type: i5.PDFService }, { type: i6.ResponsiveService }, { type: i0.Renderer2 }, { type: i7.ExcelService }, { type: i0.NgZone }, { type: i8.ScrollSyncService }, { type: i9.DomEventsService }, { type: i10.ColumnResizingService }, { type: i0.ChangeDetectorRef }, { type: i11.ColumnReorderService }, { type: i12.ColumnInfoService }, { type: i13.NavigationService }, { type: i14.SortService }, { type: i15.ScrollRequestService }, { type: i16.ExpandStateService }, { type: i17.OptionChangesService }, { type: i18.SelectionService }, { type: i19.LocalizationService }, { type: i20.ContextService }, { type: i21.RowReorderService }], propDecorators: { ariaLabel: [{
2896
2943
  type: Input,