@progress/kendo-react-grid 7.2.4-develop.2 → 7.2.4-develop.4

package/Grid.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Re=require("react"),s=require("prop-types"),c=require("@progress/kendo-react-common"),h=require("@progress/kendo-react-data-tools"),ye=require("./cells/GridSelectionCell.js"),Se=require("./cells/GridHierarchyCell.js"),we=require("./cells/GridEditCell.js"),ke=require("./header/Header.js"),Ie=require("./header/HeaderRow.js"),Ee=require("./header/FilterRow.js"),xe=require("./header/GroupPanel.js"),_e=require("./footer/Footer.js"),ze=require("./VirtualScroll.js"),L=require("./VirtualScrollFixed.js"),De=require("./drag/ColumnResize.js"),He=require("./drag/CommonDragLogic.js"),v=require("./utils/index.js"),Te=require("./cells/GridCell.js"),se=require("./cells/GridGroupCell.js"),Ne=require("./rows/GridRow.js"),Me=require("./header/GridHeaderSelectionCell.js"),Fe=require("./GridNoRecords.js"),ie=require("./filterCommon.js"),Ge=require("./footer/FooterRow.js"),Le=require("./paging/GridPagerSettings.js"),Oe=require("./messages/index.js"),oe=require("./package-metadata.js"),Ke=require("./cells/GridDetailCell.js"),Ae=require("./cells/GridDetailHierarchyCell.js");function qe(z){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(z){for(const p in z)if(p!=="default"){const g=Object.getOwnPropertyDescriptor(z,p);Object.defineProperty(a,p,g.get?g:{enumerable:!0,get:()=>z[p]})}}return a.default=z,Object.freeze(a)}const r=qe(Re),_=class _ extends r.Component{constructor(a){super(a),this._columns=[],this._columnsMap=[[]],this._columnsMutations=0,this._resized=!1,this._shouldUpdateLeftRight=!0,this.contextStateRef={current:void 0},this.navigationStateRef={current:void 0},this._data=[],this._slicedData=void 0,this.wrapperScrollTop=0,this.showLicenseWatermark=!1,this.headerRef=r.createRef(),this.headerElementRef=r.createRef(),this._element=null,this.tableElement=null,this.containerRef=r.createRef(),this.tableBodyRef=r.createRef(),this._footer=null,this.forceUpdateTimeout=void 0,this.isRtl=!1,this.observer=null,this.handleIntersection=e=>{const t={rowIndex:this.rowIndex};e.forEach(i=>{i.isIntersecting||this.setCurrentOnTop(t)})},this.setCurrentOnTop=e=>{if(!this.vs.container||this.props.scrollable==="none")return;this.observer&&this.observer.disconnect();const{rowIndex:t}=e;if(this.props.scrollable==="virtual")this.vs.askedSkip=t,this.vs.container.scroll(0,Math.round(this.vs.askedSkip/this.vs.total*this.vs.container.scrollHeight));else if(this.element){const i=t<1?this.element.querySelector("tbody > tr:nth-child(1)"):this.element.querySelector(`tbody > tr:nth-child(${t+1})`);i&&this.containerRef.current&&(this.containerRef.current.scrollTop=i.offsetTop)}},this.scrollIntoView=e=>{if(!this.vs.container||this.props.scrollable==="none")return;this.rowIndex=e.rowIndex;const{rowIndex:t}=e,i=this.element;if(this.observer&&i){this.observer.disconnect();const l=i.querySelector(`[absolute-row-index="${t}"]`);l?this.observer.observe(l):this.setCurrentOnTop(e)}},this.fitColumns=e=>{this.columnResize.dblClickHandler(null,e)},this.onContextMenu=(e,t,i)=>{if(this.props.onContextMenu){const l={target:this,syntheticEvent:e,nativeEvent:e.nativeEvent,dataItem:t,field:i};this.props.onContextMenu.call(void 0,l)}},this.getVirtualScroll=e=>{const{rowHeight:t,detailRowHeight:i,detail:l,expandField:d,groupable:n}=e,u=this.isAllData(),y=t!==void 0&&t>0,w=i!==void 0&&i>0,C=n===!0||typeof n=="object"&&n.enabled!==!1;return!y||C&&!u||!!(l&&d)&&(!w||!u)?ze.VirtualScroll:L.VirtualScrollFixed},this.isAllData=()=>{const{data:e,total:t}=this.props;return Array.isArray(e)?e.length===t:e?t===e.total:!1},this.initializeVirtualization=(e,t)=>{if(this.reInitVirtualization(this.props.scrollable==="virtual",this.props.total,this.props.filter,this.props.group,this.props.sort,t||this.props.rowHeight===void 0||this.props.rowHeight===0),this.vs.fixedScroll=this.props.fixedScroll||!1,this.vs.PageChange=this.pageChange,this.vs.realSkip=this.props.skip||0,this.vs.pageSize=(this.props.take!==void 0?this.props.take:this.props.pageSize)||0,this.vs.scrollableVirtual=this.props.scrollable==="virtual",this.vs.total=e,this.vs.propsSkip=(this.props.skip||0)+(this.props.scrollable==="virtual"?this.vs.topCacheCount+(this.vs.attendedSkip-(this.props.skip||0)):0),this.props.rowHeight!==void 0&&this.props.rowHeight>0&&!t){const i=this.props.rowHeight*e;this.vs.containerHeight=v.firefox?Math.min(v.firefoxMaxHeight,i):i}else this.vs.containerHeight=1533915;if(this.vs.containerRef=this.containerRef,this.vs.tableBodyRef=this.tableBodyRef,this.vs.table=this.tableElement,this._slicedData=void 0,this.vs instanceof L.VirtualScrollFixed){const{rowHeight:i=0,detail:l,expandField:d}=this.props;let{detailRowHeight:n=0}=this.props;n=l&&d?n:i,this.isAllData()?(this.vs.total=this._data.length,this._slicedData=this._data.slice(this.vs.realSkip,this.vs.realSkip+this.vs.pageSize),this.vs.rowHeightService=this.rowHeightService(this.vs,this._data.length,i,n,this._data)):this.vs.rowHeightService=new L.RowHeightService(e,i,n);const u=this.vs.rowHeightService.totalHeight();this.vs.containerHeight=v.firefox?Math.min(v.firefoxMaxHeight,u):u}},this.scrollHandler=e=>{if(e.target!==e.currentTarget)return;clearTimeout(this.forceUpdateTimeout),this.vs.table=this.tableElement;const t=e.currentTarget.scrollLeft,i=e.currentTarget.scrollTop;this.props.columnVirtualization&&(!this.vs.scrollableVirtual||i===this.wrapperScrollTop)&&(this.forceUpdateTimeout=window.setTimeout(()=>{this.forceUpdate()},0)),this._header&&this._header.setScrollLeft(t),this._footer&&this._footer.setScrollLeft(t),this.vs&&i!==this.wrapperScrollTop&&this.vs.scrollHandler(e),c.dispatchEvent(this.props.onScroll,e,this,void 0),this.wrapperScrollTop=i},this.onKeyDown=e=>{if(h.tableKeyboardNavigation.onKeyDown(e,{contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef,onNavigationAction:this.onNavigationAction}),this.props.onKeyDown){const{mode:t,cell:i}=h.getSelectionOptions(this.props.selectable),l={dataItems:this.getLeafDataItems(),mode:t,cell:i,componentId:this._gridId,selectedField:this.props.selectedField,...this.getArguments(e)};this.props.onKeyDown.call(void 0,l)}},this.onFocus=e=>{h.tableKeyboardNavigation.onFocus(e,{contextStateRef:this.contextStateRef})},this.onNavigationAction=e=>{if(this.props.onNavigationAction){const t={focusElement:e.focusElement,...this.getArguments(e.event)};this.props.onNavigationAction.call(void 0,t)}},this.rowClick=(e,t)=>{this.props.onRowClick&&e.target.nodeName==="TD"&&this.props.onRowClick.call(void 0,{dataItem:t.dataItem,...this.getArguments(e)})},this.rowDblClick=(e,t)=>{this.props.onRowDoubleClick&&e.target.nodeName==="TD"&&this.props.onRowDoubleClick.call(void 0,{dataItem:t.dataItem,...this.getArguments(e)})},this.itemChange=e=>{const t=this.props.onItemChange;if(e.field===this.props.expandField||this.props.group&&e.field===void 0){const i=this.props.onExpandChange;i&&i.call(void 0,{...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,dataIndex:e.dataIndex,value:e.value});return}t&&t.call(void 0,{...this.getArguments(e.syntheticEvent),dataItem:e.dataItem,field:e.field,value:e.value})},this.onHeaderSelectionChange=e=>{this.props.onHeaderSelectionChange&&this.props.onHeaderSelectionChange.call(void 0,{field:e.field,nativeEvent:e.syntheticEvent&&e.syntheticEvent.nativeEvent,syntheticEvent:e.syntheticEvent,target:this,dataItems:this.getLeafDataItems(),selectedField:this.props.selectedField})},this.selectionRelease=e=>{if(this.props.onSelectionChange){const t={syntheticEvent:void 0,target:this,selectedField:this.props.selectedField||"",componentId:this._gridId,dataItems:this.getLeafDataItems(),dataItem:null,...e};this.props.onSelectionChange.call(void 0,t)}},this.pageChange=(e,t,i)=>{this.raiseDataEvent(this.props.onPageChange,{page:e},{skip:e.skip,take:e.take},t,i)},this.pagerPageChange=e=>{this.pageChange({skip:e.skip,take:e.take},e.syntheticEvent,e.targetEvent)},this.sortChange=(e,t)=>{this.raiseDataEvent(this.props.onSortChange,{sort:e},{sort:e,...this.props.scrollable==="virtual"?{skip:0}:{}},t)},this.filterChange=(e,t)=>{this.raiseDataEvent(this.props.onFilterChange,{filter:e},{filter:e||void 0,skip:0},t)},this.groupChange=(e,t)=>{const i=t.nativeEvent?t:{nativeEvent:t.nativeEvent||t.originalEvent};this.raiseDataEvent(this.props.onGroupChange,{group:e},{group:e,skip:0},i)},this.onClipboard=(e,t)=>{if(this.props.onClipboard){if(!this.inActiveElement()||!e)return;this.props.onClipboard.call(void 0,{type:e,nativeEvent:t,columns:this._columns,dataItemKey:this.props.dataItemKey||"",...typeof this.props.clipboard!="boolean"?this.props.clipboard:{}})}},this.inActiveElement=()=>{var d,n,u;if(!c.canUseDOM)return!1;const e=c.getActiveElement(this.document),t=e?e.matches(".k-table-td")?e:(d=this.document)==null?void 0:d.body:(n=this.document)==null?void 0:n.body,i=t.closest(".k-grid-container"),l=t&&((u=this._element)==null?void 0:u.contains(t));return!!(t&&l&&i)},this.onResize=(e,t,i,l,d,n)=>{this.resetTableWidth(),this._shouldUpdateLeftRight=!0,this._resized=!0,this._columnsMutations++,this.props.onColumnResize&&this.props.onColumnResize.call(void 0,{columns:this.columns,nativeEvent:l,targetColumnId:n,index:e,newWidth:t,oldWidth:i,end:d,target:this})},this.reInitVirtualization=c.memoizeOne((e,t,i,l,d,n)=>{this.vs.reset();const u=this.getVirtualScroll(this.props);this.vs=new u(n)}),this.flatData=c.memoizeOne((e,t,i,l,d,n,u)=>{const y=[],w=v.flatData(y,e,t,{index:i},l!==void 0,d);return{flattedData:y,resolvedGroupsCount:w}}),this.rowHeightService=c.memoizeOne((e,t,i,l,d)=>new L.RowHeightService(t,i,l,d)),this.childrenToArray=c.memoizeOne(e=>r.Children.toArray(e)),this.readColumns=c.memoizeOne((e,t,i)=>{const l=e.filter(d=>d&&d.type&&d.type.displayName==="KendoReactGridColumn");return v.readColumns(l,this.columns,{prevId:0,idPrefix:t})}),this.mapColumns=c.memoizeOne(e=>h.mapColumns(e)),this.configureColumns=c.memoizeOne((e,t,i)=>{this.props.selectedField&&e.forEach(n=>{n.field===this.props.selectedField?(n.width=n.width||"50px",n.cell=n.cell||ye.GridSelectionCell,n.headerCell=n.headerCell||Me.GridHeaderSelectionCell):n.width=void 0});const l={id:"",resizable:!0,width:"32px",title:" ",declarationIndex:-1,orderIndex:-1,children:[],parentIndex:-1,depth:0,colSpan:0,rowSpan:0,left:0,right:0,index:0,rightBorder:!1,ariaColumnIndex:0,isAccessible:!0};let d=0;this.props.expandField&&this.props.onExpandChange&&this.props.detail&&(e.unshift({...l,cell:Se.GridHierarchyCell,field:this.props.expandField,headerClassName:"k-hierarchy-cell k-header",id:h.tableKeyboardNavigationTools.generateNavigatableId(`${this._columns.length}`,i,"column")}),d++);for(let n=0;n<t;n++)e.unshift({...l,isAccessible:!1,cell:se.GridGroupCell,field:"value",locked:this.props.lockGroups}),d++;e.slice(d).forEach(n=>n.parentIndex>=0&&(n.parentIndex+=d))}),this.getHeaderRow=c.memoizeOne((e,t,i,l,d,n,u,y,w,C,D,O)=>r.createElement(Ie.HeaderRow,{cells:this.props.cells,sort:e,sortable:t,sortChange:this.sortChange,group:i||[],groupable:l,groupChange:this.groupChange,filter:d,filterable:n,filterOperators:u,filterChange:this.filterChange,columnMenu:w,selectionChange:this.onHeaderSelectionChange,columns:C,columnResize:this.columnResize,pressHandler:this.dragLogic.pressHandler,dragHandler:this.dragLogic.dragHandler,releaseHandler:this.dragLogic.releaseHandler,columnsMap:D,cellRender:y,isRtl:O,dragClue:this.dragLogic.dragClueRef,headerRef:this.headerElementRef,containerRef:this.containerRef})),this.resolveTitle=e=>{const t=this._columns.find(l=>l.field===e),i=t&&(t.title||t.field);return i===void 0?e:i},this.getLeafDataItems=()=>this._data.filter(e=>e.rowType==="data").map(e=>e.dataItem),c.validatePackage(oe.packageMetadata),this.showLicenseWatermark=c.shouldShowValidationUI(oe.packageMetadata);const p=this.props.groupable===!0||typeof this.props.groupable=="object"&&this.props.groupable.enabled!==!1,g=this.getVirtualScroll(a);this.vs=new g(p||a.rowHeight===void 0||a.rowHeight===0),this.dragLogic=new He.CommonDragLogic(this.columnReorder.bind(this),this.groupReorder.bind(this),this.columnToGroup.bind(this)),this.columnResize=new De.ColumnResize(this.onResize),this.props.clipboard&&(this.clipboardService=new h.ClipboardService(this.onClipboard)),h.tableKeyboardNavigation.onConstructor({navigatable:!!a.navigatable,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef,idPrefix:this._gridId})}get columns(){const a=this._columns.filter(p=>p.declarationIndex>=0&&p.parentIndex===-1);return v.sanitizeColumns(a)}get element(){return this._element}get document(){if(c.canUseDOM)return this.element&&this.element.ownerDocument||document}get _header(){return this.headerRef.current}get _gridId(){return this.props.id+"-role-element-id"}componentDidMount(){this.resetTableWidth(),c.setScrollbarWidth();const a=h.isRtl(this.element);this.isRtl=a,h.tableKeyboardNavigation.onComponentDidMount({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),this.isRtl&&this.forceUpdate();const p={rootMargin:"0px",threshold:.9};this.clipboardService&&this.clipboardService.addEventListeners(this.document),this.observer=c.canUseDOM&&window.IntersectionObserver&&new window.IntersectionObserver(this.handleIntersection,p)||null}getSnapshotBeforeUpdate(){return h.tableKeyboardNavigation.onGetSnapshotBeforeUpdate({document:this.document,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef}),null}componentDidUpdate(){this.resetTableWidth(),c.setScrollbarWidth(),this.vs.tableTransform&&this.vs.table&&(this.vs.table.style.transform=this.vs.tableTransform,this.vs.tableTransform=""),h.tableKeyboardNavigation.onComponentDidUpdate({scope:this.element||void 0,contextStateRef:this.contextStateRef,navigationStateRef:this.navigationStateRef})}componentWillUnmount(){clearTimeout(this.forceUpdateTimeout),this.clipboardService&&this.clipboardService.removeEventListeners(this.document)}render(){var ee;let a=this.props.total||0;const p=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef);let g=[];Array.isArray(this.props.data)?(g=this.props.data,a=a||this.props.data.length):this.props.data&&(g=this.props.data.data,a=a||this.props.data.total);const e=typeof this.props.groupable=="object"&&this.props.groupable.footer||"none",{resolvedGroupsCount:t,flattedData:i}=this.flatData(g,e,this.props.skip||0,this.props.group,this.props.expandField,this.props.filter,this.props.sort);this._data=i;const l=this.props.groupable===!0||typeof this.props.groupable=="object"&&this.props.groupable.enabled!==!1;this.columnResize.resizable=this.props.resizable||!1,this.dragLogic.reorderable=this.props.reorderable||!1,this.dragLogic.groupable=l;const d=this.props.selectable&&this.props.selectable.drag?"none":void 0;this.initializeVirtualization(a,l);const n=this.childrenToArray(this.props.children);this.initColumns(n,t);const u=n.map(o=>o&&o.type&&o.type.displayName==="KendoReactGridToolbar"?r.cloneElement(o,{...o.props,ariaControls:this._gridId}):null),y=n.filter(o=>o&&o.type&&o.type.displayName==="KendoReactGridNoRecords"),w=n.filter(o=>o&&o.type&&o.type.displayName==="KendoReactGridStatusBar"),C=this._columns.filter(o=>o.children.length===0),D=l&&r.createElement(xe.GroupPanel,{group:this.props.group||[],groupChange:this.groupChange,pressHandler:this.dragLogic.pressHandler,dragHandler:this.dragLogic.dragHandler,releaseHandler:this.dragLogic.releaseHandler,refCallback:this.dragLogic.refGroupPanelDiv,resolveTitle:this.resolveTitle,ariaControls:this._gridId,onContextMenu:this.onContextMenu}),{sort:O,sortable:re,group:ae,filter:le,filterable:ne,filterOperators:he=ie.operators,headerCellRender:pe,columnMenu:de}=this.props,V=r.createElement(ke.Header,{size:this.props.size,columnResize:this.columnResize,staticHeaders:this.props.scrollable!=="none",scrollableDataElement:()=>this.vs.container,draggable:this.props.reorderable||l,ref:this.headerRef,elemRef:this.headerElementRef,headerRow:this.getHeaderRow(O,re,ae,l,le,ne,he,pe,de,this._columns,this._columnsMap,this.isRtl),filterRow:this.props.filterable&&r.createElement(Ee.FilterRow,{cells:this.props.cells,size:this.props.size,columns:this._columns,filter:this.props.filter,filterOperators:this.props.filterOperators||ie.operators,filterChange:this.filterChange,sort:this.props.sort,cellRender:this.props.filterCellRender,isRtl:this.isRtl,ariaRowIndex:this._columnsMap.length+1})||void 0,cols:C.map((o,m)=>r.createElement("col",{key:m.toString(),width:v.getColumnWidth(o)}))}),ce=this.vs&&this.vs.container&&this.vs.container.scrollLeft||0,ue=parseFloat(((this.props.style||{}).width||"").toString()),{colSpans:ge,hiddenColumns:fe}=h.tableColumnsVirtualization({enabled:this.props.columnVirtualization,columns:C,tableViewPortWidth:ue,scrollLeft:ce}),me=(o,m,b)=>{let x=!1;const E=this.props.selectedField?v.getNestedValue(this.props.selectedField,o.dataItem):void 0;return{row:C.map((f,R)=>{if(fe[R])return null;const T=f.id?f.id:R,N=`${f.className?f.className+" ":""}${f.locked?"k-grid-content-sticky":""}`,k=f.left!==void 0?this.isRtl?{left:f.right,right:f.left}:{left:f.left,right:f.right}:{};let I=!1;if(f.editable&&this.props.editField){const S=v.getNestedValue(this.props.editField,o.dataItem);S&&(S===!0||S===f.field)&&(x=!0,I=!0)}const q=f.cell||I&&we.GridEditCell||Te.GridCell;return r.createElement(q,{onContextMenu:this.onContextMenu,key:T,locked:this.props.lockGroups,id:h.tableKeyboardNavigationTools.generateNavigatableId(`${m}-${String(R)}`,p),colSpan:ge[R],dataItem:o.dataItem,field:f.field,editor:f.editor,format:f.format,className:N,render:this.props.cellRender,cells:v.resolveCells(this.props.cells,f.cells),onChange:this.itemChange,selectionChange:this.props.onSelectionChange?S=>{this.selectionChange({event:S,dataItem:o.dataItem,dataIndex:b,columnIndex:R})}:void 0,columnIndex:R,columnsCount:C.length,rowType:o.rowType,level:o.level,expanded:o.expanded,dataIndex:o.dataIndex,style:k,ariaColumnIndex:f.ariaColumnIndex,isSelected:Array.isArray(E)&&E.indexOf(R)>-1})}),isInEdit:x,isSelected:typeof E=="boolean"&&E}};let U=0;if(this.props.scrollable==="virtual")for(let o=0;o<this.vs.topCacheCount+this.vs.attendedSkip-(this.props.skip||0);o++){const m=this._data.shift();if(m)this._data.push(m),U++,m.rowType==="groupHeader"&&o--;else break}const W=o=>o>=this._data.length-U;let B=this.vs.realSkip||0;const F=[];let K=!1;const A=this._columnsMap.length+(this.props.filterable?1:0)+1,$=r.createElement("div",{key:"no-records",className:"k-grid-norecords","aria-rowindex":A},r.createElement("div",{className:"k-grid-norecords-template"},y.length?y:r.createElement(Fe.GridNoRecords,null)));let H=0;if(this._data.length){let o=-1,m=0;(this._slicedData||this._data).forEach((b,x)=>{b.rowType==="data"&&(B++,o++);const E=B%2===0,f=this.props.dataItemKey&&c.getter(this.props.dataItemKey)(b.dataItem),R=x+(this.vs.realSkip||0),T=f||"ai"+R,N=T+"_1",k=me(b,T,o);if(H=R+A+m,F.push(r.createElement(Ne.GridRow,{key:T,dataItem:b.dataItem,isAltRow:E,isInEdit:k.isInEdit,rowType:b.rowType,isHidden:W(x),onClick:I=>this.rowClick(I,b),onDoubleClick:I=>this.rowDblClick(I,b),selectedField:this.props.selectedField,rowHeight:this.props.rowHeight,render:this.props.rowRender,ariaRowIndex:H,absoluteRowIndex:R,dataIndex:o,isSelected:k.isSelected},k.row)),this.props.detail&&b.rowType==="data"&&b.expanded){const I=C.length-(this.props.expandField?1:0)-(this.props.group?this.props.group.length:0)||1;m++,H=R+A+m,F.push(r.createElement("tr",{key:N,className:c.classNames("k-table-row",E?"k-detail-row k-table-alt-row k-alt":"k-detail-row"),style:{visibility:W(x)?"hidden":"",height:this.props.detailRowHeight},role:"row","aria-rowindex":H},this.props.group&&this.props.group.map((q,S)=>{var te;const M=(te=k==null?void 0:k.row[S])==null?void 0:te.props.style,Ce=M?this.isRtl?{left:M.right,right:M.left}:{left:M.left,right:M.right}:{};return r.createElement(se.GridGroupCell,{id:"",dataIndex:b.dataIndex,field:q.field,dataItem:b.dataItem,key:S,style:Ce,ariaColumnIndex:1+S,isSelected:!1,locked:this.props.lockGroups,isRtl:this.isRtl,cells:this.props.cells})}),this.props.expandField&&r.createElement(Ae.GridDetailHierarchyCell,{id:h.tableKeyboardNavigationTools.generateNavigatableId(`${N}-dhcell`,p)}),r.createElement(Ke.GridDetailCell,{onContextMenu:this.onContextMenu,dataItem:b.dataItem,dataIndex:b.dataIndex,colSpan:I,ariaColIndex:2+(this.props.group?this.props.group.length:0),detail:this.props.detail,id:h.tableKeyboardNavigationTools.generateNavigatableId(`${N}-dcell`,p)})))}})}else K=!0;const j={size:this.props.size,onPageChange:this.pagerPageChange,total:a,dir:this.isRtl?"rtl":void 0,skip:this.vs.propsSkip||0,take:(this.props.take!==void 0?this.props.take:this.props.pageSize)||10,messagesMap:Oe.pagerMessagesMap,...Le.normalize(this.props.pageable||{})},J=this.props.pager?r.createElement(this.props.pager,{...j}):r.createElement(h.Pager,{className:"k-grid-pager",...j}),be=o=>this.props.sort&&this.props.sort.filter(m=>m.field===o).length>0,ve=(o,m)=>r.createElement("col",{key:m.toString(),width:v.getColumnWidth(o)}),Q=(ee=this.props.cells)!=null&&ee.footerCell||this._columns.some(o=>{var m;return!!(o.footerCell||(m=o.cells)!=null&&m.footerCell)})?r.createElement(_e.Footer,{size:this.props.size,columnResize:this.columnResize,staticHeaders:this.props.scrollable!=="none",ref:o=>this._footer=o,row:r.createElement(Ge.FooterRow,{cells:this.props.cells,columns:this._columns,isRtl:this.isRtl,ariaRowIndex:H+1}),cols:C.map(ve)}):null,X=r.createElement("colgroup",{ref:o=>{this.columnResize.colGroupMain=o}},C.map((o,m)=>r.createElement("col",{key:m.toString(),className:be(o.field)?"k-sorted":void 0,width:v.getColumnWidth(o)}))),Y=this.dragLogic.reorderable||this.dragLogic.groupable,Z=this.props.columnVirtualization?"block":"table";if(this.props.scrollable==="none")return r.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},r.createElement("div",{id:this.props.id,style:this.props.style,className:c.classNames("k-grid",{"k-grid-md":!this.props.size,[`k-grid-${c.kendoThemeMaps.sizeMap[this.props.size]||this.props.size}`]:this.props.size},this.props.className),ref:o=>{this._element=o},"aria-label":this.props.ariaLabel,onKeyDown:this.onKeyDown,onFocus:this.onFocus,...h.tableKeyboardNavigationScopeAttributes},u,D,r.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease,childRef:o=>{this.tableElement=o}},r.createElement("table",{className:c.classNames("k-table k-grid-table",{[`k-table-${c.kendoThemeMaps.sizeMap[this.props.size]||this.props.size}`]:this.props.size}),style:{userSelect:d,display:Z}},X,V,r.createElement("tbody",{role:"rowgroup",className:"k-table-tbody",...h.tableKeyboardNavigationBodyAttributes},F),Q)),K&&$,Y&&r.createElement(r.Fragment,null,r.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),r.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue}))),w,this.props.pageable&&J);let G=this.props.style||{};return this.props.scrollable==="virtual"&&(G.height||(G=Object.assign({},G,{height:"450px"}))),r.createElement(h.TableKeyboardNavigationContext.Provider,{value:this.contextStateRef.current},r.createElement("div",{id:this.props.id,style:G,className:c.classNames("k-grid",{"k-grid-md":!this.props.size,[`k-grid-${c.kendoThemeMaps.sizeMap[this.props.size]||this.props.size}`]:this.props.size,"k-grid-virtual":this.props.scrollable==="virtual"},this.props.className),ref:o=>{this._element=o},"aria-label":this.props.ariaLabel,onKeyDown:this.onKeyDown,onFocus:this.onFocus,...h.tableKeyboardNavigationScopeAttributes},u,D,r.createElement("div",{className:"k-grid-aria-root",role:"grid","aria-colcount":C.length,"aria-rowcount":a,id:this._gridId},V,r.createElement("div",{className:"k-grid-container",role:"presentation"},r.createElement("div",{ref:this.containerRef,className:"k-grid-content k-virtual-content",onScroll:this.scrollHandler,role:"presentation"},r.createElement("div",{className:"k-grid-table-wrap",role:"presentation"},r.createElement(h.TableSelection,{selectable:this.props.selectable,onRelease:this.selectionRelease,childRef:o=>{this.tableElement=o}},r.createElement("table",{className:c.classNames("k-table k-grid-table",{"k-table-md":!this.props.size,[`k-table-${c.kendoThemeMaps.sizeMap[this.props.size]||this.props.size}`]:this.props.size}),role:"presentation",style:{userSelect:d,display:Z}},X,r.createElement("tbody",{className:"k-table-tbody",ref:this.tableBodyRef,role:"rowgroup",...h.tableKeyboardNavigationBodyAttributes},F))),K&&$),r.createElement("div",{className:"k-height-container",role:"presentation"},r.createElement("div",{style:this.props.scrollable==="virtual"?{height:this.vs.containerHeight+"px"}:{}})))),Q,Y&&r.createElement(r.Fragment,null,r.createElement(h.DropClue,{ref:this.dragLogic.refDropElementClue}),r.createElement(h.DragClue,{ref:this.dragLogic.refDragElementClue})),this.showLicenseWatermark&&r.createElement(c.WatermarkOverlay,null)),w,this.props.pageable&&J))}selectionChange(a){if(this.props.onSelectionChange){const{event:p,dataItem:g,dataIndex:e,columnIndex:t}=a,{mode:i,cell:l}=h.getSelectionOptions(this.props.selectable),d={...this.getArguments(p.syntheticEvent),dataItem:g,startColIndex:t,endColIndex:t,startRowIndex:e,endRowIndex:e,dataItems:this.getLeafDataItems(),altKey:!1,ctrlKey:!1,shiftKey:!1,metaKey:!1,mode:i,cell:l,isDrag:!1,componentId:this._gridId,selectedField:this.props.selectedField||""};this.props.onSelectionChange.call(void 0,d)}}raiseDataEvent(a,p,g,e,t){const i=this.props.onDataStateChange;if(a){const l={...this.getArguments(e),...p,targetEvent:t};a.call(void 0,l)}else i&&i.call(void 0,{...this.getArguments(e),targetEvent:t||{},dataState:{...this.getDataState(),...g}})}columnReorder(a,p,g){const e=this._columns[a],t=e.depth,i=u=>{do u++;while(u<this._columns.length&&this._columns[u].depth>t);return u},l=this._columns.splice(a,i(a)-a);this._columns.splice(a<p?i(p-l.length):p,0,...l),this._columns.filter(u=>u.declarationIndex>=0).forEach((u,y)=>u.orderIndex=y),this._columnsMutations++;const d=this._columns[a].locked&&this._columns[p].locked;h.updateLeft(this._columnsMap,this._columns,d||this._shouldUpdateLeftRight),h.updateRight(this._columnsMap,this._columns,d||this._shouldUpdateLeftRight),this._resized&&(this._shouldUpdateLeftRight=!1,this._resized=!1);const n=this.columns;if(this.forceUpdate(),this.props.onColumnReorder){const u={target:this,columns:n,columnId:e.id,nativeEvent:g};this.props.onColumnReorder.call(void 0,u)}}groupReorder(a,p,g){if(this.props.group===void 0)return;const e=this.props.group.slice();e.splice(p,0,...e.splice(a,1)),this.groupChange(e,g)}columnToGroup(a,p,g){const e=this._columns[a].field;if(!e)return;const t=(this.props.group||[]).slice();t.splice(p,0,{field:e}),this.groupChange(t,g)}resetTableWidth(){let a=0;if(!this.columnResize.colGroupMain)return;const p=this.columnResize.colGroupMain.children;for(let g=0;g<p.length;g++){const e=p[g].width;if(!e)return;a+=parseFloat(e.toString())}a=Math.round(a),this._header&&this._header.setWidth(a),this._footer&&this._footer.setWidth(a),this.tableElement&&(this.tableElement.style.width=a+"px")}initColumns(a,p){const g=h.tableKeyboardNavigationTools.getIdPrefix(this.navigationStateRef);this._columns=this.readColumns(a,g,this._columnsMutations),this._columns.length===0&&(this._columns=v.autoGenerateColumns(this.props.data,this.props.group,this.props.expandField,{prevId:0,idPrefix:g})),this.configureColumns(this._columns,p,g),this._columnsMap=this.mapColumns(this._columns),this.columnResize.columns=this._columns,this.dragLogic.columns=this._columns}getDataState(){return{filter:this.props.filter,sort:this.props.sort,skip:this.props.skip,take:this.props.take!==void 0?this.props.take:this.props.pageSize,group:this.props.group}}getArguments(a){return{nativeEvent:a&&a.nativeEvent,syntheticEvent:a,target:this}}};_.displayName="KendoReactGrid",_.defaultProps={},_.propTypes={data:s.oneOfType([s.array,s.shape({data:s.array,total:s.number})]),sortable:s.oneOfType([s.bool,s.shape({mode:s.oneOf(["single","multiple"]),allowUnsort:s.bool})]),onSortChange:s.func,sort:s.array,filterable:s.bool,filter:s.any,onFilterChange:s.func,pageable:s.oneOfType([s.bool,s.shape({buttonCount:s.number,responsive:s.bool,info:s.bool,type:s.oneOf(["numeric","input"]),pageSizes:s.oneOfType([s.bool,s.arrayOf(s.oneOfType([s.string,s.number]))]),previousNext:s.bool})]),pageSize:s.number,onPageChange:s.func,total:s.number,skip:s.number,take:s.number,fixedScroll:s.bool,onExpandChange:s.func,expandField:s.string,selectedField:s.string,onSelectionChange:s.func,onHeaderSelectionChange:s.func,resizable:s.bool,reorderable:s.bool,group:s.any,groupable:s.oneOfType([s.bool,s.shape({enabled:s.bool,footer:s.oneOf(["always","visible","none"])})]),onGroupChange:s.func,onRowClick:s.func,onRowDoubleClick:s.func,onItemChange:s.func,editField:s.string,scrollable:s.oneOf(["none","scrollable","virtual"]),rowHeight:s.number,detailRowHeight:s.number,detail:s.any,style:s.object,onDataStateChange:s.func,onColumnResize:s.func,onColumnReorder:s.func,dataItemKey:s.string,navigatable:s.bool,size:s.oneOf(["small","medium"])},_.contextType=h.TableKeyboardNavigationContext;let P=_;exports.Grid=P;