@progress/kendo-react-treelist 7.4.0-develop.8 → 7.4.0
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.
- package/TreeList.js +1 -1
- package/TreeList.mjs +87 -87
- package/dist/cdn/js/kendo-react-treelist.js +1 -1
- package/package-metadata.mjs +1 -1
- package/package.json +8 -8
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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("react"),n=require("prop-types"),g=require("@progress/kendo-react-common"),h=require("@progress/kendo-react-data-tools"),O=require("./utils/index.js"),$=require("./cells/TreeListCell.js"),G=require("./TreeListNoRecords.js"),J=require("./rows/TreeListRow.js"),Q=require("./package-metadata.js");function X(x){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(x){for(const e in x)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(x,e);Object.defineProperty(l,e,t.get?t:{enumerable:!0,get:()=>x[e]})}}return l.default=x,Object.freeze(l)}const d=X(W),T=class T extends d.Component{constructor(l){super(l),this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.element=null,this.contextStateRef={current:void 0},this.navigationStateRef={current: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=>h.mapColumns(e)),this.onKeyDown=e=>{if(h.tableKeyboardNavigation.onKeyDown(e,{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,O.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),g.validatePackage(Q.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(a=>!!a.filter||!!a.filterCell)||e!==void 0,m=e||h.FilterRow,C=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef);this.extendedColumn=this.getExtendedColumn(l,C),this.columnsMap=this.getColumnsMap(this.extendedColumn);const v=this.extendedColumn.filter(a=>a.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 M=d.createElement(h.Header,{headerRow:d.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}),filterRow:p&&d.createElement(m,{columns:v,filter:this.props.filter,filterChange:this.filterChange,sort:this.props.sort,ariaRowIndex:this.columnsMap.length+1})||void 0,columnResize:this.columnResize}),R=this.props.style||{},{colSpans:I,hiddenColumns:H}=h.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:v,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((R.width||"").toString())}),P=(a,f,E,k,F,D)=>v.map((c,u)=>{if(H[u])return null;const w=c.id?c.id:u,N=`${c.className?c.className+" ":""}${c.locked?"k-grid-content-sticky":""}`,y={id:h.tableKeyboardNavigationTools.generateNavigatableId(`${E}-${String(u)}`,C),colSpan:I[u],dataItem:a.dataItem,field:c.field,format:c.format,className:N||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?S=>{this.selectionChange({event:S,item:a,columnIndex:u,dataIndex:F})}:void 0,level:a.level,expandable:c.expandable,expanded:k,hasChildren:this.hasChildren(a.dataItem),onExpandChange:this.expandChange,colIndex:u,ariaColumnIndex:c.ariaColumnIndex,style:c.left!==void 0&&{left:c.left,right:c.right,borderRightWidth:c.rightBorder?"1px":""}||{},isSelected:Array.isArray(D)&&D.indexOf(u)>-1};return f&&c.editCell?d.createElement(c.editCell,{key:w,...y,onChange:this.itemChange}):c.cell?d.createElement(c.cell,{key:w,...y}):d.createElement($.TreeListCell,{key:w,...y})});let b=this.flatData;const L=b.length;r!==void 0&&i!==void 0&&(b=b.slice(r,r+i)),t==="virtual"&&(b=O.tableRowsVirtualization({rows:b,tableViewPortHeight:parseFloat((R.height||R.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const A=b.map(a=>a.level),V=this.columnsMap.length+(p?1:0)+1,B=b.length>0&&b.map((a,f)=>{const E=g.getNestedValue(this.props.editField,a.dataItem),k=this.props.dataItemKey&&g.getter(this.props.dataItemKey)(a.dataItem),F=String(k||a.level.join(".")),D=this.expanded(a.dataItem),c=this.props.selectedField?g.getNestedValue(this.props.selectedField,a.dataItem):void 0,u={key:F,level:a.level,levels:A,dataItem:a.dataItem,selectedField:this.props.selectedField,rowHeight:t==="virtual"?a.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:S=>this.rowClick(S,a),onDoubleClick:S=>this.rowDoubleClick(S,a),onContextMenu:S=>this.rowContextMenu(S,a),isAltRow:f%2!==0,expanded:D,rowIndex:f,ariaRowIndex:V+f,ariaSetSize:a.levelCount,ariaPosInSet:a.level[a.level.length-1]+1,isSelected:typeof c=="boolean"&&c},w=this.props.editRow,N=this.props.row||J.TreeListRow,y=P(a,E,F,D,f,c);return E&&w?d.createElement(w,{...u,key:u.key},y):d.createElement(N,{...u,key:u.key},y)})||d.createElement("tr",{className:"k-table-row k-grid-norecords"},d.createElement("td",{colSpan:v.length},this.props.noRecords||d.createElement(G.TreeListNoRecords,null))),U=a=>this.props.sort&&this.props.sort.some(f=>f.field===a),j=d.createElement("colgroup",{ref:a=>{this.columnResize.colGroupMain=a}},v.map((a,f)=>d.createElement("col",{key:f.toString(),className:U(a.field)?"k-sorted":void 0,style:a.width!==void 0?{width:a.width}:void 0}))),q=this.props.columnVirtualization||this.props.scrollable==="virtual",_=this.props.selectable&&this.props.selectable.drag?"none":void 0,K=this.props.tableProps||{};return d.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},d.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:a=>this.element=a,onScroll:q?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":L,"aria-colcount":v.length,role:"treegrid",...h.tableKeyboardNavigationScopeAttributes},this.props.toolbar,d.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},d.createElement("table",{className:"k-table k-table-md k-grid-table",...K,style:{...K.style||{},userSelect:_},role:"presentation"},j,M,d.createElement("tbody",{className:"k-table-tbody",...h.tableKeyboardNavigationBodyAttributes,role:"presentation"},B))),this.props.pager&&d.createElement(this.props.pager,{className:"k-grid-pager",total:L,skip:r,take:i,onPageChange:this.onPageChange}),s&&d.createElement(d.Fragment,null,d.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),d.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue}))))}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:v,groupable:M,children:R,...I}=o;return R.length?{children:e(R),...I}:I}));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};let 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}}};T.propTypes={data:n.array,resizable:n.bool,reorderable:n.bool,sortable:n.oneOfType([n.bool,n.shape({mode:n.oneOf(["single","multiple"]),allowUnsort:n.bool})]),onSortChange:n.func,sort:n.array,columns:n.arrayOf(n.object),columnVirtualization:n.bool,filter:n.array,onFilterChange:n.func,filterRow:n.any,toolbar:n.any,noRecords:n.any,onExpandChange:n.func,expandField:n.string,subItemsField:n.string,selectedField:n.string,onSelectionChange:n.func,onHeaderSelectionChange:n.func,onRowClick:n.func,onItemChange:n.func,editField:n.string,scrollable:n.oneOf(["none","scrollable","virtual"]),rowHeight:n.number,style:n.object,tableProps:n.object,pager:n.any,skip:n.number,take:n.number,onPageChange:n.func,onDataStateChange:n.func,onColumnResize:n.func,onColumnReorder:n.func,dataItemKey:n.string,navigatable:n.bool},T.contextType=h.TableKeyboardNavigationContext;let z=T;exports.TreeList=z;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),n=require("prop-types"),g=require("@progress/kendo-react-common"),h=require("@progress/kendo-react-data-tools"),H=require("./utils/index.js"),J=require("./cells/TreeListCell.js"),Q=require("./TreeListNoRecords.js"),X=require("./rows/TreeListRow.js"),Y=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 d=Z(G),F=class F extends d.Component{constructor(l){super(l),this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.element=null,this.contextStateRef={current:void 0},this.navigationStateRef={current: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,{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),g.validatePackage(Y.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(a=>!!a.filter||!!a.filterCell)||e!==void 0,m=e||h.FilterRow,C=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef),T=this.getExtendedColumn(l,C),L=T.length!==this.extendedColumn.length;this.extendedColumn=T,this.columnsMap=this.getColumnsMap(this.extendedColumn,L);const b=this.extendedColumn.filter(a=>a.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=d.createElement(h.Header,{headerRow:d.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}),filterRow:p&&d.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}),N=this.props.style||{},{colSpans:P,hiddenColumns:A}=h.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:b,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((N.width||"").toString())}),V=(a,f,I,E,k,x)=>b.map((c,u)=>{if(A[u])return null;const R=c.id?c.id:u,z=`${c.className?c.className+" ":""}${c.locked?"k-grid-content-sticky":""}`,w={id:h.tableKeyboardNavigationTools.generateNavigatableId(`${I}-${String(u)}`,C),colSpan:P[u],dataItem:a.dataItem,field:c.field,format:c.format,className:z||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?S=>{this.selectionChange({event:S,item:a,columnIndex:u,dataIndex:k})}:void 0,level:a.level,expandable:c.expandable,expanded:E,hasChildren:this.hasChildren(a.dataItem),onExpandChange:this.expandChange,colIndex:u,ariaColumnIndex:c.ariaColumnIndex,style:c.left!==void 0&&{left:c.left,right:c.right,borderRightWidth:c.rightBorder?"1px":""}||{},isSelected:Array.isArray(x)&&x.indexOf(u)>-1};return f&&c.editCell?d.createElement(c.editCell,{key:R,...w,onChange:this.itemChange}):c.cell?d.createElement(c.cell,{key:R,...w}):d.createElement(J.TreeListCell,{key:R,...w})});let v=this.flatData;const K=v.length;r!==void 0&&i!==void 0&&(v=v.slice(r,r+i)),t==="virtual"&&(v=H.tableRowsVirtualization({rows:v,tableViewPortHeight:parseFloat((N.height||N.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const B=v.map(a=>a.level),U=this.columnsMap.length+(p?1:0)+1,j=v.length>0&&v.map((a,f)=>{const I=g.getNestedValue(this.props.editField,a.dataItem),E=this.props.dataItemKey&&g.getter(this.props.dataItemKey)(a.dataItem),k=String(E||a.level.join(".")),x=this.expanded(a.dataItem),c=this.props.selectedField?g.getNestedValue(this.props.selectedField,a.dataItem):void 0,u={key:k,level:a.level,levels:B,dataItem:a.dataItem,selectedField:this.props.selectedField,rowHeight:t==="virtual"?a.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:S=>this.rowClick(S,a),onDoubleClick:S=>this.rowDoubleClick(S,a),onContextMenu:S=>this.rowContextMenu(S,a),isAltRow:f%2!==0,expanded:x,rowIndex:f,ariaRowIndex:U+f,ariaSetSize:a.levelCount,ariaPosInSet:a.level[a.level.length-1]+1,isSelected:typeof c=="boolean"&&c},R=this.props.editRow,z=this.props.row||X.TreeListRow,w=V(a,I,k,x,f,c);return I&&R?d.createElement(R,{...u,key:u.key},w):d.createElement(z,{...u,key:u.key},w)})||d.createElement("tr",{className:"k-table-row k-grid-norecords"},d.createElement("td",{colSpan:b.length},this.props.noRecords||d.createElement(Q.TreeListNoRecords,null))),q=a=>this.props.sort&&this.props.sort.some(f=>f.field===a),_=d.createElement("colgroup",{ref:a=>{this.columnResize.colGroupMain=a}},b.map((a,f)=>d.createElement("col",{key:f.toString(),className:q(a.field)?"k-sorted":void 0,style:a.width!==void 0?{width:a.width}:void 0}))),W=this.props.columnVirtualization||this.props.scrollable==="virtual",$=this.props.selectable&&this.props.selectable.drag?"none":void 0,O=this.props.tableProps||{};return d.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},d.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:a=>this.element=a,onScroll:W?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":K,"aria-colcount":b.length,role:"treegrid",...h.tableKeyboardNavigationScopeAttributes},this.props.toolbar,d.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},d.createElement("table",{className:"k-table k-table-md k-grid-table",...O,style:{...O.style||{},userSelect:$},role:"presentation"},_,D,d.createElement("tbody",{className:"k-table-tbody",...h.tableKeyboardNavigationBodyAttributes,role:"presentation"},j))),this.props.pager&&d.createElement(this.props.pager,{className:"k-grid-pager",total:K,skip:r,take:i,onPageChange:this.onPageChange}),s&&d.createElement(d.Fragment,null,d.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),d.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue}))))}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:L,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};let 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:n.array,resizable:n.bool,reorderable:n.bool,sortable:n.oneOfType([n.bool,n.shape({mode:n.oneOf(["single","multiple"]),allowUnsort:n.bool})]),onSortChange:n.func,sort:n.array,columns:n.arrayOf(n.object),columnVirtualization:n.bool,filter:n.array,onFilterChange:n.func,filterRow:n.any,toolbar:n.any,noRecords:n.any,onExpandChange:n.func,expandField:n.string,subItemsField:n.string,selectedField:n.string,onSelectionChange:n.func,onHeaderSelectionChange:n.func,onRowClick:n.func,onItemChange:n.func,editField:n.string,scrollable:n.oneOf(["none","scrollable","virtual"]),rowHeight:n.number,style:n.object,tableProps:n.object,pager:n.any,skip:n.number,take:n.number,onPageChange:n.func,onDataStateChange:n.func,onColumnResize:n.func,onColumnReorder:n.func,dataItemKey:n.string,navigatable:n.bool},F.contextType=h.TableKeyboardNavigationContext;let M=F;exports.TreeList=M;
|
package/TreeList.mjs
CHANGED
|
@@ -8,14 +8,14 @@
|
|
|
8
8
|
"use client";
|
|
9
9
|
import * as r from "react";
|
|
10
10
|
import n from "prop-types";
|
|
11
|
-
import { memoizeOne as
|
|
12
|
-
import { readColumns as
|
|
13
|
-
import { setHeaderRowsTop as
|
|
14
|
-
import { TreeListCell as
|
|
15
|
-
import { TreeListNoRecords as
|
|
16
|
-
import { TreeListRow as
|
|
17
|
-
import { packageMetadata as
|
|
18
|
-
const
|
|
11
|
+
import { memoizeOne as H, getNestedValue as x, validatePackage as X, noop as A, canUseDOM as Y, getter as Z, classNames as ee } from "@progress/kendo-react-common";
|
|
12
|
+
import { readColumns as te, mapColumns as oe, tableKeyboardNavigation as R, getSelectionOptions as K, CommonDragLogic as se, ColumnResize as ne, TableKeyboardNavigationContext as O, tableKeyboardNavigationTools as P, Header as ae, HeaderRow as ie, tableColumnsVirtualization as le, tableKeyboardNavigationScopeAttributes as re, TableSelection as he, tableKeyboardNavigationBodyAttributes as de, DropClue as ce, DragClue as pe, flatData as ge, FilterRow as ue } from "@progress/kendo-react-data-tools";
|
|
13
|
+
import { setHeaderRowsTop as me, tableRowsVirtualization as fe } from "./utils/index.mjs";
|
|
14
|
+
import { TreeListCell as Ce } from "./cells/TreeListCell.mjs";
|
|
15
|
+
import { TreeListNoRecords as ve } from "./TreeListNoRecords.mjs";
|
|
16
|
+
import { TreeListRow as be } from "./rows/TreeListRow.mjs";
|
|
17
|
+
import { packageMetadata as Se } from "./package-metadata.mjs";
|
|
18
|
+
const k = class k extends r.Component {
|
|
19
19
|
constructor(h) {
|
|
20
20
|
super(h), this.wrapperScrollLeft = 0, this.wrapperScrollTop = 0, this.updateOnScroll = !1, this.tbodyOffsetTop = 0, this.prevData = [], this.flattedData = [], this.extendedColumn = [], this.columnsMap = [], this.element = null, this.contextStateRef = { current: void 0 }, this.navigationStateRef = { current: void 0 }, this.scrollIntoView = (e) => {
|
|
21
21
|
if (!this.element)
|
|
@@ -30,16 +30,16 @@ const F = class F extends r.Component {
|
|
|
30
30
|
this.element.scroll(0, i);
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
|
-
}, this.getExtendedColumn =
|
|
34
|
-
(e, t) =>
|
|
35
|
-
), this.getColumnsMap =
|
|
36
|
-
(e) =>
|
|
33
|
+
}, this.getExtendedColumn = H(
|
|
34
|
+
(e, t) => te(e, { prevId: 0, idPrefix: t })
|
|
35
|
+
), this.getColumnsMap = H(
|
|
36
|
+
(e, t) => oe(e, t)
|
|
37
37
|
), this.onKeyDown = (e) => {
|
|
38
|
-
if (
|
|
38
|
+
if (R.onKeyDown(e, {
|
|
39
39
|
contextStateRef: this.contextStateRef,
|
|
40
40
|
navigationStateRef: this.navigationStateRef
|
|
41
41
|
}), this.props.onKeyDown) {
|
|
42
|
-
const { mode: t, cell: o } =
|
|
42
|
+
const { mode: t, cell: o } = K(this.props.selectable), s = {
|
|
43
43
|
dataItems: this.getLeafDataItems(),
|
|
44
44
|
mode: t,
|
|
45
45
|
cell: o,
|
|
@@ -50,7 +50,7 @@ const F = class F extends r.Component {
|
|
|
50
50
|
this.props.onKeyDown.call(void 0, s);
|
|
51
51
|
}
|
|
52
52
|
}, this.onFocus = (e) => {
|
|
53
|
-
|
|
53
|
+
R.onFocus(e, {
|
|
54
54
|
contextStateRef: this.contextStateRef
|
|
55
55
|
});
|
|
56
56
|
}, this.onRowDrag = (e) => {
|
|
@@ -99,7 +99,7 @@ const F = class F extends r.Component {
|
|
|
99
99
|
const i = s.style.boxSizing;
|
|
100
100
|
s.style.boxSizing = "border-box", l = parseFloat(String(window.getComputedStyle(s).height)) || s.offsetHeight, s.style.boxSizing = i, s.getAttribute("style") || s.removeAttribute("style");
|
|
101
101
|
}
|
|
102
|
-
this.tbodyOffsetTop = o.tBodies[0].offsetTop,
|
|
102
|
+
this.tbodyOffsetTop = o.tBodies[0].offsetTop, me(o, l);
|
|
103
103
|
}, this.itemChange = (e) => {
|
|
104
104
|
const t = this.props.onItemChange;
|
|
105
105
|
if (e.field === this.props.expandField) {
|
|
@@ -218,8 +218,8 @@ const F = class F extends r.Component {
|
|
|
218
218
|
}
|
|
219
219
|
}, this.expandedSubItems = (e) => {
|
|
220
220
|
const t = [];
|
|
221
|
-
return this.expanded(e) && this.hasChildren(e) && t.push(...
|
|
222
|
-
}, this.getLeafDataItems = () => this.flatData.map((e) => e.dataItem), this.expanded = (e) => !!
|
|
221
|
+
return this.expanded(e) && this.hasChildren(e) && t.push(...x(this.props.subItemsField, e)), t;
|
|
222
|
+
}, this.getLeafDataItems = () => this.flatData.map((e) => e.dataItem), this.expanded = (e) => !!x(this.props.expandField, e), this.hasChildren = (e) => !!x(this.props.subItemsField, e), X(Se), this.dragLogic = new se(this.columnReorder, A, A), this.columnResize = new ne(this.onResize.bind(this)), R.onConstructor({
|
|
223
223
|
navigatable: !!h.navigatable,
|
|
224
224
|
contextStateRef: this.contextStateRef,
|
|
225
225
|
navigationStateRef: this.navigationStateRef
|
|
@@ -229,14 +229,14 @@ const F = class F extends r.Component {
|
|
|
229
229
|
return this.props.id + "-treelist";
|
|
230
230
|
}
|
|
231
231
|
get document() {
|
|
232
|
-
if (
|
|
232
|
+
if (Y)
|
|
233
233
|
return this.element && this.element.ownerDocument || document;
|
|
234
234
|
}
|
|
235
235
|
/**
|
|
236
236
|
* @hidden
|
|
237
237
|
*/
|
|
238
238
|
componentDidMount() {
|
|
239
|
-
this.calculateSizes(this.element),
|
|
239
|
+
this.calculateSizes(this.element), R.onComponentDidMount({
|
|
240
240
|
scope: this.element || void 0,
|
|
241
241
|
contextStateRef: this.contextStateRef,
|
|
242
242
|
navigationStateRef: this.navigationStateRef
|
|
@@ -246,7 +246,7 @@ const F = class F extends r.Component {
|
|
|
246
246
|
* @hidden
|
|
247
247
|
*/
|
|
248
248
|
getSnapshotBeforeUpdate() {
|
|
249
|
-
return
|
|
249
|
+
return R.onGetSnapshotBeforeUpdate({
|
|
250
250
|
document: this.document,
|
|
251
251
|
contextStateRef: this.contextStateRef,
|
|
252
252
|
navigationStateRef: this.navigationStateRef
|
|
@@ -256,7 +256,7 @@ const F = class F extends r.Component {
|
|
|
256
256
|
* @hidden
|
|
257
257
|
*/
|
|
258
258
|
componentDidUpdate(h) {
|
|
259
|
-
h.columns !== this.props.columns && this.calculateSizes(this.element),
|
|
259
|
+
h.columns !== this.props.columns && this.calculateSizes(this.element), R.onComponentDidUpdate({
|
|
260
260
|
scope: this.element || void 0,
|
|
261
261
|
contextStateRef: this.contextStateRef,
|
|
262
262
|
navigationStateRef: this.navigationStateRef
|
|
@@ -280,15 +280,15 @@ const F = class F extends r.Component {
|
|
|
280
280
|
reorderable: s = !1,
|
|
281
281
|
skip: l,
|
|
282
282
|
take: i
|
|
283
|
-
} = this.props, c = h.some((a) => !!a.filter || !!a.filterCell) || e !== void 0, g = e ||
|
|
284
|
-
this.extendedColumn =
|
|
285
|
-
const
|
|
283
|
+
} = this.props, c = h.some((a) => !!a.filter || !!a.filterCell) || e !== void 0, g = e || ue, m = P.getIdPrefix(this.navigationStateRef), F = this.getExtendedColumn(h, m), T = F.length !== this.extendedColumn.length;
|
|
284
|
+
this.extendedColumn = F, this.columnsMap = this.getColumnsMap(this.extendedColumn, T);
|
|
285
|
+
const f = this.extendedColumn.filter((a) => a.children.length === 0);
|
|
286
286
|
this.columnResize.columns = this.extendedColumn, this.columnResize.resizable = o, this.dragLogic.columns = this.extendedColumn, this.dragLogic.reorderable = s, this.dragLogic.groupable = !1;
|
|
287
|
-
const
|
|
288
|
-
|
|
287
|
+
const y = /* @__PURE__ */ r.createElement(
|
|
288
|
+
ae,
|
|
289
289
|
{
|
|
290
290
|
headerRow: /* @__PURE__ */ r.createElement(
|
|
291
|
-
|
|
291
|
+
ie,
|
|
292
292
|
{
|
|
293
293
|
sort: this.props.sort,
|
|
294
294
|
sortable: this.props.sortable,
|
|
@@ -310,7 +310,7 @@ const F = class F extends r.Component {
|
|
|
310
310
|
filterRow: c && /* @__PURE__ */ r.createElement(
|
|
311
311
|
g,
|
|
312
312
|
{
|
|
313
|
-
columns:
|
|
313
|
+
columns: f,
|
|
314
314
|
filter: this.props.filter,
|
|
315
315
|
filterChange: this.filterChange,
|
|
316
316
|
sort: this.props.sort,
|
|
@@ -319,29 +319,29 @@ const F = class F extends r.Component {
|
|
|
319
319
|
) || void 0,
|
|
320
320
|
columnResize: this.columnResize
|
|
321
321
|
}
|
|
322
|
-
),
|
|
322
|
+
), z = this.props.style || {}, { colSpans: V, hiddenColumns: U } = le({
|
|
323
323
|
enabled: this.props.columnVirtualization,
|
|
324
|
-
columns:
|
|
324
|
+
columns: f,
|
|
325
325
|
scrollLeft: this.wrapperScrollLeft,
|
|
326
|
-
tableViewPortWidth: parseFloat((
|
|
327
|
-
}),
|
|
328
|
-
if (
|
|
326
|
+
tableViewPortWidth: parseFloat((z.width || "").toString())
|
|
327
|
+
}), $ = (a, u, D, I, E, w) => f.map((d, p) => {
|
|
328
|
+
if (U[p])
|
|
329
329
|
return null;
|
|
330
|
-
const
|
|
331
|
-
id:
|
|
332
|
-
colSpan:
|
|
330
|
+
const b = d.id ? d.id : p, M = `${d.className ? d.className + " " : ""}${d.locked ? "k-grid-content-sticky" : ""}`, S = {
|
|
331
|
+
id: P.generateNavigatableId(`${D}-${String(p)}`, m),
|
|
332
|
+
colSpan: V[p],
|
|
333
333
|
dataItem: a.dataItem,
|
|
334
334
|
field: d.field,
|
|
335
335
|
format: d.format,
|
|
336
|
-
className:
|
|
336
|
+
className: M || void 0,
|
|
337
337
|
render: this.props.cellRender,
|
|
338
338
|
onChange: this.itemChange,
|
|
339
339
|
selectionChange: this.props.onSelectionChange ? (v) => {
|
|
340
|
-
this.selectionChange({ event: v, item: a, columnIndex: p, dataIndex:
|
|
340
|
+
this.selectionChange({ event: v, item: a, columnIndex: p, dataIndex: E });
|
|
341
341
|
} : void 0,
|
|
342
342
|
level: a.level,
|
|
343
343
|
expandable: d.expandable,
|
|
344
|
-
expanded:
|
|
344
|
+
expanded: I,
|
|
345
345
|
hasChildren: this.hasChildren(a.dataItem),
|
|
346
346
|
onExpandChange: this.expandChange,
|
|
347
347
|
colIndex: p,
|
|
@@ -351,22 +351,22 @@ const F = class F extends r.Component {
|
|
|
351
351
|
right: d.right,
|
|
352
352
|
borderRightWidth: d.rightBorder ? "1px" : ""
|
|
353
353
|
} || {},
|
|
354
|
-
isSelected: Array.isArray(
|
|
354
|
+
isSelected: Array.isArray(w) && w.indexOf(p) > -1
|
|
355
355
|
};
|
|
356
|
-
return u && d.editCell ? /* @__PURE__ */ r.createElement(d.editCell, { key:
|
|
356
|
+
return u && d.editCell ? /* @__PURE__ */ r.createElement(d.editCell, { key: b, ...S, onChange: this.itemChange }) : d.cell ? /* @__PURE__ */ r.createElement(d.cell, { key: b, ...S }) : /* @__PURE__ */ r.createElement(Ce, { key: b, ...S });
|
|
357
357
|
});
|
|
358
|
-
let
|
|
359
|
-
const
|
|
360
|
-
l !== void 0 && i !== void 0 && (
|
|
361
|
-
rows:
|
|
362
|
-
tableViewPortHeight: parseFloat((
|
|
358
|
+
let C = this.flatData;
|
|
359
|
+
const L = C.length;
|
|
360
|
+
l !== void 0 && i !== void 0 && (C = C.slice(l, l + i)), t === "virtual" && (C = fe({
|
|
361
|
+
rows: C,
|
|
362
|
+
tableViewPortHeight: parseFloat((z.height || z.maxHeight || "").toString()),
|
|
363
363
|
scrollTop: this.wrapperScrollTop
|
|
364
364
|
}), this.updateOnScroll = !1);
|
|
365
|
-
const
|
|
366
|
-
const
|
|
367
|
-
key:
|
|
365
|
+
const W = C.map((a) => a.level), j = this.columnsMap.length + (c ? 1 : 0) + 1, G = C.length > 0 && C.map((a, u) => {
|
|
366
|
+
const D = x(this.props.editField, a.dataItem), I = this.props.dataItemKey && Z(this.props.dataItemKey)(a.dataItem), E = String(I || a.level.join(".")), w = this.expanded(a.dataItem), d = this.props.selectedField ? x(this.props.selectedField, a.dataItem) : void 0, p = {
|
|
367
|
+
key: E,
|
|
368
368
|
level: a.level,
|
|
369
|
-
levels:
|
|
369
|
+
levels: W,
|
|
370
370
|
dataItem: a.dataItem,
|
|
371
371
|
selectedField: this.props.selectedField,
|
|
372
372
|
rowHeight: t === "virtual" ? a.height : this.props.rowHeight,
|
|
@@ -377,49 +377,49 @@ const F = class F extends r.Component {
|
|
|
377
377
|
onDoubleClick: (v) => this.rowDoubleClick(v, a),
|
|
378
378
|
onContextMenu: (v) => this.rowContextMenu(v, a),
|
|
379
379
|
isAltRow: u % 2 !== 0,
|
|
380
|
-
expanded:
|
|
380
|
+
expanded: w,
|
|
381
381
|
rowIndex: u,
|
|
382
|
-
ariaRowIndex:
|
|
382
|
+
ariaRowIndex: j + u,
|
|
383
383
|
ariaSetSize: a.levelCount,
|
|
384
384
|
ariaPosInSet: a.level[a.level.length - 1] + 1,
|
|
385
385
|
isSelected: typeof d == "boolean" && d
|
|
386
|
-
},
|
|
387
|
-
return
|
|
388
|
-
}) || /* @__PURE__ */ r.createElement("tr", { className: "k-table-row k-grid-norecords" }, /* @__PURE__ */ r.createElement("td", { colSpan:
|
|
386
|
+
}, b = this.props.editRow, M = this.props.row || be, S = $(a, D, E, w, u, d);
|
|
387
|
+
return D && b ? /* @__PURE__ */ r.createElement(b, { ...p, key: p.key }, S) : /* @__PURE__ */ r.createElement(M, { ...p, key: p.key }, S);
|
|
388
|
+
}) || /* @__PURE__ */ r.createElement("tr", { className: "k-table-row k-grid-norecords" }, /* @__PURE__ */ r.createElement("td", { colSpan: f.length }, this.props.noRecords || /* @__PURE__ */ r.createElement(ve, null))), _ = (a) => this.props.sort && this.props.sort.some((u) => u.field === a), q = /* @__PURE__ */ r.createElement("colgroup", { ref: (a) => {
|
|
389
389
|
this.columnResize.colGroupMain = a;
|
|
390
|
-
} },
|
|
390
|
+
} }, f.map(
|
|
391
391
|
(a, u) => /* @__PURE__ */ r.createElement(
|
|
392
392
|
"col",
|
|
393
393
|
{
|
|
394
394
|
key: u.toString(),
|
|
395
|
-
className:
|
|
395
|
+
className: _(a.field) ? "k-sorted" : void 0,
|
|
396
396
|
style: a.width !== void 0 ? { width: a.width } : void 0
|
|
397
397
|
}
|
|
398
398
|
)
|
|
399
|
-
)),
|
|
400
|
-
return /* @__PURE__ */ r.createElement(
|
|
399
|
+
)), J = this.props.columnVirtualization || this.props.scrollable === "virtual", Q = this.props.selectable && this.props.selectable.drag ? "none" : void 0, N = this.props.tableProps || {};
|
|
400
|
+
return /* @__PURE__ */ r.createElement(O.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ r.createElement(
|
|
401
401
|
"div",
|
|
402
402
|
{
|
|
403
403
|
id: this.props.id,
|
|
404
404
|
style: this.props.style,
|
|
405
|
-
className:
|
|
405
|
+
className: ee(
|
|
406
406
|
"k-grid k-grid-md",
|
|
407
407
|
"k-treelist",
|
|
408
408
|
this.props.className,
|
|
409
409
|
{ "k-treelist-scrollable": t !== "none" }
|
|
410
410
|
),
|
|
411
411
|
ref: (a) => this.element = a,
|
|
412
|
-
onScroll:
|
|
412
|
+
onScroll: J ? this.handleOnScroll : void 0,
|
|
413
413
|
onKeyDown: this.onKeyDown,
|
|
414
414
|
onFocus: this.onFocus,
|
|
415
|
-
"aria-rowcount":
|
|
416
|
-
"aria-colcount":
|
|
415
|
+
"aria-rowcount": L,
|
|
416
|
+
"aria-colcount": f.length,
|
|
417
417
|
role: "treegrid",
|
|
418
|
-
...
|
|
418
|
+
...re
|
|
419
419
|
},
|
|
420
420
|
this.props.toolbar,
|
|
421
421
|
/* @__PURE__ */ r.createElement(
|
|
422
|
-
|
|
422
|
+
he,
|
|
423
423
|
{
|
|
424
424
|
selectable: this.props.selectable,
|
|
425
425
|
onRelease: this.selectionRelease
|
|
@@ -428,26 +428,26 @@ const F = class F extends r.Component {
|
|
|
428
428
|
"table",
|
|
429
429
|
{
|
|
430
430
|
className: "k-table k-table-md k-grid-table",
|
|
431
|
-
...
|
|
432
|
-
style: { ...
|
|
431
|
+
...N,
|
|
432
|
+
style: { ...N.style || {}, userSelect: Q },
|
|
433
433
|
role: "presentation"
|
|
434
434
|
},
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
/* @__PURE__ */ r.createElement("tbody", { className: "k-table-tbody", ...
|
|
435
|
+
q,
|
|
436
|
+
y,
|
|
437
|
+
/* @__PURE__ */ r.createElement("tbody", { className: "k-table-tbody", ...de, role: "presentation" }, G)
|
|
438
438
|
)
|
|
439
439
|
),
|
|
440
440
|
this.props.pager && /* @__PURE__ */ r.createElement(
|
|
441
441
|
this.props.pager,
|
|
442
442
|
{
|
|
443
443
|
className: "k-grid-pager",
|
|
444
|
-
total:
|
|
444
|
+
total: L,
|
|
445
445
|
skip: l,
|
|
446
446
|
take: i,
|
|
447
447
|
onPageChange: this.onPageChange
|
|
448
448
|
}
|
|
449
449
|
),
|
|
450
|
-
s && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(
|
|
450
|
+
s && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(ce, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ r.createElement(pe, { ref: this.dragLogic.refDragElementClue }))
|
|
451
451
|
));
|
|
452
452
|
}
|
|
453
453
|
get columns() {
|
|
@@ -459,15 +459,15 @@ const F = class F extends r.Component {
|
|
|
459
459
|
colSpan: c,
|
|
460
460
|
rowSpan: g,
|
|
461
461
|
index: m,
|
|
462
|
-
kFirst:
|
|
463
|
-
groupable:
|
|
464
|
-
children:
|
|
465
|
-
...
|
|
462
|
+
kFirst: F,
|
|
463
|
+
groupable: T,
|
|
464
|
+
children: f,
|
|
465
|
+
...y
|
|
466
466
|
} = o;
|
|
467
|
-
return
|
|
468
|
-
children: e(
|
|
469
|
-
...
|
|
470
|
-
} :
|
|
467
|
+
return f.length ? {
|
|
468
|
+
children: e(f),
|
|
469
|
+
...y
|
|
470
|
+
} : y;
|
|
471
471
|
}));
|
|
472
472
|
return e(h);
|
|
473
473
|
}
|
|
@@ -478,12 +478,12 @@ const F = class F extends r.Component {
|
|
|
478
478
|
const i = { height: e, offsetTop: t };
|
|
479
479
|
return t += i.height, i;
|
|
480
480
|
};
|
|
481
|
-
let s = this.updateOnScroll && this.prevData === h && this.tbodyOffsetTop > 0 && this.flattedData.length ? this.flattedData :
|
|
481
|
+
let s = this.updateOnScroll && this.prevData === h && this.tbodyOffsetTop > 0 && this.flattedData.length ? this.flattedData : ge(h, this.expandedSubItems, o);
|
|
482
482
|
return this.prevData = h, this.flattedData = s, s;
|
|
483
483
|
}
|
|
484
484
|
selectionChange(h) {
|
|
485
485
|
if (this.props.onSelectionChange) {
|
|
486
|
-
const { event: e, item: t, dataIndex: o, columnIndex: s } = h, { mode: l, cell: i } =
|
|
486
|
+
const { event: e, item: t, dataIndex: o, columnIndex: s } = h, { mode: l, cell: i } = K(this.props.selectable), c = {
|
|
487
487
|
...this.getArguments(e.syntheticEvent),
|
|
488
488
|
dataItem: t.dataItem,
|
|
489
489
|
level: t.level,
|
|
@@ -531,7 +531,7 @@ const F = class F extends r.Component {
|
|
|
531
531
|
};
|
|
532
532
|
}
|
|
533
533
|
};
|
|
534
|
-
|
|
534
|
+
k.propTypes = {
|
|
535
535
|
data: n.array,
|
|
536
536
|
resizable: n.bool,
|
|
537
537
|
reorderable: n.bool,
|
|
@@ -573,8 +573,8 @@ F.propTypes = {
|
|
|
573
573
|
onColumnReorder: n.func,
|
|
574
574
|
dataItemKey: n.string,
|
|
575
575
|
navigatable: n.bool
|
|
576
|
-
},
|
|
577
|
-
let
|
|
576
|
+
}, k.contextType = O;
|
|
577
|
+
let B = k;
|
|
578
578
|
export {
|
|
579
|
-
|
|
579
|
+
B as TreeList
|
|
580
580
|
};
|
|
@@ -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
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-data-tools"),require("@progress/kendo-react-intl"),require("@progress/kendo-svg-icons"),require("react-dom"),require("@progress/kendo-react-inputs"),require("@progress/kendo-react-dateinputs")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-data-tools","@progress/kendo-react-intl","@progress/kendo-svg-icons","react-dom","@progress/kendo-react-inputs","@progress/kendo-react-dateinputs"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactTreelist={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactDataTools,e.KendoReactIntl,e.KendoSvgIcons,e.ReactDOM,e.KendoReactInputs,e.KendoReactDateinputs)}(this,(function(e,t,o,a,n,r,l,i,s,d){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(o){if("default"!==o){var a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,a.get?a:{enumerable:!0,get:function(){return e[o]}})}})),t.default=e,Object.freeze(t)}var h=c(t),p=c(i);function u(e,t,o){const a=Array.from(e.tHead&&e.tHead.rows||[]),n=[t];let r;const l=o||(e=>window.getComputedStyle(e).height||void 0);a.forEach((e=>{let t=l(e);n.push(function(e){return void 0!==e&&("number"==typeof e||/px$/i.test(String(e)))}(t)?parseFloat(String(t)):e.offsetHeight)}));for(let e=0;e<a.length;e++)r=n.slice(0,e+1).reduce(((e,t)=>e+t)),Array.from(a[e].cells).forEach((e=>e.style.top=r+"px"))}const g=1e6;function m(e){const{rows:t,tableViewPortHeight:o,scrollTop:a}=e;if(0===t.length)return[];const n=t[0].height,r=Math.min(Math.round(a/n),t.length),l=Math.round(o/n),i=Math.max(0,r-l),s=Math.min(t.length,r+2*l),d=t.slice(i,s),c=d[d.length-1];return i>0&&d.unshift({dataItem:{},level:[g],offsetTop:0,height:d[0].offsetTop,levelCount:0}),s<t.length-1&&d.push({dataItem:{},level:[g,g],offsetTop:c.offsetTop+c.height,height:(t.length-s)*n,levelCount:0}),d}const f=n.TABLE_ROW_INDEX_ATTRIBUTE,v=n.TABLE_COL_INDEX_ATTRIBUTE,b=n.TABLE_PREVENT_SELECTION_ELEMENT,C=e=>{const{hasChildren:t,level:o=[0],expanded:i,dataItem:s,format:d,id:c,ariaColumnIndex:p,isSelected:u}=e,g=a.getNestedValue(e.field,s),m=r.useInternationalization(),f=n.useTableKeyboardNavigation(c);let C="";const x=h.useCallback((t=>{t.isDefaultPrevented()||t.keyCode===a.Keys.enter&&e.expandable&&(t.preventDefault(),e.onExpandChange(t,s,o))}),[e.expandable,s,o]);null!=g&&(C=d?m.format(d,g):g.toString());const I=[];if(e.expandable){const n=e=>h.createElement("span",{key:e,className:"k-treelist-toggle k-icon k-svg-icon"},h.createElement("svg",{"aria-hidden":"true",focusable:"false",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"}));I.push(...o.slice(1).map(((e,t)=>n(t)))),t?I.push(h.createElement(a.IconWrap,{className:"k-treelist-toggle",name:i?"caret-alt-down":"caret-alt-right",icon:i?l.caretAltDownIcon:l.caretAltRightIcon,key:"expand-collapse",onClick:t=>e.onExpandChange(t.syntheticEvent||t,s,o),[b]:!0})):I.push(n(I.length))}const y=h.createElement("td",{style:e.style,className:a.classNames("k-table-td",e.className,{"k-text-nowrap":e.expandable,"k-selected":u}),colSpan:e.colSpan,"aria-colindex":p,"aria-expanded":t?i:void 0,"aria-selected":u,role:"gridcell",onKeyDown:x,[v]:e.colIndex,...f},I,C);return e.render?e.render.call(void 0,y,e):y};C.displayName="KendoReactTreeListCell";const x="treelist.filterClearButton",I="treelist.filterEqOperator",y="treelist.filterNotEqOperator",E="treelist.filterIsNullOperator",S="treelist.filterIsNotNullOperator",R="treelist.filterIsEmptyOperator",k="treelist.filterIsNotEmptyOperator",w="treelist.filterStartsWithOperator",T="treelist.filterContainsOperator",N="treelist.filterNotContainsOperator",D="treelist.filterEndsWithOperator",O="treelist.filterGteOperator",L="treelist.filterGtOperator",F="treelist.filterLteOperator",P="treelist.filterLtOperator",K="treelist.filterIsTrue",z="treelist.filterIsFalse",M="treelist.filterBooleanAll",A="treelist.filterAfterOrEqualOperator",H="treelist.filterAfterOperator",B="treelist.filterBeforeOperator",j="treelist.filterBeforeOrEqualOperator",q="treelist.noRecords",V={[x]:"Clear",[I]:"Is equal to",[y]:"Is not equal to",[E]:"Is null",[S]:"Is not null",[R]:"Is empty",[k]:"Is not empty",[w]:"Starts with",[T]:"Contains",[N]:"Does not contain",[D]:"Ends with",[O]:"Is greater than or equal to",[L]:"Is greater than",[F]:"Is less than or equal to",[P]:"Is less than",[K]:"Is true",[z]:"Is false",[M]:"(All)",[A]:"Is after or equal to",[H]:"Is after",[B]:"Is before",[j]:"Is before or equal to",[q]:"No records available"};let _=class extends h.Component{render(){return this.props.children||r.provideLocalizationService(this).toLanguageString(q,V[q])}};r.registerForLocalization(_);const U=h.forwardRef(((e,t)=>{const{isSelected:o,rowHeight:n,isAltRow:r,expanded:l,ariaRowIndex:i,level:s,ariaSetSize:d,ariaPosInSet:c}=e,p=a.classNames("k-table-row","k-master-row",{"k-selected":o,"k-alt":r}),u=h.useMemo((()=>void 0!==n?{height:n+"px"}:void 0),[n]),g=h.createElement("tr",{onClick:e.onClick,onDoubleClick:e.onDoubleClick,onContextMenu:e.onContextMenu,className:p,style:u,ref:t,"aria-expanded":l,role:"row","aria-rowindex":i,"aria-level":s.length,"aria-posinset":c,"aria-setsize":d,[f]:e.rowIndex},e.children);return h.createElement(h.Fragment,null,e.render?e.render.call(void 0,g,e):g)}));U.displayName="KendoReactTreeListRow";const W={name:"@progress/kendo-react-treelist",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},X=class extends h.Component{constructor(e){super(e),this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.element=null,this.contextStateRef={current:void 0},this.navigationStateRef={current:void 0},this.scrollIntoView=e=>{if(!this.element)return;const{rowIndex:t=0}=e,{scrollable:o,rowHeight:a=0}=this.props;if("virtual"===o||a)this.element.scroll(0,(t-1)*a);else{const e=this.element.querySelector(`tbody > tr:nth-child(${t})`);if(e){const t=e.offsetTop-this.tbodyOffsetTop;this.element.scroll(0,t)}}},this.getExtendedColumn=a.memoizeOne(((e,t)=>n.readColumns(e,{prevId:0,idPrefix:t}))),this.getColumnsMap=a.memoizeOne((e=>n.mapColumns(e))),this.onKeyDown=e=>{if(n.tableKeyboardNavigation.onKeyDown(e,{contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),this.props.onKeyDown){const{mode:t,cell:o}=n.getSelectionOptions(this.props.selectable),a={dataItems:this.getLeafDataItems(),mode:t,cell:o,componentId:this._treeListId,selectedField:this.props.selectedField,...this.getArguments(e)};this.props.onKeyDown.call(void 0,a)}},this.onFocus=e=>{n.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 a=this.extendedColumn[e].depth,n=e=>{do{e++}while(e<this.extendedColumn.length&&this.extendedColumn[e].depth>a);return e},r=this.extendedColumn.splice(e,n(e)-e);if(this.extendedColumn.splice(e<t?n(t-r.length):t,0,...r),this.extendedColumn.filter((e=>e.declarationIndex>=0)).forEach(((e,t)=>e.orderIndex=t)),this.props.onColumnReorder){const e={target:this,columns:this.columns,nativeEvent:o};this.props.onColumnReorder.call(void 0,e)}},this.onResize=(e,t,o,a,n)=>{if(this.props.onColumnResize){const r=this.extendedColumn.filter((e=>0===e.children.length)).reduce(((e,t)=>e+parseFloat(String(t.width))),0),l={columns:this.columns,totalWidth:r,index:e,nativeEvent:a,newWidth:t,oldWidth:o,end:n,target:this};this.props.onColumnResize.call(void 0,l)}},this.handleOnScroll=e=>{const t=e.currentTarget.scrollLeft,o=e.currentTarget.scrollTop,{columnVirtualization:a,scrollable:n,rowHeight:r=0}=this.props,l=r;let i=!1;a&&Math.abs(this.wrapperScrollLeft-t)>0&&(this.wrapperScrollLeft=t,i=!0),"virtual"===n&&Math.abs(this.wrapperScrollTop-o)>l&&(this.wrapperScrollTop=o,i=!0),i&&(this.updateOnScroll=!0,this.forceUpdate())},this.calculateSizes=e=>{if(!e||"none"===this.props.scrollable)return;const t=Array.from(e.childNodes),o=t.find((e=>"TABLE"===e.nodeName)),a=this.props.toolbar&&t.find((e=>1===e.nodeType&&e.classList.contains("k-grid-toolbar")));let n=0;if(a){const e=a.style.boxSizing;a.style.boxSizing="border-box",n=parseFloat(String(window.getComputedStyle(a).height))||a.offsetHeight,a.style.boxSizing=e,a.getAttribute("style")||a.removeAttribute("style")}this.tbodyOffsetTop=o.tBodies[0].offsetTop,u(o,n)},this.itemChange=e=>{const t=this.props.onItemChange;if(e.field!==this.props.expandField){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)}}else{const t=this.props.onExpandChange;if(t){const o={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,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:a}=this.props;if(!a)return;const n={syntheticEvent:e,filter:t,field:o,target:this,nativeEvent:e.nativeEvent};a.call(void 0,n)},this.expandChange=(e,t,o)=>{const{expandField:a,onExpandChange:n}=this.props;if(a&&n){const a={...this.getArguments(e),dataItem:t,level:o,value:this.expanded(t)};n.call(void 0,a)}},this.rowClick=(e,t)=>{if(this.props.onRowClick&&"TD"===e.target.nodeName){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&&"TD"===e.target.nodeName){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&&"TD"===e.target.nodeName){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(...a.getNestedValue(this.props.subItemsField,e)),t},this.getLeafDataItems=()=>this.flatData.map((e=>e.dataItem)),this.expanded=e=>!!a.getNestedValue(this.props.expandField,e),this.hasChildren=e=>!!a.getNestedValue(this.props.subItemsField,e),a.validatePackage(W),this.dragLogic=new n.CommonDragLogic(this.columnReorder,a.noop,a.noop),this.columnResize=new n.ColumnResize(this.onResize.bind(this)),n.tableKeyboardNavigation.onConstructor({navigatable:!!e.navigatable,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}get _treeListId(){return this.props.id+"-treelist"}get document(){if(a.canUseDOM)return this.element&&this.element.ownerDocument||document}componentDidMount(){this.calculateSizes(this.element),n.tableKeyboardNavigation.onComponentDidMount({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}getSnapshotBeforeUpdate(){return n.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({document:this.document,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),null}componentDidUpdate(e){e.columns!==this.props.columns&&this.calculateSizes(this.element),n.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:e=[],filterRow:t,scrollable:o="scrollable",resizable:r=!1,reorderable:l=!1,skip:i,take:s}=this.props,d=e.some((e=>!!e.filter||!!e.filterCell))||void 0!==t,c=t||n.FilterRow,p=n.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef);this.extendedColumn=this.getExtendedColumn(e,p),this.columnsMap=this.getColumnsMap(this.extendedColumn);const u=this.extendedColumn.filter((e=>0===e.children.length));this.columnResize.columns=this.extendedColumn,this.columnResize.resizable=r,this.dragLogic.columns=this.extendedColumn,this.dragLogic.reorderable=l,this.dragLogic.groupable=!1;const g=h.createElement(n.Header,{headerRow:h.createElement(n.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}),filterRow:d&&h.createElement(c,{columns:u,filter:this.props.filter,filterChange:this.filterChange,sort:this.props.sort,ariaRowIndex:this.columnsMap.length+1})||void 0,columnResize:this.columnResize}),f=this.props.style||{},{colSpans:v,hiddenColumns:b}=n.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:u,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((f.width||"").toString())}),x=(e,t,o,a,r,l)=>u.map(((i,s)=>{if(b[s])return null;const d=i.id?i.id:s,c=`${i.className?i.className+" ":""}${i.locked?"k-grid-content-sticky":""}`,u={id:n.tableKeyboardNavigationTools.generateNavigatableId(`${o}-${String(s)}`,p),colSpan:v[s],dataItem:e.dataItem,field:i.field,format:i.format,className:c||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?t=>{this.selectionChange({event:t,item:e,columnIndex:s,dataIndex:r})}:void 0,level:e.level,expandable:i.expandable,expanded:a,hasChildren:this.hasChildren(e.dataItem),onExpandChange:this.expandChange,colIndex:s,ariaColumnIndex:i.ariaColumnIndex,style:void 0!==i.left&&{left:i.left,right:i.right,borderRightWidth:i.rightBorder?"1px":""}||{},isSelected:Array.isArray(l)&&l.indexOf(s)>-1};return t&&i.editCell?h.createElement(i.editCell,{key:d,...u,onChange:this.itemChange}):i.cell?h.createElement(i.cell,{key:d,...u}):h.createElement(C,{key:d,...u})}));let I=this.flatData;const y=I.length;void 0!==i&&void 0!==s&&(I=I.slice(i,i+s)),"virtual"===o&&(I=m({rows:I,tableViewPortHeight:parseFloat((f.height||f.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const E=I.map((e=>e.level)),S=this.columnsMap.length+(d?1:0)+1,R=I.length>0&&I.map(((e,t)=>{const n=a.getNestedValue(this.props.editField,e.dataItem),r=this.props.dataItemKey&&a.getter(this.props.dataItemKey)(e.dataItem),l=String(r||e.level.join(".")),i=this.expanded(e.dataItem),s=this.props.selectedField?a.getNestedValue(this.props.selectedField,e.dataItem):void 0,d={key:l,level:e.level,levels:E,dataItem:e.dataItem,selectedField:this.props.selectedField,rowHeight:"virtual"===o?e.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:t=>this.rowClick(t,e),onDoubleClick:t=>this.rowDoubleClick(t,e),onContextMenu:t=>this.rowContextMenu(t,e),isAltRow:t%2!=0,expanded:i,rowIndex:t,ariaRowIndex:S+t,ariaSetSize:e.levelCount,ariaPosInSet:e.level[e.level.length-1]+1,isSelected:"boolean"==typeof s&&s},c=this.props.editRow,p=this.props.row||U,u=x(e,n,l,i,t,s);return n&&c?h.createElement(c,{...d,key:d.key},u):h.createElement(p,{...d,key:d.key},u)}))||h.createElement("tr",{className:"k-table-row k-grid-norecords"},h.createElement("td",{colSpan:u.length},this.props.noRecords||h.createElement(_,null))),k=e=>this.props.sort&&this.props.sort.some((t=>t.field===e)),w=h.createElement("colgroup",{ref:e=>{this.columnResize.colGroupMain=e}},u.map(((e,t)=>h.createElement("col",{key:t.toString(),className:k(e.field)?"k-sorted":void 0,style:void 0!==e.width?{width:e.width}:void 0})))),T=this.props.columnVirtualization||"virtual"===this.props.scrollable,N=this.props.selectable&&this.props.selectable.drag?"none":void 0,D=this.props.tableProps||{};return h.createElement(n.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},h.createElement("div",{id:this.props.id,style:this.props.style,className:a.classNames("k-grid k-grid-md","k-treelist",this.props.className,{"k-treelist-scrollable":"none"!==o}),ref:e=>this.element=e,onScroll:T?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":y,"aria-colcount":u.length,role:"treegrid",...n.tableKeyboardNavigationScopeAttributes},this.props.toolbar,h.createElement(n.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},h.createElement("table",{className:"k-table k-table-md k-grid-table",...D,style:{...D.style||{},userSelect:N},role:"presentation"},w,g,h.createElement("tbody",{className:"k-table-tbody",...n.tableKeyboardNavigationBodyAttributes,role:"presentation"},R))),this.props.pager&&h.createElement(this.props.pager,{className:"k-grid-pager",total:y,skip:i,take:s,onPageChange:this.onPageChange}),l&&h.createElement(h.Fragment,null,h.createElement(n.DropClue,{ref:this.dragLogic.refDropElementClue}),h.createElement(n.DragClue,{ref:this.dragLogic.refDragElementClue}))))}get columns(){const e=this.extendedColumn.filter((e=>e.declarationIndex>=0&&-1===e.parentIndex)),t=e=>(e.sort(((e,t)=>e.declarationIndex-t.declarationIndex)),e.map((e=>{const{declarationIndex:o,parentIndex:a,depth:n,colSpan:r,rowSpan:l,index:i,kFirst:s,groupable:d,children:c,...h}=e;return c.length?{children:t(c),...h}:h})));return t(e)}get flatData(){const{data:e=[],rowHeight:t=0}=this.props;let o=0;let a=this.updateOnScroll&&this.prevData===e&&this.tbodyOffsetTop>0&&this.flattedData.length?this.flattedData:n.flatData(e,this.expandedSubItems,(e=>{const a={height:t,offsetTop:o};return o+=a.height,a}));return this.prevData=e,this.flattedData=a,a}selectionChange(e){if(this.props.onSelectionChange){const{event:t,item:o,dataIndex:a,columnIndex:r}=e,{mode:l,cell:i}=n.getSelectionOptions(this.props.selectable),s={...this.getArguments(t.syntheticEvent),dataItem:o.dataItem,level:o.level,startColIndex:r,endColIndex:r,startRowIndex:a,endRowIndex:a,dataItems:this.getLeafDataItems(),altKey:!1,ctrlKey:!1,shiftKey:!1,metaKey:!1,mode:l,cell:i,isDrag:!1,componentId:this._treeListId,selectedField:this.props.selectedField||""};this.props.onSelectionChange.call(void 0,s)}}raiseDataEvent(e,t,o){const a=this.props.onDataStateChange;if(e)e.call(void 0,{...this.getArguments(o),...t});else if(a){const e={...this.getArguments(o),dataState:{...this.getDataState(),...t}};a.call(void 0,e)}}getDataState(){return{filter:this.props.filter,sort:this.props.sort}}getArguments(e){return{nativeEvent:e&&e.nativeEvent,syntheticEvent:e,target:this}}};X.propTypes={data:o.array,resizable:o.bool,reorderable:o.bool,sortable:o.oneOfType([o.bool,o.shape({mode:o.oneOf(["single","multiple"]),allowUnsort:o.bool})]),onSortChange:o.func,sort:o.array,columns:o.arrayOf(o.object),columnVirtualization:o.bool,filter:o.array,onFilterChange:o.func,filterRow:o.any,toolbar:o.any,noRecords:o.any,onExpandChange:o.func,expandField:o.string,subItemsField:o.string,selectedField:o.string,onSelectionChange:o.func,onHeaderSelectionChange:o.func,onRowClick:o.func,onItemChange:o.func,editField:o.string,scrollable:o.oneOf(["none","scrollable","virtual"]),rowHeight:o.number,style:o.object,tableProps:o.object,pager:o.any,skip:o.number,take:o.number,onPageChange:o.func,onDataStateChange:o.func,onColumnResize:o.func,onColumnReorder:o.func,dataItemKey:o.string,navigatable:o.bool},X.contextType=n.TableKeyboardNavigationContext;let $=X;const G=e=>{const t=h.useCallback((t=>{e.selectionChange&&e.selectionChange({syntheticEvent:t})}),[e.selectionChange]),o=a.useId(),r=a.getNestedValue(e.field,e.dataItem),l=n.useTableKeyboardNavigation(e.id),i=h.createElement("td",{style:e.style,className:a.classNames("k-table-td",e.className),"aria-colindex":e.ariaColumnIndex,role:"gridcell",...l},h.createElement("input",{checked:"boolean"==typeof r&&r,id:o,type:"checkbox",className:"k-checkbox k-checkbox-md k-rounded-md",onChange:t}),h.createElement("label",{className:"k-checkbox-label",htmlFor:o}));return e.render?e.render.call(void 0,i,e):i};G.displayName="KendoReactTreeListSelectionCell";class Y extends h.Component{constructor(){super(...arguments),this._inputId=a.guid()}render(){return h.createElement(n.HeaderSelectionCell,{inputId:this._inputId,...this.props})}}const J=e=>e.visible&&a.canUseDOM?p.createPortal(h.createElement("div",{className:"k-header k-drag-clue",style:{display:"block",position:"absolute",zIndex:2e4,padding:"8px 12px",top:e.top+"px",left:e.left+"px"}},h.createElement(a.IconWrap,{className:a.classNames("k-drag-status"),name:e.allowDrop?"plus":"cancel",icon:e.allowDrop?l.plusIcon:l.cancelIcon}),e.text),document.body):null;function Q(e,t,o){let a=o?o.elementFromPoint(e.clientX,e.clientY):null;return t&&a?a.closest(t):null}const Z={visible:!1,top:0,left:0,text:"",allowDrop:!1};class ee extends h.Component{constructor(){super(...arguments),this.state={clueProps:{...Z}},this.draggable=h.createRef(),this.dragged=null,this.draggedOver=null,this.onPress=()=>this.dragged=this.props.level,this.onDrag=e=>{if(!a.canUseDOM)return;const t=this.draggable.current&&this.draggable.current.element,o=t?t.ownerDocument:document;if(!o)return;const n=e.event,r=this.dragged;if(t&&r){!n.isTouch&&"scroll"!==n.type&&n.originalEvent.preventDefault();const e=this.props.levels[function(e,t,o){if(!e.originalEvent)return-1;let a=Q(e,"tr",o);if(a){const e=t?t.childNodes:[];for(let t=0;t<e.length;t++)if(e[t]===a)return t}return-1}(n,t.parentNode,o)];this.draggedOver=e;const a=e?!r.every(((t,o)=>t===e[o])):!!Q(n,"k-grid k-grid-md",o);this.setState({clueProps:{visible:!0,top:n.pageY+10,left:n.pageX,text:t.innerText,allowDrop:a}}),this.props.onDrag&&this.props.onDrag.call(void 0,{nativeEvent:n.originalEvent,dragged:r,draggedOver:e,draggedItem:this.props.dataItem})}},this.onRelease=e=>{const t=e.event;if(this.dragged){const e=[...this.dragged],o=this.draggedOver&&[...this.draggedOver],a=this.state.clueProps.allowDrop;this.dragged=null,this.draggedOver=null,this.setState({clueProps:{...Z}});const n=this.props.dataItem;a&&this.props.onDrop&&this.props.onDrop.call(void 0,{nativeEvent:t.originalEvent,dragged:e,draggedOver:o,draggedItem:n})}}}render(){const{clueProps:e}=this.state;return h.createElement(h.Fragment,null,h.createElement(a.Draggable,{ref:this.draggable,onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease},h.createElement(U,{...this.props})),h.createElement(J,{...e}))}}class te extends h.Component{render(){return h.createElement("div",{className:"k-toolbar k-toolbar-md k-grid-toolbar"},this.props.children)}}const oe=[{text:T,operator:"contains"},{text:N,operator:"doesnotcontain"},{text:I,operator:"eq"},{text:y,operator:"neq"},{text:w,operator:"startswith"},{text:D,operator:"endswith"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"},{text:R,operator:"isempty"},{text:k,operator:"isnotempty"}],ae=[{text:I,operator:"eq"},{text:y,operator:"neq"},{text:O,operator:"gte"},{text:L,operator:"gt"},{text:F,operator:"lte"},{text:P,operator:"lt"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"}],ne=[{text:I,operator:"eq"},{text:y,operator:"neq"},{text:A,operator:"gte"},{text:H,operator:"gt"},{text:B,operator:"lt"},{text:j,operator:"lte"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"}],re=[{text:M,operator:""},{text:K,operator:!0},{text:z,operator:!1}];function le(e,t){return{clearButtonTitle:e.toLanguageString(x,V[x]),operators:t.map((t=>({text:e.toLanguageString(t.text,V[t.text]),operator:t.operator})))}}const ie=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t,value:t.target.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=n.useTableKeyboardNavigation(e.id),r=a.classNames({"k-selected":e.isSelected},e.className),l=h.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...o,[v]:e.colIndex},h.createElement("input",{style:{width:"100%"},className:"k-input",value:a.getNestedValue(e.field,e.dataItem)||"",onChange:t}));return e.render?e.render.call(void 0,l,e):l};ie.displayName="KendoReactTreeListTextEditor";const se=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t.syntheticEvent,value:t.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=a.getNestedValue(e.field,e.dataItem),r=n.useTableKeyboardNavigation(e.id),l=a.classNames({"k-selected":e.isSelected},e.className),i=h.createElement("td",{style:e.style,className:l,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...r,[v]:e.colIndex},h.createElement(s.NumericTextBox,{width:"100%",value:void 0===o?null:o,onChange:t}));return e.render?e.render.call(void 0,i,e):i};se.displayName="KendoReactTreeListNumericEditor";const de=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t,value:t.target.checked})}),[e.onChange,e.dataItem,e.level,e.field]),o=a.useId(),r=n.useTableKeyboardNavigation(e.id),l=a.classNames({"k-selected":e.isSelected},e.className),i=h.createElement("td",{style:e.style,className:l,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...r,[v]:e.colIndex},h.createElement("input",{checked:a.getNestedValue(e.field,e.dataItem)||!1,id:o,type:"checkbox",className:"k-checkbox k-checkbox-md k-rounded-md",onChange:t}),h.createElement("label",{className:"k-checkbox-label",htmlFor:o}));return e.render?e.render.call(void 0,i,e):i};de.displayName="KendoReactTreeListBooleanEditor";const ce=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t.syntheticEvent,value:t.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=n.useTableKeyboardNavigation(e.id),r=a.classNames({"k-selected":e.isSelected},e.className);let l=h.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...o,[v]:e.colIndex},h.createElement(d.DatePicker,{width:"100%",value:a.getNestedValue(e.field,e.dataItem),onChange:t}));return e.render?e.render.call(void 0,l,e):l};ce.displayName="KendoReactTreeListDateEditor",Object.defineProperty(e,"getNestedValue",{enumerable:!0,get:function(){return a.getNestedValue}}),Object.defineProperty(e,"mapTree",{enumerable:!0,get:function(){return a.mapTree}}),Object.defineProperty(e,"mapTreeItem",{enumerable:!0,get:function(){return a.mapTreeItem}}),Object.defineProperty(e,"createDataTree",{enumerable:!0,get:function(){return n.createDataTree}}),Object.defineProperty(e,"extendDataItem",{enumerable:!0,get:function(){return n.extendDataItem}}),Object.defineProperty(e,"filterBy",{enumerable:!0,get:function(){return n.filterBy}}),Object.defineProperty(e,"flatData",{enumerable:!0,get:function(){return n.flatData}}),Object.defineProperty(e,"getItemPath",{enumerable:!0,get:function(){return n.getItemPath}}),Object.defineProperty(e,"getSelectedState",{enumerable:!0,get:function(){return n.getSelectedState}}),Object.defineProperty(e,"getSelectedStateFromKeyDown",{enumerable:!0,get:function(){return n.getSelectedStateFromKeyDown}}),Object.defineProperty(e,"modifySubItems",{enumerable:!0,get:function(){return n.modifySubItems}}),Object.defineProperty(e,"moveTreeItem",{enumerable:!0,get:function(){return n.moveTreeItem}}),Object.defineProperty(e,"orderBy",{enumerable:!0,get:function(){return n.orderBy}}),Object.defineProperty(e,"removeItems",{enumerable:!0,get:function(){return n.removeItems}}),Object.defineProperty(e,"setSelectedState",{enumerable:!0,get:function(){return n.setSelectedState}}),Object.defineProperty(e,"treeToFlat",{enumerable:!0,get:function(){return n.treeToFlat}}),e.TREELIST_COL_INDEX_ATTRIBUTE=v,e.TREELIST_PREVENT_SELECTION_ELEMENT=b,e.TREELIST_ROW_INDEX_ATTRIBUTE=f,e.TreeList=$,e.TreeListBooleanEditor=de,e.TreeListBooleanFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.BooleanFilterCell,{ariaLabel:"boolean filter",...le(r.useLocalization(),t||re),...o})},e.TreeListCell=C,e.TreeListDateEditor=ce,e.TreeListDateFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.DateFilterCell,{ariaLabel:"date filter",...le(r.useLocalization(),t||ne),...o})},e.TreeListDraggableRow=ee,e.TreeListHeaderCell=e=>h.createElement(n.HeaderCell,{...e}),e.TreeListHeaderSelectionCell=Y,e.TreeListNoRecords=_,e.TreeListNumericEditor=se,e.TreeListNumericFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.NumericFilterCell,{ariaLabel:"numeric filter",...le(r.useLocalization(),t||ae),...o})},e.TreeListRow=U,e.TreeListSelectionCell=G,e.TreeListTextEditor=ie,e.TreeListTextFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.TextFilterCell,{ariaLabel:"text filter",...le(r.useLocalization(),t||oe),...o})},e.TreeListToolbar=te,e.setHeaderRowsTop=u,e.tableRowsVirtualization=m}));
|
|
8
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-data-tools"),require("@progress/kendo-react-intl"),require("@progress/kendo-svg-icons"),require("react-dom"),require("@progress/kendo-react-inputs"),require("@progress/kendo-react-dateinputs")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-data-tools","@progress/kendo-react-intl","@progress/kendo-svg-icons","react-dom","@progress/kendo-react-inputs","@progress/kendo-react-dateinputs"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactTreelist={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactDataTools,e.KendoReactIntl,e.KendoSvgIcons,e.ReactDOM,e.KendoReactInputs,e.KendoReactDateinputs)}(this,(function(e,t,o,a,n,r,l,i,s,d){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(o){if("default"!==o){var a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,a.get?a:{enumerable:!0,get:function(){return e[o]}})}})),t.default=e,Object.freeze(t)}var h=c(t),p=c(i);function u(e,t,o){const a=Array.from(e.tHead&&e.tHead.rows||[]),n=[t];let r;const l=o||(e=>window.getComputedStyle(e).height||void 0);a.forEach((e=>{let t=l(e);n.push(function(e){return void 0!==e&&("number"==typeof e||/px$/i.test(String(e)))}(t)?parseFloat(String(t)):e.offsetHeight)}));for(let e=0;e<a.length;e++)r=n.slice(0,e+1).reduce(((e,t)=>e+t)),Array.from(a[e].cells).forEach((e=>e.style.top=r+"px"))}const g=1e6;function m(e){const{rows:t,tableViewPortHeight:o,scrollTop:a}=e;if(0===t.length)return[];const n=t[0].height,r=Math.min(Math.round(a/n),t.length),l=Math.round(o/n),i=Math.max(0,r-l),s=Math.min(t.length,r+2*l),d=t.slice(i,s),c=d[d.length-1];return i>0&&d.unshift({dataItem:{},level:[g],offsetTop:0,height:d[0].offsetTop,levelCount:0}),s<t.length-1&&d.push({dataItem:{},level:[g,g],offsetTop:c.offsetTop+c.height,height:(t.length-s)*n,levelCount:0}),d}const f=n.TABLE_ROW_INDEX_ATTRIBUTE,v=n.TABLE_COL_INDEX_ATTRIBUTE,b=n.TABLE_PREVENT_SELECTION_ELEMENT,C=e=>{const{hasChildren:t,level:o=[0],expanded:i,dataItem:s,format:d,id:c,ariaColumnIndex:p,isSelected:u}=e,g=a.getNestedValue(e.field,s),m=r.useInternationalization(),f=n.useTableKeyboardNavigation(c);let C="";const x=h.useCallback((t=>{t.isDefaultPrevented()||t.keyCode===a.Keys.enter&&e.expandable&&(t.preventDefault(),e.onExpandChange(t,s,o))}),[e.expandable,s,o]);null!=g&&(C=d?m.format(d,g):g.toString());const I=[];if(e.expandable){const n=e=>h.createElement("span",{key:e,className:"k-treelist-toggle k-icon k-svg-icon"},h.createElement("svg",{"aria-hidden":"true",focusable:"false",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"}));I.push(...o.slice(1).map(((e,t)=>n(t)))),t?I.push(h.createElement(a.IconWrap,{className:"k-treelist-toggle",name:i?"caret-alt-down":"caret-alt-right",icon:i?l.caretAltDownIcon:l.caretAltRightIcon,key:"expand-collapse",onClick:t=>e.onExpandChange(t.syntheticEvent||t,s,o),[b]:!0})):I.push(n(I.length))}const y=h.createElement("td",{style:e.style,className:a.classNames("k-table-td",e.className,{"k-text-nowrap":e.expandable,"k-selected":u}),colSpan:e.colSpan,"aria-colindex":p,"aria-expanded":t?i:void 0,"aria-selected":u,role:"gridcell",onKeyDown:x,[v]:e.colIndex,...f},I,C);return e.render?e.render.call(void 0,y,e):y};C.displayName="KendoReactTreeListCell";const x="treelist.filterClearButton",I="treelist.filterEqOperator",y="treelist.filterNotEqOperator",E="treelist.filterIsNullOperator",S="treelist.filterIsNotNullOperator",R="treelist.filterIsEmptyOperator",k="treelist.filterIsNotEmptyOperator",w="treelist.filterStartsWithOperator",T="treelist.filterContainsOperator",N="treelist.filterNotContainsOperator",D="treelist.filterEndsWithOperator",O="treelist.filterGteOperator",L="treelist.filterGtOperator",F="treelist.filterLteOperator",P="treelist.filterLtOperator",K="treelist.filterIsTrue",z="treelist.filterIsFalse",M="treelist.filterBooleanAll",A="treelist.filterAfterOrEqualOperator",H="treelist.filterAfterOperator",B="treelist.filterBeforeOperator",j="treelist.filterBeforeOrEqualOperator",q="treelist.noRecords",V={[x]:"Clear",[I]:"Is equal to",[y]:"Is not equal to",[E]:"Is null",[S]:"Is not null",[R]:"Is empty",[k]:"Is not empty",[w]:"Starts with",[T]:"Contains",[N]:"Does not contain",[D]:"Ends with",[O]:"Is greater than or equal to",[L]:"Is greater than",[F]:"Is less than or equal to",[P]:"Is less than",[K]:"Is true",[z]:"Is false",[M]:"(All)",[A]:"Is after or equal to",[H]:"Is after",[B]:"Is before",[j]:"Is before or equal to",[q]:"No records available"};let _=class extends h.Component{render(){return this.props.children||r.provideLocalizationService(this).toLanguageString(q,V[q])}};r.registerForLocalization(_);const U=h.forwardRef(((e,t)=>{const{isSelected:o,rowHeight:n,isAltRow:r,expanded:l,ariaRowIndex:i,level:s,ariaSetSize:d,ariaPosInSet:c}=e,p=a.classNames("k-table-row","k-master-row",{"k-selected":o,"k-alt":r}),u=h.useMemo((()=>void 0!==n?{height:n+"px"}:void 0),[n]),g=h.createElement("tr",{onClick:e.onClick,onDoubleClick:e.onDoubleClick,onContextMenu:e.onContextMenu,className:p,style:u,ref:t,"aria-expanded":l,role:"row","aria-rowindex":i,"aria-level":s.length,"aria-posinset":c,"aria-setsize":d,[f]:e.rowIndex},e.children);return h.createElement(h.Fragment,null,e.render?e.render.call(void 0,g,e):g)}));U.displayName="KendoReactTreeListRow";const W={name:"@progress/kendo-react-treelist",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},X=class extends h.Component{constructor(e){super(e),this.wrapperScrollLeft=0,this.wrapperScrollTop=0,this.updateOnScroll=!1,this.tbodyOffsetTop=0,this.prevData=[],this.flattedData=[],this.extendedColumn=[],this.columnsMap=[],this.element=null,this.contextStateRef={current:void 0},this.navigationStateRef={current:void 0},this.scrollIntoView=e=>{if(!this.element)return;const{rowIndex:t=0}=e,{scrollable:o,rowHeight:a=0}=this.props;if("virtual"===o||a)this.element.scroll(0,(t-1)*a);else{const e=this.element.querySelector(`tbody > tr:nth-child(${t})`);if(e){const t=e.offsetTop-this.tbodyOffsetTop;this.element.scroll(0,t)}}},this.getExtendedColumn=a.memoizeOne(((e,t)=>n.readColumns(e,{prevId:0,idPrefix:t}))),this.getColumnsMap=a.memoizeOne(((e,t)=>n.mapColumns(e,t))),this.onKeyDown=e=>{if(n.tableKeyboardNavigation.onKeyDown(e,{contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),this.props.onKeyDown){const{mode:t,cell:o}=n.getSelectionOptions(this.props.selectable),a={dataItems:this.getLeafDataItems(),mode:t,cell:o,componentId:this._treeListId,selectedField:this.props.selectedField,...this.getArguments(e)};this.props.onKeyDown.call(void 0,a)}},this.onFocus=e=>{n.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 a=this.extendedColumn[e].depth,n=e=>{do{e++}while(e<this.extendedColumn.length&&this.extendedColumn[e].depth>a);return e},r=this.extendedColumn.splice(e,n(e)-e);if(this.extendedColumn.splice(e<t?n(t-r.length):t,0,...r),this.extendedColumn.filter((e=>e.declarationIndex>=0)).forEach(((e,t)=>e.orderIndex=t)),this.props.onColumnReorder){const e={target:this,columns:this.columns,nativeEvent:o};this.props.onColumnReorder.call(void 0,e)}},this.onResize=(e,t,o,a,n)=>{if(this.props.onColumnResize){const r=this.extendedColumn.filter((e=>0===e.children.length)).reduce(((e,t)=>e+parseFloat(String(t.width))),0),l={columns:this.columns,totalWidth:r,index:e,nativeEvent:a,newWidth:t,oldWidth:o,end:n,target:this};this.props.onColumnResize.call(void 0,l)}},this.handleOnScroll=e=>{const t=e.currentTarget.scrollLeft,o=e.currentTarget.scrollTop,{columnVirtualization:a,scrollable:n,rowHeight:r=0}=this.props,l=r;let i=!1;a&&Math.abs(this.wrapperScrollLeft-t)>0&&(this.wrapperScrollLeft=t,i=!0),"virtual"===n&&Math.abs(this.wrapperScrollTop-o)>l&&(this.wrapperScrollTop=o,i=!0),i&&(this.updateOnScroll=!0,this.forceUpdate())},this.calculateSizes=e=>{if(!e||"none"===this.props.scrollable)return;const t=Array.from(e.childNodes),o=t.find((e=>"TABLE"===e.nodeName)),a=this.props.toolbar&&t.find((e=>1===e.nodeType&&e.classList.contains("k-grid-toolbar")));let n=0;if(a){const e=a.style.boxSizing;a.style.boxSizing="border-box",n=parseFloat(String(window.getComputedStyle(a).height))||a.offsetHeight,a.style.boxSizing=e,a.getAttribute("style")||a.removeAttribute("style")}this.tbodyOffsetTop=o.tBodies[0].offsetTop,u(o,n)},this.itemChange=e=>{const t=this.props.onItemChange;if(e.field!==this.props.expandField){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)}}else{const t=this.props.onExpandChange;if(t){const o={...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,level:e.level,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:a}=this.props;if(!a)return;const n={syntheticEvent:e,filter:t,field:o,target:this,nativeEvent:e.nativeEvent};a.call(void 0,n)},this.expandChange=(e,t,o)=>{const{expandField:a,onExpandChange:n}=this.props;if(a&&n){const a={...this.getArguments(e),dataItem:t,level:o,value:this.expanded(t)};n.call(void 0,a)}},this.rowClick=(e,t)=>{if(this.props.onRowClick&&"TD"===e.target.nodeName){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&&"TD"===e.target.nodeName){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&&"TD"===e.target.nodeName){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(...a.getNestedValue(this.props.subItemsField,e)),t},this.getLeafDataItems=()=>this.flatData.map((e=>e.dataItem)),this.expanded=e=>!!a.getNestedValue(this.props.expandField,e),this.hasChildren=e=>!!a.getNestedValue(this.props.subItemsField,e),a.validatePackage(W),this.dragLogic=new n.CommonDragLogic(this.columnReorder,a.noop,a.noop),this.columnResize=new n.ColumnResize(this.onResize.bind(this)),n.tableKeyboardNavigation.onConstructor({navigatable:!!e.navigatable,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}get _treeListId(){return this.props.id+"-treelist"}get document(){if(a.canUseDOM)return this.element&&this.element.ownerDocument||document}componentDidMount(){this.calculateSizes(this.element),n.tableKeyboardNavigation.onComponentDidMount({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}getSnapshotBeforeUpdate(){return n.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({document:this.document,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),null}componentDidUpdate(e){e.columns!==this.props.columns&&this.calculateSizes(this.element),n.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:e=[],filterRow:t,scrollable:o="scrollable",resizable:r=!1,reorderable:l=!1,skip:i,take:s}=this.props,d=e.some((e=>!!e.filter||!!e.filterCell))||void 0!==t,c=t||n.FilterRow,p=n.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef),u=this.getExtendedColumn(e,p),g=u.length!==this.extendedColumn.length;this.extendedColumn=u,this.columnsMap=this.getColumnsMap(this.extendedColumn,g);const f=this.extendedColumn.filter((e=>0===e.children.length));this.columnResize.columns=this.extendedColumn,this.columnResize.resizable=r,this.dragLogic.columns=this.extendedColumn,this.dragLogic.reorderable=l,this.dragLogic.groupable=!1;const v=h.createElement(n.Header,{headerRow:h.createElement(n.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}),filterRow:d&&h.createElement(c,{columns:f,filter:this.props.filter,filterChange:this.filterChange,sort:this.props.sort,ariaRowIndex:this.columnsMap.length+1})||void 0,columnResize:this.columnResize}),b=this.props.style||{},{colSpans:x,hiddenColumns:I}=n.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:f,scrollLeft:this.wrapperScrollLeft,tableViewPortWidth:parseFloat((b.width||"").toString())}),y=(e,t,o,a,r,l)=>f.map(((i,s)=>{if(I[s])return null;const d=i.id?i.id:s,c=`${i.className?i.className+" ":""}${i.locked?"k-grid-content-sticky":""}`,u={id:n.tableKeyboardNavigationTools.generateNavigatableId(`${o}-${String(s)}`,p),colSpan:x[s],dataItem:e.dataItem,field:i.field,format:i.format,className:c||void 0,render:this.props.cellRender,onChange:this.itemChange,selectionChange:this.props.onSelectionChange?t=>{this.selectionChange({event:t,item:e,columnIndex:s,dataIndex:r})}:void 0,level:e.level,expandable:i.expandable,expanded:a,hasChildren:this.hasChildren(e.dataItem),onExpandChange:this.expandChange,colIndex:s,ariaColumnIndex:i.ariaColumnIndex,style:void 0!==i.left&&{left:i.left,right:i.right,borderRightWidth:i.rightBorder?"1px":""}||{},isSelected:Array.isArray(l)&&l.indexOf(s)>-1};return t&&i.editCell?h.createElement(i.editCell,{key:d,...u,onChange:this.itemChange}):i.cell?h.createElement(i.cell,{key:d,...u}):h.createElement(C,{key:d,...u})}));let E=this.flatData;const S=E.length;void 0!==i&&void 0!==s&&(E=E.slice(i,i+s)),"virtual"===o&&(E=m({rows:E,tableViewPortHeight:parseFloat((b.height||b.maxHeight||"").toString()),scrollTop:this.wrapperScrollTop}),this.updateOnScroll=!1);const R=E.map((e=>e.level)),k=this.columnsMap.length+(d?1:0)+1,w=E.length>0&&E.map(((e,t)=>{const n=a.getNestedValue(this.props.editField,e.dataItem),r=this.props.dataItemKey&&a.getter(this.props.dataItemKey)(e.dataItem),l=String(r||e.level.join(".")),i=this.expanded(e.dataItem),s=this.props.selectedField?a.getNestedValue(this.props.selectedField,e.dataItem):void 0,d={key:l,level:e.level,levels:R,dataItem:e.dataItem,selectedField:this.props.selectedField,rowHeight:"virtual"===o?e.height:this.props.rowHeight,render:this.props.rowRender,onDrop:this.onRowDrop,onDrag:this.onRowDrag,onClick:t=>this.rowClick(t,e),onDoubleClick:t=>this.rowDoubleClick(t,e),onContextMenu:t=>this.rowContextMenu(t,e),isAltRow:t%2!=0,expanded:i,rowIndex:t,ariaRowIndex:k+t,ariaSetSize:e.levelCount,ariaPosInSet:e.level[e.level.length-1]+1,isSelected:"boolean"==typeof s&&s},c=this.props.editRow,p=this.props.row||U,u=y(e,n,l,i,t,s);return n&&c?h.createElement(c,{...d,key:d.key},u):h.createElement(p,{...d,key:d.key},u)}))||h.createElement("tr",{className:"k-table-row k-grid-norecords"},h.createElement("td",{colSpan:f.length},this.props.noRecords||h.createElement(_,null))),T=e=>this.props.sort&&this.props.sort.some((t=>t.field===e)),N=h.createElement("colgroup",{ref:e=>{this.columnResize.colGroupMain=e}},f.map(((e,t)=>h.createElement("col",{key:t.toString(),className:T(e.field)?"k-sorted":void 0,style:void 0!==e.width?{width:e.width}:void 0})))),D=this.props.columnVirtualization||"virtual"===this.props.scrollable,O=this.props.selectable&&this.props.selectable.drag?"none":void 0,L=this.props.tableProps||{};return h.createElement(n.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},h.createElement("div",{id:this.props.id,style:this.props.style,className:a.classNames("k-grid k-grid-md","k-treelist",this.props.className,{"k-treelist-scrollable":"none"!==o}),ref:e=>this.element=e,onScroll:D?this.handleOnScroll:void 0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,"aria-rowcount":S,"aria-colcount":f.length,role:"treegrid",...n.tableKeyboardNavigationScopeAttributes},this.props.toolbar,h.createElement(n.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease},h.createElement("table",{className:"k-table k-table-md k-grid-table",...L,style:{...L.style||{},userSelect:O},role:"presentation"},N,v,h.createElement("tbody",{className:"k-table-tbody",...n.tableKeyboardNavigationBodyAttributes,role:"presentation"},w))),this.props.pager&&h.createElement(this.props.pager,{className:"k-grid-pager",total:S,skip:i,take:s,onPageChange:this.onPageChange}),l&&h.createElement(h.Fragment,null,h.createElement(n.DropClue,{ref:this.dragLogic.refDropElementClue}),h.createElement(n.DragClue,{ref:this.dragLogic.refDragElementClue}))))}get columns(){const e=this.extendedColumn.filter((e=>e.declarationIndex>=0&&-1===e.parentIndex)),t=e=>(e.sort(((e,t)=>e.declarationIndex-t.declarationIndex)),e.map((e=>{const{declarationIndex:o,parentIndex:a,depth:n,colSpan:r,rowSpan:l,index:i,kFirst:s,groupable:d,children:c,...h}=e;return c.length?{children:t(c),...h}:h})));return t(e)}get flatData(){const{data:e=[],rowHeight:t=0}=this.props;let o=0;let a=this.updateOnScroll&&this.prevData===e&&this.tbodyOffsetTop>0&&this.flattedData.length?this.flattedData:n.flatData(e,this.expandedSubItems,(e=>{const a={height:t,offsetTop:o};return o+=a.height,a}));return this.prevData=e,this.flattedData=a,a}selectionChange(e){if(this.props.onSelectionChange){const{event:t,item:o,dataIndex:a,columnIndex:r}=e,{mode:l,cell:i}=n.getSelectionOptions(this.props.selectable),s={...this.getArguments(t.syntheticEvent),dataItem:o.dataItem,level:o.level,startColIndex:r,endColIndex:r,startRowIndex:a,endRowIndex:a,dataItems:this.getLeafDataItems(),altKey:!1,ctrlKey:!1,shiftKey:!1,metaKey:!1,mode:l,cell:i,isDrag:!1,componentId:this._treeListId,selectedField:this.props.selectedField||""};this.props.onSelectionChange.call(void 0,s)}}raiseDataEvent(e,t,o){const a=this.props.onDataStateChange;if(e)e.call(void 0,{...this.getArguments(o),...t});else if(a){const e={...this.getArguments(o),dataState:{...this.getDataState(),...t}};a.call(void 0,e)}}getDataState(){return{filter:this.props.filter,sort:this.props.sort}}getArguments(e){return{nativeEvent:e&&e.nativeEvent,syntheticEvent:e,target:this}}};X.propTypes={data:o.array,resizable:o.bool,reorderable:o.bool,sortable:o.oneOfType([o.bool,o.shape({mode:o.oneOf(["single","multiple"]),allowUnsort:o.bool})]),onSortChange:o.func,sort:o.array,columns:o.arrayOf(o.object),columnVirtualization:o.bool,filter:o.array,onFilterChange:o.func,filterRow:o.any,toolbar:o.any,noRecords:o.any,onExpandChange:o.func,expandField:o.string,subItemsField:o.string,selectedField:o.string,onSelectionChange:o.func,onHeaderSelectionChange:o.func,onRowClick:o.func,onItemChange:o.func,editField:o.string,scrollable:o.oneOf(["none","scrollable","virtual"]),rowHeight:o.number,style:o.object,tableProps:o.object,pager:o.any,skip:o.number,take:o.number,onPageChange:o.func,onDataStateChange:o.func,onColumnResize:o.func,onColumnReorder:o.func,dataItemKey:o.string,navigatable:o.bool},X.contextType=n.TableKeyboardNavigationContext;let $=X;const G=e=>{const t=h.useCallback((t=>{e.selectionChange&&e.selectionChange({syntheticEvent:t})}),[e.selectionChange]),o=a.useId(),r=a.getNestedValue(e.field,e.dataItem),l=n.useTableKeyboardNavigation(e.id),i=h.createElement("td",{style:e.style,className:a.classNames("k-table-td",e.className),"aria-colindex":e.ariaColumnIndex,role:"gridcell",...l},h.createElement("input",{checked:"boolean"==typeof r&&r,id:o,type:"checkbox",className:"k-checkbox k-checkbox-md k-rounded-md",onChange:t}),h.createElement("label",{className:"k-checkbox-label",htmlFor:o}));return e.render?e.render.call(void 0,i,e):i};G.displayName="KendoReactTreeListSelectionCell";class Y extends h.Component{constructor(){super(...arguments),this._inputId=a.guid()}render(){return h.createElement(n.HeaderSelectionCell,{inputId:this._inputId,...this.props})}}const J=e=>e.visible&&a.canUseDOM?p.createPortal(h.createElement("div",{className:"k-header k-drag-clue",style:{display:"block",position:"absolute",zIndex:2e4,padding:"8px 12px",top:e.top+"px",left:e.left+"px"}},h.createElement(a.IconWrap,{className:a.classNames("k-drag-status"),name:e.allowDrop?"plus":"cancel",icon:e.allowDrop?l.plusIcon:l.cancelIcon}),e.text),document.body):null;function Q(e,t,o){let a=o?o.elementFromPoint(e.clientX,e.clientY):null;return t&&a?a.closest(t):null}const Z={visible:!1,top:0,left:0,text:"",allowDrop:!1};class ee extends h.Component{constructor(){super(...arguments),this.state={clueProps:{...Z}},this.draggable=h.createRef(),this.dragged=null,this.draggedOver=null,this.onPress=()=>this.dragged=this.props.level,this.onDrag=e=>{if(!a.canUseDOM)return;const t=this.draggable.current&&this.draggable.current.element,o=t?t.ownerDocument:document;if(!o)return;const n=e.event,r=this.dragged;if(t&&r){!n.isTouch&&"scroll"!==n.type&&n.originalEvent.preventDefault();const e=this.props.levels[function(e,t,o){if(!e.originalEvent)return-1;let a=Q(e,"tr",o);if(a){const e=t?t.childNodes:[];for(let t=0;t<e.length;t++)if(e[t]===a)return t}return-1}(n,t.parentNode,o)];this.draggedOver=e;const a=e?!r.every(((t,o)=>t===e[o])):!!Q(n,"k-grid k-grid-md",o);this.setState({clueProps:{visible:!0,top:n.pageY+10,left:n.pageX,text:t.innerText,allowDrop:a}}),this.props.onDrag&&this.props.onDrag.call(void 0,{nativeEvent:n.originalEvent,dragged:r,draggedOver:e,draggedItem:this.props.dataItem})}},this.onRelease=e=>{const t=e.event;if(this.dragged){const e=[...this.dragged],o=this.draggedOver&&[...this.draggedOver],a=this.state.clueProps.allowDrop;this.dragged=null,this.draggedOver=null,this.setState({clueProps:{...Z}});const n=this.props.dataItem;a&&this.props.onDrop&&this.props.onDrop.call(void 0,{nativeEvent:t.originalEvent,dragged:e,draggedOver:o,draggedItem:n})}}}render(){const{clueProps:e}=this.state;return h.createElement(h.Fragment,null,h.createElement(a.Draggable,{ref:this.draggable,onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease},h.createElement(U,{...this.props})),h.createElement(J,{...e}))}}class te extends h.Component{render(){return h.createElement("div",{className:"k-toolbar k-toolbar-md k-grid-toolbar"},this.props.children)}}const oe=[{text:T,operator:"contains"},{text:N,operator:"doesnotcontain"},{text:I,operator:"eq"},{text:y,operator:"neq"},{text:w,operator:"startswith"},{text:D,operator:"endswith"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"},{text:R,operator:"isempty"},{text:k,operator:"isnotempty"}],ae=[{text:I,operator:"eq"},{text:y,operator:"neq"},{text:O,operator:"gte"},{text:L,operator:"gt"},{text:F,operator:"lte"},{text:P,operator:"lt"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"}],ne=[{text:I,operator:"eq"},{text:y,operator:"neq"},{text:A,operator:"gte"},{text:H,operator:"gt"},{text:B,operator:"lt"},{text:j,operator:"lte"},{text:E,operator:"isnull"},{text:S,operator:"isnotnull"}],re=[{text:M,operator:""},{text:K,operator:!0},{text:z,operator:!1}];function le(e,t){return{clearButtonTitle:e.toLanguageString(x,V[x]),operators:t.map((t=>({text:e.toLanguageString(t.text,V[t.text]),operator:t.operator})))}}const ie=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t,value:t.target.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=n.useTableKeyboardNavigation(e.id),r=a.classNames({"k-selected":e.isSelected},e.className),l=h.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...o,[v]:e.colIndex},h.createElement("input",{style:{width:"100%"},className:"k-input",value:a.getNestedValue(e.field,e.dataItem)||"",onChange:t}));return e.render?e.render.call(void 0,l,e):l};ie.displayName="KendoReactTreeListTextEditor";const se=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t.syntheticEvent,value:t.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=a.getNestedValue(e.field,e.dataItem),r=n.useTableKeyboardNavigation(e.id),l=a.classNames({"k-selected":e.isSelected},e.className),i=h.createElement("td",{style:e.style,className:l,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...r,[v]:e.colIndex},h.createElement(s.NumericTextBox,{width:"100%",value:void 0===o?null:o,onChange:t}));return e.render?e.render.call(void 0,i,e):i};se.displayName="KendoReactTreeListNumericEditor";const de=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t,value:t.target.checked})}),[e.onChange,e.dataItem,e.level,e.field]),o=a.useId(),r=n.useTableKeyboardNavigation(e.id),l=a.classNames({"k-selected":e.isSelected},e.className),i=h.createElement("td",{style:e.style,className:l,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...r,[v]:e.colIndex},h.createElement("input",{checked:a.getNestedValue(e.field,e.dataItem)||!1,id:o,type:"checkbox",className:"k-checkbox k-checkbox-md k-rounded-md",onChange:t}),h.createElement("label",{className:"k-checkbox-label",htmlFor:o}));return e.render?e.render.call(void 0,i,e):i};de.displayName="KendoReactTreeListBooleanEditor";const ce=e=>{const t=h.useCallback((t=>{e.onChange&&e.onChange({dataItem:e.dataItem,level:e.level,field:e.field,syntheticEvent:t.syntheticEvent,value:t.value})}),[e.onChange,e.dataItem,e.level,e.field]),o=n.useTableKeyboardNavigation(e.id),r=a.classNames({"k-selected":e.isSelected},e.className);let l=h.createElement("td",{style:e.style,className:r,"aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,role:"gridcell",...o,[v]:e.colIndex},h.createElement(d.DatePicker,{width:"100%",value:a.getNestedValue(e.field,e.dataItem),onChange:t}));return e.render?e.render.call(void 0,l,e):l};ce.displayName="KendoReactTreeListDateEditor",Object.defineProperty(e,"getNestedValue",{enumerable:!0,get:function(){return a.getNestedValue}}),Object.defineProperty(e,"mapTree",{enumerable:!0,get:function(){return a.mapTree}}),Object.defineProperty(e,"mapTreeItem",{enumerable:!0,get:function(){return a.mapTreeItem}}),Object.defineProperty(e,"createDataTree",{enumerable:!0,get:function(){return n.createDataTree}}),Object.defineProperty(e,"extendDataItem",{enumerable:!0,get:function(){return n.extendDataItem}}),Object.defineProperty(e,"filterBy",{enumerable:!0,get:function(){return n.filterBy}}),Object.defineProperty(e,"flatData",{enumerable:!0,get:function(){return n.flatData}}),Object.defineProperty(e,"getItemPath",{enumerable:!0,get:function(){return n.getItemPath}}),Object.defineProperty(e,"getSelectedState",{enumerable:!0,get:function(){return n.getSelectedState}}),Object.defineProperty(e,"getSelectedStateFromKeyDown",{enumerable:!0,get:function(){return n.getSelectedStateFromKeyDown}}),Object.defineProperty(e,"modifySubItems",{enumerable:!0,get:function(){return n.modifySubItems}}),Object.defineProperty(e,"moveTreeItem",{enumerable:!0,get:function(){return n.moveTreeItem}}),Object.defineProperty(e,"orderBy",{enumerable:!0,get:function(){return n.orderBy}}),Object.defineProperty(e,"removeItems",{enumerable:!0,get:function(){return n.removeItems}}),Object.defineProperty(e,"setSelectedState",{enumerable:!0,get:function(){return n.setSelectedState}}),Object.defineProperty(e,"treeToFlat",{enumerable:!0,get:function(){return n.treeToFlat}}),e.TREELIST_COL_INDEX_ATTRIBUTE=v,e.TREELIST_PREVENT_SELECTION_ELEMENT=b,e.TREELIST_ROW_INDEX_ATTRIBUTE=f,e.TreeList=$,e.TreeListBooleanEditor=de,e.TreeListBooleanFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.BooleanFilterCell,{ariaLabel:"boolean filter",...le(r.useLocalization(),t||re),...o})},e.TreeListCell=C,e.TreeListDateEditor=ce,e.TreeListDateFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.DateFilterCell,{ariaLabel:"date filter",...le(r.useLocalization(),t||ne),...o})},e.TreeListDraggableRow=ee,e.TreeListHeaderCell=e=>h.createElement(n.HeaderCell,{...e}),e.TreeListHeaderSelectionCell=Y,e.TreeListNoRecords=_,e.TreeListNumericEditor=se,e.TreeListNumericFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.NumericFilterCell,{ariaLabel:"numeric filter",...le(r.useLocalization(),t||ae),...o})},e.TreeListRow=U,e.TreeListSelectionCell=G,e.TreeListTextEditor=ie,e.TreeListTextFilter=function(e){const{operators:t,...o}=e;return h.createElement(n.TextFilterCell,{ariaLabel:"text filter",...le(r.useLocalization(),t||oe),...o})},e.TreeListToolbar=te,e.setHeaderRowsTop=u,e.tableRowsVirtualization=m}));
|
package/package-metadata.mjs
CHANGED
|
@@ -10,7 +10,7 @@ const e = {
|
|
|
10
10
|
name: "@progress/kendo-react-treelist",
|
|
11
11
|
productName: "KendoReact",
|
|
12
12
|
productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
|
|
13
|
-
publishDate:
|
|
13
|
+
publishDate: 1712846803,
|
|
14
14
|
version: "",
|
|
15
15
|
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
16
16
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-treelist",
|
|
3
|
-
"version": "7.4.0
|
|
3
|
+
"version": "7.4.0",
|
|
4
4
|
"description": "React TreeList enables the display of self-referencing tabular data. KendoReact TreeList package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -26,13 +26,13 @@
|
|
|
26
26
|
"@progress/kendo-date-math": "^1.4.1",
|
|
27
27
|
"@progress/kendo-drawing": "^1.19.0",
|
|
28
28
|
"@progress/kendo-licensing": "^1.3.4",
|
|
29
|
-
"@progress/kendo-react-common": "7.4.0
|
|
30
|
-
"@progress/kendo-react-data-tools": "7.4.0
|
|
31
|
-
"@progress/kendo-react-dateinputs": "7.4.0
|
|
32
|
-
"@progress/kendo-react-dialogs": "7.4.0
|
|
33
|
-
"@progress/kendo-react-dropdowns": "7.4.0
|
|
34
|
-
"@progress/kendo-react-inputs": "7.4.0
|
|
35
|
-
"@progress/kendo-react-intl": "7.4.0
|
|
29
|
+
"@progress/kendo-react-common": "7.4.0",
|
|
30
|
+
"@progress/kendo-react-data-tools": "7.4.0",
|
|
31
|
+
"@progress/kendo-react-dateinputs": "7.4.0",
|
|
32
|
+
"@progress/kendo-react-dialogs": "7.4.0",
|
|
33
|
+
"@progress/kendo-react-dropdowns": "7.4.0",
|
|
34
|
+
"@progress/kendo-react-inputs": "7.4.0",
|
|
35
|
+
"@progress/kendo-react-intl": "7.4.0",
|
|
36
36
|
"@progress/kendo-svg-icons": "^2.1.0",
|
|
37
37
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0",
|
|
38
38
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"
|