@progress/kendo-vue-dropdowns 7.1.0-develop.6 → 7.1.0-develop.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AutoComplete/AutoComplete.js +1 -1
- package/AutoComplete/AutoComplete.mjs +1 -4
- package/ComboBox/ComboBox.js +1 -1
- package/ComboBox/ComboBox.mjs +1 -4
- package/DropDownList/DropDownList.js +1 -1
- package/DropDownList/DropDownList.mjs +28 -31
- package/DropDownTree/DropDownTree.js +1 -1
- package/DropDownTree/DropDownTree.mjs +3 -6
- package/MultiSelect/MultiSelect.js +1 -1
- package/MultiSelect/MultiSelect.mjs +3 -7
- package/MultiSelect/TagList.js +1 -1
- package/MultiSelect/TagList.mjs +8 -11
- package/MultiSelectTree/MultiSelectTree.js +1 -1
- package/MultiSelectTree/MultiSelectTree.mjs +3 -6
- package/common/ListFilter.js +1 -1
- package/common/ListFilter.mjs +1 -4
- package/dist/cdn/js/kendo-vue-dropdowns.js +1 -1
- package/index.d.mts +109 -180
- package/index.d.ts +109 -180
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),w=require("../common/SearchBar.js"),M=require("../common/ListContainer.js"),L=require("../common/List.js"),T=require("../common/DropDownBase.js"),K=require("../common/GroupStickyHeader.js"),H=require("../common/ClearButton.js"),c=require("../common/utils.js"),a=require("@progress/kendo-vue-common"),{sizeMap:F,roundedMap:A}=a.kendoThemeMaps,q="Please enter a valid value!",P=r.defineComponent({name:"KendoAutoComplete",model:{event:"changemodel"},props:{id:String,defaultValue:{type:[String],default:void 0},name:String,modelValue:{type:[String],default:void 0},value:{type:[String],default:void 0},label:{type:String},placeholder:String,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:void 0},readonly:Boolean,accessKey:String,dataItems:Array,textField:String,loading:Boolean,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,header:[String,Function,Object],footer:[String,Function,Object],suggest:{type:[Boolean,String],default:!1},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,rounded:{type:String,default:"medium",validator:function(e){return["small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return["solid","flat","outline"].includes(e)}},size:{type:String,default:"medium",validator:function(e){return["small","medium","large"].includes(e)}},groupField:{type:String},inputAttributes:Object},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,focusedItem:void 0,searchState:{word:"",last:""},valueDuringOnChange:{},suggested:"",group:void 0,isScrolling:!1,popupWidth:void 0,itemHeight:0}},created(){this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.currentFocused=void 0,this.currentOpened=void 0,this.base=new T(this),this.anchor=a.guid(),this.inputId=a.guid()},setup(){const e=r.ref(null),t=r.ref(null);return{inputRef:e,kendoAnchorRef:t}},mounted(){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.setValidity()},watch:{currentOpened:function(e,t){this.prevCurrentOpened=t},opened:function(e,t){this.prevOpened=t},dataItems:function(e,t){this.prevData=t},focusedItem:function(e,t){this.prevFocusedItem=t}},updated(){var y;const{groupField:e="",dataItems:t=[]}=this.$props,i=this.focusedIndex(),s=t[i],n=this.prevData!==t,o=s!==void 0&&this.prevFocusedItem!==s,l=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,d=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,u=!d&&l,p=this.$refs.list;if(p&&(this.base.vs.list=p.list,this.base.list=p.list),e==="")(l&&(o||n)||u)&&this.base.scrollToItem(i);else if(!this.isScrolling){let h=(y=this.base.getGroupedDataModernMode(t,e))==null?void 0:y.indexOf(s);u&&(t&&t.length!==0&&this.base.resetGroupStickyHeader(t[0][e],this),this.base.scrollToItem(h)),l&&d&&o&&this.base.scrollToItem(h)}this.setValidity()},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}}},methods:{focus(){this.input&&this.input.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),e},primitiveValue(){const e=this.computedValue();return this.valuePrimitive?c.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,i=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:i,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:i=[]}=this.$props,s=i[e],n=c.getItemValue(s,this.$props.textField);this.triggerOnChange(n,t,{item:s}),this.triggerOnSelect(t,{item:s})},itemFocus(e,t){const{dataItems:i=[],textField:s}=this.$props,n=i[e];c.areSame(this.$data.focusedItem,n,s)||(t.data.focusedItem=n)},togglePopup(e){this.base.togglePopup(e)},onNavigate(e,t){const i=this.computedValue(),{dataItems:s=[],textField:n,focusedItemIndex:o}=this.$props,l=this.$data.focusedItem!==void 0?s.findIndex(u=>c.areSame(u,this.$data.focusedItem,n)):o?o(s,i,n):s.indexOf(c.getFocusedItem(s,i,n)),d=this.base.navigation.navigate({keyCode:t,current:l,max:s.length-1,min:0});d!==void 0&&this.itemFocus(d,e),this.applyState(e)},applyInputValue(e,t,i){const s=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,{dataItems:n=[],textField:o}=this.$props;if(this.suggested="",s&&i===a.Keys.enter){const l=n[this.focusedIndex(e)],d=c.getItemValue(l,o);this.triggerOnChange(d,t,{item:l}),this.triggerOnSelect(t,{item:l})}s&&this.togglePopup(t),this.applyState(t)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||q)},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},onChangeHandler(e){const i=this.base.initState(),s=e.target,n=s.value,o=s.selectionEnd===n.length;i.event=e;const l=this.suggested,d=this.computedValue(),u=d&&l&&d.substring(0,d.length-l.length),p=u&&u===n,y=u&&u.length>n.length,{suggest:h}=this.$props,g=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;if(h!==void 0&&h!==!1){p||y||!o?this.suggested="":this.suggestValue(n);const v=n+this.suggested,k={userInput:n,value:this.suggested};this.triggerOnChange(v,i,{suggestion:k})}else this.suggested="",this.triggerOnChange(n,i);(!g&&n||g&&!n)&&this.togglePopup(i),i.data.focusedItem=void 0,this.prevData&&this.prevData.length!==this.$props.dataItems&&(i.data.group=void 0),this.applyState(i)},clearButtonClick(e){const i=this.base.initState(),s=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;i.event=e;const n="";this.suggested="",this.triggerOnChange(n,i),this.$data.focusedItem!==void 0&&(i.data.focusedItem=void 0),s&&this.togglePopup(i),this.applyState(i)},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,i=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,s=this.base.initState(),n=this.computedValue();s.event=e;const o=()=>{i&&e.preventDefault()};t===a.Keys.enter||i&&t===a.Keys.esc||e.altKey&&t===a.Keys.up?(o(),this.applyInputValue(e.currentTarget.value,s,e.keyCode)):!e.altKey&&(t===a.Keys.up||t===a.Keys.down)?(o(),this.onNavigate(s,t)):!i&&t===a.Keys.esc?this.clearButtonClick(e):!i&&n&&e.altKey&&t===a.Keys.down&&(this.togglePopup(s),this.applyState(s))},handleBlur(e){if(this.currentFocused){const t=this.base.initState();t.data.focused=!1,t.events.push({type:"blur"}),t.event=e,this.applyInputValue(e.currentTarget.value,t),this.currentFocused=!1}},triggerOnChange(e,t,i){this.computedValue()===e&&!i||(t.data.currentValue=e,this.valueDuringOnChange=e,t.events.push({type:"change",...i||{}}))},triggerOnSelect(e,t){e.events.push({type:"select",...t||{}})},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},suggestValue(e){if(this.suggested="",e){const{dataItems:t=[],textField:i}=this.$props,s=t[c.itemIndexStartsWith(t,e,i)];if(s){const n=c.getItemValue(s,i);e.toLowerCase()!==n.toLowerCase()&&(this.suggested=n.substring(e.length))}}},focusedIndex(e){const{dataItems:t=[],textField:i,focusedItemIndex:s}=this.$props,n=e!==void 0?e:this.computedValue();return this.$data.focusedItem!==void 0?t.findIndex(o=>c.areSame(o,this.$data.focusedItem,i)):s?s(t,n,i):Math.max(0,t.indexOf(c.getFocusedItem(t,n,i)))},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const t=this.base.initState(),{list:i}=this.base,{groupField:s}=this.$props;let{dataItems:n=[]}=this.$props;if(!s||!n.length)return;let o=this.itemHeight||(i.children?i.children[0].offsetHeight:0);const d=e.target.scrollTop;s&&(n=this.base.getGroupedDataModernMode(n,s));let u=n[0][s];o===0&&(o=28);for(let p=1;p<n.length&&!(o*p>d);p++)n[p]&&n[p][s]&&(u=n[p][s]);u!==this.group&&(t.data.group=u,this.applyState(t))}},render(){const{dir:e,disabled:t,label:i,size:s,rounded:n,fillMode:o,style:l,loading:d,suggest:u,inputAttributes:p}=this.$props,y=!this.$props.validityStyles||this.validity().valid,h=this.currentFocused,g=this.base,v=this.computedValue(),k=!d&&!!v,O=this.$props.id||this.inputId,C=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings);typeof u=="string"&&(this.suggested=u);const B=function(I,f){const{placeholder:m,tabIndex:S,readonly:$}=this.$props,V=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;return r.createVNode(w.SearchBar,{id:f,placeholder:m,tabIndex:S,accessKey:this.$props.accessKey,value:I,suggestedText:this.suggested,focused:h,name:this.$props.name,ref:b=>{this.inputRef=b},onKeydown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:g.handleFocus,onBlur:this.handleBlur,disabled:t,readOnly:$,expanded:V,owns:g.listBoxId,activedescendant:"option-"+g.guid+"-"+this.focusedIndex(),onClearbuttonclick:this.clearButtonClick,ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:p},null)},D=function(){const{textField:I,groupField:f}=this.$props;let m=this.$props.dataItems||[];const S=a.templateRendering.call(this,this.$props.itemRender,a.getListeners.call(this)),$=a.templateRendering.call(this,this.$props.groupHeaderItemRender,a.getListeners.call(this)),V=a.templateRendering.call(this,this.$props.listNoDataRender,a.getListeners.call(this)),b=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;return f&&(m=this.base.getGroupedDataModernMode(m,f)),r.createVNode(L.List,{id:g.listBoxId,show:b,dataItems:m.slice(),focusedIndex:this.focusedIndex(),value:v,textField:I,valueField:I,highlightSelected:!1,optionsGuid:g.guid,ref:"list",wrapperStyle:{maxHeight:C.height},wrapperCssClass:"k-list-content",onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:$,noDataRender:V,groupField:f,onScroll:this.onScroll},null)},R=function(){const I=a.templateRendering.call(this,this.$props.header,a.getListeners.call(this)),f=a.templateRendering.call(this,this.$props.footer,a.getListeners.call(this)),m=a.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,a.getListeners.call(this)),S=a.getTemplate.call(this,{h:r.h,template:I}),$=a.getTemplate.call(this,{h:r.h,template:f}),V=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,b=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=c.getItemValue(b[0],this.$props.groupField)),r.createVNode(M.ListContainer,{onMousedown:N=>N.preventDefault(),width:this.popupWidth,ref:"container",popupSettings:{...C,anchor:this.anchor,show:V,popupClass:a.classNames(C.popupClass,"k-list",{[`k-list-${F[s]||s}`]:s}),className:a.classNames("k-list-container",C.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[S&&r.createVNode("div",{class:"k-list-header"},[S]),this.group&&b.length!==0&&r.createVNode(K.GroupStickyHeader,{group:this.group,render:m},null),D.call(this),$&&r.createVNode("div",{class:"k-list-footer"},[$])]})},x=r.createVNode("span",{class:a.classNames("k-autocomplete k-input",{[`k-input-${F[s]||s}`]:s,[`k-rounded-${A[n]||n}`]:n,[`k-input-${o}`]:o,"k-invalid":!y,"k-focus":h&&!t,"k-loading":d,"k-required":this.required,"k-disabled":t}),ref:a.setRef(this,"kendoAnchor"),style:i?{...l,width:void 0}:l,dir:e},[B.call(this,v||"",O),k&&!d&&r.createVNode(H.ClearButton,{onClearclick:this.clearButtonClick},null),r.createVNode("span",{class:d?"k-input-loading-icon k-icon k-i-loading":void 0},null),R.call(this)]);return i?r.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[x,this.$props.label?O?r.createVNode("label",{for:O,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):x}});exports.AutoComplete=P;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),w=require("../common/SearchBar.js"),M=require("../common/ListContainer.js"),L=require("../common/List.js"),T=require("../common/DropDownBase.js"),K=require("../common/GroupStickyHeader.js"),H=require("../common/ClearButton.js"),c=require("../common/utils.js"),a=require("@progress/kendo-vue-common"),{sizeMap:F,roundedMap:A}=a.kendoThemeMaps,q="Please enter a valid value!",P=r.defineComponent({name:"KendoAutoComplete",model:{event:"changemodel"},props:{id:String,defaultValue:{type:[String],default:void 0},name:String,modelValue:{type:[String],default:void 0},value:{type:[String],default:void 0},label:{type:String},placeholder:String,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:void 0},readonly:Boolean,accessKey:String,dataItems:Array,textField:String,loading:Boolean,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,header:[String,Function,Object],footer:[String,Function,Object],suggest:{type:[Boolean,String],default:!1},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,rounded:{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["small","medium","large"].includes(e)}},groupField:{type:String},inputAttributes:Object},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,focusedItem:void 0,searchState:{word:"",last:""},valueDuringOnChange:{},suggested:"",group:void 0,isScrolling:!1,popupWidth:void 0,itemHeight:0}},created(){this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.currentFocused=void 0,this.currentOpened=void 0,this.base=new T(this),this.anchor=a.guid(),this.inputId=a.guid()},setup(){const e=r.ref(null),t=r.ref(null);return{inputRef:e,kendoAnchorRef:t}},mounted(){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.setValidity()},watch:{currentOpened:function(e,t){this.prevCurrentOpened=t},opened:function(e,t){this.prevOpened=t},dataItems:function(e,t){this.prevData=t},focusedItem:function(e,t){this.prevFocusedItem=t}},updated(){var y;const{groupField:e="",dataItems:t=[]}=this.$props,i=this.focusedIndex(),s=t[i],n=this.prevData!==t,o=s!==void 0&&this.prevFocusedItem!==s,l=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,d=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,u=!d&&l,p=this.$refs.list;if(p&&(this.base.vs.list=p.list,this.base.list=p.list),e==="")(l&&(o||n)||u)&&this.base.scrollToItem(i);else if(!this.isScrolling){let h=(y=this.base.getGroupedDataModernMode(t,e))==null?void 0:y.indexOf(s);u&&(t&&t.length!==0&&this.base.resetGroupStickyHeader(t[0][e],this),this.base.scrollToItem(h)),l&&d&&o&&this.base.scrollToItem(h)}this.setValidity()},computed:{spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}}},methods:{focus(){this.input&&this.input.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),e},primitiveValue(){const e=this.computedValue();return this.valuePrimitive?c.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,i=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:i,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:i=[]}=this.$props,s=i[e],n=c.getItemValue(s,this.$props.textField);this.triggerOnChange(n,t,{item:s}),this.triggerOnSelect(t,{item:s})},itemFocus(e,t){const{dataItems:i=[],textField:s}=this.$props,n=i[e];c.areSame(this.$data.focusedItem,n,s)||(t.data.focusedItem=n)},togglePopup(e){this.base.togglePopup(e)},onNavigate(e,t){const i=this.computedValue(),{dataItems:s=[],textField:n,focusedItemIndex:o}=this.$props,l=this.$data.focusedItem!==void 0?s.findIndex(u=>c.areSame(u,this.$data.focusedItem,n)):o?o(s,i,n):s.indexOf(c.getFocusedItem(s,i,n)),d=this.base.navigation.navigate({keyCode:t,current:l,max:s.length-1,min:0});d!==void 0&&this.itemFocus(d,e),this.applyState(e)},applyInputValue(e,t,i){const s=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,{dataItems:n=[],textField:o}=this.$props;if(this.suggested="",s&&i===a.Keys.enter){const l=n[this.focusedIndex(e)],d=c.getItemValue(l,o);this.triggerOnChange(d,t,{item:l}),this.triggerOnSelect(t,{item:l})}s&&this.togglePopup(t),this.applyState(t)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||q)},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},onChangeHandler(e){const i=this.base.initState(),s=e.target,n=s.value,o=s.selectionEnd===n.length;i.event=e;const l=this.suggested,d=this.computedValue(),u=d&&l&&d.substring(0,d.length-l.length),p=u&&u===n,y=u&&u.length>n.length,{suggest:h}=this.$props,g=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;if(h!==void 0&&h!==!1){p||y||!o?this.suggested="":this.suggestValue(n);const v=n+this.suggested,k={userInput:n,value:this.suggested};this.triggerOnChange(v,i,{suggestion:k})}else this.suggested="",this.triggerOnChange(n,i);(!g&&n||g&&!n)&&this.togglePopup(i),i.data.focusedItem=void 0,this.prevData&&this.prevData.length!==this.$props.dataItems&&(i.data.group=void 0),this.applyState(i)},clearButtonClick(e){const i=this.base.initState(),s=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;i.event=e;const n="";this.suggested="",this.triggerOnChange(n,i),this.$data.focusedItem!==void 0&&(i.data.focusedItem=void 0),s&&this.togglePopup(i),this.applyState(i)},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,i=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,s=this.base.initState(),n=this.computedValue();s.event=e;const o=()=>{i&&e.preventDefault()};t===a.Keys.enter||i&&t===a.Keys.esc||e.altKey&&t===a.Keys.up?(o(),this.applyInputValue(e.currentTarget.value,s,e.keyCode)):!e.altKey&&(t===a.Keys.up||t===a.Keys.down)?(o(),this.onNavigate(s,t)):!i&&t===a.Keys.esc?this.clearButtonClick(e):!i&&n&&e.altKey&&t===a.Keys.down&&(this.togglePopup(s),this.applyState(s))},handleBlur(e){if(this.currentFocused){const t=this.base.initState();t.data.focused=!1,t.events.push({type:"blur"}),t.event=e,this.applyInputValue(e.currentTarget.value,t),this.currentFocused=!1}},triggerOnChange(e,t,i){this.computedValue()===e&&!i||(t.data.currentValue=e,this.valueDuringOnChange=e,t.events.push({type:"change",...i||{}}))},triggerOnSelect(e,t){e.events.push({type:"select",...t||{}})},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},suggestValue(e){if(this.suggested="",e){const{dataItems:t=[],textField:i}=this.$props,s=t[c.itemIndexStartsWith(t,e,i)];if(s){const n=c.getItemValue(s,i);e.toLowerCase()!==n.toLowerCase()&&(this.suggested=n.substring(e.length))}}},focusedIndex(e){const{dataItems:t=[],textField:i,focusedItemIndex:s}=this.$props,n=e!==void 0?e:this.computedValue();return this.$data.focusedItem!==void 0?t.findIndex(o=>c.areSame(o,this.$data.focusedItem,i)):s?s(t,n,i):Math.max(0,t.indexOf(c.getFocusedItem(t,n,i)))},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const t=this.base.initState(),{list:i}=this.base,{groupField:s}=this.$props;let{dataItems:n=[]}=this.$props;if(!s||!n.length)return;let o=this.itemHeight||(i.children?i.children[0].offsetHeight:0);const d=e.target.scrollTop;s&&(n=this.base.getGroupedDataModernMode(n,s));let u=n[0][s];o===0&&(o=28);for(let p=1;p<n.length&&!(o*p>d);p++)n[p]&&n[p][s]&&(u=n[p][s]);u!==this.group&&(t.data.group=u,this.applyState(t))}},render(){const{dir:e,disabled:t,label:i,size:s,rounded:n,fillMode:o,style:l,loading:d,suggest:u,inputAttributes:p}=this.$props,y=!this.$props.validityStyles||this.validity().valid,h=this.currentFocused,g=this.base,v=this.computedValue(),k=!d&&!!v,O=this.$props.id||this.inputId,C=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings);typeof u=="string"&&(this.suggested=u);const B=function(I,f){const{placeholder:m,tabIndex:S,readonly:$}=this.$props,V=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;return r.createVNode(w.SearchBar,{id:f,placeholder:m,tabIndex:S,accessKey:this.$props.accessKey,value:I,suggestedText:this.suggested,focused:h,name:this.$props.name,ref:b=>{this.inputRef=b},onKeydown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:g.handleFocus,onBlur:this.handleBlur,disabled:t,readOnly:$,expanded:V,owns:g.listBoxId,activedescendant:"option-"+g.guid+"-"+this.focusedIndex(),onClearbuttonclick:this.clearButtonClick,ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:p},null)},D=function(){const{textField:I,groupField:f}=this.$props;let m=this.$props.dataItems||[];const S=a.templateRendering.call(this,this.$props.itemRender,a.getListeners.call(this)),$=a.templateRendering.call(this,this.$props.groupHeaderItemRender,a.getListeners.call(this)),V=a.templateRendering.call(this,this.$props.listNoDataRender,a.getListeners.call(this)),b=this.$props.opened!==void 0?this.$props.opened:this.currentOpened;return f&&(m=this.base.getGroupedDataModernMode(m,f)),r.createVNode(L.List,{id:g.listBoxId,show:b,dataItems:m.slice(),focusedIndex:this.focusedIndex(),value:v,textField:I,valueField:I,highlightSelected:!1,optionsGuid:g.guid,ref:"list",wrapperStyle:{maxHeight:C.height},wrapperCssClass:"k-list-content",onListclick:this.handleItemClick,itemRender:S,groupHeaderItemRender:$,noDataRender:V,groupField:f,onScroll:this.onScroll},null)},R=function(){const I=a.templateRendering.call(this,this.$props.header,a.getListeners.call(this)),f=a.templateRendering.call(this,this.$props.footer,a.getListeners.call(this)),m=a.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,a.getListeners.call(this)),S=a.getTemplate.call(this,{h:r.h,template:I}),$=a.getTemplate.call(this,{h:r.h,template:f}),V=this.$props.opened!==void 0?this.$props.opened:this.currentOpened,b=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=c.getItemValue(b[0],this.$props.groupField)),r.createVNode(M.ListContainer,{onMousedown:N=>N.preventDefault(),width:this.popupWidth,ref:"container",popupSettings:{...C,anchor:this.anchor,show:V,popupClass:a.classNames(C.popupClass,"k-list",{[`k-list-${F[s]||s}`]:s}),className:a.classNames("k-list-container",C.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[S&&r.createVNode("div",{class:"k-list-header"},[S]),this.group&&b.length!==0&&r.createVNode(K.GroupStickyHeader,{group:this.group,render:m},null),D.call(this),$&&r.createVNode("div",{class:"k-list-footer"},[$])]})},x=r.createVNode("span",{class:a.classNames("k-autocomplete k-input",{[`k-input-${F[s]||s}`]:s,[`k-rounded-${A[n]||n}`]:n,[`k-input-${o}`]:o,"k-invalid":!y,"k-focus":h&&!t,"k-loading":d,"k-required":this.required,"k-disabled":t}),ref:a.setRef(this,"kendoAnchor"),style:i?{...l,width:void 0}:l,dir:e},[B.call(this,v||"",O),k&&!d&&r.createVNode(H.ClearButton,{onClearclick:this.clearButtonClick},null),r.createVNode("span",{class:d?"k-input-loading-icon k-icon k-i-loading":void 0},null),R.call(this)]);return i?r.createVNode("span",{class:this.spanClassNames,dir:this.$props.dir},[x,this.$props.label?O?r.createVNode("label",{for:O,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):x}});exports.AutoComplete=P;
|
|
@@ -104,21 +104,18 @@ const {
|
|
|
104
104
|
ariaDescribedBy: String,
|
|
105
105
|
rounded: {
|
|
106
106
|
type: String,
|
|
107
|
-
default: "medium",
|
|
108
107
|
validator: function(e) {
|
|
109
|
-
return ["small", "medium", "large", "full"].includes(e);
|
|
108
|
+
return ["none", "small", "medium", "large", "full"].includes(e);
|
|
110
109
|
}
|
|
111
110
|
},
|
|
112
111
|
fillMode: {
|
|
113
112
|
type: String,
|
|
114
|
-
default: "solid",
|
|
115
113
|
validator: function(e) {
|
|
116
114
|
return ["solid", "flat", "outline"].includes(e);
|
|
117
115
|
}
|
|
118
116
|
},
|
|
119
117
|
size: {
|
|
120
118
|
type: String,
|
|
121
|
-
default: "medium",
|
|
122
119
|
validator: function(e) {
|
|
123
120
|
return ["small", "medium", "large"].includes(e);
|
|
124
121
|
}
|
package/ComboBox/ComboBox.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),ge=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),l=require("@progress/kendo-vue-common"),_=require("@progress/kendo-vue-buttons"),o=require("../common/utils.js"),me=require("../common/SearchBar.js"),ve=require("../common/ListContainer.js"),be=require("../common/List.js"),Se=require("../common/ClearButton.js"),ye=require("@progress/kendo-vue-intl"),j=require("../messages/main.js"),W=require("@progress/kendo-svg-icons"),U=require("../common/constants.js"),Ie=require("@progress/kendo-vue-layout"),ke=require("../common/ListFilter.js"),{sizeMap:K,roundedMap:Ve}=l.kendoThemeMaps;function xe(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!n.isVNode(e)}const Ce="Please enter a valid value!",$e=n.defineComponent({name:"KendoComboBox",model:{event:"changemodel"},emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,pagechange:e=>!0,change:e=>!0,focus:e=>!0,blur:e=>!0,open:e=>!0,close:e=>!0,scroll:e=>!0},props:{id:String,dataItemKey:{type:[Object,String]},defaultValue:{type:[String,Object,Number,Boolean],default:void 0},name:String,modelValue:{type:[String,Object,Number,Boolean],default:void 0},value:{type:[String,Object,Number,Boolean],default:void 0},label:{type:String},placeholder:String,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},iconClassName:String,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,className:String,loading:Boolean,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,header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},virtual:{type:Object,default:void 0},suggest:{type:Boolean,default:!1},allowCustom:{type:Boolean,default:!1},clearButton:{type:Boolean,default:!0},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,valueField:String,valuePrimitive:Boolean,rounded:{type:String,default:"medium",validator:function(e){return["small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return["solid","flat","outline"].includes(e)}},size:{type:String,default:"medium",validator:function(e){return["small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},onFilterchange:Function,inputAttributes:Object},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:U.MOBILE_SMALL_DEVICE,medium:U.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,searchState:{word:"",last:""},_skipFocusEvent:!1,valueDuringOnChange:{},_navigated:!1,suggested:"",group:void 0,isScrolling:!1,itemHeight:0,state:void 0,popupWidth:void 0,windowWidth:0}},created(){this.observer=null,this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.currentFocused=void 0,this.currentOpened=void 0,this.prevCurrentValue=this.computedValue(),this.base=new ge(this),this.anchor=l.guid(),this.inputId=l.guid()},setup(){const e=n.ref(null),t=n.ref(null),i=n.ref(null),s=n.inject("kendoLocalizationService",{});return{inputRef:e,elementRef:t,kendoAnchorRef:i,kendoLocalizationService:s}},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.setValidity()},updated(){var m;const{dataItems:e=[],dataItemKey:t,virtual:i,groupField:s,textField:r}=this.$props,d=this.isOpen,a=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,u=!a&&d,p=this.$refs.list,v=this.$refs.scrollElement,c=this.computedValue();if(this.valueOnDidUpdate=c,p&&(this.base.vs.list=p.list,this.base.list=p.list),v&&(this.base.vs.scrollElement=v),p&&e.length&&this.base.vs.scrollerRef(p.$el),i&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const b=this.prevCurrentValue;let y=e.findIndex(x=>o.areSame(x,c,t));s&&(y=(m=this.base.getGroupedDataModernMode(e,s))==null?void 0:m.indexOf(c));const O=!o.areSame(b,c,t);if(u&&i)this.base.scrollToVirtualItem(i,y),this.prevCurrentOpened=!0;else if(u&&!i)e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][s],this),this.base.scrollToItem(y),this.prevCurrentOpened=!0;else if(d&&a&&c&&O)this.base.scrollToItem(y);else if(d&&!c&&!this.isScrolling){let x=0;if(s&&this.getFocusedIndex()!==-1&&e.length>0){const C=e[this.getFocusedIndex()][r],B=this.base.getGroupedDataModernMode(e,s),L=B.findIndex(k=>k[r]===C);x=B.slice(0,L).filter(k=>Object.keys(k).length===1).length}this.base.scrollToItem(this.getFocusedIndex()+x)}}u&&this.input&&this.input.focus(),this.prevCurrentValue=this.computedValue(),this.setValidity()},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),this.virtualHasChanged=!0},isOpen:function(){setTimeout(()=>{const e=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(e)},100)}},computed:{index(){const{dataItems:e=[],dataItemKey:t}=this.$props,i=this.computedValue();return e.findIndex(s=>o.areSame(s,i,t))},spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"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}},methods:{focus(){this.input&&this.input.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){const i=this.dataItems.findIndex(s=>o.getItemValue(s,e)===t);return this.dataItems[i]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive&&e&&typeof e=="object"?o.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,i=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:i,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:i=[],virtual:s,dataItemKey:r}=this.$props,d=s?s.skip:0,a=i[e-d],u=!o.areSame(a,this.computedValue(),r);this.triggerOnChange(a,t),this.currentText!==void 0&&(t.data.currentText=void 0),u&&this.base.triggerPageChangeCornerItems(a,t)},onNavigate(e,t){const{dataItems:i=[],virtual:s={skip:0}}=this.$props,r=this.$props.filter?this.$props.filter:this.currentText,d=this.getFocusedIndex(),a=this.base.vs,u=this.computedValue();if(this.suggested="",d!==-1&&!o.isPresent(u))this.handleItemSelect(d,e);else if(r==="")this.handleItemSelect(0,e);else{let p=s.skip+d;const v=this.base.navigation.navigate({keyCode:t,current:p,max:(a.enabled?a.total:i.length)-1,min:0});v!==void 0&&this.handleItemSelect(v,e)}},toggleBtnClick(e){const t=this.base.initState(),i=this.isOpen,s=this.adaptiveState;t.event=e,this.base.togglePopup(t),!i&&s&&this.base.filterChanged("",t),this.applyState(t)},applyValueOnEnter(e,t){const{dataItems:i=[],textField:s,allowCustom:r,valuePrimitive:d}=this.$props,a=this.isOpen,p=this.getSelectedItemText()===e?this.index:o.getItemIndexByText(i,e,s),v=p!==-1;let c;if(this.suggested="",v)c=i[p];else if(r)c=s!==void 0&&!d?{[s]:e}:e;else return this.selectFocusedItem(e,t);this.triggerOnChange(c,t),a&&this.base.togglePopup(t),this.$props.filter===void 0&&this.currentText!==void 0&&(t.data.currentText=void 0),this.applyState(t)},applyValueOnRejectSuggestions(e,t){const{dataItems:i=[],textField:s,allowCustom:r,valuePrimitive:d}=this.$props,a=this.isOpen,u=this.getSelectedItemText();if(this.suggested="",e===u||e===""&&!o.isPresent(u))return a&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t);const p=o.getItemIndexByText(i,e,s,!0),v=p!==-1;let c=null;v?c=i[p]:r&&e&&(s&&!d?c={[s]:e}:c=e),this.triggerOnChange(c,t),this.currentText!==void 0&&(t.data.currentText=void 0,this.base.filterChanged("",t)),a&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t)},selectFocusedItem(e,t){const i=this.isOpen,{dataItems:s=[],textField:r,virtual:d={skip:0},focusedItemIndex:a=o.itemIndexStartsWith}=this.$props,u=d.skip,p=e===""&&u===0?0:a(s,e,r);return p!==-1?this.handleItemSelect(p+u,t):(this.triggerOnChange(null,t),this.currentText!==void 0&&(t.data.currentText=void 0)),i&&this.base.togglePopup(t),this.applyState(t)},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},handleFocus(e){this.$emit("focus",e)},handleBlur(e){if(this.currentFocused){const t=this.base.initState();t.data.currentFocused=!1,t.events.push({type:"blur"}),t.event=e,this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,i=this.isOpen,s=this.base.initState();if(s.event=e,!e.altKey&&(t===l.Keys.up||t===l.Keys.down)){e.preventDefault(),this.onNavigate(s,t),this.applyState(s);return}const r=()=>{e.preventDefault(),this.base.togglePopup(s),this.applyState(s)};i?e.altKey&&t===l.Keys.up?r():t===l.Keys.enter?(e.preventDefault(),this.applyValueOnEnter(e.currentTarget.value,s)):t===l.Keys.esc&&(this.adaptiveState&&this.toggleBtnClick(e),r()):e.altKey&&t===l.Keys.down?r():t===l.Keys.esc&&this.applyValueOnRejectSuggestions(e.currentTarget.value,s)},inputOnChange(e){const t=this.base.initState();t.event=e;const i=this.isOpen,s=e.currentTarget,r=s.value;if(this.$props.suggest){const d=s.selectionEnd===r.length;let a=this.$props.filter!==void 0?this.$props.filter:this.currentText;o.isPresent(a)||(a=o.getItemValue(this.computedValue(),this.$props.textField)||"");const u=a&&a===r,p=a&&a.length>r.length;u||p||!d?this.suggested="":this.suggestValue(r)}this.$props.filter===void 0&&(t.data.currentText=r),this.currentFocusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(r,t),this.$props.filterable&&(t.data.group=void 0),this.applyState(t)},clearButtonClick(e){const t=this.base.initState();t.event=e,e.stopPropagation(),this.suggested="",this.base.filterChanged("",t),this.$props.filter===void 0&&this.currentText!==void 0&&(t.data.currentText=void 0),this.triggerOnChange(null,t),this.isOpen&&this.base.togglePopup(t),this.applyState(t)},getFocusedIndex(){const e=this.computedValue(),{dataItems:t=[],textField:i,dataItemKey:s,virtual:r={skip:0},focusedItemIndex:d=o.itemIndexStartsWith}=this.$props,a=this.$props.filter?this.$props.filter:this.currentText;return o.isPresent(e)&&a===void 0?t.findIndex(u=>o.areSame(u,e,s)):a?d(t,a,i):r.skip===0?0:-1},suggestValue(e){const{dataItems:t,textField:i}=this.$props;this.suggested=o.suggestValue(e,t,i)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Ce)},compareValues(e,t){return this.$props.valuePrimitive&&(typeof e!="object"||e===null)&&(typeof t!="object"||t===null)?e===t:o.areSame(e,t,this.$props.dataItemKey)},triggerOnChange(e,t){const i=this.computedValue();!o.isPresent(i)&&!o.isPresent(e)||this.compareValues(i,e)||(this.$props.value===void 0&&(this.currentValue=e),this.valueDuringOnChange=e,t.events.push({type:"change"}))},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const{vs:t,list:i}=this.base;t.scrollHandler(e);const s=this.base.initState(),{groupField:r}=this.$props;let{dataItems:d=[]}=this.$props,a;if(!r||!d.length)return;const u=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),v=e.target.scrollTop-t.skip*u;r&&(d=this.base.getGroupedDataModernMode(d,r),a=d[0][r]);for(let c=1;c<d.length&&!(u*c>v);c++)d[c]&&d[c][r]&&(a=d[c][r]);a!==this.group&&(s.data.group=a,this.applyState(s))},getInputText(e,t){return o.isPresent(e)&&e!==""?String(e):o.isPresent(t)?String(t):""},getSelectedItemText(){const{textField:e,valuePrimitive:t}=this.$props,i=this.computedValue();if(o.isPresent(i))return t?i&&typeof i=="object"?o.getItemValue(i,e):typeof i=="string"?i!==""?i:void 0:typeof i=="number"||typeof i=="boolean"?String(i):void 0:o.getItemValue(i,e)}},render(){let{dir:e,disabled:t,clearButton:i,label:s,textField:r,className:d,style:a,loading:u,icon:p,svgIcon:v,iconClassName:c,virtual:m,size:b,fillMode:y,rounded:O,adaptiveTitle:x,header:C,footer:B,groupStickyHeaderItemRender:L,placeholder:k,inputAttributes:Y}=this.$props;const J=this.currentFocused,Q=!this.$props.validityStyles||this.validity().valid,R=this.$props.filter!==void 0?this.$props.filter:this.currentText,E=this.getSelectedItemText(),A=this.getInputText(R,E),w=this.computedValue(),X=this.$props.valuePrimitive?!!this.findByFieldValue(this.valueField,w)||this.$props.allowCustom&&o.isPresent(w)&&w!=="":o.isPresent(w),Z=i&&(!!A||X),V=this.base,I=V.vs,P=this.$props.id||this.inputId,D=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),ee=ye.provideLocalizationService(this).toLanguageString(j.expandButton,j.messages[j.expandButton]),T=this.isOpen,F=this.adaptiveState;I.enabled=m!==void 0,m!==void 0&&(I.skip=m.skip,I.total=m.total,I.pageSize=m.pageSize),this.group===void 0&&this.$props.groupField!==void 0&&(this.group=o.getItemValue(this.$props.dataItems[0],this.$props.groupField));const te=h=>{const f=this.base.initState();f.event=h;const g=h.event.target.value;f.data.text=g,this.base.filterChanged(g,f),this.applyState(f)},ie=()=>[n.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[n.createVNode("div",{class:"k-actionsheet-title"},[n.createVNode("div",{class:"k-text-center"},[x]),k&&n.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[k])]),n.createVNode("div",{class:"k-actionsheet-actions"},[n.createVNode(_.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.toggleBtnClick,icon:"x",svgIcon:W.xIcon},null)])]),n.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[le.call(this)])],se=l.templateRendering.call(this,ie,l.getListeners.call(this)),ne=()=>{const h=V.getTemplateDef.call(this,C,n.h),f=V.getTemplateDef.call(this,B,n.h),g=l.templateRendering.call(this,L,l.getListeners.call(this)),S=this.$props.dataItems||[];return n.createVNode("div",{class:"k-list-container"},[h&&n.createVNode("div",{class:"k-list-header"},[h]),n.createVNode("div",{class:l.classNames("k-list",{[`k-list-${K[b]||b}`]:F?!1:b,"k-list-lg":!!F,"k-virtual-list":I.enabled})},[C&&n.createVNode("div",{class:"k-list-header"},[C]),this.group&&S.length!==0&&n.createVNode(G.GroupStickyHeader,{group:this.group,render:g},null),q.call(this),f&&n.createVNode("div",{class:"k-list-footer"},[f])])])},ae=l.templateRendering.call(this,ne,l.getListeners.call(this)),re=function(){return n.createVNode(Ie.ActionSheet,{expand:T,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",header:se,content:ae,onClose:this.toggleBtnClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},le=function(){const f=this.base.initState().data.text;return n.createVNode(ke.ListFilter,{adaptiveMode:!0,value:f,ref:"filterInput",onChange:g=>te(g),onKeydown:this.onInputKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode},null)},q=function(){let h;const{dataItemKey:f,groupField:g}=this.$props;let S=this.$props.dataItems||[];const $=l.templateRendering.call(this,this.$props.itemRender,l.getListeners.call(this)),M=l.templateRendering.call(this,this.$props.groupHeaderItemRender,l.getListeners.call(this)),H=l.templateRendering.call(this,this.$props.listNoDataRender,l.getListeners.call(this));m||(m={skip:0});const N=m.skip,pe=`translateY(${I.translate}px)`,he=T?this.getFocusedIndex():void 0,fe=o.isPresent(R)&&R!==E?null:this.computedValue();return g&&(S=this.base.getGroupedDataModernMode(S,g)),n.createVNode(be.List,{id:V.listBoxId,show:T,dataItems:S,focusedIndex:he,value:fe,textField:r,valueField:f,optionsGuid:V.guid,ref:"list",wrapperStyle:{maxHeight:F?void 0:D.height},wrapperCssClass:l.classNames("k-list-content",{"k-list-scroller":!this.$props.virtual}),listStyle:I.enabled?{transform:pe}:void 0,key:"listkey",skip:N,onListclick:this.handleItemClick,itemRender:$,groupHeaderItemRender:M,noDataRender:H,groupField:g,onScroll:this.onScroll},xe(h=oe.call(this))?h:{default:()=>[h]})},oe=function(){return I.enabled&&n.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},de=function(){const h=l.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,l.getListeners.call(this)),f=V.getTemplateDef.call(this,C),g=V.getTemplateDef.call(this,B),S=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=o.getItemValue(S[0],this.$props.groupField)),n.createVNode(ve.ListContainer,{ref:"container",onMousedown:$=>$.preventDefault(),width:this.popupWidth,popupSettings:{...D,anchor:this.anchor,show:T,popupClass:l.classNames(D.popupClass,"k-list",{[`k-list-${K[b]||b}`]:b,"k-virtual-list":this.base.vs.enabled}),className:l.classNames("k-list-container",D.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[f&&n.createVNode("div",{class:"k-list-header"},[f]),this.group&&S.length!==0&&n.createVNode(G.GroupStickyHeader,{group:this.group,render:h},null),q.call(this),g&&n.createVNode("div",{class:"k-list-footer"},[g])]})},ue=function(h,f){const{tabIndex:g,dataItems:S=[],dataItemKey:$}=this.$props;m||(m={skip:0});const M=this.computedValue(),H=Math.max(0,S.findIndex(N=>o.areSame(N,M,$)));return this.suggested&&!o.areSame(this.valueOnDidUpdate,M,$)&&(this.suggested=""),n.createVNode(me.SearchBar,{id:f,placeholder:k,tabIndex:g||void 0,accessKey:this.$props.accessKey,value:h+this.suggested,suggestedText:this.suggested,ref:N=>{this.inputRef=N},onKeydown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:t,expanded:T,owns:this.base.listBoxId,activedescendant:this.base.guid+"-"+(H+m.skip),ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:Y},null)},ce=function(){return n.createVNode("span",{class:l.classNames("k-combobox k-input",{[`k-input-${K[b]||b}`]:b,[`k-rounded-${Ve[O]||O}`]:O,[`k-input-${y}`]:y,"k-invalid":!Q,"k-loading":u,"k-required":this.required,"k-disabled":t,"k-focus":J&&!t},d),ref:l.setRef(this,"kendoAnchor"),style:s?{...a,width:void 0}:a,dir:e},[ue.call(this,A||"",P),Z&&!u&&n.createVNode(Se.ClearButton,{onClearclick:this.clearButtonClick,key:"clearbutton"},null),u&&n.createVNode(l.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),n.createVNode(_.Button,{type:"button",tabIndex:-1,"aria-label":ee,size:b,fillMode:y,rounded:null,class:"k-input-button",icon:p||"caret-alt-down",svgIcon:v||W.caretAltDownIcon,iconClass:c,onClick:this.toggleBtnClick,onMousedown:h=>h.preventDefault()},null),!F&&de.call(this)])},z=[n.h(ce.call(this),{...this.$attrs}),F&&re.call(this)];return s?n.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,dir:this.$props.dir},[z,this.$props.label?P?n.createVNode("label",{for:P,class:"k-floating-label"},[this.$props.label]):n.createVNode("span",{class:"k-label"},[this.$props.label]):null]):z}});exports.ComboBox=$e;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),ge=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),o=require("@progress/kendo-vue-common"),_=require("@progress/kendo-vue-buttons"),l=require("../common/utils.js"),me=require("../common/SearchBar.js"),ve=require("../common/ListContainer.js"),be=require("../common/List.js"),Se=require("../common/ClearButton.js"),ye=require("@progress/kendo-vue-intl"),j=require("../messages/main.js"),W=require("@progress/kendo-svg-icons"),U=require("../common/constants.js"),Ie=require("@progress/kendo-vue-layout"),ke=require("../common/ListFilter.js"),{sizeMap:K,roundedMap:Ve}=o.kendoThemeMaps;function xe(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!n.isVNode(e)}const Ce="Please enter a valid value!",$e=n.defineComponent({name:"KendoComboBox",model:{event:"changemodel"},emits:{changemodel:e=>!0,"update:modelValue":e=>!0,filterchange:e=>!0,pagechange:e=>!0,change:e=>!0,focus:e=>!0,blur:e=>!0,open:e=>!0,close:e=>!0,scroll:e=>!0},props:{id:String,dataItemKey:{type:[Object,String]},defaultValue:{type:[String,Object,Number,Boolean],default:void 0},name:String,modelValue:{type:[String,Object,Number,Boolean],default:void 0},value:{type:[String,Object,Number,Boolean],default:void 0},label:{type:String},placeholder:String,required:{type:Boolean,default:!1},valid:{type:Boolean,default:void 0},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},iconClassName:String,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,className:String,loading:Boolean,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,header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},virtual:{type:Object,default:void 0},suggest:{type:Boolean,default:!1},allowCustom:{type:Boolean,default:!1},clearButton:{type:Boolean,default:!0},ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,valueField:String,valuePrimitive:Boolean,rounded:{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["small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},onFilterchange:Function,inputAttributes:Object},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:U.MOBILE_SMALL_DEVICE,medium:U.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,searchState:{word:"",last:""},_skipFocusEvent:!1,valueDuringOnChange:{},_navigated:!1,suggested:"",group:void 0,isScrolling:!1,itemHeight:0,state:void 0,popupWidth:void 0,windowWidth:0}},created(){this.observer=null,this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.currentFocused=void 0,this.currentOpened=void 0,this.prevCurrentValue=this.computedValue(),this.base=new ge(this),this.anchor=o.guid(),this.inputId=o.guid()},setup(){const e=n.ref(null),t=n.ref(null),i=n.ref(null),s=n.inject("kendoLocalizationService",{});return{inputRef:e,elementRef:t,kendoAnchorRef:i,kendoLocalizationService:s}},mounted(){this.observer=o.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=o.getRef(this,"kendoAnchor"),this.element=o.getRef(this,"kendoAnchor"),this.base.didMount(),this.setValidity()},updated(){var m;const{dataItems:e=[],dataItemKey:t,virtual:i,groupField:s,textField:r}=this.$props,d=this.isOpen,a=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,u=!a&&d,p=this.$refs.list,v=this.$refs.scrollElement,c=this.computedValue();if(this.valueOnDidUpdate=c,p&&(this.base.vs.list=p.list,this.base.list=p.list),v&&(this.base.vs.scrollElement=v),p&&e.length&&this.base.vs.scrollerRef(p.$el),i&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const b=this.prevCurrentValue;let y=e.findIndex(x=>l.areSame(x,c,t));s&&(y=(m=this.base.getGroupedDataModernMode(e,s))==null?void 0:m.indexOf(c));const O=!l.areSame(b,c,t);if(u&&i)this.base.scrollToVirtualItem(i,y),this.prevCurrentOpened=!0;else if(u&&!i)e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][s],this),this.base.scrollToItem(y),this.prevCurrentOpened=!0;else if(d&&a&&c&&O)this.base.scrollToItem(y);else if(d&&!c&&!this.isScrolling){let x=0;if(s&&this.getFocusedIndex()!==-1&&e.length>0){const C=e[this.getFocusedIndex()][r],B=this.base.getGroupedDataModernMode(e,s),L=B.findIndex(k=>k[r]===C);x=B.slice(0,L).filter(k=>Object.keys(k).length===1).length}this.base.scrollToItem(this.getFocusedIndex()+x)}}u&&this.input&&this.input.focus(),this.prevCurrentValue=this.computedValue(),this.setValidity()},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),this.virtualHasChanged=!0},isOpen:function(){setTimeout(()=>{const e=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(e)},100)}},computed:{index(){const{dataItems:e=[],dataItemKey:t}=this.$props,i=this.computedValue();return e.findIndex(s=>l.areSame(s,i,t))},spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"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}},methods:{focus(){this.input&&this.input.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){const i=this.dataItems.findIndex(s=>l.getItemValue(s,e)===t);return this.dataItems[i]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive&&e&&typeof e=="object"?l.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,i=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:i,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:i=[],virtual:s,dataItemKey:r}=this.$props,d=s?s.skip:0,a=i[e-d],u=!l.areSame(a,this.computedValue(),r);this.triggerOnChange(a,t),this.currentText!==void 0&&(t.data.currentText=void 0),u&&this.base.triggerPageChangeCornerItems(a,t)},onNavigate(e,t){const{dataItems:i=[],virtual:s={skip:0}}=this.$props,r=this.$props.filter?this.$props.filter:this.currentText,d=this.getFocusedIndex(),a=this.base.vs,u=this.computedValue();if(this.suggested="",d!==-1&&!l.isPresent(u))this.handleItemSelect(d,e);else if(r==="")this.handleItemSelect(0,e);else{let p=s.skip+d;const v=this.base.navigation.navigate({keyCode:t,current:p,max:(a.enabled?a.total:i.length)-1,min:0});v!==void 0&&this.handleItemSelect(v,e)}},toggleBtnClick(e){const t=this.base.initState(),i=this.isOpen,s=this.adaptiveState;t.event=e,this.base.togglePopup(t),!i&&s&&this.base.filterChanged("",t),this.applyState(t)},applyValueOnEnter(e,t){const{dataItems:i=[],textField:s,allowCustom:r,valuePrimitive:d}=this.$props,a=this.isOpen,p=this.getSelectedItemText()===e?this.index:l.getItemIndexByText(i,e,s),v=p!==-1;let c;if(this.suggested="",v)c=i[p];else if(r)c=s!==void 0&&!d?{[s]:e}:e;else return this.selectFocusedItem(e,t);this.triggerOnChange(c,t),a&&this.base.togglePopup(t),this.$props.filter===void 0&&this.currentText!==void 0&&(t.data.currentText=void 0),this.applyState(t)},applyValueOnRejectSuggestions(e,t){const{dataItems:i=[],textField:s,allowCustom:r,valuePrimitive:d}=this.$props,a=this.isOpen,u=this.getSelectedItemText();if(this.suggested="",e===u||e===""&&!l.isPresent(u))return a&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t);const p=l.getItemIndexByText(i,e,s,!0),v=p!==-1;let c=null;v?c=i[p]:r&&e&&(s&&!d?c={[s]:e}:c=e),this.triggerOnChange(c,t),this.currentText!==void 0&&(t.data.currentText=void 0,this.base.filterChanged("",t)),a&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t)},selectFocusedItem(e,t){const i=this.isOpen,{dataItems:s=[],textField:r,virtual:d={skip:0},focusedItemIndex:a=l.itemIndexStartsWith}=this.$props,u=d.skip,p=e===""&&u===0?0:a(s,e,r);return p!==-1?this.handleItemSelect(p+u,t):(this.triggerOnChange(null,t),this.currentText!==void 0&&(t.data.currentText=void 0)),i&&this.base.togglePopup(t),this.applyState(t)},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},handleFocus(e){this.$emit("focus",e)},handleBlur(e){if(this.currentFocused){const t=this.base.initState();t.data.currentFocused=!1,t.events.push({type:"blur"}),t.event=e,this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},onInputKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const t=e.keyCode,i=this.isOpen,s=this.base.initState();if(s.event=e,!e.altKey&&(t===o.Keys.up||t===o.Keys.down)){e.preventDefault(),this.onNavigate(s,t),this.applyState(s);return}const r=()=>{e.preventDefault(),this.base.togglePopup(s),this.applyState(s)};i?e.altKey&&t===o.Keys.up?r():t===o.Keys.enter?(e.preventDefault(),this.applyValueOnEnter(e.currentTarget.value,s)):t===o.Keys.esc&&(this.adaptiveState&&this.toggleBtnClick(e),r()):e.altKey&&t===o.Keys.down?r():t===o.Keys.esc&&this.applyValueOnRejectSuggestions(e.currentTarget.value,s)},inputOnChange(e){const t=this.base.initState();t.event=e;const i=this.isOpen,s=e.currentTarget,r=s.value;if(this.$props.suggest){const d=s.selectionEnd===r.length;let a=this.$props.filter!==void 0?this.$props.filter:this.currentText;l.isPresent(a)||(a=l.getItemValue(this.computedValue(),this.$props.textField)||"");const u=a&&a===r,p=a&&a.length>r.length;u||p||!d?this.suggested="":this.suggestValue(r)}this.$props.filter===void 0&&(t.data.currentText=r),this.currentFocusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(r,t),this.$props.filterable&&(t.data.group=void 0),this.applyState(t)},clearButtonClick(e){const t=this.base.initState();t.event=e,e.stopPropagation(),this.suggested="",this.base.filterChanged("",t),this.$props.filter===void 0&&this.currentText!==void 0&&(t.data.currentText=void 0),this.triggerOnChange(null,t),this.isOpen&&this.base.togglePopup(t),this.applyState(t)},getFocusedIndex(){const e=this.computedValue(),{dataItems:t=[],textField:i,dataItemKey:s,virtual:r={skip:0},focusedItemIndex:d=l.itemIndexStartsWith}=this.$props,a=this.$props.filter?this.$props.filter:this.currentText;return l.isPresent(e)&&a===void 0?t.findIndex(u=>l.areSame(u,e,s)):a?d(t,a,i):r.skip===0?0:-1},suggestValue(e){const{dataItems:t,textField:i}=this.$props;this.suggested=l.suggestValue(e,t,i)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Ce)},compareValues(e,t){return this.$props.valuePrimitive&&(typeof e!="object"||e===null)&&(typeof t!="object"||t===null)?e===t:l.areSame(e,t,this.$props.dataItemKey)},triggerOnChange(e,t){const i=this.computedValue();!l.isPresent(i)&&!l.isPresent(e)||this.compareValues(i,e)||(this.$props.value===void 0&&(this.currentValue=e),this.valueDuringOnChange=e,t.events.push({type:"change"}))},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const{vs:t,list:i}=this.base;t.scrollHandler(e);const s=this.base.initState(),{groupField:r}=this.$props;let{dataItems:d=[]}=this.$props,a;if(!r||!d.length)return;const u=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),v=e.target.scrollTop-t.skip*u;r&&(d=this.base.getGroupedDataModernMode(d,r),a=d[0][r]);for(let c=1;c<d.length&&!(u*c>v);c++)d[c]&&d[c][r]&&(a=d[c][r]);a!==this.group&&(s.data.group=a,this.applyState(s))},getInputText(e,t){return l.isPresent(e)&&e!==""?String(e):l.isPresent(t)?String(t):""},getSelectedItemText(){const{textField:e,valuePrimitive:t}=this.$props,i=this.computedValue();if(l.isPresent(i))return t?i&&typeof i=="object"?l.getItemValue(i,e):typeof i=="string"?i!==""?i:void 0:typeof i=="number"||typeof i=="boolean"?String(i):void 0:l.getItemValue(i,e)}},render(){let{dir:e,disabled:t,clearButton:i,label:s,textField:r,className:d,style:a,loading:u,icon:p,svgIcon:v,iconClassName:c,virtual:m,size:b,fillMode:y,rounded:O,adaptiveTitle:x,header:C,footer:B,groupStickyHeaderItemRender:L,placeholder:k,inputAttributes:Y}=this.$props;const J=this.currentFocused,Q=!this.$props.validityStyles||this.validity().valid,R=this.$props.filter!==void 0?this.$props.filter:this.currentText,E=this.getSelectedItemText(),A=this.getInputText(R,E),w=this.computedValue(),X=this.$props.valuePrimitive?!!this.findByFieldValue(this.valueField,w)||this.$props.allowCustom&&l.isPresent(w)&&w!=="":l.isPresent(w),Z=i&&(!!A||X),V=this.base,I=V.vs,P=this.$props.id||this.inputId,D=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),ee=ye.provideLocalizationService(this).toLanguageString(j.expandButton,j.messages[j.expandButton]),T=this.isOpen,F=this.adaptiveState;I.enabled=m!==void 0,m!==void 0&&(I.skip=m.skip,I.total=m.total,I.pageSize=m.pageSize),this.group===void 0&&this.$props.groupField!==void 0&&(this.group=l.getItemValue(this.$props.dataItems[0],this.$props.groupField));const te=h=>{const f=this.base.initState();f.event=h;const g=h.event.target.value;f.data.text=g,this.base.filterChanged(g,f),this.applyState(f)},ie=()=>[n.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[n.createVNode("div",{class:"k-actionsheet-title"},[n.createVNode("div",{class:"k-text-center"},[x]),k&&n.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[k])]),n.createVNode("div",{class:"k-actionsheet-actions"},[n.createVNode(_.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.toggleBtnClick,icon:"x",svgIcon:W.xIcon},null)])]),n.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[oe.call(this)])],se=o.templateRendering.call(this,ie,o.getListeners.call(this)),ne=()=>{const h=V.getTemplateDef.call(this,C,n.h),f=V.getTemplateDef.call(this,B,n.h),g=o.templateRendering.call(this,L,o.getListeners.call(this)),S=this.$props.dataItems||[];return n.createVNode("div",{class:"k-list-container"},[h&&n.createVNode("div",{class:"k-list-header"},[h]),n.createVNode("div",{class:o.classNames("k-list",{[`k-list-${K[b]||b}`]:F?!1:b,"k-list-lg":!!F,"k-virtual-list":I.enabled})},[C&&n.createVNode("div",{class:"k-list-header"},[C]),this.group&&S.length!==0&&n.createVNode(G.GroupStickyHeader,{group:this.group,render:g},null),q.call(this),f&&n.createVNode("div",{class:"k-list-footer"},[f])])])},ae=o.templateRendering.call(this,ne,o.getListeners.call(this)),re=function(){return n.createVNode(Ie.ActionSheet,{expand:T,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",header:se,content:ae,onClose:this.toggleBtnClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},oe=function(){const f=this.base.initState().data.text;return n.createVNode(ke.ListFilter,{adaptiveMode:!0,value:f,ref:"filterInput",onChange:g=>te(g),onKeydown:this.onInputKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode},null)},q=function(){let h;const{dataItemKey:f,groupField:g}=this.$props;let S=this.$props.dataItems||[];const $=o.templateRendering.call(this,this.$props.itemRender,o.getListeners.call(this)),M=o.templateRendering.call(this,this.$props.groupHeaderItemRender,o.getListeners.call(this)),H=o.templateRendering.call(this,this.$props.listNoDataRender,o.getListeners.call(this));m||(m={skip:0});const N=m.skip,pe=`translateY(${I.translate}px)`,he=T?this.getFocusedIndex():void 0,fe=l.isPresent(R)&&R!==E?null:this.computedValue();return g&&(S=this.base.getGroupedDataModernMode(S,g)),n.createVNode(be.List,{id:V.listBoxId,show:T,dataItems:S,focusedIndex:he,value:fe,textField:r,valueField:f,optionsGuid:V.guid,ref:"list",wrapperStyle:{maxHeight:F?void 0:D.height},wrapperCssClass:o.classNames("k-list-content",{"k-list-scroller":!this.$props.virtual}),listStyle:I.enabled?{transform:pe}:void 0,key:"listkey",skip:N,onListclick:this.handleItemClick,itemRender:$,groupHeaderItemRender:M,noDataRender:H,groupField:g,onScroll:this.onScroll},xe(h=le.call(this))?h:{default:()=>[h]})},le=function(){return I.enabled&&n.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},de=function(){const h=o.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,o.getListeners.call(this)),f=V.getTemplateDef.call(this,C),g=V.getTemplateDef.call(this,B),S=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=l.getItemValue(S[0],this.$props.groupField)),n.createVNode(ve.ListContainer,{ref:"container",onMousedown:$=>$.preventDefault(),width:this.popupWidth,popupSettings:{...D,anchor:this.anchor,show:T,popupClass:o.classNames(D.popupClass,"k-list",{[`k-list-${K[b]||b}`]:b,"k-virtual-list":this.base.vs.enabled}),className:o.classNames("k-list-container",D.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[f&&n.createVNode("div",{class:"k-list-header"},[f]),this.group&&S.length!==0&&n.createVNode(G.GroupStickyHeader,{group:this.group,render:h},null),q.call(this),g&&n.createVNode("div",{class:"k-list-footer"},[g])]})},ue=function(h,f){const{tabIndex:g,dataItems:S=[],dataItemKey:$}=this.$props;m||(m={skip:0});const M=this.computedValue(),H=Math.max(0,S.findIndex(N=>l.areSame(N,M,$)));return this.suggested&&!l.areSame(this.valueOnDidUpdate,M,$)&&(this.suggested=""),n.createVNode(me.SearchBar,{id:f,placeholder:k,tabIndex:g||void 0,accessKey:this.$props.accessKey,value:h+this.suggested,suggestedText:this.suggested,ref:N=>{this.inputRef=N},onKeydown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:t,expanded:T,owns:this.base.listBoxId,activedescendant:this.base.guid+"-"+(H+m.skip),ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:Y},null)},ce=function(){return n.createVNode("span",{class:o.classNames("k-combobox k-input",{[`k-input-${K[b]||b}`]:b,[`k-rounded-${Ve[O]||O}`]:O,[`k-input-${y}`]:y,"k-invalid":!Q,"k-loading":u,"k-required":this.required,"k-disabled":t,"k-focus":J&&!t},d),ref:o.setRef(this,"kendoAnchor"),style:s?{...a,width:void 0}:a,dir:e},[ue.call(this,A||"",P),Z&&!u&&n.createVNode(Se.ClearButton,{onClearclick:this.clearButtonClick,key:"clearbutton"},null),u&&n.createVNode(o.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),n.createVNode(_.Button,{type:"button",tabIndex:-1,"aria-label":ee,size:b,fillMode:y,rounded:null,class:"k-input-button",icon:p||"caret-alt-down",svgIcon:v||W.caretAltDownIcon,iconClass:c,onClick:this.toggleBtnClick,onMousedown:h=>h.preventDefault()},null),!F&&de.call(this)])},z=[n.h(ce.call(this),{...this.$attrs}),F&&re.call(this)];return s?n.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,dir:this.$props.dir},[z,this.$props.label?P?n.createVNode("label",{for:P,class:"k-floating-label"},[this.$props.label]):n.createVNode("span",{class:"k-label"},[this.$props.label]):null]):z}});exports.ComboBox=$e;
|
package/ComboBox/ComboBox.mjs
CHANGED
|
@@ -150,21 +150,18 @@ const We = "Please enter a valid value!", ut = /* @__PURE__ */ xe({
|
|
|
150
150
|
valuePrimitive: Boolean,
|
|
151
151
|
rounded: {
|
|
152
152
|
type: String,
|
|
153
|
-
default: "medium",
|
|
154
153
|
validator: function(e) {
|
|
155
|
-
return ["small", "medium", "large", "full"].includes(e);
|
|
154
|
+
return ["none", "small", "medium", "large", "full"].includes(e);
|
|
156
155
|
}
|
|
157
156
|
},
|
|
158
157
|
fillMode: {
|
|
159
158
|
type: String,
|
|
160
|
-
default: "solid",
|
|
161
159
|
validator: function(e) {
|
|
162
160
|
return ["solid", "flat", "outline"].includes(e);
|
|
163
161
|
}
|
|
164
162
|
},
|
|
165
163
|
size: {
|
|
166
164
|
type: String,
|
|
167
|
-
default: "medium",
|
|
168
165
|
validator: function(e) {
|
|
169
166
|
return ["small", "medium", "large"].includes(e);
|
|
170
167
|
}
|
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),i=require("@progress/kendo-vue-common"),E=require("@progress/kendo-vue-buttons"),ce=require("../common/ListContainer.js"),he=require("../common/ListFilter.js"),fe=require("../common/ListDefaultItem.js"),ge=require("../common/List.js"),me=require("../common/DropDownBase.js"),P=require("../common/GroupStickyHeader.js"),F=require("../messages/main.js"),ve=require("@progress/kendo-vue-intl"),_=require("../common/constants.js"),be=require("@progress/kendo-vue-layout"),p=require("../common/utils.js"),j=require("@progress/kendo-svg-icons"),{sizeMap:L,roundedMap:ye}=i.kendoThemeMaps;function Ie(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!n.isVNode(e)}const Se="Please select a value from the list!",ke=n.defineComponent({name:"KendoDropDownList",model:{event:"changemodel"},props:{id:String,title:String,dataItemKey:{type:[Object,String]},defaultValue:{type:[String,Object,Number,Boolean],default:void 0},name:String,modelValue:{type:[String,Object,Number,Boolean],default:void 0},value:{type:[String,Object,Number,Boolean],default:void 0},label:{type:String},required:{type:Boolean,default:!1},leftRightKeysNavigation:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},validate:{type:Boolean},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},delay:{type:Number,default:500},ignoreCase:{type:Boolean,default:!0},icon:String,svgIcon:Object,iconClassName:String,defaultItem:[Object,String],valueRender:[String,Function,Object],valueMap:Function,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,valueField:String,valuePrimitive:Boolean,className:String,loading:Boolean,popupSettings:{type:Object,default:{animate:!0,height:"200px",anchor:""}},itemRender:[String,Function,Object],groupHeaderItemRender:[String,Function,Object],groupStickyHeaderItemRender:[String,Function,Object],listNoDataRender:[String,Function,Object],focusedItemIndex:Function,header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},virtual:{type:Object,default:void 0},ariaLabelledBy:String,ariaLabel:String,ariaDescribedBy:String,rounded:{type:String,default:"medium",validator:function(e){return["small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return["solid","flat","outline"].includes(e)}},size:{type:String,default:"medium",validator:function(e){return["small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},onChange:Function},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:_.MOBILE_SMALL_DEVICE,medium:_.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,searchState:{word:"",last:""},_skipFocusEvent:!1,valueDuringOnChange:{},_navigated:!1,group:void 0,isScrolling:!1,itemHeight:0,state:void 0,popupWidth:void 0,windowWidth: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),this.virtualHasChanged=!0},isOpen:function(){setTimeout(()=>{const e=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(e)},100)}},created(){this.observer=null,this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.prevCurrentValue=this.computedValue(),this.currentFocused=void 0,this.currentOpened=void 0,this.base=new me(this),this.anchor=i.guid(),this.inputId=i.guid()},setup(){const e=n.ref(null),t=n.ref(null),a=n.ref(null);return{selectRef:e,baseWrapperRef:t,kendoAnchorRef:a}},mounted(){this.observer=i.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.hasMounted=!0,this.select=i.getRef(this,"select"),this.base.wrapper=i.getRef(this,"kendoAnchor"),this.base.didMount(),this.setValidity()},updated(){var I;const{dataItems:e=[],dataItemKey:t,virtual:a,groupField:r,textField:o}=this.$props,s=this.isOpen,d=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,l=!d&&s,u=this.$refs.list,f=this.$refs.filterInput,c=this.$refs.scrollElement;if(this.$refs.scroller,u&&(this.base.vs.list=u.list,this.base.list=u.list),c&&(this.base.vs.scrollElement=c),f&&(this.filterInput=f),u&&e.length&&this.base.vs.scrollerRef(u.$el),this.$props.popupSettings.animate||l&&this.onPopupOpened(),a&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const v=this.computedValue(),m=this.prevCurrentValue;let h=e.findIndex(b=>p.areSame(b,v,t));r&&(h=(I=this.base.getGroupedDataModernMode(e,r))==null?void 0:I.indexOf(v));const S=!p.areSame(m,v,t);l&&a?(this.base.scrollToVirtualItem(a,h),this.prevCurrentOpened=!0):l&&!a?(e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][r],this),this.base.scrollToItem(h),this.prevCurrentOpened=!0):s&&d&&v&&S&&!this._navigated?this.base.scrollToItem(h):s&&d&&this._navigated&&(this._navigated&&a&&a.skip===0?this.base.vs.reset():this._navigated&&a&&a.skip===a.total-a.pageSize&&this.base.vs.scrollToEnd())}this._navigated=!1,this.prevCurrentValue=this.computedValue(),this.setValidity()},computed:{index(){const{dataItems:e=[],dataItemKey:t}=this.$props,a=this.computedValue();return e.findIndex(r=>p.areSame(r,a,t))},spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}},dropDownListId(){return`value-${this.base.guid}${this.$props.ariaDescribedBy?" "+this.$props.ariaDescribedBy:""}`},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}},methods:{focus(){this.base.wrapper&&this.base.wrapper.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),!p.isPresent(e)&&this.$props.defaultItem!==void 0&&(e=this.$props.defaultItem),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){const a=this.dataItems.findIndex(r=>p.getItemValue(r,e)===t);return this.dataItems[a]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive?p.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,a=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:a,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:a=[],virtual:r,dataItemKey:o,defaultItem:s}=this.$props,d=r?r.skip:0,l=e===-1&&s!==void 0?s:a[e-d],u=!p.areSame(l,this.computedValue(),o);this.triggerOnChange(l,t),u&&this.base.triggerPageChangeCornerItems(l,t)},onNavigate(e,t){const{dataItems:a=[],defaultItem:r,dataItemKey:o,virtual:s={skip:0,total:0,pageSize:0}}=this.$props,d=this.base.vs,l=this.computedValue(),u=a.findIndex(c=>p.areSame(c,l,o)),f=this.base.navigation.navigate({current:s.skip+u,max:(d.enabled?s.total:a.length)-1,min:r!==void 0?-1:0,keyCode:t});f!==void 0&&this.handleItemSelect(f,e),this.applyState(e)},search(e){clearTimeout(this.typingTimeout),this.$props.filterable||(this.typingTimeout=setTimeout(()=>this.searchState.word="",this.$props.delay),this.selectNext(e))},selectNext(e){const{dataItems:t=[],dataItemKey:a}=this.$props;let r=t.map((b,x)=>({item:b,itemIndex:x}));const o=this.searchState.word,s=this.searchState.last,d=p.sameCharsOnly(o,s);let l=r.length,u=Math.max(0,t.findIndex(b=>p.areSame(b,this.computedValue(),a))),f;this.$props.defaultItem&&(f={item:this.$props.defaultItem,itemIndex:-1},l+=1,u+=1),u+=d?1:0,r=p.shuffleData(r,u,f);let c,I,v,m=0;const{textField:h,ignoreCase:S}=this.$props;for(;m<l;){if(c=p.getItemValue(r[m].item,h),I=d&&p.matchText(c,s,S),v=p.matchText(c,o,S),I||v){m=r[m].itemIndex;break}m++}if(m!==l){const b=this.base.initState();b.event=e,this.handleItemSelect(m,b),this.applyState(b),this.valueDuringOnChange=void 0}},handleKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const{dataItems:t=[],leftRightKeysNavigation:a,filterable:r,disabled:o,virtual:s={skip:0,total:0,pageSize:0}}=this.$props,d=this.isOpen,l=e.keyCode,u=l===i.Keys.home||l===i.Keys.end,f=l===i.Keys.up||l===i.Keys.down,c=!d&&(e.altKey&&l===i.Keys.down||l===i.Keys.enter||l===i.Keys.space),I=d&&(e.altKey&&l===i.Keys.up||l===i.Keys.esc),v=a&&(l===i.Keys.left||l===i.Keys.right),m=f||!r&&(v||u),h=this.base.initState();if(h.event=e,!o){if(u&&this.base.vs.enabled)l===i.Keys.home?s.skip!==0?(this.base.triggerOnPageChange(h,0,s.pageSize),this._navigated=!0):this.triggerOnChange(t[0],h):s.skip<s.total-s.pageSize?(this.base.triggerOnPageChange(h,s.total-s.pageSize,s.pageSize),this._navigated=!0):this.triggerOnChange(t[t.length-1],h);else if(d&&l===i.Keys.enter){const S=this.focusedIndex();S!==void 0&&this.handleItemSelect(S,h),this.base.togglePopup(h),e.preventDefault()}else c||I?(this.adaptiveState&&this.handleWrapperClick(e),this.base.togglePopup(h),e.preventDefault()):m&&(this.onNavigate(h,l),e.preventDefault());this.applyState(h)}},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},handleFocus(e){this._skipFocusEvent||this.base.handleFocus(e)},handleBlur(e){if(this._skipFocusEvent||!this.currentFocused)return;const t=this.isOpen,a=this.base.initState();a.event=e,a.data.currentFocused=!1,a.events.push({type:"blur"}),t&&!this.adaptiveState&&this.base.togglePopup(a),this.applyState(a)},handleDefaultItemClick(e){const t=this.base.initState();t.event=e,this.base.togglePopup(t),this.triggerOnChange(this.$props.defaultItem,t),this.applyState(t)},handleWrapperClick(e){const t=this.base.initState();t.event=e,this.currentFocused||(t.data.currentFocused=!0),this.base.togglePopup(t),this.applyState(t)},handleKeyPress(e){if(this.$props.filterable||e.keyCode===i.Keys.enter)return;let t=String.fromCharCode(e.charCode||e.keyCode);this.$props.ignoreCase&&(t=t.toLowerCase()),t===" "&&e.preventDefault(),this.searchState={word:this.searchState.word+t,last:this.searchState.last+t},this.search(e)},handleListFilterChange(e){const t=this.base.initState();t.event=e,this.$props.filter===void 0&&(t.data.currentText=e.target.value),this.base.filterChanged(e.target.value,t),t.data.group=void 0,this.applyState(t)},onPopupOpened(){this.filterInput&&this.focusElement(this.filterInput.input)},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.base.wrapper&&this.focusElement(this.base.wrapper)})},focusedIndex(){const e=p.isPresent(this.$props.filter)?this.$props.filter:this.currentText,{dataItems:t=[],virtual:a={skip:0},dataItemKey:r,textField:o,focusedItemIndex:s}=this.$props,d=this.computedValue(),u=!(t.findIndex(f=>p.areSame(f,d,r))<0&&!this.$props.defaultItem);return!u&&e&&a.skip===0?s?s(t,e,o):t.indexOf(p.getFocusedItem(t,e,o)):!u&&a.skip===0?0:void 0},focusElement(e){this._skipFocusEvent=!0,e.focus(),setTimeout(()=>this._skipFocusEvent=!1,30)},setValidity(){this.select&&this.select.setCustomValidity&&this.select.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Se)},triggerOnChange(e,t){p.areSame(this.computedValue(),e,this.$props.dataItemKey)||(this.$props.value===void 0&&(this.currentValue=e),this.valueDuringOnChange=e,t.events.push({type:"change"}))},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const{vs:t,list:a}=this.base;t.scrollHandler(e);const r=this.base.initState(),{groupField:o}=this.$props;let{dataItems:s=[]}=this.$props,d;if(!o||!s.length)return;const l=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),f=e.target.scrollTop-t.skip*l;o&&(s=this.base.getGroupedDataModernMode(s,o),d=s[0][o]);for(let c=1;c<s.length&&!(l*c>f);c++)s[c]&&s[c][o]&&(d=s[c][o]);d!==this.group&&(r.data.group=d,this.applyState(r))}},render(){const{style:e,className:t,label:a,dir:r,virtual:o={skip:0},size:s,rounded:d,fillMode:l,dataItemKey:u,dataItems:f=[],disabled:c,tabIndex:I,loading:v,icon:m,svgIcon:h,iconClassName:S,adaptiveTitle:b,header:x,footer:M,groupStickyHeaderItemRender:q}=this.$props,C=this.isOpen,z=p.getItemValue(this.computedValue(),this.$props.textField),A=!this.$props.validityStyles||this.validity().valid,k=this.base,V=k.vs,w=this.$props.id||this.inputId;V.enabled=this.$props.virtual!==void 0;const O=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),W=ve.provideLocalizationService(this).toLanguageString(F.selectButton,F.messages[F.selectButton]),N=this.adaptiveState;this.group===void 0&&this.$props.groupField!==void 0&&(this.group=p.getItemValue(this.$props.dataItems[0],this.$props.groupField));const G=i.templateRendering.call(this,this.$props.valueRender,i.getListeners.call(this)),U=this.currentFocused,T=this.primitiveValue(),Y=f.findIndex(g=>p.areSame(g,T,u)),J=n.createVNode("span",{class:"k-input-inner",id:this.dropDownListId},[n.createVNode("span",{class:"k-input-value-text"},[z])]);let Q=i.getTemplate.call(this,{h:n.h,template:G,defaultRendering:J,additionalProps:{value:this.computedValue(),...this.$data}});const X=function(g){return n.createVNode("select",{name:this.$props.name,id:w,ref:i.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:this.$props.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[n.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,g):g},null)])},Z=()=>[n.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[n.createVNode("div",{class:"k-actionsheet-title"},[n.createVNode("div",{class:"k-text-center"},[b]),n.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),n.createVNode("div",{class:"k-actionsheet-actions"},[n.createVNode(E.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.handleWrapperClick,icon:"x",svgIcon:j.xIcon},null)])]),n.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[K.call(this)])],ee=i.templateRendering.call(this,Z,i.getListeners.call(this)),te=()=>{const g=k.getTemplateDef.call(this,x,n.h),y=k.getTemplateDef.call(this,M,n.h),$=i.templateRendering.call(this,q,i.getListeners.call(this));return n.createVNode("div",{class:"k-list-container"},[g&&n.createVNode("div",{class:"k-list-header"},[g]),n.createVNode("div",{class:i.classNames("k-list",{[`k-list-${L[s]||s}`]:N?!1:s,"k-list-lg":!!N,"k-virtual-list":V.enabled})},[B.call(this),this.group&&f.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:$},null),R.call(this),y&&n.createVNode("div",{class:"k-list-footer"},[y])])])},ie=i.templateRendering.call(this,te,i.getListeners.call(this)),se=function(){return n.createVNode(be.ActionSheet,{expand:C,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",header:ee,content:ie,onClose:this.handleWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},B=function(){const{textField:g,defaultItem:y}=this.$props;return y!==void 0&&n.createVNode(fe.ListDefaultItem,{defaultItem:y,textField:g,selected:p.areSame(this.computedValue(),y,u),key:"defaultitemkey",onDefaultitemclick:this.handleDefaultItemClick},null)},R=function(){let g;const{textField:y,groupField:$}=this.$props;let D=this.$props.dataItems||[];const re=i.templateRendering.call(this,this.$props.itemRender,i.getListeners.call(this)),oe=i.templateRendering.call(this,this.$props.groupHeaderItemRender,i.getListeners.call(this)),de=i.templateRendering.call(this,this.$props.listNoDataRender,i.getListeners.call(this)),ue=o.skip,pe=`translateY(${V.translate}px)`;return $&&(D=this.base.getGroupedDataModernMode(D,$)),n.createVNode(ge.List,{id:this.base.listBoxId,show:C,dataItems:D.slice(),focusedIndex:this.focusedIndex(),value:this.computedValue(),textField:y,valueField:u,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:O.height},wrapperCssClass:"k-list-content",listStyle:V.enabled?{transform:pe}:void 0,key:"listkey",skip:ue,onListclick:this.handleItemClick,itemRender:re,groupHeaderItemRender:oe,noDataRender:de,groupField:$,onScroll:this.onScroll},Ie(g=ae.call(this))?g:{default:()=>[g]})},K=function(){const g=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&n.createVNode(he.ListFilter,{value:g,ref:"filterInput",onChange:this.handleListFilterChange,onKeydown:this.handleKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode,ariaControlsId:this.base.listBoxId,ariaActivedescendantId:`option-${this.base.guid}-${this.focusedIndex()}`},null)},ae=function(){return V.enabled&&n.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},ne=function(){const g=i.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,i.getListeners.call(this)),y=k.getTemplateDef.call(this,x),$=k.getTemplateDef.call(this,M);return n.createVNode(ce.ListContainer,{ref:"container",onMousedown:p.preventDefaultNonInputs,dir:r!==void 0?r:k.dirCalculated,width:this.popupWidth,popupSettings:{...O,popupClass:i.classNames(O.popupClass,"k-list",{[`k-list-${L[s]||s}`]:s,"k-virtual-list":this.base.vs.enabled}),className:i.classNames("k-list-container",O.className),anchor:this.anchor,show:C},onOpen:this.onPopupOpened,onClose:this.onPopupClosed,onBlur:this.handleBlur},{default:()=>[K.call(this),B.call(this),this.group&&f.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:g},null),y&&n.createVNode("div",{class:"k-list-header"},[y]),R.call(this),$&&n.createVNode("div",{class:"k-list-footer"},[$])]})};this.$props.virtual!==void 0&&(k.vs.skip=o.skip,k.vs.total=o.total,k.vs.pageSize=o.pageSize);const le=function(){return n.createVNode("span",{ref:i.setRef(this,"kendoAnchor"),class:i.classNames("k-dropdownlist k-picker",t,{[`k-picker-${L[s]||s}`]:s,[`k-rounded-${ye[d]||d}`]:d,[`k-picker-${l}`]:l,"k-focus":U,"k-disabled":c,"k-invalid":!A,"k-loading":v,"k-required":this.required}),style:a?{...e,width:void 0}:e,dir:r,onMousedown:C?p.preventDefaultNonInputs:i.noop,onFocusin:this.handleFocus,onFocusout:this.handleBlur,tabindex:i.getTabIndex(I,c),accesskey:this.$props.accessKey,onKeydown:this.handleKeyDown,onKeypress:this.handleKeyPress,role:"combobox",onClick:c?i.noop:this.handleWrapperClick,"aria-disabled":c||void 0,"aria-haspopup":!0,"aria-expanded":C||!1,"aria-owns":this.base.listBoxId,"aria-activedescendant":C?"option-"+this.base.guid+"-"+(Y+(o?o.skip:0)):void 0,"aria-label":this.$props.ariaLabel||this.$props.label,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedBy":this.dropDownListId,title:this.$props.title},[Q,v&&n.createVNode(i.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),n.createVNode(E.Button,{type:"button",tabIndex:-1,size:s,fillMode:l,rounded:null,ariaLabel:W,class:"k-input-button",icon:m||"caret-alt-down",svgIcon:h||j.caretAltDownIcon,iconClass:S},null),X.call(this,T),!N&&ne.call(this)])},H=[n.h(le.call(this),{...this.$attrs}),N&&se.call(this)];return a?n.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,onFocusout:this.handleBlur,dir:this.$props.dir},[H,this.$props.label?w?n.createVNode("label",{for:w,class:"k-floating-label"},[this.$props.label]):n.createVNode("span",{class:"k-label"},[this.$props.label]):null]):H}});exports.DropDownList=ke;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),i=require("@progress/kendo-vue-common"),E=require("@progress/kendo-vue-buttons"),ce=require("../common/ListContainer.js"),he=require("../common/ListFilter.js"),fe=require("../common/ListDefaultItem.js"),ge=require("../common/List.js"),me=require("../common/DropDownBase.js"),P=require("../common/GroupStickyHeader.js"),F=require("../messages/main.js"),ve=require("@progress/kendo-vue-intl"),_=require("../common/constants.js"),be=require("@progress/kendo-vue-layout"),p=require("../common/utils.js"),j=require("@progress/kendo-svg-icons"),{sizeMap:L,roundedMap:ye}=i.kendoThemeMaps;function Ie(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!n.isVNode(e)}const Se="Please select a value from the list!",ke=n.defineComponent({name:"KendoDropDownList",model:{event:"changemodel"},props:{id:String,title:String,dataItemKey:{type:[Object,String]},defaultValue:{type:[String,Object,Number,Boolean],default:void 0},name:String,modelValue:{type:[String,Object,Number,Boolean],default:void 0},value:{type:[String,Object,Number,Boolean],default:void 0},label:{type:String},required:{type:Boolean,default:!1},leftRightKeysNavigation:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},validate:{type:Boolean},validationMessage:{type:String,default:void 0},validityStyles:{type:Boolean,default:!0},delay:{type:Number,default:500},ignoreCase:{type:Boolean,default:!0},icon:String,svgIcon:Object,iconClassName:String,defaultItem:[Object,String],valueRender:[String,Function,Object],valueMap:Function,opened:{type:Boolean,default:void 0},disabled:Boolean,dir:{type:String,default:void 0},tabIndex:{type:Number,default:0},accessKey:String,dataItems:Array,textField:String,valueField:String,valuePrimitive:Boolean,className:String,loading:Boolean,popupSettings:{type:Object,default:{animate:!0,height:"200px",anchor:""}},itemRender:[String,Function,Object],groupHeaderItemRender:[String,Function,Object],groupStickyHeaderItemRender:[String,Function,Object],listNoDataRender:[String,Function,Object],focusedItemIndex:Function,header:[String,Function,Object],footer:[String,Function,Object],filterable:Boolean,filter:{type:String,default:void 0},virtual:{type:Object,default:void 0},ariaLabelledBy:String,ariaLabel:String,ariaDescribedBy:String,rounded:{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["small","medium","large"].includes(e)}},groupField:{type:String},adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0},onChange:Function},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:_.MOBILE_SMALL_DEVICE,medium:_.MOBILE_MEDIUM_DEVICE}}},data(){return{hasMounted:!1,currentText:"",currentValue:"",currentFocused:!1,currentOpened:!1,searchState:{word:"",last:""},_skipFocusEvent:!1,valueDuringOnChange:{},_navigated:!1,group:void 0,isScrolling:!1,itemHeight:0,state:void 0,popupWidth:void 0,windowWidth: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),this.virtualHasChanged=!0},isOpen:function(){setTimeout(()=>{const e=document.querySelector(".k-list-item");this.itemHeight=this.base.getListItemHeight(e)},100)}},created(){this.observer=null,this.valueDuringOnChange=void 0,this.currentText=void 0,this.currentValue=void 0,this.prevCurrentValue=this.computedValue(),this.currentFocused=void 0,this.currentOpened=void 0,this.base=new me(this),this.anchor=i.guid(),this.inputId=i.guid()},setup(){const e=n.ref(null),t=n.ref(null),a=n.ref(null);return{selectRef:e,baseWrapperRef:t,kendoAnchorRef:a}},mounted(){this.observer=i.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.hasMounted=!0,this.select=i.getRef(this,"select"),this.base.wrapper=i.getRef(this,"kendoAnchor"),this.base.didMount(),this.setValidity()},updated(){var I;const{dataItems:e=[],dataItemKey:t,virtual:a,groupField:r,textField:o}=this.$props,s=this.isOpen,d=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,l=!d&&s,u=this.$refs.list,f=this.$refs.filterInput,c=this.$refs.scrollElement;if(this.$refs.scroller,u&&(this.base.vs.list=u.list,this.base.list=u.list),c&&(this.base.vs.scrollElement=c),f&&(this.filterInput=f),u&&e.length&&this.base.vs.scrollerRef(u.$el),this.$props.popupSettings.animate||l&&this.onPopupOpened(),a&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const v=this.computedValue(),m=this.prevCurrentValue;let h=e.findIndex(b=>p.areSame(b,v,t));r&&(h=(I=this.base.getGroupedDataModernMode(e,r))==null?void 0:I.indexOf(v));const S=!p.areSame(m,v,t);l&&a?(this.base.scrollToVirtualItem(a,h),this.prevCurrentOpened=!0):l&&!a?(e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][r],this),this.base.scrollToItem(h),this.prevCurrentOpened=!0):s&&d&&v&&S&&!this._navigated?this.base.scrollToItem(h):s&&d&&this._navigated&&(this._navigated&&a&&a.skip===0?this.base.vs.reset():this._navigated&&a&&a.skip===a.total-a.pageSize&&this.base.vs.scrollToEnd())}this._navigated=!1,this.prevCurrentValue=this.computedValue(),this.setValidity()},computed:{index(){const{dataItems:e=[],dataItemKey:t}=this.$props,a=this.computedValue();return e.findIndex(r=>p.areSame(r,a,t))},spanClassNames(){const e=!this.hasMounted||!this.$props.validityStyles||this.validity().valid;return{"k-floating-label-container":!0,"k-focus":this.currentFocused,"k-empty":!this.computedValue(),"k-invalid":!e&&e!==void 0,"k-rtl":this.$props.dir==="rtl"}},dropDownListId(){return`value-${this.base.guid}${this.$props.ariaDescribedBy?" "+this.$props.ariaDescribedBy:""}`},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}},methods:{focus(){this.base.wrapper&&this.base.wrapper.focus()},computedValue(){let e;return this.valueDuringOnChange!==void 0?e=this.valueDuringOnChange:this.$props.value!==void 0?e=this.$props.value:this.$props.modelValue!==void 0?e=this.$props.modelValue:this.currentValue!==void 0?e=this.currentValue:this.$props.defaultValue!==void 0&&(e=this.$props.defaultValue),!p.isPresent(e)&&this.$props.defaultItem!==void 0&&(e=this.$props.defaultItem),this.valuePrimitive&&this.findByFieldValue(this.valueField,e)||e},findByFieldValue(e,t){const a=this.dataItems.findIndex(r=>p.getItemValue(r,e)===t);return this.dataItems[a]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive?p.getItemValue(e,this.valueField):e},validity(){const e=this.$props.validationMessage!==void 0,t=!this.$props.required||this.computedValue()!==null&&this.computedValue()!==""&&this.computedValue()!==void 0,a=this.$props.valid!==void 0?this.$props.valid:t;return{customError:e,valid:a,valueMissing:this.computedValue()===null}},handleItemSelect(e,t){const{dataItems:a=[],virtual:r,dataItemKey:o,defaultItem:s}=this.$props,d=r?r.skip:0,l=e===-1&&s!==void 0?s:a[e-d],u=!p.areSame(l,this.computedValue(),o);this.triggerOnChange(l,t),u&&this.base.triggerPageChangeCornerItems(l,t)},onNavigate(e,t){const{dataItems:a=[],defaultItem:r,dataItemKey:o,virtual:s={skip:0,total:0,pageSize:0}}=this.$props,d=this.base.vs,l=this.computedValue(),u=a.findIndex(c=>p.areSame(c,l,o)),f=this.base.navigation.navigate({current:s.skip+u,max:(d.enabled?s.total:a.length)-1,min:r!==void 0?-1:0,keyCode:t});f!==void 0&&this.handleItemSelect(f,e),this.applyState(e)},search(e){clearTimeout(this.typingTimeout),this.$props.filterable||(this.typingTimeout=setTimeout(()=>this.searchState.word="",this.$props.delay),this.selectNext(e))},selectNext(e){const{dataItems:t=[],dataItemKey:a}=this.$props;let r=t.map((b,x)=>({item:b,itemIndex:x}));const o=this.searchState.word,s=this.searchState.last,d=p.sameCharsOnly(o,s);let l=r.length,u=Math.max(0,t.findIndex(b=>p.areSame(b,this.computedValue(),a))),f;this.$props.defaultItem&&(f={item:this.$props.defaultItem,itemIndex:-1},l+=1,u+=1),u+=d?1:0,r=p.shuffleData(r,u,f);let c,I,v,m=0;const{textField:h,ignoreCase:S}=this.$props;for(;m<l;){if(c=p.getItemValue(r[m].item,h),I=d&&p.matchText(c,s,S),v=p.matchText(c,o,S),I||v){m=r[m].itemIndex;break}m++}if(m!==l){const b=this.base.initState();b.event=e,this.handleItemSelect(m,b),this.applyState(b),this.valueDuringOnChange=void 0}},handleKeyDown(e){this.isScrolling&&(this.isScrolling=!1);const{dataItems:t=[],leftRightKeysNavigation:a,filterable:r,disabled:o,virtual:s={skip:0,total:0,pageSize:0}}=this.$props,d=this.isOpen,l=e.keyCode,u=l===i.Keys.home||l===i.Keys.end,f=l===i.Keys.up||l===i.Keys.down,c=!d&&(e.altKey&&l===i.Keys.down||l===i.Keys.enter||l===i.Keys.space),I=d&&(e.altKey&&l===i.Keys.up||l===i.Keys.esc),v=a&&(l===i.Keys.left||l===i.Keys.right),m=f||!r&&(v||u),h=this.base.initState();if(h.event=e,!o){if(u&&this.base.vs.enabled)l===i.Keys.home?s.skip!==0?(this.base.triggerOnPageChange(h,0,s.pageSize),this._navigated=!0):this.triggerOnChange(t[0],h):s.skip<s.total-s.pageSize?(this.base.triggerOnPageChange(h,s.total-s.pageSize,s.pageSize),this._navigated=!0):this.triggerOnChange(t[t.length-1],h);else if(d&&l===i.Keys.enter){const S=this.focusedIndex();S!==void 0&&this.handleItemSelect(S,h),this.base.togglePopup(h),e.preventDefault()}else c||I?(this.adaptiveState&&this.handleWrapperClick(e),this.base.togglePopup(h),e.preventDefault()):m&&(this.onNavigate(h,l),e.preventDefault());this.applyState(h)}},handleItemClick(e,t){this.base.handleItemClick(e,t),this.valueDuringOnChange=void 0},handleFocus(e){this._skipFocusEvent||this.base.handleFocus(e)},handleBlur(e){if(this._skipFocusEvent||!this.currentFocused)return;const t=this.isOpen,a=this.base.initState();a.event=e,a.data.currentFocused=!1,a.events.push({type:"blur"}),t&&!this.adaptiveState&&this.base.togglePopup(a),this.applyState(a)},handleDefaultItemClick(e){const t=this.base.initState();t.event=e,this.base.togglePopup(t),this.triggerOnChange(this.$props.defaultItem,t),this.applyState(t)},handleWrapperClick(e){const t=this.base.initState();t.event=e,this.currentFocused||(t.data.currentFocused=!0),this.base.togglePopup(t),this.applyState(t)},handleKeyPress(e){if(this.$props.filterable||e.keyCode===i.Keys.enter)return;let t=String.fromCharCode(e.charCode||e.keyCode);this.$props.ignoreCase&&(t=t.toLowerCase()),t===" "&&e.preventDefault(),this.searchState={word:this.searchState.word+t,last:this.searchState.last+t},this.search(e)},handleListFilterChange(e){const t=this.base.initState();t.event=e,this.$props.filter===void 0&&(t.data.currentText=e.target.value),this.base.filterChanged(e.target.value,t),t.data.group=void 0,this.applyState(t)},onPopupOpened(){this.filterInput&&this.focusElement(this.filterInput.input)},onPopupClosed(){this.currentFocused&&setTimeout(()=>{this.currentFocused&&this.base.wrapper&&this.focusElement(this.base.wrapper)})},focusedIndex(){const e=p.isPresent(this.$props.filter)?this.$props.filter:this.currentText,{dataItems:t=[],virtual:a={skip:0},dataItemKey:r,textField:o,focusedItemIndex:s}=this.$props,d=this.computedValue(),u=!(t.findIndex(f=>p.areSame(f,d,r))<0&&!this.$props.defaultItem);return!u&&e&&a.skip===0?s?s(t,e,o):t.indexOf(p.getFocusedItem(t,e,o)):!u&&a.skip===0?0:void 0},focusElement(e){this._skipFocusEvent=!0,e.focus(),setTimeout(()=>this._skipFocusEvent=!1,30)},setValidity(){this.select&&this.select.setCustomValidity&&this.select.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||Se)},triggerOnChange(e,t){p.areSame(this.computedValue(),e,this.$props.dataItemKey)||(this.$props.value===void 0&&(this.currentValue=e),this.valueDuringOnChange=e,t.events.push({type:"change"}))},applyState(e){this.base.applyState(e),this.valueDuringOnChange=void 0},calculateMedia(e){for(let t of e)this.windowWidth=t.target.clientWidth},repositionPopup(){this.base.repositionPopup()},onScroll(e){this.isScrolling=!0;const{vs:t,list:a}=this.base;t.scrollHandler(e);const r=this.base.initState(),{groupField:o}=this.$props;let{dataItems:s=[]}=this.$props,d;if(!o||!s.length)return;const l=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),f=e.target.scrollTop-t.skip*l;o&&(s=this.base.getGroupedDataModernMode(s,o),d=s[0][o]);for(let c=1;c<s.length&&!(l*c>f);c++)s[c]&&s[c][o]&&(d=s[c][o]);d!==this.group&&(r.data.group=d,this.applyState(r))}},render(){const{style:e,className:t,label:a,dir:r,virtual:o={skip:0},size:s,rounded:d,fillMode:l,dataItemKey:u,dataItems:f=[],disabled:c,tabIndex:I,loading:v,icon:m,svgIcon:h,iconClassName:S,adaptiveTitle:b,header:x,footer:M,groupStickyHeaderItemRender:q}=this.$props,C=this.isOpen,z=p.getItemValue(this.computedValue(),this.$props.textField),A=!this.$props.validityStyles||this.validity().valid,k=this.base,V=k.vs,w=this.$props.id||this.inputId;V.enabled=this.$props.virtual!==void 0;const O=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),W=ve.provideLocalizationService(this).toLanguageString(F.selectButton,F.messages[F.selectButton]),N=this.adaptiveState;this.group===void 0&&this.$props.groupField!==void 0&&(this.group=p.getItemValue(this.$props.dataItems[0],this.$props.groupField));const G=i.templateRendering.call(this,this.$props.valueRender,i.getListeners.call(this)),U=this.currentFocused,T=this.primitiveValue(),Y=f.findIndex(g=>p.areSame(g,T,u)),J=n.createVNode("span",{class:"k-input-inner",id:this.dropDownListId},[n.createVNode("span",{class:"k-input-value-text"},[z])]);let Q=i.getTemplate.call(this,{h:n.h,template:G,defaultRendering:J,additionalProps:{value:this.computedValue(),...this.$data}});const X=function(g){return n.createVNode("select",{name:this.$props.name,id:w,ref:i.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:this.$props.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[n.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,g):g},null)])},Z=()=>[n.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[n.createVNode("div",{class:"k-actionsheet-title"},[n.createVNode("div",{class:"k-text-center"},[b]),n.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},null)]),n.createVNode("div",{class:"k-actionsheet-actions"},[n.createVNode(E.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.handleWrapperClick,icon:"x",svgIcon:j.xIcon},null)])]),n.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[K.call(this)])],ee=i.templateRendering.call(this,Z,i.getListeners.call(this)),te=()=>{const g=k.getTemplateDef.call(this,x,n.h),y=k.getTemplateDef.call(this,M,n.h),$=i.templateRendering.call(this,q,i.getListeners.call(this));return n.createVNode("div",{class:"k-list-container"},[g&&n.createVNode("div",{class:"k-list-header"},[g]),n.createVNode("div",{class:i.classNames("k-list",{[`k-list-${L[s]||s}`]:N?!1:s,"k-list-lg":!!N,"k-virtual-list":V.enabled})},[B.call(this),this.group&&f.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:$},null),R.call(this),y&&n.createVNode("div",{class:"k-list-footer"},[y])])])},ie=i.templateRendering.call(this,te,i.getListeners.call(this)),se=function(){return n.createVNode(be.ActionSheet,{expand:C,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,contentClassName:"!k-overflow-hidden",header:ee,content:ie,onClose:this.handleWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},B=function(){const{textField:g,defaultItem:y}=this.$props;return y!==void 0&&n.createVNode(fe.ListDefaultItem,{defaultItem:y,textField:g,selected:p.areSame(this.computedValue(),y,u),key:"defaultitemkey",onDefaultitemclick:this.handleDefaultItemClick},null)},R=function(){let g;const{textField:y,groupField:$}=this.$props;let D=this.$props.dataItems||[];const re=i.templateRendering.call(this,this.$props.itemRender,i.getListeners.call(this)),oe=i.templateRendering.call(this,this.$props.groupHeaderItemRender,i.getListeners.call(this)),de=i.templateRendering.call(this,this.$props.listNoDataRender,i.getListeners.call(this)),ue=o.skip,pe=`translateY(${V.translate}px)`;return $&&(D=this.base.getGroupedDataModernMode(D,$)),n.createVNode(ge.List,{id:this.base.listBoxId,show:C,dataItems:D.slice(),focusedIndex:this.focusedIndex(),value:this.computedValue(),textField:y,valueField:u,optionsGuid:this.base.guid,ref:"list",wrapperStyle:{maxHeight:O.height},wrapperCssClass:"k-list-content",listStyle:V.enabled?{transform:pe}:void 0,key:"listkey",skip:ue,onListclick:this.handleItemClick,itemRender:re,groupHeaderItemRender:oe,noDataRender:de,groupField:$,onScroll:this.onScroll},Ie(g=ae.call(this))?g:{default:()=>[g]})},K=function(){const g=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&n.createVNode(he.ListFilter,{value:g,ref:"filterInput",onChange:this.handleListFilterChange,onKeydown:this.handleKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode,ariaControlsId:this.base.listBoxId,ariaActivedescendantId:`option-${this.base.guid}-${this.focusedIndex()}`},null)},ae=function(){return V.enabled&&n.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},ne=function(){const g=i.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,i.getListeners.call(this)),y=k.getTemplateDef.call(this,x),$=k.getTemplateDef.call(this,M);return n.createVNode(ce.ListContainer,{ref:"container",onMousedown:p.preventDefaultNonInputs,dir:r!==void 0?r:k.dirCalculated,width:this.popupWidth,popupSettings:{...O,popupClass:i.classNames(O.popupClass,"k-list",{[`k-list-${L[s]||s}`]:s,"k-virtual-list":this.base.vs.enabled}),className:i.classNames("k-list-container",O.className),anchor:this.anchor,show:C},onOpen:this.onPopupOpened,onClose:this.onPopupClosed,onBlur:this.handleBlur},{default:()=>[K.call(this),B.call(this),this.group&&f.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:g},null),y&&n.createVNode("div",{class:"k-list-header"},[y]),R.call(this),$&&n.createVNode("div",{class:"k-list-footer"},[$])]})};this.$props.virtual!==void 0&&(k.vs.skip=o.skip,k.vs.total=o.total,k.vs.pageSize=o.pageSize);const le=function(){return n.createVNode("span",{ref:i.setRef(this,"kendoAnchor"),class:i.classNames("k-dropdownlist k-picker",t,{[`k-picker-${L[s]||s}`]:s,[`k-rounded-${ye[d]||d}`]:d,[`k-picker-${l}`]:l,"k-focus":U,"k-disabled":c,"k-invalid":!A,"k-loading":v,"k-required":this.required}),style:a?{...e,width:void 0}:e,dir:r,onMousedown:C?p.preventDefaultNonInputs:i.noop,onFocusin:this.handleFocus,onFocusout:this.handleBlur,tabindex:i.getTabIndex(I,c),accesskey:this.$props.accessKey,onKeydown:this.handleKeyDown,onKeypress:this.handleKeyPress,role:"combobox",onClick:c?i.noop:this.handleWrapperClick,"aria-disabled":c||void 0,"aria-haspopup":!0,"aria-expanded":C||!1,"aria-owns":this.base.listBoxId,"aria-activedescendant":C?"option-"+this.base.guid+"-"+(Y+(o?o.skip:0)):void 0,"aria-label":this.$props.ariaLabel||this.$props.label,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedBy":this.dropDownListId,title:this.$props.title},[Q,v&&n.createVNode(i.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),n.createVNode(E.Button,{type:"button",tabIndex:-1,size:s,fillMode:l,rounded:null,ariaLabel:W,class:"k-input-button",icon:m||"caret-alt-down",svgIcon:h||j.caretAltDownIcon,iconClass:S},null),X.call(this,T),!N&&ne.call(this)])},H=[n.h(le.call(this),{...this.$attrs}),N&&se.call(this)];return a?n.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,onFocusout:this.handleBlur,dir:this.$props.dir},[H,this.$props.label?w?n.createVNode("label",{for:w,class:"k-floating-label"},[this.$props.label]):n.createVNode("span",{class:"k-label"},[this.$props.label]):null]):H}});exports.DropDownList=ke;
|
|
@@ -140,21 +140,18 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
140
140
|
ariaDescribedBy: String,
|
|
141
141
|
rounded: {
|
|
142
142
|
type: String,
|
|
143
|
-
default: "medium",
|
|
144
143
|
validator: function(e) {
|
|
145
|
-
return ["small", "medium", "large", "full"].includes(e);
|
|
144
|
+
return ["none", "small", "medium", "large", "full"].includes(e);
|
|
146
145
|
}
|
|
147
146
|
},
|
|
148
147
|
fillMode: {
|
|
149
148
|
type: String,
|
|
150
|
-
default: "solid",
|
|
151
149
|
validator: function(e) {
|
|
152
150
|
return ["solid", "flat", "outline"].includes(e);
|
|
153
151
|
}
|
|
154
152
|
},
|
|
155
153
|
size: {
|
|
156
154
|
type: String,
|
|
157
|
-
default: "medium",
|
|
158
155
|
validator: function(e) {
|
|
159
156
|
return ["small", "medium", "large"].includes(e);
|
|
160
157
|
}
|
|
@@ -244,15 +241,15 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
244
241
|
virtual: s,
|
|
245
242
|
groupField: l,
|
|
246
243
|
textField: o
|
|
247
|
-
} = this.$props, i = this.isOpen, r = this.prevOpened !== void 0 ? this.prevOpened : this.prevCurrentOpened, a = !r && i, d = this.$refs.list, h = this.$refs.filterInput,
|
|
248
|
-
if (this.$refs.scroller, d && (this.base.vs.list = d.list, this.base.list = d.list),
|
|
244
|
+
} = this.$props, i = this.isOpen, r = this.prevOpened !== void 0 ? this.prevOpened : this.prevCurrentOpened, a = !r && i, d = this.$refs.list, h = this.$refs.filterInput, p = this.$refs.scrollElement;
|
|
245
|
+
if (this.$refs.scroller, d && (this.base.vs.list = d.list, this.base.list = d.list), p && (this.base.vs.scrollElement = p), h && (this.filterInput = h), d && e.length && this.base.vs.scrollerRef(d.$el), this.$props.popupSettings.animate || a && this.onPopupOpened(), s && this.virtualTotalHasChanged)
|
|
249
246
|
this.base.vs.calcScrollElementHeight(), this.base.vs.reset(), this.virtualTotalHasChanged = !1;
|
|
250
247
|
else {
|
|
251
248
|
const g = this.computedValue(), m = this.prevCurrentValue;
|
|
252
|
-
let
|
|
253
|
-
l && (
|
|
249
|
+
let u = e.findIndex((v) => y(v, g, t));
|
|
250
|
+
l && (u = (I = this.base.getGroupedDataModernMode(e, l)) == null ? void 0 : I.indexOf(g));
|
|
254
251
|
const k = !y(m, g, t);
|
|
255
|
-
a && s ? (this.base.scrollToVirtualItem(s,
|
|
252
|
+
a && s ? (this.base.scrollToVirtualItem(s, u), this.prevCurrentOpened = !0) : a && !s ? (e && e.length !== 0 && this.base.resetGroupStickyHeader(e[0][l], this), this.base.scrollToItem(u), this.prevCurrentOpened = !0) : i && r && g && k && !this._navigated ? this.base.scrollToItem(u) : i && r && this._navigated && (this._navigated && s && s.skip === 0 ? this.base.vs.reset() : this._navigated && s && s.skip === s.total - s.pageSize && this.base.vs.scrollToEnd());
|
|
256
253
|
}
|
|
257
254
|
this._navigated = !1, this.prevCurrentValue = this.computedValue(), this.setValidity();
|
|
258
255
|
},
|
|
@@ -337,7 +334,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
337
334
|
total: 0,
|
|
338
335
|
pageSize: 0
|
|
339
336
|
}
|
|
340
|
-
} = this.$props, r = this.base.vs, a = this.computedValue(), d = s.findIndex((
|
|
337
|
+
} = this.$props, r = this.base.vs, a = this.computedValue(), d = s.findIndex((p) => y(p, a, o)), h = this.base.navigation.navigate({
|
|
341
338
|
current: i.skip + d,
|
|
342
339
|
max: (r.enabled ? i.total : s.length) - 1,
|
|
343
340
|
min: l !== void 0 ? -1 : 0,
|
|
@@ -363,13 +360,13 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
363
360
|
item: this.$props.defaultItem,
|
|
364
361
|
itemIndex: -1
|
|
365
362
|
}, a += 1, d += 1), d += r ? 1 : 0, l = _e(l, d, h);
|
|
366
|
-
let
|
|
363
|
+
let p, I, g, m = 0;
|
|
367
364
|
const {
|
|
368
|
-
textField:
|
|
365
|
+
textField: u,
|
|
369
366
|
ignoreCase: k
|
|
370
367
|
} = this.$props;
|
|
371
368
|
for (; m < a; ) {
|
|
372
|
-
if (
|
|
369
|
+
if (p = F(l[m].item, u), I = r && X(p, i, k), g = X(p, o, k), I || g) {
|
|
373
370
|
m = l[m].itemIndex;
|
|
374
371
|
break;
|
|
375
372
|
}
|
|
@@ -392,15 +389,15 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
392
389
|
total: 0,
|
|
393
390
|
pageSize: 0
|
|
394
391
|
}
|
|
395
|
-
} = this.$props, r = this.isOpen, a = e.keyCode, d = a === f.home || a === f.end, h = a === f.up || a === f.down,
|
|
396
|
-
if (
|
|
392
|
+
} = this.$props, r = this.isOpen, a = e.keyCode, d = a === f.home || a === f.end, h = a === f.up || a === f.down, p = !r && (e.altKey && a === f.down || a === f.enter || a === f.space), I = r && (e.altKey && a === f.up || a === f.esc), g = s && (a === f.left || a === f.right), m = h || !l && (g || d), u = this.base.initState();
|
|
393
|
+
if (u.event = e, !o) {
|
|
397
394
|
if (d && this.base.vs.enabled)
|
|
398
|
-
a === f.home ? i.skip !== 0 ? (this.base.triggerOnPageChange(
|
|
395
|
+
a === f.home ? i.skip !== 0 ? (this.base.triggerOnPageChange(u, 0, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[0], u) : i.skip < i.total - i.pageSize ? (this.base.triggerOnPageChange(u, i.total - i.pageSize, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[t.length - 1], u);
|
|
399
396
|
else if (r && a === f.enter) {
|
|
400
397
|
const k = this.focusedIndex();
|
|
401
|
-
k !== void 0 && this.handleItemSelect(k,
|
|
402
|
-
} else
|
|
403
|
-
this.applyState(
|
|
398
|
+
k !== void 0 && this.handleItemSelect(k, u), this.base.togglePopup(u), e.preventDefault();
|
|
399
|
+
} else p || I ? (this.adaptiveState && this.handleWrapperClick(e), this.base.togglePopup(u), e.preventDefault()) : m && (this.onNavigate(u, a), e.preventDefault());
|
|
400
|
+
this.applyState(u);
|
|
404
401
|
}
|
|
405
402
|
},
|
|
406
403
|
handleItemClick(e, t) {
|
|
@@ -496,8 +493,8 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
496
493
|
return;
|
|
497
494
|
const a = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : s ? s.children[0].offsetHeight : 0), h = e.target.scrollTop - t.skip * a;
|
|
498
495
|
o && (i = this.base.getGroupedDataModernMode(i, o), r = i[0][o]);
|
|
499
|
-
for (let
|
|
500
|
-
i[
|
|
496
|
+
for (let p = 1; p < i.length && !(a * p > h); p++)
|
|
497
|
+
i[p] && i[p][o] && (r = i[p][o]);
|
|
501
498
|
r !== this.group && (l.data.group = r, this.applyState(l));
|
|
502
499
|
}
|
|
503
500
|
},
|
|
@@ -515,11 +512,11 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
515
512
|
fillMode: a,
|
|
516
513
|
dataItemKey: d,
|
|
517
514
|
dataItems: h = [],
|
|
518
|
-
disabled:
|
|
515
|
+
disabled: p,
|
|
519
516
|
tabIndex: I,
|
|
520
517
|
loading: g,
|
|
521
518
|
icon: m,
|
|
522
|
-
svgIcon:
|
|
519
|
+
svgIcon: u,
|
|
523
520
|
iconClassName: k,
|
|
524
521
|
adaptiveTitle: v,
|
|
525
522
|
header: D,
|
|
@@ -566,7 +563,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
566
563
|
}, [n("option", {
|
|
567
564
|
value: this.$props.valueMap ? this.$props.valueMap.call(void 0, c) : c
|
|
568
565
|
}, null)]);
|
|
569
|
-
},
|
|
566
|
+
}, pe = () => [n("div", {
|
|
570
567
|
class: "k-actionsheet-titlebar-group k-hbox"
|
|
571
568
|
}, [n("div", {
|
|
572
569
|
class: "k-actionsheet-title"
|
|
@@ -587,7 +584,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
587
584
|
svgIcon: je
|
|
588
585
|
}, null)])]), n("div", {
|
|
589
586
|
class: "k-actionsheet-titlebar-group k-actionsheet-filter"
|
|
590
|
-
}, [j.call(this)])],
|
|
587
|
+
}, [j.call(this)])], ue = C.call(this, pe, x.call(this)), he = () => {
|
|
591
588
|
const c = S.getTemplateDef.call(this, D, T), b = S.getTemplateDef.call(this, K, T), $ = C.call(this, ee, x.call(this));
|
|
592
589
|
return n("div", {
|
|
593
590
|
class: "k-list-container"
|
|
@@ -612,7 +609,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
612
609
|
animationStyles: this.animationStyles,
|
|
613
610
|
className: this.classNameAdaptive,
|
|
614
611
|
contentClassName: "!k-overflow-hidden",
|
|
615
|
-
header:
|
|
612
|
+
header: ue,
|
|
616
613
|
content: ce,
|
|
617
614
|
onClose: this.handleWrapperClick,
|
|
618
615
|
navigatableElements: ["input.k-input-inner", ".k-actionsheet-actions > button"]
|
|
@@ -723,7 +720,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
723
720
|
[`k-rounded-${Ae[r] || r}`]: r,
|
|
724
721
|
[`k-picker-${a}`]: a,
|
|
725
722
|
"k-focus": ne,
|
|
726
|
-
"k-disabled":
|
|
723
|
+
"k-disabled": p,
|
|
727
724
|
"k-invalid": !ie,
|
|
728
725
|
"k-loading": g,
|
|
729
726
|
"k-required": this.required
|
|
@@ -736,13 +733,13 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
736
733
|
onMousedown: O ? Z : G,
|
|
737
734
|
onFocusin: this.handleFocus,
|
|
738
735
|
onFocusout: this.handleBlur,
|
|
739
|
-
tabindex: we(I,
|
|
736
|
+
tabindex: we(I, p),
|
|
740
737
|
accesskey: this.$props.accessKey,
|
|
741
738
|
onKeydown: this.handleKeyDown,
|
|
742
739
|
onKeypress: this.handleKeyPress,
|
|
743
740
|
role: "combobox",
|
|
744
|
-
onClick:
|
|
745
|
-
"aria-disabled":
|
|
741
|
+
onClick: p ? G : this.handleWrapperClick,
|
|
742
|
+
"aria-disabled": p || void 0,
|
|
746
743
|
"aria-haspopup": !0,
|
|
747
744
|
"aria-expanded": O || !1,
|
|
748
745
|
"aria-owns": this.base.listBoxId,
|
|
@@ -764,7 +761,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ Se({
|
|
|
764
761
|
ariaLabel: se,
|
|
765
762
|
class: "k-input-button",
|
|
766
763
|
icon: m || "caret-alt-down",
|
|
767
|
-
svgIcon:
|
|
764
|
+
svgIcon: u || ze,
|
|
768
765
|
iconClass: k
|
|
769
766
|
}, null), de.call(this, H), !M && ge.call(this)]);
|
|
770
767
|
}.call(this), {
|
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),t=require("@progress/kendo-vue-common"),se=require("@progress/kendo-vue-popup"),ne=require("@progress/kendo-vue-intl"),M=require("@progress/kendo-vue-treeview"),oe=require("../package-metadata.js"),V=require("../common/utils.js"),ae=require("./ListNoData.js"),c=require("../messages/main.js"),le=require("@progress/kendo-vue-labels"),T=require("../common/ListFilter.js"),O=require("@progress/kendo-vue-buttons"),k=require("@progress/kendo-svg-icons"),B=require("../common/constants.js"),re=require("@progress/kendo-vue-layout"),de=require("../common/DropDownBase.js");function K(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!s.isVNode(e)}const{sizeMap:ue,roundedMap:ce}=t.kendoThemeMaps,pe="Please select a value from the list!",E=e=>e.split("_").map(i=>parseInt(i,10)),w=(e,i)=>{const{validationMessage:n,valid:o,required:a}=e;return{customError:n!==void 0,valid:!!(o!==void 0?o:!a||i),valueMissing:!i}},he=s.defineComponent({name:"KendoDropDownTree",model:{event:"changemodel"},emits:{open:e=>!0,close:e=>!0,focus:e=>!0,blur:e=>!0,change:e=>!0,filterchange:e=>!0,expandchange:e=>!0,changemodel:e=>!0,"update:modelValue":e=>!0},props:{opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:Number,accessKey:String,dataItems:{type:Array,default:function(){return[]}},value:{type:[Object,String,Number,Boolean],default:function(){}},modelValue:{type:[Object,String,Number,Boolean],default:function(){}},valueMap:Function,placeholder:String,dataItemKey:{type:String,required:!0},textField:{type:String,required:!0},selectField:{type:String,default:"selected"},expandField:String,subItemsField:{type:String,default:"items"},className:String,label:String,validationMessage:String,validityStyles:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},required:Boolean,name:String,id:String,ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,filterable:Boolean,filter:String,loading:Boolean,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},size:{type:String,default:"medium",validator:function(e){return[null,"small","medium","large"].includes(e)}},rounded:{type:String,default:"medium",validator:function(e){return[null,"small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return[null,"flat","outline","solid"].includes(e)}},item:[String,Function,Object],header:[String,Function,Object],footer:[String,Function,Object],valueRender:[String,Function,Object],listNoData:[String,Function,Object],adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0}},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:B.MOBILE_SMALL_DEVICE,medium:B.MOBILE_MEDIUM_DEVICE}}},created(){this.observer=null,t.validatePackage(oe.packageMetadata),this.base=new de(this),this.componentGuid=t.guid(),this.anchor=t.guid()},data(){return{currentOpened:!1,focused:!1,filterState:"",currentValue:void 0,popupWidth:"200px",windowWidth:0,initialAdaptiveRenderingValues:void 0}},computed:{wrapperClass(){const{validationMessage:e,valid:i,required:n,validityStyles:o}=this.$props,a=w({validationMessage:e,valid:i,required:n},this.hasValue),d=!o||a.valid,{size:r,rounded:l,fillMode:u}=this.$props;return{"k-dropdowntree":!0,"k-picker":!0,[this.$props.className]:this.$props.className,[`k-picker-${ue[r]||r}`]:r,[`k-rounded-${ce[l]||l}`]:l,[`k-picker-${u}`]:u,"k-focus":this.focused,"k-invalid":!d,"k-loading":this.$props.loading,"k-required":n,"k-disabled":this.$props.disabled}},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},isOpen(){return this.opened!==void 0?this.opened:this.currentOpened},computedValue(){return this.value!==void 0?this.value:this.$props.modelValue!==void 0?this.$props.modelValue:this.currentValue},hasValue(){return V.isPresent(this.computedValue)},currentValueText(){return this.hasValue?V.getItemValue(this.computedValue,this.$props.textField):""}},watch:{isOpen:function(e){e&&this.value?this.initialAdaptiveRenderingValues=[this.value]:this.initialAdaptiveRenderingValues=void 0}},mounted(){this.observer=t.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.elementRef=t.getRef(this,"kendoAnchor"),this.inputRef=t.getRef(this,"input"),this.selectRef=t.getRef(this,"select"),this.treeViewRef=t.getRef(this,"treeView"),this.skipFocusRef=!1,this.popupRef=t.getRef(this,"popup"),this.calculatePopupWidth()},updated(){this.inputRef=t.getRef(this,"input"),this.treeViewRef=t.getRef(this,"treeView"),this.popupRef&&this.isOpen&&this.hasValue&&this.popupRef.reposition(),this.setValidity(),this.calculatePopupWidth()},render(){let e;const i=this.$props.id||this.componentGuid,{dataItems:n,dataItemKey:o,popupSettings:a,disabled:d,placeholder:r,label:l,name:u,selectField:S,subItemsField:R,validationMessage:L,valid:q,required:$,validityStyles:P,adaptiveTitle:W}=this.$props,g=t.getTabIndex(this.$props.tabIndex,d),F=ne.provideLocalizationService(this),A=w({validationMessage:L,valid:q,required:$},this.hasValue),x=this.adaptiveState,p=this.$props.dir,I=t.templateRendering.call(this,this.item,t.getListeners.call(this)),z=t.templateRendering.call(this,this.valueRender,t.getListeners.call(this)),j=t.templateRendering.call(this,this.$props.header,t.getListeners.call(this)),_=t.templateRendering.call(this,this.$props.footer,t.getListeners.call(this)),v=t.getTemplate.call(this,{h:s.h,template:j}),y=t.getTemplate.call(this,{h:s.h,template:_}),G=t.templateRendering.call(this,this.$props.listNoData,t.getListeners.call(this)),H=s.createVNode(ae.ListNoData,null,K(e=F.toLanguageString(c.nodata,c.messages[c.nodata]))?e:{default:()=>[e]}),N=t.getTemplate.call(this,{h:s.h,defaultRendering:H,template:G}),U=s.createVNode("span",{class:"k-input-value-text"},[this.currentValueText||r]),J=t.getTemplate.call(this,{h:s.h,defaultRendering:U,template:z,additionalProps:{value:this.computedValue}}),Q=()=>[s.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[s.createVNode("div",{class:"k-actionsheet-title"},[s.createVNode("div",{class:"k-text-center"},[W]),s.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[r])]),s.createVNode("div",{class:"k-actionsheet-actions"},[s.createVNode(O.Button,{tabIndex:1,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onWrapperClick,icon:"x",svgIcon:k.xIcon},null)])]),s.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[this.$props.filterable&&s.createVNode(T.ListFilter,{tabIndex:0,value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,size:h,rounded:D,fillMode:b,onFocus:this.onFocus,onBlur:this.onBlur},null)])],X=t.templateRendering.call(this,Q,t.getListeners.call(this)),Y=()=>{const m=this.base.getTemplateDef.call(this,v,s.h),C=this.base.getTemplateDef.call(this,y,s.h);return[m&&s.createVNode("div",{class:"k-list-header"},[m]),n.length>0?s.createVNode(M.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:o,textField:this.$props.textField,selectField:S,expandField:this.$props.expandField,childrenField:R,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:"large",item:I},null):N,C&&s.createVNode("div",{class:"k-list-footer"},[C])]},Z=t.templateRendering.call(this,Y,t.getListeners.call(this)),ee=function(){return s.createVNode(re.ActionSheet,{expand:this.isOpen,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,header:X,content:Z,contentClassName:"!k-overflow-hidden",onClose:this.onWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},te=!P||A.valid,{size:h,rounded:D,fillMode:b}=this.$props,ie=function(){return s.createVNode("span",{class:this.wrapperClass,tabindex:g,accesskey:this.$props.accessKey,id:i,dir:p,ref:t.setRef(this,"kendoAnchor"),onKeydown:this.onWrapperKeyDown,onClick:this.onWrapperClick,onMousedown:this.onWrapperMouseDown,onFocusin:this.onFocus,onFocusout:this.onBlur,role:"combobox","aria-haspopup":"tree","aria-expanded":this.isOpen,"aria-disabled":d,"aria-label":l||this.$props.ariaLabel,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,"aria-required":$},[s.createVNode("span",{class:"k-input-inner"},[J]),this.$props.loading&&s.createVNode(t.Icon,{class:"k-input-loading-icon",name:"loading"},null),this.hasValue&&!d&&s.createVNode("span",{onClick:this.onClear,class:"k-clear-value",title:F.toLanguageString(c.clear,c.messages[c.clear]),role:"button",tabindex:-1,onMousedown:m=>m.preventDefault()},[s.createVNode(t.Icon,{name:"x",icon:k.xIcon},null)]),s.createVNode(O.Button,{tabIndex:-1,type:"button","aria-label":"select",class:"k-input-button",size:h,fillMode:b,themeColor:"base",rounded:null,icon:"caret-alt-down",svgIcon:k.caretAltDownIcon},null),s.createVNode("select",{name:u,ref:t.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:l,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[s.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,this.computedValue):this.computedValue},null)]),!x&&s.createVNode(se.Popup,{style:{width:this.popupWidth,direction:p},ref:t.setRef(this,"popup"),class:t.classNames(a.className,{"k-rtl":p==="rtl"}),popupClass:t.classNames(a.popupClass,"k-dropdowntree-popup","popup-"+this.componentGuid),animate:a.animate,anchor:this.anchor,show:this.isOpen,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,appendTo:a.appendTo},{default:()=>[this.$props.filterable&&s.createVNode(T.ListFilter,{value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,onBlur:this.onBlur,size:h,rounded:D,fillMode:b},null),v&&s.createVNode("div",{class:"k-list-header"},[v]),n.length>0?s.createVNode(M.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:o,textField:this.$props.textField,selectField:S,expandField:this.$props.expandField,childrenField:R,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:h,item:I},null):N,y&&s.createVNode("div",{class:"k-list-footer"},[y])]})])},f=[s.h(ie.call(this),{...this.$attrs}),x&&ee.call(this)];return l?s.createVNode(le.FloatingLabel,{label:l,editorValue:this.currentValueText,editorPlaceholder:r,editorValid:te,editorDisabled:d,editorId:i,focused:this.focused,dir:p},K(f)?f:{default:()=>[f]}):f},methods:{calculateMedia(e){for(let i of e)this.windowWidth=i.target.clientWidth},calculatePopupWidth(){this.elementRef&&(this.popupWidth=this.popupSettings.width!==void 0?this.popupSettings.width:this.elementRef.offsetWidth+"px")},focus(){this.$el&&this.$el.focus()},setValidity(){if(this.selectRef&&this.selectRef.setCustomValidity){const{validationMessage:e,valid:i,required:n}=this.$props,o=w({validationMessage:e,valid:i,required:n},this.hasValue);this.selectRef.setCustomValidity(o.valid?"":this.validationMessage===void 0?pe:this.validationMessage)}},openPopup(e){if(!this.isOpen){const i={...e};this.$emit("open",i),this.currentOpened=!0}},closePopup(e){if(this.isOpen){const i={...e};this.$emit("close",i),this.currentOpened=!1}},onWrapperClick(e){if(this.onFilterChange({...e,target:{value:""}}),!e.defaultPrevented&&this.$el){this.focused=!0;const i={event:e,target:this};(this.isOpen?this.closePopup:this.openPopup)(i)}},switchFocus(e){this.skipFocusRef=!0,e(),window.setTimeout(()=>this.skipFocusRef=!1,0)},onWrapperKeyDown(e){const{keyCode:i,altKey:n}=e,o=this.treeViewRef&&this.treeViewRef.$el,a=this.inputRef&&this.inputRef.input;if(this.$props.disabled||e.defaultPrevented&&a===e.target)return;const d={event:e,target:this};if(this.isOpen)if(i===t.Keys.esc||n&&i===t.Keys.up)e.preventDefault(),this.closePopup(d);else if(o&&o.querySelector(".k-focus")&&(i===t.Keys.up||i===t.Keys.down||i===t.Keys.left||i===t.Keys.right||i===t.Keys.home||i===t.Keys.end)){if(i===t.Keys.up&&a){const r=Array.from(o.querySelectorAll(".k-treeview-item")),l=[...r].reverse().find(u=>!!(u&&u.querySelector(".k-focus")));if(l&&r.indexOf(l)===0)return this.switchFocus(()=>{this.focusElement(a)})}this.switchFocus(t.noop)}else i===t.Keys.down&&this.switchFocus(()=>{this.focusElement(a||o)});else n&&i===t.Keys.down&&(e.preventDefault(),this.openPopup(d))},onInputKeyDown(e){const{keyCode:i,altKey:n}=e;if(i===t.Keys.esc)this.onWrapperClick(e);else if(n||i!==t.Keys.up&&i!==t.Keys.down)return;e.preventDefault(),this.switchFocus(i===t.Keys.up?()=>{this.focusElement(this.elementRef)}:()=>{this.focusElement(this.treeViewRef&&this.treeViewRef.$el)})},focusElement(e){e&&this.switchFocus(()=>e.focus())},onPopupOpened(){if(!this.focused&&this.isOpen&&!this.currentOpened)this.closePopup({target:this});else if(this.$props.filterable){const e=this.inputRef&&this.inputRef.input;this.focusElement(e)}else this.focusElement(this.treeViewRef&&this.treeViewRef.$el)},onPopupClosed(){this.focused&&this.focusElement(this.elementRef)},onFocus(e){if(!this.focused&&!this.skipFocusRef){this.focused=!0;const i={event:e,target:this};this.$emit("focus",i)}},onBlur(e){if(this.focused&&!this.skipFocusRef){this.focused=!1;const i={event:e,target:this},n={...i};(!e.relatedTarget||!e.relatedTarget.closest(".popup-"+this.componentGuid))&&!this.adaptiveState&&(this.$emit("blur",n),this.closePopup(i))}},onWrapperMouseDown(){this.focused&&this.switchFocus(t.noop)},changeValue(e,i,n){const o={value:i,level:n?E(n):[],...e};this.$emit("changemodel",i),this.$emit("update:modelValue",i),this.$emit("change",o),this.currentValue=i},onChange(e){if(V.areSame(e.item,this.computedValue,this.dataItemKey)||!this.$el)return;const{item:i,itemHierarchicalIndex:n,event:o}=e,a={event:o,target:this};this.changeValue(a,i,n),this.closePopup(a)},onClear(e){const i={event:e,target:this};this.changeValue(i,null),this.closePopup(i),e.preventDefault()},onExpand(e){const{item:i,itemHierarchicalIndex:n,event:o}=e,a={level:E(n),item:i,event:o,target:this};this.$emit("expandchange",a)},onFilterChange(e){const n={filter:{field:this.$props.textField,operator:"contains",value:e.target.value},event:e,target:this};this.$emit("filterchange",n),this.$props.filter===void 0&&(this.filterState=e.target.value)}}});exports.DropDownTree=he;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),t=require("@progress/kendo-vue-common"),se=require("@progress/kendo-vue-popup"),ne=require("@progress/kendo-vue-intl"),M=require("@progress/kendo-vue-treeview"),oe=require("../package-metadata.js"),V=require("../common/utils.js"),ae=require("./ListNoData.js"),c=require("../messages/main.js"),le=require("@progress/kendo-vue-labels"),T=require("../common/ListFilter.js"),O=require("@progress/kendo-vue-buttons"),k=require("@progress/kendo-svg-icons"),B=require("../common/constants.js"),re=require("@progress/kendo-vue-layout"),de=require("../common/DropDownBase.js");function K(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!s.isVNode(e)}const{sizeMap:ue,roundedMap:ce}=t.kendoThemeMaps,pe="Please select a value from the list!",E=e=>e.split("_").map(i=>parseInt(i,10)),w=(e,i)=>{const{validationMessage:n,valid:o,required:a}=e;return{customError:n!==void 0,valid:!!(o!==void 0?o:!a||i),valueMissing:!i}},he=s.defineComponent({name:"KendoDropDownTree",model:{event:"changemodel"},emits:{open:e=>!0,close:e=>!0,focus:e=>!0,blur:e=>!0,change:e=>!0,filterchange:e=>!0,expandchange:e=>!0,changemodel:e=>!0,"update:modelValue":e=>!0},props:{opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:Number,accessKey:String,dataItems:{type:Array,default:function(){return[]}},value:{type:[Object,String,Number,Boolean],default:function(){}},modelValue:{type:[Object,String,Number,Boolean],default:function(){}},valueMap:Function,placeholder:String,dataItemKey:{type:String,required:!0},textField:{type:String,required:!0},selectField:{type:String,default:"selected"},expandField:String,subItemsField:{type:String,default:"items"},className:String,label:String,validationMessage:String,validityStyles:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},required:Boolean,name:String,id:String,ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,filterable:Boolean,filter:String,loading:Boolean,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},size:{type:String,validator:function(e){return["small","medium","large"].includes(e)}},rounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["flat","outline","solid"].includes(e)}},item:[String,Function,Object],header:[String,Function,Object],footer:[String,Function,Object],valueRender:[String,Function,Object],listNoData:[String,Function,Object],adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0}},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:B.MOBILE_SMALL_DEVICE,medium:B.MOBILE_MEDIUM_DEVICE}}},created(){this.observer=null,t.validatePackage(oe.packageMetadata),this.base=new de(this),this.componentGuid=t.guid(),this.anchor=t.guid()},data(){return{currentOpened:!1,focused:!1,filterState:"",currentValue:void 0,popupWidth:"200px",windowWidth:0,initialAdaptiveRenderingValues:void 0}},computed:{wrapperClass(){const{validationMessage:e,valid:i,required:n,validityStyles:o}=this.$props,a=w({validationMessage:e,valid:i,required:n},this.hasValue),d=!o||a.valid,{size:r,rounded:l,fillMode:u}=this.$props;return{"k-dropdowntree":!0,"k-picker":!0,[this.$props.className]:this.$props.className,[`k-picker-${ue[r]||r}`]:r,[`k-rounded-${ce[l]||l}`]:l,[`k-picker-${u}`]:u,"k-focus":this.focused,"k-invalid":!d,"k-loading":this.$props.loading,"k-required":n,"k-disabled":this.$props.disabled}},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},isOpen(){return this.opened!==void 0?this.opened:this.currentOpened},computedValue(){return this.value!==void 0?this.value:this.$props.modelValue!==void 0?this.$props.modelValue:this.currentValue},hasValue(){return V.isPresent(this.computedValue)},currentValueText(){return this.hasValue?V.getItemValue(this.computedValue,this.$props.textField):""}},watch:{isOpen:function(e){e&&this.value?this.initialAdaptiveRenderingValues=[this.value]:this.initialAdaptiveRenderingValues=void 0}},mounted(){this.observer=t.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.elementRef=t.getRef(this,"kendoAnchor"),this.inputRef=t.getRef(this,"input"),this.selectRef=t.getRef(this,"select"),this.treeViewRef=t.getRef(this,"treeView"),this.skipFocusRef=!1,this.popupRef=t.getRef(this,"popup"),this.calculatePopupWidth()},updated(){this.inputRef=t.getRef(this,"input"),this.treeViewRef=t.getRef(this,"treeView"),this.popupRef&&this.isOpen&&this.hasValue&&this.popupRef.reposition(),this.setValidity(),this.calculatePopupWidth()},render(){let e;const i=this.$props.id||this.componentGuid,{dataItems:n,dataItemKey:o,popupSettings:a,disabled:d,placeholder:r,label:l,name:u,selectField:S,subItemsField:R,validationMessage:L,valid:q,required:$,validityStyles:P,adaptiveTitle:W}=this.$props,g=t.getTabIndex(this.$props.tabIndex,d),F=ne.provideLocalizationService(this),A=w({validationMessage:L,valid:q,required:$},this.hasValue),x=this.adaptiveState,p=this.$props.dir,I=t.templateRendering.call(this,this.item,t.getListeners.call(this)),z=t.templateRendering.call(this,this.valueRender,t.getListeners.call(this)),j=t.templateRendering.call(this,this.$props.header,t.getListeners.call(this)),_=t.templateRendering.call(this,this.$props.footer,t.getListeners.call(this)),v=t.getTemplate.call(this,{h:s.h,template:j}),y=t.getTemplate.call(this,{h:s.h,template:_}),G=t.templateRendering.call(this,this.$props.listNoData,t.getListeners.call(this)),H=s.createVNode(ae.ListNoData,null,K(e=F.toLanguageString(c.nodata,c.messages[c.nodata]))?e:{default:()=>[e]}),N=t.getTemplate.call(this,{h:s.h,defaultRendering:H,template:G}),U=s.createVNode("span",{class:"k-input-value-text"},[this.currentValueText||r]),J=t.getTemplate.call(this,{h:s.h,defaultRendering:U,template:z,additionalProps:{value:this.computedValue}}),Q=()=>[s.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[s.createVNode("div",{class:"k-actionsheet-title"},[s.createVNode("div",{class:"k-text-center"},[W]),s.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[r])]),s.createVNode("div",{class:"k-actionsheet-actions"},[s.createVNode(O.Button,{tabIndex:1,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onWrapperClick,icon:"x",svgIcon:k.xIcon},null)])]),s.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[this.$props.filterable&&s.createVNode(T.ListFilter,{tabIndex:0,value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,size:h,rounded:D,fillMode:b,onFocus:this.onFocus,onBlur:this.onBlur},null)])],X=t.templateRendering.call(this,Q,t.getListeners.call(this)),Y=()=>{const m=this.base.getTemplateDef.call(this,v,s.h),C=this.base.getTemplateDef.call(this,y,s.h);return[m&&s.createVNode("div",{class:"k-list-header"},[m]),n.length>0?s.createVNode(M.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:o,textField:this.$props.textField,selectField:S,expandField:this.$props.expandField,childrenField:R,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:"large",item:I},null):N,C&&s.createVNode("div",{class:"k-list-footer"},[C])]},Z=t.templateRendering.call(this,Y,t.getListeners.call(this)),ee=function(){return s.createVNode(re.ActionSheet,{expand:this.isOpen,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,header:X,content:Z,contentClassName:"!k-overflow-hidden",onClose:this.onWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},te=!P||A.valid,{size:h,rounded:D,fillMode:b}=this.$props,ie=function(){return s.createVNode("span",{class:this.wrapperClass,tabindex:g,accesskey:this.$props.accessKey,id:i,dir:p,ref:t.setRef(this,"kendoAnchor"),onKeydown:this.onWrapperKeyDown,onClick:this.onWrapperClick,onMousedown:this.onWrapperMouseDown,onFocusin:this.onFocus,onFocusout:this.onBlur,role:"combobox","aria-haspopup":"tree","aria-expanded":this.isOpen,"aria-disabled":d,"aria-label":l||this.$props.ariaLabel,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,"aria-required":$},[s.createVNode("span",{class:"k-input-inner"},[J]),this.$props.loading&&s.createVNode(t.Icon,{class:"k-input-loading-icon",name:"loading"},null),this.hasValue&&!d&&s.createVNode("span",{onClick:this.onClear,class:"k-clear-value",title:F.toLanguageString(c.clear,c.messages[c.clear]),role:"button",tabindex:-1,onMousedown:m=>m.preventDefault()},[s.createVNode(t.Icon,{name:"x",icon:k.xIcon},null)]),s.createVNode(O.Button,{tabIndex:-1,type:"button","aria-label":"select",class:"k-input-button",size:h,fillMode:b,themeColor:"base",rounded:null,icon:"caret-alt-down",svgIcon:k.caretAltDownIcon},null),s.createVNode("select",{name:u,ref:t.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:l,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[s.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,this.computedValue):this.computedValue},null)]),!x&&s.createVNode(se.Popup,{style:{width:this.popupWidth,direction:p},ref:t.setRef(this,"popup"),class:t.classNames(a.className,{"k-rtl":p==="rtl"}),popupClass:t.classNames(a.popupClass,"k-dropdowntree-popup","popup-"+this.componentGuid),animate:a.animate,anchor:this.anchor,show:this.isOpen,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,appendTo:a.appendTo},{default:()=>[this.$props.filterable&&s.createVNode(T.ListFilter,{value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,onBlur:this.onBlur,size:h,rounded:D,fillMode:b},null),v&&s.createVNode("div",{class:"k-list-header"},[v]),n.length>0?s.createVNode(M.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:o,textField:this.$props.textField,selectField:S,expandField:this.$props.expandField,childrenField:R,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:h,item:I},null):N,y&&s.createVNode("div",{class:"k-list-footer"},[y])]})])},f=[s.h(ie.call(this),{...this.$attrs}),x&&ee.call(this)];return l?s.createVNode(le.FloatingLabel,{label:l,editorValue:this.currentValueText,editorPlaceholder:r,editorValid:te,editorDisabled:d,editorId:i,focused:this.focused,dir:p},K(f)?f:{default:()=>[f]}):f},methods:{calculateMedia(e){for(let i of e)this.windowWidth=i.target.clientWidth},calculatePopupWidth(){this.elementRef&&(this.popupWidth=this.popupSettings.width!==void 0?this.popupSettings.width:this.elementRef.offsetWidth+"px")},focus(){this.$el&&this.$el.focus()},setValidity(){if(this.selectRef&&this.selectRef.setCustomValidity){const{validationMessage:e,valid:i,required:n}=this.$props,o=w({validationMessage:e,valid:i,required:n},this.hasValue);this.selectRef.setCustomValidity(o.valid?"":this.validationMessage===void 0?pe:this.validationMessage)}},openPopup(e){if(!this.isOpen){const i={...e};this.$emit("open",i),this.currentOpened=!0}},closePopup(e){if(this.isOpen){const i={...e};this.$emit("close",i),this.currentOpened=!1}},onWrapperClick(e){if(this.onFilterChange({...e,target:{value:""}}),!e.defaultPrevented&&this.$el){this.focused=!0;const i={event:e,target:this};(this.isOpen?this.closePopup:this.openPopup)(i)}},switchFocus(e){this.skipFocusRef=!0,e(),window.setTimeout(()=>this.skipFocusRef=!1,0)},onWrapperKeyDown(e){const{keyCode:i,altKey:n}=e,o=this.treeViewRef&&this.treeViewRef.$el,a=this.inputRef&&this.inputRef.input;if(this.$props.disabled||e.defaultPrevented&&a===e.target)return;const d={event:e,target:this};if(this.isOpen)if(i===t.Keys.esc||n&&i===t.Keys.up)e.preventDefault(),this.closePopup(d);else if(o&&o.querySelector(".k-focus")&&(i===t.Keys.up||i===t.Keys.down||i===t.Keys.left||i===t.Keys.right||i===t.Keys.home||i===t.Keys.end)){if(i===t.Keys.up&&a){const r=Array.from(o.querySelectorAll(".k-treeview-item")),l=[...r].reverse().find(u=>!!(u&&u.querySelector(".k-focus")));if(l&&r.indexOf(l)===0)return this.switchFocus(()=>{this.focusElement(a)})}this.switchFocus(t.noop)}else i===t.Keys.down&&this.switchFocus(()=>{this.focusElement(a||o)});else n&&i===t.Keys.down&&(e.preventDefault(),this.openPopup(d))},onInputKeyDown(e){const{keyCode:i,altKey:n}=e;if(i===t.Keys.esc)this.onWrapperClick(e);else if(n||i!==t.Keys.up&&i!==t.Keys.down)return;e.preventDefault(),this.switchFocus(i===t.Keys.up?()=>{this.focusElement(this.elementRef)}:()=>{this.focusElement(this.treeViewRef&&this.treeViewRef.$el)})},focusElement(e){e&&this.switchFocus(()=>e.focus())},onPopupOpened(){if(!this.focused&&this.isOpen&&!this.currentOpened)this.closePopup({target:this});else if(this.$props.filterable){const e=this.inputRef&&this.inputRef.input;this.focusElement(e)}else this.focusElement(this.treeViewRef&&this.treeViewRef.$el)},onPopupClosed(){this.focused&&this.focusElement(this.elementRef)},onFocus(e){if(!this.focused&&!this.skipFocusRef){this.focused=!0;const i={event:e,target:this};this.$emit("focus",i)}},onBlur(e){if(this.focused&&!this.skipFocusRef){this.focused=!1;const i={event:e,target:this},n={...i};(!e.relatedTarget||!e.relatedTarget.closest(".popup-"+this.componentGuid))&&!this.adaptiveState&&(this.$emit("blur",n),this.closePopup(i))}},onWrapperMouseDown(){this.focused&&this.switchFocus(t.noop)},changeValue(e,i,n){const o={value:i,level:n?E(n):[],...e};this.$emit("changemodel",i),this.$emit("update:modelValue",i),this.$emit("change",o),this.currentValue=i},onChange(e){if(V.areSame(e.item,this.computedValue,this.dataItemKey)||!this.$el)return;const{item:i,itemHierarchicalIndex:n,event:o}=e,a={event:o,target:this};this.changeValue(a,i,n),this.closePopup(a)},onClear(e){const i={event:e,target:this};this.changeValue(i,null),this.closePopup(i),e.preventDefault()},onExpand(e){const{item:i,itemHierarchicalIndex:n,event:o}=e,a={level:E(n),item:i,event:o,target:this};this.$emit("expandchange",a)},onFilterChange(e){const n={filter:{field:this.$props.textField,operator:"contains",value:e.target.value},event:e,target:this};this.$emit("filterchange",n),this.$props.filter===void 0&&(this.filterState=e.target.value)}}});exports.DropDownTree=he;
|