@progress/kendo-vue-layout
Version:
9 lines (8 loc) • 4.28 kB
JavaScript
/**
* @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 c=require("vue"),h=require("./PanelBarItem.js"),o=require("./util.js"),n=require("@progress/kendo-vue-common"),l=require("../package-metadata.js"),s=require("./interfaces/NavigationAction.js"),p=c.defineComponent({name:"KendoPanelBar",emits:{select:null,keydown:null},props:{animation:{type:Boolean,default:!0},items:Array,dir:String,selected:[String,Number],expanded:{type:Array,default:void 0},focused:[String,Number],expandMode:{type:String,default:"multiple",validator:function(e){return["single","multiple"].includes(e)}},className:String,keepItemsMounted:Boolean},created(){this.activeDescendant=null,n.validatePackage(l.packageMetadata),this.showLicenseWatermark=n.shouldShowValidationUI(l.packageMetadata),this.licenseMessage=n.getLicenseMessage(l.packageMetadata)},data(){const e=o.getInitialState(this.$props,this.expandMode);return e.currentFocused||(e.currentFocused=o.getFirstId(this.$props)),e},computed:{selectedItem(){const{selected:e=this.currentSelected}=this.$props;return e},expandedItems(){return this.$props.expanded!==void 0?this.$props.expanded||[]:this.currentExpanded},computedItems(){const e={currentExpanded:[],...this.$data,selected:this.selectedItem},i={animation:this.$props.animation,keepItemsMounted:this.$props.keepItemsMounted,state:e,expanded:this.expandedItems,handleSelect:this.handleSelect};return o.renderChildren.call(this,this.items,i)}},provide(){return{dispatchItemSelect:this.handleSelect}},render(){const e=n.classNames("k-panelbar",this.$props.className),i=this.showLicenseWatermark?c.createVNode(n.WatermarkOverlay,{message:this.licenseMessage},null):null;return c.createVNode("ul",{dir:this.$props.dir,role:"tree",tabindex:0,onKeydown:this.handleKeyDown,onFocus:this.handleWrapperFocus,onBlur:this.handleWrapperBlur,class:e,"aria-activedescendant":this.activeDescendant},[this.computedItems.map(function(t){return c.h(h.PanelBarItem,{...t,item:t})},this),i])},methods:{handleSelect(e){this.onSelect(e),this.onFocus(e)},onSelect(e){const i=o.flatChildren(this.computedItems);let t,a;if(i.forEach(r=>{r.uniquePrivateKey===(e.uniquePrivateKey||this.currentFocused)&&(t=r)}),t){let r;switch(this.expandMode){case"single":a=[...t.parentUniquePrivateKey,t.uniquePrivateKey],o.isArrayEqual(this.expandedItems,a)&&(t.parentUniquePrivateKey?a=[...t.parentUniquePrivateKey]:a=[]);break;case"multiple":a=this.expandedItems.slice(),r=a.indexOf(t.uniquePrivateKey),r===-1?a.push(t.uniquePrivateKey):a.splice(r,1);break;default:a=this.expandedItems.slice();break}this.currentSelected=t.uniquePrivateKey,this.currentExpanded=a,this.$emit("select",{target:t,expandedItems:a})}},onFocus(e,i=0){const t=o.flatVisibleChildren(this.computedItems);let a;t.forEach((r,d)=>{if(r.uniquePrivateKey===(e.uniquePrivateKey||this.currentFocused)){let u=d+i<0?0:d+i>t.length?t.length-1:d+i;a=t[u]}}),a&&(this.activeDescendant=a.id,this.currentFocused=a.uniquePrivateKey)},onNavigate(e,i){let t;switch(i){case s.NavigationAction.Previous:t=-1,this.onFocus(e,t);break;case s.NavigationAction.Next:t=1,this.onFocus(e,t);break;case s.NavigationAction.Toggle:this.onSelect(e);break}},handleWrapperFocus(){this.wrapperFocused||(this.wrapperFocused=!0)},handleWrapperBlur(){this.wrapperFocused=!1},handleKeyDown(e){const i=this._element&&getComputedStyle(this._element).direction==="rtl"||!1;if(e.target===e.currentTarget){const t=e.keyCode;let a;switch(t){case n.Keys.left:a=i?s.NavigationAction.Next:s.NavigationAction.Previous;break;case n.Keys.up:a=s.NavigationAction.Previous;break;case n.Keys.right:a=i?s.NavigationAction.Previous:s.NavigationAction.Next;break;case n.Keys.down:a=s.NavigationAction.Next;break;case n.Keys.space:case n.Keys.enter:a=s.NavigationAction.Toggle;break;default:a=null;break}a!==null&&(e.preventDefault(),this.onNavigate(e,a))}this.$emit("keydown",e)}}});exports.PanelBar=p;