@progress/kendo-vue-dropdowns 8.4.0-develop.3 → 8.4.0-develop.5

package/MultiSelect/MultiSelect.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),a=require("@progress/kendo-vue-common"),ve=require("../common/ListContainer.js"),Ie=require("../common/List.js"),be=require("./TagList.js"),ye=require("../common/SearchBar.js"),Se=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),ke=require("../common/ClearButton.js"),w=require("../common/settings.js"),m=require("../common/utils.js"),U=require("@progress/kendo-svg-icons"),E=require("@progress/kendo-vue-buttons"),Y=require("../common/constants.js"),Ce=require("@progress/kendo-vue-layout"),xe=require("../common/ListFilter.js"),$e=require("@progress/kendo-vue-intl"),T=require("../messages/main.js"),{sizeMap:P,roundedMap:Fe}=a.kendoThemeMaps;function A(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}const Ve="Please enter a valid value!",Te=e=>e.preventDefault(),J=(e,t,s)=>!!e!=!!t||e.text!==t.text?!1:e===t||m.matchDataCollections(e.data,t.data,s),Q=e=>e===b.CustomItem;var b=(function(e){return e[e.None=0]="None",e[e.ListItem=1]="ListItem",e[e.CustomItem=2]="CustomItem",e})(b||{});const Oe=l.defineComponent({name:"KendoMultiSelect",emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,change:e=>!0,pagechange:e=>!0,focus:e=>!0,blur:e=>!0,open:e=>!0,close:e=>!0,scroll:e=>!0},model:{event:"changemodel"},props:{autoClose:{type:Boolean,default:!0},removeTagIcon:String,allowCustom:Boolean,modelValue:Array,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,label:String,loading:Boolean,name:String,value:Array,defaultValue:Array,valueField:String,valuePrimitive:Boolean,dataItemKey:String,placeholder:String,tags:Array,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validate:{type:Boolean},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},tagRender:[String,Function,Object],id:String,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},itemRender:[String,Function,Object],groupHeaderItemRender:[String,Function,Object],groupStickyHeaderItemRender:[String,Function,Object],listNoDataRender:[String,Function,Object],focusedItemIndex:Function,virtual:{type:Object,default:void 0},header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,rounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},tagsRounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["solid","flat","outline"].includes(e)}},size:{type:String,validator:function(e){return["none","small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},inputAttributes:Object},setup(){const e=l.ref(null),t=l.ref(null),s=l.inject("kendoLocalizationService",{});return{inputRef:e,kendoAnchorRef:t,kendoLocalizationService:s}},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid,t=this.currentText||m.getItemValue(this.computedValue()[0],this.$props.textField);return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!(t&&t!==0),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}},isOpen(){return this.$props.opened!==void 0?this.$props.opened:this.currentOpened},animationStyles(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?{top:0,width:"100%",height:"100%"}:void 0},classNameAdaptive(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"},adaptiveState(){return this.windowWidth<=this.adaptiveModeBreakpoints.medium&&this.$props.adaptive}},created(){this.observer=null,this.valuesItemsDuringOnChange=null,this._tags=[],this._skipFocusEvent=!1,this.scrollToFocused=!1,this.base=new Se(this),this.anchor=a.guid(),this.inputId=a.guid()},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:Y.MOBILE_SMALL_DEVICE,medium:Y.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,currentFocusedIndex:void 0,currentFocusedTag:void 0,searchState:{word:"",last:""},suggested:"",activedescendant:w.ActiveDescendant.PopupList,group:void 0,isScrolling:!1,itemHeight:0,windowWidth:0,popupWidth:void 0,initialAdaptiveRenderingValues:void 0}},watch:{currentOpened:function(e,t){this.prevCurrentOpened=t},opened:function(e,t){this.prevOpened=t},virtual:function(e,t){e&&t&&e.total!==t.total&&(this.virtualTotalHasChanged=!0)},isOpen:function(e){e?this.initialAdaptiveRenderingValues=this.base.component.currentValue:this.initialAdaptiveRenderingValues=void 0,setTimeout(()=>{const t=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(t)},100)}},updated(){var g;const{virtual:e,groupField:t="",dataItems:s=[]}=this.$props,i=e?e.skip:0,n=this.isOpen,r=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,d=!r&&n,u=r&&!n,p=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),o=this.$refs.list,f=this.$refs.scrollElement;if(o&&(this.base.vs.list=o.list,this.base.list=o.list),f&&(this.base.vs.scrollElement=f),o&&s.length&&this.base.vs.scrollerRef(o.$el),!p.animate&&u&&this.onPopupClosed(),!this.isScrolling)if(e&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{let{focusedItem:v,focusedIndex:C}=this.getFocusedState();t!==""&&(C=(g=this.base.getGroupedDataModernMode(s,t))==null?void 0:g.indexOf(v)),d&&e?(this.base.scrollToVirtualItem(e,C-i),this.prevCurrentOpened=!0):d&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][t],this),this.base.scrollToItem(C),this.prevCurrentOpened=!0):n&&r&&v&&this.base.scrollToItem(C-i)}this.scrollToFocused=!1,this.searchBarRef(),this.setValidity()},mounted(){this.observer=a.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.hasMounted=!0,this.input=this.inputRef.input,this.base.wrapper=a.getRef(this,"kendoAnchor"),this.element=a.getRef(this,"kendoAnchor"),this.base.didMount(),this.searchBarRef(),this.setValidity()},methods:{clearFilter(e){this.currentText&&(e.data.currentText=""),this.base.filterChanged("",e)},computedValue(){const e=[];return this.valuesItemsDuringOnChange?e.push(...this.valuesItemsDuringOnChange):this.$props.value?e.push(...this.$props.value):this.$props.modelValue!==void 0?e.push(...this.$props.modelValue):this.currentValue?e.push(...this.currentValue):this.$props.defaultValue&&e.push(...this.$props.defaultValue),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){return t.map(i=>{const n=this.dataItems.findIndex(r=>m.getItemValue(r,e)===i);return this.dataItems[n]||i})},primitiveValue(){const e=this.computedValue(),t=e.map(s=>m.getItemValue(s,this.valueField));return this.valuePrimitive?t:e},validity(){const e=this.$props.validationMessage!==void 0,t=this.computedValue(),s=!this.$props.required||t!==null&&t.length>0&&t!==void 0,i=this.$props.valid!==void 0?this.$props.valid:s;return{customError:e,valid:i,valueMissing:t===null}},handleItemSelect(e,t){const{dataItems:s=[],dataItemKey:i,virtual:n}=this.$props,r=this.computedValue(),d=n?n.skip:0,u=s[e-d],p=r.findIndex(g=>m.areSame(g,u,i));let o=[];p!==-1?(o=r,o.splice(p,1)):o=[...r,u],(this.$props.filter!==void 0?this.$props.filter:this.currentText)&&!this.adaptiveState&&this.clearFilter(t),this.currentFocusedIndex!==void 0&&(t.data.currentFocusedIndex=void 0),this.triggerOnChange(o,t),this.base.triggerPageChangeCornerItems(u,t)},onTagDelete(e,t){const s=this.isOpen,i=this.base.initState();i.event=t,s&&this.base.togglePopup(i),this.currentFocused||(i.data.currentFocused=!0);const n=this.computedValue();m.removeDataItems(n,e,this.$props.dataItemKey),this.triggerOnChange(n,i),this.applyState(i)},onNavigate(e,t){const{allowCustom:s,dataItems:i=[]}=this.$props,n=this.isOpen,r=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:d,focusedIndex:u}=this.getFocusedState(),p=s&&r,o=Q(d),f=this.base,g=f.vs;if(n&&t===a.Keys.up&&o)this.currentFocusedIndex!==void 0&&(e.data.currentFocusedIndex=void 0);else{const v=f.navigation.navigate({keyCode:t,current:u,max:(g.enabled?g.total:i.length)-1,min:p?-1:0});v!==void 0&&(this.itemFocus(v,e),this.scrollToFocused=!0)}this.applyState(e)},itemFocus(e,t){const{dataItems:s=[],allowCustom:i,virtual:n}=this.$props,r=n?n.skip:0,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedIndex:u}=this.getFocusedState(),p=i&&d,o=s[e-r];o&&u!==e?this.currentFocusedIndex!==e&&(t.data.currentFocusedIndex=e,t.data.activedescendant=w.ActiveDescendant.PopupList):p&&e===-1&&this.currentFocusedIndex!==void 0&&(t.data.currentFocusedIndex=void 0),this.base.triggerPageChangeCornerItems(o,t)},searchBarRef(){this.input&&this.currentFocused&&setTimeout(()=>this.input.focus(),0)},onChangeHandler(e){const t=this.base.initState(),s=e&&(e.currentTarget&&e.currentTarget.value||e.value),i=this.isOpen;t.event=e,this.$props.filter===void 0&&(t.data.currentText=s),t.data.currentFocusedIndex=void 0,i||this.base.togglePopup(t),this.base.filterChanged(s,t),this.$props.filterable&&(t.data.group=void 0),this.applyState(t)},clearButtonClick(e){const t=this.isOpen,s=this.base.initState();s.event=e,e.stopPropagation(),this.computedValue().length>0&&this.triggerOnChange([],s),this.currentFocusedIndex!==void 0&&(s.data.currentFocusedIndex=void 0),t&&this.base.togglePopup(s);const i=this.$props.filter!==void 0?this.$props.filter:this.currentText;m.isPresent(i)&&i!==""&&this.base.filterChanged("",s),this.currentText&&(s.data.currentText=""),this.applyState(s)},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,s=this.$props.filter!==void 0?this.$props.filter:this.currentText,i=this.isOpen,{focusedItem:n}=this.getFocusedState(),r=this.base.initState();if(r.event=e,!s&&this.computedValue().length>0&&(t===a.Keys.left||t===a.Keys.right||t===a.Keys.home||t===a.Keys.end||t===a.Keys.delete||t===a.Keys.backspace))return this.onTagsNavigate(e,r);const d=()=>{e.preventDefault(),this.base.togglePopup(r),this.applyState(r)};i?e.altKey&&t===a.Keys.up?d():t===a.Keys.up||t===a.Keys.down?(e.preventDefault(),this.onNavigate(r,t)):t===a.Keys.enter?(e.preventDefault(),this.$props.allowCustom&&s&&n===null?this.customItemSelect(e):this.selectFocusedItem(e)):t===a.Keys.esc&&(this.adaptiveState&&this.handleWrapperClick(e),d()):e.altKey&&t===a.Keys.down&&d()},onTagsNavigate(e,t){const s=e.keyCode,i=this.currentFocusedTag,n=this._tags,r=this.$props.dataItemKey;let d=i?n.findIndex(o=>J(o,i,r)):-1,u;const p=d!==-1;if(s===a.Keys.left)p?d=Math.max(0,d-1):d=n.length-1,u=n[d];else if(s===a.Keys.right)d===n.length-1?u=void 0:p&&(d=Math.min(n.length-1,d+1),u=n[d]);else if(s===a.Keys.home)u=n[0];else if(s===a.Keys.end)u=n[n.length-1];else if(s===a.Keys.delete){if(p){const o=this.computedValue();m.removeDataItems(o,n[d].data,r),this.triggerOnChange(o,t)}}else if(s===a.Keys.backspace){const o=this.computedValue();if(p)m.removeDataItems(o,n[d].data,r),this.triggerOnChange(o,t);else if(!p&&n.length){const f=n.pop();m.removeDataItems(o,f.data,r),this.triggerOnChange(o,t)}}u!==i&&(t.data.currentFocusedTag=u,t.data.activedescendant=w.ActiveDescendant.TagsList),this.applyState(t)},triggerOnChange(e,t){this.$props.value===void 0&&(t.data.currentValue=[...e]),this.valuesItemsDuringOnChange=[],this.setItems(e,this.valuesItemsDuringOnChange),t.events.push({type:"change"})},selectFocusedItem(e){const{dataItems:t=[],virtual:s}=this.$props,{focusedIndex:i}=this.getFocusedState(),n=s?s.skip:0;t[i-n]!==void 0&&this.handleItemClick(i,e)},setItems(e,t){t.length=0,t.push(...e)},getFocusedState(){const e=this.currentFocusedIndex,t=this.$props.filter!==void 0?this.$props.filter:this.currentText,{allowCustom:s,dataItems:i=[],dataItemKey:n,virtual:r,textField:d,focusedItemIndex:u=m.itemIndexStartsWith}=this.$props,p=r&&r.skip||0;let o;if(e!==void 0)return{focusedIndex:e,focusedItem:i[e-p],focusedType:b.ListItem};const f=this.computedValue();if(s&&t)return{focusedItem:null,focusedIndex:-1,focusedType:b.CustomItem};if(t)return o=u(i,t,d),{focusedItem:i[o],focusedIndex:o+p,focusedType:b.ListItem};if(f.length){const g=f[f.length-1];return o=i.findIndex(v=>m.areSame(v,g,n)),i[o]!==void 0?{focusedIndex:o+p,focusedItem:i[o],focusedType:b.ListItem}:{focusedType:b.None,focusedIndex:-1}}return p===0?{focusedItem:i[0],focusedIndex:0,focusedType:b.ListItem}:{focusedType:b.None,focusedIndex:-1}},customItemSelect(e){const t=this.$props.filter!==void 0?this.$props.filter:this.currentText,{textField:s}=this.$props;if(!t)return;const i=this.base.initState();i.event=e;const n=s?{[s]:t}:t;this.currentText!==void 0&&(i.data.currentText=""),i.data.currentFocusedIndex=void 0,this.base.filterChanged("",i);const r=[...this.computedValue(),n];this.triggerOnChange(r,i),this.base.togglePopup(i),this.applyState(i)},handleWrapperClick(e){const t=this.isOpen,s=this.input;!t&&s&&this.focusElement(s);const i=this.base.initState();i.event=e,this.currentFocused||(i.events.push({type:"focus"}),i.data.currentFocused=!0),this.clearFilter(i),this.base.togglePopup(i),this.applyState(i)},onCancel(e){const t=this.base.initState();t.event=e,e.stopPropagation();const s=this.isOpen;t.focusedIndex!==void 0&&(t.data.focusedIndex=void 0),s&&this.base.togglePopup(t),t.events.push({type:"onCancel"}),this.clearFilter(t),this.triggerOnChange([...this.initialAdaptiveRenderingValues],t),this.base.triggerPageChangeCornerItems([...this.initialAdaptiveRenderingValues],t),this.applyState(t)},handleItemClick(e,t){const s=this.base.initState();s.event=t,this.handleItemSelect(e,s),this.$props.autoClose&&!this.adaptiveState&&this.base.togglePopup(s),this.applyState(s)},handleBlur(e){if(!this.currentFocused||this._skipFocusEvent)return;const t=this.isOpen,s=this.base.initState(),{allowCustom:i,filterable:n}=this.$props;s.event=e,s.data.currentFocused=!1,s.events.push({type:"blur"}),t&&!this.adaptiveState&&(this.currentOpened&&(s.data.currentOpened=!1),s.events.push({type:"close"})),!i&&!n&&this.currentText&&(s.data.currentText=""),this.applyState(s)},handleFocus(e){this._skipFocusEvent||this.base.handleFocus(e)},onPopupOpened(){this.input&&this.currentFocused&&this.focusElement(this.input)},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.focusElement(this.input)},0)},focusElement(e){this._skipFocusEvent=!0,e.focus(),setTimeout(()=>this._skipFocusEvent=!1,30)},applyState(e){this.base.applyState(e),this.valuesItemsDuringOnChange=null},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Ve)},focus(){this.input&&this.input.focus()},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){var g;this.isScrolling=!0;const{vs:t,list:s}=this.base;t.scrollHandler(e);const i=this.base.initState(),{groupField:n}=this.$props;let{dataItems:r=[]}=this.$props,d;if(!n||!r.length)return;const u=s&&((g=s.querySelector(".k-list-item"))==null?void 0:g.offsetHeight)||0,p=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:u),f=e.target.scrollTop-t.skip*p;n&&(r=this.base.getGroupedDataModernMode(r,n),r=this.base.getGroupedDataModernMode(r,n),d=r[0][n]);for(let v=1;v<r.length&&!(p*v>f);v++)r[v]&&r[v][n]&&(d=r[v][n]);d!==this.group&&(i.data.group=d,this.applyState(i))}},render(){const{style:e,label:t,dir:s,disabled:i,tags:n,textField:r,dataItemKey:d,virtual:u,loading:p,size:o,fillMode:f,rounded:g,tagsRounded:v,removeTagIcon:C,adaptiveTitle:X,header:K,footer:q,inputAttributes:Z,groupStickyHeaderItemRender:ee,dataItems:x=[]}=this.$props,te=this.currentFocused,R=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),D=this.currentFocusedTag,j=this.computedValue(),B=(this.$props.filter!==void 0?this.$props.filter:this.currentText)||"",se=!p&&!i&&(!!B||j.length>0),y=this.base.vs,H=this.$props.id||this.inputId,ie=a.templateRendering.call(this,this.$props.tagRender,a.getListeners.call(this)),L=this.isOpen,$=this.adaptiveState,_=$e.provideLocalizationService(this);this.group===void 0&&this.$props.groupField!==void 0&&(this.group=m.getItemValue(this.$props.dataItems[0],this.$props.groupField)),y.enabled=u!==void 0,u!==void 0&&(y.skip=u.skip,y.total=u.total,y.pageSize=u.pageSize);let I=[];this.initialAdaptiveRenderingValues?[...this.initialAdaptiveRenderingValues].forEach(h=>{I.push({text:m.getItemValue(h,r),data:[h]})}):n===void 0?this.computedValue().forEach(c=>{I.push({text:m.getItemValue(c,r),data:[c]})}):I.push(...n),I.length>0&&this.setItems(I,this._tags);const ne=!this.$props.validityStyles||this.validity().valid,ae=function(c){const h=this.activedescendant,{placeholder:S}=this.$props,{focusedIndex:F}=this.getFocusedState(),k=I.length===0||j.length===0&&!B?S:void 0,V=h===w.ActiveDescendant.TagsList&&D!==void 0?`tag-${this.base.guid}-${D.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${F}`,O=this.$props.ariaDescribedBy?" "+this.$props.ariaDescribedBy:"",N=I.length>0?`tagslist-${this.base.guid}${O}`:this.$props.ariaDescribedBy;return l.createVNode(ye.SearchBar,{id:c,size:Math.max((k||"").length,B.length,1),tabIndex:this.$props.tabIndex,accessKey:this.$props.accessKey,placeholder:k,value:$?"":B,onChange:this.onChangeHandler,onBlur:this.handleBlur,onKeydown:this.onInputKeyDown,ref:M=>{this.inputRef=M},disabled:i,expanded:L,owns:this.base.listBoxId,activedescendant:V,ariaDescribedBy:N,"aria-labelledBy":this.$props.ariaLabelledBy,"aria-label":this.$props.ariaLabel,inputAttributes:Z},null)},z=function(){let c;const{groupField:h}=this.$props,S=a.templateRendering.call(this,this.$props.itemRender,a.getListeners.call(this)),F=a.templateRendering.call(this,this.$props.groupHeaderItemRender,a.getListeners.call(this)),k=a.templateRendering.call(this,this.$props.listNoDataRender,a.getListeners.call(this)),V=u?u.skip:0,{focusedIndex:O}=this.getFocusedState(),N=`translateY(${y.translate}px)`;let M=x;return h&&(M=this.base.getGroupedDataModernMode(x,h)),l.createVNode(Ie.List,{id:this.base.listBoxId,show:L,dataItems:M.slice(),focusedIndex:O,value:this.computedValue(),textField:r,valueField:d,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:$?void 0:R.height},wrapperCssClass:"k-list-content",listStyle:y.enabled?{transform:N}:void 0,key:"listKey",skip:V,onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:F,noDataRender:k,groupField:h,onScroll:this.onScroll},A(c=oe.call(this))?c:{default:()=>[c]})},oe=function(){return y.enabled&&l.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},re=function(){const c=this.base,{allowCustom:h}=this.$props,S=a.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,a.getListeners.call(this)),F=c.getTemplateDef.call(this,K),k=c.getTemplateDef.call(this,q),V=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:O}=this.getFocusedState(),N=h&&V&&l.createVNode("div",{class:"k-list",key:"customitem",onClick:this.customItemSelect},[l.createVNode("div",{class:a.classNames("k-item k-custom-item",{"k-focus":Q(O)})},[V,l.createVNode(a.Icon,{name:"plus",icon:U.plusIcon,style:{float:"right"}},null)])]);return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=m.getItemValue(x[0],this.$props.groupField)),l.createVNode(ve.ListContainer,{ref:"container",onMousedown:Te,dir:s!==void 0?s:c.dirCalculated,onBlur:this.handleBlur,width:this.popupWidth,popupSettings:{...R,anchor:this.anchor,show:L,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,popupClass:a.classNames(R.popupClass,"k-list",{[`k-list-${P[o]||o}`]:o,"k-virtual-list":this.base.vs.enabled}),className:a.classNames("k-list-container",R.className)},itemsCount:x.length},{default:()=>[F&&l.createVNode("div",{class:"k-list-header"},[F]),N,this.group&&x.length!==0&&l.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),z.call(this),k&&l.createVNode("div",{class:"k-list-footer"},[k]),u&&K]})},le=function(){const c=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&l.createVNode(xe.ListFilter,{value:c,ref:"filterInput",onChange:this.onChangeHandler,onKeydown:this.onInputKeyDown,size:o,rounded:g,fillMode:f},null)},de=()=>[l.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[l.createVNode("div",{class:"k-actionsheet-title"},[l.createVNode("div",{class:"k-text-center"},[X]),l.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),l.createVNode("div",{class:"k-actionsheet-actions"},[l.createVNode(E.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onCancel,icon:"x",svgIcon:U.xIcon},null)])]),l.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[le.call(this)])],ue=a.templateRendering.call(this,de,a.getListeners.call(this)),ce=()=>{const c=_.toLanguageString(T.adaptiveModeFooterCancel,T.messages[T.adaptiveModeFooterCancel]),h=_.toLanguageString(T.adaptiveModeFooterApply,T.messages[T.adaptiveModeFooterApply]);return[l.createVNode(E.Button,{size:"large","aria-label":c,"aria-disabled":"false",type:"button",onClick:this.onCancel},A(c)?c:{default:()=>[c]}),l.createVNode(E.Button,{themeColor:"primary",size:"large","aria-label":h,"aria-disabled":"false",type:"button",onClick:this.handleWrapperClick},A(h)?h:{default:()=>[h]})]},pe=a.templateRendering.call(this,ce,a.getListeners.call(this)),he=()=>{const c=this.base.getTemplateDef.call(this,K,l.h),h=this.base.getTemplateDef.call(this,q,l.h),S=a.templateRendering.call(this,ee,a.getListeners.call(this));return l.createVNode("div",{class:"k-list-container"},[c&&l.createVNode("div",{class:"k-list-header"},[c]),l.createVNode("div",{class:a.classNames("k-list",{[`k-list-${P[o]||o}`]:$?!1:o,"k-list-lg":!!$,"k-virtual-list":y.enabled})},[this.group&&x.length!==0&&l.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),z.call(this),h&&l.createVNode("div",{class:"k-list-footer"},[h])])])},fe=a.templateRendering.call(this,he,a.getListeners.call(this)),ge=function(){return l.createVNode(Ce.ActionSheet,{expand:L,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",footerClassName:"k-actions k-actions-stretched",header:ue,content:fe,footer:pe,onClose:this.onCancel,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},me=function(){let c;return l.createVNode("span",{ref:a.setRef(this,"kendoAnchor"),class:a.classNames("k-multiselect","k-input",{[`k-input-${P[o]||o}`]:o,[`k-rounded-${Fe[g]||g}`]:g,[`k-input-${f}`]:f,"k-focus":te&&!i,"k-disabled":i,"k-invalid":!ne,"k-loading":p,"k-required":this.required}),style:t?{...e,width:void 0}:e,dir:s,onFocusin:this.handleFocus,onClick:this.handleWrapperClick,onMousedown:m.preventDefaultNonInputs},[l.createVNode(be.TagList,{removeTagIcon:C,tagsRounded:v,size:o,fillMode:f,tagRender:ie,onTagdelete:this.onTagDelete,dataItems:I,guid:this.base.guid,focused:D?I.find(h=>J(h,D,d)):void 0},A(c=ae.call(this,H))?c:{default:()=>[c]}),I.length>0&&se&&l.createVNode(ke.ClearButton,{onClearclick:this.clearButtonClick},null),l.createVNode("span",{class:p?"k-input-loading-icon k-icon k-i-loading":void 0},null),!$&&re.call(this)])},W=[l.h(me.call(this),{...this.$attrs}),$&&ge.call(this)];return t?l.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[W,this.$props.label?H?l.createVNode("label",{for:H,class:"k-floating-label"},[this.$props.label]):l.createVNode("span",{class:"k-label"},[this.$props.label]):null]):W}});exports.MultiSelect=Oe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),a=require("@progress/kendo-vue-common"),ve=require("../common/ListContainer.js"),Ie=require("../common/List.js"),be=require("./TagList.js"),ye=require("../common/SearchBar.js"),Se=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),ke=require("../common/ClearButton.js"),L=require("../common/settings.js"),m=require("../common/utils.js"),U=require("@progress/kendo-svg-icons"),H=require("@progress/kendo-vue-buttons"),Y=require("../common/constants.js"),Ce=require("@progress/kendo-vue-layout"),xe=require("../common/ListFilter.js"),$e=require("@progress/kendo-vue-intl"),T=require("../messages/main.js"),{sizeMap:E,roundedMap:Fe}=a.kendoThemeMaps;function M(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!l.isVNode(e)}const Ve="Please enter a valid value!",Te=e=>e.preventDefault(),J=(e,t,s)=>!!e!=!!t||e.text!==t.text?!1:e===t||m.matchDataCollections(e.data,t.data,s),Q=e=>e===b.CustomItem;var b=(function(e){return e[e.None=0]="None",e[e.ListItem=1]="ListItem",e[e.CustomItem=2]="CustomItem",e})(b||{});const Oe=l.defineComponent({name:"KendoMultiSelect",emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,change:e=>!0,pagechange:e=>!0,focus:e=>!0,blur:e=>!0,open:e=>!0,close:e=>!0,scroll:e=>!0},model:{event:"changemodel"},props:{autoClose:{type:Boolean,default:!0},removeTagIcon:String,allowCustom:Boolean,modelValue:Array,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,label:String,loading:Boolean,name:String,value:Array,defaultValue:Array,valueField:String,valuePrimitive:Boolean,dataItemKey:String,placeholder:String,tags:Array,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validate:{type:Boolean},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},tagRender:[String,Function,Object],id:String,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},itemRender:[String,Function,Object],groupHeaderItemRender:[String,Function,Object],groupStickyHeaderItemRender:[String,Function,Object],listNoDataRender:[String,Function,Object],focusedItemIndex:Function,virtual:{type:Object,default:void 0},header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,rounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},tagsRounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["solid","flat","outline"].includes(e)}},size:{type:String,validator:function(e){return["none","small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},inputAttributes:Object},setup(){const e=l.ref(null),t=l.ref(null),s=l.inject("kendoLocalizationService",{});return{inputRef:e,kendoAnchorRef:t,kendoLocalizationService:s}},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid,t=this.currentText||m.getItemValue(this.computedValue()[0],this.$props.textField);return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!(t&&t!==0),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}},isOpen(){return this.$props.opened!==void 0?this.$props.opened:this.currentOpened},animationStyles(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?{top:0,width:"100%",height:"100%"}:void 0},classNameAdaptive(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"},adaptiveState(){return this.windowWidth<=this.adaptiveModeBreakpoints.medium&&this.$props.adaptive}},created(){this.observer=null,this.valuesItemsDuringOnChange=null,this._tags=[],this._skipFocusEvent=!1,this.scrollToFocused=!1,this.base=new Se(this),this.anchor=a.guid(),this.inputId=a.guid()},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:Y.MOBILE_SMALL_DEVICE,medium:Y.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,currentFocusedIndex:void 0,currentFocusedTag:void 0,searchState:{word:"",last:""},suggested:"",activedescendant:L.ActiveDescendant.PopupList,group:void 0,isScrolling:!1,itemHeight:0,windowWidth:0,popupWidth:void 0,initialAdaptiveRenderingValues:void 0}},watch:{currentOpened:function(e,t){this.prevCurrentOpened=t},opened:function(e,t){this.prevOpened=t},virtual:function(e,t){e&&t&&e.total!==t.total&&(this.virtualTotalHasChanged=!0)},isOpen:function(e){e?this.initialAdaptiveRenderingValues=this.base.component.currentValue:this.initialAdaptiveRenderingValues=void 0,setTimeout(()=>{const t=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(t)},100)}},updated(){var g;const{virtual:e,groupField:t="",dataItems:s=[]}=this.$props,i=e?e.skip:0,n=this.isOpen,r=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,d=!r&&n,u=r&&!n,p=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),o=this.$refs.list,f=this.$refs.scrollElement;if(o&&(this.base.vs.list=o.list,this.base.list=o.list),f&&(this.base.vs.scrollElement=f),o&&s.length&&this.base.vs.scrollerRef(o.$el),!p.animate&&u&&this.onPopupClosed(),!this.isScrolling)if(e&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{let{focusedItem:v,focusedIndex:C}=this.getFocusedState();t!==""&&(C=(g=this.base.getGroupedDataModernMode(s,t))==null?void 0:g.indexOf(v)),d&&e?(this.base.scrollToVirtualItem(e,C-i),this.prevCurrentOpened=!0):d&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][t],this),this.base.scrollToItem(C),this.prevCurrentOpened=!0):n&&r&&v&&this.base.scrollToItem(C-i)}this.scrollToFocused=!1,this.searchBarRef(),this.setValidity()},mounted(){this.observer=a.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.hasMounted=!0,this.input=this.inputRef.input,this.base.wrapper=a.getRef(this,"kendoAnchor"),this.element=a.getRef(this,"kendoAnchor"),this.base.didMount(),this.searchBarRef(),this.setValidity()},methods:{clearFilter(e){this.currentText&&(e.data.currentText=""),this.base.filterChanged("",e)},computedValue(){const e=[];return this.valuesItemsDuringOnChange?e.push(...this.valuesItemsDuringOnChange):this.$props.value?e.push(...this.$props.value):this.$props.modelValue!==void 0?e.push(...this.$props.modelValue):this.currentValue?e.push(...this.currentValue):this.$props.defaultValue&&e.push(...this.$props.defaultValue),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){return t.map(i=>{const n=this.dataItems.findIndex(r=>m.getItemValue(r,e)===i);return this.dataItems[n]||i})},primitiveValue(){const e=this.computedValue(),t=e.map(s=>m.getItemValue(s,this.valueField));return this.valuePrimitive?t:e},validity(){const e=this.$props.validationMessage!==void 0,t=this.computedValue(),s=!this.$props.required||t!==null&&t.length>0&&t!==void 0,i=this.$props.valid!==void 0?this.$props.valid:s;return{customError:e,valid:i,valueMissing:t===null}},handleItemSelect(e,t){const{dataItems:s=[],dataItemKey:i,virtual:n}=this.$props,r=this.computedValue(),d=n?n.skip:0,u=s[e-d],p=r.findIndex(g=>m.areSame(g,u,i));let o=[];p!==-1?(o=r,o.splice(p,1)):o=[...r,u],(this.$props.filter!==void 0?this.$props.filter:this.currentText)&&!this.adaptiveState&&this.clearFilter(t),this.currentFocusedIndex!==void 0&&(t.data.currentFocusedIndex=void 0),this.triggerOnChange(o,t),this.base.triggerPageChangeCornerItems(u,t)},onTagDelete(e,t){const s=this.isOpen,i=this.base.initState();i.event=t,s&&this.base.togglePopup(i),this.currentFocused||(i.data.currentFocused=!0);const n=this.computedValue();m.removeDataItems(n,e,this.$props.dataItemKey),this.triggerOnChange(n,i),this.applyState(i)},onNavigate(e,t){const{allowCustom:s,dataItems:i=[]}=this.$props,n=this.isOpen,r=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:d,focusedIndex:u}=this.getFocusedState(),p=s&&r,o=Q(d),f=this.base,g=f.vs;if(n&&t===a.Keys.up&&o)this.currentFocusedIndex!==void 0&&(e.data.currentFocusedIndex=void 0);else{const v=f.navigation.navigate({keyCode:t,current:u,max:(g.enabled?g.total:i.length)-1,min:p?-1:0});v!==void 0&&(this.itemFocus(v,e),this.scrollToFocused=!0)}this.applyState(e)},itemFocus(e,t){const{dataItems:s=[],allowCustom:i,virtual:n}=this.$props,r=n?n.skip:0,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedIndex:u}=this.getFocusedState(),p=i&&d,o=s[e-r];o&&u!==e?this.currentFocusedIndex!==e&&(t.data.currentFocusedIndex=e,t.data.activedescendant=L.ActiveDescendant.PopupList):p&&e===-1&&this.currentFocusedIndex!==void 0&&(t.data.currentFocusedIndex=void 0),this.base.triggerPageChangeCornerItems(o,t)},searchBarRef(){this.input&&this.currentFocused&&setTimeout(()=>this.input.focus(),0)},onChangeHandler(e){const t=this.base.initState(),s=e&&(e.currentTarget&&e.currentTarget.value||e.value),i=this.isOpen;t.event=e,this.$props.filter===void 0&&(t.data.currentText=s),t.data.currentFocusedIndex=void 0,i||this.base.togglePopup(t),this.base.filterChanged(s,t),this.$props.filterable&&(t.data.group=void 0),this.applyState(t)},clearButtonClick(e){const t=this.isOpen,s=this.base.initState();s.event=e,e.stopPropagation(),this.computedValue().length>0&&this.triggerOnChange([],s),this.currentFocusedIndex!==void 0&&(s.data.currentFocusedIndex=void 0),t&&this.base.togglePopup(s);const i=this.$props.filter!==void 0?this.$props.filter:this.currentText;m.isPresent(i)&&i!==""&&this.base.filterChanged("",s),this.currentText&&(s.data.currentText=""),this.applyState(s)},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,s=this.$props.filter!==void 0?this.$props.filter:this.currentText,i=this.isOpen,{focusedItem:n}=this.getFocusedState(),r=this.base.initState();if(r.event=e,!s&&this.computedValue().length>0&&(t===a.Keys.left||t===a.Keys.right||t===a.Keys.home||t===a.Keys.end||t===a.Keys.delete||t===a.Keys.backspace))return this.onTagsNavigate(e,r);const d=()=>{e.preventDefault(),this.base.togglePopup(r),this.applyState(r)};i?e.altKey&&t===a.Keys.up?d():t===a.Keys.up||t===a.Keys.down?(e.preventDefault(),this.onNavigate(r,t)):t===a.Keys.enter?(e.preventDefault(),this.$props.allowCustom&&s&&n===null?this.customItemSelect(e):this.selectFocusedItem(e)):t===a.Keys.esc&&(this.adaptiveState&&this.handleWrapperClick(e),d()):e.altKey&&t===a.Keys.down&&d()},onTagsNavigate(e,t){const s=e.keyCode,i=this.currentFocusedTag,n=this._tags,r=this.$props.dataItemKey;let d=i?n.findIndex(o=>J(o,i,r)):-1,u;const p=d!==-1;if(s===a.Keys.left)p?d=Math.max(0,d-1):d=n.length-1,u=n[d];else if(s===a.Keys.right)d===n.length-1?u=void 0:p&&(d=Math.min(n.length-1,d+1),u=n[d]);else if(s===a.Keys.home)u=n[0];else if(s===a.Keys.end)u=n[n.length-1];else if(s===a.Keys.delete){if(p){const o=this.computedValue();m.removeDataItems(o,n[d].data,r),this.triggerOnChange(o,t)}}else if(s===a.Keys.backspace){const o=this.computedValue();if(p)m.removeDataItems(o,n[d].data,r),this.triggerOnChange(o,t);else if(!p&&n.length){const f=n.pop();m.removeDataItems(o,f.data,r),this.triggerOnChange(o,t)}}u!==i&&(t.data.currentFocusedTag=u,t.data.activedescendant=L.ActiveDescendant.TagsList),this.applyState(t)},triggerOnChange(e,t){this.$props.value===void 0&&(t.data.currentValue=[...e]),this.valuesItemsDuringOnChange=[],this.setItems(e,this.valuesItemsDuringOnChange),t.events.push({type:"change"})},selectFocusedItem(e){const{dataItems:t=[],virtual:s}=this.$props,{focusedIndex:i}=this.getFocusedState(),n=s?s.skip:0;t[i-n]!==void 0&&this.handleItemClick(i,e)},setItems(e,t){t.length=0,t.push(...e)},getFocusedState(){const e=this.currentFocusedIndex,t=this.$props.filter!==void 0?this.$props.filter:this.currentText,{allowCustom:s,dataItems:i=[],dataItemKey:n,virtual:r,textField:d,focusedItemIndex:u=m.itemIndexStartsWith}=this.$props,p=r&&r.skip||0;let o;if(e!==void 0)return{focusedIndex:e,focusedItem:i[e-p],focusedType:b.ListItem};const f=this.computedValue();if(s&&t)return{focusedItem:null,focusedIndex:-1,focusedType:b.CustomItem};if(t)return o=u(i,t,d),{focusedItem:i[o],focusedIndex:o+p,focusedType:b.ListItem};if(f.length){const g=f[f.length-1];return o=i.findIndex(v=>m.areSame(v,g,n)),i[o]!==void 0?{focusedIndex:o+p,focusedItem:i[o],focusedType:b.ListItem}:{focusedType:b.None,focusedIndex:-1}}return p===0?{focusedItem:i[0],focusedIndex:0,focusedType:b.ListItem}:{focusedType:b.None,focusedIndex:-1}},customItemSelect(e){const t=this.$props.filter!==void 0?this.$props.filter:this.currentText,{textField:s}=this.$props;if(!t)return;const i=this.base.initState();i.event=e;const n=s?{[s]:t}:t;this.currentText!==void 0&&(i.data.currentText=""),i.data.currentFocusedIndex=void 0,this.base.filterChanged("",i);const r=[...this.computedValue(),n];this.triggerOnChange(r,i),this.base.togglePopup(i),this.applyState(i)},handleWrapperClick(e){const t=this.isOpen,s=this.input;!t&&s&&this.focusElement(s);const i=this.base.initState();i.event=e,this.currentFocused||(i.events.push({type:"focus"}),i.data.currentFocused=!0),this.clearFilter(i),this.base.togglePopup(i),this.applyState(i)},onCancel(e){const t=this.base.initState();t.event=e,e.stopPropagation();const s=this.isOpen;t.focusedIndex!==void 0&&(t.data.focusedIndex=void 0),s&&this.base.togglePopup(t),t.events.push({type:"onCancel"}),this.clearFilter(t),this.triggerOnChange([...this.initialAdaptiveRenderingValues],t),this.base.triggerPageChangeCornerItems([...this.initialAdaptiveRenderingValues],t),this.applyState(t)},handleItemClick(e,t){const s=this.base.initState();s.event=t,this.handleItemSelect(e,s),this.$props.autoClose&&!this.adaptiveState&&this.base.togglePopup(s),this.applyState(s)},handleBlur(e){if(!this.currentFocused||this._skipFocusEvent)return;const t=this.isOpen,s=this.base.initState(),{allowCustom:i,filterable:n}=this.$props;s.event=e,s.data.currentFocused=!1,s.events.push({type:"blur"}),t&&!this.adaptiveState&&(this.currentOpened&&(s.data.currentOpened=!1),s.events.push({type:"close"})),!i&&!n&&this.currentText&&(s.data.currentText=""),this.applyState(s)},handleFocus(e){this._skipFocusEvent||this.base.handleFocus(e)},onPopupOpened(){this.input&&this.currentFocused&&this.focusElement(this.input)},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.focusElement(this.input)},0)},focusElement(e){this._skipFocusEvent=!0,e.focus(),setTimeout(()=>this._skipFocusEvent=!1,30)},applyState(e){this.base.applyState(e),this.valuesItemsDuringOnChange=null},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Ve)},focus(){this.input&&this.input.focus()},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){var g;this.isScrolling=!0;const{vs:t,list:s}=this.base;t.scrollHandler(e);const i=this.base.initState(),{groupField:n}=this.$props;let{dataItems:r=[]}=this.$props,d;if(!n||!r.length)return;const u=s&&((g=s.querySelector(".k-list-item"))==null?void 0:g.offsetHeight)||0,p=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:u),f=e.target.scrollTop-t.skip*p;n&&(r=this.base.getGroupedDataModernMode(r,n),r=this.base.getGroupedDataModernMode(r,n),d=r[0][n]);for(let v=1;v<r.length&&!(p*v>f);v++)r[v]&&r[v][n]&&(d=r[v][n]);d!==this.group&&(i.data.group=d,this.applyState(i))}},render(){const{style:e,label:t,dir:s,disabled:i,tags:n,textField:r,dataItemKey:d,virtual:u,loading:p,size:o,fillMode:f,rounded:g,tagsRounded:v,removeTagIcon:C,adaptiveTitle:X,header:w,footer:P,inputAttributes:Z,groupStickyHeaderItemRender:ee,dataItems:x=[]}=this.$props,te=this.currentFocused,N=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),R=this.currentFocusedTag,q=this.computedValue(),D=(this.$props.filter!==void 0?this.$props.filter:this.currentText)||"",se=!p&&(!!D||q.length>0),y=this.base.vs,A=this.$props.id||this.inputId,ie=a.templateRendering.call(this,this.$props.tagRender,a.getListeners.call(this)),B=this.isOpen,$=this.adaptiveState,j=$e.provideLocalizationService(this);this.group===void 0&&this.$props.groupField!==void 0&&(this.group=m.getItemValue(this.$props.dataItems[0],this.$props.groupField)),y.enabled=u!==void 0,u!==void 0&&(y.skip=u.skip,y.total=u.total,y.pageSize=u.pageSize);let I=[];this.initialAdaptiveRenderingValues?[...this.initialAdaptiveRenderingValues].forEach(h=>{I.push({text:m.getItemValue(h,r),data:[h]})}):n===void 0?this.computedValue().forEach(c=>{I.push({text:m.getItemValue(c,r),data:[c]})}):I.push(...n),I.length>0&&this.setItems(I,this._tags);const ne=!this.$props.validityStyles||this.validity().valid,ae=function(c){const h=this.activedescendant,{placeholder:S}=this.$props,{focusedIndex:F}=this.getFocusedState(),k=I.length===0||q.length===0&&!D?S:void 0,V=h===L.ActiveDescendant.TagsList&&R!==void 0?`tag-${this.base.guid}-${R.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${F}`;return l.createVNode(ye.SearchBar,{id:c,size:Math.max((k||"").length,D.length,1),tabIndex:this.$props.tabIndex,accessKey:this.$props.accessKey,placeholder:k,value:$?"":D,onChange:this.onChangeHandler,onBlur:this.handleBlur,onKeydown:this.onInputKeyDown,ref:O=>{this.inputRef=O},disabled:i,expanded:B,owns:this.base.listBoxId,activedescendant:V,"aria-describedBy":`tagslist-${this.base.guid}${this.$props.ariaDescribedBy?" "+this.$props.ariaDescribedBy:""}`,"aria-labelledBy":this.$props.ariaLabelledBy,"aria-label":this.$props.ariaLabel,inputAttributes:Z},null)},_=function(){let c;const{groupField:h}=this.$props,S=a.templateRendering.call(this,this.$props.itemRender,a.getListeners.call(this)),F=a.templateRendering.call(this,this.$props.groupHeaderItemRender,a.getListeners.call(this)),k=a.templateRendering.call(this,this.$props.listNoDataRender,a.getListeners.call(this)),V=u?u.skip:0,{focusedIndex:O}=this.getFocusedState(),K=`translateY(${y.translate}px)`;let W=x;return h&&(W=this.base.getGroupedDataModernMode(x,h)),l.createVNode(Ie.List,{id:this.base.listBoxId,show:B,dataItems:W.slice(),focusedIndex:O,value:this.computedValue(),textField:r,valueField:d,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:$?void 0:N.height},wrapperCssClass:"k-list-content",listStyle:y.enabled?{transform:K}:void 0,key:"listKey",skip:V,onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:F,noDataRender:k,groupField:h,onScroll:this.onScroll},M(c=oe.call(this))?c:{default:()=>[c]})},oe=function(){return y.enabled&&l.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},re=function(){const c=this.base,{allowCustom:h}=this.$props,S=a.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,a.getListeners.call(this)),F=c.getTemplateDef.call(this,w),k=c.getTemplateDef.call(this,P),V=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:O}=this.getFocusedState(),K=h&&V&&l.createVNode("div",{class:"k-list",key:"customitem",onClick:this.customItemSelect},[l.createVNode("div",{class:a.classNames("k-item k-custom-item",{"k-focus":Q(O)})},[V,l.createVNode(a.Icon,{name:"plus",icon:U.plusIcon,style:{float:"right"}},null)])]);return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=m.getItemValue(x[0],this.$props.groupField)),l.createVNode(ve.ListContainer,{ref:"container",onMousedown:Te,dir:s!==void 0?s:c.dirCalculated,onBlur:this.handleBlur,width:this.popupWidth,popupSettings:{...N,anchor:this.anchor,show:B,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,popupClass:a.classNames(N.popupClass,"k-list",{[`k-list-${E[o]||o}`]:o,"k-virtual-list":this.base.vs.enabled}),className:a.classNames("k-list-container",N.className)},itemsCount:x.length},{default:()=>[F&&l.createVNode("div",{class:"k-list-header"},[F]),K,this.group&&x.length!==0&&l.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),_.call(this),k&&l.createVNode("div",{class:"k-list-footer"},[k]),u&&w]})},le=function(){const c=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&l.createVNode(xe.ListFilter,{value:c,ref:"filterInput",onChange:this.onChangeHandler,onKeydown:this.onInputKeyDown,size:o,rounded:g,fillMode:f},null)},de=()=>[l.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[l.createVNode("div",{class:"k-actionsheet-title"},[l.createVNode("div",{class:"k-text-center"},[X]),l.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),l.createVNode("div",{class:"k-actionsheet-actions"},[l.createVNode(H.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onCancel,icon:"x",svgIcon:U.xIcon},null)])]),l.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[le.call(this)])],ue=a.templateRendering.call(this,de,a.getListeners.call(this)),ce=()=>{const c=j.toLanguageString(T.adaptiveModeFooterCancel,T.messages[T.adaptiveModeFooterCancel]),h=j.toLanguageString(T.adaptiveModeFooterApply,T.messages[T.adaptiveModeFooterApply]);return[l.createVNode(H.Button,{size:"large","aria-label":c,"aria-disabled":"false",type:"button",onClick:this.onCancel},M(c)?c:{default:()=>[c]}),l.createVNode(H.Button,{themeColor:"primary",size:"large","aria-label":h,"aria-disabled":"false",type:"button",onClick:this.handleWrapperClick},M(h)?h:{default:()=>[h]})]},pe=a.templateRendering.call(this,ce,a.getListeners.call(this)),he=()=>{const c=this.base.getTemplateDef.call(this,w,l.h),h=this.base.getTemplateDef.call(this,P,l.h),S=a.templateRendering.call(this,ee,a.getListeners.call(this));return l.createVNode("div",{class:"k-list-container"},[c&&l.createVNode("div",{class:"k-list-header"},[c]),l.createVNode("div",{class:a.classNames("k-list",{[`k-list-${E[o]||o}`]:$?!1:o,"k-list-lg":!!$,"k-virtual-list":y.enabled})},[this.group&&x.length!==0&&l.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),_.call(this),h&&l.createVNode("div",{class:"k-list-footer"},[h])])])},fe=a.templateRendering.call(this,he,a.getListeners.call(this)),ge=function(){return l.createVNode(Ce.ActionSheet,{expand:B,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",footerClassName:"k-actions k-actions-stretched",header:ue,content:fe,footer:pe,onClose:this.onCancel,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},me=function(){let c;return l.createVNode("span",{ref:a.setRef(this,"kendoAnchor"),class:a.classNames("k-multiselect","k-input",{[`k-input-${E[o]||o}`]:o,[`k-rounded-${Fe[g]||g}`]:g,[`k-input-${f}`]:f,"k-focus":te&&!i,"k-disabled":i,"k-invalid":!ne,"k-loading":p,"k-required":this.required}),style:t?{...e,width:void 0}:e,dir:s,onFocusin:this.handleFocus,onClick:this.handleWrapperClick,onMousedown:m.preventDefaultNonInputs},[l.createVNode(be.TagList,{removeTagIcon:C,tagsRounded:v,size:o,fillMode:f,tagRender:ie,onTagdelete:this.onTagDelete,dataItems:I,guid:this.base.guid,focused:R?I.find(h=>J(h,R,d)):void 0},M(c=ae.call(this,A))?c:{default:()=>[c]}),I.length>0&&se&&l.createVNode(ke.ClearButton,{onClearclick:this.clearButtonClick},null),l.createVNode("span",{class:p?"k-input-loading-icon k-icon k-i-loading":void 0},null),!$&&re.call(this)])},z=[l.h(me.call(this),{...this.$attrs}),$&&ge.call(this)];return t?l.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[z,this.$props.label?A?l.createVNode("label",{for:A,class:"k-floating-label"},[this.$props.label]):l.createVNode("span",{class:"k-label"},[this.$props.label]):null]):z}});exports.MultiSelect=Oe;

package/MultiSelect/MultiSelect.mjs

@@ -5,29 +5,29 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as $e, h as j, createVNode as l, ref as Q, inject as Fe, isVNode as Te } from "vue";
-import { templateRendering as b, getListeners as I, Keys as f, canUseDOM as Oe, getRef as X, guid as Z, classNames as w, kendoThemeMaps as De, setRef as Ve, Icon as Be } from "@progress/kendo-vue-common";
-import { ListContainer as we } from "../common/ListContainer.mjs";
-import { List as Re } from "../common/List.mjs";
+import { defineComponent as $e, h as _, createVNode as l, ref as Q, inject as Fe, isVNode as Te } from "vue";
+import { templateRendering as b, getListeners as I, Keys as f, canUseDOM as Oe, getRef as X, guid as Z, classNames as R, kendoThemeMaps as Ve, setRef as we, Icon as Re } from "@progress/kendo-vue-common";
+import { ListContainer as De } from "../common/ListContainer.mjs";
+import { List as Be } from "../common/List.mjs";
 import { TagList as Me } from "./TagList.mjs";
 import { SearchBar as Ae } from "../common/SearchBar.mjs";
 import Le from "../common/DropDownBase.mjs";
 import { GroupStickyHeader as ee } from "../common/GroupStickyHeader.mjs";
 import { ClearButton as He } from "../common/ClearButton.mjs";
-import { ActiveDescendant as E } from "../common/settings.mjs";
-import { getItemValue as C, itemIndexStartsWith as Ee, areSame as te, removeDataItems as P, isPresent as Pe, preventDefaultNonInputs as Ne, matchDataCollections as Ke } from "../common/utils.mjs";
+import { ActiveDescendant as L } from "../common/settings.mjs";
+import { getItemValue as x, itemIndexStartsWith as Ee, areSame as te, removeDataItems as H, isPresent as Pe, preventDefaultNonInputs as Ne, matchDataCollections as Ke } from "../common/utils.mjs";
 import { xIcon as _e, plusIcon as je } from "@progress/kendo-svg-icons";
-import { Button as z } from "@progress/kendo-vue-buttons";
+import { Button as j } from "@progress/kendo-vue-buttons";
 import { MOBILE_MEDIUM_DEVICE as ze, MOBILE_SMALL_DEVICE as We } from "../common/constants.mjs";
 import { ActionSheet as Ge } from "@progress/kendo-vue-layout";
 import { ListFilter as qe } from "../common/ListFilter.mjs";
 import { provideLocalizationService as Ue } from "@progress/kendo-vue-intl";
 import { adaptiveModeFooterCancel as se, messages as ie, adaptiveModeFooterApply as ne } from "../messages/main.mjs";
 const {
-  sizeMap: W,
+  sizeMap: z,
   roundedMap: Ye
-} = De;
-function N(e) {
+} = Ve;
+function E(e) {
   return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !Te(e);
 }
 const Je = "Please enter a valid value!", Qe = (e) => e.preventDefault(), ae = (e, t, s) => !!e != !!t || e.text !== t.text ? !1 : e === t || Ke(e.data, t.data, s), oe = (e) => e === S.CustomItem;
@@ -182,7 +182,7 @@ const vt = /* @__PURE__ */ $e({
   },
   computed: {
     spanClassNames() {
-      const e = !this.hasMounted || !this.$props.validityStyles || this.validity().valid, t = this.currentText || C(this.computedValue()[0], this.$props.textField);
+      const e = !this.hasMounted || !this.$props.validityStyles || this.validity().valid, t = this.currentText || x(this.computedValue()[0], this.$props.textField);
       return {
         "k-floating-label-container": !0,
         "k-focus": this.currentFocused,
@@ -236,7 +236,7 @@ const vt = /* @__PURE__ */ $e({
         last: ""
       },
       suggested: "",
-      activedescendant: E.PopupList,
+      activedescendant: L.PopupList,
       group: void 0,
       isScrolling: !1,
       itemHeight: 0,
@@ -297,12 +297,12 @@ const vt = /* @__PURE__ */ $e({
     },
     findByFieldValue(e, t) {
       return t.map((i) => {
-        const n = this.dataItems.findIndex((o) => C(o, e) === i);
+        const n = this.dataItems.findIndex((o) => x(o, e) === i);
         return this.dataItems[n] || i;
       });
     },
     primitiveValue() {
-      const e = this.computedValue(), t = e.map((s) => C(s, this.valueField));
+      const e = this.computedValue(), t = e.map((s) => x(s, this.valueField));
       return this.valuePrimitive ? t : e;
     },
     validity() {
@@ -326,7 +326,7 @@ const vt = /* @__PURE__ */ $e({
       const s = this.isOpen, i = this.base.initState();
       i.event = t, s && this.base.togglePopup(i), this.currentFocused || (i.data.currentFocused = !0);
       const n = this.computedValue();
-      P(n, e, this.$props.dataItemKey), this.triggerOnChange(n, i), this.applyState(i);
+      H(n, e, this.$props.dataItemKey), this.triggerOnChange(n, i), this.applyState(i);
     },
     onNavigate(e, t) {
       const {
@@ -357,7 +357,7 @@ const vt = /* @__PURE__ */ $e({
       } = this.$props, o = n ? n.skip : 0, r = this.$props.filter !== void 0 ? this.$props.filter : this.currentText, {
         focusedIndex: d
       } = this.getFocusedState(), c = i && r, a = s[e - o];
-      a && d !== e ? this.currentFocusedIndex !== e && (t.data.currentFocusedIndex = e, t.data.activedescendant = E.PopupList) : c && e === -1 && this.currentFocusedIndex !== void 0 && (t.data.currentFocusedIndex = void 0), this.base.triggerPageChangeCornerItems(a, t);
+      a && d !== e ? this.currentFocusedIndex !== e && (t.data.currentFocusedIndex = e, t.data.activedescendant = L.PopupList) : c && e === -1 && this.currentFocusedIndex !== void 0 && (t.data.currentFocusedIndex = void 0), this.base.triggerPageChangeCornerItems(a, t);
     },
     searchBarRef() {
       this.input && this.currentFocused && setTimeout(() => this.input.focus(), 0);
@@ -399,18 +399,18 @@ const vt = /* @__PURE__ */ $e({
       else if (s === f.delete) {
         if (c) {
           const a = this.computedValue();
-          P(a, n[r].data, o), this.triggerOnChange(a, t);
+          H(a, n[r].data, o), this.triggerOnChange(a, t);
         }
       } else if (s === f.backspace) {
         const a = this.computedValue();
         if (c)
-          P(a, n[r].data, o), this.triggerOnChange(a, t);
+          H(a, n[r].data, o), this.triggerOnChange(a, t);
         else if (!c && n.length) {
           const h = n.pop();
-          P(a, h.data, o), this.triggerOnChange(a, t);
+          H(a, h.data, o), this.triggerOnChange(a, t);
         }
       }
-      d !== i && (t.data.currentFocusedTag = d, t.data.activedescendant = E.TagsList), this.applyState(t);
+      d !== i && (t.data.currentFocusedTag = d, t.data.activedescendant = L.TagsList), this.applyState(t);
     },
     triggerOnChange(e, t) {
       this.$props.value === void 0 && (t.data.currentValue = [...e]), this.valuesItemsDuringOnChange = [], this.setItems(e, this.valuesItemsDuringOnChange), t.events.push({
@@ -596,25 +596,25 @@ const vt = /* @__PURE__ */ $e({
       tagsRounded: m,
       removeTagIcon: $,
       adaptiveTitle: re,
-      header: K,
-      footer: G,
+      header: P,
+      footer: W,
       inputAttributes: le,
       groupStickyHeaderItemRender: de,
       dataItems: F = []
-    } = this.$props, ue = this.currentFocused, R = Object.assign({}, {
+    } = this.$props, ue = this.currentFocused, D = Object.assign({}, {
       animate: !0,
       height: "200px"
-    }, this.$props.popupSettings), M = this.currentFocusedTag, q = this.computedValue(), A = (this.$props.filter !== void 0 ? this.$props.filter : this.currentText) || "", ce = !c && !i && (!!A || q.length > 0), y = this.base.vs, _ = this.$props.id || this.inputId, pe = b.call(this, this.$props.tagRender, I.call(this)), L = this.isOpen, T = this.adaptiveState, U = Ue(this);
-    this.group === void 0 && this.$props.groupField !== void 0 && (this.group = C(this.$props.dataItems[0], this.$props.groupField)), y.enabled = d !== void 0, d !== void 0 && (y.skip = d.skip, y.total = d.total, y.pageSize = d.pageSize);
+    }, this.$props.popupSettings), B = this.currentFocusedTag, G = this.computedValue(), M = (this.$props.filter !== void 0 ? this.$props.filter : this.currentText) || "", ce = !c && (!!M || G.length > 0), y = this.base.vs, N = this.$props.id || this.inputId, pe = b.call(this, this.$props.tagRender, I.call(this)), A = this.isOpen, T = this.adaptiveState, q = Ue(this);
+    this.group === void 0 && this.$props.groupField !== void 0 && (this.group = x(this.$props.dataItems[0], this.$props.groupField)), y.enabled = d !== void 0, d !== void 0 && (y.skip = d.skip, y.total = d.total, y.pageSize = d.pageSize);
     let v = [];
     this.initialAdaptiveRenderingValues ? [...this.initialAdaptiveRenderingValues].forEach((p) => {
       v.push({
-        text: C(p, o),
+        text: x(p, o),
         data: [p]
       });
     }) : n === void 0 ? this.computedValue().forEach((u) => {
       v.push({
-        text: C(u, o),
+        text: x(u, o),
         data: [u]
       });
     }) : v.push(...n), v.length > 0 && this.setItems(v, this._tags);
@@ -623,63 +623,63 @@ const vt = /* @__PURE__ */ $e({
         placeholder: k
       } = this.$props, {
         focusedIndex: O
-      } = this.getFocusedState(), x = v.length === 0 || q.length === 0 && !A ? k : void 0, D = p === E.TagsList && M !== void 0 ? `tag-${this.base.guid}-${M.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${O}`, V = this.$props.ariaDescribedBy ? " " + this.$props.ariaDescribedBy : "", B = v.length > 0 ? `tagslist-${this.base.guid}${V}` : this.$props.ariaDescribedBy;
+      } = this.getFocusedState(), C = v.length === 0 || G.length === 0 && !M ? k : void 0, V = p === L.TagsList && B !== void 0 ? `tag-${this.base.guid}-${B.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${O}`;
       return l(Ae, {
         id: u,
-        size: Math.max((x || "").length, A.length, 1),
+        size: Math.max((C || "").length, M.length, 1),
         tabIndex: this.$props.tabIndex,
         accessKey: this.$props.accessKey,
-        placeholder: x,
-        value: T ? "" : A,
+        placeholder: C,
+        value: T ? "" : M,
         onChange: this.onChangeHandler,
         onBlur: this.handleBlur,
         onKeydown: this.onInputKeyDown,
-        ref: (H) => {
-          this.inputRef = H;
+        ref: (w) => {
+          this.inputRef = w;
         },
         disabled: i,
-        expanded: L,
+        expanded: A,
         owns: this.base.listBoxId,
-        activedescendant: D,
-        ariaDescribedBy: B,
+        activedescendant: V,
+        "aria-describedBy": `tagslist-${this.base.guid}${this.$props.ariaDescribedBy ? " " + this.$props.ariaDescribedBy : ""}`,
         "aria-labelledBy": this.$props.ariaLabelledBy,
         "aria-label": this.$props.ariaLabel,
         inputAttributes: le
       }, null);
-    }, Y = function() {
+    }, U = function() {
       let u;
       const {
         groupField: p
-      } = this.$props, k = b.call(this, this.$props.itemRender, I.call(this)), O = b.call(this, this.$props.groupHeaderItemRender, I.call(this)), x = b.call(this, this.$props.listNoDataRender, I.call(this)), D = d ? d.skip : 0, {
-        focusedIndex: V
-      } = this.getFocusedState(), B = `translateY(${y.translate}px)`;
-      let H = F;
-      return p && (H = this.base.getGroupedDataModernMode(F, p)), l(Re, {
+      } = this.$props, k = b.call(this, this.$props.itemRender, I.call(this)), O = b.call(this, this.$props.groupHeaderItemRender, I.call(this)), C = b.call(this, this.$props.listNoDataRender, I.call(this)), V = d ? d.skip : 0, {
+        focusedIndex: w
+      } = this.getFocusedState(), K = `translateY(${y.translate}px)`;
+      let J = F;
+      return p && (J = this.base.getGroupedDataModernMode(F, p)), l(Be, {
         id: this.base.listBoxId,
-        show: L,
-        dataItems: H.slice(),
-        focusedIndex: V,
+        show: A,
+        dataItems: J.slice(),
+        focusedIndex: w,
         value: this.computedValue(),
         textField: o,
         valueField: r,
         optionsGuid: this.base.guid,
         ref: "list",
         wrapperStyle: {
-          maxHeight: T ? void 0 : R.height
+          maxHeight: T ? void 0 : D.height
         },
         wrapperCssClass: "k-list-content",
         listStyle: y.enabled ? {
-          transform: B
+          transform: K
         } : void 0,
         key: "listKey",
-        skip: D,
+        skip: V,
         onListclick: this.handleItemClick,
         itemRender: k,
         groupHeaderItemRender: O,
-        noDataRender: x,
+        noDataRender: C,
         groupField: p,
         onScroll: this.onScroll
-      }, N(u = ge.call(this)) ? u : {
+      }, E(u = ge.call(this)) ? u : {
         default: () => [u]
       });
     }, ge = function() {
@@ -690,51 +690,51 @@ const vt = /* @__PURE__ */ $e({
     }, me = function() {
       const u = this.base, {
         allowCustom: p
-      } = this.$props, k = b.call(this, this.$props.groupStickyHeaderItemRender, I.call(this)), O = u.getTemplateDef.call(this, K), x = u.getTemplateDef.call(this, G), D = this.$props.filter !== void 0 ? this.$props.filter : this.currentText, {
-        focusedType: V
-      } = this.getFocusedState(), B = p && D && l("div", {
+      } = this.$props, k = b.call(this, this.$props.groupStickyHeaderItemRender, I.call(this)), O = u.getTemplateDef.call(this, P), C = u.getTemplateDef.call(this, W), V = this.$props.filter !== void 0 ? this.$props.filter : this.currentText, {
+        focusedType: w
+      } = this.getFocusedState(), K = p && V && l("div", {
         class: "k-list",
         key: "customitem",
         onClick: this.customItemSelect
       }, [l("div", {
-        class: w("k-item k-custom-item", {
-          "k-focus": oe(V)
+        class: R("k-item k-custom-item", {
+          "k-focus": oe(w)
         })
-      }, [D, l(Be, {
+      }, [V, l(Re, {
         name: "plus",
         icon: je,
         style: {
           float: "right"
         }
       }, null)])]);
-      return this.group === void 0 && this.$props.groupField !== void 0 && (this.group = C(F[0], this.$props.groupField)), l(we, {
+      return this.group === void 0 && this.$props.groupField !== void 0 && (this.group = x(F[0], this.$props.groupField)), l(De, {
         ref: "container",
         onMousedown: Qe,
         dir: s !== void 0 ? s : u.dirCalculated,
         onBlur: this.handleBlur,
         width: this.popupWidth,
         popupSettings: {
-          ...R,
+          ...D,
           anchor: this.anchor,
-          show: L,
+          show: A,
           onOpen: this.onPopupOpened,
           onClose: this.onPopupClosed,
-          popupClass: w(R.popupClass, "k-list", {
-            [`k-list-${W[a] || a}`]: a,
+          popupClass: R(D.popupClass, "k-list", {
+            [`k-list-${z[a] || a}`]: a,
             "k-virtual-list": this.base.vs.enabled
           }),
-          className: w("k-list-container", R.className)
+          className: R("k-list-container", D.className)
         },
         itemsCount: F.length
       }, {
         default: () => [O && l("div", {
           class: "k-list-header"
-        }, [O]), B, this.group && F.length !== 0 && l(ee, {
+        }, [O]), K, this.group && F.length !== 0 && l(ee, {
           group: this.group,
           render: k
-        }, null), Y.call(this), x && l("div", {
+        }, null), U.call(this), C && l("div", {
           class: "k-list-footer"
-        }, [x]), d && K]
+        }, [C]), d && P]
       });
     }, ve = function() {
       const u = this.$props.filter !== void 0 ? this.$props.filter : this.currentText;
@@ -757,7 +757,7 @@ const vt = /* @__PURE__ */ $e({
       class: "k-actionsheet-subtitle k-text-center"
     }, null)]), l("div", {
       class: "k-actionsheet-actions"
-    }, [l(z, {
+    }, [l(j, {
       tabIndex: 5,
       "aria-label": "Cancel",
       "aria-disabled": "false",
@@ -769,63 +769,63 @@ const vt = /* @__PURE__ */ $e({
     }, null)])]), l("div", {
       class: "k-actionsheet-titlebar-group k-actionsheet-filter"
     }, [ve.call(this)])], Ie = b.call(this, be, I.call(this)), Se = () => {
-      const u = U.toLanguageString(se, ie[se]), p = U.toLanguageString(ne, ie[ne]);
-      return [l(z, {
+      const u = q.toLanguageString(se, ie[se]), p = q.toLanguageString(ne, ie[ne]);
+      return [l(j, {
         size: "large",
         "aria-label": u,
         "aria-disabled": "false",
         type: "button",
         onClick: this.onCancel
-      }, N(u) ? u : {
+      }, E(u) ? u : {
         default: () => [u]
-      }), l(z, {
+      }), l(j, {
         themeColor: "primary",
         size: "large",
         "aria-label": p,
         "aria-disabled": "false",
         type: "button",
         onClick: this.handleWrapperClick
-      }, N(p) ? p : {
+      }, E(p) ? p : {
         default: () => [p]
       })];
     }, ye = b.call(this, Se, I.call(this)), ke = () => {
-      const u = this.base.getTemplateDef.call(this, K, j), p = this.base.getTemplateDef.call(this, G, j), k = b.call(this, de, I.call(this));
+      const u = this.base.getTemplateDef.call(this, P, _), p = this.base.getTemplateDef.call(this, W, _), k = b.call(this, de, I.call(this));
       return l("div", {
         class: "k-list-container"
       }, [u && l("div", {
         class: "k-list-header"
       }, [u]), l("div", {
-        class: w("k-list", {
-          [`k-list-${W[a] || a}`]: T ? !1 : a,
+        class: R("k-list", {
+          [`k-list-${z[a] || a}`]: T ? !1 : a,
           "k-list-lg": !!T,
           "k-virtual-list": y.enabled
         })
       }, [this.group && F.length !== 0 && l(ee, {
         group: this.group,
         render: k
-      }, null), Y.call(this), p && l("div", {
+      }, null), U.call(this), p && l("div", {
         class: "k-list-footer"
       }, [p])])]);
-    }, xe = b.call(this, ke, I.call(this)), Ce = function() {
+    }, Ce = b.call(this, ke, I.call(this)), xe = function() {
       return l(Ge, {
-        expand: L,
+        expand: A,
         animation: !0,
         animationStyles: this.animationStyles,
         className: this.classNameAdaptive,
         contentClassName: "!k-overflow-hidden",
         footerClassName: "k-actions k-actions-stretched",
         header: Ie,
-        content: xe,
+        content: Ce,
         footer: ye,
         onClose: this.onCancel,
         navigatableElements: ["input.k-input-inner", ".k-actionsheet-actions > button"]
       }, null);
-    }, J = [j(function() {
+    }, Y = [_(function() {
       let u;
       return l("span", {
-        ref: Ve(this, "kendoAnchor"),
-        class: w("k-multiselect", "k-input", {
-          [`k-input-${W[a] || a}`]: a,
+        ref: we(this, "kendoAnchor"),
+        class: R("k-multiselect", "k-input", {
+          [`k-input-${z[a] || a}`]: a,
           [`k-rounded-${Ye[g] || g}`]: g,
           [`k-input-${h}`]: h,
           "k-focus": ue && !i,
@@ -851,8 +851,8 @@ const vt = /* @__PURE__ */ $e({
         onTagdelete: this.onTagDelete,
         dataItems: v,
         guid: this.base.guid,
-        focused: M ? v.find((p) => ae(p, M, r)) : void 0
-      }, N(u = fe.call(this, _)) ? u : {
+        focused: B ? v.find((p) => ae(p, B, r)) : void 0
+      }, E(u = fe.call(this, N)) ? u : {
         default: () => [u]
       }), v.length > 0 && ce && l(He, {
         onClearclick: this.clearButtonClick
@@ -861,16 +861,16 @@ const vt = /* @__PURE__ */ $e({
       }, null), !T && me.call(this)]);
     }.call(this), {
       ...this.$attrs
-    }), T && Ce.call(this)];
+    }), T && xe.call(this)];
     return t ? l("span", {
       class: this.spanClassNames,
       dir: this.$props.dir
-    }, [J, this.$props.label ? _ ? l("label", {
-      for: _,
+    }, [Y, this.$props.label ? N ? l("label", {
+      for: N,
       class: "k-floating-label"
     }, [this.$props.label]) : l("span", {
       class: "k-label"
-    }, [this.$props.label]) : null]) : J;
+    }, [this.$props.label]) : null]) : Y;
   }
 });
 export {

package/MultiSelect/TagList.js

@@ -5,4 +5,4 @@
  * 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"),n=require("@progress/kendo-vue-common"),v=require("@progress/kendo-vue-buttons"),S=e=>e.preventDefault(),b=e=>e.event.stopPropagation(),T=i.defineComponent({name:"TagList",inheritAttrs:!1,props:{removeTagIcon:String,dataItems:Array,guid:String,focused:Object,tagRender:[String,Function,Object],tagsRounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["solid","flat","outline"].includes(e)}},id:String,className:String,size:{type:String,validator:function(e){return["small","medium","large"].includes(e)}},onTagdelete:Function},computed:{wrapperClass(){const{size:e,disabled:t}=this.$props;return{"k-chip-list":!0,[`k-chip-list-${n.kendoThemeMaps.sizeMap[e]||e}`]:e,"k-disabled":t}}},methods:{onTagDelete(e,t){this.$emit("tagdelete",e,t)}},render(){const e=n.getDefaultSlots(this),{dataItems:t,guid:o,size:l,disabled:d,tagsRounded:u,removeTagIcon:c,id:p,className:g}=this.$props;return i.createVNode("div",{class:n.classNames("k-input-values",g),id:p,style:this.$attrs.style},[i.createVNode("div",{class:this.wrapperClass,role:"listbox","aria-label":"chip list","aria-orientation":"horizontal",id:"tagslist-"+o},[t.map(function(s,a){const m=`tag-${o}-${s.text.toString().replace(/\s+/g,"-")}`,r=s===this.$props.focused,h=i.createVNode(v.Chip,{id:m,tabIndex:-1,"aria-selected":r,role:"option","aria-setsize":t.length,key:s.text+a,text:s.text,disabled:d,removable:!0,onRemove:f=>this.onTagDelete(s.data,f),removeIcon:c,onMousedown:S,onClick:b,class:r?"k-focus":void 0,rounded:u,size:l},null);return n.getTemplate.call(this,{h:i.h,template:this.$props.tagRender,defaultRendering:h,additionalProps:{...this.$props,tagData:s,index:a},additionalListeners:{tagdelete:this.onTagDelete}})},this)]),e])}});exports.TagList=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("vue"),n=require("@progress/kendo-vue-common"),v=require("@progress/kendo-vue-buttons"),S=e=>e.preventDefault(),T=e=>e.event.stopPropagation(),b=i.defineComponent({name:"TagList",inheritAttrs:!1,props:{removeTagIcon:String,dataItems:Array,guid:String,focused:Object,tagRender:[String,Function,Object],tagsRounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["solid","flat","outline"].includes(e)}},id:String,className:String,size:{type:String,validator:function(e){return["small","medium","large"].includes(e)}},onTagdelete:Function},computed:{wrapperClass(){const{size:e,disabled:t}=this.$props;return{"k-chip-list":!0,[`k-chip-list-${n.kendoThemeMaps.sizeMap[e]||e}`]:e,"k-disabled":t}}},methods:{onTagDelete(e,t){this.$emit("tagdelete",e,t)}},render(){const e=n.getDefaultSlots(this),{dataItems:t,guid:o,size:d,disabled:l,tagsRounded:u,removeTagIcon:c,id:p,className:g}=this.$props;return i.createVNode("div",{class:n.classNames("k-input-values",g),id:p,style:this.$attrs.style},[i.createVNode("div",{class:this.wrapperClass,role:"listbox",id:"tagslist-"+o},[t.map(function(s,r){const m=`tag-${o}-${s.text.toString().replace(/\s+/g,"-")}`,a=s===this.$props.focused,h=i.createVNode(v.Chip,{id:m,tabIndex:-1,"aria-selected":a,role:"option","aria-setsize":t.length,key:s.text+r,text:s.text,disabled:l,removable:!0,onRemove:f=>this.onTagDelete(s.data,f),removeIcon:c,onMousedown:S,onClick:T,class:a?"k-focus":void 0,rounded:u,size:d},null);return n.getTemplate.call(this,{h:i.h,template:this.$props.tagRender,defaultRendering:h,additionalProps:{...this.$props,tagData:s,index:r},additionalListeners:{tagdelete:this.onTagDelete}})},this)]),e])}});exports.TagList=b;