@progress/kendo-vue-treeview/TreeViewItem.js

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("vue"),d=require("@progress/kendo-vue-common"),f=require("./utils/itemIdUtils.js"),a=require("./utils/itemUtils.js"),b=require("@progress/kendo-vue-animation"),r=require("./utils/consts.js"),h=require("@progress/kendo-svg-icons");function o(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!i.isVNode(e)}const{sizeMap:g}=d.kendoThemeMaps,m=i.defineComponent({name:"KendoTreeViewItem",props:{item:Object,itemId:String,treeGuid:String,animate:Boolean,focusedItemId:String,tabbableItemId:String,fieldsService:Object,itemUI:Object,ariaMultiSelectable:Boolean,expandIcons:Boolean,checkboxes:Boolean,onFocusDomElNeeded:Object,draggable:Boolean,isRtl:Boolean,size:{type:String,default:"medium",validator:function(e){return[null,"small","medium","large"].includes(e)}},disabled:Boolean,ariaLevel:Number,onItemClick:Function,onExpandChange:Function,onCheckChange:Function,onPress:Function,onDrag:Function,onRelease:Function,onFocusdomelneeded:Function},computed:{fieldsSvc(){return this.$props.fieldsService},currentTabIndex(){return(this.$props.focusedItemId||this.$props.tabbableItemId)===this.itemId?0:-1},ariaExpanded(){return this.fieldsSvc.hasChildren(this.item)||a.hasChildren(this.item,this.fieldsSvc.getChildrenField())?!!this.fieldsSvc.expanded(this.item):void 0},ariaChecked(){if(this.$props.checkboxes)return this.fieldsSvc.checked(this.item)?"true":this.fieldsSvc.checkIndeterminate(this.item)?"mixed":"false"},ariaSelected(){return this.fieldsSvc.selected(this.item)?!0:this.$props.ariaMultiSelectable?this.computedDisabled?void 0:!1:void 0},computedDisabled(){const e=this.fieldsSvc.disabled(this.item);return e!==void 0?e:this.disabled}},created(){this.itemGuid=d.guid(),this.prevFocusedItemId=this.focusedItemId,this.prevFieldsService=this.fieldsService,this.prevItem=this.item},data(){return{isMounted:!1}},watch:{focusedItemId:function(e,t){this.prevFocusedItemId=t},fieldsService:function(e,t){this.prevFieldsService=t},item:function(e,t){this.prevItem=t}},mounted(){const e=this.$props.focusedItemId,t=this.itemId;e&&e===t&&this.$emit("focusDomElNeeded",this.$el),this.checkboxElement=d.getRef(this,"checkboxElement"),this.checkboxElement&&(this.checkboxElement.indeterminate=this.fieldsSvc.checkIndeterminate(this.item)),this.assignDraggableMeta(this.$refs.treemid),this.isMounted=!0},updated(){const e=this.$props.focusedItemId;if(e&&e!==this.prevFocusedItemId&&e===this.itemId&&this.$emit("focusdomelneeded",this.$el),this.checkboxElement=d.getRef(this,"checkboxElement"),this.checkboxElement){const t=this.fieldsSvc.checkIndeterminate(this.item);t!==this.prevFieldsService.checkIndeterminate(this.prevItem)&&(this.checkboxElement.indeterminate=t)}this.assignDraggableMeta(this.$refs.treemid)},render(){let e,t;const s=function(){return a.isItemExpandedAndWithChildren(this.item,this.fieldsSvc)?i.createVNode("ul",{class:"k-treeview-group",role:"group"},[this.fieldsSvc.children(this.item).map(function(n,l){return i.createVNode(m,{item:n,itemId:f.createId(l,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,ariaLevel:this.$props.ariaLevel+1,onItemClick:this.handleItemClick,onFocusdomelneeded:this.handleFocusDomElNeeded,draggable:this.$props.draggable,onPress:this.handlePress,onDrag:this.handleDrag,onRelease:this.handleRelease,expandIcons:this.$props.expandIcons,onExpandChange:this.handleExpandChange,onCheckChange:this.handleCheckChange,key:l,size:this.$props.size,disabled:this.computedDisabled,isRtl:this.$props.isRtl},null)},this)]):void 0},u=function(){return this.$props.expandIcons&&(this.fieldsSvc.hasChildren(this.item)||a.hasChildren(this.item,this.fieldsSvc.getChildrenField()))&&i.createVNode("span",{class:d.classNames("k-treeview-toggle",{"k-disabled":this.computedDisabled})},[i.createVNode(d.Icon,{name:this.getIconClassName(),icon:this.getIconSVG(),onClick:this.handleExpandChange},null)])},p=function(){if(this.$props.checkboxes){const n=this.$props.size;return i.createVNode("div",{class:"k-checkbox-wrap",role:"presentation"},[i.createVNode("input",{type:"checkbox",class:d.classNames("k-checkbox k-rounded-md",{[`k-checkbox-${g[n]||n}`]:n,"k-disabled":this.computedDisabled}),"aria-label":this.item.text,checked:!!this.fieldsSvc.checked(this.item),id:this.itemGuid,tabindex:-1,onChange:this.handleCheckChange,ref:d.setRef(this,"checkboxElement")},null),i.createVNode("label",{class:"k-checkbox-label",for:this.itemGuid},null)])}else return},I=d.getTemplate.call(this,{h:i.h,template:this.$props.itemUI,defaultRendering:this.fieldsSvc.text(this.item),additionalProps:{item:this.item,itemHierarchicalIndex:this.itemId}}),c=function(){return i.createVNode("span",{class:this.getContentClassName(),style:{touchAction:"none"},onClick:this.handleItemClick},[i.createVNode("span",{class:"k-treeview-leaf-text"},[I])])};return i.createVNode("li",{class:d.classNames("k-treeview-item"),tabindex:this.currentTabIndex,role:"treeitem","aria-level":this.$props.ariaLevel,"aria-expanded":this.ariaExpanded,"aria-selected":this.ariaSelected,"aria-checked":this.ariaChecked,"aria-disabled":this.computedDisabled?!0:void 0},[i.createVNode("div",{class:"k-treeview-mid",ref:"treemid"},[u.call(this),p.call(this),this.$props.draggable?i.createVNode(d.Draggable,{onPress:n=>this.handlePress(n),onDrag:n=>this.handleDrag(n),onRelease:n=>this.handleRelease(n)},o(e=c.call(this))?e:{default:()=>[e]}):c.call(this)]),this.$props.animate&&this.isMounted?i.createVNode(b.Reveal,{appear:this.ariaExpanded,transitionEnterDuration:200,transitionExitDuration:200,key:this.itemGuid+"_animation",style:{display:"block"}},o(t=s.call(this))?t:{default:()=>[t]}):s.call(this)])},methods:{handleCheckChange(e,t,s){this.$emit("checkChange",e,t||this.item,s||this.itemId)},handleExpandChange(e,t,s){this.$emit("expandChange",e,t||this.item,s||this.itemId)},handleItemClick(e,t,s){this.$emit("itemClick",e,t||this.item,s||this.itemId)},handlePress(e,t,s){this.$emit("press",e,t||{...this.item},s||this.itemId)},handleDrag(e,t,s){this.$emit("drag",e,t||this.item,s||this.itemId)},handleRelease(e,t,s){this.$emit("release",e,t||this.item,s||this.itemId)},handleFocusDomElNeeded(e){this.$emit("focusdomelneeded",e)},getIconClassName(){const e=this.fieldsSvc.expanded(this.item);return e&&!a.hasChildren(this.item,this.fieldsSvc.getChildrenField())?"loading":e?"caret-alt-down":this.$props.isRtl?"caret-alt-left":"caret-alt-right"},getIconSVG(){return this.fieldsSvc.expanded(this.item)?h.caretAltDownIcon:this.$props.isRtl?h.caretAltLeftIcon:h.caretAltRightIcon},getContentClassName(){return d.classNames("k-treeview-leaf",{"k-focus":this.$props.focusedItemId===this.itemId,"k-selected":this.fieldsSvc.selected(this.item),"k-disabled":this.computedDisabled})},assignDraggableMeta(e){e&&!e[r.DOM_KENDO_ITEM_ID_FIELD]&&(e[r.DOM_KENDO_ITEM_ID_FIELD]=this.$props.itemId,e[r.DOM_KENDO_TREEVIEW_GUID_FIELD]=this.$props.treeGuid)}}});exports.TreeViewItem=m;