@progress/kendo-react-treeview 12.0.1 → 12.0.2-develop.2
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/dist/cdn/js/kendo-react-treeview.js +1 -1
- package/index.d.mts +40 -20
- package/index.d.ts +40 -20
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +4 -4
|
@@ -12,4 +12,4 @@
|
|
|
12
12
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
13
13
|
*-------------------------------------------------------------------------------------------
|
|
14
14
|
*/
|
|
15
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-animation")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-svg-icons","@progress/kendo-react-animation"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactTreeview={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoSvgIcons,e.KendoReactAnimation)}(this,(function(e,t,i,s,n,r){"use strict";function d(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(i){if("default"!==i){var s=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:function(){return e[i]}})}})),t.default=e,Object.freeze(t)}var a=d(t);function o(e,t,i,n,r){switch(n){case s.Keys.left:return s.treeIdUtils.isIdZeroLevel(t)||r.expanded(e)&&s.isEnabledAndAllParentsEnabled(t,i,r)?t:s.treeIdUtils.getDirectParentId(t);case s.Keys.right:return s.isItemExpandedAndWithChildren(e,r)?s.treeIdUtils.getFirstChildId(t):t;case s.Keys.up:return function(){const e=Number(s.treeIdUtils.getShortId(t)),n=s.treeIdUtils.getDirectParentId(t);return e?c(s.treeIdUtils.createId(e-1,n),i,r):s.treeIdUtils.isIdZeroLevel(t)?t:n}();case s.Keys.down:return s.isItemExpandedAndWithChildren(e,r)?s.treeIdUtils.getFirstChildId(t):l(t,i,r)||t;case s.Keys.home:return s.treeIdUtils.ZERO_LEVEL_ZERO_NODE_ID;case s.Keys.end:return function(){let e,t=(i.length-1).toString(),n=i[i.length-1];for(;s.isItemExpandedAndWithChildren(n,r);)e=n[r.getChildrenField()],t=s.treeIdUtils.createId(e.length-1,t),n=e[e.length-1];return t}();default:return t}}function l(e,t,i){const n=s.treeIdUtils.getDirectParentId(e),r=n?s.treeIdUtils.getItemById(n,t,i.getChildrenField()):void 0,d=r?r[i.getChildrenField()]:t,a=Number(s.treeIdUtils.getShortId(e));return a<d.length-1?s.treeIdUtils.createId(a+1,n):r?l(n,t,i):void 0}function c(e,t,i){const n=s.treeIdUtils.getItemById(e,t,i.getChildrenField());return s.isItemExpandedAndWithChildren(n,i)?c(s.treeIdUtils.createId(n[i.getChildrenField()].length-1,e),t,i):e}const h=(e,t)=>{const i=((e,t)=>e===t.length-1)(e,t);return 0!==e||i?i?"bot":"mid":"top"},p="expanded",m="items",u="selected",I="checked",g="checkIndeterminate",f="_kendoItemId",b="_kendoTreeViewGuid",{sizeMap:v}=s.kendoThemeMaps,C=a.createContext((e=>e)),x=class extends a.Component{constructor(){super(...arguments),this.onCheckChange=e=>{this.props.onCheckChange(e,this.item,this.itemId)},this.onExpandChange=e=>{this.props.onExpandChange(e,this.item,this.itemId)},this.onItemClick=e=>{this.props.onItemClick(e,this.item,this.itemId)},this.onPress=e=>{this.props.onPress(e.event,this.item,this.itemId)},this.onDrag=e=>{this.props.onDrag(e.event,this.item,this.itemId)},this.onRelease=e=>{this.props.onRelease(e.event,this.item,this.itemId)},this.onContextMenu=e=>{this.props.onContextMenu(e,this.item,this.itemId)},this.assignDraggableMeta=e=>{e&&(e[f]=this.props.itemId,e[b]=this.props.treeGuid)}}render(){const e=this.renderSubitemsIfApplicable(),t=this.renderItemInPart();return a.createElement("li",{className:s.classNames("k-treeview-item"),tabIndex:this.tabIndex,role:"treeitem","aria-expanded":this.ariaExpanded,"aria-selected":this.ariaSelected,"aria-checked":this.ariaChecked,"aria-disabled":!!this.disabled||void 0,ref:e=>{this.itemElement=e}},a.createElement("span",{className:`k-treeview-${this.props.position}`,ref:this.assignDraggableMeta},this.renderExpandIcon(),this.renderCheckbox(),this.props.draggable?a.createElement(s.Draggable,{onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease},t):t),e&&(this.props.animate?a.createElement(r.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,style:{display:"block"},children:e}):e))}componentDidMount(){const e=this.props.focusedItemId,t=this.itemId;e&&e===t&&this.props.onFocusDomElNeeded(this.itemElement),this.checkboxElement&&(this.checkboxElement.indeterminate=this.fieldsSvc.checkIndeterminate(this.item))}componentDidUpdate(e){const t=this.props.focusedItemId;if(t&&t!==e.focusedItemId&&t===this.itemId&&this.props.onFocusDomElNeeded(this.itemElement),this.checkboxElement){const e=this.fieldsSvc.checkIndeterminate(this.item);this.checkboxElement.indeterminate!==e&&(this.checkboxElement.indeterminate=e)}}renderCheckbox(){if(this.props.checkboxes){const e=this.props.size;return a.createElement("span",{className:s.classNames("k-checkbox-wrap")},a.createElement("input",{type:"checkbox",className:s.classNames("k-checkbox k-rounded-md",{[`k-checkbox-${v[e]||e}`]:e,"k-disabled":this.disabled}),"aria-label":this.item.text,checked:!!this.fieldsSvc.checked(this.item),id:this.props.id,tabIndex:-1,onChange:this.onCheckChange,ref:e=>{this.checkboxElement=e}}))}}renderExpandIcon(){return this.props.expandIcons&&(this.fieldsSvc.hasChildren(this.item)||s.hasChildren(this.item,this.fieldsSvc.getChildrenField()))&&a.createElement("span",{className:s.classNames("k-treeview-toggle",{"k-disabled":this.disabled}),onClick:this.onExpandChange},a.createElement(s.IconWrap,{...this.getIconProps()}))}renderSubitemsIfApplicable(){const e=this.fieldsSvc.children(this.item);return s.isItemExpandedAndWithChildren(this.item,this.fieldsSvc)?a.createElement("ul",{className:"k-treeview-group",role:"group"},e.map(((t,i)=>a.createElement(E,{item:t,position:h(i,e),itemId:s.treeIdUtils.createId(i,this.itemId),treeGuid:this.props.treeGuid,animate:this.props.animate,focusedItemId:this.props.focusedItemId,tabbableItemId:this.props.tabbableItemId,fieldsService:this.props.fieldsService,itemUI:this.props.itemUI,checkboxes:this.props.checkboxes,ariaMultiSelectable:this.props.ariaMultiSelectable,onItemClick:this.props.onItemClick,onFocusDomElNeeded:this.props.onFocusDomElNeeded,draggable:this.props.draggable,onPress:this.props.onPress,onDrag:this.props.onDrag,onRelease:this.props.onRelease,expandIcons:this.props.expandIcons,iconField:this.props.iconField,onExpandChange:this.props.onExpandChange,onCheckChange:this.props.onCheckChange,onContextMenu:this.props.onContextMenu,key:i,size:this.props.size,disabled:this.disabled,isRtl:this.props.isRtl})))):void 0}renderItemInPart(){const e=this.props.iconField,t=e&&this.item[e];return a.createElement("span",{className:s.classNames("k-treeview-leaf",{"k-focus":this.props.focusedItemId===this.itemId,"k-selected":this.fieldsSvc.selected(this.item),"k-disabled":this.disabled,"k-touch-action-none":this.props.draggable}),onClick:this.onItemClick,onContextMenu:this.onContextMenu},t&&a.createElement(s.IconWrap,{name:t.name,icon:t}),a.createElement("span",{className:"k-treeview-leaf-text"},this.props.itemUI?a.createElement(this.props.itemUI,{item:this.item,itemHierarchicalIndex:this.itemId}):this.fieldsSvc.text(this.item)))}get fieldsSvc(){return this.props.fieldsService}get itemId(){return this.props.itemId}get item(){return this.props.item}get tabIndex(){return(this.props.focusedItemId||this.props.tabbableItemId)===this.itemId?0:-1}get ariaExpanded(){return this.fieldsSvc.hasChildren(this.item)||s.hasChildren(this.item,this.fieldsSvc.getChildrenField())?!!this.fieldsSvc.expanded(this.item):void 0}get disabled(){return this.props.disabled||this.fieldsSvc.disabled(this.item)}get ariaChecked(){if(this.props.checkboxes)return this.fieldsSvc.checked(this.item)?"true":this.fieldsSvc.checkIndeterminate(this.item)?"mixed":"false"}get ariaSelected(){return!!this.fieldsSvc.selected(this.item)||(this.props.ariaMultiSelectable?!!this.disabled&&void 0:void 0)}getIconProps(){const e=this.fieldsSvc.expanded(this.item);return e&&!s.hasChildren(this.item,this.fieldsSvc.getChildrenField())?{name:"loading"}:e?{name:"caret-alt-down",icon:n.caretAltDownIcon}:{name:this.props.isRtl?"caret-alt-left":"caret-alt-right",icon:this.props.isRtl?n.caretAltLeftIcon:n.caretAltRightIcon}}};x.defaultProps={position:"top",iconField:"svgIcon"};let k=x;const E=s.withIdHOC(a.forwardRef(((e,t)=>{const i=a.useContext(C).call(void 0,e);return a.createElement(k,{ref:t,...i})})));E.displayName="TreeViewItem";const F=Object.freeze({name:"@progress/kendo-react-treeview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.0.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),{sizeMap:y}=s.kendoThemeMaps,D=class extends a.Component{constructor(e){super(e),this.state={focusedItemId:void 0,focusedItemPublicId:void 0,tabbableItemId:s.treeIdUtils.ZERO_LEVEL_ZERO_NODE_ID},this.fieldsSvc=null,this.allowExplicitFocus=!1,this.showLicenseWatermark=!1,this._element=null,this.onFocusDomElNeeded=e=>{this.allowExplicitFocus&&this.focusDomItem(e)},this.onCheckChange=(e,t,i)=>{this.setFocus(i),this.dispatchCheckChange(e,t,i)},this.onExpandChange=(e,t,i)=>{this.setFocus(i),this.dispatchExpandChange(e,t,i)},this.onPress=(e,t,i)=>{this.props.onItemDragStart&&this.props.onItemDragStart.call(void 0,{target:this,item:t,itemHierarchicalIndex:i})},this.onDrag=(e,t,i)=>{const{pageX:s,pageY:n,clientX:r,clientY:d}=e;this.props.onItemDragOver&&this.props.onItemDragOver.call(void 0,{target:this,item:t,itemHierarchicalIndex:i,pageX:s,pageY:n,clientX:r,clientY:d})},this.onRelease=(e,t,i)=>{const{pageX:s,pageY:n,clientX:r,clientY:d}=e;this.props.onItemDragEnd&&this.props.onItemDragEnd.call(void 0,{target:this,item:t,itemHierarchicalIndex:i,pageX:s,pageY:n,clientX:r,clientY:d})},this.onItemClick=(e,t,i)=>{this.setFocus(i),this.dispatchItemClick(e,t,i)},this.onFocus=()=>{clearTimeout(this.blurRequest),void 0===this.state.focusedItemId&&this.data.length&&this.setFocus(this.state.tabbableItemId)},this.onBlur=()=>{clearTimeout(this.blurRequest),this.blurRequest=window.setTimeout((()=>this.setFocus(void 0)),0)},this.onKeyDown=e=>{const t=this.getFocusedItem();if(t&&this.fieldsSvc){const i=o(t,this.state.focusedItemId,this.data,e.keyCode,this.fieldsSvc);i!==this.state.focusedItemId&&(e.preventDefault(),this.allowExplicitFocus=!0,this.setFocus(i)),this.dispatchEventsOnKeyDown(e,t)}},this.onContextMenu=(e,t,i)=>{if(this.props.onContextMenu){const s={target:this,syntheticEvent:e,nativeEvent:e.nativeEvent,item:t,itemID:i};this.props.onContextMenu.call(void 0,s)}},this.showLicenseWatermark=!s.validatePackage(F,{component:"TreeView"}),this.licenseMessage=s.getLicenseMessage(F)}get treeGuid(){return this.props.id+"-accessibility-id"}get element(){return this._element}render(){this.fieldsSvc=new s.TreeFieldsService(this.props);const{size:e,className:t}=this.props;return a.createElement("div",{id:this.props.id,style:{position:"relative",...this.props.style},className:s.classNames("k-treeview",{[`k-treeview-${y[e]||e}`]:e,"k-user-select-none":this.props.draggable,"k-rtl":"rtl"===this.props.dir},t),onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,role:"tree","aria-multiselectable":!!this.ariaMultiSelectable||void 0,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],ref:e=>{this._element=e},tabIndex:this.props.tabIndex},a.createElement("ul",{className:"k-treeview-lines k-treeview-group",role:"group"},this.data.map(((t,i)=>a.createElement(E,{id:this.props.id+"-item-"+i,item:t,position:h(i,this.data),itemId:i.toString(),treeGuid:this.treeGuid,animate:this.props.animate,focusedItemId:this.state.focusedItemId,tabbableItemId:this.state.tabbableItemId,fieldsService:this.fieldsSvc,itemUI:this.props.item,checkboxes:this.props.checkboxes,ariaMultiSelectable:this.ariaMultiSelectable,onItemClick:this.onItemClick,onFocusDomElNeeded:this.onFocusDomElNeeded,draggable:this.props.draggable,onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease,expandIcons:this.props.expandIcons,iconField:this.props.iconField,onExpandChange:this.onExpandChange,onCheckChange:this.onCheckChange,onContextMenu:this.onContextMenu,key:i,size:e,isRtl:"rtl"===this.props.dir})))),this.showLicenseWatermark&&a.createElement(s.WatermarkOverlay,{message:this.licenseMessage}))}componentDidUpdate(){this.allowExplicitFocus=!1,this.refocusDueToFocusIdField()}dispatchEventsOnKeyDown(e,t){if(null===this.fieldsSvc)return;const i=()=>this.fieldsSvc&&s.isEnabledAndAllParentsEnabled(this.state.focusedItemId,this.data,this.fieldsSvc);e.keyCode===s.Keys.left&&this.fieldsSvc.expanded(t)&&i()||e.keyCode===s.Keys.right&&!this.fieldsSvc.expanded(t)&&(this.fieldsSvc.hasChildren(t)||s.hasChildren(t,this.props.childrenField))&&i()?this.dispatchExpandChange(e,t,this.state.focusedItemId):e.keyCode===s.Keys.enter&&i()?this.dispatchItemClick(e,t,this.state.focusedItemId):e.keyCode===s.Keys.space&&i()&&(e.preventDefault(),this.dispatchCheckChange(e,t,this.state.focusedItemId))}setFocus(e){if(e&&this.fieldsSvc)if(this.fieldsSvc.focusIdField){const t=this.getItemById(e);this.setState({focusedItemId:e,focusedItemPublicId:this.fieldsSvc.focusId(t)})}else this.setState({focusedItemId:e});else this.setState((e=>({focusedItemId:void 0,focusedItemPublicId:void 0,tabbableItemId:e.focusedItemId})))}getFocusedItem(){return this.state.focusedItemId?this.getItemById(this.state.focusedItemId):void 0}getItemById(e){return s.treeIdUtils.getItemById(e,this.data,this.props.childrenField||m)}dispatchCheckChange(e,t,i){s.dispatchEvent(this.props.onCheckChange,e,this,{item:t,itemHierarchicalIndex:i})}dispatchExpandChange(e,t,i){s.dispatchEvent(this.props.onExpandChange,e,this,{item:t,itemHierarchicalIndex:i})}dispatchItemClick(e,t,i){s.dispatchEvent(this.props.onItemClick,e,this,{item:t,itemHierarchicalIndex:i})}refocusDueToFocusIdField(){if(this.fieldsSvc&&this.fieldsSvc.focusIdField){const e=this.state.focusedItemPublicId;if(e){const t=this.props.getFocusHierarchicalIndex?this.props.getFocusHierarchicalIndex(e):s.resolveItemId(e,this.fieldsSvc.focusIdField,this.data,this.props.childrenField);t!==this.state.focusedItemId&&(this.allowExplicitFocus=!0,this.setState({focusedItemId:t}))}}}get ariaMultiSelectable(){return!0===this.props["aria-multiselectable"]||"true"===this.props["aria-multiselectable"]}get data(){return this.props.data||[]}focusDomItem(e){e.focus()}get guid(){return this.treeGuid}};D.propTypes={data:i.arrayOf(i.any),animate:i.bool,tabIndex:i.number,focusIdField:i.string,getHierarchicalIndexById:i.func,onExpandChange:i.func,onItemClick:i.func,expandField:i.string,selectField:i.string,iconField:i.string,childrenField:i.string,hasChildrenField:i.string,textField:i.string,disableField:i.string,item:i.any,"aria-multiselectable":(e,t,i)=>void 0!==e[t]&&!0!==e[t]&&!1!==e[t]&&"true"!==e[t]&&"false"!==e[t]?new Error("Invalid prop `"+t+"` supplied to `"+i+"`. Validation failed."):null,"aria-label":i.string,"aria-labelledby":i.string,size:i.oneOf([null,"small","medium","large"]),dir:i.string},D.defaultProps={animate:!0,expandField:p,selectField:u,iconField:"svgIcon",hasChildrenField:"hasChildren",childrenField:m,textField:"text",disableField:"disabled",checkField:I,checkIndeterminateField:g,size:"medium"};let S=D;function w(e,t,i,n,r){if(i){const{ids:d,field:a}=N(i,t);return function(e,t,i,n,r){let d=e;return t.forEach((e=>{d=s.updateItem(d,e,(e=>P(i,e)),n,r)})),d}(e,!s.isArray(i)&&i.idField?s.resolveItemsIds(d,i.idField,e,r):d,a,n,r)}return e}function N(e,t){let i,n;return s.isArray(e)?(i=e,n=t):(i=e.ids||[],n=e.operationField||t),{ids:i,field:n}}function P(e,t){const i=(e||"").split(".");let s=t;for(let e=0;e<i.length;e++){const t=i[e];if(e===i.length-1)s[t]=!0;else{if(void 0===s[t])return;s[t]={...s[t]},s=s[t]}}}function U(e,t,i,n,r){let d=!1;for(let a=0;a<e.length;a++){const o=e[a];if(s.getNestedValue(n,o)){if(!d)for(let e=0;e<t.length;e++)P(r,t[e]);d=!0,o[i]&&U(o[i],[],i,n,r)}else o[i]&&U(o[i],d?[o]:t.concat([o]),i,n,r)}}const M=class extends a.PureComponent{constructor(){super(...arguments),this.state={visible:!1,top:0,left:0,text:"",operationClassName:"cancel"}}render(){const e={top:this.state.top+"px",left:this.state.left+"px"};return this.state.visible&&a.createElement("div",{className:"k-header k-drag-clue",style:{...this.props.style,...e}},a.createElement(s.IconWrap,{className:s.classNames("k-drag-status"),name:this.state.operationClassName&&s.toIconName(this.state.operationClassName),icon:"k-i-plus"===this.state.operationClassName?n.plusIcon:"k-i-insert-up"===this.state.operationClassName?n.insertTopIcon:"k-i-insert-down"===this.state.operationClassName?n.insertBottomIcon:"k-i-insert-middle"===this.state.operationClassName?n.insertMiddleIcon:n.cancelIcon}),this.state.text)}show(e,t,i,s){this.setState({visible:!0,top:e,left:t,text:i,operationClassName:s})}hide(){this.setState({visible:!1})}};M.defaultProps={style:{display:"block",position:"absolute",zIndex:2e4,padding:"4px 6px"}};let R=M;const O=s.withIdHOC(S);O.displayName="KendoReactTreeView",Object.defineProperty(e,"FieldsService",{enumerable:!0,get:function(){return s.TreeFieldsService}}),e.TreeView=O,e.TreeViewClassComponent=S,e.TreeViewDragAnalyzer=class{constructor(e){this.event=e,this.initialized=!1,this.destItemId="",this.destTreeViewGuid="",this.itemId=e.itemHierarchicalIndex,this.treeViewGuid=e.target.guid}init(){return this.initialized||(this.setDestimationMeta(document.elementFromPoint(this.event.clientX,this.event.clientY)),this.initialized=!0),this}get isDropAllowed(){return!!(this.initialized&&this.destItemId&&this.destTreeViewGuid)&&!`${this.destTreeViewGuid}_${this.destItemId}_`.startsWith(`${this.treeViewGuid}_${this.itemId}_`)}get destinationMeta(){return{itemHierarchicalIndex:this.destItemId,treeViewGuid:this.destTreeViewGuid}}getDropOperation(){if(this.initialized&&this.isDropAllowed){const{top:e,height:t}=this.destDomNodeWithMeta.getBoundingClientRect();return e+t-this.event.clientY<6?"after":this.event.clientY-e<6?"before":"child"}}setDestimationMeta(e){let t=e;for(;t&&!t[f];)t=t.parentNode;t&&t[f]&&(this.destDomNodeWithMeta=t,this.destItemId=t[f],this.destTreeViewGuid=t[b])}},e.TreeViewDragClue=R,e.TreeViewItemPropsContext=C,e.getItemIdUponKeyboardNavigation=o,e.handleTreeViewCheckChange=function(e,t,i,n={},r){if(!i||!i.length)return[];const{ids:d,idField:a}=function(e){let t,i;return s.isArray(e)?t=e:(t=e.ids||[],i=e.idField),{ids:t,idField:i}}(t),o=a?s.getNestedValue(a,e.item):e.itemHierarchicalIndex,l=d.indexOf(o),c=-1===l,h=r||m;let p;return n.singleMode?p=c?[o]:[]:(p=d.slice(),c?p.push(o):p.splice(l,1),n.checkChildren&&function(e,t,i,n,r,d){s.getAllDirectIndirectChildrenIds(e,t,r,n).forEach((e=>{i&&-1===d.indexOf(e)?d.push(e):!i&&d.indexOf(e)>-1&&d.splice(d.indexOf(e),1)}))}(e.item,e.itemHierarchicalIndex,c,a,h,p),n.checkParents&&function(e,t,i,n,r,d){const a=h();let o=a.next();function l(){for(;!o.done;){const{id:e,item:t}=o.value;if(-1!==r.indexOf(e)||!s.areAllDirectChildrenChecked(t,e,i,n,r))break;r.push(e),o=a.next()}}function c(){for(;!o.done;){const{id:e}=o.value,t=r.indexOf(e);if(!(t>-1))break;r.splice(t,1),o=a.next()}}function*h(){if(i){const r=s.getAllParents(e,n,d);for(let e=r.length-1;e>-1;e--)yield{id:s.getNestedValue(i,r[e]),item:t?r[e]:void 0}}else{let i=s.treeIdUtils.getDirectParentId(e);for(;i;)yield{id:i,item:t?s.treeIdUtils.getItemById(i,d,n):void 0},i=s.treeIdUtils.getDirectParentId(i)}}t?l():c()}(e.itemHierarchicalIndex,c,a,h,p,i)),s.isArray(t)?p:Object.assign({},t,{ids:p})},e.moveTreeViewItem=function(e,t,i,n,r,d){const a=d||m;if(!function(){if(!t||!t.length||!e||!n||r&&!r.length)return!1;const i=r&&r!==t?r:t;return!!s.treeIdUtils.getItemById(n,i,a)}())return l();const o=s.treeIdUtils.getItemById(e,t,a);if(!o)return l();if(!r||r===t){if(`${n}_`.startsWith(`${e}_`))return l();const d=s.removeItem(e,a,t),c=s.addItem(o,i,a,s.treeIdUtils.getDecrementedItemIdAfterRemoval(e,n),d);return r?{sourceData:c,targetData:c}:c}return{sourceData:s.removeItem(e,a,t),targetData:s.addItem(o,i,a,n,r)};function l(){return r?{sourceData:t,targetData:r}:t}},e.processTreeViewItems=function(e,t){if(!e||!e.length)return[];let i=e;const n=t.cloneField||"cloned",r=t.expandField||p,d=t.selectField||u,a=t.checkField||I,o=t.childrenField||m;return i=w(i,r,t.expand,n,o),i=w(i,d,t.select,n,o),i=w(i,a,t.check,n,o),function(e,t,i){if(i&&!s.isArray(i)&&i.applyCheckIndeterminate){const{field:n}=N(i,I),r=i.checkIndeterminateField||g;for(let i=0;i<e.length;i++){const d=e[i],a=d[t];a&&U(a,s.getNestedValue(n,d)?[]:[d],t,n,r)}}}(i,o,t.check),i}}));
|
|
15
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-animation")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-svg-icons","@progress/kendo-react-animation"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactTreeview={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoSvgIcons,e.KendoReactAnimation)}(this,(function(e,t,i,s,n,r){"use strict";function d(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(i){if("default"!==i){var s=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:function(){return e[i]}})}})),t.default=e,Object.freeze(t)}var a=d(t);function o(e,t,i,n,r){switch(n){case s.Keys.left:return s.treeIdUtils.isIdZeroLevel(t)||r.expanded(e)&&s.isEnabledAndAllParentsEnabled(t,i,r)?t:s.treeIdUtils.getDirectParentId(t);case s.Keys.right:return s.isItemExpandedAndWithChildren(e,r)?s.treeIdUtils.getFirstChildId(t):t;case s.Keys.up:return function(){const e=Number(s.treeIdUtils.getShortId(t)),n=s.treeIdUtils.getDirectParentId(t);return e?c(s.treeIdUtils.createId(e-1,n),i,r):s.treeIdUtils.isIdZeroLevel(t)?t:n}();case s.Keys.down:return s.isItemExpandedAndWithChildren(e,r)?s.treeIdUtils.getFirstChildId(t):l(t,i,r)||t;case s.Keys.home:return s.treeIdUtils.ZERO_LEVEL_ZERO_NODE_ID;case s.Keys.end:return function(){let e,t=(i.length-1).toString(),n=i[i.length-1];for(;s.isItemExpandedAndWithChildren(n,r);)e=n[r.getChildrenField()],t=s.treeIdUtils.createId(e.length-1,t),n=e[e.length-1];return t}();default:return t}}function l(e,t,i){const n=s.treeIdUtils.getDirectParentId(e),r=n?s.treeIdUtils.getItemById(n,t,i.getChildrenField()):void 0,d=r?r[i.getChildrenField()]:t,a=Number(s.treeIdUtils.getShortId(e));return a<d.length-1?s.treeIdUtils.createId(a+1,n):r?l(n,t,i):void 0}function c(e,t,i){const n=s.treeIdUtils.getItemById(e,t,i.getChildrenField());return s.isItemExpandedAndWithChildren(n,i)?c(s.treeIdUtils.createId(n[i.getChildrenField()].length-1,e),t,i):e}const h=(e,t)=>{const i=((e,t)=>e===t.length-1)(e,t);return 0!==e||i?i?"bot":"mid":"top"},p="expanded",m="items",u="selected",I="checked",g="checkIndeterminate",f="_kendoItemId",b="_kendoTreeViewGuid",{sizeMap:v}=s.kendoThemeMaps,C=a.createContext((e=>e)),x=class extends a.Component{constructor(){super(...arguments),this.onCheckChange=e=>{this.props.onCheckChange(e,this.item,this.itemId)},this.onExpandChange=e=>{this.props.onExpandChange(e,this.item,this.itemId)},this.onItemClick=e=>{this.props.onItemClick(e,this.item,this.itemId)},this.onPress=e=>{this.props.onPress(e.event,this.item,this.itemId)},this.onDrag=e=>{this.props.onDrag(e.event,this.item,this.itemId)},this.onRelease=e=>{this.props.onRelease(e.event,this.item,this.itemId)},this.onContextMenu=e=>{this.props.onContextMenu(e,this.item,this.itemId)},this.assignDraggableMeta=e=>{e&&(e[f]=this.props.itemId,e[b]=this.props.treeGuid)}}render(){const e=this.renderSubitemsIfApplicable(),t=this.renderItemInPart();return a.createElement("li",{className:s.classNames("k-treeview-item"),tabIndex:this.tabIndex,role:"treeitem","aria-expanded":this.ariaExpanded,"aria-selected":this.ariaSelected,"aria-checked":this.ariaChecked,"aria-disabled":!!this.disabled||void 0,ref:e=>{this.itemElement=e}},a.createElement("span",{className:`k-treeview-${this.props.position}`,ref:this.assignDraggableMeta},this.renderExpandIcon(),this.renderCheckbox(),this.props.draggable?a.createElement(s.Draggable,{onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease},t):t),e&&(this.props.animate?a.createElement(r.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,style:{display:"block"},children:e}):e))}componentDidMount(){const e=this.props.focusedItemId,t=this.itemId;e&&e===t&&this.props.onFocusDomElNeeded(this.itemElement),this.checkboxElement&&(this.checkboxElement.indeterminate=this.fieldsSvc.checkIndeterminate(this.item))}componentDidUpdate(e){const t=this.props.focusedItemId;if(t&&t!==e.focusedItemId&&t===this.itemId&&this.props.onFocusDomElNeeded(this.itemElement),this.checkboxElement){const e=this.fieldsSvc.checkIndeterminate(this.item);this.checkboxElement.indeterminate!==e&&(this.checkboxElement.indeterminate=e)}}renderCheckbox(){if(this.props.checkboxes){const e=this.props.size;return a.createElement("span",{className:s.classNames("k-checkbox-wrap")},a.createElement("input",{type:"checkbox",className:s.classNames("k-checkbox k-rounded-md",{[`k-checkbox-${v[e]||e}`]:e,"k-disabled":this.disabled}),"aria-label":this.item.text,checked:!!this.fieldsSvc.checked(this.item),id:this.props.id,tabIndex:-1,onChange:this.onCheckChange,ref:e=>{this.checkboxElement=e}}))}}renderExpandIcon(){return this.props.expandIcons&&(this.fieldsSvc.hasChildren(this.item)||s.hasChildren(this.item,this.fieldsSvc.getChildrenField()))&&a.createElement("span",{className:s.classNames("k-treeview-toggle",{"k-disabled":this.disabled}),onClick:this.onExpandChange},a.createElement(s.IconWrap,{...this.getIconProps()}))}renderSubitemsIfApplicable(){const e=this.fieldsSvc.children(this.item);return s.isItemExpandedAndWithChildren(this.item,this.fieldsSvc)?a.createElement("ul",{className:"k-treeview-group",role:"group"},e.map(((t,i)=>a.createElement(E,{item:t,position:h(i,e),itemId:s.treeIdUtils.createId(i,this.itemId),treeGuid:this.props.treeGuid,animate:this.props.animate,focusedItemId:this.props.focusedItemId,tabbableItemId:this.props.tabbableItemId,fieldsService:this.props.fieldsService,itemUI:this.props.itemUI,checkboxes:this.props.checkboxes,ariaMultiSelectable:this.props.ariaMultiSelectable,onItemClick:this.props.onItemClick,onFocusDomElNeeded:this.props.onFocusDomElNeeded,draggable:this.props.draggable,onPress:this.props.onPress,onDrag:this.props.onDrag,onRelease:this.props.onRelease,expandIcons:this.props.expandIcons,iconField:this.props.iconField,onExpandChange:this.props.onExpandChange,onCheckChange:this.props.onCheckChange,onContextMenu:this.props.onContextMenu,key:i,size:this.props.size,disabled:this.disabled,isRtl:this.props.isRtl})))):void 0}renderItemInPart(){const e=this.props.iconField,t=e&&this.item[e];return a.createElement("span",{className:s.classNames("k-treeview-leaf",{"k-focus":this.props.focusedItemId===this.itemId,"k-selected":this.fieldsSvc.selected(this.item),"k-disabled":this.disabled,"k-touch-action-none":this.props.draggable}),onClick:this.onItemClick,onContextMenu:this.onContextMenu},t&&a.createElement(s.IconWrap,{name:t.name,icon:t}),a.createElement("span",{className:"k-treeview-leaf-text"},this.props.itemUI?a.createElement(this.props.itemUI,{item:this.item,itemHierarchicalIndex:this.itemId}):this.fieldsSvc.text(this.item)))}get fieldsSvc(){return this.props.fieldsService}get itemId(){return this.props.itemId}get item(){return this.props.item}get tabIndex(){return(this.props.focusedItemId||this.props.tabbableItemId)===this.itemId?0:-1}get ariaExpanded(){return this.fieldsSvc.hasChildren(this.item)||s.hasChildren(this.item,this.fieldsSvc.getChildrenField())?!!this.fieldsSvc.expanded(this.item):void 0}get disabled(){return this.props.disabled||this.fieldsSvc.disabled(this.item)}get ariaChecked(){if(this.props.checkboxes)return this.fieldsSvc.checked(this.item)?"true":this.fieldsSvc.checkIndeterminate(this.item)?"mixed":"false"}get ariaSelected(){return!!this.fieldsSvc.selected(this.item)||(this.props.ariaMultiSelectable?!!this.disabled&&void 0:void 0)}getIconProps(){const e=this.fieldsSvc.expanded(this.item);return e&&!s.hasChildren(this.item,this.fieldsSvc.getChildrenField())?{name:"loading"}:e?{name:"caret-alt-down",icon:n.caretAltDownIcon}:{name:this.props.isRtl?"caret-alt-left":"caret-alt-right",icon:this.props.isRtl?n.caretAltLeftIcon:n.caretAltRightIcon}}};x.defaultProps={position:"top",iconField:"svgIcon"};let k=x;const E=s.withIdHOC(a.forwardRef(((e,t)=>{const i=a.useContext(C).call(void 0,e);return a.createElement(k,{ref:t,...i})})));E.displayName="TreeViewItem";const F=Object.freeze({name:"@progress/kendo-react-treeview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.0.2-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),{sizeMap:y}=s.kendoThemeMaps,D=class extends a.Component{constructor(e){super(e),this.state={focusedItemId:void 0,focusedItemPublicId:void 0,tabbableItemId:s.treeIdUtils.ZERO_LEVEL_ZERO_NODE_ID},this.fieldsSvc=null,this.allowExplicitFocus=!1,this.showLicenseWatermark=!1,this._element=null,this.onFocusDomElNeeded=e=>{this.allowExplicitFocus&&this.focusDomItem(e)},this.onCheckChange=(e,t,i)=>{this.setFocus(i),this.dispatchCheckChange(e,t,i)},this.onExpandChange=(e,t,i)=>{this.setFocus(i),this.dispatchExpandChange(e,t,i)},this.onPress=(e,t,i)=>{this.props.onItemDragStart&&this.props.onItemDragStart.call(void 0,{target:this,item:t,itemHierarchicalIndex:i})},this.onDrag=(e,t,i)=>{const{pageX:s,pageY:n,clientX:r,clientY:d}=e;this.props.onItemDragOver&&this.props.onItemDragOver.call(void 0,{target:this,item:t,itemHierarchicalIndex:i,pageX:s,pageY:n,clientX:r,clientY:d})},this.onRelease=(e,t,i)=>{const{pageX:s,pageY:n,clientX:r,clientY:d}=e;this.props.onItemDragEnd&&this.props.onItemDragEnd.call(void 0,{target:this,item:t,itemHierarchicalIndex:i,pageX:s,pageY:n,clientX:r,clientY:d})},this.onItemClick=(e,t,i)=>{this.setFocus(i),this.dispatchItemClick(e,t,i)},this.onFocus=()=>{clearTimeout(this.blurRequest),void 0===this.state.focusedItemId&&this.data.length&&this.setFocus(this.state.tabbableItemId)},this.onBlur=()=>{clearTimeout(this.blurRequest),this.blurRequest=window.setTimeout((()=>this.setFocus(void 0)),0)},this.onKeyDown=e=>{const t=this.getFocusedItem();if(t&&this.fieldsSvc){const i=o(t,this.state.focusedItemId,this.data,e.keyCode,this.fieldsSvc);i!==this.state.focusedItemId&&(e.preventDefault(),this.allowExplicitFocus=!0,this.setFocus(i)),this.dispatchEventsOnKeyDown(e,t)}},this.onContextMenu=(e,t,i)=>{if(this.props.onContextMenu){const s={target:this,syntheticEvent:e,nativeEvent:e.nativeEvent,item:t,itemID:i};this.props.onContextMenu.call(void 0,s)}},this.showLicenseWatermark=!s.validatePackage(F,{component:"TreeView"}),this.licenseMessage=s.getLicenseMessage(F)}get treeGuid(){return this.props.id+"-accessibility-id"}get element(){return this._element}render(){this.fieldsSvc=new s.TreeFieldsService(this.props);const{size:e,className:t}=this.props;return a.createElement("div",{id:this.props.id,style:{position:"relative",...this.props.style},className:s.classNames("k-treeview",{[`k-treeview-${y[e]||e}`]:e,"k-user-select-none":this.props.draggable,"k-rtl":"rtl"===this.props.dir},t),onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,role:"tree","aria-multiselectable":!!this.ariaMultiSelectable||void 0,"aria-label":this.props["aria-label"],"aria-labelledby":this.props["aria-labelledby"],ref:e=>{this._element=e},tabIndex:this.props.tabIndex},a.createElement("ul",{className:"k-treeview-lines k-treeview-group",role:"group"},this.data.map(((t,i)=>a.createElement(E,{id:this.props.id+"-item-"+i,item:t,position:h(i,this.data),itemId:i.toString(),treeGuid:this.treeGuid,animate:this.props.animate,focusedItemId:this.state.focusedItemId,tabbableItemId:this.state.tabbableItemId,fieldsService:this.fieldsSvc,itemUI:this.props.item,checkboxes:this.props.checkboxes,ariaMultiSelectable:this.ariaMultiSelectable,onItemClick:this.onItemClick,onFocusDomElNeeded:this.onFocusDomElNeeded,draggable:this.props.draggable,onPress:this.onPress,onDrag:this.onDrag,onRelease:this.onRelease,expandIcons:this.props.expandIcons,iconField:this.props.iconField,onExpandChange:this.onExpandChange,onCheckChange:this.onCheckChange,onContextMenu:this.onContextMenu,key:i,size:e,isRtl:"rtl"===this.props.dir})))),this.showLicenseWatermark&&a.createElement(s.WatermarkOverlay,{message:this.licenseMessage}))}componentDidUpdate(){this.allowExplicitFocus=!1,this.refocusDueToFocusIdField()}dispatchEventsOnKeyDown(e,t){if(null===this.fieldsSvc)return;const i=()=>this.fieldsSvc&&s.isEnabledAndAllParentsEnabled(this.state.focusedItemId,this.data,this.fieldsSvc);e.keyCode===s.Keys.left&&this.fieldsSvc.expanded(t)&&i()||e.keyCode===s.Keys.right&&!this.fieldsSvc.expanded(t)&&(this.fieldsSvc.hasChildren(t)||s.hasChildren(t,this.props.childrenField))&&i()?this.dispatchExpandChange(e,t,this.state.focusedItemId):e.keyCode===s.Keys.enter&&i()?this.dispatchItemClick(e,t,this.state.focusedItemId):e.keyCode===s.Keys.space&&i()&&(e.preventDefault(),this.dispatchCheckChange(e,t,this.state.focusedItemId))}setFocus(e){if(e&&this.fieldsSvc)if(this.fieldsSvc.focusIdField){const t=this.getItemById(e);this.setState({focusedItemId:e,focusedItemPublicId:this.fieldsSvc.focusId(t)})}else this.setState({focusedItemId:e});else this.setState((e=>({focusedItemId:void 0,focusedItemPublicId:void 0,tabbableItemId:e.focusedItemId})))}getFocusedItem(){return this.state.focusedItemId?this.getItemById(this.state.focusedItemId):void 0}getItemById(e){return s.treeIdUtils.getItemById(e,this.data,this.props.childrenField||m)}dispatchCheckChange(e,t,i){s.dispatchEvent(this.props.onCheckChange,e,this,{item:t,itemHierarchicalIndex:i})}dispatchExpandChange(e,t,i){s.dispatchEvent(this.props.onExpandChange,e,this,{item:t,itemHierarchicalIndex:i})}dispatchItemClick(e,t,i){s.dispatchEvent(this.props.onItemClick,e,this,{item:t,itemHierarchicalIndex:i})}refocusDueToFocusIdField(){if(this.fieldsSvc&&this.fieldsSvc.focusIdField){const e=this.state.focusedItemPublicId;if(e){const t=this.props.getFocusHierarchicalIndex?this.props.getFocusHierarchicalIndex(e):s.resolveItemId(e,this.fieldsSvc.focusIdField,this.data,this.props.childrenField);t!==this.state.focusedItemId&&(this.allowExplicitFocus=!0,this.setState({focusedItemId:t}))}}}get ariaMultiSelectable(){return!0===this.props["aria-multiselectable"]||"true"===this.props["aria-multiselectable"]}get data(){return this.props.data||[]}focusDomItem(e){e.focus()}get guid(){return this.treeGuid}};D.propTypes={data:i.arrayOf(i.any),animate:i.bool,tabIndex:i.number,focusIdField:i.string,getHierarchicalIndexById:i.func,onExpandChange:i.func,onItemClick:i.func,expandField:i.string,selectField:i.string,iconField:i.string,childrenField:i.string,hasChildrenField:i.string,textField:i.string,disableField:i.string,item:i.any,"aria-multiselectable":(e,t,i)=>void 0!==e[t]&&!0!==e[t]&&!1!==e[t]&&"true"!==e[t]&&"false"!==e[t]?new Error("Invalid prop `"+t+"` supplied to `"+i+"`. Validation failed."):null,"aria-label":i.string,"aria-labelledby":i.string,size:i.oneOf([null,"small","medium","large"]),dir:i.string},D.defaultProps={animate:!0,expandField:p,selectField:u,iconField:"svgIcon",hasChildrenField:"hasChildren",childrenField:m,textField:"text",disableField:"disabled",checkField:I,checkIndeterminateField:g,size:"medium"};let S=D;function w(e,t,i,n,r){if(i){const{ids:d,field:a}=N(i,t);return function(e,t,i,n,r){let d=e;return t.forEach((e=>{d=s.updateItem(d,e,(e=>P(i,e)),n,r)})),d}(e,!s.isArray(i)&&i.idField?s.resolveItemsIds(d,i.idField,e,r):d,a,n,r)}return e}function N(e,t){let i,n;return s.isArray(e)?(i=e,n=t):(i=e.ids||[],n=e.operationField||t),{ids:i,field:n}}function P(e,t){const i=(e||"").split(".");let s=t;for(let e=0;e<i.length;e++){const t=i[e];if(e===i.length-1)s[t]=!0;else{if(void 0===s[t])return;s[t]={...s[t]},s=s[t]}}}function U(e,t,i,n,r){let d=!1;for(let a=0;a<e.length;a++){const o=e[a];if(s.getNestedValue(n,o)){if(!d)for(let e=0;e<t.length;e++)P(r,t[e]);d=!0,o[i]&&U(o[i],[],i,n,r)}else o[i]&&U(o[i],d?[o]:t.concat([o]),i,n,r)}}const M=class extends a.PureComponent{constructor(){super(...arguments),this.state={visible:!1,top:0,left:0,text:"",operationClassName:"cancel"}}render(){const e={top:this.state.top+"px",left:this.state.left+"px"};return this.state.visible&&a.createElement("div",{className:"k-header k-drag-clue",style:{...this.props.style,...e}},a.createElement(s.IconWrap,{className:s.classNames("k-drag-status"),name:this.state.operationClassName&&s.toIconName(this.state.operationClassName),icon:"k-i-plus"===this.state.operationClassName?n.plusIcon:"k-i-insert-up"===this.state.operationClassName?n.insertTopIcon:"k-i-insert-down"===this.state.operationClassName?n.insertBottomIcon:"k-i-insert-middle"===this.state.operationClassName?n.insertMiddleIcon:n.cancelIcon}),this.state.text)}show(e,t,i,s){this.setState({visible:!0,top:e,left:t,text:i,operationClassName:s})}hide(){this.setState({visible:!1})}};M.defaultProps={style:{display:"block",position:"absolute",zIndex:2e4,padding:"4px 6px"}};let R=M;const O=s.withIdHOC(S);O.displayName="KendoReactTreeView",Object.defineProperty(e,"FieldsService",{enumerable:!0,get:function(){return s.TreeFieldsService}}),e.TreeView=O,e.TreeViewClassComponent=S,e.TreeViewDragAnalyzer=class{constructor(e){this.event=e,this.initialized=!1,this.destItemId="",this.destTreeViewGuid="",this.itemId=e.itemHierarchicalIndex,this.treeViewGuid=e.target.guid}init(){return this.initialized||(this.setDestimationMeta(document.elementFromPoint(this.event.clientX,this.event.clientY)),this.initialized=!0),this}get isDropAllowed(){return!!(this.initialized&&this.destItemId&&this.destTreeViewGuid)&&!`${this.destTreeViewGuid}_${this.destItemId}_`.startsWith(`${this.treeViewGuid}_${this.itemId}_`)}get destinationMeta(){return{itemHierarchicalIndex:this.destItemId,treeViewGuid:this.destTreeViewGuid}}getDropOperation(){if(this.initialized&&this.isDropAllowed){const{top:e,height:t}=this.destDomNodeWithMeta.getBoundingClientRect();return e+t-this.event.clientY<6?"after":this.event.clientY-e<6?"before":"child"}}setDestimationMeta(e){let t=e;for(;t&&!t[f];)t=t.parentNode;t&&t[f]&&(this.destDomNodeWithMeta=t,this.destItemId=t[f],this.destTreeViewGuid=t[b])}},e.TreeViewDragClue=R,e.TreeViewItemPropsContext=C,e.getItemIdUponKeyboardNavigation=o,e.handleTreeViewCheckChange=function(e,t,i,n={},r){if(!i||!i.length)return[];const{ids:d,idField:a}=function(e){let t,i;return s.isArray(e)?t=e:(t=e.ids||[],i=e.idField),{ids:t,idField:i}}(t),o=a?s.getNestedValue(a,e.item):e.itemHierarchicalIndex,l=d.indexOf(o),c=-1===l,h=r||m;let p;return n.singleMode?p=c?[o]:[]:(p=d.slice(),c?p.push(o):p.splice(l,1),n.checkChildren&&function(e,t,i,n,r,d){s.getAllDirectIndirectChildrenIds(e,t,r,n).forEach((e=>{i&&-1===d.indexOf(e)?d.push(e):!i&&d.indexOf(e)>-1&&d.splice(d.indexOf(e),1)}))}(e.item,e.itemHierarchicalIndex,c,a,h,p),n.checkParents&&function(e,t,i,n,r,d){const a=h();let o=a.next();function l(){for(;!o.done;){const{id:e,item:t}=o.value;if(-1!==r.indexOf(e)||!s.areAllDirectChildrenChecked(t,e,i,n,r))break;r.push(e),o=a.next()}}function c(){for(;!o.done;){const{id:e}=o.value,t=r.indexOf(e);if(!(t>-1))break;r.splice(t,1),o=a.next()}}function*h(){if(i){const r=s.getAllParents(e,n,d);for(let e=r.length-1;e>-1;e--)yield{id:s.getNestedValue(i,r[e]),item:t?r[e]:void 0}}else{let i=s.treeIdUtils.getDirectParentId(e);for(;i;)yield{id:i,item:t?s.treeIdUtils.getItemById(i,d,n):void 0},i=s.treeIdUtils.getDirectParentId(i)}}t?l():c()}(e.itemHierarchicalIndex,c,a,h,p,i)),s.isArray(t)?p:Object.assign({},t,{ids:p})},e.moveTreeViewItem=function(e,t,i,n,r,d){const a=d||m;if(!function(){if(!t||!t.length||!e||!n||r&&!r.length)return!1;const i=r&&r!==t?r:t;return!!s.treeIdUtils.getItemById(n,i,a)}())return l();const o=s.treeIdUtils.getItemById(e,t,a);if(!o)return l();if(!r||r===t){if(`${n}_`.startsWith(`${e}_`))return l();const d=s.removeItem(e,a,t),c=s.addItem(o,i,a,s.treeIdUtils.getDecrementedItemIdAfterRemoval(e,n),d);return r?{sourceData:c,targetData:c}:c}return{sourceData:s.removeItem(e,a,t),targetData:s.addItem(o,i,a,n,r)};function l(){return r?{sourceData:t,targetData:r}:t}},e.processTreeViewItems=function(e,t){if(!e||!e.length)return[];let i=e;const n=t.cloneField||"cloned",r=t.expandField||p,d=t.selectField||u,a=t.checkField||I,o=t.childrenField||m;return i=w(i,r,t.expand,n,o),i=w(i,d,t.select,n,o),i=w(i,a,t.check,n,o),function(e,t,i){if(i&&!s.isArray(i)&&i.applyCheckIndeterminate){const{field:n}=N(i,I),r=i.checkIndeterminateField||g;for(let i=0;i<e.length;i++){const d=e[i],a=d[t];a&&U(a,s.getNestedValue(n,d)?[]:[d],t,n,r)}}}(i,o,t.check),i}}));
|
package/index.d.mts
CHANGED
|
@@ -1016,7 +1016,9 @@ export declare interface TreeViewProps {
|
|
|
1016
1016
|
/**
|
|
1017
1017
|
* Enables or disables the expand and collapse animations.
|
|
1018
1018
|
*
|
|
1019
|
-
*
|
|
1019
|
+
* @default true
|
|
1020
|
+
*
|
|
1021
|
+
* @example
|
|
1020
1022
|
* ```jsx
|
|
1021
1023
|
* <TreeView animate={false} />
|
|
1022
1024
|
* ```
|
|
@@ -1081,36 +1083,44 @@ export declare interface TreeViewProps {
|
|
|
1081
1083
|
*/
|
|
1082
1084
|
onItemClick?: (event: events.TreeViewItemClickEvent) => void;
|
|
1083
1085
|
/**
|
|
1084
|
-
* Specifies the name of the field which will provide a Boolean representation for the expanded state of the item.
|
|
1086
|
+
* Specifies the name of the field which will provide a Boolean representation for the expanded state of the item.
|
|
1085
1087
|
*
|
|
1086
|
-
*
|
|
1088
|
+
* @default "expanded"
|
|
1089
|
+
*
|
|
1090
|
+
* @example
|
|
1087
1091
|
* ```jsx
|
|
1088
1092
|
* <TreeView expandField="isExpanded" />
|
|
1089
1093
|
* ```
|
|
1090
1094
|
*/
|
|
1091
1095
|
expandField?: string;
|
|
1092
1096
|
/**
|
|
1093
|
-
* Specifies the name of the field which will provide a Boolean representation for the selected state of the item.
|
|
1097
|
+
* Specifies the name of the field which will provide a Boolean representation for the selected state of the item.
|
|
1094
1098
|
*
|
|
1095
|
-
*
|
|
1099
|
+
* @default "selected"
|
|
1100
|
+
*
|
|
1101
|
+
* @example
|
|
1096
1102
|
* ```jsx
|
|
1097
1103
|
* <TreeView selectField="isSelected" />
|
|
1098
1104
|
* ```
|
|
1099
1105
|
*/
|
|
1100
1106
|
selectField?: string;
|
|
1101
1107
|
/**
|
|
1102
|
-
* Specifies the name of the field which will provide an icon for the specific TreeView item.
|
|
1108
|
+
* Specifies the name of the field which will provide an icon for the specific TreeView item.
|
|
1103
1109
|
*
|
|
1104
|
-
*
|
|
1110
|
+
* @default "svgIcon"
|
|
1111
|
+
*
|
|
1112
|
+
* @example
|
|
1105
1113
|
* ```jsx
|
|
1106
1114
|
* <TreeView iconField="icon" />
|
|
1107
1115
|
* ```
|
|
1108
1116
|
*/
|
|
1109
1117
|
iconField?: string;
|
|
1110
1118
|
/**
|
|
1111
|
-
* Specifies the name of the field which indicates to the TreeView that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature ([see example]({% slug databinding_treeview %}#toc-loading-data-on-demand)).
|
|
1119
|
+
* Specifies the name of the field which indicates to the TreeView that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature ([see example]({% slug databinding_treeview %}#toc-loading-data-on-demand)).
|
|
1112
1120
|
*
|
|
1113
|
-
*
|
|
1121
|
+
* @default "hasChildren"
|
|
1122
|
+
*
|
|
1123
|
+
* @example
|
|
1114
1124
|
* ```jsx
|
|
1115
1125
|
* <TreeView hasChildrenField="hasSubItems" />
|
|
1116
1126
|
* ```
|
|
@@ -1119,25 +1129,31 @@ export declare interface TreeViewProps {
|
|
|
1119
1129
|
/**
|
|
1120
1130
|
* Specifies the name of the field which will provide an array representation of the item children.
|
|
1121
1131
|
*
|
|
1122
|
-
*
|
|
1132
|
+
* @default "items"
|
|
1133
|
+
*
|
|
1134
|
+
* @example
|
|
1123
1135
|
* ```jsx
|
|
1124
1136
|
* <TreeView childrenField="subItems" />
|
|
1125
1137
|
* ```
|
|
1126
1138
|
*/
|
|
1127
1139
|
childrenField?: string;
|
|
1128
1140
|
/**
|
|
1129
|
-
* Specifies the name of the field which will provide a text representation for the item.
|
|
1141
|
+
* Specifies the name of the field which will provide a text representation for the item.
|
|
1130
1142
|
*
|
|
1131
|
-
*
|
|
1143
|
+
* @default "text"
|
|
1144
|
+
*
|
|
1145
|
+
* @example
|
|
1132
1146
|
* ```jsx
|
|
1133
1147
|
* <TreeView textField="label" />
|
|
1134
1148
|
* ```
|
|
1135
1149
|
*/
|
|
1136
1150
|
textField?: string;
|
|
1137
1151
|
/**
|
|
1138
|
-
* Specifies the name of the field which will provide a Boolean representation for the disabled state of the item.
|
|
1152
|
+
* Specifies the name of the field which will provide a Boolean representation for the disabled state of the item.
|
|
1139
1153
|
*
|
|
1140
|
-
*
|
|
1154
|
+
* @default "disabled"
|
|
1155
|
+
*
|
|
1156
|
+
* @example
|
|
1141
1157
|
* ```jsx
|
|
1142
1158
|
* <TreeView disableField="isDisabled" />
|
|
1143
1159
|
* ```
|
|
@@ -1191,18 +1207,22 @@ export declare interface TreeViewProps {
|
|
|
1191
1207
|
*/
|
|
1192
1208
|
checkboxes?: boolean;
|
|
1193
1209
|
/**
|
|
1194
|
-
* Specifies the name of the field which will provide a Boolean representation for the checked state of the item.
|
|
1210
|
+
* Specifies the name of the field which will provide a Boolean representation for the checked state of the item.
|
|
1195
1211
|
*
|
|
1196
|
-
*
|
|
1212
|
+
* @default "checked"
|
|
1213
|
+
*
|
|
1214
|
+
* @example
|
|
1197
1215
|
* ```jsx
|
|
1198
1216
|
* <TreeView checkField="isChecked" />
|
|
1199
1217
|
* ```
|
|
1200
1218
|
*/
|
|
1201
1219
|
checkField?: string;
|
|
1202
1220
|
/**
|
|
1203
|
-
* Specifies the name of the field which will provide a Boolean representation for the check indeterminate state of the item.
|
|
1221
|
+
* Specifies the name of the field which will provide a Boolean representation for the check indeterminate state of the item.
|
|
1204
1222
|
*
|
|
1205
|
-
*
|
|
1223
|
+
* @default "checkIndeterminate"
|
|
1224
|
+
*
|
|
1225
|
+
* @example
|
|
1206
1226
|
* ```jsx
|
|
1207
1227
|
* <TreeView checkIndeterminateField="isPartiallyChecked" />
|
|
1208
1228
|
* ```
|
|
@@ -1257,9 +1277,9 @@ export declare interface TreeViewProps {
|
|
|
1257
1277
|
* - large
|
|
1258
1278
|
* - null—Does not set a size `className`.
|
|
1259
1279
|
*
|
|
1260
|
-
* @default
|
|
1280
|
+
* @default "medium"
|
|
1261
1281
|
*
|
|
1262
|
-
*
|
|
1282
|
+
* @example
|
|
1263
1283
|
* ```jsx
|
|
1264
1284
|
* <TreeView size="large" />
|
|
1265
1285
|
* ```
|
package/index.d.ts
CHANGED
|
@@ -1016,7 +1016,9 @@ export declare interface TreeViewProps {
|
|
|
1016
1016
|
/**
|
|
1017
1017
|
* Enables or disables the expand and collapse animations.
|
|
1018
1018
|
*
|
|
1019
|
-
*
|
|
1019
|
+
* @default true
|
|
1020
|
+
*
|
|
1021
|
+
* @example
|
|
1020
1022
|
* ```jsx
|
|
1021
1023
|
* <TreeView animate={false} />
|
|
1022
1024
|
* ```
|
|
@@ -1081,36 +1083,44 @@ export declare interface TreeViewProps {
|
|
|
1081
1083
|
*/
|
|
1082
1084
|
onItemClick?: (event: events.TreeViewItemClickEvent) => void;
|
|
1083
1085
|
/**
|
|
1084
|
-
* Specifies the name of the field which will provide a Boolean representation for the expanded state of the item.
|
|
1086
|
+
* Specifies the name of the field which will provide a Boolean representation for the expanded state of the item.
|
|
1085
1087
|
*
|
|
1086
|
-
*
|
|
1088
|
+
* @default "expanded"
|
|
1089
|
+
*
|
|
1090
|
+
* @example
|
|
1087
1091
|
* ```jsx
|
|
1088
1092
|
* <TreeView expandField="isExpanded" />
|
|
1089
1093
|
* ```
|
|
1090
1094
|
*/
|
|
1091
1095
|
expandField?: string;
|
|
1092
1096
|
/**
|
|
1093
|
-
* Specifies the name of the field which will provide a Boolean representation for the selected state of the item.
|
|
1097
|
+
* Specifies the name of the field which will provide a Boolean representation for the selected state of the item.
|
|
1094
1098
|
*
|
|
1095
|
-
*
|
|
1099
|
+
* @default "selected"
|
|
1100
|
+
*
|
|
1101
|
+
* @example
|
|
1096
1102
|
* ```jsx
|
|
1097
1103
|
* <TreeView selectField="isSelected" />
|
|
1098
1104
|
* ```
|
|
1099
1105
|
*/
|
|
1100
1106
|
selectField?: string;
|
|
1101
1107
|
/**
|
|
1102
|
-
* Specifies the name of the field which will provide an icon for the specific TreeView item.
|
|
1108
|
+
* Specifies the name of the field which will provide an icon for the specific TreeView item.
|
|
1103
1109
|
*
|
|
1104
|
-
*
|
|
1110
|
+
* @default "svgIcon"
|
|
1111
|
+
*
|
|
1112
|
+
* @example
|
|
1105
1113
|
* ```jsx
|
|
1106
1114
|
* <TreeView iconField="icon" />
|
|
1107
1115
|
* ```
|
|
1108
1116
|
*/
|
|
1109
1117
|
iconField?: string;
|
|
1110
1118
|
/**
|
|
1111
|
-
* Specifies the name of the field which indicates to the TreeView that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature ([see example]({% slug databinding_treeview %}#toc-loading-data-on-demand)).
|
|
1119
|
+
* Specifies the name of the field which indicates to the TreeView that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature ([see example]({% slug databinding_treeview %}#toc-loading-data-on-demand)).
|
|
1112
1120
|
*
|
|
1113
|
-
*
|
|
1121
|
+
* @default "hasChildren"
|
|
1122
|
+
*
|
|
1123
|
+
* @example
|
|
1114
1124
|
* ```jsx
|
|
1115
1125
|
* <TreeView hasChildrenField="hasSubItems" />
|
|
1116
1126
|
* ```
|
|
@@ -1119,25 +1129,31 @@ export declare interface TreeViewProps {
|
|
|
1119
1129
|
/**
|
|
1120
1130
|
* Specifies the name of the field which will provide an array representation of the item children.
|
|
1121
1131
|
*
|
|
1122
|
-
*
|
|
1132
|
+
* @default "items"
|
|
1133
|
+
*
|
|
1134
|
+
* @example
|
|
1123
1135
|
* ```jsx
|
|
1124
1136
|
* <TreeView childrenField="subItems" />
|
|
1125
1137
|
* ```
|
|
1126
1138
|
*/
|
|
1127
1139
|
childrenField?: string;
|
|
1128
1140
|
/**
|
|
1129
|
-
* Specifies the name of the field which will provide a text representation for the item.
|
|
1141
|
+
* Specifies the name of the field which will provide a text representation for the item.
|
|
1130
1142
|
*
|
|
1131
|
-
*
|
|
1143
|
+
* @default "text"
|
|
1144
|
+
*
|
|
1145
|
+
* @example
|
|
1132
1146
|
* ```jsx
|
|
1133
1147
|
* <TreeView textField="label" />
|
|
1134
1148
|
* ```
|
|
1135
1149
|
*/
|
|
1136
1150
|
textField?: string;
|
|
1137
1151
|
/**
|
|
1138
|
-
* Specifies the name of the field which will provide a Boolean representation for the disabled state of the item.
|
|
1152
|
+
* Specifies the name of the field which will provide a Boolean representation for the disabled state of the item.
|
|
1139
1153
|
*
|
|
1140
|
-
*
|
|
1154
|
+
* @default "disabled"
|
|
1155
|
+
*
|
|
1156
|
+
* @example
|
|
1141
1157
|
* ```jsx
|
|
1142
1158
|
* <TreeView disableField="isDisabled" />
|
|
1143
1159
|
* ```
|
|
@@ -1191,18 +1207,22 @@ export declare interface TreeViewProps {
|
|
|
1191
1207
|
*/
|
|
1192
1208
|
checkboxes?: boolean;
|
|
1193
1209
|
/**
|
|
1194
|
-
* Specifies the name of the field which will provide a Boolean representation for the checked state of the item.
|
|
1210
|
+
* Specifies the name of the field which will provide a Boolean representation for the checked state of the item.
|
|
1195
1211
|
*
|
|
1196
|
-
*
|
|
1212
|
+
* @default "checked"
|
|
1213
|
+
*
|
|
1214
|
+
* @example
|
|
1197
1215
|
* ```jsx
|
|
1198
1216
|
* <TreeView checkField="isChecked" />
|
|
1199
1217
|
* ```
|
|
1200
1218
|
*/
|
|
1201
1219
|
checkField?: string;
|
|
1202
1220
|
/**
|
|
1203
|
-
* Specifies the name of the field which will provide a Boolean representation for the check indeterminate state of the item.
|
|
1221
|
+
* Specifies the name of the field which will provide a Boolean representation for the check indeterminate state of the item.
|
|
1204
1222
|
*
|
|
1205
|
-
*
|
|
1223
|
+
* @default "checkIndeterminate"
|
|
1224
|
+
*
|
|
1225
|
+
* @example
|
|
1206
1226
|
* ```jsx
|
|
1207
1227
|
* <TreeView checkIndeterminateField="isPartiallyChecked" />
|
|
1208
1228
|
* ```
|
|
@@ -1257,9 +1277,9 @@ export declare interface TreeViewProps {
|
|
|
1257
1277
|
* - large
|
|
1258
1278
|
* - null—Does not set a size `className`.
|
|
1259
1279
|
*
|
|
1260
|
-
* @default
|
|
1280
|
+
* @default "medium"
|
|
1261
1281
|
*
|
|
1262
|
-
*
|
|
1282
|
+
* @example
|
|
1263
1283
|
* ```jsx
|
|
1264
1284
|
* <TreeView size="large" />
|
|
1265
1285
|
* ```
|
package/package-metadata.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-treeview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-treeview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1757072583,version:"12.0.2-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
|
package/package-metadata.mjs
CHANGED
|
@@ -10,8 +10,8 @@ const e = Object.freeze({
|
|
|
10
10
|
productName: "KendoReact",
|
|
11
11
|
productCode: "KENDOUIREACT",
|
|
12
12
|
productCodes: ["KENDOUIREACT"],
|
|
13
|
-
publishDate:
|
|
14
|
-
version: "12.0.
|
|
13
|
+
publishDate: 1757072583,
|
|
14
|
+
version: "12.0.2-develop.2",
|
|
15
15
|
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
16
16
|
});
|
|
17
17
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-treeview",
|
|
3
|
-
"version": "12.0.
|
|
3
|
+
"version": "12.0.2-develop.2",
|
|
4
4
|
"description": "React TreeView displays hierarchical data in a traditional tree structure, supports user interaction. KendoReact TreeView package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"sideEffects": false,
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-licensing": "^1.7.0",
|
|
29
|
-
"@progress/kendo-react-animation": "12.0.
|
|
30
|
-
"@progress/kendo-react-common": "12.0.
|
|
29
|
+
"@progress/kendo-react-animation": "12.0.2-develop.2",
|
|
30
|
+
"@progress/kendo-react-common": "12.0.2-develop.2",
|
|
31
31
|
"@progress/kendo-svg-icons": "^4.0.0",
|
|
32
32
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
33
33
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"package": {
|
|
54
54
|
"productName": "KendoReact",
|
|
55
55
|
"productCode": "KENDOUIREACT",
|
|
56
|
-
"publishDate":
|
|
56
|
+
"publishDate": 1757072583,
|
|
57
57
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
58
58
|
}
|
|
59
59
|
},
|