@progress/kendo-vue-dropdowns 8.4.0-develop.2 → 8.4.0-develop.4
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/ComboBox/ComboBox.js +1 -1
- package/ComboBox/ComboBox.mjs +2 -2
- package/DropDownList/DropDownList.js +1 -1
- package/DropDownList/DropDownList.mjs +97 -94
- package/DropDownTree/DropDownTree.js +1 -1
- package/DropDownTree/DropDownTree.mjs +15 -15
- package/common/SearchBar.js +1 -1
- package/common/SearchBar.mjs +2 -1
- package/dist/cdn/js/kendo-vue-dropdowns.js +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +16 -11
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 r=require("vue"),ge=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),l=require("@progress/kendo-vue-common"),_=require("@progress/kendo-vue-buttons"),a=require("../common/utils.js"),me=require("../common/SearchBar.js"),ve=require("../common/ListContainer.js"),be=require("../common/List.js"),Ie=require("../common/ClearButton.js"),Se=require("@progress/kendo-vue-intl"),K=require("../messages/main.js"),W=require("@progress/kendo-svg-icons"),U=require("../common/constants.js"),ye=require("@progress/kendo-vue-layout"),ke=require("../common/ListFilter.js"),{sizeMap:j,roundedMap:xe}=l.kendoThemeMaps;function Ve(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!r.isVNode(e)}const $e="Please enter a valid value!",Ce=r.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=l.guid(),this.inputId=l.guid()},setup(){const e=r.ref(null),t=r.ref(null),i=r.ref(null),s=r.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 g;const{dataItems:e=[],dataItemKey:t,virtual:i,groupField:s,textField:n}=this.$props,p=this.isOpen,o=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,c=!o&&p,h=this.$refs.list,v=this.$refs.scrollElement,d=this.computedValue();if(this.valueOnDidUpdate=d,h&&(this.base.vs.list=h.list,this.base.list=h.list),v&&(this.base.vs.scrollElement=v),h&&e.length&&this.base.vs.scrollerRef(h.$el),i&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const f=this.prevCurrentValue;let u=e.findIndex(m=>a.areSame(m,d,t));if(u===-1&&!t&&n&&d){const m=a.getItemValue(d,n);u=e.findIndex(y=>a.getItemValue(y,n)===m)}if(s&&u!==-1){const m=this.base.getGroupedDataModernMode(e,s),y=a.getItemValue(d,n);u=(g=m==null?void 0:m.findIndex($=>a.getItemValue($,n)===y))!=null?g:u}const k=!a.areSame(f,d,t);if(c&&i)this.base.scrollToVirtualItem(i,u),this.prevCurrentOpened=!0;else if(c&&!i)e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][s],this),this.base.scrollToItem(u),this.prevCurrentOpened=!0;else if(p&&o&&d&&k)this.base.scrollToItem(u);else if(p&&!d&&!this.isScrolling){let m=this.getFocusedIndex();if(s&&m!==-1&&e.length>0){const y=e[m][n];m=this.base.getGroupedDataModernMode(e,s).findIndex(O=>O[n]===y)}this.base.scrollToItem(m)}}c&&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=>a.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=>a.getItemValue(s,e)===t);return this.dataItems[i]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive&&e&&typeof e=="object"?a.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:n}=this.$props,p=s?s.skip:0,o=i[e-p],c=!a.areSame(o,this.computedValue(),n);this.triggerOnChange(o,t),this.currentText!==void 0&&(t.data.currentText=void 0),c&&this.base.triggerPageChangeCornerItems(o,t)},onNavigate(e,t){const{dataItems:i=[],virtual:s={skip:0},groupField:n,textField:p}=this.$props,o=this.$props.filter?this.$props.filter:this.currentText;let c=this.getFocusedIndex();const h=this.base.vs,v=this.computedValue();this.suggested="";const d=n?this.base.getGroupedDataModernMode(i,n):i;let g=c;if(n&&c!==-1&&c<i.length){const f=i[c];f&&(g=d.findIndex(u=>u[p]===f[p]))}if(c!==-1&&!a.isPresent(v))this.handleItemSelect(c,e);else if(o===""&&!a.isPresent(v))this.handleItemSelect(0,e);else{let f=s.skip+g,u=this.base.navigation.navigate({keyCode:t,current:f,max:(h.enabled?h.total:d.length)-1,min:0});if(u!==void 0&&n){const k=t===l.Keys.down||t===l.Keys.right||t===l.Keys.pageDown||t===l.Keys.end?1:-1;let m=0;for(;m<d.length;){const y=d[u-s.skip];if(y&&Object.keys(y).length===1&&y[n]!==void 0){if(u+=k,u<0||u>=d.length)return}else{const $=d[u-s.skip],O=i.findIndex(B=>B[p]===$[p]);O!==-1&&this.handleItemSelect(O+s.skip,e);return}m++}}else u!==void 0&&this.handleItemSelect(u,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:n,valuePrimitive:p}=this.$props,o=this.isOpen,h=this.getSelectedItemText()===e?this.index:a.getItemIndexByText(i,e,s),v=h!==-1;let d;if(this.suggested="",v)d=i[h];else if(n)d=s!==void 0&&!p?{[s]:e}:e;else return this.selectFocusedItem(e,t);this.triggerOnChange(d,t),o&&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:n,valuePrimitive:p}=this.$props,o=this.isOpen,c=this.getSelectedItemText();if(this.suggested="",e===c||e===""&&!a.isPresent(c))return o&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t);const h=a.getItemIndexByText(i,e,s,!0),v=h!==-1;let d=null;v?d=i[h]:n&&e&&(s&&!p?d={[s]:e}:d=e),this.triggerOnChange(d,t),this.currentText!==void 0&&(t.data.currentText=void 0,this.base.filterChanged("",t)),o&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t)},selectFocusedItem(e,t){const i=this.isOpen,{dataItems:s=[],textField:n,virtual:p={skip:0},focusedItemIndex:o=a.itemIndexStartsWith}=this.$props,c=p.skip,h=e===""&&c===0?0:o(s,e,n);return h!==-1?this.handleItemSelect(h+c,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 n=()=>{e.preventDefault(),this.base.togglePopup(s),this.applyState(s)};i?e.altKey&&t===l.Keys.up?n():t===l.Keys.enter?(e.preventDefault(),this.applyValueOnEnter(e.currentTarget.value,s)):t===l.Keys.esc&&(this.adaptiveState&&this.toggleBtnClick(e),n()):e.altKey&&t===l.Keys.down?n():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,n=s.value;if(this.$props.suggest){const p=s.selectionEnd===n.length;let o=this.$props.filter!==void 0?this.$props.filter:this.currentText;a.isPresent(o)||(o=a.getItemValue(this.computedValue(),this.$props.textField)||"");const c=o&&o===n,h=o&&o.length>n.length;c||h||!p?this.suggested="":this.suggestValue(n)}this.$props.filter===void 0&&(t.data.currentText=n),this.currentFocusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(n,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:n={skip:0},focusedItemIndex:p=a.itemIndexStartsWith}=this.$props,o=this.$props.filter?this.$props.filter:this.currentText;if(a.isPresent(e)&&o===void 0){let c=t.findIndex(h=>a.areSame(h,e,s));if(c===-1&&!s&&i){const h=a.getItemValue(e,i);c=t.findIndex(v=>a.getItemValue(v,i)===h)}return c}else return o?p(t,o,i):n.skip===0?0:-1},suggestValue(e){const{dataItems:t,textField:i}=this.$props;this.suggested=a.suggestValue(e,t,i)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||$e)},compareValues(e,t){return this.$props.valuePrimitive&&(typeof e!="object"||e===null)&&(typeof t!="object"||t===null)?e===t:a.areSame(e,t,this.$props.dataItemKey)},triggerOnChange(e,t){const i=this.computedValue();!a.isPresent(i)&&!a.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:n}=this.$props;let{dataItems:p=[]}=this.$props,o;if(!n||!p.length)return;const h=e.target.scrollTop-t.skip*(t.itemHeight||0);if(n){p=this.base.getGroupedDataModernMode(p,n),o=p[0][n];let v=0,d=0,g=0;if(i&&!t.enabled){const f=i.querySelector(".k-list-item"),u=i.querySelector(".k-list-group-item");d=(f==null?void 0:f.offsetHeight)||0,g=(u==null?void 0:u.offsetHeight)||d}else d=t.itemHeight||0,g=d;for(let f=0;f<p.length;f++){const u=p[f],k=u&&Object.keys(u).length===1&&u[n]!==void 0,m=k?g:d;if(k&&v<=h&&(o=u[n]),v+=m,v>h)break}}o!==this.group&&(s.data.group=o,this.applyState(s))},getInputText(e,t){return a.isPresent(e)&&e!==""?String(e):a.isPresent(t)?String(t):""},getSelectedItemText(){const{textField:e,valuePrimitive:t}=this.$props,i=this.computedValue();if(a.isPresent(i))return t?i&&typeof i=="object"?a.getItemValue(i,e):typeof i=="string"?i!==""?i:void 0:typeof i=="number"||typeof i=="boolean"?String(i):void 0:a.getItemValue(i,e)}},render(){let{dir:e,disabled:t,clearButton:i,label:s,textField:n,className:p,style:o,loading:c,icon:h,svgIcon:v,iconClassName:d,virtual:g,size:f,fillMode:u,rounded:k,adaptiveTitle:m,header:y,footer:$,groupStickyHeaderItemRender:O,placeholder:B,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),D=this.computedValue(),X=this.$props.valuePrimitive?!!this.findByFieldValue(this.valueField,D)||this.$props.allowCustom&&a.isPresent(D)&&D!=="":a.isPresent(D),Z=i&&(!!A||X),C=this.base,V=C.vs,P=this.$props.id||this.inputId,M=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),ee=Se.provideLocalizationService(this).toLanguageString(K.expandButton,K.messages[K.expandButton]),F=this.isOpen,N=this.adaptiveState;V.enabled=g!==void 0,g!==void 0&&(V.skip=g.skip,V.total=g.total,V.pageSize=g.pageSize),this.group===void 0&&this.$props.groupField!==void 0&&(this.group=a.getItemValue(this.$props.dataItems[0],this.$props.groupField));const te=b=>{const I=this.base.initState();I.event=b;const S=b.event.target.value;I.data.text=S,this.base.filterChanged(S,I),this.applyState(I)},ie=()=>[r.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[r.createVNode("div",{class:"k-actionsheet-title"},[r.createVNode("div",{class:"k-text-center"},[m]),B&&r.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[B])]),r.createVNode("div",{class:"k-actionsheet-actions"},[r.createVNode(_.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.toggleBtnClick,icon:"x",svgIcon:W.xIcon},null)])]),r.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 b=C.getTemplateDef.call(this,y,r.h),I=C.getTemplateDef.call(this,$,r.h),S=l.templateRendering.call(this,O,l.getListeners.call(this)),x=this.$props.dataItems||[];return r.createVNode("div",{class:"k-list-container"},[b&&r.createVNode("div",{class:"k-list-header"},[b]),r.createVNode("div",{class:l.classNames("k-list",{[`k-list-${j[f]||f}`]:N?!1:f,"k-list-lg":!!N,"k-virtual-list":V.enabled})},[y&&r.createVNode("div",{class:"k-list-header"},[y]),this.group&&x.length!==0&&r.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),q.call(this),I&&r.createVNode("div",{class:"k-list-footer"},[I])])])},ae=l.templateRendering.call(this,ne,l.getListeners.call(this)),re=function(){return r.createVNode(ye.ActionSheet,{expand:F,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 I=this.base.initState().data.text;return r.createVNode(ke.ListFilter,{adaptiveMode:!0,value:I,ref:"filterInput",onChange:S=>te(S),onKeydown:this.onInputKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode},null)},q=function(){let b;const{dataItemKey:I,groupField:S}=this.$props;let x=this.$props.dataItems||[];const T=l.templateRendering.call(this,this.$props.itemRender,l.getListeners.call(this)),L=l.templateRendering.call(this,this.$props.groupHeaderItemRender,l.getListeners.call(this)),H=l.templateRendering.call(this,this.$props.listNoDataRender,l.getListeners.call(this));g||(g={skip:0});const w=g.skip,pe=`translateY(${V.translate}px)`,he=F?this.getFocusedIndex():void 0,fe=a.isPresent(R)&&R!==E?null:this.computedValue();return S&&(x=this.base.getGroupedDataModernMode(x,S)),r.createVNode(be.List,{id:C.listBoxId,show:F,dataItems:x,focusedIndex:he,value:fe,textField:n,valueField:I,optionsGuid:C.guid,ref:"list",wrapperStyle:{maxHeight:N?void 0:M.height},wrapperCssClass:l.classNames("k-list-content",{"k-list-scroller":!this.$props.virtual}),listStyle:V.enabled?{transform:pe}:void 0,key:"listkey",skip:w,onListclick:this.handleItemClick,itemRender:T,groupHeaderItemRender:L,noDataRender:H,groupField:S,onScroll:this.onScroll},Ve(b=oe.call(this))?b:{default:()=>[b]})},oe=function(){return V.enabled&&r.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},de=function(){const b=l.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,l.getListeners.call(this)),I=C.getTemplateDef.call(this,y),S=C.getTemplateDef.call(this,$),x=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=a.getItemValue(x[0],this.$props.groupField)),r.createVNode(ve.ListContainer,{ref:"container",onMousedown:T=>T.preventDefault(),width:this.popupWidth,popupSettings:{...M,anchor:this.anchor,show:F,popupClass:l.classNames(M.popupClass,"k-list",{[`k-list-${j[f]||f}`]:f,"k-virtual-list":this.base.vs.enabled}),className:l.classNames("k-list-container",M.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[I&&r.createVNode("div",{class:"k-list-header"},[I]),this.group&&x.length!==0&&r.createVNode(G.GroupStickyHeader,{group:this.group,render:b},null),q.call(this),S&&r.createVNode("div",{class:"k-list-footer"},[S])]})},ue=function(b,I){const{tabIndex:S,dataItems:x=[],dataItemKey:T}=this.$props;g||(g={skip:0});const L=this.computedValue(),H=Math.max(0,x.findIndex(w=>a.areSame(w,L,T)));return this.suggested&&!a.areSame(this.valueOnDidUpdate,L,T)&&(this.suggested=""),r.createVNode(me.SearchBar,{id:I,placeholder:B,tabIndex:S||void 0,accessKey:this.$props.accessKey,value:b+this.suggested,suggestedText:this.suggested,ref:w=>{this.inputRef=w},onKeydown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:t,expanded:F,owns:this.base.listBoxId,activedescendant:this.base.guid+"-"+(H+g.skip),ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:Y},null)},ce=function(){return r.createVNode("span",{class:l.classNames("k-combobox k-input",{[`k-input-${j[f]||f}`]:f,[`k-rounded-${xe[k]||k}`]:k,[`k-input-${u}`]:u,"k-invalid":!Q,"k-loading":c,"k-required":this.required,"k-disabled":t,"k-focus":J&&!t},p),ref:l.setRef(this,"kendoAnchor"),style:s?{...o,width:void 0}:o,dir:e},[ue.call(this,A||"",P),Z&&!c&&r.createVNode(Ie.ClearButton,{onClearclick:this.clearButtonClick,key:"clearbutton"},null),c&&r.createVNode(l.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),r.createVNode(_.Button,{type:"button",tabIndex:-1,"aria-label":ee,size:f,fillMode:u,rounded:null,class:"k-input-button",icon:h||"caret-alt-down",svgIcon:v||W.caretAltDownIcon,iconClass:d,onClick:this.toggleBtnClick,onMousedown:b=>b.preventDefault()},null),!N&&de.call(this)])},z=[r.h(ce.call(this),{...this.$attrs}),N&&re.call(this)];return s?r.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,dir:this.$props.dir},[z,this.$props.label?P?r.createVNode("label",{for:P,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):z}});exports.ComboBox=Ce;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),ge=require("../common/DropDownBase.js"),G=require("../common/GroupStickyHeader.js"),l=require("@progress/kendo-vue-common"),_=require("@progress/kendo-vue-buttons"),a=require("../common/utils.js"),me=require("../common/SearchBar.js"),ve=require("../common/ListContainer.js"),be=require("../common/List.js"),Ie=require("../common/ClearButton.js"),Se=require("@progress/kendo-vue-intl"),K=require("../messages/main.js"),W=require("@progress/kendo-svg-icons"),U=require("../common/constants.js"),ye=require("@progress/kendo-vue-layout"),ke=require("../common/ListFilter.js"),{sizeMap:j,roundedMap:xe}=l.kendoThemeMaps;function Ve(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!r.isVNode(e)}const $e="Please enter a valid value!",Ce=r.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=l.guid(),this.inputId=l.guid()},setup(){const e=r.ref(null),t=r.ref(null),i=r.ref(null),s=r.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 g;const{dataItems:e=[],dataItemKey:t,virtual:i,groupField:s,textField:n}=this.$props,p=this.isOpen,o=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,c=!o&&p,h=this.$refs.list,v=this.$refs.scrollElement,d=this.computedValue();if(this.valueOnDidUpdate=d,h&&(this.base.vs.list=h.list,this.base.list=h.list),v&&(this.base.vs.scrollElement=v),h&&e.length&&this.base.vs.scrollerRef(h.$el),i&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const f=this.prevCurrentValue;let u=e.findIndex(m=>a.areSame(m,d,t));if(u===-1&&!t&&n&&d){const m=a.getItemValue(d,n);u=e.findIndex(y=>a.getItemValue(y,n)===m)}if(s&&u!==-1){const m=this.base.getGroupedDataModernMode(e,s),y=a.getItemValue(d,n);u=(g=m==null?void 0:m.findIndex($=>a.getItemValue($,n)===y))!=null?g:u}const k=!a.areSame(f,d,t);if(c&&i)this.base.scrollToVirtualItem(i,u),this.prevCurrentOpened=!0;else if(c&&!i)e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][s],this),this.base.scrollToItem(u),this.prevCurrentOpened=!0;else if(p&&o&&d&&k)this.base.scrollToItem(u);else if(p&&!d&&!this.isScrolling){let m=this.getFocusedIndex();if(s&&m!==-1&&e.length>0){const y=e[m][n];m=this.base.getGroupedDataModernMode(e,s).findIndex(O=>O[n]===y)}this.base.scrollToItem(m)}}c&&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=>a.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=>a.getItemValue(s,e)===t);return this.dataItems[i]},primitiveValue(){const e=this.computedValue();return this.valuePrimitive&&e&&typeof e=="object"?a.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:n}=this.$props,p=s?s.skip:0,o=i[e-p],c=!a.areSame(o,this.computedValue(),n);this.triggerOnChange(o,t),this.currentText!==void 0&&(t.data.currentText=void 0),c&&this.base.triggerPageChangeCornerItems(o,t)},onNavigate(e,t){const{dataItems:i=[],virtual:s={skip:0},groupField:n,textField:p}=this.$props,o=this.$props.filter?this.$props.filter:this.currentText;let c=this.getFocusedIndex();const h=this.base.vs,v=this.computedValue();this.suggested="";const d=n?this.base.getGroupedDataModernMode(i,n):i;let g=c;if(n&&c!==-1&&c<i.length){const f=i[c];f&&(g=d.findIndex(u=>u[p]===f[p]))}if(c!==-1&&!a.isPresent(v))this.handleItemSelect(c,e);else if(o===""&&!a.isPresent(v))this.handleItemSelect(0,e);else{let f=s.skip+g,u=this.base.navigation.navigate({keyCode:t,current:f,max:(h.enabled?h.total:d.length)-1,min:0});if(u!==void 0&&n){const k=t===l.Keys.down||t===l.Keys.right||t===l.Keys.pageDown||t===l.Keys.end?1:-1;let m=0;for(;m<d.length;){const y=d[u-s.skip];if(y&&Object.keys(y).length===1&&y[n]!==void 0){if(u+=k,u<0||u>=d.length)return}else{const $=d[u-s.skip],O=i.findIndex(B=>B[p]===$[p]);O!==-1&&this.handleItemSelect(O+s.skip,e);return}m++}}else u!==void 0&&this.handleItemSelect(u,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:n,valuePrimitive:p}=this.$props,o=this.isOpen,h=this.getSelectedItemText()===e?this.index:a.getItemIndexByText(i,e,s),v=h!==-1;let d;if(this.suggested="",v)d=i[h];else if(n)d=s!==void 0&&!p?{[s]:e}:e;else return this.selectFocusedItem(e,t);this.triggerOnChange(d,t),o&&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:n,valuePrimitive:p}=this.$props,o=this.isOpen,c=this.getSelectedItemText();if(this.suggested="",e===c||e===""&&!a.isPresent(c))return o&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t);const h=a.getItemIndexByText(i,e,s,!0),v=h!==-1;let d=null;v?d=i[h]:n&&e&&(s&&!p?d={[s]:e}:d=e),this.triggerOnChange(d,t),this.currentText!==void 0&&(t.data.currentText=void 0,this.base.filterChanged("",t)),o&&!this.adaptiveState&&this.base.togglePopup(t),this.applyState(t)},selectFocusedItem(e,t){const i=this.isOpen,{dataItems:s=[],textField:n,virtual:p={skip:0},focusedItemIndex:o=a.itemIndexStartsWith}=this.$props,c=p.skip,h=e===""&&c===0?0:o(s,e,n);return h!==-1?this.handleItemSelect(h+c,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 n=()=>{e.preventDefault(),this.base.togglePopup(s),this.applyState(s)};i?e.altKey&&t===l.Keys.up?n():t===l.Keys.enter?(e.preventDefault(),this.applyValueOnEnter(e.currentTarget.value,s)):t===l.Keys.esc&&(this.adaptiveState&&this.toggleBtnClick(e),n()):e.altKey&&t===l.Keys.down?n():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,n=s.value;if(this.$props.suggest){const p=s.selectionEnd===n.length;let o=this.$props.filter!==void 0?this.$props.filter:this.currentText;a.isPresent(o)||(o=a.getItemValue(this.computedValue(),this.$props.textField)||"");const c=o&&o===n,h=o&&o.length>n.length;c||h||!p?this.suggested="":this.suggestValue(n)}this.$props.filter===void 0&&(t.data.currentText=n),this.currentFocusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(n,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:n={skip:0},focusedItemIndex:p=a.itemIndexStartsWith}=this.$props,o=this.$props.filter?this.$props.filter:this.currentText;if(a.isPresent(e)&&o===void 0){let c=t.findIndex(h=>a.areSame(h,e,s));if(c===-1&&!s&&i){const h=a.getItemValue(e,i);c=t.findIndex(v=>a.getItemValue(v,i)===h)}return c}else return o?p(t,o,i):n.skip===0?0:-1},suggestValue(e){const{dataItems:t,textField:i}=this.$props;this.suggested=a.suggestValue(e,t,i)},setValidity(){this.input&&this.input.setCustomValidity&&this.input.setCustomValidity(this.validity().valid?"":this.$props.validationMessage||$e)},compareValues(e,t){return this.$props.valuePrimitive&&(typeof e!="object"||e===null)&&(typeof t!="object"||t===null)?e===t:a.areSame(e,t,this.$props.dataItemKey)},triggerOnChange(e,t){const i=this.computedValue();!a.isPresent(i)&&!a.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:n}=this.$props;let{dataItems:p=[]}=this.$props,o;if(!n||!p.length)return;const h=e.target.scrollTop-t.skip*(t.itemHeight||0);if(n){p=this.base.getGroupedDataModernMode(p,n),o=p[0][n];let v=0,d=0,g=0;if(i&&!t.enabled){const f=i.querySelector(".k-list-item"),u=i.querySelector(".k-list-group-item");d=(f==null?void 0:f.offsetHeight)||0,g=(u==null?void 0:u.offsetHeight)||d}else d=t.itemHeight||0,g=d;for(let f=0;f<p.length;f++){const u=p[f],k=u&&Object.keys(u).length===1&&u[n]!==void 0,m=k?g:d;if(k&&v<=h&&(o=u[n]),v+=m,v>h)break}}o!==this.group&&(s.data.group=o,this.applyState(s))},getInputText(e,t){return a.isPresent(e)&&e!==""?String(e):a.isPresent(t)?String(t):""},getSelectedItemText(){const{textField:e,valuePrimitive:t}=this.$props,i=this.computedValue();if(a.isPresent(i))return t?i&&typeof i=="object"?a.getItemValue(i,e):typeof i=="string"?i!==""?i:void 0:typeof i=="number"||typeof i=="boolean"?String(i):void 0:a.getItemValue(i,e)}},render(){let{dir:e,disabled:t,clearButton:i,label:s,textField:n,className:p,style:o,loading:c,icon:h,svgIcon:v,iconClassName:d,virtual:g,size:f,fillMode:u,rounded:k,adaptiveTitle:m,header:y,footer:$,groupStickyHeaderItemRender:O,placeholder:B,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(),q=this.getInputText(R,E),D=this.computedValue(),X=this.$props.valuePrimitive?!!this.findByFieldValue(this.valueField,D)||this.$props.allowCustom&&a.isPresent(D)&&D!=="":a.isPresent(D),Z=i&&(!!q||X),C=this.base,V=C.vs,P=this.$props.id||this.inputId,M=Object.assign({},{animate:!0,height:"200px"},this.$props.popupSettings),ee=Se.provideLocalizationService(this).toLanguageString(K.expandButton,K.messages[K.expandButton]),F=this.isOpen,N=this.adaptiveState;V.enabled=g!==void 0,g!==void 0&&(V.skip=g.skip,V.total=g.total,V.pageSize=g.pageSize),this.group===void 0&&this.$props.groupField!==void 0&&(this.group=a.getItemValue(this.$props.dataItems[0],this.$props.groupField));const te=b=>{const I=this.base.initState();I.event=b;const S=b.event.target.value;I.data.text=S,this.base.filterChanged(S,I),this.applyState(I)},ie=()=>[r.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[r.createVNode("div",{class:"k-actionsheet-title"},[r.createVNode("div",{class:"k-text-center"},[m]),B&&r.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[B])]),r.createVNode("div",{class:"k-actionsheet-actions"},[r.createVNode(_.Button,{tabIndex:5,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.toggleBtnClick,icon:"x",svgIcon:W.xIcon},null)])]),r.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 b=C.getTemplateDef.call(this,y,r.h),I=C.getTemplateDef.call(this,$,r.h),S=l.templateRendering.call(this,O,l.getListeners.call(this)),x=this.$props.dataItems||[];return r.createVNode("div",{class:"k-list-container"},[b&&r.createVNode("div",{class:"k-list-header"},[b]),r.createVNode("div",{class:l.classNames("k-list",{[`k-list-${j[f]||f}`]:N?!1:f,"k-list-lg":!!N,"k-virtual-list":V.enabled})},[y&&r.createVNode("div",{class:"k-list-header"},[y]),this.group&&x.length!==0&&r.createVNode(G.GroupStickyHeader,{group:this.group,render:S},null),A.call(this),I&&r.createVNode("div",{class:"k-list-footer"},[I])])])},ae=l.templateRendering.call(this,ne,l.getListeners.call(this)),re=function(){return r.createVNode(ye.ActionSheet,{expand:F,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 I=this.base.initState().data.text;return r.createVNode(ke.ListFilter,{adaptiveMode:!0,value:I,ref:"filterInput",onChange:S=>te(S),onKeydown:this.onInputKeyDown,size:this.$props.size,rounded:this.$props.rounded,fillMode:this.$props.fillMode},null)},A=function(){let b;const{dataItemKey:I,groupField:S}=this.$props;let x=this.$props.dataItems||[];const T=l.templateRendering.call(this,this.$props.itemRender,l.getListeners.call(this)),L=l.templateRendering.call(this,this.$props.groupHeaderItemRender,l.getListeners.call(this)),H=l.templateRendering.call(this,this.$props.listNoDataRender,l.getListeners.call(this));g||(g={skip:0});const w=g.skip,pe=`translateY(${V.translate}px)`,he=F?this.getFocusedIndex():void 0,fe=a.isPresent(R)&&R!==E?null:this.computedValue();return S&&(x=this.base.getGroupedDataModernMode(x,S)),r.createVNode(be.List,{id:C.listBoxId,show:F,dataItems:x,focusedIndex:he,value:fe,textField:n,valueField:I,optionsGuid:C.guid,ref:"list",wrapperStyle:{maxHeight:N?void 0:M.height},wrapperCssClass:l.classNames("k-list-content",{"k-list-scroller":!this.$props.virtual}),listStyle:V.enabled?{transform:pe}:void 0,key:"listkey",skip:w,onListclick:this.handleItemClick,itemRender:T,groupHeaderItemRender:L,noDataRender:H,groupField:S,onScroll:this.onScroll},Ve(b=oe.call(this))?b:{default:()=>[b]})},oe=function(){return V.enabled&&r.createVNode("div",{ref:"scrollElement",key:"scrollElementKey"},null)},de=function(){const b=l.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,l.getListeners.call(this)),I=C.getTemplateDef.call(this,y),S=C.getTemplateDef.call(this,$),x=this.$props.dataItems||[];return this.group===void 0&&this.$props.groupField!==void 0&&(this.group=a.getItemValue(x[0],this.$props.groupField)),r.createVNode(ve.ListContainer,{ref:"container",onMousedown:T=>T.preventDefault(),width:this.popupWidth,popupSettings:{...M,anchor:this.anchor,show:F,popupClass:l.classNames(M.popupClass,"k-list",{[`k-list-${j[f]||f}`]:f,"k-virtual-list":this.base.vs.enabled}),className:l.classNames("k-list-container",M.className)},dir:e!==void 0?e:this.base.dirCalculated},{default:()=>[I&&r.createVNode("div",{class:"k-list-header"},[I]),this.group&&x.length!==0&&r.createVNode(G.GroupStickyHeader,{group:this.group,render:b},null),A.call(this),S&&r.createVNode("div",{class:"k-list-footer"},[S])]})},ue=function(b,I){const{tabIndex:S,dataItems:x=[],dataItemKey:T}=this.$props;g||(g={skip:0});const L=this.computedValue(),H=Math.max(0,x.findIndex(w=>a.areSame(w,L,T)));return this.suggested&&!a.areSame(this.valueOnDidUpdate,L,T)&&(this.suggested=""),r.createVNode(me.SearchBar,{id:I,placeholder:B,tabIndex:S||void 0,accessKey:this.$props.accessKey,value:b+this.suggested,suggestedText:this.suggested,ref:w=>{this.inputRef=w},onKeydown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:t,expanded:F,owns:this.base.listBoxId,activedescendant:this.base.guid+"-"+(H+g.skip),ariaLabelledBy:this.$props.ariaLabelledBy,ariaDescribedBy:this.$props.ariaDescribedBy,ariaLabel:this.$props.ariaLabel,inputAttributes:Y},null)},ce=function(){return r.createVNode("span",{class:l.classNames("k-combobox k-input",{[`k-input-${j[f]||f}`]:f,[`k-rounded-${xe[k]||k}`]:k,[`k-input-${u}`]:u,"k-invalid":!Q,"k-loading":c,"k-required":this.required,"k-disabled":t,"k-focus":J&&!t},p),ref:l.setRef(this,"kendoAnchor"),style:s?{...o,width:void 0}:o,dir:e},[ue.call(this,q||"",P),Z&&!c&&r.createVNode(Ie.ClearButton,{onClearclick:this.clearButtonClick,key:"clearbutton"},null),c&&r.createVNode(l.Icon,{name:"loading",class:"k-input-loading-icon",key:"loading"},null),r.createVNode(_.Button,{type:"button",tabIndex:-1,"aria-label":ee,size:f,fillMode:u,rounded:null,class:"k-input-button",icon:h||"chevron-down",svgIcon:v||W.chevronDownIcon,iconClass:d,onClick:this.toggleBtnClick,onMousedown:b=>b.preventDefault()},null),!N&&de.call(this)])},z=[r.h(ce.call(this),{...this.$attrs}),N&&re.call(this)];return s?r.createVNode("span",{class:this.spanClassNames,onFocusin:this.handleFocus,dir:this.$props.dir},[z,this.$props.label?P?r.createVNode("label",{for:P,class:"k-floating-label"},[this.$props.label]):r.createVNode("span",{class:"k-label"},[this.$props.label]):null]):z}});exports.ComboBox=Ce;
|
package/ComboBox/ComboBox.mjs
CHANGED
|
@@ -17,7 +17,7 @@ import { List as He } from "../common/List.mjs";
|
|
|
17
17
|
import { ClearButton as Re } from "../common/ClearButton.mjs";
|
|
18
18
|
import { provideLocalizationService as Le } from "@progress/kendo-vue-intl";
|
|
19
19
|
import { expandButton as se, messages as je } from "../messages/main.mjs";
|
|
20
|
-
import { xIcon as Ee,
|
|
20
|
+
import { xIcon as Ee, chevronDownIcon as Ne } from "@progress/kendo-svg-icons";
|
|
21
21
|
import { MOBILE_MEDIUM_DEVICE as Ae, MOBILE_SMALL_DEVICE as Pe } from "../common/constants.mjs";
|
|
22
22
|
import { ActionSheet as Ke } from "@progress/kendo-vue-layout";
|
|
23
23
|
import { ListFilter as ze } from "../common/ListFilter.mjs";
|
|
@@ -822,7 +822,7 @@ const We = "Please enter a valid value!", ut = /* @__PURE__ */ xe({
|
|
|
822
822
|
fillMode: o,
|
|
823
823
|
rounded: null,
|
|
824
824
|
class: "k-input-button",
|
|
825
|
-
icon: p || "
|
|
825
|
+
icon: p || "chevron-down",
|
|
826
826
|
svgIcon: g || Ne,
|
|
827
827
|
iconClass: l,
|
|
828
828
|
onClick: this.toggleBtnClick,
|
|
@@ -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,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 b;const{dataItems:e=[],dataItemKey:t,virtual:a,groupField:r,textField:o}=this.$props,s=this.isOpen,u=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,l=!u&&s,d=this.$refs.list,f=this.$refs.filterInput,g=this.$refs.scrollElement;if(this.$refs.scroller,d&&(this.base.vs.list=d.list,this.base.list=d.list),g&&(this.base.vs.scrollElement=g),f&&(this.filterInput=f),d&&e.length&&this.base.vs.scrollerRef(d.$el),this.$props.popupSettings.animate||l&&this.onPopupOpened(),a&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const c=this.computedValue(),v=this.prevCurrentValue;let h=e.findIndex(y=>p.areSame(y,c,t));r&&(h=(b=this.base.getGroupedDataModernMode(e,r))==null?void 0:b.indexOf(c));const S=!p.areSame(v,c,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&&u&&c&&S&&!this._navigated?this.base.scrollToItem(h):s&&u&&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,u=r?r.skip:0,l=e===-1&&s!==void 0?s:a[e-u],d=!p.areSame(l,this.computedValue(),o);this.triggerOnChange(l,t),d&&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,u=this.base.vs,l=this.computedValue(),d=a.findIndex(g=>p.areSame(g,l,o)),f=this.base.navigation.navigate({current:s.skip+d,max:(u.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((y,x)=>({item:y,itemIndex:x}));const o=this.searchState.word,s=this.searchState.last,u=p.sameCharsOnly(o,s);let l=r.length,d=Math.max(0,t.findIndex(y=>p.areSame(y,this.computedValue(),a))),f;this.$props.defaultItem&&(f={item:this.$props.defaultItem,itemIndex:-1},l+=1,d+=1),d+=u?1:0,r=p.shuffleData(r,d,f);let g,b,c,v=0;const{textField:h,ignoreCase:S}=this.$props;for(;v<l;){if(g=p.getItemValue(r[v].item,h),b=u&&p.matchText(g,s,S),c=p.matchText(g,o,S),b||c){v=r[v].itemIndex;break}v++}if(v!==l){const y=this.base.initState();y.event=e,this.handleItemSelect(v,y),this.applyState(y),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,u=this.isOpen,l=e.keyCode,d=l===i.Keys.home||l===i.Keys.end,f=l===i.Keys.up||l===i.Keys.down,g=!u&&(e.altKey&&l===i.Keys.down||l===i.Keys.enter||l===i.Keys.space),b=u&&(e.altKey&&l===i.Keys.up||l===i.Keys.esc),c=a&&(l===i.Keys.left||l===i.Keys.right),v=f||!r&&(c||d),h=this.base.initState();if(h.event=e,!o){if(d&&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(u&&l===i.Keys.enter){const S=this.focusedIndex();S!==void 0&&this.handleItemSelect(S,h),this.base.togglePopup(h),e.preventDefault()}else g||b?(this.adaptiveState&&this.handleWrapperClick(e),this.base.togglePopup(h),e.preventDefault()):v&&(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,u=this.computedValue(),d=!(t.findIndex(f=>p.areSame(f,u,r))<0&&!this.$props.defaultItem);return!d&&e&&a.skip===0?s?s(t,e,o):t.indexOf(p.getFocusedItem(t,e,o)):!d&&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){var b;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,u;if(!o||!s.length)return;const l=a&&((b=a.querySelector(".k-list-item"))==null?void 0:b.offsetHeight)||0,d=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:l),g=e.target.scrollTop-t.skip*d;o&&(s=this.base.getGroupedDataModernMode(s,o),u=s[0][o]);for(let c=1;c<s.length&&!(d*c>g);c++)s[c]&&s[c][o]&&(u=s[c][o]);u!==this.group&&(r.data.group=u,this.applyState(r))}},render(){const{style:e,className:t,label:a,dir:r,virtual:o={skip:0},size:s,rounded:u,fillMode:l,dataItemKey:d,dataItems:f=[],disabled:g,tabIndex:b,loading:c,icon:v,svgIcon:h,iconClassName:S,adaptiveTitle:y,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(m=>p.areSame(m,T,d)),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(m){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,m):m},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"},[y]),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 m=k.getTemplateDef.call(this,x,n.h),I=k.getTemplateDef.call(this,M,n.h),$=i.templateRendering.call(this,q,i.getListeners.call(this));return n.createVNode("div",{class:"k-list-container"},[m&&n.createVNode("div",{class:"k-list-header"},[m]),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),I&&n.createVNode("div",{class:"k-list-footer"},[I])])])},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:m,defaultItem:I}=this.$props;return I!==void 0&&n.createVNode(fe.ListDefaultItem,{defaultItem:I,textField:m,selected:p.areSame(this.computedValue(),I,d),key:"defaultitemkey",onDefaultitemclick:this.handleDefaultItemClick},null)},R=function(){let m;const{textField:I,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:I,valueField:d,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(m=ae.call(this))?m:{default:()=>[m]})},K=function(){const m=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&n.createVNode(he.ListFilter,{value:m,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 m=i.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,i.getListeners.call(this)),I=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:m},null),I&&n.createVNode("div",{class:"k-list-header"},[I]),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[u]||u}`]:u,[`k-picker-${l}`]:l,"k-focus":U,"k-disabled":g,"k-invalid":!A,"k-loading":c,"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(b,g),accesskey:this.$props.accessKey,onKeydown:this.handleKeyDown,onKeypress:this.handleKeyPress,role:"combobox",onClick:g?i.noop:this.handleWrapperClick,"aria-disabled":g||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,c&&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:v||"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(()=>{if(!i.canUseDOM||typeof document=="undefined")return;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 b;const{dataItems:e=[],dataItemKey:t,virtual:a,groupField:r,textField:o}=this.$props,s=this.isOpen,u=this.prevOpened!==void 0?this.prevOpened:this.prevCurrentOpened,l=!u&&s,d=this.$refs.list,g=this.$refs.filterInput,m=this.$refs.scrollElement;if(this.$refs.scroller,d&&(this.base.vs.list=d.list,this.base.list=d.list),m&&(this.base.vs.scrollElement=m),g&&(this.filterInput=g),d&&e.length&&this.base.vs.scrollerRef(d.$el),this.$props.popupSettings.animate||l&&this.onPopupOpened(),a&&this.virtualTotalHasChanged)this.base.vs.calcScrollElementHeight(),this.base.vs.reset(),this.virtualTotalHasChanged=!1;else{const h=this.computedValue(),v=this.prevCurrentValue;let f=e.findIndex(y=>p.areSame(y,h,t));r&&(f=(b=this.base.getGroupedDataModernMode(e,r))==null?void 0:b.indexOf(h));const S=!p.areSame(v,h,t);l&&a?(this.base.scrollToVirtualItem(a,f),this.prevCurrentOpened=!0):l&&!a?(e&&e.length!==0&&this.base.resetGroupStickyHeader(e[0][r],this),this.base.scrollToItem(f),this.prevCurrentOpened=!0):s&&u&&h&&S&&!this._navigated?this.base.scrollToItem(f):s&&u&&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,u=r?r.skip:0,l=e===-1&&s!==void 0?s:a[e-u],d=!p.areSame(l,this.computedValue(),o);this.triggerOnChange(l,t),d&&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,u=this.base.vs,l=this.computedValue(),d=a.findIndex(m=>p.areSame(m,l,o)),g=this.base.navigation.navigate({current:s.skip+d,max:(u.enabled?s.total:a.length)-1,min:r!==void 0?-1:0,keyCode:t});g!==void 0&&this.handleItemSelect(g,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((y,x)=>({item:y,itemIndex:x}));const o=this.searchState.word,s=this.searchState.last,u=p.sameCharsOnly(o,s);let l=r.length,d=Math.max(0,t.findIndex(y=>p.areSame(y,this.computedValue(),a))),g;this.$props.defaultItem&&(g={item:this.$props.defaultItem,itemIndex:-1},l+=1,d+=1),d+=u?1:0,r=p.shuffleData(r,d,g);let m,b,h,v=0;const{textField:f,ignoreCase:S}=this.$props;for(;v<l;){if(m=p.getItemValue(r[v].item,f),b=u&&p.matchText(m,s,S),h=p.matchText(m,o,S),b||h){v=r[v].itemIndex;break}v++}if(v!==l){const y=this.base.initState();y.event=e,this.handleItemSelect(v,y),this.applyState(y),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,u=this.isOpen,l=e.keyCode,d=l===i.Keys.home||l===i.Keys.end,g=l===i.Keys.up||l===i.Keys.down,m=!u&&(e.altKey&&l===i.Keys.down||l===i.Keys.enter||l===i.Keys.space),b=u&&(e.altKey&&l===i.Keys.up||l===i.Keys.esc),h=a&&(l===i.Keys.left||l===i.Keys.right),v=g||!r&&(h||d),f=this.base.initState();if(f.event=e,!o){if(d&&this.base.vs.enabled)l===i.Keys.home?s.skip!==0?(this.base.triggerOnPageChange(f,0,s.pageSize),this._navigated=!0):this.triggerOnChange(t[0],f):s.skip<s.total-s.pageSize?(this.base.triggerOnPageChange(f,s.total-s.pageSize,s.pageSize),this._navigated=!0):this.triggerOnChange(t[t.length-1],f);else if(u&&l===i.Keys.enter){const S=this.focusedIndex();S!==void 0&&this.handleItemSelect(S,f),this.base.togglePopup(f),e.preventDefault()}else m||b?(this.adaptiveState&&this.handleWrapperClick(e),this.base.togglePopup(f),e.preventDefault()):v&&(this.onNavigate(f,l),e.preventDefault());this.applyState(f)}},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,u=this.computedValue(),d=!(t.findIndex(g=>p.areSame(g,u,r))<0&&!this.$props.defaultItem);return!d&&e&&a.skip===0?s?s(t,e,o):t.indexOf(p.getFocusedItem(t,e,o)):!d&&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){var b;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,u;if(!o||!s.length)return;const l=a&&((b=a.querySelector(".k-list-item"))==null?void 0:b.offsetHeight)||0,d=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:l),m=e.target.scrollTop-t.skip*d;o&&(s=this.base.getGroupedDataModernMode(s,o),u=s[0][o]);for(let h=1;h<s.length&&!(d*h>m);h++)s[h]&&s[h][o]&&(u=s[h][o]);u!==this.group&&(r.data.group=u,this.applyState(r))}},render(){const{style:e,className:t,label:a,dir:r,virtual:o={skip:0},size:s,rounded:u,fillMode:l,dataItemKey:d,dataItems:g=[],disabled:m,tabIndex:b,loading:h,icon:v,svgIcon:f,iconClassName:S,adaptiveTitle:y,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,D=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=g.findIndex(c=>p.areSame(c,T,d)),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(c){return n.createVNode("select",{name:this.$props.name,id:D,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,c):c},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"},[y]),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 c=k.getTemplateDef.call(this,x,n.h),I=k.getTemplateDef.call(this,M,n.h),$=i.templateRendering.call(this,q,i.getListeners.call(this));return n.createVNode("div",{class:"k-list-container"},[c&&n.createVNode("div",{class:"k-list-header"},[c]),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&&g.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:$},null),R.call(this),I&&n.createVNode("div",{class:"k-list-footer"},[I])])])},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:c,defaultItem:I}=this.$props;return I!==void 0&&n.createVNode(fe.ListDefaultItem,{defaultItem:I,textField:c,selected:p.areSame(this.computedValue(),I,d),key:"defaultitemkey",onDefaultitemclick:this.handleDefaultItemClick},null)},R=function(){let c;const{textField:I,groupField:$}=this.$props;let w=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 $&&(w=this.base.getGroupedDataModernMode(w,$)),n.createVNode(ge.List,{id:this.base.listBoxId,show:C,dataItems:w.slice(),focusedIndex:this.focusedIndex(),value:this.computedValue(),textField:I,valueField:d,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(c=ae.call(this))?c:{default:()=>[c]})},K=function(){const c=this.$props.filter!==void 0?this.$props.filter:this.currentText;return this.$props.filterable&&n.createVNode(he.ListFilter,{value:c,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 c=i.templateRendering.call(this,this.$props.groupStickyHeaderItemRender,i.getListeners.call(this)),I=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&&g.length!==0&&n.createVNode(P.GroupStickyHeader,{group:this.group,render:c},null),I&&n.createVNode("div",{class:"k-list-header"},[I]),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(){var c;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[u]||u}`]:u,[`k-picker-${l}`]:l,"k-focus":U,"k-disabled":m,"k-invalid":!A,"k-loading":h,"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:(c=i.getTabIndex(b,m))!=null?c:0,accesskey:this.$props.accessKey,onKeydown:this.handleKeyDown,onKeypress:this.handleKeyPress,role:"combobox",onClick:m?i.noop:this.handleWrapperClick,"aria-disabled":m||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,h&&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:v||"chevron-down",svgIcon:f||j.chevronDownIcon,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?D?n.createVNode("label",{for:D,class:"k-floating-label"},[this.$props.label]):n.createVNode("span",{class:"k-label"},[this.$props.label]):null]):H}});exports.DropDownList=ke;
|