@progress/kendo-vue-dropdowns 9.3.0-develop.3 → 9.3.0-develop.4

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 r=require("vue"),l=require("@progress/kendo-vue-common"),Se=require("../common/ListContainer.js"),Ie=require("../common/List.js"),ye=require("./TagList.js"),be=require("../common/SearchBar.js"),ke=require("../common/DropDownBase.js"),U=require("../common/GroupStickyHeader.js"),xe=require("../common/ClearButton.js"),K=require("../common/settings.js"),f=require("../common/utils.js"),$e=require("@progress/kendo-svg-icons"),E=require("@progress/kendo-vue-buttons"),Ce=require("@progress/kendo-vue-inputs"),Y=require("../common/constants.js"),Fe=require("@progress/kendo-vue-layout"),Te=require("../common/ListFilter.js"),Ve=require("@progress/kendo-vue-intl"),y=require("../messages/main.js"),{sizeMap:q,roundedMap:Ae}=l.kendoThemeMaps;function B(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!r.isVNode(e)}const Ne="Please enter a valid value!",J=e=>e.preventDefault(),Q=(e,t,s)=>!!e!=!!t||e.text!==t.text?!1:e===t||f.matchDataCollections(e.data,t.data,s),X=e=>e===$.CustomItem;var $=(function(e){return e[e.None=0]="None",e[e.ListItem=1]="ListItem",e[e.CustomItem=2]="CustomItem",e})($||{});const Oe=r.defineComponent({name:"KendoMultiSelect",emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,change:e=>!0,pagechange:e=>!0,selectallchange: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,selectAll:Boolean,checkboxes:Boolean,summarizeAfter:{type:Number,default:10}},setup(){const e=r.ref(null),t=r.ref(null),s=r.inject("kendoLocalizationService",{});return{inputRef:e,kendoAnchorRef:t,kendoLocalizationService:s}},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid,t=this.currentText||f.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 ke(this),this.anchor=l.guid(),this.inputId=l.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,currentSelectAllFocused:!1,searchState:{word:"",last:""},suggested:"",activedescendant:K.ActiveDescendant.PopupList,group:void 0,isScrolling:!1,itemHeight:0,windowWidth:0,popupWidth:void 0,initialAdaptiveRenderingValues:void 0,stickyHeadersHeight: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.isScrolling=!1):(this.initialAdaptiveRenderingValues=void 0,this.currentSelectAllFocused=!1),setTimeout(()=>{const t=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(t)},100)}},updated(){var m;const{virtual:e,groupField:t="",dataItems:s=[]}=this.$props,i=e?e.skip:0,n=this.isOpen,a=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,d=!a&&n,c=a&&!n,u=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),o=this.$refs.list,g=this.$refs.scrollElement;if(o&&(this.base.vs.list=o.list,this.base.list=o.list),g&&(this.base.vs.scrollElement=g),o&&s.length&&this.base.vs.scrollerRef(o.$el),n&&this.stickyHeadersHeight===0&&this.measureStickyHeadersHeight(),!u.animate&&c&&this.onPopupClosed(),!this.isScrolling)if(e&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{let{focusedItem:v,focusedIndex:I}=this.getFocusedState();t!==""&&(I=(m=this.base.getGroupedDataModernMode(s,t))==null?void 0:m.indexOf(v)),d&&e?(this.base.vs.container?(this.base.scrollToVirtualItem(e,I-i),this.base.vs.translate>0&&I-i<0&&(this.base.vs.container.scrollTop=this.base.vs.translate)):this.$nextTick(()=>{const T=this.$refs.list;T&&(this.base.vs.list=T.list,this.base.list=T.list,this.base.vs.scrollerRef(T.$el));const A=this.$refs.scrollElement;A&&(this.base.vs.scrollElement=A),this.base.scrollToVirtualItem(e,I-i),this.base.vs.translate>0&&I-i<0&&(this.base.vs.container.scrollTop=this.base.vs.translate)}),this.prevCurrentOpened=!0):d&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][t],this),this.base.scrollToItem(I),this.prevCurrentOpened=!0):n&&a&&v&&this.scrollToFocused&&this.base.scrollToItem(I-i)}this.scrollToFocused=!1,this.searchBarRef(),this.setValidity()},mounted(){this.observer=l.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=l.getRef(this,"kendoAnchor"),this.element=l.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(a=>f.getItemValue(a,e)===i);return this.dataItems[n]||i})},primitiveValue(){const e=this.computedValue(),t=e.map(s=>f.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){this.currentSelectAllFocused&&(t.data.currentSelectAllFocused=!1);const{dataItems:s=[],dataItemKey:i,virtual:n}=this.$props,a=this.computedValue(),d=n?n.skip:0,c=s[e-d],u=a.findIndex(m=>f.areSame(m,c,i));this._lastSelectedOrDeselectedItemIndex=s.findIndex(m=>f.areSame(m,c,i));let o=[];u!==-1?(o=a,o.splice(u,1)):o=[...a,c],(this.$props.filter!==void 0?this.$props.filter:this.currentText)&&!this.adaptiveState&&!this.$props.checkboxes&&this.clearFilter(t),t.data.currentFocusedIndex=e,this.triggerOnChange(o,t),this.base.triggerPageChangeCornerItems(c,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();f.removeDataItems(n,e,this.$props.dataItemKey),this.triggerOnChange(n,i),this.applyState(i)},onNavigate(e,t){const{allowCustom:s,dataItems:i=[],selectAll:n}=this.$props,a=this.isOpen,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:c,focusedIndex:u}=this.getFocusedState(),o=s&&d,g=X(c),m=this.base,v=m.vs;if(this.currentSelectAllFocused){t===l.Keys.down&&(e.data.currentSelectAllFocused=!1,o||(this.itemFocus(0,e),this.scrollToFocused=!0)),this.applyState(e);return}if(n&&a&&u===-1&&!g){t===l.Keys.down&&(e.data.currentSelectAllFocused=!0),this.applyState(e);return}if(n&&a&&t===l.Keys.up&&u===0&&!o){e.data.currentSelectAllFocused=!0,e.data.currentFocusedIndex=void 0,this.applyState(e);return}if(a&&t===l.Keys.up&&g)n&&(e.data.currentSelectAllFocused=!0),this.currentFocusedIndex!==void 0&&(e.data.currentFocusedIndex=void 0);else{const I=m.navigation.navigate({keyCode:t,current:u,max:(v.enabled?v.total:i.length)-1,min:o?-1:0});I!==void 0&&(this.itemFocus(I,e),this.scrollToFocused=!0)}this.applyState(e)},itemFocus(e,t){const{dataItems:s=[],allowCustom:i,virtual:n}=this.$props,a=n?n.skip:0,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedIndex:c}=this.getFocusedState(),u=i&&d,o=s[e-a];o&&c!==e?this.currentFocusedIndex!==e&&(t.data.currentFocusedIndex=e,t.data.activedescendant=K.ActiveDescendant.PopupList):u&&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.scrollToFocused=!0: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;f.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(),a=this.base.initState();if(a.event=e,!s&&this.computedValue().length>0&&(t===l.Keys.left||t===l.Keys.right||t===l.Keys.home||t===l.Keys.end||t===l.Keys.delete||t===l.Keys.backspace))return this.onTagsNavigate(e,a);const d=()=>{e.preventDefault(),this.base.togglePopup(a),this.applyState(a)};i?e.altKey&&t===l.Keys.up?d():t===l.Keys.up||t===l.Keys.down?(e.preventDefault(),this.onNavigate(a,t)):t===l.Keys.enter||t===l.Keys.space&&this.currentSelectAllFocused?(e.preventDefault(),this.currentSelectAllFocused?this.toggleSelectAll(e):this.$props.allowCustom&&s&&n===null?this.customItemSelect(e):this.selectFocusedItem(e)):t===l.Keys.esc&&(this.adaptiveState&&this.handleWrapperClick(e),d()):(e.altKey&&t===l.Keys.down||t===l.Keys.space&&this.$props.selectAll)&&d()},onTagsNavigate(e,t){const s=e.keyCode,i=this.currentFocusedTag,n=this._tags,a=this.$props.dataItemKey;let d=i?n.findIndex(o=>Q(o,i,a)):-1,c;const u=d!==-1;if(s===l.Keys.left)u?d=Math.max(0,d-1):d=n.length-1,c=n[d];else if(s===l.Keys.right)d===n.length-1?c=void 0:u&&(d=Math.min(n.length-1,d+1),c=n[d]);else if(s===l.Keys.home)c=n[0];else if(s===l.Keys.end)c=n[n.length-1];else if(s===l.Keys.delete){if(u){const o=this.computedValue();f.removeDataItems(o,n[d].data,a),this.triggerOnChange(o,t)}}else if(s===l.Keys.backspace){const o=this.computedValue();if(u)f.removeDataItems(o,n[d].data,a),this.triggerOnChange(o,t);else if(!u&&n.length){const g=n.pop();f.removeDataItems(o,g.data,a),this.triggerOnChange(o,t)}}c!==i&&(t.data.currentFocusedTag=c,t.data.activedescendant=K.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"}),this.base.repositionPopup()},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)},shouldKeepNoFocusOnOpen(e,t){return this.$props.selectAll&&t===void 0&&this.computedValue().length===0&&!(this.$props.allowCustom&&e)},getFocusedState(){if(this.currentSelectAllFocused)return{focusedType:$.None,focusedIndex:-1};const e=this.currentFocusedIndex,t=this.$props.filter!==void 0?this.$props.filter:this.currentText;if(this.shouldKeepNoFocusOnOpen(t,e))return{focusedType:$.None,focusedIndex:-1};const{allowCustom:s,dataItems:i=[],dataItemKey:n,virtual:a,textField:d,focusedItemIndex:c=f.itemIndexStartsWith}=this.$props,u=a&&a.skip||0;let o;if(e!==void 0)return{focusedIndex:e,focusedItem:i[e-u],focusedType:$.ListItem};const g=this.computedValue();if(s&&t)return{focusedItem:null,focusedIndex:-1,focusedType:$.CustomItem};if(t)return o=c(i,t,d),{focusedItem:i[o],focusedIndex:o+u,focusedType:$.ListItem};if(g.length){if(this.$props.selectAll){const v=g[g.length-1],I=i.findIndex(T=>f.areSame(T,v,n));return I!==-1?{focusedIndex:I+u,focusedItem:i[I],focusedType:$.ListItem}:u===0?{focusedItem:i[0],focusedIndex:0,focusedType:$.ListItem}:{focusedType:$.None,focusedIndex:-1}}const m=g[g.length-1];return o=i.findIndex(v=>f.areSame(v,m,n)),i[o]!==void 0?{focusedIndex:o+u,focusedItem:i[o],focusedType:$.ListItem}:{focusedType:$.None,focusedIndex:-1}}return u===0?{focusedItem:i[0],focusedIndex:0,focusedType:$.ListItem}:{focusedType:$.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 a=[...this.computedValue(),n];this.triggerOnChange(a,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.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.$props.checkboxes&&!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.data.currentSelectAllFocused=!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),this.measureStickyHeadersHeight()},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.focusElement(this.input)},0),this.stickyHeadersHeight=0},measureStickyHeadersHeight(){let e=0;const t=document.getElementById(this.base.listBoxId),s=t==null?void 0:t.closest(".k-list");if(s){const i=s.querySelector(".k-list-sticky-header"),n=s.querySelector(".k-list-group-sticky-header");i&&(e+=i.offsetHeight),n&&(e+=n.offsetHeight)}this.stickyHeadersHeight=e},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||Ne)},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 m;this.isScrolling=!0;const{vs:t,list:s}=this.base;t.scrollHandler(e);const i=this.base.initState(),{groupField:n}=this.$props;let{dataItems:a=[]}=this.$props,d;if(!n||!a.length)return;const c=s&&((m=s.querySelector(".k-list-item"))==null?void 0:m.offsetHeight)||0,u=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:c),g=e.target.scrollTop-t.skip*u;n&&(a=this.base.getGroupedDataModernMode(a,n),a=this.base.getGroupedDataModernMode(a,n),d=a[0][n]);for(let v=1;v<a.length&&!(u*v>g);v++)a[v]&&a[v][n]&&(d=a[v][n]);d!==this.group&&(i.data.group=d,this.applyState(i))},getSelectableItems(){return(this.$props.dataItems||[]).filter(t=>!(t!=null&&t.disabled))},areAllSelectableItemsSelected(){const e=this.getSelectableItems();if(e.length===0||!e.every(n=>this.computedValue().some(a=>f.areSame(a,n,this.$props.dataItemKey))))return!1;const{virtual:s,dataItemKey:i}=this.$props;return!(s&&s.total!==void 0&&(i?this.computedValue().filter(a=>(a==null?void 0:a[i])!==void 0).length:this.computedValue().length)<s.total)},areSomeSelectableItemsSelected(){return this.computedValue().length>0},handleSelectAllItemClick(e){e.stopPropagation(),this.toggleSelectAll(e)},handleSelectAllItemKeyDown(e){e.keyCode!==l.Keys.enter&&e.keyCode!==l.Keys.space||(e.preventDefault(),this.toggleSelectAll(e))},toggleSelectAll(e){if(this.$props.disabled)return;const t=this.areAllSelectableItemsSelected(),s=this.getSelectableItems();if(s.length===0)return;const i={event:e,target:this,allSelected:!t,defaultPrevented:!1,preventDefault(){this.defaultPrevented=!0}};if(this.$emit("selectallchange",i),i.defaultPrevented)return;const n=this.base.initState();n.data.currentFocusedIndex=void 0;let a=[];t?a=this.computedValue().filter(d=>!s.some(c=>f.areSame(c,d,this.$props.dataItemKey))):(a=[...this.computedValue()],s.forEach(d=>{a.some(u=>f.areSame(u,d,this.$props.dataItemKey))||a.push(d)})),n.data.currentSelectAllFocused=!0,this.triggerOnChange(a,n),this.applyState(n)}},render(){const{style:e,label:t,dir:s,disabled:i,tags:n,textField:a,dataItemKey:d,virtual:c,loading:u,size:o,fillMode:g,rounded:m,tagsRounded:v,removeTagIcon:I,adaptiveTitle:T,header:A,footer:z,inputAttributes:Z,groupStickyHeaderItemRender:ee,dataItems:N=[]}=this.$props,te=this.currentFocused,O=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),D=this.currentFocusedTag,_=this.computedValue(),L=(this.$props.filter!==void 0?this.$props.filter:this.currentText)||"",se=!u&&(!!L||_.length>0),V=this.base.vs,M=this.$props.id||this.inputId,ie=l.templateRendering.call(this,this.$props.tagRender,l.getListeners.call(this)),H=this.isOpen,R=this.adaptiveState,w=Ve.provideLocalizationService(this);this.group===void 0&&this.$props.groupField!==void 0&&(this.group=f.getItemValue(this.$props.dataItems[0],this.$props.groupField)),V.enabled=c!==void 0,c!==void 0&&(V.skip=c.skip,V.total=c.total,V.pageSize=c.pageSize);let C=[];if(this.initialAdaptiveRenderingValues)[...this.initialAdaptiveRenderingValues].forEach(p=>{C.push({text:f.getItemValue(p,a),data:[p]})});else if(n===void 0){const{allowCustom:h,selectAll:p,dataItemKey:S}=this.$props;if(h&&p&&S){const b=this.computedValue(),k=b.filter(x=>x[S]!==void 0),F=b.filter(x=>x[S]===void 0);if(k.length>0){const x=w.toLanguageString(y.itemsSelectedText,y.messages[y.itemsSelectedText]).replace("{0}",k.length.toString());C.push({text:x,data:[...k]})}F.forEach(x=>{C.push({text:f.getItemValue(x,a),data:[x]})})}else this.computedValue().forEach(b=>{C.push({text:f.getItemValue(b,a),data:[b]})})}else C.push(...n);C.length>0&&this.setItems(C,this._tags);const ne=!this.$props.validityStyles||this.validity().valid,ae=function(h){const p=this.activedescendant,{placeholder:S}=this.$props,{focusedIndex:b}=this.getFocusedState(),k=C.length===0||_.length===0&&!L?S:void 0,F=p===K.ActiveDescendant.TagsList&&D!==void 0?`tag-${this.base.guid}-${D.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${b}`;return r.createVNode(be.SearchBar,{id:h,size:Math.max((k||"").length,L.length,1),tabIndex:this.$props.tabIndex,accessKey:this.$props.accessKey,placeholder:k,value:R?"":L,onChange:this.onChangeHandler,onBlur:this.handleBlur,onKeydown:this.onInputKeyDown,ref:x=>{this.inputRef=x},disabled:i,expanded:H,owns:this.base.listBoxId,activedescendant:F,"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)},le=()=>{const{checkboxes:h,selectAll:p}=this.$props;if(!p)return null;const S=this.areAllSelectableItemsSelected(),b=!S&&this.areSomeSelectableItemsSelected(),k=w.toLanguageString(y.selectAllText,y.messages[y.selectAllText]),F=this.currentSelectAllFocused;return r.createVNode("div",{class:"k-list-sticky-header"},[r.createVNode("div",r.mergeProps({class:l.classNames("k-list-sticky-header-item",{"k-selected":!h&&S,"k-focus":F}),"aria-label":k},!h&&{tabindex:0,"aria-selected":S},{onClick:this.handleSelectAllItemClick,onKeydown:this.handleSelectAllItemKeyDown}),[h&&r.createVNode(Ce.Checkbox,{checked:S,value:b?null:S,tabIndex:-1},null),r.createVNode("span",{class:"k-list-item-text"},[k])])])},j=function(){let h;const{groupField:p}=this.$props,S=l.templateRendering.call(this,this.$props.itemRender,l.getListeners.call(this)),b=l.templateRendering.call(this,this.$props.groupHeaderItemRender,l.getListeners.call(this)),k=l.templateRendering.call(this,this.$props.listNoDataRender,l.getListeners.call(this)),F=c?c.skip:0,{focusedIndex:x}=this.getFocusedState(),P=`translateY(${V.translate}px)`;let G=N;return p&&(G=this.base.getGroupedDataModernMode(N,p)),r.createVNode(Ie.List,{id:this.base.listBoxId,show:H,dataItems:G.slice(),focusedIndex:x,value:this.computedValue(),textField:a,valueField:d,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:R?void 0:this.stickyHeadersHeight>0&&O.height?`calc(${O.height} - ${this.stickyHeadersHeight}px)`:O.height},wrapperCssClass:"k-list-content",listStyle:V.enabled?{transform:P}:void 0,key:"listKey",skip:F,onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:b,noDataRender:k,groupField:p,onScroll:this.onScroll,showSelectionCheckbox:this.$props.checkboxes},B(h=oe.call(this))?h:{default:()=>[h]})},oe=function(){return V.enabled&&r.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},re=function(){const h=this.base,{allowCustom:p}=this.$props,S=l.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,l.getListeners.call(this)),b=h.getTemplateDef.call(this,A),k=h.getTemplateDef.call(this,z),F=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:x}=this.getFocusedState(),P=p&&F&&r.createVNode("div",{class:l.classNames("k-list-custom-value",{"k-focus":X(x)}),key:"customitem",onClick:this.customItemSelect,onMousedown:J},[F]);return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=f.getItemValue(N[0],this.$props.groupField)),r.createVNode(Se.ListContainer,{ref:"container",onMousedown:J,dir:s!==void 0?s:h.dirCalculated,onBlur:this.handleBlur,width:this.popupWidth,popupSettings:{...O,anchor:this.anchor,show:H,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,popupClass:l.classNames(O.popupClass,"k-list",{[`k-list-${q[o]||o}`]:o,"k-virtual-list":this.base.vs.enabled}),className:l.classNames("k-list-container",O.className)},itemsCount:N.length},{default:()=>[b&&r.createVNode("div",{class:"k-list-header"},[b]),le.call(this),this.group&&N.length!==0&&r.createVNode(U.GroupStickyHeader,{group:this.group,render:S},null),P,j.call(this),k&&r.createVNode("div",{class:"k-list-footer"},[k]),c&&A]})},de=function(){const h=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&r.createVNode(Te.ListFilter,{value:h,ref:"filterInput",onChange:this.onChangeHandler,onKeydown:this.onInputKeyDown,size:o,rounded:m,fillMode:g},null)},ce=()=>[r.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[r.createVNode("div",{class:"k-actionsheet-title"},[r.createVNode("div",{class:"k-text-center"},[T]),r.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),r.createVNode("div",{class:"k-actionsheet-actions"},[r.createVNode(E.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onCancel,icon:"x",svgIcon:$e.xIcon},null)])]),r.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[de.call(this)])],ue=l.templateRendering.call(this,ce,l.getListeners.call(this)),he=()=>{const h=w.toLanguageString(y.adaptiveModeFooterCancel,y.messages[y.adaptiveModeFooterCancel]),p=w.toLanguageString(y.adaptiveModeFooterApply,y.messages[y.adaptiveModeFooterApply]);return[r.createVNode(E.Button,{size:"large","aria-label":h,"aria-disabled":"false",type:"button",onClick:this.onCancel},B(h)?h:{default:()=>[h]}),r.createVNode(E.Button,{themeColor:"primary",size:"large","aria-label":p,"aria-disabled":"false",type:"button",onClick:this.handleWrapperClick},B(p)?p:{default:()=>[p]})]},pe=l.templateRendering.call(this,he,l.getListeners.call(this)),fe=()=>{const h=this.base.getTemplateDef.call(this,A,r.h),p=this.base.getTemplateDef.call(this,z,r.h),S=l.templateRendering.call(this,ee,l.getListeners.call(this));return r.createVNode("div",{class:"k-list-container"},[h&&r.createVNode("div",{class:"k-list-header"},[h]),r.createVNode("div",{class:l.classNames("k-list",{[`k-list-${q[o]||o}`]:R?!1:o,"k-list-lg":!!R,"k-virtual-list":V.enabled})},[this.group&&N.length!==0&&r.createVNode(U.GroupStickyHeader,{group:this.group,render:S},null),j.call(this),p&&r.createVNode("div",{class:"k-list-footer"},[p])])])},ge=l.templateRendering.call(this,fe,l.getListeners.call(this)),me=function(){return r.createVNode(Fe.ActionSheet,{expand:H,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",footerClassName:"k-actions k-actions-stretched",header:ue,content:ge,footer:pe,onClose:this.onCancel,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},ve=function(){let h;return r.createVNode("span",{ref:l.setRef(this,"kendoAnchor"),class:l.classNames("k-multiselect","k-input",{[`k-input-${q[o]||o}`]:o,[`k-rounded-${Ae[m]||m}`]:m,[`k-input-${g}`]:g,"k-focus":te&&!i,"k-disabled":i,"k-invalid":!ne,"k-loading":u,"k-required":this.required}),style:t?{...e,width:void 0}:e,dir:s,onFocusin:this.handleFocus,onClick:this.handleWrapperClick,onMousedown:f.preventDefaultNonInputs},[r.createVNode(ye.TagList,{removeTagIcon:I,tagsRounded:v,size:o,fillMode:g,tagRender:ie,onTagdelete:this.onTagDelete,dataItems:C,guid:this.base.guid,summarizeAfter:this.$props.summarizeAfter,summaryText:this.$props.summarizeAfter&&C.length>this.$props.summarizeAfter?w.toLanguageString(y.summaryTagText,y.messages[y.summaryTagText]).replace("{0}",(C.length-this.$props.summarizeAfter).toString()):void 0,focused:D?C.find(p=>Q(p,D,d)):void 0},B(h=ae.call(this,M))?h:{default:()=>[h]}),C.length>0&&se&&r.createVNode(xe.ClearButton,{onClearclick:this.clearButtonClick},null),r.createVNode("span",{class:u?"k-input-loading-icon k-icon k-i-loading":void 0},null),!R&&re.call(this)])},W=[r.h(ve.call(this),{...this.$attrs}),R&&me.call(this)];return t?r.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[W,this.$props.label?M?r.createVNode("label",{for:M,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):W}});exports.MultiSelect=Oe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),l=require("@progress/kendo-vue-common"),Se=require("../common/ListContainer.js"),Ie=require("../common/List.js"),ye=require("./TagList.js"),be=require("../common/SearchBar.js"),ke=require("../common/DropDownBase.js"),U=require("../common/GroupStickyHeader.js"),xe=require("../common/ClearButton.js"),H=require("../common/settings.js"),f=require("../common/utils.js"),$e=require("@progress/kendo-svg-icons"),E=require("@progress/kendo-vue-buttons"),Ce=require("@progress/kendo-vue-inputs"),Y=require("../common/constants.js"),Fe=require("@progress/kendo-vue-layout"),Te=require("../common/ListFilter.js"),Ve=require("@progress/kendo-vue-intl"),y=require("../messages/main.js"),{sizeMap:q,roundedMap:Ae}=l.kendoThemeMaps;function K(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!r.isVNode(e)}const Ne="Please enter a valid value!",J=e=>e.preventDefault(),Q=(e,t,s)=>!!e!=!!t||e.text!==t.text?!1:e===t||f.matchDataCollections(e.data,t.data,s),X=e=>e===C.CustomItem;var C=(function(e){return e[e.None=0]="None",e[e.ListItem=1]="ListItem",e[e.CustomItem=2]="CustomItem",e})(C||{});const Oe=r.defineComponent({name:"KendoMultiSelect",emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,change:e=>!0,pagechange:e=>!0,selectallchange: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,selectAll:Boolean,checkboxes:Boolean,summarizeAfter:{type:Number,default:10}},setup(){const e=r.ref(null),t=r.ref(null),s=r.inject("kendoLocalizationService",{});return{inputRef:e,kendoAnchorRef:t,kendoLocalizationService:s}},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid,t=this.currentText||f.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 ke(this),this.anchor=l.guid(),this.inputId=l.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,currentSelectAllFocused:!1,searchState:{word:"",last:""},suggested:"",activedescendant:H.ActiveDescendant.PopupList,group:void 0,isScrolling:!1,itemHeight:0,windowWidth:0,popupWidth:void 0,initialAdaptiveRenderingValues:void 0,stickyHeadersHeight: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.isScrolling=!1):(this.initialAdaptiveRenderingValues=void 0,this.currentSelectAllFocused=!1),setTimeout(()=>{const t=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(t)},100)}},updated(){var m;const{virtual:e,groupField:t="",dataItems:s=[]}=this.$props,i=e?e.skip:0,n=this.isOpen,a=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,d=!a&&n,c=a&&!n,u=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),o=this.$refs.list,g=this.$refs.scrollElement;if(o&&(this.base.vs.list=o.list,this.base.list=o.list),g&&(this.base.vs.scrollElement=g),o&&s.length&&this.base.vs.scrollerRef(o.$el),n&&this.stickyHeadersHeight===0&&this.measureStickyHeadersHeight(),!u.animate&&c&&this.onPopupClosed(),!this.isScrolling)if(e&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{let{focusedItem:v,focusedIndex:I}=this.getFocusedState();t!==""&&(I=(m=this.base.getGroupedDataModernMode(s,t))==null?void 0:m.indexOf(v)),d&&e?(this.base.vs.container?(this.base.scrollToVirtualItem(e,I-i),this.base.vs.translate>0&&I-i<0&&(this.base.vs.container.scrollTop=this.base.vs.translate)):this.$nextTick(()=>{const T=this.$refs.list;T&&(this.base.vs.list=T.list,this.base.list=T.list,this.base.vs.scrollerRef(T.$el));const A=this.$refs.scrollElement;A&&(this.base.vs.scrollElement=A),this.base.scrollToVirtualItem(e,I-i),this.base.vs.translate>0&&I-i<0&&(this.base.vs.container.scrollTop=this.base.vs.translate)}),this.prevCurrentOpened=!0):d&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][t],this),this.base.scrollToItem(I),this.prevCurrentOpened=!0):n&&a&&v&&this.scrollToFocused&&this.base.scrollToItem(I-i)}this.scrollToFocused=!1,this.searchBarRef(),this.setValidity()},mounted(){this.observer=l.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=l.getRef(this,"kendoAnchor"),this.element=l.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(a=>f.getItemValue(a,e)===i);return this.dataItems[n]||i})},primitiveValue(){const e=this.computedValue(),t=e.map(s=>f.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){this.currentSelectAllFocused&&(t.data.currentSelectAllFocused=!1);const{dataItems:s=[],dataItemKey:i,virtual:n}=this.$props,a=this.computedValue(),d=n?n.skip:0,c=s[e-d],u=a.findIndex(m=>f.areSame(m,c,i));this._lastSelectedOrDeselectedItemIndex=s.findIndex(m=>f.areSame(m,c,i));let o=[];u!==-1?(o=a,o.splice(u,1)):o=[...a,c],(this.$props.filter!==void 0?this.$props.filter:this.currentText)&&!this.adaptiveState&&!this.$props.checkboxes&&this.clearFilter(t),t.data.currentFocusedIndex=e,this.triggerOnChange(o,t),this.base.triggerPageChangeCornerItems(c,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();f.removeDataItems(n,e,this.$props.dataItemKey),this.triggerOnChange(n,i),this.applyState(i)},onNavigate(e,t){const{allowCustom:s,dataItems:i=[],selectAll:n}=this.$props,a=this.isOpen,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:c,focusedIndex:u}=this.getFocusedState(),o=s&&d,g=X(c),m=this.base,v=m.vs;if(this.currentSelectAllFocused){t===l.Keys.down&&(e.data.currentSelectAllFocused=!1,o||(this.itemFocus(0,e),this.scrollToFocused=!0)),this.applyState(e);return}if(n&&a&&u===-1&&!g){t===l.Keys.down&&(e.data.currentSelectAllFocused=!0),this.applyState(e);return}if(n&&a&&t===l.Keys.up&&u===0&&!o){e.data.currentSelectAllFocused=!0,e.data.currentFocusedIndex=void 0,this.applyState(e);return}if(a&&t===l.Keys.up&&g)n&&(e.data.currentSelectAllFocused=!0),this.currentFocusedIndex!==void 0&&(e.data.currentFocusedIndex=void 0);else{const I=m.navigation.navigate({keyCode:t,current:u,max:(v.enabled?v.total:i.length)-1,min:o?-1:0});I!==void 0&&(this.itemFocus(I,e),this.scrollToFocused=!0)}this.applyState(e)},itemFocus(e,t){const{dataItems:s=[],allowCustom:i,virtual:n}=this.$props,a=n?n.skip:0,d=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedIndex:c}=this.getFocusedState(),u=i&&d,o=s[e-a];o&&c!==e?this.currentFocusedIndex!==e&&(t.data.currentFocusedIndex=e,t.data.activedescendant=H.ActiveDescendant.PopupList):u&&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.scrollToFocused=!0: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;f.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(),a=this.base.initState();if(a.event=e,!s&&this.computedValue().length>0&&(t===l.Keys.left||t===l.Keys.right||t===l.Keys.home||t===l.Keys.end||t===l.Keys.delete||t===l.Keys.backspace))return this.onTagsNavigate(e,a);const d=()=>{e.preventDefault(),this.base.togglePopup(a),this.applyState(a)};i?e.altKey&&t===l.Keys.up?d():t===l.Keys.up||t===l.Keys.down?(e.preventDefault(),this.onNavigate(a,t)):t===l.Keys.enter||t===l.Keys.space&&this.currentSelectAllFocused?(e.preventDefault(),this.currentSelectAllFocused?this.toggleSelectAll(e):this.$props.allowCustom&&s&&n===null?this.customItemSelect(e):this.selectFocusedItem(e)):t===l.Keys.esc&&(this.adaptiveState&&this.handleWrapperClick(e),d()):(e.altKey&&t===l.Keys.down||t===l.Keys.space&&this.$props.selectAll)&&d()},onTagsNavigate(e,t){const s=e.keyCode,i=this.currentFocusedTag,n=this._tags,a=this.$props.dataItemKey;let d=i?n.findIndex(o=>Q(o,i,a)):-1,c;const u=d!==-1;if(s===l.Keys.left)u?d=Math.max(0,d-1):d=n.length-1,c=n[d];else if(s===l.Keys.right)d===n.length-1?c=void 0:u&&(d=Math.min(n.length-1,d+1),c=n[d]);else if(s===l.Keys.home)c=n[0];else if(s===l.Keys.end)c=n[n.length-1];else if(s===l.Keys.delete){if(u){const o=this.computedValue();f.removeDataItems(o,n[d].data,a),this.triggerOnChange(o,t)}}else if(s===l.Keys.backspace){const o=this.computedValue();if(u)f.removeDataItems(o,n[d].data,a),this.triggerOnChange(o,t);else if(!u&&n.length){const g=n.pop();f.removeDataItems(o,g.data,a),this.triggerOnChange(o,t)}}c!==i&&(t.data.currentFocusedTag=c,t.data.activedescendant=H.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"}),this.base.repositionPopup()},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)},shouldKeepNoFocusOnOpen(e,t){return this.$props.selectAll&&t===void 0&&this.computedValue().length===0&&!(this.$props.allowCustom&&e)},getFocusedState(){if(this.currentSelectAllFocused)return{focusedType:C.None,focusedIndex:-1};const e=this.currentFocusedIndex,t=this.$props.filter!==void 0?this.$props.filter:this.currentText;if(this.shouldKeepNoFocusOnOpen(t,e))return{focusedType:C.None,focusedIndex:-1};const{allowCustom:s,dataItems:i=[],dataItemKey:n,virtual:a,textField:d,focusedItemIndex:c=f.itemIndexStartsWith}=this.$props,u=a&&a.skip||0;let o;if(e!==void 0)return{focusedIndex:e,focusedItem:i[e-u],focusedType:C.ListItem};const g=this.computedValue();if(s&&t)return{focusedItem:null,focusedIndex:-1,focusedType:C.CustomItem};if(t)return o=c(i,t,d),{focusedItem:i[o],focusedIndex:o+u,focusedType:C.ListItem};if(g.length){if(this.$props.selectAll){const v=g[g.length-1],I=i.findIndex(T=>f.areSame(T,v,n));return I!==-1?{focusedIndex:I+u,focusedItem:i[I],focusedType:C.ListItem}:u===0?{focusedItem:i[0],focusedIndex:0,focusedType:C.ListItem}:{focusedType:C.None,focusedIndex:-1}}const m=g[g.length-1];return o=i.findIndex(v=>f.areSame(v,m,n)),i[o]!==void 0?{focusedIndex:o+u,focusedItem:i[o],focusedType:C.ListItem}:{focusedType:C.None,focusedIndex:-1}}return u===0?{focusedItem:i[0],focusedIndex:0,focusedType:C.ListItem}:{focusedType:C.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 a=[...this.computedValue(),n];this.triggerOnChange(a,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.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.$props.checkboxes&&!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.data.currentSelectAllFocused=!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),this.measureStickyHeadersHeight()},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.focusElement(this.input)},0),this.stickyHeadersHeight=0},measureStickyHeadersHeight(){let e=0;const t=document.getElementById(this.base.listBoxId),s=t==null?void 0:t.closest(".k-list");if(s){const i=s.querySelector(".k-list-sticky-header"),n=s.querySelector(".k-list-group-sticky-header");i&&(e+=i.offsetHeight),n&&(e+=n.offsetHeight)}this.stickyHeadersHeight=e},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||Ne)},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 m;this.isScrolling=!0;const{vs:t,list:s}=this.base;t.scrollHandler(e);const i=this.base.initState(),{groupField:n}=this.$props;let{dataItems:a=[]}=this.$props,d;if(!n||!a.length)return;const c=s&&((m=s.querySelector(".k-list-item"))==null?void 0:m.offsetHeight)||0,u=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:c),g=e.target.scrollTop-t.skip*u;n&&(a=this.base.getGroupedDataModernMode(a,n),a=this.base.getGroupedDataModernMode(a,n),d=a[0][n]);for(let v=1;v<a.length&&!(u*v>g);v++)a[v]&&a[v][n]&&(d=a[v][n]);d!==this.group&&(i.data.group=d,this.applyState(i))},getSelectableItems(){return(this.$props.dataItems||[]).filter(t=>!(t!=null&&t.disabled))},areAllSelectableItemsSelected(){const e=this.getSelectableItems();if(e.length===0||!e.every(n=>this.computedValue().some(a=>f.areSame(a,n,this.$props.dataItemKey))))return!1;const{virtual:s,dataItemKey:i}=this.$props;return!(s&&s.total!==void 0&&(i?this.computedValue().filter(a=>(a==null?void 0:a[i])!==void 0).length:this.computedValue().length)<s.total)},areSomeSelectableItemsSelected(){return this.computedValue().length>0},handleSelectAllItemClick(e){e.stopPropagation(),this.toggleSelectAll(e)},handleSelectAllItemKeyDown(e){e.keyCode!==l.Keys.enter&&e.keyCode!==l.Keys.space||(e.preventDefault(),this.toggleSelectAll(e))},toggleSelectAll(e){if(this.$props.disabled)return;const t=this.areAllSelectableItemsSelected(),s=this.getSelectableItems();if(s.length===0)return;const i={event:e,target:this,allSelected:!t,defaultPrevented:!1,preventDefault(){this.defaultPrevented=!0}};if(this.$emit("selectallchange",i),i.defaultPrevented)return;const n=this.base.initState();n.data.currentFocusedIndex=void 0;let a=[];t?a=this.computedValue().filter(d=>!s.some(c=>f.areSame(c,d,this.$props.dataItemKey))):(a=[...this.computedValue()],s.forEach(d=>{a.some(u=>f.areSame(u,d,this.$props.dataItemKey))||a.push(d)})),n.data.currentSelectAllFocused=!0,this.triggerOnChange(a,n),this.applyState(n)}},render(){const{style:e,label:t,dir:s,disabled:i,tags:n,textField:a,dataItemKey:d,virtual:c,loading:u,size:o,fillMode:g,rounded:m,tagsRounded:v,removeTagIcon:I,adaptiveTitle:T,header:A,footer:z,inputAttributes:Z,groupStickyHeaderItemRender:ee,dataItems:N=[]}=this.$props,te=this.currentFocused,O=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),w=this.currentFocusedTag,_=this.computedValue(),L=(this.$props.filter!==void 0?this.$props.filter:this.currentText)||"",se=!u&&!i&&(!!L||_.length>0),V=this.base.vs,M=this.$props.id||this.inputId,ie=l.templateRendering.call(this,this.$props.tagRender,l.getListeners.call(this)),B=this.isOpen,D=this.adaptiveState,R=Ve.provideLocalizationService(this);this.group===void 0&&this.$props.groupField!==void 0&&(this.group=f.getItemValue(this.$props.dataItems[0],this.$props.groupField)),V.enabled=c!==void 0,c!==void 0&&(V.skip=c.skip,V.total=c.total,V.pageSize=c.pageSize);let b=[];if(this.initialAdaptiveRenderingValues)[...this.initialAdaptiveRenderingValues].forEach(p=>{b.push({text:f.getItemValue(p,a),data:[p]})});else if(n===void 0){const{allowCustom:h,selectAll:p,dataItemKey:S}=this.$props;if(h&&p&&S){const k=this.computedValue(),x=k.filter($=>$[S]!==void 0),F=k.filter($=>$[S]===void 0);if(x.length>0){const $=R.toLanguageString(y.itemsSelectedText,y.messages[y.itemsSelectedText]).replace("{0}",x.length.toString());b.push({text:$,data:[...x]})}F.forEach($=>{b.push({text:f.getItemValue($,a),data:[$]})})}else this.computedValue().forEach(k=>{b.push({text:f.getItemValue(k,a),data:[k]})})}else b.push(...n);b.length>0&&this.setItems(b,this._tags);const ne=!this.$props.validityStyles||this.validity().valid,ae=function(h){const p=this.activedescendant,{placeholder:S}=this.$props,{focusedIndex:k}=this.getFocusedState(),x=b.length===0||_.length===0&&!L?S:void 0,F=p===H.ActiveDescendant.TagsList&&w!==void 0?`tag-${this.base.guid}-${w.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${k}`;return r.createVNode(be.SearchBar,{id:h,size:Math.max((x||"").length,L.length,1),tabIndex:this.$props.tabIndex,accessKey:this.$props.accessKey,placeholder:x,value:D?"":L,onChange:this.onChangeHandler,onBlur:this.handleBlur,onKeydown:this.onInputKeyDown,ref:$=>{this.inputRef=$},disabled:i,expanded:B,owns:this.base.listBoxId,activedescendant:F,ariaDescribedBy:b.length>0?`tagslist-${this.base.guid}${this.$props.ariaDescribedBy?" "+this.$props.ariaDescribedBy:""}`:this.$props.ariaDescribedBy,"aria-labelledBy":this.$props.ariaLabelledBy,"aria-label":this.$props.ariaLabel,inputAttributes:Z},null)},le=()=>{const{checkboxes:h,selectAll:p}=this.$props;if(!p)return null;const S=this.areAllSelectableItemsSelected(),k=!S&&this.areSomeSelectableItemsSelected(),x=R.toLanguageString(y.selectAllText,y.messages[y.selectAllText]),F=this.currentSelectAllFocused;return r.createVNode("div",{class:"k-list-sticky-header"},[r.createVNode("div",r.mergeProps({class:l.classNames("k-list-sticky-header-item",{"k-selected":!h&&S,"k-focus":F}),"aria-label":x},!h&&{tabindex:0,"aria-selected":S},{onClick:this.handleSelectAllItemClick,onKeydown:this.handleSelectAllItemKeyDown}),[h&&r.createVNode(Ce.Checkbox,{checked:S,value:k?null:S,tabIndex:-1},null),r.createVNode("span",{class:"k-list-item-text"},[x])])])},j=function(){let h;const{groupField:p}=this.$props,S=l.templateRendering.call(this,this.$props.itemRender,l.getListeners.call(this)),k=l.templateRendering.call(this,this.$props.groupHeaderItemRender,l.getListeners.call(this)),x=l.templateRendering.call(this,this.$props.listNoDataRender,l.getListeners.call(this)),F=c?c.skip:0,{focusedIndex:$}=this.getFocusedState(),P=`translateY(${V.translate}px)`;let G=N;return p&&(G=this.base.getGroupedDataModernMode(N,p)),r.createVNode(Ie.List,{id:this.base.listBoxId,show:B,dataItems:G.slice(),focusedIndex:$,value:this.computedValue(),textField:a,valueField:d,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:D?void 0:this.stickyHeadersHeight>0&&O.height?`calc(${O.height} - ${this.stickyHeadersHeight}px)`:O.height},wrapperCssClass:"k-list-content",listStyle:V.enabled?{transform:P}:void 0,key:"listKey",skip:F,onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:k,noDataRender:x,groupField:p,onScroll:this.onScroll,showSelectionCheckbox:this.$props.checkboxes},K(h=oe.call(this))?h:{default:()=>[h]})},oe=function(){return V.enabled&&r.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},re=function(){const h=this.base,{allowCustom:p}=this.$props,S=l.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,l.getListeners.call(this)),k=h.getTemplateDef.call(this,A),x=h.getTemplateDef.call(this,z),F=this.$props.filter!==void 0?this.$props.filter:this.currentText,{focusedType:$}=this.getFocusedState(),P=p&&F&&r.createVNode("div",{class:l.classNames("k-list-custom-value",{"k-focus":X($)}),key:"customitem",onClick:this.customItemSelect,onMousedown:J},[F]);return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=f.getItemValue(N[0],this.$props.groupField)),r.createVNode(Se.ListContainer,{ref:"container",onMousedown:J,dir:s!==void 0?s:h.dirCalculated,onBlur:this.handleBlur,width:this.popupWidth,popupSettings:{...O,anchor:this.anchor,show:B,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,popupClass:l.classNames(O.popupClass,"k-list",{[`k-list-${q[o]||o}`]:o,"k-virtual-list":this.base.vs.enabled}),className:l.classNames("k-list-container",O.className)},itemsCount:N.length},{default:()=>[k&&r.createVNode("div",{class:"k-list-header"},[k]),le.call(this),this.group&&N.length!==0&&r.createVNode(U.GroupStickyHeader,{group:this.group,render:S},null),P,j.call(this),x&&r.createVNode("div",{class:"k-list-footer"},[x]),c&&A]})},de=function(){const h=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&r.createVNode(Te.ListFilter,{value:h,ref:"filterInput",onChange:this.onChangeHandler,onKeydown:this.onInputKeyDown,size:o,rounded:m,fillMode:g},null)},ce=()=>[r.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[r.createVNode("div",{class:"k-actionsheet-title"},[r.createVNode("div",{class:"k-text-center"},[T]),r.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),r.createVNode("div",{class:"k-actionsheet-actions"},[r.createVNode(E.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onCancel,icon:"x",svgIcon:$e.xIcon},null)])]),r.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[de.call(this)])],ue=l.templateRendering.call(this,ce,l.getListeners.call(this)),he=()=>{const h=R.toLanguageString(y.adaptiveModeFooterCancel,y.messages[y.adaptiveModeFooterCancel]),p=R.toLanguageString(y.adaptiveModeFooterApply,y.messages[y.adaptiveModeFooterApply]);return[r.createVNode(E.Button,{size:"large","aria-label":h,"aria-disabled":"false",type:"button",onClick:this.onCancel},K(h)?h:{default:()=>[h]}),r.createVNode(E.Button,{themeColor:"primary",size:"large","aria-label":p,"aria-disabled":"false",type:"button",onClick:this.handleWrapperClick},K(p)?p:{default:()=>[p]})]},pe=l.templateRendering.call(this,he,l.getListeners.call(this)),fe=()=>{const h=this.base.getTemplateDef.call(this,A,r.h),p=this.base.getTemplateDef.call(this,z,r.h),S=l.templateRendering.call(this,ee,l.getListeners.call(this));return r.createVNode("div",{class:"k-list-container"},[h&&r.createVNode("div",{class:"k-list-header"},[h]),r.createVNode("div",{class:l.classNames("k-list",{[`k-list-${q[o]||o}`]:D?!1:o,"k-list-lg":!!D,"k-virtual-list":V.enabled})},[this.group&&N.length!==0&&r.createVNode(U.GroupStickyHeader,{group:this.group,render:S},null),j.call(this),p&&r.createVNode("div",{class:"k-list-footer"},[p])])])},ge=l.templateRendering.call(this,fe,l.getListeners.call(this)),me=function(){return r.createVNode(Fe.ActionSheet,{expand:B,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",footerClassName:"k-actions k-actions-stretched",header:ue,content:ge,footer:pe,onClose:this.onCancel,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},ve=function(){let h;return r.createVNode("span",{ref:l.setRef(this,"kendoAnchor"),class:l.classNames("k-multiselect","k-input",{[`k-input-${q[o]||o}`]:o,[`k-rounded-${Ae[m]||m}`]:m,[`k-input-${g}`]:g,"k-focus":te&&!i,"k-disabled":i,"k-invalid":!ne,"k-loading":u,"k-required":this.required}),style:t?{...e,width:void 0}:e,dir:s,onFocusin:this.handleFocus,onClick:this.handleWrapperClick,onMousedown:f.preventDefaultNonInputs},[r.createVNode(ye.TagList,{removeTagIcon:I,tagsRounded:v,size:o,fillMode:g,tagRender:ie,onTagdelete:this.onTagDelete,dataItems:b,guid:this.base.guid,summarizeAfter:this.$props.summarizeAfter,summaryText:this.$props.summarizeAfter&&b.length>this.$props.summarizeAfter?R.toLanguageString(y.summaryTagText,y.messages[y.summaryTagText]).replace("{0}",(b.length-this.$props.summarizeAfter).toString()):void 0,focused:w?b.find(p=>Q(p,w,d)):void 0},K(h=ae.call(this,M))?h:{default:()=>[h]}),b.length>0&&se&&r.createVNode(xe.ClearButton,{onClearclick:this.clearButtonClick},null),r.createVNode("span",{class:u?"k-input-loading-icon k-icon k-i-loading":void 0},null),!D&&re.call(this)])},W=[r.h(ve.call(this),{...this.$attrs}),D&&me.call(this)];return t?r.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[W,this.$props.label?M?r.createVNode("label",{for:M,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):W}});exports.MultiSelect=Oe;

package/MultiSelect/MultiSelect.mjs

@@ -5,8 +5,8 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as Ve, h as q, createVNode as r, ref as ee, inject as we, isVNode as He, mergeProps as De } from "vue";
-import { templateRendering as C, getListeners as F, Keys as h, canUseDOM as Re, getRef as te, guid as se, classNames as B, kendoThemeMaps as Be, setRef as Me } from "@progress/kendo-vue-common";
+import { defineComponent as Ve, h as q, createVNode as r, ref as ee, inject as we, isVNode as De, mergeProps as He } from "vue";
+import { templateRendering as C, getListeners as F, Keys as h, canUseDOM as Be, getRef as te, guid as se, classNames as R, kendoThemeMaps as Re, setRef as Me } from "@progress/kendo-vue-common";
 import { ListContainer as Le } from "../common/ListContainer.mjs";
 import { List as Pe } from "../common/List.mjs";
 import { TagList as Ee } from "./TagList.mjs";
@@ -27,14 +27,14 @@ import { itemsSelectedText as ne, messages as L, adaptiveModeFooterCancel as ae,
 const {
   sizeMap: U,
   roundedMap: et
-} = Be;
+} = Re;
 function _(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !He(e);
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !De(e);
 }
-const tt = "Please enter a valid value!", de = (e) => e.preventDefault(), ce = (e, t, s) => !!e != !!t || e.text !== t.text ? !1 : e === t || qe(e.data, t.data, s), ue = (e) => e === k.CustomItem;
-var k = /* @__PURE__ */ (function(e) {
+const tt = "Please enter a valid value!", de = (e) => e.preventDefault(), ce = (e, t, s) => !!e != !!t || e.text !== t.text ? !1 : e === t || qe(e.data, t.data, s), ue = (e) => e === x.CustomItem;
+var x = /* @__PURE__ */ (function(e) {
   return e[e.None = 0] = "None", e[e.ListItem = 1] = "ListItem", e[e.CustomItem = 2] = "CustomItem", e;
-})(k || {});
+})(x || {});
 const kt = /* @__PURE__ */ Ve({
   name: "KendoMultiSelect",
   emits: {
@@ -300,7 +300,7 @@ const kt = /* @__PURE__ */ Ve({
     this.scrollToFocused = !1, this.searchBarRef(), this.setValidity();
   },
   mounted() {
-    this.observer = Re && 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 = te(this, "kendoAnchor"), this.element = te(this, "kendoAnchor"), this.base.didMount(), this.searchBarRef(), this.setValidity();
+    this.observer = Be && 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 = te(this, "kendoAnchor"), this.element = te(this, "kendoAnchor"), this.base.didMount(), this.searchBarRef(), this.setValidity();
   },
   methods: {
     clearFilter(e) {
@@ -465,13 +465,13 @@ const kt = /* @__PURE__ */ Ve({
     getFocusedState() {
       if (this.currentSelectAllFocused)
         return {
-          focusedType: k.None,
+          focusedType: x.None,
           focusedIndex: -1
         };
       const e = this.currentFocusedIndex, t = this.$props.filter !== void 0 ? this.$props.filter : this.currentText;
       if (this.shouldKeepNoFocusOnOpen(t, e))
         return {
-          focusedType: k.None,
+          focusedType: x.None,
           focusedIndex: -1
         };
       const {
@@ -487,20 +487,20 @@ const kt = /* @__PURE__ */ Ve({
         return {
           focusedIndex: e,
           focusedItem: i[e - c],
-          focusedType: k.ListItem
+          focusedType: x.ListItem
         };
       const f = this.computedValue();
       if (s && t)
         return {
           focusedItem: null,
           focusedIndex: -1,
-          focusedType: k.CustomItem
+          focusedType: x.CustomItem
         };
       if (t)
         return l = d(i, t, o), {
           focusedItem: i[l],
           focusedIndex: l + c,
-          focusedType: k.ListItem
+          focusedType: x.ListItem
         };
       if (f.length) {
         if (this.$props.selectAll) {
@@ -508,13 +508,13 @@ const kt = /* @__PURE__ */ Ve({
           return S !== -1 ? {
             focusedIndex: S + c,
             focusedItem: i[S],
-            focusedType: k.ListItem
+            focusedType: x.ListItem
           } : c === 0 ? {
             focusedItem: i[0],
             focusedIndex: 0,
-            focusedType: k.ListItem
+            focusedType: x.ListItem
           } : {
-            focusedType: k.None,
+            focusedType: x.None,
             focusedIndex: -1
           };
         }
@@ -522,18 +522,18 @@ const kt = /* @__PURE__ */ Ve({
         return l = i.findIndex((m) => V(m, g, n)), i[l] !== void 0 ? {
           focusedIndex: l + c,
           focusedItem: i[l],
-          focusedType: k.ListItem
+          focusedType: x.ListItem
         } : {
-          focusedType: k.None,
+          focusedType: x.None,
           focusedIndex: -1
         };
       }
       return c === 0 ? {
         focusedItem: i[0],
         focusedIndex: 0,
-        focusedType: k.ListItem
+        focusedType: x.ListItem
       } : {
-        focusedType: k.None,
+        focusedType: x.None,
         focusedIndex: -1
       };
     },
@@ -714,16 +714,16 @@ const kt = /* @__PURE__ */ Ve({
       footer: Y,
       inputAttributes: he,
       groupStickyHeaderItemRender: pe,
-      dataItems: H = []
-    } = this.$props, fe = this.currentFocused, D = Object.assign({}, {
+      dataItems: D = []
+    } = this.$props, fe = this.currentFocused, H = Object.assign({}, {
       animate: !0,
       height: "200px"
-    }, this.$props.popupSettings), P = this.currentFocusedTag, J = this.computedValue(), E = (this.$props.filter !== void 0 ? this.$props.filter : this.currentText) || "", ge = !c && (!!E || J.length > 0), A = this.base.vs, j = this.$props.id || this.inputId, me = C.call(this, this.$props.tagRender, F.call(this)), N = this.isOpen, R = this.adaptiveState, M = Ze(this);
+    }, this.$props.popupSettings), P = this.currentFocusedTag, J = this.computedValue(), E = (this.$props.filter !== void 0 ? this.$props.filter : this.currentText) || "", ge = !c && !i && (!!E || J.length > 0), A = this.base.vs, j = this.$props.id || this.inputId, me = C.call(this, this.$props.tagRender, F.call(this)), N = this.isOpen, B = this.adaptiveState, M = Ze(this);
     this.group === void 0 && this.$props.groupField !== void 0 && (this.group = O(this.$props.dataItems[0], this.$props.groupField)), A.enabled = d !== void 0, d !== void 0 && (A.skip = d.skip, A.total = d.total, A.pageSize = d.pageSize);
-    let x = [];
+    let I = [];
     if (this.initialAdaptiveRenderingValues)
       [...this.initialAdaptiveRenderingValues].forEach((p) => {
-        x.push({
+        I.push({
           text: O(p, a),
           data: [p]
         });
@@ -735,54 +735,54 @@ const kt = /* @__PURE__ */ Ve({
         dataItemKey: v
       } = this.$props;
       if (u && p && v) {
-        const I = this.computedValue(), b = I.filter((y) => y[v] !== void 0), $ = I.filter((y) => y[v] === void 0);
-        if (b.length > 0) {
-          const y = M.toLanguageString(ne, L[ne]).replace("{0}", b.length.toString());
-          x.push({
-            text: y,
-            data: [...b]
+        const b = this.computedValue(), y = b.filter((k) => k[v] !== void 0), $ = b.filter((k) => k[v] === void 0);
+        if (y.length > 0) {
+          const k = M.toLanguageString(ne, L[ne]).replace("{0}", y.length.toString());
+          I.push({
+            text: k,
+            data: [...y]
           });
         }
-        $.forEach((y) => {
-          x.push({
-            text: O(y, a),
-            data: [y]
+        $.forEach((k) => {
+          I.push({
+            text: O(k, a),
+            data: [k]
           });
         });
       } else
-        this.computedValue().forEach((I) => {
-          x.push({
-            text: O(I, a),
-            data: [I]
+        this.computedValue().forEach((b) => {
+          I.push({
+            text: O(b, a),
+            data: [b]
           });
         });
     } else
-      x.push(...n);
-    x.length > 0 && this.setItems(x, this._tags);
+      I.push(...n);
+    I.length > 0 && this.setItems(I, this._tags);
     const ve = !this.$props.validityStyles || this.validity().valid, Se = function(u) {
       const p = this.activedescendant, {
         placeholder: v
       } = this.$props, {
-        focusedIndex: I
-      } = this.getFocusedState(), b = x.length === 0 || J.length === 0 && !E ? v : void 0, $ = p === K.TagsList && P !== void 0 ? `tag-${this.base.guid}-${P.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${I}`;
+        focusedIndex: b
+      } = this.getFocusedState(), y = I.length === 0 || J.length === 0 && !E ? v : void 0, $ = p === K.TagsList && P !== void 0 ? `tag-${this.base.guid}-${P.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${b}`;
       return r(Ne, {
         id: u,
-        size: Math.max((b || "").length, E.length, 1),
+        size: Math.max((y || "").length, E.length, 1),
         tabIndex: this.$props.tabIndex,
         accessKey: this.$props.accessKey,
-        placeholder: b,
-        value: R ? "" : E,
+        placeholder: y,
+        value: B ? "" : E,
         onChange: this.onChangeHandler,
         onBlur: this.handleBlur,
         onKeydown: this.onInputKeyDown,
-        ref: (y) => {
-          this.inputRef = y;
+        ref: (k) => {
+          this.inputRef = k;
         },
         disabled: i,
         expanded: N,
         owns: this.base.listBoxId,
         activedescendant: $,
-        "aria-describedBy": `tagslist-${this.base.guid}${this.$props.ariaDescribedBy ? " " + this.$props.ariaDescribedBy : ""}`,
+        ariaDescribedBy: I.length > 0 ? `tagslist-${this.base.guid}${this.$props.ariaDescribedBy ? " " + this.$props.ariaDescribedBy : ""}` : this.$props.ariaDescribedBy,
         "aria-labelledBy": this.$props.ariaLabelledBy,
         "aria-label": this.$props.ariaLabel,
         inputAttributes: he
@@ -794,15 +794,15 @@ const kt = /* @__PURE__ */ Ve({
       } = this.$props;
       if (!p)
         return null;
-      const v = this.areAllSelectableItemsSelected(), I = !v && this.areSomeSelectableItemsSelected(), b = M.toLanguageString(re, L[re]), $ = this.currentSelectAllFocused;
+      const v = this.areAllSelectableItemsSelected(), b = !v && this.areSomeSelectableItemsSelected(), y = M.toLanguageString(re, L[re]), $ = this.currentSelectAllFocused;
       return r("div", {
         class: "k-list-sticky-header"
-      }, [r("div", De({
-        class: B("k-list-sticky-header-item", {
+      }, [r("div", He({
+        class: R("k-list-sticky-header-item", {
           "k-selected": !u && v,
           "k-focus": $
         }),
-        "aria-label": b
+        "aria-label": y
       }, !u && {
         tabindex: 0,
         "aria-selected": v
@@ -811,31 +811,31 @@ const kt = /* @__PURE__ */ Ve({
         onKeydown: this.handleSelectAllItemKeyDown
       }), [u && r(Ue, {
         checked: v,
-        value: I ? null : v,
+        value: b ? null : v,
         tabIndex: -1
       }, null), r("span", {
         class: "k-list-item-text"
-      }, [b])])]);
+      }, [y])])]);
     }, Q = function() {
       let u;
       const {
         groupField: p
-      } = this.$props, v = C.call(this, this.$props.itemRender, F.call(this)), I = C.call(this, this.$props.groupHeaderItemRender, F.call(this)), b = C.call(this, this.$props.listNoDataRender, F.call(this)), $ = d ? d.skip : 0, {
-        focusedIndex: y
+      } = this.$props, v = C.call(this, this.$props.itemRender, F.call(this)), b = C.call(this, this.$props.groupHeaderItemRender, F.call(this)), y = C.call(this, this.$props.listNoDataRender, F.call(this)), $ = d ? d.skip : 0, {
+        focusedIndex: k
       } = this.getFocusedState(), W = `translateY(${A.translate}px)`;
-      let Z = H;
-      return p && (Z = this.base.getGroupedDataModernMode(H, p)), r(Pe, {
+      let Z = D;
+      return p && (Z = this.base.getGroupedDataModernMode(D, p)), r(Pe, {
         id: this.base.listBoxId,
         show: N,
         dataItems: Z.slice(),
-        focusedIndex: y,
+        focusedIndex: k,
         value: this.computedValue(),
         textField: a,
         valueField: o,
         optionsGuid: this.base.guid,
         ref: "list",
         wrapperStyle: {
-          maxHeight: R ? void 0 : this.stickyHeadersHeight > 0 && D.height ? `calc(${D.height} - ${this.stickyHeadersHeight}px)` : D.height
+          maxHeight: B ? void 0 : this.stickyHeadersHeight > 0 && H.height ? `calc(${H.height} - ${this.stickyHeadersHeight}px)` : H.height
         },
         wrapperCssClass: "k-list-content",
         listStyle: A.enabled ? {
@@ -845,8 +845,8 @@ const kt = /* @__PURE__ */ Ve({
         skip: $,
         onListclick: this.handleItemClick,
         itemRender: v,
-        groupHeaderItemRender: I,
-        noDataRender: b,
+        groupHeaderItemRender: b,
+        noDataRender: y,
         groupField: p,
         onScroll: this.onScroll,
         showSelectionCheckbox: this.$props.checkboxes
@@ -861,44 +861,44 @@ const kt = /* @__PURE__ */ Ve({
     }, ye = function() {
       const u = this.base, {
         allowCustom: p
-      } = this.$props, v = C.call(this, this.$props.groupStickyHeaderItemRender, F.call(this)), I = u.getTemplateDef.call(this, w), b = u.getTemplateDef.call(this, Y), $ = this.$props.filter !== void 0 ? this.$props.filter : this.currentText, {
-        focusedType: y
+      } = this.$props, v = C.call(this, this.$props.groupStickyHeaderItemRender, F.call(this)), b = u.getTemplateDef.call(this, w), y = u.getTemplateDef.call(this, Y), $ = this.$props.filter !== void 0 ? this.$props.filter : this.currentText, {
+        focusedType: k
       } = this.getFocusedState(), W = p && $ && r("div", {
-        class: B("k-list-custom-value", {
-          "k-focus": ue(y)
+        class: R("k-list-custom-value", {
+          "k-focus": ue(k)
         }),
         key: "customitem",
         onClick: this.customItemSelect,
         onMousedown: de
       }, [$]);
-      return this.group === void 0 && this.$props.groupField !== void 0 && (this.group = O(H[0], this.$props.groupField)), r(Le, {
+      return this.group === void 0 && this.$props.groupField !== void 0 && (this.group = O(D[0], this.$props.groupField)), r(Le, {
         ref: "container",
         onMousedown: de,
         dir: s !== void 0 ? s : u.dirCalculated,
         onBlur: this.handleBlur,
         width: this.popupWidth,
         popupSettings: {
-          ...D,
+          ...H,
           anchor: this.anchor,
           show: N,
           onOpen: this.onPopupOpened,
           onClose: this.onPopupClosed,
-          popupClass: B(D.popupClass, "k-list", {
+          popupClass: R(H.popupClass, "k-list", {
             [`k-list-${U[l] || l}`]: l,
             "k-virtual-list": this.base.vs.enabled
           }),
-          className: B("k-list-container", D.className)
+          className: R("k-list-container", H.className)
         },
-        itemsCount: H.length
+        itemsCount: D.length
       }, {
-        default: () => [I && r("div", {
+        default: () => [b && r("div", {
           class: "k-list-header"
-        }, [I]), Ie.call(this), this.group && H.length !== 0 && r(ie, {
+        }, [b]), Ie.call(this), this.group && D.length !== 0 && r(ie, {
           group: this.group,
           render: v
-        }, null), W, Q.call(this), b && r("div", {
+        }, null), W, Q.call(this), y && r("div", {
           class: "k-list-footer"
-        }, [b]), d && w]
+        }, [y]), d && w]
       });
     }, ke = function() {
       const u = this.$props.filter !== void 0 ? this.$props.filter : this.currentText;
@@ -959,12 +959,12 @@ const kt = /* @__PURE__ */ Ve({
       }, [u && r("div", {
         class: "k-list-header"
       }, [u]), r("div", {
-        class: B("k-list", {
-          [`k-list-${U[l] || l}`]: R ? !1 : l,
-          "k-list-lg": !!R,
+        class: R("k-list", {
+          [`k-list-${U[l] || l}`]: B ? !1 : l,
+          "k-list-lg": !!B,
           "k-virtual-list": A.enabled
         })
-      }, [this.group && H.length !== 0 && r(ie, {
+      }, [this.group && D.length !== 0 && r(ie, {
         group: this.group,
         render: v
       }, null), Q.call(this), p && r("div", {
@@ -988,7 +988,7 @@ const kt = /* @__PURE__ */ Ve({
       let u;
       return r("span", {
         ref: Me(this, "kendoAnchor"),
-        class: B("k-multiselect", "k-input", {
+        class: R("k-multiselect", "k-input", {
           [`k-input-${U[l] || l}`]: l,
           [`k-rounded-${et[g] || g}`]: g,
           [`k-input-${f}`]: f,
@@ -1013,21 +1013,21 @@ const kt = /* @__PURE__ */ Ve({
         fillMode: f,
         tagRender: me,
         onTagdelete: this.onTagDelete,
-        dataItems: x,
+        dataItems: I,
         guid: this.base.guid,
         summarizeAfter: this.$props.summarizeAfter,
-        summaryText: this.$props.summarizeAfter && x.length > this.$props.summarizeAfter ? M.toLanguageString(oe, L[oe]).replace("{0}", (x.length - this.$props.summarizeAfter).toString()) : void 0,
-        focused: P ? x.find((p) => ce(p, P, o)) : void 0
+        summaryText: this.$props.summarizeAfter && I.length > this.$props.summarizeAfter ? M.toLanguageString(oe, L[oe]).replace("{0}", (I.length - this.$props.summarizeAfter).toString()) : void 0,
+        focused: P ? I.find((p) => ce(p, P, o)) : void 0
       }, _(u = Se.call(this, j)) ? u : {
         default: () => [u]
-      }), x.length > 0 && ge && r(ze, {
+      }), I.length > 0 && ge && r(ze, {
         onClearclick: this.clearButtonClick
       }, null), r("span", {
         class: c ? "k-input-loading-icon k-icon k-i-loading" : void 0
-      }, null), !R && ye.call(this)]);
+      }, null), !B && ye.call(this)]);
     }.call(this), {
       ...this.$attrs
-    }), R && Oe.call(this)];
+    }), B && Oe.call(this)];
     return t ? r("span", {
       class: this.spanClassNames,
       dir: this.$props.dir

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