@progress/kendo-react-dropdowns 14.5.0-develop.14 → 14.5.0-develop.15

package/AutoComplete/AutoComplete.d.ts

@@ -47,6 +47,7 @@ export declare class AutoCompleteWithoutContext extends React.Component<AutoComp
         valueRender: PropTypes.Requireable<(...args: any[]) => any>;
         id: PropTypes.Requireable<string>;
         ariaLabelledBy: PropTypes.Requireable<string>;
+        ariaLabel: PropTypes.Requireable<string>;
         ariaDescribedBy: PropTypes.Requireable<string>;
         list: PropTypes.Requireable<any>;
         adaptive: PropTypes.Requireable<boolean>;
@@ -64,7 +65,9 @@ export declare class AutoCompleteWithoutContext extends React.Component<AutoComp
         textField: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;
         label: PropTypes.Requireable<string>;
-        loading: PropTypes.Requireable<boolean>;
+        loading: PropTypes.Requireable<boolean>; /**
+         * @hidden
+         */
         popupSettings: PropTypes.Requireable<PropTypes.InferProps<{
             animate: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
                 openDuration: PropTypes.Requireable<number>;
@@ -251,26 +254,4 @@ export interface AutoCompleteHandle extends Pick<AutoCompleteWithoutContext, key
 }
 /** @hidden */
 export type AutoComplete = AutoCompleteHandle;
-/**
- * Represents the [KendoReact AutoComplete component](https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete).
- *
- * Accepts properties of type [AutoCompleteProps](https://www.telerik.com/kendo-react-ui/components/dropdowns/api/autocompleteprops).
- * Obtaining the `ref` returns an object of type [AutoCompleteHandle](https://www.telerik.com/kendo-react-ui/components/dropdowns/api/autocompletehandle).
- *
- * @example
- * ```jsx
- * const App = () => {
- *    const autocomplete = React.useRef(null);
- *    return (
- *       <div>
- *           <AutoComplete
- *               data={[ "Albania", "Andorra", "Austria", "Belarus" ]}
- *               ref={autocomplete}
- *           />
- *           <Button onClick={() => alert(autocomplete.current.value)}>alert value</Button>
- *       </div>
- *    );
- * }
- * ```
- */
 export declare const AutoComplete: React.ForwardRefExoticComponent<AutoCompleteProps & React.RefAttributes<any>>;

package/AutoComplete/AutoComplete.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const V=require("react"),c=require("prop-types"),T=require("../common/SearchBar.js"),B=require("../common/ListContainer.js"),q=require("../common/List.js"),x=require("../common/DropDownBase.js"),N=require("../common/GroupStickyHeader.js"),g=require("../common/utils.js"),l=require("@progress/kendo-react-common"),R=require("@progress/kendo-react-labels"),L=require("../common/ClearButton.js"),z=require("../common/AdaptiveMode.js"),k=require("../common/withCustomComponent.js"),A=require("@progress/kendo-react-layout"),H=require("../common/ListFilter.js");function W(I){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(I){for(const t in I)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(I,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>I[t]})}}return e.default=I,Object.freeze(e)}const f=W(V),j="Please enter a valid value!",{sizeMap:F,roundedMap:G}=l.kendoThemeMaps,y=class y extends f.Component{constructor(){super(...arguments),this.state={},this.base=new x(this),this._element=null,this._suggested="",this._input=null,this._adaptiveInput=null,this._skipFocusEvent=!1,this._isScrolling=!1,this.itemHeight=0,this.focus=()=>{this._input&&this._input.focus()},this.handleKendoPasteValue=e=>{const t=e!=null?String(e):"",s=this.base.initState();s.syntheticEvent={target:this._element,currentTarget:this._element,nativeEvent:new Event("change",{bubbles:!0})},this.triggerOnChange(t,s),this.applyState(s)},this.handleItemSelect=(e,t)=>{const s=g.getFilteredData(this.props),n=g.getItemValue(s[e],this.props.textField);this.state.text&&!this.mobileMode&&(this.state.text&&(t.data.text=""),this.base.filterChanged("",t)),this._adaptiveInput&&this._adaptiveInput.blur(),this.triggerOnChange(n,t)},this.itemFocus=(e,t)=>{const{textField:s}=this.props,i=g.getFilteredData(this.props)[e];g.areSame(this.state.focusedItem,i,s)||(t.data.focusedItem=i)},this.togglePopup=e=>{this.base.togglePopup(e)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||j)},this.renderAdaptiveListContainer=()=>{const{windowWidth:e=0}=this.state,t=f.createElement(H,{value:this.value,ref:n=>{this._adaptiveInput=n&&n.element},onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode,placeholder:this.props.placeholder}),s={title:this.props.adaptiveTitle||this.props.label,subTitle:this.props.adaptiveSubtitle,expand:this.opened,onClose:n=>this.onCancel(n),windowWidth:e,mobileFilter:t};return f.createElement(z.AdaptiveMode,{...s},f.createElement(A.ActionSheetContent,null,f.createElement("div",{className:"k-list-container"},this.listContainerContent())))},this.onCancel=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.opened&&this.base.togglePopup(t),t.events.push({type:"onCancel"});const s=this.state.text;g.isPresent(s)&&s!==""&&this.base.filterChanged("",t),this.state.text&&(t.data.text=""),this.applyState(t)},this.listContainerContent=()=>{const{header:e,footer:t,size:s,groupStickyHeaderItemRender:n,groupField:i,list:a}=this.props,d=g.getFilteredData(this.props);let{group:o}=this.state;return o===void 0&&i!==void 0&&(o=g.getItemValue(d[0],i)),f.createElement(f.Fragment,null,e&&f.createElement("div",{className:"k-list-header"},e),f.createElement("div",{className:l.classNames("k-list",{[`k-list-${this.mobileMode?"lg":F[s]||s}`]:this.mobileMode||s})},!a&&o&&d.length!==0&&f.createElement(N,{group:o,render:n}),this.renderList()),t&&f.createElement("div",{className:"k-list-footer"},t))},this.onScroll=e=>{this._isScrolling=!0;const{list:t}=this.base,{groupField:s}=this.props;let n=g.getFilteredData(this.props);if(!s||!n.length)return;const i=this.itemHeight||(t?t.children[0].offsetHeight:0),d=e.target.scrollTop;s&&(n=this.base.getGroupedDataModernMode(n,s));let o=n[0][s];for(let r=1;r<n.length&&!(i*r>d);r++)n[r]&&n[r][s]&&(o=n[r][s]);o!==this.state.group&&this.setState({group:o})},this.handleItemClick=(e,t)=>{this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.onChangeHandler=e=>{const s=this.base.initState(),n=this.mobileMode?e.target.element:e.currentTarget,i=n.value,a=n.selectionEnd===i.length;s.syntheticEvent=e;const d=this._suggested,o=this.value,r=o&&o.substring(0,o.length-d.length),p=r&&r===i,h=r&&r.length>i.length,{suggest:b}=this.props,u=this.props.opened!==void 0?this.props.opened:this.state.opened;if(b!==void 0&&b!==!1){p||h||!a?this._suggested="":this.suggestValue(i);const m=i+this._suggested,v={userInput:i,value:this._suggested};this.triggerOnChange(m,s,{suggestion:v})}else this._suggested="",this.triggerOnChange(i,s);(!u&&i||u&&!i)&&this.togglePopup(s),s.data.focusedItem=void 0,this.applyState(s),this.setState({group:void 0})},this.clearButtonClick=e=>{const s=this.base.initState(),n=this.props.opened!==void 0?this.props.opened:this.state.opened;s.syntheticEvent=e;const i="";this._suggested="",this.triggerOnChange(i,s),this.state.focusedItem!==void 0&&(s.data.focusedItem=void 0),n&&this.togglePopup(s),this.applyState(s)},this.onInputKeyDown=e=>{const{skipDisabledItems:t,groupField:s,textField:n}=this.props,i=g.getFilteredData(this.props);this._isScrolling&&(this._isScrolling=!1);const a=this.focusedIndex(),d=i[a],o=e.keyCode,r=e.altKey,p=this.props.opened!==void 0?this.props.opened:this.state.opened,h=this.base.initState();h.syntheticEvent=e;const b=()=>{p&&e.preventDefault()};if(r&&o===l.Keys.down)this.setState({opened:!0});else if(r&&o===l.Keys.up)this.setState({opened:!1});else if(p&&o===l.Keys.pageUp)b(),this.base.scrollPopupByPageSize(-1);else if(p&&o===l.Keys.pageDown)b(),this.base.scrollPopupByPageSize(1);else if(p&&(o===l.Keys.enter||o===l.Keys.esc))b(),t===!1&&d&&d.disabled?(p&&this.togglePopup(h),this.applyState(h)):this.applyInputValue(e.currentTarget.value,h,e.keyCode);else if(!p&&o===l.Keys.esc)this._suggested="",this.triggerOnChange("",h),this.state.focusedItem!==void 0&&(h.data.focusedItem=void 0),this.applyState(h);else if(o===l.Keys.up||o===l.Keys.down){if(s!==""&&n)if(!this.props.skipDisabledItems&&p)this.onNavigate(h,o);else{let u=0;if(o===l.Keys.down||o===l.Keys.right){const m=i.slice(a+1).find(v=>!v.disabled);u=m&&i.indexOf(m)}else if(o===l.Keys.up||o===l.Keys.left){let m;if(a===-1)m=i,u=i.findIndex(v=>!v.disabled);else{m=i.slice(0,a);let v=m.pop();for(;v&&v.disabled;)v=m.pop();u=v&&i.indexOf(v)}}if(u!==void 0){const m=u-a;this.onNavigate(h,o,m)}else u===void 0&&a===i.length-1&&this.onNavigate(h,o)}else if(!this.props.skipDisabledItems&&p)this.onNavigate(h,o);else{let u=null;if(o===l.Keys.down||o===l.Keys.right)u=i.slice(a+1).find(m=>!m.disabled);else if(o===l.Keys.up||o===l.Keys.left){const m=i.slice(0,a);for(u=m.pop();u&&u.disabled;)u=m.pop()}if(u){const m=u.id-a-1;this.onNavigate(h,o,m)}else this.onNavigate(h,o)}this.applyState(h),b()}},this.handleFocus=e=>{this._skipFocusEvent||this.base.handleFocus(e)},this.handleBlur=e=>{const t=this.base.initState();!this.state.focused||this._skipFocusEvent||(t.syntheticEvent=e,t.data.focused=!1,t.events.push({type:"onBlur"}),this.opened&&!this.mobileMode&&(this.state.opened&&(t.data.opened=!1),t.events.push({type:"onClose"})),this.applyState(t))},this.handleWrapperClick=e=>{const t=this._input;!this.opened&&t&&this.focusElement(t);const s=this.base.initState();s.syntheticEvent=e,!this.state.focused&&!this.mobileMode&&(s.events.push({type:"onFocus"}),s.data.focused=!0),this.mobileMode&&window.setTimeout(()=>this._adaptiveInput&&this._adaptiveInput.focus(),300),this.base.togglePopup(s),this.applyState(s)}}get _inputId(){return this.props.id+"-accessibility-id"}get document(){if(l.canUseDOM)return this.element&&this.element.ownerDocument||document}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 e=this.props.validationMessage!==void 0,t=!this.required||this.value!=="",s=this.props.valid!==void 0?this.props.valid:t;return{customError:e,valid:s,valueMissing:this.value===null}}get opened(){return!!(this.props.opened!==void 0?this.props.opened:this.state.opened)}get mobileMode(){var t;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((t=this.props._adaptiveMode)==null?void 0:t.medium)&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:y.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:y.defaultProps.required}componentDidUpdate(e,t){var u;const{groupField:s=""}=this.props,n=g.getFilteredData(this.props),{data:i=[]}=e,a=this.focusedIndex(),d=n[a],o=i!==n,r=d!==void 0&&t.focusedItem!==d,p=this.props.opened!==void 0?this.props.opened:this.state.opened,h=e.opened!==void 0?e.opened:t.opened,b=!h&&p;if(s==="")(p&&(r||o)||b)&&this.base.scrollToItem(a);else if(!this._isScrolling){const m=(u=this.base.getGroupedDataModernMode(n,s))==null?void 0:u.indexOf(d);b&&(n&&n.length!==0&&this.base.resetGroupStickyHeader(n[0][s],this),this.base.scrollToItem(m)),p&&h&&r&&this.base.scrollToItem(m)}this.setValidity()}componentDidMount(){var t;this.observerResize=l.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body);const e=this.props.name||this.props.id;this.KendoPasteSubscription=l.subscribeToKendoPaste(this._element,{fieldName:e,onValueChange:s=>{this.handleKendoPasteValue(s)}})}componentWillUnmount(){var e;this.observerResize&&this.observerResize.disconnect(),(e=this.KendoPasteSubscription)==null||e.unsubscribe()}render(){const{dir:e,disabled:t,label:s,className:n,style:i,loading:a,suggest:d,size:o,rounded:r,fillMode:p}=this.props,h=!this.validityStyles||this.validity.valid,b=this.base,u=this.value,m=this.props.clearButton!==!1&&!a&&!!u,v=this.props.id||this._inputId,M=this.state.focused;typeof d=="string"&&(this._suggested=d);const[E,O]=k(this.props.prefix||f.Fragment),[P,K]=k(this.props.suffix||f.Fragment),w=f.createElement(f.Fragment,null,f.createElement("span",{className:l.classNames("k-autocomplete k-input",n,{[`k-input-${F[o]||o}`]:o,[`k-rounded-${G[r]||r}`]:r,[`k-input-${p}`]:p,"k-invalid":!h,"k-focus":M&&!t,"k-loading":a,"k-required":this.required,"k-disabled":t}),ref:C=>{this._element=C,b.wrapper=C},style:s?{...i,width:void 0}:i,dir:e,onFocus:this.mobileMode?C=>this.handleWrapperClick(C):this.handleFocus,onBlur:this.handleBlur,onClick:this.handleWrapperClick},this.props.prefix&&f.createElement(E,{...O}),this.renderSearchBar(u||"",v),a&&f.createElement(l.IconWrap,{className:"k-input-loading-icon",name:"loading"}),m&&!a&&f.createElement(L,{onClick:this.clearButtonClick,key:"clearbutton"}),this.props.suffix&&f.createElement(P,{...K}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return s?f.createElement(R.FloatingLabel,{label:s,editorId:v,editorValue:u,editorValid:h,editorDisabled:t,style:{width:i?i.width:void 0},children:w}):w}onNavigate(e,t,s){const n=this.value,{textField:i,focusedItemIndex:a}=this.props,d=g.getFilteredData(this.props),o=this.state.focusedItem!==void 0?d.findIndex(p=>g.areSame(p,this.state.focusedItem,i)):a?a(d,n,i):d.indexOf(g.getFocusedItem(d,n,i)),r=this.base.navigation.navigate({keyCode:t,current:o,max:d.length-1,min:0,skipItems:s||void 0});r!==void 0&&this.itemFocus(r,e),this.applyState(e)}applyInputValue(e,t,s){const n=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:i}=this.props,a=g.getFilteredData(this.props),d=this.focusedIndex(),o=a[d];if(this._suggested="",n&&s===l.Keys.enter&&o&&!o.disabled){const r=g.getItemValue(a[this.focusedIndex(e)],i);this.triggerOnChange(r,t)}n&&this.togglePopup(t),this.applyState(t)}renderSearchBar(e,t){const s=this.base,{placeholder:n,tabIndex:i,disabled:a,readonly:d,inputAttributes:o}=this.props,{focused:r}=this.state,p=this.props.opened!==void 0?this.props.opened:this.state.opened;return f.createElement(T,{id:t,placeholder:n,tabIndex:i,accessKey:this.props.accessKey,value:e,suggestedText:this._suggested,focused:r,name:this.props.name,ref:h=>{this._input=h&&h.input},onKeyDown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:s.handleFocus,onBlur:this.handleBlur,disabled:a,readOnly:d,expanded:p,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:o})}renderListContainer(){const e=this.base,{dir:t,groupField:s}=this.props,n=g.getFilteredData(this.props),i=e.getPopupSettings(),a=this.props.opened!==void 0?this.props.opened:this.state.opened,d=i.width!==void 0?i.width:e.popupWidth;let{group:o}=this.state;return o===void 0&&s!==void 0&&(o=g.getItemValue(n[0],s)),f.createElement(B,{width:d,popupSettings:{...i,anchor:i.anchor||this.element,show:a,popupClass:l.classNames(i.popupClass,"k-list-container","k-autocomplete-popup")},dir:t!==void 0?t:this.base.dirCalculated,itemsCount:[n.length]},this.listContainerContent())}renderList(){const e=this.base,t=e.getPopupSettings(),{textField:s,listNoDataRender:n,itemRender:i,groupHeaderItemRender:a}=this.props,d=g.getFilteredData(this.props),o=this.value,r=this.props.opened!==void 0?this.props.opened:this.state.opened;return f.createElement(q,{id:e.listBoxId,show:r,data:d.slice(),focusedIndex:this.focusedIndex(),value:o,textField:s,valueField:s,highlightSelected:!1,optionsGuid:e.guid,groupField:this.props.groupField,listRef:p=>{e.list=p},wrapperStyle:this.mobileMode?{}:{maxHeight:t.height},wrapperCssClass:"k-list-content",onClick:this.handleItemClick,itemRender:i,groupHeaderItemRender:a,noDataRender:n,onMouseDown:p=>p.preventDefault(),onScroll:this.onScroll})}triggerOnChange(e,t,s){this.value===e&&!s||(t.data.value=e,this._valueDuringOnChange=e,t.events.push({type:"onChange",...s||{}}))}focusElement(e){this._skipFocusEvent=!0,e.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,0)}applyState(e){this.base.applyState(e),this._valueDuringOnChange=void 0}suggestValue(e){if(this._suggested="",e){const{textField:t}=this.props,s=g.getFilteredData(this.props),n=s[g.itemIndexStartsWith(s,e,t)];if(n){const i=g.getItemValue(n,t);e.toLowerCase()!==i.toLowerCase()&&(this._suggested=i.substring(e.length))}}}focusedIndex(e){const{textField:t,focusedItemIndex:s,skipDisabledItems:n}=this.props,i=g.getFilteredData(this.props),a=e!==void 0?e:this.value;if(this.state.focusedItem!==void 0)return i.findIndex(o=>g.areSame(o,this.state.focusedItem,t));if(s)return s(i,a,t);const d=i.indexOf(g.getFocusedItem(i,a,t));return n&&t&&d===-1?i.findIndex(o=>!o.disabled):Math.max(0,d)}calculateMedia(e){for(const t of e)this.setState({windowWidth:t.target.clientWidth})}};y.displayName="AutoComplete",y.propTypes={...x.basicPropTypes,size:c.oneOf(["small","medium","large"]),rounded:c.oneOf(["small","medium","large","full","none"]),fillMode:c.oneOf(["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,adaptive:c.bool,adaptiveTitle:c.string,adaptiveSubtitle:c.string,onCancel:c.func,skipDisabledItems:c.bool,inputAttributes:c.object},y.defaultProps={...x.defaultProps,size:void 0,rounded:void 0,fillMode:void 0,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let S=y;const D=l.createPropsContext(),_=l.withIdHOC(l.withPropsContext(D,l.withAdaptiveModeContext(S)));_.displayName="KendoReactAutoComplete";exports.AutoComplete=_;exports.AutoCompletePropsContext=D;exports.AutoCompleteWithoutContext=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),h=require("prop-types"),q=require("../common/SearchBar.js"),B=require("../common/ListContainer.js"),N=require("../common/List.js"),x=require("../common/DropDownBase.js"),R=require("../common/GroupStickyHeader.js"),g=require("../common/utils.js"),l=require("@progress/kendo-react-common"),z=require("@progress/kendo-react-labels"),_=require("@progress/kendo-react-intl"),w=require("../messages/index.js"),A=require("../common/ClearButton.js"),H=require("../common/AdaptiveMode.js"),F=require("../common/withCustomComponent.js"),W=require("@progress/kendo-react-layout"),j=require("../common/ListFilter.js");function G(I){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(I){for(const t in I)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(I,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>I[t]})}}return e.default=I,Object.freeze(e)}const f=G(T),U="Please enter a valid value!",{sizeMap:D,roundedMap:$}=l.kendoThemeMaps,y=class y extends f.Component{constructor(){super(...arguments),this.state={},this.base=new x(this),this._element=null,this._suggested="",this._input=null,this._adaptiveInput=null,this._skipFocusEvent=!1,this._isScrolling=!1,this.itemHeight=0,this.focus=()=>{this._input&&this._input.focus()},this.handleKendoPasteValue=e=>{const t=e!=null?String(e):"",s=this.base.initState();s.syntheticEvent={target:this._element,currentTarget:this._element,nativeEvent:new Event("change",{bubbles:!0})},this.triggerOnChange(t,s),this.applyState(s)},this.handleItemSelect=(e,t)=>{const s=g.getFilteredData(this.props),n=g.getItemValue(s[e],this.props.textField);this.state.text&&!this.mobileMode&&(this.state.text&&(t.data.text=""),this.base.filterChanged("",t)),this._adaptiveInput&&this._adaptiveInput.blur(),this.triggerOnChange(n,t)},this.itemFocus=(e,t)=>{const{textField:s}=this.props,i=g.getFilteredData(this.props)[e];g.areSame(this.state.focusedItem,i,s)||(t.data.focusedItem=i)},this.togglePopup=e=>{this.base.togglePopup(e)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||U)},this.renderAdaptiveListContainer=()=>{const{windowWidth:e=0}=this.state,t=f.createElement(j,{value:this.value,ref:n=>{this._adaptiveInput=n&&n.element},onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode,placeholder:this.props.placeholder}),s={title:this.props.adaptiveTitle||this.props.label,subTitle:this.props.adaptiveSubtitle,expand:this.opened,onClose:n=>this.onCancel(n),windowWidth:e,mobileFilter:t};return f.createElement(H.AdaptiveMode,{...s},f.createElement(W.ActionSheetContent,null,f.createElement("div",{className:"k-list-container"},this.listContainerContent())))},this.onCancel=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.opened&&this.base.togglePopup(t),t.events.push({type:"onCancel"});const s=this.state.text;g.isPresent(s)&&s!==""&&this.base.filterChanged("",t),this.state.text&&(t.data.text=""),this.applyState(t)},this.listContainerContent=()=>{const{header:e,footer:t,size:s,groupStickyHeaderItemRender:n,groupField:i,list:a}=this.props,d=g.getFilteredData(this.props);let{group:o}=this.state;return o===void 0&&i!==void 0&&(o=g.getItemValue(d[0],i)),f.createElement(f.Fragment,null,e&&f.createElement("div",{className:"k-list-header"},e),f.createElement("div",{className:l.classNames("k-list",{[`k-list-${this.mobileMode?"lg":D[s]||s}`]:this.mobileMode||s})},!a&&o&&d.length!==0&&f.createElement(R,{group:o,render:n}),this.renderList()),t&&f.createElement("div",{className:"k-list-footer"},t))},this.onScroll=e=>{this._isScrolling=!0;const{list:t}=this.base,{groupField:s}=this.props;let n=g.getFilteredData(this.props);if(!s||!n.length)return;const i=this.itemHeight||(t?t.children[0].offsetHeight:0),d=e.target.scrollTop;s&&(n=this.base.getGroupedDataModernMode(n,s));let o=n[0][s];for(let r=1;r<n.length&&!(i*r>d);r++)n[r]&&n[r][s]&&(o=n[r][s]);o!==this.state.group&&this.setState({group:o})},this.handleItemClick=(e,t)=>{this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.onChangeHandler=e=>{const s=this.base.initState(),n=this.mobileMode?e.target.element:e.currentTarget,i=n.value,a=n.selectionEnd===i.length;s.syntheticEvent=e;const d=this._suggested,o=this.value,r=o&&o.substring(0,o.length-d.length),c=r&&r===i,p=r&&r.length>i.length,{suggest:b}=this.props,u=this.props.opened!==void 0?this.props.opened:this.state.opened;if(b!==void 0&&b!==!1){c||p||!a?this._suggested="":this.suggestValue(i);const m=i+this._suggested,v={userInput:i,value:this._suggested};this.triggerOnChange(m,s,{suggestion:v})}else this._suggested="",this.triggerOnChange(i,s);(!u&&i||u&&!i)&&this.togglePopup(s),s.data.focusedItem=void 0,this.applyState(s),this.setState({group:void 0})},this.clearButtonClick=e=>{const s=this.base.initState(),n=this.props.opened!==void 0?this.props.opened:this.state.opened;s.syntheticEvent=e;const i="";this._suggested="",this.triggerOnChange(i,s),this.state.focusedItem!==void 0&&(s.data.focusedItem=void 0),n&&this.togglePopup(s),this.applyState(s)},this.onInputKeyDown=e=>{const{skipDisabledItems:t,groupField:s,textField:n}=this.props,i=g.getFilteredData(this.props);this._isScrolling&&(this._isScrolling=!1);const a=this.focusedIndex(),d=i[a],o=e.keyCode,r=e.altKey,c=this.props.opened!==void 0?this.props.opened:this.state.opened,p=this.base.initState();p.syntheticEvent=e;const b=()=>{c&&e.preventDefault()};if(r&&o===l.Keys.down)this.setState({opened:!0});else if(r&&o===l.Keys.up)this.setState({opened:!1});else if(c&&o===l.Keys.pageUp)b(),this.base.scrollPopupByPageSize(-1);else if(c&&o===l.Keys.pageDown)b(),this.base.scrollPopupByPageSize(1);else if(c&&(o===l.Keys.enter||o===l.Keys.esc))b(),t===!1&&d&&d.disabled?(c&&this.togglePopup(p),this.applyState(p)):this.applyInputValue(e.currentTarget.value,p,e.keyCode);else if(!c&&o===l.Keys.esc)this._suggested="",this.triggerOnChange("",p),this.state.focusedItem!==void 0&&(p.data.focusedItem=void 0),this.applyState(p);else if(o===l.Keys.up||o===l.Keys.down){if(s!==""&&n)if(!this.props.skipDisabledItems&&c)this.onNavigate(p,o);else{let u=0;if(o===l.Keys.down||o===l.Keys.right){const m=i.slice(a+1).find(v=>!v.disabled);u=m&&i.indexOf(m)}else if(o===l.Keys.up||o===l.Keys.left){let m;if(a===-1)m=i,u=i.findIndex(v=>!v.disabled);else{m=i.slice(0,a);let v=m.pop();for(;v&&v.disabled;)v=m.pop();u=v&&i.indexOf(v)}}if(u!==void 0){const m=u-a;this.onNavigate(p,o,m)}else u===void 0&&a===i.length-1&&this.onNavigate(p,o)}else if(!this.props.skipDisabledItems&&c)this.onNavigate(p,o);else{let u=null;if(o===l.Keys.down||o===l.Keys.right)u=i.slice(a+1).find(m=>!m.disabled);else if(o===l.Keys.up||o===l.Keys.left){const m=i.slice(0,a);for(u=m.pop();u&&u.disabled;)u=m.pop()}if(u){const m=u.id-a-1;this.onNavigate(p,o,m)}else this.onNavigate(p,o)}this.applyState(p),b()}},this.handleFocus=e=>{this._skipFocusEvent||this.base.handleFocus(e)},this.handleBlur=e=>{const t=this.base.initState();!this.state.focused||this._skipFocusEvent||(t.syntheticEvent=e,t.data.focused=!1,t.events.push({type:"onBlur"}),this.opened&&!this.mobileMode&&(this.state.opened&&(t.data.opened=!1),t.events.push({type:"onClose"})),this.applyState(t))},this.handleWrapperClick=e=>{const t=this._input;!this.opened&&t&&this.focusElement(t);const s=this.base.initState();s.syntheticEvent=e,!this.state.focused&&!this.mobileMode&&(s.events.push({type:"onFocus"}),s.data.focused=!0),this.mobileMode&&window.setTimeout(()=>this._adaptiveInput&&this._adaptiveInput.focus(),300),this.base.togglePopup(s),this.applyState(s)}}get _inputId(){return this.props.id+"-accessibility-id"}get document(){if(l.canUseDOM)return this.element&&this.element.ownerDocument||document}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 e=this.props.validationMessage!==void 0,t=!this.required||this.value!=="",s=this.props.valid!==void 0?this.props.valid:t;return{customError:e,valid:s,valueMissing:this.value===null}}get opened(){return!!(this.props.opened!==void 0?this.props.opened:this.state.opened)}get mobileMode(){var t;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((t=this.props._adaptiveMode)==null?void 0:t.medium)&&this.props.adaptive)}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:y.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:y.defaultProps.required}componentDidUpdate(e,t){var u;const{groupField:s=""}=this.props,n=g.getFilteredData(this.props),{data:i=[]}=e,a=this.focusedIndex(),d=n[a],o=i!==n,r=d!==void 0&&t.focusedItem!==d,c=this.props.opened!==void 0?this.props.opened:this.state.opened,p=e.opened!==void 0?e.opened:t.opened,b=!p&&c;if(s==="")(c&&(r||o)||b)&&this.base.scrollToItem(a);else if(!this._isScrolling){const m=(u=this.base.getGroupedDataModernMode(n,s))==null?void 0:u.indexOf(d);b&&(n&&n.length!==0&&this.base.resetGroupStickyHeader(n[0][s],this),this.base.scrollToItem(m)),c&&p&&r&&this.base.scrollToItem(m)}this.setValidity()}componentDidMount(){var t;this.observerResize=l.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(t=this.document)!=null&&t.body&&this.observerResize&&this.observerResize.observe(this.document.body);const e=this.props.name||this.props.id;this.KendoPasteSubscription=l.subscribeToKendoPaste(this._element,{fieldName:e,onValueChange:s=>{this.handleKendoPasteValue(s)}})}componentWillUnmount(){var e;this.observerResize&&this.observerResize.disconnect(),(e=this.KendoPasteSubscription)==null||e.unsubscribe()}render(){const{dir:e,disabled:t,label:s,className:n,style:i,loading:a,suggest:d,size:o,rounded:r,fillMode:c}=this.props,p=!this.validityStyles||this.validity.valid,b=this.base,u=this.value,m=this.props.clearButton!==!1&&!a&&!!u,v=this.props.id||this._inputId,O=this.state.focused;typeof d=="string"&&(this._suggested=d);const[P,K]=F(this.props.prefix||f.Fragment),[V,L]=F(this.props.suffix||f.Fragment),k=f.createElement(f.Fragment,null,f.createElement("span",{className:l.classNames("k-autocomplete k-input",n,{[`k-input-${D[o]||o}`]:o,[`k-rounded-${$[r]||r}`]:r,[`k-input-${c}`]:c,"k-invalid":!p,"k-focus":O&&!t,"k-loading":a,"k-required":this.required,"k-disabled":t}),ref:S=>{this._element=S,b.wrapper=S},style:s?{...i,width:void 0}:i,dir:e,onFocus:this.mobileMode?S=>this.handleWrapperClick(S):this.handleFocus,onBlur:this.handleBlur,onClick:this.handleWrapperClick},this.props.prefix&&f.createElement(P,{...K}),this.renderSearchBar(u||"",v),a&&f.createElement(l.IconWrap,{className:"k-input-loading-icon",name:"loading"}),m&&!a&&f.createElement(A,{onClick:this.clearButtonClick,key:"clearbutton"}),this.props.suffix&&f.createElement(V,{...L}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return s?f.createElement(z.FloatingLabel,{label:s,editorId:v,editorValue:u,editorValid:p,editorDisabled:t,style:{width:i?i.width:void 0},children:k}):k}onNavigate(e,t,s){const n=this.value,{textField:i,focusedItemIndex:a}=this.props,d=g.getFilteredData(this.props),o=this.state.focusedItem!==void 0?d.findIndex(c=>g.areSame(c,this.state.focusedItem,i)):a?a(d,n,i):d.indexOf(g.getFocusedItem(d,n,i)),r=this.base.navigation.navigate({keyCode:t,current:o,max:d.length-1,min:0,skipItems:s||void 0});r!==void 0&&this.itemFocus(r,e),this.applyState(e)}applyInputValue(e,t,s){const n=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:i}=this.props,a=g.getFilteredData(this.props),d=this.focusedIndex(),o=a[d];if(this._suggested="",n&&s===l.Keys.enter&&o&&!o.disabled){const r=g.getItemValue(a[this.focusedIndex(e)],i);this.triggerOnChange(r,t)}n&&this.togglePopup(t),this.applyState(t)}renderSearchBar(e,t){const s=this.base,{placeholder:n,tabIndex:i,disabled:a,readonly:d,inputAttributes:o}=this.props,{focused:r}=this.state,c=this.props.opened!==void 0?this.props.opened:this.state.opened;return f.createElement(q,{id:t,placeholder:n,tabIndex:i,accessKey:this.props.accessKey,value:e,suggestedText:this._suggested,focused:r,name:this.props.name,ref:p=>{this._input=p&&p.input},onKeyDown:this.onInputKeyDown,onChange:this.onChangeHandler,onFocus:s.handleFocus,onBlur:this.handleBlur,disabled:a,readOnly:d,expanded:c,ariaControls:c?s.listBoxId:void 0,activedescendant:`k-${s.guid}-item-${this.focusedIndex()+1}`,role:"combobox",ariaLabelledBy:this.props.ariaLabelledBy,ariaLabel:this.props.ariaLabel,ariaDescribedBy:this.props.ariaDescribedBy,ariaRequired:this.required,render:this.props.valueRender,inputAttributes:o})}renderListContainer(){const e=this.base,{dir:t,groupField:s}=this.props,n=g.getFilteredData(this.props),i=e.getPopupSettings(),a=this.props.opened!==void 0?this.props.opened:this.state.opened,d=i.width!==void 0?i.width:e.popupWidth;let{group:o}=this.state;return o===void 0&&s!==void 0&&(o=g.getItemValue(n[0],s)),f.createElement(B,{width:d,popupSettings:{...i,anchor:i.anchor||this.element,show:a,popupClass:l.classNames(i.popupClass,"k-list-container","k-autocomplete-popup")},dir:t!==void 0?t:this.base.dirCalculated,itemsCount:[n.length]},this.listContainerContent())}renderList(){const e=this.base,t=_.provideLocalizationService(this),s=e.getPopupSettings(),{textField:n,listNoDataRender:i,itemRender:a,groupHeaderItemRender:d}=this.props,o=g.getFilteredData(this.props),r=this.value,c=this.props.opened!==void 0?this.props.opened:this.state.opened;return f.createElement(N,{id:e.listBoxId,show:c,data:o.slice(),focusedIndex:this.focusedIndex(),value:r,textField:n,valueField:n,highlightSelected:!0,optionsGuid:e.guid,groupField:this.props.groupField,ariaLabel:t.toLanguageString(w.autoCompleteListAriaLabel,w.messages[w.autoCompleteListAriaLabel]),listRef:p=>{e.list=p},wrapperStyle:this.mobileMode?{}:{maxHeight:s.height},wrapperCssClass:"k-list-content",onClick:this.handleItemClick,itemRender:a,groupHeaderItemRender:d,noDataRender:i,onMouseDown:p=>p.preventDefault(),onScroll:this.onScroll})}triggerOnChange(e,t,s){this.value===e&&!s||(t.data.value=e,this._valueDuringOnChange=e,t.events.push({type:"onChange",...s||{}}))}focusElement(e){this._skipFocusEvent=!0,e.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,0)}applyState(e){this.base.applyState(e),this._valueDuringOnChange=void 0}suggestValue(e){if(this._suggested="",e){const{textField:t}=this.props,s=g.getFilteredData(this.props),n=s[g.itemIndexStartsWith(s,e,t)];if(n){const i=g.getItemValue(n,t);e.toLowerCase()!==i.toLowerCase()&&(this._suggested=i.substring(e.length))}}}focusedIndex(e){const{textField:t,focusedItemIndex:s,skipDisabledItems:n}=this.props,i=g.getFilteredData(this.props),a=e!==void 0?e:this.value;if(this.state.focusedItem!==void 0)return i.findIndex(o=>g.areSame(o,this.state.focusedItem,t));if(s)return s(i,a,t);const d=i.indexOf(g.getFocusedItem(i,a,t));return n&&t&&d===-1?i.findIndex(o=>!o.disabled):Math.max(0,d)}calculateMedia(e){for(const t of e)this.setState({windowWidth:t.target.clientWidth})}};y.displayName="AutoComplete",y.propTypes={...x.basicPropTypes,size:h.oneOf(["small","medium","large"]),rounded:h.oneOf(["small","medium","large","full","none"]),fillMode:h.oneOf(["solid","flat","outline"]),groupField:h.string,suggest:h.oneOfType([h.bool,h.string]),placeholder:h.string,value:h.string,defaultValue:h.string,validationMessage:h.string,required:h.bool,readonly:h.bool,clearButton:h.bool,valueRender:h.func,id:h.string,ariaLabelledBy:h.string,ariaLabel:h.string,ariaDescribedBy:h.string,list:h.any,adaptive:h.bool,adaptiveTitle:h.string,adaptiveSubtitle:h.string,onCancel:h.func,skipDisabledItems:h.bool,inputAttributes:h.object},y.defaultProps={...x.defaultProps,size:void 0,rounded:void 0,fillMode:void 0,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let C=y;const M=l.createPropsContext();_.registerForLocalization(C);const E=l.withIdHOC(l.withPropsContext(M,l.withAdaptiveModeContext(C)));E.displayName="KendoReactAutoComplete";exports.AutoComplete=E;exports.AutoCompletePropsContext=M;exports.AutoCompleteWithoutContext=C;