@progress/kendo-react-dropdowns 8.2.1-develop.5 → 8.3.0-develop.2

package/ComboBox/ComboBox.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const X=require("react"),f=require("prop-types"),B=require("../common/DropDownBase.js"),g=require("@progress/kendo-react-common"),Z=require("@progress/kendo-react-labels"),p=require("../common/utils.js"),ee=require("../common/SearchBar.js"),te=require("../common/ListContainer.js"),se=require("../common/List.js"),ie=require("../common/ListFilter.js"),K=require("../common/GroupStickyHeader.js"),ae=require("../package-metadata.js"),oe=require("../common/ClearButton.js"),R=require("@progress/kendo-react-buttons"),A=require("@progress/kendo-svg-icons"),C=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),P=require("@progress/kendo-react-layout"),M=require("../common/constants.js"),z=require("../common/withCustomComponent.js");function ne(D){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(D){for(const e in D)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(D,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>D[e]})}}return s.default=D,Object.freeze(s)}const c=ne(X),le="Please enter a valid value!",{sizeMap:w,roundedMap:re}=g.kendoThemeMaps,S=class S extends c.Component{constructor(s){super(s),this.state={},this.base=new B(this),this._element=null,this._suggested="",this._skipBlur=!1,this._input=null,this._adaptiveFilterInput=null,this.itemHeight=0,this.duplicates=[],this.hasDuplicates=!1,this.focus=()=>{this._input&&this._input.focus()},this.checkForDuplicatePlainTextRecords=()=>{const e=this.props.textField!==void 0,t=this.props.dataItemKey!==void 0;if(this.props.data&&this.props.data.length>0&&!e&&!t){const a=this.props.data;this.duplicates=p.getPlainDataDuplicates(a),this.hasDuplicates=this.duplicates.length>0}},this.handleItemSelect=(e,t)=>{const{virtual:a,dataItemKey:n}=this.props,l=p.getFilteredData(this.props),o=a?a.skip:0,r=l[e-o],d=this.hasDuplicates||!p.areSame(r,this.value,n);this.triggerOnChange(r,t),this.state.text!==void 0&&(t.data.text=void 0),d&&this.base.triggerPageChangeCornerItems(r,t)},this.onPopupOpened=()=>{setTimeout(()=>{this.mobileMode&&this._adaptiveFilterInput&&(this._skipBlur=!0,this._adaptiveFilterInput.focus(),this._skipBlur=!1)},300)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.toggleBtnClick=e=>{const{skipDisabledItems:t,textField:a}=this.props,n=p.getFilteredData(this.props),l=this.getFocusedIndex(),o=this.getCurrentValueDisabledStatus(a,n,l),r=this.props.opened!==void 0?this.props.opened:this.state.opened,d=this.base.initState();if(d.syntheticEvent=e,!t&&a&&o&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(d),!r&&this.mobileMode){const i=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(i,d)}this.applyState(d)},this.closeOpenedApplyStateNonMobileMode=(e,t)=>{t&&!this.mobileMode&&this.base.togglePopup(e)},this.renderMobileListFilter=()=>{const e=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text,t=p.getItemValue(this.value,this.props.textField),a=p.isPresent(e)?e:t;return c.createElement(ie,{value:a,ref:n=>this._adaptiveFilterInput=n&&n.element,onChange:this.handleMobileFilterChange,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode})},this.handleMobileFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,t.data.text=e.target.value,this.base.filterChanged(e.target.value,t),this.applyState(t)},this.onScroll=e=>{const{vs:t,list:a}=this.base;t.scrollHandler(e);const{groupField:n}=this.props;let l=p.getFilteredData(this.props);if(!n||!l.length)return;const o=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),d=e.target.scrollTop-t.skip*o;this.props.groupMode==="modern"&&(l=this.base.getGroupedDataModernMode(l,n));let i=l[0][n];for(let u=1;u<l.length&&!(o*u>d);u++)l[u]&&l[u][n]&&(i=l[u][n]);i!==this.state.group&&(this.setState({group:i}),this.props.onGroupScroll&&this.props.onGroupScroll.call(void 0,{group:i}))},this.handleItemClick=(e,t)=>{this.navigationIndex=e,this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleBlur=e=>{if(this.state.focused&&!this._skipBlur){const t=this.base.initState(),{textField:a}=this.props,n=p.getFilteredData(this.props),l=this.getFocusedIndex(),r=!(l===-1)&&this.getCurrentValueDisabledStatus(a,n,l);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,a&&r&&this.clearValueOnBlur(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},this.onInputClick=e=>{const t=this.props.opened!==void 0?this.props.opened:this.state.opened,a=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;if(!t&&this.mobileMode){const n=this.base.initState();n.syntheticEvent=e,this.base.togglePopup(n),this.base.filterChanged(a,n),this.applyState(n)}},this.onInputKeyDown=e=>{const{skipDisabledItems:t,textField:a,dataItemKey:n,groupField:l}=this.props,o=p.getFilteredData(this.props),r=this.value,d=Math.max(0,o.findIndex(m=>p.areSame(m,r,n))),i=e.keyCode,u=this.props.opened!==void 0?this.props.opened:this.state.opened,h=this.base.initState();if(h.syntheticEvent=e,!e.altKey&&(i===g.Keys.up||i===g.Keys.down)){if(e.preventDefault(),l!==""&&a)if(!this.props.skipDisabledItems&&u)this.onNavigate(h,i);else{let m=0;if(i===g.Keys.down||i===g.Keys.right){const v=o.slice(d+1<o.length?d+1:d).find(x=>!x.disabled&&x[a]);m=v&&o.findIndex(x=>x[a]===v[a])}else if(i===g.Keys.up||i===g.Keys.left){let v;if(d===0)v=o,m=o.findIndex(x=>!x.disabled&&x[a]);else{v=o.slice(0,d);let x=v.pop();for(;x&&x.disabled;)x=v.pop();m=x&&o.findIndex(E=>E[a]===x[a])}}if(m!==void 0){const v=m-d;this.onNavigate(h,i,v)}else m===void 0&&o.findIndex(v=>v[a]===r[a])===o.length-1&&this.onNavigate(h,i)}else if(!this.props.skipDisabledItems&&u)this.onNavigate(h,i);else{let m=null;if(i===g.Keys.down||i===g.Keys.right)m=o.slice(d+1).find(v=>!v.disabled);else if(i===g.Keys.up||i===g.Keys.left){const v=o.slice(0,d);for(m=v.pop();m&&m.disabled;)m=v.pop()}if(m){const v=m.id-d-1;this.onNavigate(h,i,v)}else this.onNavigate(h,i)}this.applyState(h)}const b=()=>{e.preventDefault(),this.base.togglePopup(h),this.applyState(h)},y=this.getFocusedIndex(),I=y===-1,k=!I&&this.getCurrentValueDisabledStatus(a,o,y);u?i===g.Keys.pageUp?(e.preventDefault(),this.base.scrollPopupByPageSize(-1)):i===g.Keys.pageDown?(e.preventDefault(),this.base.scrollPopupByPageSize(1)):e.altKey&&i===g.Keys.up?b():i===g.Keys.enter?(e.preventDefault(),(a&&!I&&e.currentTarget.value?o[y][a]:void 0)?!t&&a&&k?this.clearValueOnEnterOrEsc(e):k||this.applyValueOnEnter(e.currentTarget.value,h):this.applyValueOnEnter(e.currentTarget.value,h)):i===g.Keys.esc&&(!t&&a&&k&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,h)):!u&&i===g.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&i===g.Keys.down&&b()},this.inputOnChange=e=>{const t=this.base.initState();t.syntheticEvent=e;const a=this.props.opened!==void 0?this.props.opened:this.state.opened,n=e.currentTarget,l=n.value;if(this.props.suggest){const o=n.selectionEnd===l.length;let r=this.props.filter!==void 0?this.props.filter:this.state.text;p.isPresent(r)||(r=p.getItemValue(this.value,this.props.textField)||"");const d=r&&r===l,i=r&&r.length>l.length;d||i||!o?this._suggested="":this.suggestValue(l)}this.props.filter===void 0&&(t.data.text=l),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),a||this.base.togglePopup(t),this.base.filterChanged(l,t),this.applyState(t),this.setState({group:void 0})},this.clearButtonClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnEnterOrEsc=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnBlur=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnToggleBtnClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||le)},g.validatePackage(ae.packageMetadata)}get _inputId(){return this.props.id}get document(){if(g.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=M.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get value(){if(this._valueDuringOnChange!==void 0)return this._valueDuringOnChange;if(this.props.value!==void 0)return this.props.value;if(this.state.value!==void 0)return this.state.value;if(this.props.defaultValue!==void 0)return this.props.defaultValue}get index(){const{dataItemKey:s}=this.props,e=p.getFilteredData(this.props),t=this.value;return e.findIndex(a=>p.areSame(a,t,s))}get name(){return this.props.name}get validity(){const s=this.props.validationMessage!==void 0,e=!this.required||this.value!==null&&this.value!==""&&this.value!==void 0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:s,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:S.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:S.defaultProps.required}componentDidUpdate(s,e){var b;const{dataItemKey:t,virtual:a,groupField:n="",textField:l}=this.props,o=p.getFilteredData(this.props),r=s.virtual?s.virtual.total:0,d=this.props.opened!==void 0?this.props.opened:this.state.opened,i=s.opened!==void 0?s.opened:e.opened;s.data!==o&&this.checkForDuplicatePlainTextRecords();const u=!i&&d,h=this.value;if(this._valueOnDidUpdate=h,this.base.didUpdate(),a&&a.total!==r)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const y=s.value!==void 0?s.value:e.value;let I=this.hasDuplicates?this.navigationIndex||0:o.findIndex(m=>p.areSame(m,h,t));this.props.groupMode==="modern"&&l&&h&&(I=(b=this.base.getGroupedDataModernMode(o,n))==null?void 0:b.map(m=>m[l]).indexOf(h[l]));const k=!p.areSame(y,h,t);u&&a?this.base.scrollToVirtualItem(a,I):u&&!a?(this.onPopupOpened(),o&&o.length!==0&&this.base.resetGroupStickyHeader(o[0][n],this),this.base.scrollToItem(I)):(this.hasDuplicates||d&&i&&h&&k)&&this.base.scrollToItem(I)}u&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var s;this.observerResize=g.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords()}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=q.provideLocalizationService(this).toLanguageString(C.comboArrowBtnAriaLabelExpand,C.messages[C.comboArrowBtnAriaLabelExpand]),e=q.provideLocalizationService(this).toLanguageString(C.comboArrowBtnAriaLabelCollapse,C.messages[C.comboArrowBtnAriaLabelCollapse]),{dir:t,disabled:a,clearButton:n=S.defaultProps.clearButton,label:l,textField:o,adaptive:r,className:d,style:i,loading:u,iconClassName:h,virtual:b,size:y,rounded:I,fillMode:k,opened:m=this.state.opened,placeholder:v,svgIcon:x}=this.props,E=!this.validityStyles||this.validity.valid,T=this.props.filter!==void 0?this.props.filter:this.state.text,W=p.getItemValue(this.value,o),V=p.isPresent(T)?T:W,$=n&&(!!V||p.isPresent(this.value)),F=this.base.vs,_=this.props.id||this._inputId,N=this.mobileMode;F.enabled=b!==void 0,b!==void 0&&(F.skip=b.skip,F.total=b.total,F.pageSize=b.pageSize);const[j,G]=z(this.props.prefix||c.Fragment),[Y,J]=z(this.props.suffix||c.Fragment),L=c.createElement(c.Fragment,null,c.createElement("span",{className:g.classNames("k-combobox k-input",{[`k-input-${w[y]||y}`]:y,[`k-rounded-${re[I]||I}`]:I,[`k-input-${k}`]:k,"k-invalid":!E,"k-loading":u,"k-required":this.required,"k-disabled":a},d),ref:this.componentRef,style:l?{...i,width:void 0}:i,dir:t},this.props.prefix&&c.createElement(j,{...G}),this.renderSearchBar(V||"",_,v),$&&!u&&c.createElement(oe,{onClick:this.clearButtonClick,key:"clearbutton"}),u&&c.createElement(g.IconWrap,{className:"k-input-loading-icon",name:"loading",key:"loading"}),this.props.suffix&&c.createElement(Y,{...J}),c.createElement(R.Button,{tabIndex:-1,type:"button","aria-label":m?e:s,icon:h?void 0:"caret-alt-down",svgIcon:x||A.caretAltDownIcon,iconClass:h,size:y,fillMode:k,rounded:null,themeColor:"base",className:"k-input-button",onClick:this.toggleBtnClick,onMouseDown:Q=>Q.preventDefault()}),!N&&this.renderListContainer()),N&&this.renderAdaptiveListContainer());return l?c.createElement(Z.FloatingLabel,{label:l,editorId:_,editorValue:V,editorValid:E,editorDisabled:a,style:{width:i?i.width:void 0},children:L}):L}onNavigate(s,e,t){const{virtual:a={skip:0}}=this.props,n=p.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;let o=-1,r;const d=this.base.vs,i=this.value;this._suggested="";const u=this.hasDuplicates&&this.duplicates.indexOf(i)!==-1;if(o=this.getFocusedIndex(u),o!==-1&&!p.isPresent(i))this.handleItemSelect(o,s);else if(l==="")this.handleItemSelect(0,s);else{const h=a.skip+o;r=this.base.navigation.navigate({keyCode:e,current:h,max:(d.enabled?d.total:n.length)-1,min:0,skipItems:t||void 0}),r!==void 0&&this.handleItemSelect(r,s)}this.navigationIndex=r}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:a}=this.props,n=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,r=p.getItemValue(this.value,t)===s?this.index:p.getItemIndexByText(n,s,t),d=r!==-1;let i;if(this._suggested="",d)i=n[r];else if(a)i=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(i,e),l&&this.base.togglePopup(e),this.props.filter===void 0&&this.state.text!==void 0&&(e.data.text=void 0),this.applyState(e)}applyValueOnRejectSuggestions(s,e){const{textField:t,allowCustom:a}=this.props,n=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,o=p.getItemValue(this.value,t);if(this._suggested="",s===o||s===""&&!p.isPresent(o))return this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e);const r=p.getItemIndexByText(n,s,t,!0),d=r!==-1;let i=null;d?i=n[r]:a&&(i=s?t?{[t]:s}:s:null),this.triggerOnChange(i,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e)}selectFocusedItem(s,e){const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:a,virtual:n={skip:0},focusedItemIndex:l=p.itemIndexStartsWith}=this.props,o=p.getFilteredData(this.props),r=n.skip,d=s===""&&r===0?0:l(o,s,a);return d!==-1?this.handleItemSelect(d+r,e):(this.triggerOnChange(null,e),this.state.text!==void 0&&(e.data.text=void 0)),t&&this.base.togglePopup(e),this.applyState(e)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{header:e,footer:t,size:a,groupField:n,groupMode:l,list:o,virtual:r,adaptiveTitle:d,groupStickyHeaderItemRender:i}=this.props,u=p.getFilteredData(this.props),h=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.base.getAdaptiveAnimation();let{group:y}=this.state;y===void 0&&n!==void 0&&(y=p.getItemValue(u[0],n));const I={navigatable:!1,navigatableElements:[],expand:h,animation:b,onClose:k=>this.toggleBtnClick(k),animationStyles:s<=M.MOBILE_SMALL_DEVISE?{top:0,width:"100%",height:"100%"}:void 0,className:s<=M.MOBILE_SMALL_DEVISE?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom k-actionsheet"};return c.createElement(P.ActionSheet,{...I},c.createElement(P.ActionSheetHeader,null,c.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},c.createElement("div",{className:"k-actionsheet-title"},c.createElement("div",{className:"k-text-center"},d),c.createElement("div",{className:"k-actionsheet-subtitle k-text-center"})),c.createElement("div",{className:"k-actionsheet-actions"},c.createElement(R.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",themeColor:"base",size:"large",onClick:this.toggleBtnClick,icon:"x",svgIcon:A.xIcon}))),c.createElement("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter"},this.renderMobileListFilter())),c.createElement(P.ActionSheetContent,{className:"!k-overflow-hidden"},c.createElement("div",{className:"k-list-container"},c.createElement("div",{className:g.classNames({"k-list":!o,"k-list-lg":!0,"k-virtual-list":r,"k-data-table":o,[`k-table-${w[a]||a}`]:o&&a})},e&&c.createElement("div",{className:"k-table-header"},e),!o&&y&&u.length!==0&&c.createElement(K,{group:y,groupMode:l,render:i}),this.renderList(),t&&c.createElement("div",{className:"k-list-footer"},t)))))}renderListContainer(){const s=this.base,{dir:e,header:t,footer:a,groupField:n,groupMode:l,size:o,list:r,virtual:d,groupStickyHeaderItemRender:i}=this.props,u=p.getFilteredData(this.props),h=this.props.opened!==void 0?this.props.opened:this.state.opened,b=s.getPopupSettings(),y=b.width!==void 0?b.width:s.popupWidth;let{group:I}=this.state;return I===void 0&&n!==void 0&&(I=p.getItemValue(u[0],n)),c.createElement(te,{width:y,popupSettings:{...b,anchor:b.anchor||this.element,show:h,popupClass:g.classNames(b.popupClass,"k-list-container","k-combobox-popup")},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[u.length]},c.createElement("div",{className:g.classNames({"k-list":!r,[`k-list-${w[o]||o}`]:!r&&o,"k-virtual-list":d,"k-data-table":r,[`k-table-${w[o]||o}`]:r&&o})},t&&c.createElement("div",{className:"k-table-header"},t),!r&&I&&u.length!==0&&c.createElement(K,{group:I,groupMode:l,render:i}),this.renderList(),a&&c.createElement("div",{className:g.classNames({"k-list-footer":!this.props.footerClassName},this.props.footerClassName)},a)))}renderList(){const s=this.base,{textField:e,dataItemKey:t,listNoDataRender:a,itemRender:n,groupHeaderItemRender:l,virtual:o={skip:0,total:void 0}}=this.props,r=p.getFilteredData(this.props),d=s.getPopupSettings(),i=s.vs,u=o.skip,h=this.props.opened!==void 0?this.props.opened:this.state.opened,b=`translateY(${i.translate}px)`,y=h?this.getFocusedIndex(this.hasDuplicates):void 0,I=this.props.filter!==void 0?this.props.filter:this.state.text,k=p.getItemValue(this.value,e),m=p.isPresent(I)&&I!==k?null:this.value,v=this.props.list||se;return c.createElement(v,{id:s.listBoxId,virtual:!!o,show:h,data:r,focusedIndex:y,value:m,textField:e,valueField:t,groupField:this.props.groupField,groupMode:this.props.groupMode,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:x=>{i.list=this.base.list=x,this.itemHeight=0},wrapperStyle:this.state.windowWidth&&this.state.windowWidth>M.MOBILE_MEDIUM_DEVISE?{maxHeight:d.height}:{},wrapperCssClass:g.classNames("k-list-content",{"k-list-scroller":!o}),listStyle:i.enabled?{transform:b}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:n,groupHeaderItemRender:l,noDataRender:a,onMouseDown:x=>x.preventDefault(),onScroll:this.onScroll,wrapperRef:i.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:o.total})}renderSearchBar(s,e,t){const{tabIndex:a,disabled:n,dataItemKey:l,virtual:o={skip:0}}=this.props,r=p.getFilteredData(this.props),d=this.props.opened!==void 0?this.props.opened:this.state.opened,i=this.value,u=Math.max(0,r.findIndex(h=>p.areSame(h,i,l)));return this._suggested&&!p.areSame(this._valueOnDidUpdate,i,l)&&(this._suggested=""),c.createElement(ee,{id:e,readOnly:d&&this.mobileMode,placeholder:t,tabIndex:a,title:this.props.title,accessKey:this.props.accessKey,value:s+this._suggested,suggestedText:this._suggested,ref:h=>this._input=h&&h.input,onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:n,expanded:d,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${u+o.skip}`,role:"combobox",ariaLabelledBy:this.props.ariaLabelledBy,ariaLabel:this.props.ariaLabel,ariaDescribedBy:this.props.ariaDescribedBy,ariaRequired:this.required,render:this.props.valueRender})}clearValue(){const s=this.base.initState();this._suggested="",this.navigationIndex=void 0,this.base.filterChanged("",s),this.props.filter===void 0&&this.state.text!==void 0&&(s.data.text=void 0),this.triggerOnChange(null,s);const e=this.props.opened!==void 0?this.props.opened:this.state.opened,t=this.mobileMode;e&&!t&&this.base.togglePopup(s),this.applyState(s)}triggerOnChange(s,e){const t=this.value;!this.hasDuplicates&&(!p.isPresent(t)&&!p.isPresent(s)||p.areSame(t,s,this.props.dataItemKey))||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}getFocusedIndex(s){const e=this.value,{textField:t,dataItemKey:a,virtual:n={skip:0},focusedItemIndex:l=p.itemIndexStartsWith,skipDisabledItems:o}=this.props,r=p.getFilteredData(this.props),d=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:p.isPresent(e)&&d===void 0?r.findIndex(i=>p.areSame(i,e,a)):d?l(r,d,t):o&&t&&!d&&n.skip===0?r.findIndex(i=>!i.disabled&&i[t]):n.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=p.suggestValue(s,e,t)}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}};S.displayName="ComboBox",S.propTypes={...B.propTypes,size:f.oneOf([null,"small","medium","large"]),rounded:f.oneOf([null,"small","medium","large","full"]),fillMode:f.oneOf([null,"solid","flat","outline"]),dataItemKey:f.string,groupField:f.string,groupMode:f.oneOf([void 0,"classic","modern"]),isMultiColumn:f.bool,suggest:f.bool,placeholder:f.string,title:f.string,allowCustom:f.bool,clearButton:f.bool,iconClassName:f.string,svgIcon:g.svgIconPropType,validationMessage:f.string,required:f.bool,id:f.string,ariaLabelledBy:f.string,ariaLabel:f.string,ariaDescribedBy:f.string,list:f.any,valueRender:f.func,skipDisabledItems:f.bool},S.defaultProps={...B.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",allowCustom:!1,clearButton:!0,required:!1,groupMode:"modern",isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let O=S;const H=g.createPropsContext(),U=g.withIdHOC(g.withPropsContext(H,O));U.displayName="KendoReactComboBox";exports.ComboBox=U;exports.ComboBoxPropsContext=H;exports.ComboBoxWithoutContext=O;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const X=require("react"),x=require("prop-types"),B=require("../common/DropDownBase.js"),g=require("@progress/kendo-react-common"),Z=require("@progress/kendo-react-labels"),p=require("../common/utils.js"),ee=require("../common/SearchBar.js"),te=require("../common/ListContainer.js"),se=require("../common/List.js"),ie=require("../common/ListFilter.js"),K=require("../common/GroupStickyHeader.js"),ae=require("../package-metadata.js"),oe=require("../common/ClearButton.js"),R=require("@progress/kendo-react-buttons"),A=require("@progress/kendo-svg-icons"),C=require("../messages/index.js"),q=require("@progress/kendo-react-intl"),P=require("@progress/kendo-react-layout"),M=require("../common/constants.js"),z=require("../common/withCustomComponent.js");function ne(D){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(D){for(const e in D)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(D,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>D[e]})}}return s.default=D,Object.freeze(s)}const h=ne(X),le="Please enter a valid value!",{sizeMap:w,roundedMap:re}=g.kendoThemeMaps,S=class S extends h.Component{constructor(s){super(s),this.state={},this.base=new B(this),this._element=null,this._suggested="",this._skipBlur=!1,this._input=null,this._adaptiveFilterInput=null,this.itemHeight=0,this.duplicates=[],this.hasDuplicates=!1,this.focus=()=>{this._input&&this._input.focus()},this.checkForDuplicatePlainTextRecords=()=>{const e=this.props.textField!==void 0,t=this.props.dataItemKey!==void 0;if(this.props.data&&this.props.data.length>0&&!e&&!t){const a=this.props.data;this.duplicates=p.getPlainDataDuplicates(a),this.hasDuplicates=this.duplicates.length>0}},this.handleItemSelect=(e,t)=>{const{virtual:a,dataItemKey:n}=this.props,l=p.getFilteredData(this.props),o=a?a.skip:0,r=l[e-o],d=this.hasDuplicates||!p.areSame(r,this.value,n);this.triggerOnChange(r,t),this.state.text!==void 0&&(t.data.text=void 0),d&&this.base.triggerPageChangeCornerItems(r,t)},this.onPopupOpened=()=>{setTimeout(()=>{this.mobileMode&&this._adaptiveFilterInput&&(this._skipBlur=!0,this._adaptiveFilterInput.focus(),this._skipBlur=!1)},300)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.toggleBtnClick=e=>{const{skipDisabledItems:t,textField:a}=this.props,n=p.getFilteredData(this.props),l=this.getFocusedIndex(),o=this.getCurrentValueDisabledStatus(a,n,l),r=this.props.opened!==void 0?this.props.opened:this.state.opened,d=this.base.initState();if(d.syntheticEvent=e,!t&&a&&o&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(d),!r&&this.mobileMode){const i=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(i,d)}this.applyState(d)},this.closeOpenedApplyStateNonMobileMode=(e,t)=>{t&&!this.mobileMode&&this.base.togglePopup(e)},this.renderMobileListFilter=()=>{const e=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text,t=p.getItemValue(this.value,this.props.textField),a=p.isPresent(e)?e:t;return h.createElement(ie,{value:a,ref:n=>this._adaptiveFilterInput=n&&n.element,onChange:this.handleMobileFilterChange,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode})},this.handleMobileFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,t.data.text=e.target.value,this.base.filterChanged(e.target.value,t),this.applyState(t)},this.onScroll=e=>{const{vs:t,list:a}=this.base;t.scrollHandler(e);const{groupField:n}=this.props;let l=p.getFilteredData(this.props);if(!n||!l.length)return;const o=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),d=e.target.scrollTop-t.skip*o;this.props.groupMode==="modern"&&(l=this.base.getGroupedDataModernMode(l,n));let i=l[0][n];for(let u=1;u<l.length&&!(o*u>d);u++)l[u]&&l[u][n]&&(i=l[u][n]);i!==this.state.group&&(this.setState({group:i}),this.props.onGroupScroll&&this.props.onGroupScroll.call(void 0,{group:i}))},this.handleItemClick=(e,t)=>{this.navigationIndex=e,this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleBlur=e=>{if(this.state.focused&&!this._skipBlur){const t=this.base.initState(),{textField:a}=this.props,n=p.getFilteredData(this.props),l=this.getFocusedIndex(),r=!(l===-1)&&this.getCurrentValueDisabledStatus(a,n,l);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,a&&r&&this.clearValueOnBlur(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},this.onInputClick=e=>{const t=this.props.opened!==void 0?this.props.opened:this.state.opened,a=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;if(!t&&this.mobileMode){const n=this.base.initState();n.syntheticEvent=e,this.base.togglePopup(n),this.base.filterChanged(a,n),this.applyState(n)}},this.onInputKeyDown=e=>{const{skipDisabledItems:t,textField:a,dataItemKey:n,groupField:l}=this.props,o=p.getFilteredData(this.props),r=this.value,d=Math.max(0,o.findIndex(m=>p.areSame(m,r,n))),i=e.keyCode,u=this.props.opened!==void 0?this.props.opened:this.state.opened,c=this.base.initState();if(c.syntheticEvent=e,!e.altKey&&(i===g.Keys.up||i===g.Keys.down)){if(e.preventDefault(),l!==""&&a)if(!this.props.skipDisabledItems&&u)this.onNavigate(c,i);else{let m=0;if(i===g.Keys.down||i===g.Keys.right){const I=o.slice(d+1<o.length?d+1:d).find(y=>!y.disabled&&y[a]);m=I&&o.findIndex(y=>y[a]===I[a])}else if(i===g.Keys.up||i===g.Keys.left){let I;if(d===0)I=o,m=o.findIndex(y=>!y.disabled&&y[a]);else{I=o.slice(0,d);let y=I.pop();for(;y&&y.disabled;)y=I.pop();m=y&&o.findIndex(E=>E[a]===y[a])}}if(m!==void 0){const I=m-d;this.onNavigate(c,i,I)}else m===void 0&&o.findIndex(I=>I[a]===r[a])===o.length-1&&this.onNavigate(c,i)}else if(!this.props.skipDisabledItems&&u)this.onNavigate(c,i);else{let m=null;if(i===g.Keys.down||i===g.Keys.right)m=o.slice(d+1).find(I=>!I.disabled);else if(i===g.Keys.up||i===g.Keys.left){const I=o.slice(0,d);for(m=I.pop();m&&m.disabled;)m=I.pop()}if(m){const I=m.id-d-1;this.onNavigate(c,i,I)}else this.onNavigate(c,i)}this.applyState(c)}const v=()=>{e.preventDefault(),this.base.togglePopup(c),this.applyState(c)},b=this.getFocusedIndex(),f=b===-1,k=!f&&this.getCurrentValueDisabledStatus(a,o,b);u?i===g.Keys.pageUp?(e.preventDefault(),this.base.scrollPopupByPageSize(-1)):i===g.Keys.pageDown?(e.preventDefault(),this.base.scrollPopupByPageSize(1)):e.altKey&&i===g.Keys.up?v():i===g.Keys.enter?(e.preventDefault(),(a&&!f&&e.currentTarget.value?o[b][a]:void 0)?!t&&a&&k?this.clearValueOnEnterOrEsc(e):k||this.applyValueOnEnter(e.currentTarget.value,c):this.applyValueOnEnter(e.currentTarget.value,c)):i===g.Keys.esc&&(!t&&a&&k&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,c)):!u&&i===g.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&i===g.Keys.down&&v()},this.inputOnChange=e=>{const t=this.base.initState();t.syntheticEvent=e;const a=this.props.opened!==void 0?this.props.opened:this.state.opened,n=e.currentTarget,l=n.value;if(this.props.suggest){const o=n.selectionEnd===l.length;let r=this.props.filter!==void 0?this.props.filter:this.state.text;p.isPresent(r)||(r=p.getItemValue(this.value,this.props.textField)||"");const d=r&&r===l,i=r&&r.length>l.length;d||i||!o?this._suggested="":this.suggestValue(l)}this.props.filter===void 0&&(t.data.text=l),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),a||this.base.togglePopup(t),this.base.filterChanged(l,t),this.applyState(t),this.setState({group:void 0})},this.clearButtonClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnEnterOrEsc=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnBlur=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnToggleBtnClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||le)},g.validatePackage(ae.packageMetadata)}get _inputId(){return this.props.id}get document(){if(g.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=M.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get value(){if(this._valueDuringOnChange!==void 0)return this._valueDuringOnChange;if(this.props.value!==void 0)return this.props.value;if(this.state.value!==void 0)return this.state.value;if(this.props.defaultValue!==void 0)return this.props.defaultValue}get index(){const{dataItemKey:s}=this.props,e=p.getFilteredData(this.props),t=this.value;return e.findIndex(a=>p.areSame(a,t,s))}get name(){return this.props.name}get validity(){const s=this.props.validationMessage!==void 0,e=!this.required||this.value!==null&&this.value!==""&&this.value!==void 0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:s,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:S.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:S.defaultProps.required}componentDidUpdate(s,e){var v;const{dataItemKey:t,virtual:a,groupField:n="",textField:l}=this.props,o=p.getFilteredData(this.props),r=s.virtual?s.virtual.total:0,d=this.props.opened!==void 0?this.props.opened:this.state.opened,i=s.opened!==void 0?s.opened:e.opened;s.data!==o&&this.checkForDuplicatePlainTextRecords();const u=!i&&d,c=this.value;if(this._valueOnDidUpdate=c,this.base.didUpdate(),a&&a.total!==r)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const b=s.value!==void 0?s.value:e.value;let f=this.hasDuplicates?this.navigationIndex||0:o.findIndex(m=>p.areSame(m,c,t));this.props.groupMode==="modern"&&l&&c&&(f=(v=this.base.getGroupedDataModernMode(o,n))==null?void 0:v.map(m=>m[l]).indexOf(c[l]));const k=!p.areSame(b,c,t);u&&a?this.base.scrollToVirtualItem(a,f):u&&!a?(this.onPopupOpened(),o&&o.length!==0&&this.base.resetGroupStickyHeader(o[0][n],this),this.base.scrollToItem(f)):(this.hasDuplicates||d&&i&&c&&k)&&this.base.scrollToItem(f)}u&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var s;this.observerResize=g.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords()}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=q.provideLocalizationService(this).toLanguageString(C.comboArrowBtnAriaLabelExpand,C.messages[C.comboArrowBtnAriaLabelExpand]),e=q.provideLocalizationService(this).toLanguageString(C.comboArrowBtnAriaLabelCollapse,C.messages[C.comboArrowBtnAriaLabelCollapse]),{dir:t,disabled:a,clearButton:n=S.defaultProps.clearButton,label:l,textField:o,adaptive:r,className:d,style:i,loading:u,iconClassName:c,virtual:v,size:b,rounded:f,fillMode:k,opened:m=this.state.opened,placeholder:I,svgIcon:y}=this.props,E=!this.validityStyles||this.validity.valid,T=this.props.filter!==void 0?this.props.filter:this.state.text,W=p.getItemValue(this.value,o),V=p.isPresent(T)?T:W,$=n&&(!!V||p.isPresent(this.value)),F=this.base.vs,_=this.props.id||this._inputId,N=this.mobileMode;F.enabled=v!==void 0,v!==void 0&&(F.skip=v.skip,F.total=v.total,F.pageSize=v.pageSize);const[j,G]=z(this.props.prefix||h.Fragment),[Y,J]=z(this.props.suffix||h.Fragment),L=h.createElement(h.Fragment,null,h.createElement("span",{className:g.classNames("k-combobox k-input",{[`k-input-${w[b]||b}`]:b,[`k-rounded-${re[f]||f}`]:f,[`k-input-${k}`]:k,"k-invalid":!E,"k-loading":u,"k-required":this.required,"k-disabled":a},d),ref:this.componentRef,style:l?{...i,width:void 0}:i,dir:t},this.props.prefix&&h.createElement(j,{...G}),this.renderSearchBar(V||"",_,I),$&&!u&&h.createElement(oe,{onClick:this.clearButtonClick,key:"clearbutton"}),u&&h.createElement(g.IconWrap,{className:"k-input-loading-icon",name:"loading",key:"loading"}),this.props.suffix&&h.createElement(Y,{...J}),h.createElement(R.Button,{tabIndex:-1,type:"button","aria-label":m?e:s,icon:c?void 0:"caret-alt-down",svgIcon:y||A.caretAltDownIcon,iconClass:c,size:b,fillMode:k,rounded:null,themeColor:"base",className:"k-input-button",onClick:this.toggleBtnClick,onMouseDown:Q=>Q.preventDefault()}),!N&&this.renderListContainer()),N&&this.renderAdaptiveListContainer());return l?h.createElement(Z.FloatingLabel,{label:l,editorId:_,editorValue:V,editorValid:E,editorDisabled:a,style:{width:i?i.width:void 0},children:L}):L}onNavigate(s,e,t){const{virtual:a={skip:0}}=this.props,n=p.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;let o=-1,r;const d=this.base.vs,i=this.value;this._suggested="";const u=this.hasDuplicates&&this.duplicates.indexOf(i)!==-1;if(o=this.getFocusedIndex(u),o!==-1&&!p.isPresent(i))this.handleItemSelect(o,s);else if(l==="")this.handleItemSelect(0,s);else{const c=a.skip+o;r=this.base.navigation.navigate({keyCode:e,current:c,max:(d.enabled?d.total:n.length)-1,min:0,skipItems:t||void 0}),r!==void 0&&this.handleItemSelect(r,s)}this.navigationIndex=r}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:a}=this.props,n=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,r=p.getItemValue(this.value,t)===s?this.index:p.getItemIndexByText(n,s,t),d=r!==-1;let i;if(this._suggested="",d)i=n[r];else if(a)i=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(i,e),l&&this.base.togglePopup(e),this.props.filter===void 0&&this.state.text!==void 0&&(e.data.text=void 0),this.applyState(e)}applyValueOnRejectSuggestions(s,e){const{textField:t,allowCustom:a}=this.props,n=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,o=p.getItemValue(this.value,t);if(this._suggested="",s===o||s===""&&!p.isPresent(o))return this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e);const r=p.getItemIndexByText(n,s,t,!0),d=r!==-1;let i=null;d?i=n[r]:a&&(i=s?t?{[t]:s}:s:null),this.triggerOnChange(i,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e)}selectFocusedItem(s,e){const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:a,virtual:n={skip:0},focusedItemIndex:l=p.itemIndexStartsWith}=this.props,o=p.getFilteredData(this.props),r=n.skip,d=s===""&&r===0?0:l(o,s,a);return d!==-1?this.handleItemSelect(d+r,e):(this.triggerOnChange(null,e),this.state.text!==void 0&&(e.data.text=void 0)),t&&this.base.togglePopup(e),this.applyState(e)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{header:e,footer:t,size:a,groupField:n,groupMode:l,list:o,virtual:r,adaptiveTitle:d,groupStickyHeaderItemRender:i}=this.props,u=p.getFilteredData(this.props),c=this.props.opened!==void 0?this.props.opened:this.state.opened,v=this.base.getAdaptiveAnimation();let{group:b}=this.state;b===void 0&&n!==void 0&&(b=p.getItemValue(u[0],n));const f={navigatable:!1,navigatableElements:[],expand:c,animation:v,onClose:k=>this.toggleBtnClick(k),animationStyles:s<=M.MOBILE_SMALL_DEVISE?{top:0,width:"100%",height:"100%"}:void 0,className:s<=M.MOBILE_SMALL_DEVISE?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom k-actionsheet"};return h.createElement(P.ActionSheet,{...f},h.createElement(P.ActionSheetHeader,null,h.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},h.createElement("div",{className:"k-actionsheet-title"},h.createElement("div",{className:"k-text-center"},d),h.createElement("div",{className:"k-actionsheet-subtitle k-text-center"})),h.createElement("div",{className:"k-actionsheet-actions"},h.createElement(R.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",themeColor:"base",size:"large",onClick:this.toggleBtnClick,icon:"x",svgIcon:A.xIcon}))),h.createElement("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter"},this.renderMobileListFilter())),h.createElement(P.ActionSheetContent,{className:"!k-overflow-hidden"},h.createElement("div",{className:"k-list-container"},h.createElement("div",{className:g.classNames({"k-list":!o,"k-list-lg":!0,"k-virtual-list":r,"k-data-table":o,[`k-table-${w[a]||a}`]:o&&a})},e&&h.createElement("div",{className:"k-table-header"},e),!o&&b&&u.length!==0&&h.createElement(K,{group:b,groupMode:l,render:i}),this.renderList(),t&&h.createElement("div",{className:"k-list-footer"},t)))))}renderListContainer(){const s=this.base,{dir:e,header:t,footer:a,groupField:n,groupMode:l,size:o,list:r,virtual:d,groupStickyHeaderItemRender:i}=this.props,u=p.getFilteredData(this.props),c=this.props.opened!==void 0?this.props.opened:this.state.opened,v=s.getPopupSettings(),b=v.width!==void 0?v.width:s.popupWidth;let{group:f}=this.state;return f===void 0&&n!==void 0&&(f=p.getItemValue(u[0],n)),h.createElement(te,{width:b,popupSettings:{...v,anchor:v.anchor||this.element,show:c,popupClass:g.classNames(v.popupClass,"k-list-container","k-combobox-popup")},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[u.length]},h.createElement("div",{className:g.classNames({"k-list":!r,[`k-list-${w[o]||o}`]:!r&&o,"k-virtual-list":d,"k-data-table":r,[`k-table-${w[o]||o}`]:r&&o})},t&&h.createElement("div",{className:"k-table-header"},t),!r&&f&&u.length!==0&&h.createElement(K,{group:f,groupMode:l,render:i}),this.renderList(),a&&h.createElement("div",{className:g.classNames({"k-list-footer":!this.props.footerClassName},this.props.footerClassName)},a)))}renderList(){const s=this.base,{textField:e,dataItemKey:t,listNoDataRender:a,itemRender:n,groupHeaderItemRender:l,virtual:o={skip:0,total:void 0}}=this.props,r=p.getFilteredData(this.props),d=s.getPopupSettings(),i=s.vs,u=o.skip,c=this.props.opened!==void 0?this.props.opened:this.state.opened,v=`translateY(${i.translate}px)`,b=c?this.getFocusedIndex(this.hasDuplicates):void 0,f=this.props.filter!==void 0?this.props.filter:this.state.text,k=p.getItemValue(this.value,e),m=p.isPresent(f)&&f!==k?null:this.value,I=this.props.list||se;return h.createElement(I,{id:s.listBoxId,virtual:!!o,show:c,data:r,focusedIndex:b,value:m,textField:e,valueField:t,groupField:this.props.groupField,groupMode:this.props.groupMode,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:y=>{i.list=this.base.list=y,this.itemHeight=0},wrapperStyle:this.state.windowWidth&&this.state.windowWidth>M.MOBILE_MEDIUM_DEVISE?{maxHeight:d.height}:{},wrapperCssClass:g.classNames("k-list-content",{"k-list-scroller":!o}),listStyle:i.enabled?{transform:v}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:n,groupHeaderItemRender:l,noDataRender:a,onMouseDown:y=>y.preventDefault(),onScroll:this.onScroll,wrapperRef:i.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:o.total})}renderSearchBar(s,e,t){const{tabIndex:a,disabled:n,title:l,ariaLabelledBy:o,ariaDescribedBy:r,dataItemKey:d,virtual:i={skip:0},accessKey:u}=this.props,c=p.getFilteredData(this.props),v=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.value,f=Math.max(0,c.findIndex(m=>p.areSame(m,b,d)));this._suggested&&!p.areSame(this._valueOnDidUpdate,b,d)&&(this._suggested="");const k={accessKey:u};return h.createElement(ee,{id:e,readOnly:v&&this.mobileMode,placeholder:t,tabIndex:a,title:l,value:s+this._suggested,suggestedText:this._suggested,ref:m=>this._input=m&&m.input,onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:n,expanded:v,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${f+i.skip}`,role:"combobox",ariaLabelledBy:o,ariaLabel:this.props.ariaLabel,ariaDescribedBy:r,ariaRequired:this.required,render:this.props.valueRender,ariaControls:this.base.listBoxId,...k})}clearValue(){const s=this.base.initState();this._suggested="",this.navigationIndex=void 0,this.base.filterChanged("",s),this.props.filter===void 0&&this.state.text!==void 0&&(s.data.text=void 0),this.triggerOnChange(null,s);const e=this.props.opened!==void 0?this.props.opened:this.state.opened,t=this.mobileMode;e&&!t&&this.base.togglePopup(s),this.applyState(s)}triggerOnChange(s,e){const t=this.value;!this.hasDuplicates&&(!p.isPresent(t)&&!p.isPresent(s)||p.areSame(t,s,this.props.dataItemKey))||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}getFocusedIndex(s){const e=this.value,{textField:t,dataItemKey:a,virtual:n={skip:0},focusedItemIndex:l=p.itemIndexStartsWith,skipDisabledItems:o}=this.props,r=p.getFilteredData(this.props),d=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:p.isPresent(e)&&d===void 0?r.findIndex(i=>p.areSame(i,e,a)):d?l(r,d,t):o&&t&&!d&&n.skip===0?r.findIndex(i=>!i.disabled&&i[t]):n.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=p.suggestValue(s,e,t)}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}};S.displayName="ComboBox",S.propTypes={...B.propTypes,size:x.oneOf([null,"small","medium","large"]),rounded:x.oneOf([null,"small","medium","large","full"]),fillMode:x.oneOf([null,"solid","flat","outline"]),dataItemKey:x.string,groupField:x.string,groupMode:x.oneOf([void 0,"classic","modern"]),isMultiColumn:x.bool,suggest:x.bool,placeholder:x.string,title:x.string,allowCustom:x.bool,clearButton:x.bool,iconClassName:x.string,svgIcon:g.svgIconPropType,validationMessage:x.string,required:x.bool,id:x.string,ariaLabelledBy:x.string,ariaLabel:x.string,ariaDescribedBy:x.string,list:x.any,valueRender:x.func,skipDisabledItems:x.bool},S.defaultProps={...B.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",allowCustom:!1,clearButton:!0,required:!1,groupMode:"modern",isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let O=S;const H=g.createPropsContext(),U=g.withIdHOC(g.withPropsContext(H,O));U.displayName="KendoReactComboBox";exports.ComboBox=U;exports.ComboBoxPropsContext=H;exports.ComboBoxWithoutContext=O;