@progress/kendo-react-dropdowns 8.4.0-develop.2 → 8.4.0-develop.4

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