@progress/kendo-react-dropdowns 9.1.1-develop.4 → 9.2.0-develop.1

package/AutoComplete/AutoComplete.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 B=require("react"),f=require("prop-types"),q=require("../common/SearchBar.js"),E=require("../common/ListContainer.js"),T=require("../common/List.js"),k=require("../common/DropDownBase.js"),N=require("../common/GroupStickyHeader.js"),g=require("../common/utils.js"),p=require("@progress/kendo-react-common"),L=require("@progress/kendo-react-labels"),R=require("../package-metadata.js"),H=require("../common/ClearButton.js"),F=require("../common/withCustomComponent.js");function z(x){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(x){for(const e in x)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(x,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>x[e]})}}return a.default=x,Object.freeze(a)}const I=z(B),A="Please enter a valid value!",{sizeMap:_,roundedMap:G}=p.kendoThemeMaps,b=class b extends I.Component{constructor(a){super(a),this.state={},this.base=new k(this),this._element=null,this._suggested="",this._input=null,this._isScrolling=!1,this.itemHeight=0,this.focus=()=>{this._input&&this._input.focus()},this.handleItemSelect=(e,s)=>{const i=g.getFilteredData(this.props),t=g.getItemValue(i[e],this.props.textField);this.triggerOnChange(t,s)},this.itemFocus=(e,s)=>{const{textField:i}=this.props,o=g.getFilteredData(this.props)[e];g.areSame(this.state.focusedItem,o,i)||(s.data.focusedItem=o)},this.togglePopup=e=>{this.base.togglePopup(e)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||A)},this.onScroll=e=>{this._isScrolling=!0;const{list:s}=this.base,{groupField:i}=this.props;let t=g.getFilteredData(this.props);if(!i||!t.length)return;const o=this.itemHeight||(s?s.children[0].offsetHeight:0),l=e.target.scrollTop;i&&(t=this.base.getGroupedDataModernMode(t,i));let n=t[0][i];for(let d=1;d<t.length&&!(o*d>l);d++)t[d]&&t[d][i]&&(n=t[d][i]);n!==this.state.group&&this.setState({group:n})},this.handleItemClick=(e,s)=>{this.base.handleItemClick(e,s),this._valueDuringOnChange=void 0},this.onChangeHandler=e=>{const i=this.base.initState(),t=e.currentTarget,o=t.value,r=t.selectionEnd===o.length;i.syntheticEvent=e;const l=this._suggested,n=this.value,d=n&&n.substring(0,n.length-l.length),v=d&&d===o,h=d&&d.length>o.length,{suggest:m}=this.props,u=this.props.opened!==void 0?this.props.opened:this.state.opened;if(m!==void 0&&m!==!1){v||h||!r?this._suggested="":this.suggestValue(o);const c=o+this._suggested,y={userInput:o,value:this._suggested};this.triggerOnChange(c,i,{suggestion:y})}else this._suggested="",this.triggerOnChange(o,i);(!u&&o||u&&!o)&&this.togglePopup(i),i.data.focusedItem=void 0,this.applyState(i),this.setState({group:void 0})},this.clearButtonClick=e=>{const i=this.base.initState(),t=this.props.opened!==void 0?this.props.opened:this.state.opened;i.syntheticEvent=e;const o="";this._suggested="",this.triggerOnChange(o,i),this.state.focusedItem!==void 0&&(i.data.focusedItem=void 0),t&&this.togglePopup(i),this.applyState(i)},this.onInputKeyDown=e=>{const{skipDisabledItems:s,groupField:i,textField:t}=this.props,o=g.getFilteredData(this.props);this._isScrolling&&(this._isScrolling=!1);const r=this.focusedIndex(),l=o[r],n=e.keyCode,d=e.altKey,v=this.props.opened!==void 0?this.props.opened:this.state.opened,h=this.base.initState();h.syntheticEvent=e;const m=()=>{v&&e.preventDefault()};if(d&&n===p.Keys.down)this.setState({opened:!0});else if(d&&n===p.Keys.up)this.setState({opened:!1});else if(v&&n===p.Keys.pageUp)m(),this.base.scrollPopupByPageSize(-1);else if(v&&n===p.Keys.pageDown)m(),this.base.scrollPopupByPageSize(1);else if(v&&(n===p.Keys.enter||n===p.Keys.esc))m(),s===!1&&l&&l.disabled?(v&&this.togglePopup(h),this.applyState(h)):this.applyInputValue(e.currentTarget.value,h,e.keyCode);else if(!v&&n===p.Keys.esc){const u="";this._suggested="",this.triggerOnChange(u,h),this.state.focusedItem!==void 0&&(h.data.focusedItem=void 0),this.applyState(h)}else if(n===p.Keys.up||n===p.Keys.down){if(i!==""&&t)if(!this.props.skipDisabledItems&&v)this.onNavigate(h,n);else{let u=0;if(n===p.Keys.down||n===p.Keys.right){const c=o.slice(r+1).find(y=>!y.disabled&&y[t]);u=c&&o.findIndex(y=>y[t]===c[t])}else if(n===p.Keys.up||n===p.Keys.left){let c;if(r===-1)c=o,u=o.findIndex(y=>!y.disabled&&y[t]);else{c=o.slice(0,r);let y=c.pop();for(;y&&y.disabled;)y=c.pop();u=y&&o.findIndex(C=>C[t]===y[t])}}if(u!==void 0){const c=u-r;this.onNavigate(h,n,c)}else u===void 0&&o.findIndex(c=>c[t])===o.length-1&&this.onNavigate(h,n)}else if(!this.props.skipDisabledItems&&v)this.onNavigate(h,n);else{let u=null;if(n===p.Keys.down||n===p.Keys.right)u=o.slice(r+1).find(c=>!c.disabled);else if(n===p.Keys.up||n===p.Keys.left){const c=o.slice(0,r);for(u=c.pop();u&&u.disabled;)u=c.pop()}if(u){const c=u.id-r-1;this.onNavigate(h,n,c)}else this.onNavigate(h,n)}this.applyState(h),m()}},this.handleBlur=e=>{if(this.state.focused){const s=this.base.initState();s.data.focused=!1,s.events.push({type:"onBlur"}),s.syntheticEvent=e,this.applyInputValue(e.currentTarget.value,s)}},p.validatePackage(R.packageMetadata)}get _inputId(){return this.props.id+"-accessibility-id"}get element(){return this._element}get value(){return this._valueDuringOnChange!==void 0?this._valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value!==void 0?this.state.value:this.props.defaultValue!==void 0?this.props.defaultValue:""}get name(){return this.props.name}get validity(){const a=this.props.validationMessage!==void 0,e=!this.required||this.value!=="",s=this.props.valid!==void 0?this.props.valid:e;return{customError:a,valid:s,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:b.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:b.defaultProps.required}componentDidUpdate(a,e){var m;const{groupField:s=""}=this.props,i=g.getFilteredData(this.props),{data:t=[]}=a,o=this.focusedIndex(),r=i[o],l=t!==i,n=r!==void 0&&e.focusedItem!==r,d=this.props.opened!==void 0?this.props.opened:this.state.opened,v=a.opened!==void 0?a.opened:e.opened,h=!v&&d;if(s==="")(d&&(n||l)||h)&&this.base.scrollToItem(o);else if(!this._isScrolling){const u=(m=this.base.getGroupedDataModernMode(i,s))==null?void 0:m.indexOf(r);h&&(i&&i.length!==0&&this.base.resetGroupStickyHeader(i[0][s],this),this.base.scrollToItem(u)),d&&v&&n&&this.base.scrollToItem(u)}this.setValidity()}componentDidMount(){this.base.didMount(),this.setValidity()}render(){const{dir:a,disabled:e,label:s,className:i,style:t,loading:o,suggest:r,size:l,rounded:n,fillMode:d}=this.props,v=!this.validityStyles||this.validity.valid,h=this.base,m=this.value,u=this.props.clearButton!==!1&&!o&&!!m,c=this.props.id||this._inputId,y=this.state.focused;typeof r=="string"&&(this._suggested=r);const[C,K]=F(this.props.prefix||I.Fragment),[V,M]=F(this.props.suffix||I.Fragment),D=I.createElement("span",{className:p.classNames("k-autocomplete k-input",i,{[`k-input-${_[l]||l}`]:l,[`k-rounded-${G[n]||n}`]:n,[`k-input-${d}`]:d,"k-invalid":!v,"k-focus":y&&!e,"k-loading":o,"k-required":this.required,"k-disabled":e}),ref:w=>{this._element=w,h.wrapper=w},style:s?{...t,width:void 0}:t,dir:a},this.props.prefix&&I.createElement(C,{...K}),this.renderSearchBar(m||"",c),o&&I.createElement(p.IconWrap,{className:"k-input-loading-icon",name:"loading"}),u&&!o&&I.createElement(H,{onClick:this.clearButtonClick,key:"clearbutton"}),this.props.suffix&&I.createElement(V,{...M}),this.renderListContainer());return s?I.createElement(L.FloatingLabel,{label:s,editorId:c,editorValue:m,editorValid:v,editorDisabled:e,style:{width:t?t.width:void 0},children:D}):D}onNavigate(a,e,s){const i=this.value,{textField:t,focusedItemIndex:o}=this.props,r=g.getFilteredData(this.props),l=this.state.focusedItem!==void 0?r.findIndex(d=>g.areSame(d,this.state.focusedItem,t)):o?o(r,i,t):r.indexOf(g.getFocusedItem(r,i,t)),n=this.base.navigation.navigate({keyCode:e,current:l,max:r.length-1,min:0,skipItems:s||void 0});n!==void 0&&this.itemFocus(n,a),this.applyState(a)}applyInputValue(a,e,s){const i=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:t}=this.props,o=g.getFilteredData(this.props),r=this.focusedIndex(),l=o[r];if(this._suggested="",i&&s===p.Keys.enter&&l&&!l.disabled){const n=g.getItemValue(o[this.focusedIndex(a)],t);this.triggerOnChange(n,e)}i&&this.togglePopup(e),this.applyState(e)}renderSearchBar(a,e){const s=this.base,{placeholder:i,tabIndex:t,disabled:o,readonly:r}=this.props,{focused:l}=this.state,n=this.props.opened!==void 0?this.props.opened:this.state.opened;return I.createElement(q,{id:e,placeholder:i,tabIndex:t,accessKey:this.props.accessKey,value:a,suggestedText:this._suggested,focused:l,name:this.props.name,ref:d=>this._input=d&&d.input,onKeyDown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:s.handleFocus,onBlur:this.handleBlur,disabled:o,readOnly:r,expanded:n,owns:s.listBoxId,activedescendant:"option-"+s.guid+"-"+this.focusedIndex(),role:"combobox",ariaLabelledBy:this.props.ariaLabelledBy,ariaDescribedBy:this.props.ariaDescribedBy,ariaRequired:this.required,render:this.props.valueRender})}renderListContainer(){const a=this.base,{dir:e,header:s,footer:i,size:t,groupField:o,list:r,groupStickyHeaderItemRender:l}=this.props,n=g.getFilteredData(this.props),d=a.getPopupSettings(),v=this.props.opened!==void 0?this.props.opened:this.state.opened,h=d.width!==void 0?d.width:a.popupWidth;let{group:m}=this.state;return m===void 0&&o!==void 0&&(m=g.getItemValue(n[0],o)),I.createElement(E,{width:h,popupSettings:{...d,anchor:d.anchor||this.element,show:v,popupClass:p.classNames(d.popupClass,"k-list-container","k-autocomplete-popup")},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[n.length]},s&&I.createElement("div",{className:"k-list-header"},s),I.createElement("div",{className:p.classNames("k-list",{[`k-list-${_[t]||t}`]:t})},!r&&m&&n.length!==0&&I.createElement(N,{group:m,groupMode:"modern",render:l}),this.renderList()),i&&I.createElement("div",{className:"k-list-footer"},i))}renderList(){const a=this.base,e=a.getPopupSettings(),{textField:s,listNoDataRender:i,itemRender:t,groupHeaderItemRender:o}=this.props,r=g.getFilteredData(this.props),l=this.value,n=this.props.opened!==void 0?this.props.opened:this.state.opened;return I.createElement(T,{id:a.listBoxId,show:n,data:r.slice(),focusedIndex:this.focusedIndex(),value:l,textField:s,valueField:s,highlightSelected:!1,optionsGuid:a.guid,groupField:this.props.groupField,groupMode:"modern",listRef:d=>a.list=d,wrapperStyle:{maxHeight:e.height},wrapperCssClass:"k-list-content",onClick:this.handleItemClick,itemRender:t,groupHeaderItemRender:o,noDataRender:i,onMouseDown:d=>d.preventDefault(),onScroll:this.onScroll})}triggerOnChange(a,e,s){this.value===a&&!s||(e.data.value=a,this._valueDuringOnChange=a,e.events.push({type:"onChange",...s||{}}))}applyState(a){this.base.applyState(a),this._valueDuringOnChange=void 0}suggestValue(a){if(this._suggested="",a){const{textField:e}=this.props,s=g.getFilteredData(this.props),i=s[g.itemIndexStartsWith(s,a,e)];if(i){const t=g.getItemValue(i,e);a.toLowerCase()!==t.toLowerCase()&&(this._suggested=t.substring(a.length))}}}focusedIndex(a){const{textField:e,focusedItemIndex:s,skipDisabledItems:i}=this.props,t=g.getFilteredData(this.props),o=a!==void 0?a:this.value;if(this.state.focusedItem!==void 0)return t.findIndex(l=>g.areSame(l,this.state.focusedItem,e));if(s)return s(t,o,e);const r=t.indexOf(g.getFocusedItem(t,o,e));return i&&e&&r===-1?t.findIndex(l=>!l.disabled&&l[e]):Math.max(0,r)}};b.displayName="AutoComplete",b.propTypes={...k.basicPropTypes,size:f.oneOf([null,"small","medium","large"]),rounded:f.oneOf([null,"small","medium","large","full"]),fillMode:f.oneOf([null,"solid","flat","outline"]),groupField:f.string,suggest:f.oneOfType([f.bool,f.string]),placeholder:f.string,value:f.string,defaultValue:f.string,validationMessage:f.string,required:f.bool,readonly:f.bool,clearButton:f.bool,valueRender:f.func,id:f.string,ariaLabelledBy:f.string,ariaDescribedBy:f.string,list:f.any,skipDisabledItems:f.bool},b.defaultProps={...k.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",skipDisabledItems:!0,prefix:void 0,suffix:void 0};let S=b;const O=p.createPropsContext(),P=p.withIdHOC(p.withPropsContext(O,S));P.displayName="KendoReactAutoComplete";exports.AutoComplete=P;exports.AutoCompletePropsContext=O;exports.AutoCompleteWithoutContext=S;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react"),f=require("prop-types"),q=require("../common/SearchBar.js"),E=require("../common/ListContainer.js"),T=require("../common/List.js"),k=require("../common/DropDownBase.js"),N=require("../common/GroupStickyHeader.js"),m=require("../common/utils.js"),p=require("@progress/kendo-react-common"),L=require("@progress/kendo-react-labels"),R=require("../package-metadata.js"),H=require("../common/ClearButton.js"),F=require("../common/withCustomComponent.js");function z(x){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(x){for(const e in x)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(x,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>x[e]})}}return a.default=x,Object.freeze(a)}const I=z(B),A="Please enter a valid value!",{sizeMap:_,roundedMap:j}=p.kendoThemeMaps,b=class b extends I.Component{constructor(a){super(a),this.state={},this.base=new k(this),this._element=null,this._suggested="",this._input=null,this._isScrolling=!1,this.itemHeight=0,this.focus=()=>{this._input&&this._input.focus()},this.handleItemSelect=(e,s)=>{const i=m.getFilteredData(this.props),t=m.getItemValue(i[e],this.props.textField);this.triggerOnChange(t,s)},this.itemFocus=(e,s)=>{const{textField:i}=this.props,o=m.getFilteredData(this.props)[e];m.areSame(this.state.focusedItem,o,i)||(s.data.focusedItem=o)},this.togglePopup=e=>{this.base.togglePopup(e)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||A)},this.onScroll=e=>{this._isScrolling=!0;const{list:s}=this.base,{groupField:i}=this.props;let t=m.getFilteredData(this.props);if(!i||!t.length)return;const o=this.itemHeight||(s?s.children[0].offsetHeight:0),l=e.target.scrollTop;i&&(t=this.base.getGroupedDataModernMode(t,i));let n=t[0][i];for(let r=1;r<t.length&&!(o*r>l);r++)t[r]&&t[r][i]&&(n=t[r][i]);n!==this.state.group&&this.setState({group:n})},this.handleItemClick=(e,s)=>{this.base.handleItemClick(e,s),this._valueDuringOnChange=void 0},this.onChangeHandler=e=>{const i=this.base.initState(),t=e.currentTarget,o=t.value,d=t.selectionEnd===o.length;i.syntheticEvent=e;const l=this._suggested,n=this.value,r=n&&n.substring(0,n.length-l.length),g=r&&r===o,h=r&&r.length>o.length,{suggest:v}=this.props,u=this.props.opened!==void 0?this.props.opened:this.state.opened;if(v!==void 0&&v!==!1){g||h||!d?this._suggested="":this.suggestValue(o);const c=o+this._suggested,y={userInput:o,value:this._suggested};this.triggerOnChange(c,i,{suggestion:y})}else this._suggested="",this.triggerOnChange(o,i);(!u&&o||u&&!o)&&this.togglePopup(i),i.data.focusedItem=void 0,this.applyState(i),this.setState({group:void 0})},this.clearButtonClick=e=>{const i=this.base.initState(),t=this.props.opened!==void 0?this.props.opened:this.state.opened;i.syntheticEvent=e;const o="";this._suggested="",this.triggerOnChange(o,i),this.state.focusedItem!==void 0&&(i.data.focusedItem=void 0),t&&this.togglePopup(i),this.applyState(i)},this.onInputKeyDown=e=>{const{skipDisabledItems:s,groupField:i,textField:t}=this.props,o=m.getFilteredData(this.props);this._isScrolling&&(this._isScrolling=!1);const d=this.focusedIndex(),l=o[d],n=e.keyCode,r=e.altKey,g=this.props.opened!==void 0?this.props.opened:this.state.opened,h=this.base.initState();h.syntheticEvent=e;const v=()=>{g&&e.preventDefault()};if(r&&n===p.Keys.down)this.setState({opened:!0});else if(r&&n===p.Keys.up)this.setState({opened:!1});else if(g&&n===p.Keys.pageUp)v(),this.base.scrollPopupByPageSize(-1);else if(g&&n===p.Keys.pageDown)v(),this.base.scrollPopupByPageSize(1);else if(g&&(n===p.Keys.enter||n===p.Keys.esc))v(),s===!1&&l&&l.disabled?(g&&this.togglePopup(h),this.applyState(h)):this.applyInputValue(e.currentTarget.value,h,e.keyCode);else if(!g&&n===p.Keys.esc){const u="";this._suggested="",this.triggerOnChange(u,h),this.state.focusedItem!==void 0&&(h.data.focusedItem=void 0),this.applyState(h)}else if(n===p.Keys.up||n===p.Keys.down){if(i!==""&&t)if(!this.props.skipDisabledItems&&g)this.onNavigate(h,n);else{let u=0;if(n===p.Keys.down||n===p.Keys.right){const c=o.slice(d+1).find(y=>!y.disabled&&y[t]);u=c&&o.findIndex(y=>y[t]===c[t])}else if(n===p.Keys.up||n===p.Keys.left){let c;if(d===-1)c=o,u=o.findIndex(y=>!y.disabled&&y[t]);else{c=o.slice(0,d);let y=c.pop();for(;y&&y.disabled;)y=c.pop();u=y&&o.findIndex(C=>C[t]===y[t])}}if(u!==void 0){const c=u-d;this.onNavigate(h,n,c)}else u===void 0&&o.findIndex(c=>c[t])===o.length-1&&this.onNavigate(h,n)}else if(!this.props.skipDisabledItems&&g)this.onNavigate(h,n);else{let u=null;if(n===p.Keys.down||n===p.Keys.right)u=o.slice(d+1).find(c=>!c.disabled);else if(n===p.Keys.up||n===p.Keys.left){const c=o.slice(0,d);for(u=c.pop();u&&u.disabled;)u=c.pop()}if(u){const c=u.id-d-1;this.onNavigate(h,n,c)}else this.onNavigate(h,n)}this.applyState(h),v()}},this.handleBlur=e=>{if(this.state.focused){const s=this.base.initState();s.data.focused=!1,s.events.push({type:"onBlur"}),s.syntheticEvent=e,this.applyInputValue(e.currentTarget.value,s)}},p.validatePackage(R.packageMetadata)}get _inputId(){return this.props.id+"-accessibility-id"}get element(){return this._element}get value(){return this._valueDuringOnChange!==void 0?this._valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value!==void 0?this.state.value:this.props.defaultValue!==void 0?this.props.defaultValue:""}get name(){return this.props.name}get validity(){const a=this.props.validationMessage!==void 0,e=!this.required||this.value!=="",s=this.props.valid!==void 0?this.props.valid:e;return{customError:a,valid:s,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:b.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:b.defaultProps.required}componentDidUpdate(a,e){var v;const{groupField:s=""}=this.props,i=m.getFilteredData(this.props),{data:t=[]}=a,o=this.focusedIndex(),d=i[o],l=t!==i,n=d!==void 0&&e.focusedItem!==d,r=this.props.opened!==void 0?this.props.opened:this.state.opened,g=a.opened!==void 0?a.opened:e.opened,h=!g&&r;if(s==="")(r&&(n||l)||h)&&this.base.scrollToItem(o);else if(!this._isScrolling){const u=(v=this.base.getGroupedDataModernMode(i,s))==null?void 0:v.indexOf(d);h&&(i&&i.length!==0&&this.base.resetGroupStickyHeader(i[0][s],this),this.base.scrollToItem(u)),r&&g&&n&&this.base.scrollToItem(u)}this.setValidity()}componentDidMount(){this.base.didMount(),this.setValidity()}render(){const{dir:a,disabled:e,label:s,className:i,style:t,loading:o,suggest:d,size:l,rounded:n,fillMode:r}=this.props,g=!this.validityStyles||this.validity.valid,h=this.base,v=this.value,u=this.props.clearButton!==!1&&!o&&!!v,c=this.props.id||this._inputId,y=this.state.focused;typeof d=="string"&&(this._suggested=d);const[C,K]=F(this.props.prefix||I.Fragment),[V,M]=F(this.props.suffix||I.Fragment),D=I.createElement("span",{className:p.classNames("k-autocomplete k-input",i,{[`k-input-${_[l]||l}`]:l,[`k-rounded-${j[n]||n}`]:n,[`k-input-${r}`]:r,"k-invalid":!g,"k-focus":y&&!e,"k-loading":o,"k-required":this.required,"k-disabled":e}),ref:w=>{this._element=w,h.wrapper=w},style:s?{...t,width:void 0}:t,dir:a},this.props.prefix&&I.createElement(C,{...K}),this.renderSearchBar(v||"",c),o&&I.createElement(p.IconWrap,{className:"k-input-loading-icon",name:"loading"}),u&&!o&&I.createElement(H,{onClick:this.clearButtonClick,key:"clearbutton"}),this.props.suffix&&I.createElement(V,{...M}),this.renderListContainer());return s?I.createElement(L.FloatingLabel,{label:s,editorId:c,editorValue:v,editorValid:g,editorDisabled:e,style:{width:t?t.width:void 0},children:D}):D}onNavigate(a,e,s){const i=this.value,{textField:t,focusedItemIndex:o}=this.props,d=m.getFilteredData(this.props),l=this.state.focusedItem!==void 0?d.findIndex(r=>m.areSame(r,this.state.focusedItem,t)):o?o(d,i,t):d.indexOf(m.getFocusedItem(d,i,t)),n=this.base.navigation.navigate({keyCode:e,current:l,max:d.length-1,min:0,skipItems:s||void 0});n!==void 0&&this.itemFocus(n,a),this.applyState(a)}applyInputValue(a,e,s){const i=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:t}=this.props,o=m.getFilteredData(this.props),d=this.focusedIndex(),l=o[d];if(this._suggested="",i&&s===p.Keys.enter&&l&&!l.disabled){const n=m.getItemValue(o[this.focusedIndex(a)],t);this.triggerOnChange(n,e)}i&&this.togglePopup(e),this.applyState(e)}renderSearchBar(a,e){const s=this.base,{placeholder:i,tabIndex:t,disabled:o,readonly:d,inputAttributes:l}=this.props,{focused:n}=this.state,r=this.props.opened!==void 0?this.props.opened:this.state.opened;return I.createElement(q,{id:e,placeholder:i,tabIndex:t,accessKey:this.props.accessKey,value:a,suggestedText:this._suggested,focused:n,name:this.props.name,ref:g=>this._input=g&&g.input,onKeyDown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:s.handleFocus,onBlur:this.handleBlur,disabled:o,readOnly:d,expanded:r,owns:s.listBoxId,activedescendant:"option-"+s.guid+"-"+this.focusedIndex(),role:"combobox",ariaLabelledBy:this.props.ariaLabelledBy,ariaDescribedBy:this.props.ariaDescribedBy,ariaRequired:this.required,render:this.props.valueRender,inputAttributes:l})}renderListContainer(){const a=this.base,{dir:e,header:s,footer:i,size:t,groupField:o,list:d,groupStickyHeaderItemRender:l}=this.props,n=m.getFilteredData(this.props),r=a.getPopupSettings(),g=this.props.opened!==void 0?this.props.opened:this.state.opened,h=r.width!==void 0?r.width:a.popupWidth;let{group:v}=this.state;return v===void 0&&o!==void 0&&(v=m.getItemValue(n[0],o)),I.createElement(E,{width:h,popupSettings:{...r,anchor:r.anchor||this.element,show:g,popupClass:p.classNames(r.popupClass,"k-list-container","k-autocomplete-popup")},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[n.length]},s&&I.createElement("div",{className:"k-list-header"},s),I.createElement("div",{className:p.classNames("k-list",{[`k-list-${_[t]||t}`]:t})},!d&&v&&n.length!==0&&I.createElement(N,{group:v,groupMode:"modern",render:l}),this.renderList()),i&&I.createElement("div",{className:"k-list-footer"},i))}renderList(){const a=this.base,e=a.getPopupSettings(),{textField:s,listNoDataRender:i,itemRender:t,groupHeaderItemRender:o}=this.props,d=m.getFilteredData(this.props),l=this.value,n=this.props.opened!==void 0?this.props.opened:this.state.opened;return I.createElement(T,{id:a.listBoxId,show:n,data:d.slice(),focusedIndex:this.focusedIndex(),value:l,textField:s,valueField:s,highlightSelected:!1,optionsGuid:a.guid,groupField:this.props.groupField,groupMode:"modern",listRef:r=>a.list=r,wrapperStyle:{maxHeight:e.height},wrapperCssClass:"k-list-content",onClick:this.handleItemClick,itemRender:t,groupHeaderItemRender:o,noDataRender:i,onMouseDown:r=>r.preventDefault(),onScroll:this.onScroll})}triggerOnChange(a,e,s){this.value===a&&!s||(e.data.value=a,this._valueDuringOnChange=a,e.events.push({type:"onChange",...s||{}}))}applyState(a){this.base.applyState(a),this._valueDuringOnChange=void 0}suggestValue(a){if(this._suggested="",a){const{textField:e}=this.props,s=m.getFilteredData(this.props),i=s[m.itemIndexStartsWith(s,a,e)];if(i){const t=m.getItemValue(i,e);a.toLowerCase()!==t.toLowerCase()&&(this._suggested=t.substring(a.length))}}}focusedIndex(a){const{textField:e,focusedItemIndex:s,skipDisabledItems:i}=this.props,t=m.getFilteredData(this.props),o=a!==void 0?a:this.value;if(this.state.focusedItem!==void 0)return t.findIndex(l=>m.areSame(l,this.state.focusedItem,e));if(s)return s(t,o,e);const d=t.indexOf(m.getFocusedItem(t,o,e));return i&&e&&d===-1?t.findIndex(l=>!l.disabled&&l[e]):Math.max(0,d)}};b.displayName="AutoComplete",b.propTypes={...k.basicPropTypes,size:f.oneOf([null,"small","medium","large"]),rounded:f.oneOf([null,"small","medium","large","full"]),fillMode:f.oneOf([null,"solid","flat","outline"]),groupField:f.string,suggest:f.oneOfType([f.bool,f.string]),placeholder:f.string,value:f.string,defaultValue:f.string,validationMessage:f.string,required:f.bool,readonly:f.bool,clearButton:f.bool,valueRender:f.func,id:f.string,ariaLabelledBy:f.string,ariaDescribedBy:f.string,list:f.any,skipDisabledItems:f.bool,inputAttributes:f.object},b.defaultProps={...k.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",skipDisabledItems:!0,prefix:void 0,suffix:void 0};let S=b;const O=p.createPropsContext(),P=p.withIdHOC(p.withPropsContext(O,S));P.displayName="KendoReactAutoComplete";exports.AutoComplete=P;exports.AutoCompletePropsContext=O;exports.AutoCompleteWithoutContext=S;

package/AutoComplete/AutoComplete.mjs

@@ -7,19 +7,19 @@
  */
 "use client";
 import * as I from "react";
-import c from "prop-types";
+import g from "prop-types";
 import T from "../common/SearchBar.mjs";
 import N from "../common/ListContainer.mjs";
 import L from "../common/List.mjs";
 import C from "../common/DropDownBase.mjs";
 import H from "../common/GroupStickyHeader.mjs";
 import { getFilteredData as y, getItemValue as x, areSame as k, getFocusedItem as O, itemIndexStartsWith as R } from "../common/utils.mjs";
-import { Keys as m, validatePackage as q, classNames as w, IconWrap as K, createPropsContext as z, withIdHOC as G, withPropsContext as $, kendoThemeMaps as A } from "@progress/kendo-react-common";
+import { Keys as m, validatePackage as q, classNames as w, IconWrap as K, createPropsContext as z, withIdHOC as G, withPropsContext as A, kendoThemeMaps as $ } from "@progress/kendo-react-common";
 import { FloatingLabel as U } from "@progress/kendo-react-labels";
 import { packageMetadata as j } from "../package-metadata.mjs";
 import J from "../common/ClearButton.mjs";
 import P from "../common/withCustomComponent.mjs";
-const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b = class b extends I.Component {
+const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = $, b = class b extends I.Component {
   constructor(a) {
     super(a), this.state = {}, this.base = new C(this), this._element = null, this._suggested = "", this._input = null, this._isScrolling = !1, this.itemHeight = 0, this.focus = () => {
       this._input && this._input.focus();
@@ -44,19 +44,19 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
       const i = this.itemHeight || (o ? o.children[0].offsetHeight : 0), p = e.target.scrollTop;
       s && (t = this.base.getGroupedDataModernMode(t, s));
       let n = t[0][s];
-      for (let d = 1; d < t.length && !(i * d > p); d++)
-        t[d] && t[d][s] && (n = t[d][s]);
+      for (let r = 1; r < t.length && !(i * r > p); r++)
+        t[r] && t[r][s] && (n = t[r][s]);
       n !== this.state.group && this.setState({
         group: n
       });
     }, this.handleItemClick = (e, o) => {
       this.base.handleItemClick(e, o), this._valueDuringOnChange = void 0;
     }, this.onChangeHandler = (e) => {
-      const s = this.base.initState(), t = e.currentTarget, i = t.value, r = t.selectionEnd === i.length;
+      const s = this.base.initState(), t = e.currentTarget, i = t.value, d = t.selectionEnd === i.length;
       s.syntheticEvent = e;
-      const p = this._suggested, n = this.value, d = n && n.substring(0, n.length - p.length), f = d && d === i, h = d && d.length > i.length, { suggest: g } = this.props, l = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
-      if (g !== void 0 && g !== !1) {
-        f || h || !r ? this._suggested = "" : this.suggestValue(i);
+      const p = this._suggested, n = this.value, r = n && n.substring(0, n.length - p.length), c = r && r === i, h = r && r.length > i.length, { suggest: f } = this.props, l = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+      if (f !== void 0 && f !== !1) {
+        c || h || !d ? this._suggested = "" : this.suggestValue(i);
         const u = i + this._suggested, v = { userInput: i, value: this._suggested };
         this.triggerOnChange(u, s, { suggestion: v });
       } else
@@ -70,43 +70,43 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
     }, this.onInputKeyDown = (e) => {
       const { skipDisabledItems: o, groupField: s, textField: t } = this.props, i = y(this.props);
       this._isScrolling && (this._isScrolling = !1);
-      const r = this.focusedIndex(), p = i[r], n = e.keyCode, d = e.altKey, f = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = this.base.initState();
+      const d = this.focusedIndex(), p = i[d], n = e.keyCode, r = e.altKey, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = this.base.initState();
       h.syntheticEvent = e;
-      const g = () => {
-        f && e.preventDefault();
+      const f = () => {
+        c && e.preventDefault();
       };
-      if (d && n === m.down)
+      if (r && n === m.down)
         this.setState({
           opened: !0
         });
-      else if (d && n === m.up)
+      else if (r && n === m.up)
         this.setState({
           opened: !1
         });
-      else if (f && n === m.pageUp)
-        g(), this.base.scrollPopupByPageSize(-1);
-      else if (f && n === m.pageDown)
-        g(), this.base.scrollPopupByPageSize(1);
-      else if (f && (n === m.enter || n === m.esc))
-        g(), o === !1 && p && p.disabled ? (f && this.togglePopup(h), this.applyState(h)) : this.applyInputValue(e.currentTarget.value, h, e.keyCode);
-      else if (!f && n === m.esc) {
+      else if (c && n === m.pageUp)
+        f(), this.base.scrollPopupByPageSize(-1);
+      else if (c && n === m.pageDown)
+        f(), this.base.scrollPopupByPageSize(1);
+      else if (c && (n === m.enter || n === m.esc))
+        f(), o === !1 && p && p.disabled ? (c && this.togglePopup(h), this.applyState(h)) : this.applyInputValue(e.currentTarget.value, h, e.keyCode);
+      else if (!c && n === m.esc) {
         const l = "";
         this._suggested = "", this.triggerOnChange(l, h), this.state.focusedItem !== void 0 && (h.data.focusedItem = void 0), this.applyState(h);
       } else if (n === m.up || n === m.down) {
         if (s !== "" && t)
-          if (!this.props.skipDisabledItems && f)
+          if (!this.props.skipDisabledItems && c)
             this.onNavigate(h, n);
           else {
             let l = 0;
             if (n === m.down || n === m.right) {
-              const u = i.slice(r + 1).find((v) => !v.disabled && v[t]);
+              const u = i.slice(d + 1).find((v) => !v.disabled && v[t]);
               l = u && i.findIndex((v) => v[t] === u[t]);
             } else if (n === m.up || n === m.left) {
               let u;
-              if (r === -1)
+              if (d === -1)
                 u = i, l = i.findIndex((v) => !v.disabled && v[t]);
               else {
-                u = i.slice(0, r);
+                u = i.slice(0, d);
                 let v = u.pop();
                 for (; v && v.disabled; )
                   v = u.pop();
@@ -114,29 +114,29 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
               }
             }
             if (l !== void 0) {
-              const u = l - r;
+              const u = l - d;
               this.onNavigate(h, n, u);
             } else
               l === void 0 && i.findIndex((u) => u[t]) === i.length - 1 && this.onNavigate(h, n);
           }
-        else if (!this.props.skipDisabledItems && f)
+        else if (!this.props.skipDisabledItems && c)
           this.onNavigate(h, n);
         else {
           let l = null;
           if (n === m.down || n === m.right)
-            l = i.slice(r + 1).find((u) => !u.disabled);
+            l = i.slice(d + 1).find((u) => !u.disabled);
           else if (n === m.up || n === m.left) {
-            const u = i.slice(0, r);
+            const u = i.slice(0, d);
             for (l = u.pop(); l && l.disabled; )
               l = u.pop();
           }
           if (l) {
-            const u = l.id - r - 1;
+            const u = l.id - d - 1;
             this.onNavigate(h, n, u);
           } else
             this.onNavigate(h, n);
         }
-        this.applyState(h), g();
+        this.applyState(h), f();
       }
     }, this.handleBlur = (e) => {
       if (this.state.focused) {
@@ -193,13 +193,13 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
    * @hidden
    */
   componentDidUpdate(a, e) {
-    var g;
-    const { groupField: o = "" } = this.props, s = y(this.props), { data: t = [] } = a, i = this.focusedIndex(), r = s[i], p = t !== s, n = r !== void 0 && e.focusedItem !== r, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, f = a.opened !== void 0 ? a.opened : e.opened, h = !f && d;
+    var f;
+    const { groupField: o = "" } = this.props, s = y(this.props), { data: t = [] } = a, i = this.focusedIndex(), d = s[i], p = t !== s, n = d !== void 0 && e.focusedItem !== d, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, c = a.opened !== void 0 ? a.opened : e.opened, h = !c && r;
     if (o === "")
-      (d && (n || p) || h) && this.base.scrollToItem(i);
+      (r && (n || p) || h) && this.base.scrollToItem(i);
     else if (!this._isScrolling) {
-      const l = (g = this.base.getGroupedDataModernMode(s, o)) == null ? void 0 : g.indexOf(r);
-      h && (s && s.length !== 0 && this.base.resetGroupStickyHeader(s[0][o], this), this.base.scrollToItem(l)), d && f && n && this.base.scrollToItem(l);
+      const l = (f = this.base.getGroupedDataModernMode(s, o)) == null ? void 0 : f.indexOf(d);
+      h && (s && s.length !== 0 && this.base.resetGroupStickyHeader(s[0][o], this), this.base.scrollToItem(l)), r && c && n && this.base.scrollToItem(l);
     }
     this.setValidity();
   }
@@ -213,16 +213,16 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
    * @hidden
    */
   render() {
-    const { dir: a, disabled: e, label: o, className: s, style: t, loading: i, suggest: r, size: p, rounded: n, fillMode: d } = this.props, f = !this.validityStyles || this.validity.valid, h = this.base, g = this.value, l = this.props.clearButton !== !1 && !i && !!g, u = this.props.id || this._inputId, v = this.state.focused;
-    typeof r == "string" && (this._suggested = r);
+    const { dir: a, disabled: e, label: o, className: s, style: t, loading: i, suggest: d, size: p, rounded: n, fillMode: r } = this.props, c = !this.validityStyles || this.validity.valid, h = this.base, f = this.value, l = this.props.clearButton !== !1 && !i && !!f, u = this.props.id || this._inputId, v = this.state.focused;
+    typeof d == "string" && (this._suggested = d);
     const [S, V] = P(this.props.prefix || I.Fragment), [E, M] = P(this.props.suffix || I.Fragment), _ = /* @__PURE__ */ I.createElement(
       "span",
       {
         className: w("k-autocomplete k-input", s, {
           [`k-input-${B[p] || p}`]: p,
           [`k-rounded-${W[n] || n}`]: n,
-          [`k-input-${d}`]: d,
-          "k-invalid": !f,
+          [`k-input-${r}`]: r,
+          "k-invalid": !c,
           "k-focus": v && !e,
           "k-loading": i,
           "k-required": this.required,
@@ -235,7 +235,7 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
         dir: a
       },
       this.props.prefix && /* @__PURE__ */ I.createElement(S, { ...V }),
-      this.renderSearchBar(g || "", u),
+      this.renderSearchBar(f || "", u),
       i && /* @__PURE__ */ I.createElement(K, { className: "k-input-loading-icon", name: "loading" }),
       l && !i && /* @__PURE__ */ I.createElement(J, { onClick: this.clearButtonClick, key: "clearbutton" }),
       this.props.suffix && /* @__PURE__ */ I.createElement(E, { ...M }),
@@ -246,8 +246,8 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
       {
         label: o,
         editorId: u,
-        editorValue: g,
-        editorValid: f,
+        editorValue: f,
+        editorValid: c,
         editorDisabled: e,
         style: { width: t ? t.width : void 0 },
         children: _
@@ -258,10 +258,10 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
    * @hidden
    */
   onNavigate(a, e, o) {
-    const s = this.value, { textField: t, focusedItemIndex: i } = this.props, r = y(this.props), p = this.state.focusedItem !== void 0 ? r.findIndex((d) => k(d, this.state.focusedItem, t)) : i ? i(r, s, t) : r.indexOf(O(r, s, t)), n = this.base.navigation.navigate({
+    const s = this.value, { textField: t, focusedItemIndex: i } = this.props, d = y(this.props), p = this.state.focusedItem !== void 0 ? d.findIndex((r) => k(r, this.state.focusedItem, t)) : i ? i(d, s, t) : d.indexOf(O(d, s, t)), n = this.base.navigation.navigate({
       keyCode: e,
       current: p,
-      max: r.length - 1,
+      max: d.length - 1,
       min: 0,
       skipItems: o || void 0
     });
@@ -271,7 +271,7 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
    * @hidden
    */
   applyInputValue(a, e, o) {
-    const s = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { textField: t } = this.props, i = y(this.props), r = this.focusedIndex(), p = i[r];
+    const s = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { textField: t } = this.props, i = y(this.props), d = this.focusedIndex(), p = i[d];
     if (this._suggested = "", s && o === m.enter && p && !p.disabled) {
       const n = x(i[this.focusedIndex(a)], t);
       this.triggerOnChange(n, e);
@@ -279,7 +279,7 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
     s && this.togglePopup(e), this.applyState(e);
   }
   renderSearchBar(a, e) {
-    const o = this.base, { placeholder: s, tabIndex: t, disabled: i, readonly: r } = this.props, { focused: p } = this.state, n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    const o = this.base, { placeholder: s, tabIndex: t, disabled: i, readonly: d, inputAttributes: p } = this.props, { focused: n } = this.state, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
     return /* @__PURE__ */ I.createElement(
       T,
       {
@@ -289,38 +289,39 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
         accessKey: this.props.accessKey,
         value: a,
         suggestedText: this._suggested,
-        focused: p,
+        focused: n,
         name: this.props.name,
-        ref: (d) => this._input = d && d.input,
+        ref: (c) => this._input = c && c.input,
         onKeyDown: this.onInputKeyDown,
         onChange: this.onChangeHandler,
         onFocus: o.handleFocus,
         onBlur: this.handleBlur,
         disabled: i,
-        readOnly: r,
-        expanded: n,
+        readOnly: d,
+        expanded: r,
         owns: o.listBoxId,
         activedescendant: "option-" + o.guid + "-" + this.focusedIndex(),
         role: "combobox",
         ariaLabelledBy: this.props.ariaLabelledBy,
         ariaDescribedBy: this.props.ariaDescribedBy,
         ariaRequired: this.required,
-        render: this.props.valueRender
+        render: this.props.valueRender,
+        inputAttributes: p
       }
     );
   }
   renderListContainer() {
-    const a = this.base, { dir: e, header: o, footer: s, size: t, groupField: i, list: r, groupStickyHeaderItemRender: p } = this.props, n = y(this.props), d = a.getPopupSettings(), f = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = d.width !== void 0 ? d.width : a.popupWidth;
-    let { group: g } = this.state;
-    return g === void 0 && i !== void 0 && (g = x(n[0], i)), /* @__PURE__ */ I.createElement(
+    const a = this.base, { dir: e, header: o, footer: s, size: t, groupField: i, list: d, groupStickyHeaderItemRender: p } = this.props, n = y(this.props), r = a.getPopupSettings(), c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = r.width !== void 0 ? r.width : a.popupWidth;
+    let { group: f } = this.state;
+    return f === void 0 && i !== void 0 && (f = x(n[0], i)), /* @__PURE__ */ I.createElement(
       N,
       {
         width: h,
         popupSettings: {
-          ...d,
-          anchor: d.anchor || this.element,
-          show: f,
-          popupClass: w(d.popupClass, "k-list-container", "k-autocomplete-popup")
+          ...r,
+          anchor: r.anchor || this.element,
+          show: c,
+          popupClass: w(r.popupClass, "k-list-container", "k-autocomplete-popup")
         },
         dir: e !== void 0 ? e : this.base.dirCalculated,
         itemsCount: [n.length]
@@ -333,20 +334,20 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
             [`k-list-${B[t] || t}`]: t
           })
         },
-        !r && g && n.length !== 0 && /* @__PURE__ */ I.createElement(H, { group: g, groupMode: "modern", render: p }),
+        !d && f && n.length !== 0 && /* @__PURE__ */ I.createElement(H, { group: f, groupMode: "modern", render: p }),
         this.renderList()
       ),
       s && /* @__PURE__ */ I.createElement("div", { className: "k-list-footer" }, s)
     );
   }
   renderList() {
-    const a = this.base, e = a.getPopupSettings(), { textField: o, listNoDataRender: s, itemRender: t, groupHeaderItemRender: i } = this.props, r = y(this.props), p = this.value, n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    const a = this.base, e = a.getPopupSettings(), { textField: o, listNoDataRender: s, itemRender: t, groupHeaderItemRender: i } = this.props, d = y(this.props), p = this.value, n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
     return /* @__PURE__ */ I.createElement(
       L,
       {
         id: a.listBoxId,
         show: n,
-        data: r.slice(),
+        data: d.slice(),
         focusedIndex: this.focusedIndex(),
         value: p,
         textField: o,
@@ -355,14 +356,14 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
         optionsGuid: a.guid,
         groupField: this.props.groupField,
         groupMode: "modern",
-        listRef: (d) => a.list = d,
+        listRef: (r) => a.list = r,
         wrapperStyle: { maxHeight: e.height },
         wrapperCssClass: "k-list-content",
         onClick: this.handleItemClick,
         itemRender: t,
         groupHeaderItemRender: i,
         noDataRender: s,
-        onMouseDown: (d) => d.preventDefault(),
+        onMouseDown: (r) => r.preventDefault(),
         onScroll: this.onScroll
       }
     );
@@ -388,30 +389,31 @@ const Q = "Please enter a valid value!", { sizeMap: B, roundedMap: W } = A, b =
       return t.findIndex((p) => k(p, this.state.focusedItem, e));
     if (o)
       return o(t, i, e);
-    const r = t.indexOf(O(t, i, e));
-    return s && e && r === -1 ? t.findIndex((p) => !p.disabled && p[e]) : Math.max(0, r);
+    const d = t.indexOf(O(t, i, e));
+    return s && e && d === -1 ? t.findIndex((p) => !p.disabled && p[e]) : Math.max(0, d);
   }
 };
 b.displayName = "AutoComplete", b.propTypes = {
   ...C.basicPropTypes,
-  size: c.oneOf([null, "small", "medium", "large"]),
-  rounded: c.oneOf([null, "small", "medium", "large", "full"]),
-  fillMode: c.oneOf([null, "solid", "flat", "outline"]),
-  groupField: c.string,
-  suggest: c.oneOfType([c.bool, c.string]),
-  placeholder: c.string,
-  value: c.string,
-  defaultValue: c.string,
-  validationMessage: c.string,
-  required: c.bool,
-  readonly: c.bool,
-  clearButton: c.bool,
-  valueRender: c.func,
-  id: c.string,
-  ariaLabelledBy: c.string,
-  ariaDescribedBy: c.string,
-  list: c.any,
-  skipDisabledItems: c.bool
+  size: g.oneOf([null, "small", "medium", "large"]),
+  rounded: g.oneOf([null, "small", "medium", "large", "full"]),
+  fillMode: g.oneOf([null, "solid", "flat", "outline"]),
+  groupField: g.string,
+  suggest: g.oneOfType([g.bool, g.string]),
+  placeholder: g.string,
+  value: g.string,
+  defaultValue: g.string,
+  validationMessage: g.string,
+  required: g.bool,
+  readonly: g.bool,
+  clearButton: g.bool,
+  valueRender: g.func,
+  id: g.string,
+  ariaLabelledBy: g.string,
+  ariaDescribedBy: g.string,
+  list: g.any,
+  skipDisabledItems: g.bool,
+  inputAttributes: g.object
 }, b.defaultProps = {
   ...C.defaultProps,
   size: "medium",
@@ -423,7 +425,7 @@ b.displayName = "AutoComplete", b.propTypes = {
 };
 let D = b;
 const X = z(), Y = G(
-  $(
+  A(
     X,
     D
   )

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"),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;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const X=require("react"),b=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 g=ne(X),le="Please enter a valid value!",S=class S extends g.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 g.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 m=1;m<d.length&&!(n*m>r);m++)d[m]&&d[m][l]&&(a=d[m][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,m=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&&m)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&&m)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(),x=y===-1,f=!x&&this.getCurrentValueDisabledStatus(i,n,y);m?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&&!x&&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)):!m&&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 m=!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 x=this.hasDuplicates?this.navigationIndex||0:n.findIndex(u=>h.areSame(u,c,t));this.props.groupMode==="modern"&&d&&c&&(x=(C=this.base.getGroupedDataModernMode(n,l))==null?void 0:C.map(u=>u[d]).indexOf(c[d]));const f=!h.areSame(y,c,t);m&&i?this.base.scrollToVirtualItem(i,x):m&&!i?(this.onPopupOpened(),n&&n.length!==0&&this.base.resetGroupStickyHeader(n[0][l],this),this.base.scrollToItem(x)):(this.hasDuplicates||r&&a&&c&&f)&&this.base.scrollToItem(x)}m&&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:m,virtual:c,size:C,rounded:y,fillMode:x,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,j=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[G,$]=z(this.props.prefix||g.Fragment),[Y,J]=z(this.props.suffix||g.Fragment),A=g.createElement(g.Fragment,null,g.createElement("span",{className:o.classNames(o.uComboBox.wrapper({c:V,size:C,rounded:y,fillMode:x,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&&g.createElement(G,{...$}),this.renderSearchBar(O||"",T,u),j&&!a&&g.createElement(ae,{onClick:this.clearButtonClick,key:"clearbutton"}),a&&g.createElement(o.IconWrap,{className:o.classNames(o.uComboBox.loadingIcon({c:V})),name:"loading",key:"loading"}),this.props.suffix&&g.createElement(Y,{...J}),g.createElement(K.Button,{tabIndex:-1,type:"button","aria-label":f?e:s,icon:m?void 0:"caret-alt-down",svgIcon:v||R.caretAltDownIcon,iconClass:m,size:C,fillMode:x,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?g.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 m=this.hasDuplicates&&this.duplicates.indexOf(a)!==-1;if(n=this.getFocusedIndex(m),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:m}=this.props,c=h.getFilteredData(this.props),C=this.props.opened!==void 0?this.props.opened:this.state.opened,y=this.base.getAdaptiveAnimation(),x=m&&m.uComboBox,f=m&&m.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 g.createElement(P.ActionSheet,{...v},g.createElement(P.ActionSheetHeader,null,g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.titleBar({c:f}))},g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.title({c:f}))},g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.header({c:f}))},r),g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.subtitle({c:f}))})),g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.actions({c:f}))},g.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}))),g.createElement("div",{className:o.classNames(o.uDropDownsActionSheet.titleBarGroup({c:f}))},this.renderMobileListFilter())),g.createElement(P.ActionSheetContent,{overflowHidden:!0},g.createElement("div",{className:o.classNames(o.uComboBox.listContainer({c:x}))},g.createElement("div",{className:o.classNames(o.uComboBox.list({c:x,list:n,size:"large",tableSize:i,virtual:p}))},e&&g.createElement("div",{className:o.classNames(o.uComboBox.listHeader({c:x}))},e),!n&&u&&c.length!==0&&g.createElement(L,{group:u,groupMode:d,render:a}),this.renderList(),t&&g.createElement("div",{className:o.classNames(o.uComboBox.listFooter({c:x}),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:m}=this.props,c=h.getFilteredData(this.props),C=this.props.opened!==void 0?this.props.opened:this.state.opened,y=s.getPopupSettings(),x=y.width!==void 0?y.width:s.popupWidth,f=m&&m.uComboBox;let{group:u}=this.state;return u===void 0&&l!==void 0&&(u=h.getItemValue(c[0],l)),g.createElement(te,{width:x,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]},g.createElement("div",{className:o.classNames(o.uComboBox.list({c:f,list:p,size:n,tableSize:n,virtual:r}))},t&&g.createElement("div",{className:o.classNames(o.uComboBox.listHeader({c:f}))},t),!p&&u&&c.length!==0&&g.createElement(L,{group:u,groupMode:d,render:a}),this.renderList(),i&&g.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(),m=s.vs,c=n.skip,C=this.props.opened!==void 0?this.props.opened:this.state.opened,y=`translateY(${m.translate}px)`,x=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 g.createElement(I,{id:s.listBoxId,virtual:!!n,show:C,data:r,focusedIndex:x,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=>{m.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:m.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:m.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:m,unstyled:c,inputAttributes:C}=this.props,y=h.getFilteredData(this.props),x=this.props.opened!==void 0?this.props.opened:this.state.opened,f=this.value,u=Math.max(0,y.findIndex(v=>h.areSame(v,f,r)));return this._suggested&&!h.areSame(this._valueOnDidUpdate,f,r)&&(this._suggested=""),g.createElement(ee,{id:e,readOnly:x&&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:x,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${u+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,inputAttributes:C})}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: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:o.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,inputAttributes:b.object},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;