@progress/kendo-react-treelist 13.3.0 → 13.4.0-develop.1

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 (54) hide show
  1. package/ScrollMode.d.ts +8 -0
  2. package/TreeList.d.ts +145 -0
  3. package/TreeList.js +1 -1
  4. package/TreeList.mjs +11 -11
  5. package/TreeListNoRecords.d.ts +19 -0
  6. package/TreeListToolbar.d.ts +29 -0
  7. package/cells/EditCells/TreeListBooleanEditor.d.ts +15 -0
  8. package/cells/EditCells/TreeListBooleanEditor.js +1 -1
  9. package/cells/EditCells/TreeListBooleanEditor.mjs +11 -11
  10. package/cells/EditCells/TreeListDateEditor.d.ts +15 -0
  11. package/cells/EditCells/TreeListNumericEditor.d.ts +15 -0
  12. package/cells/EditCells/TreeListTextEditor.d.ts +15 -0
  13. package/cells/FilterCells/TreeListBooleanFilter.d.ts +17 -0
  14. package/cells/FilterCells/TreeListDateFilter.d.ts +17 -0
  15. package/cells/FilterCells/TreeListNumericFilter.d.ts +17 -0
  16. package/cells/FilterCells/TreeListTextFilter.d.ts +17 -0
  17. package/cells/FilterCells/utils.d.ts +45 -0
  18. package/cells/FilterCells/utils.mjs +3 -3
  19. package/cells/TreeListCell.d.ts +13 -0
  20. package/cells/TreeListSelectionCell.d.ts +15 -0
  21. package/cells/TreeListSelectionCell.js +1 -1
  22. package/cells/TreeListSelectionCell.mjs +1 -1
  23. package/codemods/utils.js +1 -8
  24. package/codemods/v11/toolbar-handle.js +1 -8
  25. package/constants/index.d.ts +13 -0
  26. package/constants/index.mjs +2 -2
  27. package/dist/cdn/js/kendo-react-treelist.js +1 -1
  28. package/header/TreeListHeaderCell.d.ts +10 -0
  29. package/header/TreeListHeaderSelectionCell.d.ts +18 -0
  30. package/index.d.mts +33 -1192
  31. package/index.d.ts +33 -1192
  32. package/interfaces/DataItemWrapper.d.ts +17 -0
  33. package/interfaces/TreeListCellProps.d.ts +48 -0
  34. package/interfaces/TreeListColumnProps.d.ts +48 -0
  35. package/interfaces/TreeListFilterCellProps.d.ts +13 -0
  36. package/interfaces/TreeListFilterOperator.d.ts +13 -0
  37. package/interfaces/TreeListHeaderCellProps.d.ts +13 -0
  38. package/interfaces/TreeListNoRecordsProps.d.ts +16 -0
  39. package/interfaces/TreeListProps.d.ts +285 -0
  40. package/interfaces/TreeListRowProps.d.ts +99 -0
  41. package/interfaces/TreeListSelectableSettings.d.ts +25 -0
  42. package/interfaces/TreeListSortSettings.d.ts +16 -0
  43. package/interfaces/TreeListToolbarProps.d.ts +17 -0
  44. package/interfaces/events.d.ts +272 -0
  45. package/messages/index.d.ts +127 -0
  46. package/package-metadata.d.ts +12 -0
  47. package/package-metadata.js +1 -1
  48. package/package-metadata.mjs +10 -16
  49. package/package.json +9 -9
  50. package/rows/TreeListDraggableRow.d.ts +39 -0
  51. package/rows/TreeListDraggableRow.js +1 -1
  52. package/rows/TreeListDraggableRow.mjs +5 -5
  53. package/rows/TreeListRow.d.ts +13 -0
  54. package/utils/index.d.ts +24 -0
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ export type ScrollMode = 'none' | 'scrollable' | 'virtual';
package/TreeList.d.ts ADDED
@@ -0,0 +1,145 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { default as PropTypes } from 'prop-types';
9
+ import { CommonDragLogic, TableKeyboardNavigationContextType } from '@progress/kendo-react-data-tools';
10
+ import { TreeListCellProps } from './interfaces/TreeListCellProps.js';
11
+ import { TreeListProps } from './interfaces/TreeListProps.js';
12
+ import { TreeListHeaderCellProps } from './interfaces/TreeListHeaderCellProps.js';
13
+ import { TreeListFilterCellProps } from './interfaces/TreeListFilterCellProps.js';
14
+ import * as React from 'react';
15
+ /**
16
+ * Represents the [KendoReact TreeList component](https://www.telerik.com/kendo-react-ui/components/treelist/get-started).
17
+ */
18
+ export declare class TreeList extends React.Component<TreeListProps, {}> {
19
+ /**
20
+ * @hidden
21
+ */
22
+ static propTypes: {
23
+ data: PropTypes.Requireable<any[]>;
24
+ resizable: PropTypes.Requireable<boolean>;
25
+ reorderable: PropTypes.Requireable<boolean>;
26
+ sortable: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
27
+ mode: PropTypes.Requireable<string>;
28
+ allowUnsort: PropTypes.Requireable<boolean>;
29
+ }> | null | undefined>>;
30
+ onSortChange: PropTypes.Requireable<(...args: any[]) => any>;
31
+ sort: PropTypes.Requireable<any[]>;
32
+ columns: PropTypes.Requireable<(object | null | undefined)[]>;
33
+ columnVirtualization: PropTypes.Requireable<boolean>;
34
+ filter: PropTypes.Requireable<any[]>;
35
+ onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
36
+ filterRow: PropTypes.Requireable<any>;
37
+ toolbar: PropTypes.Requireable<any>;
38
+ noRecords: PropTypes.Requireable<any>;
39
+ onExpandChange: PropTypes.Requireable<(...args: any[]) => any>;
40
+ expandField: PropTypes.Requireable<string>;
41
+ subItemsField: PropTypes.Requireable<string>;
42
+ selectedField: PropTypes.Requireable<string>;
43
+ onSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
44
+ onHeaderSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
45
+ onRowClick: PropTypes.Requireable<(...args: any[]) => any>;
46
+ onItemChange: PropTypes.Requireable<(...args: any[]) => any>;
47
+ editField: PropTypes.Requireable<string>;
48
+ scrollable: PropTypes.Requireable<string>;
49
+ rowHeight: PropTypes.Requireable<number>;
50
+ style: PropTypes.Requireable<object>;
51
+ tableProps: PropTypes.Requireable<object>;
52
+ pager: PropTypes.Requireable<any>;
53
+ skip: PropTypes.Requireable<number>;
54
+ take: PropTypes.Requireable<number>;
55
+ onPageChange: PropTypes.Requireable<(...args: any[]) => any>;
56
+ onDataStateChange: PropTypes.Requireable<(...args: any[]) => any>;
57
+ onColumnResize: PropTypes.Requireable<(...args: any[]) => any>;
58
+ onColumnReorder: PropTypes.Requireable<(...args: any[]) => any>;
59
+ dataItemKey: PropTypes.Requireable<string>;
60
+ navigatable: PropTypes.Requireable<boolean>;
61
+ };
62
+ /** @hidden */
63
+ static contextType: React.Context<TableKeyboardNavigationContextType | undefined>;
64
+ /**
65
+ * The HTML element of the TreeList component.
66
+ */
67
+ element: HTMLDivElement | null;
68
+ private wrapperScrollLeft;
69
+ private wrapperScrollTop;
70
+ private updateOnScroll;
71
+ private tbodyOffsetTop;
72
+ private prevData;
73
+ private flattedData;
74
+ private extendedColumn;
75
+ private columnsMap;
76
+ private columnResize;
77
+ protected dragLogic: CommonDragLogic<TreeListCellProps, TreeListHeaderCellProps, TreeListFilterCellProps>;
78
+ private get _treeListId();
79
+ private get document();
80
+ private contextStateRef;
81
+ private navigationStateRef;
82
+ private readonly showLicenseWatermark;
83
+ private readonly licenseMessage;
84
+ constructor(props: TreeListProps);
85
+ /**
86
+ * Method to allow the scroll to be set to a specific row index.
87
+ *
88
+ * @param options - Object, containing the rowIndex to which is going to be scrolled.
89
+ */
90
+ scrollIntoView: (options: {
91
+ rowIndex?: number;
92
+ }) => void;
93
+ /**
94
+ * @hidden
95
+ */
96
+ componentDidMount(): void;
97
+ /**
98
+ * @hidden
99
+ */
100
+ getSnapshotBeforeUpdate(): null;
101
+ /**
102
+ * @hidden
103
+ */
104
+ componentDidUpdate(prevProps: TreeListProps): void;
105
+ /**
106
+ * @hidden
107
+ */
108
+ componentWillUnmount(): void;
109
+ /**
110
+ * @hidden
111
+ */
112
+ render(): React.JSX.Element;
113
+ private getExtendedColumn;
114
+ private getColumnsMap;
115
+ private get columns();
116
+ private get flatData();
117
+ private onKeyDown;
118
+ private onFocus;
119
+ private onRowDrag;
120
+ private onRowDrop;
121
+ private columnReorder;
122
+ private onResize;
123
+ private handleOnScroll;
124
+ private calculateSizes;
125
+ private itemChange;
126
+ private selectionChange;
127
+ private onHeaderSelectionChange;
128
+ private selectionRelease;
129
+ private sortChange;
130
+ private headerFilterChange;
131
+ private filterChange;
132
+ private columnMenuFilterChange;
133
+ private expandChange;
134
+ private rowClick;
135
+ private rowDoubleClick;
136
+ private rowContextMenu;
137
+ private onPageChange;
138
+ private raiseDataEvent;
139
+ private getDataState;
140
+ private getArguments;
141
+ private expandedSubItems;
142
+ private getLeafDataItems;
143
+ private expanded;
144
+ private hasChildren;
145
+ }
package/TreeList.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const J=require("react"),a=require("prop-types"),g=require("@progress/kendo-react-common"),h=require("@progress/kendo-react-data-tools"),H=require("./utils/index.js"),Q=require("./cells/TreeListCell.js"),X=require("./TreeListNoRecords.js"),Y=require("./rows/TreeListRow.js"),P=require("./package-metadata.js");function Z(y){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(y){for(const e in y)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(y,e);Object.defineProperty(l,e,t.get?t:{enumerable:!0,get:()=>y[e]})}}return l.default=y,Object.freeze(l)}const c=Z(J),F=class F extends c.Component{constructor(l){super(l),this.element=null,this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.contextStateRef={current:void 0},this.navigationStateRef={current:void 0},this.showLicenseWatermark=!1,this.licenseMessage=void 0,this.scrollIntoView=e=>{if(!this.element)return;const{rowIndex:t=0}=e,{scrollable:o,rowHeight:s=0}=this.props;if(o==="virtual"||s)this.element.scroll(0,(t-1)*s);else{const r=this.element.querySelector(`tbody > tr:nth-child(${t})`);if(r){const i=r.offsetTop-this.tbodyOffsetTop;this.element.scroll(0,i)}}},this.getExtendedColumn=g.memoizeOne((e,t)=>h.readColumns(e,{prevId:0,idPrefix:t})),this.getColumnsMap=g.memoizeOne((e,t)=>h.mapColumns(e,t)),this.onKeyDown=e=>{if(h.tableKeyboardNavigation.onKeyDown(e,{navigatable:!1,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),this.props.onKeyDown){const{mode:t,cell:o}=h.getSelectionOptions(this.props.selectable),s={dataItems:this.getLeafDataItems(),mode:t,cell:o,componentId:this._treeListId,selectedField:this.props.selectedField,...this.getArguments(e)};this.props.onKeyDown.call(void 0,s)}},this.onFocus=e=>{h.tableKeyboardNavigation.onFocus(e,{contextStateRef:this.contextStateRef})},this.onRowDrag=e=>{this.props.onRowDrag&&this.props.onRowDrag.call(void 0,{...e,target:this})},this.onRowDrop=e=>{this.props.onRowDrop&&this.props.onRowDrop.call(void 0,{...e,target:this})},this.columnReorder=(e,t,o)=>{const s=this.extendedColumn[e].depth,r=p=>{do p++;while(p<this.extendedColumn.length&&this.extendedColumn[p].depth>s);return p},i=this.extendedColumn.splice(e,r(e)-e);if(this.extendedColumn.splice(e<t?r(t-i.length):t,0,...i),this.extendedColumn.filter(p=>p.declarationIndex>=0).forEach((p,m)=>p.orderIndex=m),this.props.onColumnReorder){const p={target:this,columns:this.columns,nativeEvent:o};this.props.onColumnReorder.call(void 0,p)}},this.onResize=(e,t,o,s,r)=>{if(this.props.onColumnResize){const i=this.extendedColumn.filter(m=>m.children.length===0).reduce((m,C)=>m+=parseFloat(String(C.width)),0),p={columns:this.columns,totalWidth:i,index:e,nativeEvent:s,newWidth:t,oldWidth:o,end:r,target:this};this.props.onColumnResize.call(void 0,p)}},this.handleOnScroll=e=>{const t=e.currentTarget.scrollLeft,o=e.currentTarget.scrollTop,{columnVirtualization:s,scrollable:r,rowHeight:i=0}=this.props,p=i,m=0;let C=!1;s&&Math.abs(this.wrapperScrollLeft-t)>m&&(this.wrapperScrollLeft=t,C=!0),r==="virtual"&&Math.abs(this.wrapperScrollTop-o)>p&&(this.wrapperScrollTop=o,C=!0),C&&(this.updateOnScroll=!0,this.forceUpdate())},this.calculateSizes=e=>{if(!e||this.props.scrollable==="none")return;const t=Array.from(e.childNodes),o=t.find(i=>i.nodeName==="TABLE"),s=this.props.toolbar&&t.find(i=>i.nodeType===1&&i.classList.contains("k-grid-toolbar"));let r=0;if(s){const i=s.style.boxSizing;s.style.boxSizing="border-box",r=parseFloat(String(window.getComputedStyle(s).height))||s.offsetHeight,s.style.boxSizing=i,s.getAttribute("style")||s.removeAttribute("style")}this.tbodyOffsetTop=o.tBodies[0].offsetTop,H.setHeaderRowsTop(o,r)},this.itemChange=e=>{const t=this.props.onItemChange;if(e.field===this.props.expandField){const o=this.props.onExpandChange;if(o){const s={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,value:e.value};o.call(void 0,s)}return}if(t){const o={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,field:e.field,value:e.value};t.call(void 0,o)}},this.onHeaderSelectionChange=e=>{if(this.props.onHeaderSelectionChange){const t={field:e.field,nativeEvent:e.syntheticEvent&&e.syntheticEvent.nativeEvent,syntheticEvent:e.syntheticEvent,target:this,dataItems:this.getLeafDataItems()};this.props.onHeaderSelectionChange.call(void 0,t)}},this.selectionRelease=e=>{if(this.props.onSelectionChange){const t={syntheticEvent:void 0,target:this,selectedField:this.props.selectedField||"",componentId:this._treeListId,dataItems:this.getLeafDataItems(),dataItem:null,level:[],...e};this.props.onSelectionChange.call(void 0,t)}},this.sortChange=(e,t,o)=>{this.raiseDataEvent(this.props.onSortChange,{sort:t,field:o},e)},this.headerFilterChange=(e,t,o)=>{this.raiseDataEvent(this.props.onFilterChange,{filter:t,field:o},e)},this.filterChange=e=>{const{filter:t,field:o}=e;this.raiseDataEvent(this.props.onFilterChange,{filter:t,field:o},e.syntheticEvent)},this.columnMenuFilterChange=(e,t,o)=>{const{onColumnMenuFilterChange:s}=this.props;if(!s)return;const r={syntheticEvent:e,filter:t,field:o,target:this,nativeEvent:e.nativeEvent};s.call(void 0,r)},this.expandChange=(e,t,o)=>{const{expandField:s,onExpandChange:r}=this.props;if(s&&r){const i={...this.getArguments(e),dataItem:t,level:o,value:this.expanded(t)};r.call(void 0,i)}},this.rowClick=(e,t)=>{if(this.props.onRowClick&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowClick.call(void 0,o)}},this.rowDoubleClick=(e,t)=>{if(this.props.onRowDoubleClick&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowDoubleClick.call(void 0,o)}},this.rowContextMenu=(e,t)=>{if(this.props.onRowContextMenu&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowContextMenu.call(void 0,o)}},this.onPageChange=e=>{if(this.props.onPageChange){const t={...this.getArguments(e.syntheticEvent),skip:e.skip,take:e.take};this.props.onPageChange.call(void 0,t)}},this.expandedSubItems=e=>{const t=[];return this.expanded(e)&&this.hasChildren(e)&&t.push(...g.getNestedValue(this.props.subItemsField,e)),t},this.getLeafDataItems=()=>this.flatData.map(e=>e.dataItem),this.expanded=e=>!!g.getNestedValue(this.props.expandField,e),this.hasChildren=e=>!!g.getNestedValue(this.props.subItemsField,e),this.showLicenseWatermark=!g.validatePackage(P.packageMetadata,{component:"TreeList"}),this.licenseMessage=g.getLicenseMessage(P.packageMetadata),this.dragLogic=new h.CommonDragLogic(this.columnReorder,g.noop,g.noop),this.columnResize=new h.ColumnResize(this.onResize.bind(this)),h.tableKeyboardNavigation.onConstructor({navigatable:!!l.navigatable,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}get _treeListId(){return this.props.id+"-treelist"}get document(){if(g.canUseDOM)return this.element&&this.element.ownerDocument||document}componentDidMount(){this.calculateSizes(this.element),h.tableKeyboardNavigation.onComponentDidMount({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}getSnapshotBeforeUpdate(){return h.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({document:this.document,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),null}componentDidUpdate(l){l.columns!==this.props.columns&&this.calculateSizes(this.element),h.tableKeyboardNavigation.onComponentDidUpdate({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}componentWillUnmount(){this.columnsMap=[],this.prevData=[],this.flattedData=[],this.updateOnScroll=!1,this.getExtendedColumn.clear(),this.getColumnsMap.clear()}render(){const{columns:l=[],filterRow:e,scrollable:t="scrollable",resizable:o=!1,reorderable:s=!1,skip:r,take:i}=this.props,p=l.some(n=>!!n.filter||!!n.filterCell)||e!==void 0,m=e||h.FilterRow,C=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef),T=this.getExtendedColumn(l,C),z=T.length!==this.extendedColumn.length;this.extendedColumn=T,this.columnsMap=this.getColumnsMap(this.extendedColumn,z);const b=this.extendedColumn.filter(n=>n.children.length===0);this.columnResize.columns=this.extendedColumn,this.columnResize.resizable=o,this.dragLogic.columns=this.extendedColumn,this.dragLogic.reorderable=s,this.dragLogic.groupable=!1;const D=c.createElement(h.Header,{headerRow:c.createElement(h.HeaderRow,{sort:this.props.sort,sortable:this.props.sortable,sortChange:this.sortChange,selectionChange:this.onHeaderSelectionChange,columns:this.extendedColumn,columnsMap:this.columnsMap,cellRender:this.props.headerCellRender,columnResize:this.columnResize,columnMenu:this.props.columnMenu,columnMenuFilter:this.props.columnMenuFilter,columnMenuFilterChange:this.columnMenuFilterChange,pressHandler:this.dragLogic.pressHandler,dragHandler:this.dragLogic.dragHandler,releaseHandler:this.dragLogic.releaseHandler,filterChange:this.headerFilterChange}),reorderable:this.props.reorderable,filterRow:p&&c.createElement(m,{columns:b,filter:this.props.filter,filterChange:this.filterChange,sort:this.props.sort,ariaRowIndex:this.columnsMap.length+1})||void 0,columnResize:this.columnResize}),M=this.props.style||{},{colSpans:A,hiddenColumns:V}=h.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:b,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((M.width||"").toString())}),B=(n,f,I,E,k,x)=>b.map((d,u)=>{if(V[u])return null;const R=d.id?d.id:u,L=`${d.className?d.className+" ":""}${d.locked?"k-grid-content-sticky":""}`,w={id:h.tableKeyboardNavigationTools.generateNavigatableId(`${I}-${String(u)}`,C),colSpan:A[u],dataItem:n.dataItem,field:d.field,format:d.format,className:L||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?S=>{this.selectionChange({event:S,item:n,columnIndex:u,dataIndex:k})}:void 0,level:n.level,expandable:d.expandable,expanded:E,hasChildren:this.hasChildren(n.dataItem),onExpandChange:this.expandChange,colIndex:u,ariaColumnIndex:d.ariaColumnIndex,style:d.left!==void 0&&{left:d.left,right:d.right,borderRightWidth:d.rightBorder?"1px":""}||{},isSelected:Array.isArray(x)&&x.indexOf(u)>-1};return f&&d.editCell?c.createElement(d.editCell,{key:R,...w,onChange:this.itemChange}):d.cell?c.createElement(d.cell,{key:R,...w}):c.createElement(Q.TreeListCell,{key:R,...w})});let v=this.flatData;const O=v.length;r!==void 0&&i!==void 0&&(v=v.slice(r,r+i)),t==="virtual"&&(v=H.tableRowsVirtualization({rows:v,tableViewPortHeight:parseFloat((M.height||M.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const U=v.map(n=>n.level),j=this.columnsMap.length+(p?1:0)+1,q=v.length>0&&v.map((n,f)=>{const I=g.getNestedValue(this.props.editField,n.dataItem),E=this.props.dataItemKey&&g.getter(this.props.dataItemKey)(n.dataItem),k=String(E||n.level.join(".")),x=this.expanded(n.dataItem),d=this.props.selectedField?g.getNestedValue(this.props.selectedField,n.dataItem):void 0,u={key:k,level:n.level,levels:U,dataItem:n.dataItem,selectedField:this.props.selectedField,rowHeight:t==="virtual"?n.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:S=>this.rowClick(S,n),onDoubleClick:S=>this.rowDoubleClick(S,n),onContextMenu:S=>this.rowContextMenu(S,n),isAltRow:f%2!==0,expanded:x,rowIndex:f,ariaRowIndex:j+f,ariaSetSize:n.levelCount,ariaPosInSet:n.level[n.level.length-1]+1,isSelected:typeof d=="boolean"&&d},R=this.props.editRow,L=this.props.row||Y.TreeListRow,w=B(n,I,k,x,f,d);return I&&R?c.createElement(R,{...u,key:u.key},w):c.createElement(L,{...u,key:u.key},w)})||c.createElement("tr",{className:"k-table-row k-grid-norecords"},c.createElement("td",{colSpan:b.length},this.props.noRecords||c.createElement(X.TreeListNoRecords,null))),W=n=>this.props.sort&&this.props.sort.some(f=>f.field===n),_=c.createElement("colgroup",{ref:n=>{this.columnResize.colGroupMain=n}},b.map((n,f)=>c.createElement("col",{key:f.toString(),className:W(n.field)?"k-sorted":void 0,style:n.width!==void 0?{width:n.width}:void 0}))),$=this.props.columnVirtualization||this.props.scrollable==="virtual",G=this.props.selectable&&this.props.selectable.drag?"none":void 0,K=this.props.tableProps||{};return c.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},c.createElement("div",{id:this.props.id,style:this.props.style,className:g.classNames("k-grid k-grid-md","k-treelist",this.props.className,{"k-treelist-scrollable":t!=="none"}),ref:n=>{this.element=n},onScroll:$?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":O,"aria-colcount":b.length,role:"treegrid",...h.tableKeyboardNavigationScopeAttributes},this.props.toolbar,c.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},c.createElement("table",{className:"k-table k-table-md k-grid-table",...K,style:{...K.style||{},userSelect:G},role:"presentation"},_,D,c.createElement("tbody",{className:"k-table-tbody",...h.tableKeyboardNavigationBodyAttributes,role:"presentation"},q))),this.props.pager&&c.createElement(this.props.pager,{className:"k-grid-pager",total:O,skip:r,take:i,onPageChange:this.onPageChange}),s&&c.createElement(c.Fragment,null,c.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),c.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue})),this.showLicenseWatermark&&c.createElement(g.WatermarkOverlay,{message:this.licenseMessage})))}get columns(){const l=this.extendedColumn.filter(t=>t.declarationIndex>=0&&t.parentIndex===-1),e=t=>(t.sort((o,s)=>o.declarationIndex-s.declarationIndex),t.map(o=>{const{declarationIndex:s,parentIndex:r,depth:i,colSpan:p,rowSpan:m,index:C,kFirst:T,groupable:z,children:b,...D}=o;return b.length?{children:e(b),...D}:D}));return e(l)}get flatData(){const{data:l=[],rowHeight:e=0}=this.props;let t=0;const o=r=>{const i={height:e,offsetTop:t};return t+=i.height,i},s=this.updateOnScroll&&this.prevData===l&&this.tbodyOffsetTop>0&&this.flattedData.length?this.flattedData:h.flatData(l,this.expandedSubItems,o);return this.prevData=l,this.flattedData=s,s}selectionChange(l){if(this.props.onSelectionChange){const{event:e,item:t,dataIndex:o,columnIndex:s}=l,{mode:r,cell:i}=h.getSelectionOptions(this.props.selectable),p={...this.getArguments(e.syntheticEvent),dataItem:t.dataItem,level:t.level,startColIndex:s,endColIndex:s,startRowIndex:o,endRowIndex:o,dataItems:this.getLeafDataItems(),altKey:!1,ctrlKey:!1,shiftKey:!1,metaKey:!1,mode:r,cell:i,isDrag:!1,componentId:this._treeListId,selectedField:this.props.selectedField||""};this.props.onSelectionChange.call(void 0,p)}}raiseDataEvent(l,e,t){const o=this.props.onDataStateChange;if(l)l.call(void 0,{...this.getArguments(t),...e});else if(o){const s={...this.getArguments(t),dataState:{...this.getDataState(),...e}};o.call(void 0,s)}}getDataState(){return{filter:this.props.filter,sort:this.props.sort}}getArguments(l){return{nativeEvent:l&&l.nativeEvent,syntheticEvent:l,target:this}}};F.propTypes={data:a.array,resizable:a.bool,reorderable:a.bool,sortable:a.oneOfType([a.bool,a.shape({mode:a.oneOf(["single","multiple"]),allowUnsort:a.bool})]),onSortChange:a.func,sort:a.array,columns:a.arrayOf(a.object),columnVirtualization:a.bool,filter:a.array,onFilterChange:a.func,filterRow:a.any,toolbar:a.any,noRecords:a.any,onExpandChange:a.func,expandField:a.string,subItemsField:a.string,selectedField:a.string,onSelectionChange:a.func,onHeaderSelectionChange:a.func,onRowClick:a.func,onItemChange:a.func,editField:a.string,scrollable:a.oneOf(["none","scrollable","virtual"]),rowHeight:a.number,style:a.object,tableProps:a.object,pager:a.any,skip:a.number,take:a.number,onPageChange:a.func,onDataStateChange:a.func,onColumnResize:a.func,onColumnReorder:a.func,dataItemKey:a.string,navigatable:a.bool},F.contextType=h.TableKeyboardNavigationContext;let N=F;exports.TreeList=N;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const J=require("react"),a=require("prop-types"),g=require("@progress/kendo-react-common"),h=require("@progress/kendo-react-data-tools"),H=require("./utils/index.js"),Q=require("./cells/TreeListCell.js"),X=require("./TreeListNoRecords.js"),Y=require("./rows/TreeListRow.js"),P=require("./package-metadata.js");function Z(y){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(y){for(const e in y)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(y,e);Object.defineProperty(l,e,t.get?t:{enumerable:!0,get:()=>y[e]})}}return l.default=y,Object.freeze(l)}const c=Z(J),F=class F extends c.Component{constructor(l){super(l),this.element=null,this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.contextStateRef={current:void 0},this.navigationStateRef={current:void 0},this.showLicenseWatermark=!1,this.licenseMessage=void 0,this.scrollIntoView=e=>{if(!this.element)return;const{rowIndex:t=0}=e,{scrollable:o,rowHeight:s=0}=this.props;if(o==="virtual"||s)this.element.scroll(0,(t-1)*s);else{const r=this.element.querySelector(`tbody > tr:nth-child(${t})`);if(r){const i=r.offsetTop-this.tbodyOffsetTop;this.element.scroll(0,i)}}},this.getExtendedColumn=g.memoizeOne((e,t)=>h.readColumns(e,{prevId:0,idPrefix:t})),this.getColumnsMap=g.memoizeOne((e,t)=>h.mapColumns(e,t)),this.onKeyDown=e=>{if(h.tableKeyboardNavigation.onKeyDown(e,{navigatable:!1,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),this.props.onKeyDown){const{mode:t,cell:o}=h.getSelectionOptions(this.props.selectable),s={dataItems:this.getLeafDataItems(),mode:t,cell:o,componentId:this._treeListId,selectedField:this.props.selectedField,...this.getArguments(e)};this.props.onKeyDown.call(void 0,s)}},this.onFocus=e=>{h.tableKeyboardNavigation.onFocus(e,{contextStateRef:this.contextStateRef})},this.onRowDrag=e=>{this.props.onRowDrag&&this.props.onRowDrag.call(void 0,{...e,target:this})},this.onRowDrop=e=>{this.props.onRowDrop&&this.props.onRowDrop.call(void 0,{...e,target:this})},this.columnReorder=(e,t,o)=>{const s=this.extendedColumn[e].depth,r=p=>{do p++;while(p<this.extendedColumn.length&&this.extendedColumn[p].depth>s);return p},i=this.extendedColumn.splice(e,r(e)-e);if(this.extendedColumn.splice(e<t?r(t-i.length):t,0,...i),this.extendedColumn.filter(p=>p.declarationIndex>=0).forEach((p,m)=>p.orderIndex=m),this.props.onColumnReorder){const p={target:this,columns:this.columns,nativeEvent:o};this.props.onColumnReorder.call(void 0,p)}},this.onResize=(e,t,o,s,r)=>{if(this.props.onColumnResize){const i=this.extendedColumn.filter(m=>m.children.length===0).reduce((m,C)=>m+=parseFloat(String(C.width)),0),p={columns:this.columns,totalWidth:i,index:e,nativeEvent:s,newWidth:t,oldWidth:o,end:r,target:this};this.props.onColumnResize.call(void 0,p)}},this.handleOnScroll=e=>{const t=e.currentTarget.scrollLeft,o=e.currentTarget.scrollTop,{columnVirtualization:s,scrollable:r,rowHeight:i=0}=this.props,p=i,m=0;let C=!1;s&&Math.abs(this.wrapperScrollLeft-t)>m&&(this.wrapperScrollLeft=t,C=!0),r==="virtual"&&Math.abs(this.wrapperScrollTop-o)>p&&(this.wrapperScrollTop=o,C=!0),C&&(this.updateOnScroll=!0,this.forceUpdate())},this.calculateSizes=e=>{if(!e||this.props.scrollable==="none")return;const t=Array.from(e.childNodes),o=t.find(i=>i.nodeName==="TABLE"),s=this.props.toolbar&&t.find(i=>i.nodeType===1&&i.classList.contains("k-grid-toolbar"));let r=0;if(s){const i=s.style.boxSizing;s.style.boxSizing="border-box",r=parseFloat(String(window.getComputedStyle(s).height))||s.offsetHeight,s.style.boxSizing=i,s.getAttribute("style")||s.removeAttribute("style")}this.tbodyOffsetTop=o.tBodies[0].offsetTop,H.setHeaderRowsTop(o,r)},this.itemChange=e=>{const t=this.props.onItemChange;if(e.field===this.props.expandField){const o=this.props.onExpandChange;if(o){const s={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,value:e.value};o.call(void 0,s)}return}if(t){const o={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,field:e.field,value:e.value};t.call(void 0,o)}},this.onHeaderSelectionChange=e=>{if(this.props.onHeaderSelectionChange){const t={field:e.field,nativeEvent:e.syntheticEvent&&e.syntheticEvent.nativeEvent,syntheticEvent:e.syntheticEvent,target:this,dataItems:this.getLeafDataItems()};this.props.onHeaderSelectionChange.call(void 0,t)}},this.selectionRelease=e=>{if(this.props.onSelectionChange){const t={syntheticEvent:void 0,target:this,selectedField:this.props.selectedField||"",componentId:this._treeListId,dataItems:this.getLeafDataItems(),dataItem:null,level:[],...e};this.props.onSelectionChange.call(void 0,t)}},this.sortChange=(e,t,o)=>{this.raiseDataEvent(this.props.onSortChange,{sort:t,field:o},e)},this.headerFilterChange=(e,t,o)=>{this.raiseDataEvent(this.props.onFilterChange,{filter:t,field:o},e)},this.filterChange=e=>{const{filter:t,field:o}=e;this.raiseDataEvent(this.props.onFilterChange,{filter:t,field:o},e.syntheticEvent)},this.columnMenuFilterChange=(e,t,o)=>{const{onColumnMenuFilterChange:s}=this.props;if(!s)return;const r={syntheticEvent:e,filter:t,field:o,target:this,nativeEvent:e.nativeEvent};s.call(void 0,r)},this.expandChange=(e,t,o)=>{const{expandField:s,onExpandChange:r}=this.props;if(s&&r){const i={...this.getArguments(e),dataItem:t,level:o,value:this.expanded(t)};r.call(void 0,i)}},this.rowClick=(e,t)=>{if(this.props.onRowClick&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowClick.call(void 0,o)}},this.rowDoubleClick=(e,t)=>{if(this.props.onRowDoubleClick&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowDoubleClick.call(void 0,o)}},this.rowContextMenu=(e,t)=>{if(this.props.onRowContextMenu&&e.target.nodeName==="TD"){const o={dataItem:t.dataItem,level:t.level,...this.getArguments(e)};this.props.onRowContextMenu.call(void 0,o)}},this.onPageChange=e=>{if(this.props.onPageChange){const t={...this.getArguments(e.syntheticEvent),skip:e.skip,take:e.take};this.props.onPageChange.call(void 0,t)}},this.expandedSubItems=e=>{const t=[];return this.expanded(e)&&this.hasChildren(e)&&t.push(...g.getNestedValue(this.props.subItemsField,e)),t},this.getLeafDataItems=()=>this.flatData.map(e=>e.dataItem),this.expanded=e=>!!g.getNestedValue(this.props.expandField,e),this.hasChildren=e=>!!g.getNestedValue(this.props.subItemsField,e),this.showLicenseWatermark=!g.validatePackage(P.packageMetadata,{component:"TreeList"}),this.licenseMessage=g.getLicenseMessage(P.packageMetadata),this.dragLogic=new h.CommonDragLogic(this.columnReorder,g.noop,g.noop),this.columnResize=new h.ColumnResize(this.onResize.bind(this)),h.tableKeyboardNavigation.onConstructor({navigatable:!!l.navigatable,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}get _treeListId(){return this.props.id+"-treelist"}get document(){if(g.canUseDOM)return this.element&&this.element.ownerDocument||document}componentDidMount(){this.calculateSizes(this.element),h.tableKeyboardNavigation.onComponentDidMount({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}getSnapshotBeforeUpdate(){return h.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({document:this.document,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),null}componentDidUpdate(l){l.columns!==this.props.columns&&this.calculateSizes(this.element),h.tableKeyboardNavigation.onComponentDidUpdate({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}componentWillUnmount(){this.columnsMap=[],this.prevData=[],this.flattedData=[],this.updateOnScroll=!1,this.getExtendedColumn.clear(),this.getColumnsMap.clear()}render(){const{columns:l=[],filterRow:e,scrollable:t="scrollable",resizable:o=!1,reorderable:s=!1,skip:r,take:i}=this.props,p=l.some(n=>!!n.filter||!!n.filterCell)||e!==void 0,m=e||h.FilterRow,C=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef),T=this.getExtendedColumn(l,C),z=T.length!==this.extendedColumn.length;this.extendedColumn=T,this.columnsMap=this.getColumnsMap(this.extendedColumn,z);const b=this.extendedColumn.filter(n=>n.children.length===0);this.columnResize.columns=this.extendedColumn,this.columnResize.resizable=o,this.dragLogic.columns=this.extendedColumn,this.dragLogic.reorderable=s,this.dragLogic.groupable=!1;const D=c.createElement(h.Header,{headerRow:c.createElement(h.HeaderRow,{sort:this.props.sort,sortable:this.props.sortable,sortChange:this.sortChange,selectionChange:this.onHeaderSelectionChange,columns:this.extendedColumn,columnsMap:this.columnsMap,cellRender:this.props.headerCellRender,columnResize:this.columnResize,columnMenu:this.props.columnMenu,columnMenuFilter:this.props.columnMenuFilter,columnMenuFilterChange:this.columnMenuFilterChange,pressHandler:this.dragLogic.pressHandler,dragHandler:this.dragLogic.dragHandler,releaseHandler:this.dragLogic.releaseHandler,filterChange:this.headerFilterChange}),reorderable:this.props.reorderable,filterRow:p&&c.createElement(m,{columns:b,filter:this.props.filter,filterChange:this.filterChange,sort:this.props.sort,ariaRowIndex:this.columnsMap.length+1})||void 0,columnResize:this.columnResize}),M=this.props.style||{},{colSpans:A,hiddenColumns:V}=h.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:b,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((M.width||"").toString())}),B=(n,f,I,E,k,x)=>b.map((d,u)=>{if(V[u])return null;const R=d.id?d.id:u,L=`${d.className?d.className+" ":""}${d.locked?"k-grid-content-sticky":""}`,w={id:h.tableKeyboardNavigationTools.generateNavigatableId(`${I}-${String(u)}`,C),colSpan:A[u],dataItem:n.dataItem,field:d.field,format:d.format,className:L||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?S=>{this.selectionChange({event:S,item:n,columnIndex:u,dataIndex:k})}:void 0,level:n.level,expandable:d.expandable,expanded:E,hasChildren:this.hasChildren(n.dataItem),onExpandChange:this.expandChange,colIndex:u,ariaColumnIndex:d.ariaColumnIndex,style:d.left!==void 0&&{left:d.left,right:d.right,borderRightWidth:d.rightBorder?"1px":""}||{},isSelected:Array.isArray(x)&&x.indexOf(u)>-1};return f&&d.editCell?c.createElement(d.editCell,{key:R,...w,onChange:this.itemChange}):d.cell?c.createElement(d.cell,{key:R,...w}):c.createElement(Q.TreeListCell,{key:R,...w})});let v=this.flatData;const O=v.length;r!==void 0&&i!==void 0&&(v=v.slice(r,r+i)),t==="virtual"&&(v=H.tableRowsVirtualization({rows:v,tableViewPortHeight:parseFloat((M.height||M.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const U=v.map(n=>n.level),j=this.columnsMap.length+(p?1:0)+1,q=v.length>0&&v.map((n,f)=>{const I=g.getNestedValue(this.props.editField,n.dataItem),E=this.props.dataItemKey&&g.getter(this.props.dataItemKey)(n.dataItem),k=String(E||n.level.join(".")),x=this.expanded(n.dataItem),d=this.props.selectedField?g.getNestedValue(this.props.selectedField,n.dataItem):void 0,u={key:k,level:n.level,levels:U,dataItem:n.dataItem,selectedField:this.props.selectedField,rowHeight:t==="virtual"?n.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:S=>this.rowClick(S,n),onDoubleClick:S=>this.rowDoubleClick(S,n),onContextMenu:S=>this.rowContextMenu(S,n),isAltRow:f%2!==0,expanded:x,rowIndex:f,ariaRowIndex:j+f,ariaSetSize:n.levelCount,ariaPosInSet:n.level[n.level.length-1]+1,isSelected:typeof d=="boolean"&&d},R=this.props.editRow,L=this.props.row||Y.TreeListRow,w=B(n,I,k,x,f,d);return I&&R?c.createElement(R,{...u,key:u.key},w):c.createElement(L,{...u,key:u.key},w)})||c.createElement("tr",{className:"k-table-row k-grid-norecords"},c.createElement("td",{colSpan:b.length},this.props.noRecords||c.createElement(X.TreeListNoRecords,null))),W=n=>this.props.sort&&this.props.sort.some(f=>f.field===n),_=c.createElement("colgroup",{ref:n=>{this.columnResize.colGroupMain=n}},b.map((n,f)=>c.createElement("col",{key:f.toString(),className:W(n.field)?"k-sorted":void 0,style:n.width!==void 0?{width:n.width}:void 0}))),$=this.props.columnVirtualization||this.props.scrollable==="virtual",G=this.props.selectable&&this.props.selectable.drag?"none":void 0,K=this.props.tableProps||{};return c.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},c.createElement("div",{id:this.props.id,style:this.props.style,className:g.classNames("k-grid","k-treelist",this.props.className,{"k-treelist-scrollable":t!=="none"}),ref:n=>{this.element=n},onScroll:$?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":O,"aria-colcount":b.length,role:"treegrid",...h.tableKeyboardNavigationScopeAttributes},this.props.toolbar,c.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},c.createElement("table",{className:"k-table k-grid-table",...K,style:{...K.style||{},userSelect:G},role:"presentation"},_,D,c.createElement("tbody",{className:"k-table-tbody",...h.tableKeyboardNavigationBodyAttributes,role:"presentation"},q))),this.props.pager&&c.createElement(this.props.pager,{className:"k-grid-pager",total:O,skip:r,take:i,onPageChange:this.onPageChange}),s&&c.createElement(c.Fragment,null,c.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),c.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue})),this.showLicenseWatermark&&c.createElement(g.WatermarkOverlay,{message:this.licenseMessage})))}get columns(){const l=this.extendedColumn.filter(t=>t.declarationIndex>=0&&t.parentIndex===-1),e=t=>(t.sort((o,s)=>o.declarationIndex-s.declarationIndex),t.map(o=>{const{declarationIndex:s,parentIndex:r,depth:i,colSpan:p,rowSpan:m,index:C,kFirst:T,groupable:z,children:b,...D}=o;return b.length?{children:e(b),...D}:D}));return e(l)}get flatData(){const{data:l=[],rowHeight:e=0}=this.props;let t=0;const o=r=>{const i={height:e,offsetTop:t};return t+=i.height,i},s=this.updateOnScroll&&this.prevData===l&&this.tbodyOffsetTop>0&&this.flattedData.length?this.flattedData:h.flatData(l,this.expandedSubItems,o);return this.prevData=l,this.flattedData=s,s}selectionChange(l){if(this.props.onSelectionChange){const{event:e,item:t,dataIndex:o,columnIndex:s}=l,{mode:r,cell:i}=h.getSelectionOptions(this.props.selectable),p={...this.getArguments(e.syntheticEvent),dataItem:t.dataItem,level:t.level,startColIndex:s,endColIndex:s,startRowIndex:o,endRowIndex:o,dataItems:this.getLeafDataItems(),altKey:!1,ctrlKey:!1,shiftKey:!1,metaKey:!1,mode:r,cell:i,isDrag:!1,componentId:this._treeListId,selectedField:this.props.selectedField||""};this.props.onSelectionChange.call(void 0,p)}}raiseDataEvent(l,e,t){const o=this.props.onDataStateChange;if(l)l.call(void 0,{...this.getArguments(t),...e});else if(o){const s={...this.getArguments(t),dataState:{...this.getDataState(),...e}};o.call(void 0,s)}}getDataState(){return{filter:this.props.filter,sort:this.props.sort}}getArguments(l){return{nativeEvent:l&&l.nativeEvent,syntheticEvent:l,target:this}}};F.propTypes={data:a.array,resizable:a.bool,reorderable:a.bool,sortable:a.oneOfType([a.bool,a.shape({mode:a.oneOf(["single","multiple"]),allowUnsort:a.bool})]),onSortChange:a.func,sort:a.array,columns:a.arrayOf(a.object),columnVirtualization:a.bool,filter:a.array,onFilterChange:a.func,filterRow:a.any,toolbar:a.any,noRecords:a.any,onExpandChange:a.func,expandField:a.string,subItemsField:a.string,selectedField:a.string,onSelectionChange:a.func,onHeaderSelectionChange:a.func,onRowClick:a.func,onItemChange:a.func,editField:a.string,scrollable:a.oneOf(["none","scrollable","virtual"]),rowHeight:a.number,style:a.object,tableProps:a.object,pager:a.any,skip:a.number,take:a.number,onPageChange:a.func,onDataStateChange:a.func,onColumnResize:a.func,onColumnReorder:a.func,dataItemKey:a.string,navigatable:a.bool},F.contextType=h.TableKeyboardNavigationContext;let N=F;exports.TreeList=N;
package/TreeList.mjs CHANGED
@@ -8,7 +8,7 @@
8
8
  import * as r from "react";
9
9
  import n from "prop-types";
10
10
  import { memoizeOne as H, getNestedValue as x, validatePackage as Y, getLicenseMessage as Z, noop as A, canUseDOM as ee, getter as te, classNames as oe, WatermarkOverlay as se } from "@progress/kendo-react-common";
11
- import { readColumns as ne, mapColumns as ae, tableKeyboardNavigation as R, getSelectionOptions as K, CommonDragLogic as ie, ColumnResize as le, TableKeyboardNavigationContext as O, tableKeyboardNavigationTools as P, Header as re, HeaderRow as he, tableColumnsVirtualization as de, tableKeyboardNavigationScopeAttributes as ce, TableSelection as pe, tableKeyboardNavigationBodyAttributes as ge, DropClue as me, DragClue as ue, flatData as fe, FilterRow as Ce } from "@progress/kendo-react-data-tools";
11
+ import { readColumns as ne, mapColumns as ae, tableKeyboardNavigation as R, getSelectionOptions as K, CommonDragLogic as ie, ColumnResize as le, TableKeyboardNavigationContext as O, tableKeyboardNavigationTools as P, Header as re, FilterRow as he, HeaderRow as de, tableColumnsVirtualization as ce, tableKeyboardNavigationScopeAttributes as pe, TableSelection as ge, tableKeyboardNavigationBodyAttributes as me, DropClue as ue, DragClue as fe, flatData as Ce } from "@progress/kendo-react-data-tools";
12
12
  import { setHeaderRowsTop as ve, tableRowsVirtualization as be } from "./utils/index.mjs";
13
13
  import { TreeListCell as Se } from "./cells/TreeListCell.mjs";
14
14
  import { TreeListNoRecords as Re } from "./TreeListNoRecords.mjs";
@@ -281,7 +281,7 @@ const k = class k extends r.Component {
281
281
  reorderable: s = !1,
282
282
  skip: l,
283
283
  take: i
284
- } = this.props, c = h.some((a) => !!a.filter || !!a.filterCell) || e !== void 0, g = e || Ce, u = P.getIdPrefix(this.navigationStateRef), F = this.getExtendedColumn(h, u), z = F.length !== this.extendedColumn.length;
284
+ } = this.props, c = h.some((a) => !!a.filter || !!a.filterCell) || e !== void 0, g = e || he, u = P.getIdPrefix(this.navigationStateRef), F = this.getExtendedColumn(h, u), z = F.length !== this.extendedColumn.length;
285
285
  this.extendedColumn = F, this.columnsMap = this.getColumnsMap(this.extendedColumn, z);
286
286
  const f = this.extendedColumn.filter((a) => a.children.length === 0);
287
287
  this.columnResize.columns = this.extendedColumn, this.columnResize.resizable = o, this.dragLogic.columns = this.extendedColumn, this.dragLogic.reorderable = s, this.dragLogic.groupable = !1;
@@ -289,7 +289,7 @@ const k = class k extends r.Component {
289
289
  re,
290
290
  {
291
291
  headerRow: /* @__PURE__ */ r.createElement(
292
- he,
292
+ de,
293
293
  {
294
294
  sort: this.props.sort,
295
295
  sortable: this.props.sortable,
@@ -321,7 +321,7 @@ const k = class k extends r.Component {
321
321
  ) || void 0,
322
322
  columnResize: this.columnResize
323
323
  }
324
- ), M = this.props.style || {}, { colSpans: U, hiddenColumns: W } = de({
324
+ ), M = this.props.style || {}, { colSpans: U, hiddenColumns: W } = ce({
325
325
  enabled: this.props.columnVirtualization,
326
326
  columns: f,
327
327
  scrollLeft: this.wrapperScrollLeft,
@@ -408,7 +408,7 @@ const k = class k extends r.Component {
408
408
  {
409
409
  id: this.props.id,
410
410
  style: this.props.style,
411
- className: oe("k-grid k-grid-md", "k-treelist", this.props.className, {
411
+ className: oe("k-grid", "k-treelist", this.props.className, {
412
412
  "k-treelist-scrollable": t !== "none"
413
413
  }),
414
414
  ref: (a) => {
@@ -420,13 +420,13 @@ const k = class k extends r.Component {
420
420
  "aria-rowcount": T,
421
421
  "aria-colcount": f.length,
422
422
  role: "treegrid",
423
- ...ce
423
+ ...pe
424
424
  },
425
425
  this.props.toolbar,
426
- /* @__PURE__ */ r.createElement(pe, { selectable: this.props.selectable, onRelease: this.selectionRelease }, /* @__PURE__ */ r.createElement(
426
+ /* @__PURE__ */ r.createElement(ge, { selectable: this.props.selectable, onRelease: this.selectionRelease }, /* @__PURE__ */ r.createElement(
427
427
  "table",
428
428
  {
429
- className: "k-table k-table-md k-grid-table",
429
+ className: "k-table k-grid-table",
430
430
  ...N,
431
431
  style: { ...N.style || {}, userSelect: X },
432
432
  role: "presentation"
@@ -437,7 +437,7 @@ const k = class k extends r.Component {
437
437
  "tbody",
438
438
  {
439
439
  className: "k-table-tbody",
440
- ...ge,
440
+ ...me,
441
441
  role: "presentation"
442
442
  },
443
443
  _
@@ -453,7 +453,7 @@ const k = class k extends r.Component {
453
453
  onPageChange: this.onPageChange
454
454
  }
455
455
  ),
456
- s && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(me, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ r.createElement(ue, { ref: this.dragLogic.refDragElementClue })),
456
+ s && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(ue, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ r.createElement(fe, { ref: this.dragLogic.refDragElementClue })),
457
457
  this.showLicenseWatermark && /* @__PURE__ */ r.createElement(se, { message: this.licenseMessage })
458
458
  ));
459
459
  }
@@ -484,7 +484,7 @@ const k = class k extends r.Component {
484
484
  const o = (l) => {
485
485
  const i = { height: e, offsetTop: t };
486
486
  return t += i.height, i;
487
- }, s = this.updateOnScroll && this.prevData === h && this.tbodyOffsetTop > 0 && this.flattedData.length ? this.flattedData : fe(h, this.expandedSubItems, o);
487
+ }, s = this.updateOnScroll && this.prevData === h && this.tbodyOffsetTop > 0 && this.flattedData.length ? this.flattedData : Ce(h, this.expandedSubItems, o);
488
488
  return this.prevData = h, this.flattedData = s, s;
489
489
  }
490
490
  selectionChange(h) {
@@ -0,0 +1,19 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListNoRecordsProps } from './interfaces/TreeListNoRecordsProps.js';
9
+ import * as React from 'react';
10
+ /**
11
+ * Represents the TreeListNoRecords component.
12
+ * The component is rendered when the `data` property of the TreeList is an empty array or undefined.
13
+ */
14
+ export declare class TreeListNoRecords extends React.Component<TreeListNoRecordsProps, {}> {
15
+ /**
16
+ * @hidden
17
+ */
18
+ render(): any;
19
+ }
@@ -0,0 +1,29 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListToolbarProps } from './interfaces/TreeListToolbarProps.js';
9
+ import * as React from 'react';
10
+ /**
11
+ * Represents the object which is returned from the `ref` callback of the [TreeListToolbar](https://www.telerik.com/kendo-react-ui/components/treelist/api/treelisttoolbar).
12
+ *
13
+ * For more information about Refs, refer to the [React Refs & Dom](https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom) article.
14
+ */
15
+ export interface TreeListToolbarHandle {
16
+ /**
17
+ * The DOM element of the TreeListToolbar.
18
+ */
19
+ element: HTMLDivElement | null;
20
+ /**
21
+ * The props of the TreeListToolbar.
22
+ */
23
+ props: TreeListToolbarProps;
24
+ }
25
+ /**
26
+ * Represents the TreeListToolbar component rendered by the [KendoReact TreeList component](https://www.telerik.com/kendo-react-ui/components/treelist).
27
+ */
28
+ export declare const TreeListToolbar: React.ForwardRefExoticComponent<TreeListToolbarProps & React.RefAttributes<TreeListToolbarHandle>>;
29
+ export type TreeListToolbar = TreeListToolbarHandle;
@@ -0,0 +1,15 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListCellProps } from '../../interfaces/TreeListCellProps.js';
9
+ import * as React from 'react';
10
+ export interface TreeListBooleanEditorProps extends TreeListCellProps {
11
+ }
12
+ export declare const TreeListBooleanEditor: {
13
+ (props: TreeListBooleanEditorProps): React.JSX.Element | null;
14
+ displayName: string;
15
+ };
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),c=require("@progress/kendo-react-common"),u=require("@progress/kendo-react-data-tools"),m=require("../../constants/index.js");function b(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const l=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,l.get?l:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=b(s),o=e=>{const a=n.useCallback(i=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:i,value:i.target.checked})},[e.onChange,e.dataItem,e.level,e.field]),t=c.useId(),l=u.useTableKeyboardNavigation(e.id),r=c.classNames({"k-selected":e.isSelected},e.className),d=n.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...l,[m.TREELIST_COL_INDEX_ATTRIBUTE]:e.colIndex},n.createElement("input",{checked:c.getNestedValue(e.field,e.dataItem)||!1,id:t,type:"checkbox",className:"k-checkbox k-checkbox-md k-rounded-md",onChange:a}),n.createElement("label",{className:"k-checkbox-label",htmlFor:t}));return e.render?e.render.call(void 0,d,e):d};o.displayName="KendoReactTreeListBooleanEditor";exports.TreeListBooleanEditor=o;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),c=require("@progress/kendo-react-common"),u=require("@progress/kendo-react-data-tools"),m=require("../../constants/index.js");function b(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const l=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,l.get?l:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=b(s),o=e=>{const a=n.useCallback(d=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:d,value:d.target.checked})},[e.onChange,e.dataItem,e.level,e.field]),t=c.useId(),l=u.useTableKeyboardNavigation(e.id),r=c.classNames({"k-selected":e.isSelected},e.className),i=n.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...l,[m.TREELIST_COL_INDEX_ATTRIBUTE]:e.colIndex},n.createElement("input",{checked:c.getNestedValue(e.field,e.dataItem)||!1,id:t,type:"checkbox",className:"k-checkbox",onChange:a}),n.createElement("label",{className:"k-checkbox-label",htmlFor:t}));return e.render?e.render.call(void 0,i,e):i};o.displayName="KendoReactTreeListBooleanEditor";exports.TreeListBooleanEditor=o;
@@ -8,16 +8,16 @@
8
8
  import * as t from "react";
9
9
  import { useId as m, classNames as o, getNestedValue as s } from "@progress/kendo-react-common";
10
10
  import { useTableKeyboardNavigation as r } from "@progress/kendo-react-data-tools";
11
- import { TREELIST_COL_INDEX_ATTRIBUTE as h } from "../../constants/index.mjs";
12
- const k = (e) => {
13
- const c = t.useCallback(
14
- (d) => {
11
+ import { TREELIST_COL_INDEX_ATTRIBUTE as f } from "../../constants/index.mjs";
12
+ const h = (e) => {
13
+ const d = t.useCallback(
14
+ (c) => {
15
15
  e.onChange && e.onChange({
16
16
  dataItem: e.dataItem,
17
17
  level: e.level,
18
18
  field: e.field,
19
- syntheticEvent: d,
20
- value: d.target.checked
19
+ syntheticEvent: c,
20
+ value: c.target.checked
21
21
  });
22
22
  },
23
23
  [e.onChange, e.dataItem, e.level, e.field]
@@ -35,7 +35,7 @@ const k = (e) => {
35
35
  "aria-selected": e.isSelected,
36
36
  role: "gridcell",
37
37
  ...n,
38
- [h]: e.colIndex
38
+ [f]: e.colIndex
39
39
  },
40
40
  /* @__PURE__ */ t.createElement(
41
41
  "input",
@@ -43,15 +43,15 @@ const k = (e) => {
43
43
  checked: s(e.field, e.dataItem) || !1,
44
44
  id: a,
45
45
  type: "checkbox",
46
- className: "k-checkbox k-checkbox-md k-rounded-md",
47
- onChange: c
46
+ className: "k-checkbox",
47
+ onChange: d
48
48
  }
49
49
  ),
50
50
  /* @__PURE__ */ t.createElement("label", { className: "k-checkbox-label", htmlFor: a })
51
51
  );
52
52
  return e.render ? e.render.call(void 0, l, e) : l;
53
53
  };
54
- k.displayName = "KendoReactTreeListBooleanEditor";
54
+ h.displayName = "KendoReactTreeListBooleanEditor";
55
55
  export {
56
- k as TreeListBooleanEditor
56
+ h as TreeListBooleanEditor
57
57
  };
@@ -0,0 +1,15 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListCellProps } from '../../interfaces/TreeListCellProps.js';
9
+ import * as React from 'react';
10
+ export interface TreeListDateEditorProps extends TreeListCellProps {
11
+ }
12
+ export declare const TreeListDateEditor: {
13
+ (props: TreeListDateEditorProps): React.JSX.Element | null;
14
+ displayName: string;
15
+ };
@@ -0,0 +1,15 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListCellProps } from '../../interfaces/TreeListCellProps.js';
9
+ import * as React from 'react';
10
+ export interface TreeListNumericEditorProps extends TreeListCellProps {
11
+ }
12
+ export declare const TreeListNumericEditor: {
13
+ (props: TreeListNumericEditorProps): React.ReactElement<HTMLTableCellElement, string | React.JSXElementConstructor<any>> | null;
14
+ displayName: string;
15
+ };
@@ -0,0 +1,15 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { TreeListCellProps } from '../../interfaces/TreeListCellProps.js';
9
+ import * as React from 'react';
10
+ export interface TreeListTextEditorProps extends TreeListCellProps {
11
+ }
12
+ export declare const TreeListTextEditor: {
13
+ (props: TreeListTextEditorProps): React.JSX.Element | null;
14
+ displayName: string;
15
+ };
@@ -0,0 +1,17 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { FilterComponentProps } from '@progress/kendo-react-data-tools';
9
+ import { TreeListFilterOperator } from '../../interfaces/TreeListFilterOperator.js';
10
+ import * as React from 'react';
11
+ export interface TreeListBooleanFilterProps extends FilterComponentProps {
12
+ /**
13
+ * The list of the operators.
14
+ */
15
+ operators?: TreeListFilterOperator[];
16
+ }
17
+ export declare const TreeListBooleanFilter: React.FunctionComponent<TreeListBooleanFilterProps>;
@@ -0,0 +1,17 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { FilterComponentProps } from '@progress/kendo-react-data-tools';
9
+ import { TreeListFilterOperator } from '../../interfaces/TreeListFilterOperator.js';
10
+ import * as React from 'react';
11
+ export interface TreeListDateFilterProps extends FilterComponentProps {
12
+ /**
13
+ * The list of the operators.
14
+ */
15
+ operators?: TreeListFilterOperator[];
16
+ }
17
+ export declare const TreeListDateFilter: React.FunctionComponent<TreeListDateFilterProps>;
@@ -0,0 +1,17 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { FilterComponentProps } from '@progress/kendo-react-data-tools';
9
+ import { TreeListFilterOperator } from '../../interfaces/TreeListFilterOperator.js';
10
+ import * as React from 'react';
11
+ export interface TreeListNumericFilterProps extends FilterComponentProps {
12
+ /**
13
+ * The list of the operators.
14
+ */
15
+ operators?: TreeListFilterOperator[];
16
+ }
17
+ export declare const TreeListNumericFilter: React.FunctionComponent<TreeListNumericFilterProps>;
@@ -0,0 +1,17 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { FilterComponentProps } from '@progress/kendo-react-data-tools';
9
+ import { TreeListFilterOperator } from '../../interfaces/TreeListFilterOperator.js';
10
+ import * as React from 'react';
11
+ export interface TreeListTextFilterProps extends FilterComponentProps {
12
+ /**
13
+ * The list of the operators.
14
+ */
15
+ operators?: TreeListFilterOperator[];
16
+ }
17
+ export declare const TreeListTextFilter: React.FunctionComponent<TreeListTextFilterProps>;
@@ -0,0 +1,45 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { LocalizationService } from '@progress/kendo-react-intl';
9
+ import { TreeListFilterOperator } from '../../interfaces/TreeListFilterOperator.js';
10
+ /**
11
+ * @hidden
12
+ */
13
+ export declare const textFilterOperators: TreeListFilterOperator[];
14
+ /**
15
+ * @hidden
16
+ */
17
+ export declare const numericFilterOperators: TreeListFilterOperator[];
18
+ /**
19
+ * @hidden
20
+ */
21
+ export declare const dateFilterOperators: TreeListFilterOperator[];
22
+ /**
23
+ * @hidden
24
+ */
25
+ export declare const booleanOperator: string;
26
+ /**
27
+ * @hidden
28
+ */
29
+ export declare const booleanFilterValues: ({
30
+ text: string;
31
+ operator: string;
32
+ } | {
33
+ text: string;
34
+ operator: boolean;
35
+ })[];
36
+ /**
37
+ * @hidden
38
+ */
39
+ export declare function localizeFilter(localization: LocalizationService, operators: TreeListFilterOperator[]): {
40
+ clearButtonTitle: string;
41
+ operators: {
42
+ text: string;
43
+ operator: any;
44
+ }[];
45
+ };