@progress/kendo-react-dropdowns 13.3.0 → 13.4.0-develop.2

package/ComboBox/ComboBox.d.ts

@@ -0,0 +1,279 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { default as PropTypes } from 'prop-types';
+import { ComboBoxProps } from './ComboBoxProps.js';
+import { DropDownStateBase, InternalState } from './../common/settings.js';
+import { default as DropDownBase } from '../common/DropDownBase.js';
+import { FormComponent, FormComponentValidity } from '@progress/kendo-react-common';
+import * as React from 'react';
+/** @hidden */
+export interface ComboBoxState extends DropDownStateBase {
+    filterText?: string;
+    suggestedText?: string;
+    focusedItem?: any;
+    windowWidth?: number;
+}
+/** @hidden */
+export interface ComboInternalState extends InternalState {
+    data: ComboBoxState;
+}
+/** @hidden */
+export declare class ComboBoxWithoutContext extends React.Component<ComboBoxProps, ComboBoxState> implements FormComponent {
+    static displayName: string;
+    /** @hidden */
+    static propTypes: {
+        size: PropTypes.Requireable<"small" | "medium" | "large" | undefined>;
+        rounded: PropTypes.Requireable<"small" | "medium" | "large" | "full" | undefined>;
+        fillMode: PropTypes.Requireable<"flat" | "solid" | "outline" | undefined>;
+        dataItemKey: PropTypes.Requireable<string>;
+        groupField: PropTypes.Requireable<string>;
+        isMultiColumn: PropTypes.Requireable<boolean>;
+        suggest: PropTypes.Requireable<boolean>;
+        placeholder: PropTypes.Requireable<string>;
+        title: PropTypes.Requireable<string>;
+        allowCustom: PropTypes.Requireable<boolean>;
+        ignoreCase: PropTypes.Requireable<boolean>;
+        clearButton: PropTypes.Requireable<boolean>;
+        iconClassName: PropTypes.Requireable<string>;
+        svgIcon: PropTypes.Requireable<PropTypes.InferProps<{
+            name: PropTypes.Validator<string>;
+            content: PropTypes.Validator<string>;
+            viewBox: PropTypes.Validator<string>;
+        }>>;
+        validationMessage: PropTypes.Requireable<string>;
+        required: PropTypes.Requireable<boolean>;
+        id: PropTypes.Requireable<string>;
+        ariaLabelledBy: PropTypes.Requireable<string>;
+        ariaLabel: PropTypes.Requireable<string>;
+        ariaDescribedBy: PropTypes.Requireable<string>;
+        list: PropTypes.Requireable<any>;
+        valueRender: PropTypes.Requireable<(...args: any[]) => any>;
+        skipDisabledItems: PropTypes.Requireable<boolean>;
+        inputAttributes: PropTypes.Requireable<object>;
+        value: PropTypes.Requireable<any>;
+        defaultValue: PropTypes.Requireable<any>;
+        filterable: PropTypes.Requireable<boolean>;
+        filter: PropTypes.Requireable<string>;
+        virtual: PropTypes.Requireable<PropTypes.InferProps<{
+            pageSize: PropTypes.Validator<number>;
+            skip: PropTypes.Validator<number>;
+            total: PropTypes.Validator<number>;
+        }>>;
+        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onPageChange: PropTypes.Requireable<(...args: any[]) => any>;
+        opened: PropTypes.Requireable<boolean>;
+        disabled: PropTypes.Requireable<boolean>;
+        dir: PropTypes.Requireable<string>;
+        tabIndex: PropTypes.Requireable<number>;
+        accessKey: PropTypes.Requireable<string>;
+        data: PropTypes.Requireable<any[]>;
+        textField: PropTypes.Requireable<string>;
+        className: PropTypes.Requireable<string>;
+        label: PropTypes.Requireable<string>;
+        loading: PropTypes.Requireable<boolean>;
+        popupSettings: PropTypes.Requireable<PropTypes.InferProps<{
+            animate: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
+                openDuration: PropTypes.Requireable<number>;
+                closeDuration: PropTypes.Requireable<number>;
+            }> | null | undefined>>;
+            popupClass: PropTypes.Requireable<string>;
+            className: PropTypes.Requireable<string>;
+            appendTo: PropTypes.Requireable<any>;
+            width: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+            height: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+        }>>;
+        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        itemRender: PropTypes.Requireable<(...args: any[]) => any>;
+        listNoDataRender: PropTypes.Requireable<(...args: any[]) => any>;
+        focusedItemIndex: PropTypes.Requireable<(...args: any[]) => any>;
+        header: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        footer: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    };
+    /** @hidden */
+    static defaultProps: {
+        size: "small" | "medium" | "large" | undefined;
+        rounded: "small" | "medium" | "large" | "full" | undefined;
+        fillMode: "flat" | "solid" | "outline" | undefined;
+        allowCustom: boolean;
+        ignoreCase: boolean;
+        clearButton: boolean;
+        required: boolean;
+        isMultiColumn: boolean;
+        skipDisabledItems: boolean;
+        prefix: undefined;
+        suffix: undefined;
+        popupSettings: {
+            height: string;
+        };
+        validityStyles: boolean;
+    };
+    /** @hidden */
+    readonly state: ComboBoxState;
+    protected readonly base: DropDownBase;
+    private _element;
+    private get _inputId();
+    private _valueDuringOnChange;
+    private _valueOnDidUpdate;
+    private _suggested;
+    private _skipBlur;
+    private _input;
+    private _adaptiveFilterInput;
+    private _skipFocus;
+    private itemHeight;
+    private duplicates;
+    private hasDuplicates;
+    private navigationIndex;
+    private observerResize?;
+    protected scrollToFocused: boolean;
+    private readonly showLicenseWatermark;
+    private readonly licenseMessage?;
+    private get document();
+    constructor(props: ComboBoxProps);
+    /** @hidden */
+    focus: () => void;
+    /** @hidden */
+    get element(): HTMLSpanElement | null;
+    /**
+     * The mobile mode of the ComboBox.
+     */
+    get mobileMode(): boolean;
+    /**
+     * The value of the ComboBox.
+     */
+    get value(): any;
+    /**
+     * The index of the selected item.
+     */
+    get index(): number;
+    /**
+     * Gets the `name` property of the ComboBox.
+     */
+    get name(): string | undefined;
+    /**
+     * Represents the validity state into which the component is set.
+     */
+    get validity(): FormComponentValidity;
+    protected get validityStyles(): boolean;
+    /** @hidden */
+    protected get required(): boolean;
+    /**
+     * @hidden
+     * Executed when no dataItemKey and textField are provided
+     */
+    private checkForDuplicatePlainTextRecords;
+    /** @hidden */
+    componentDidUpdate(prevProps: ComboBoxProps, prevState: ComboBoxState): void;
+    /** @hidden */
+    componentDidMount(): void;
+    /** @hidden */
+    componentWillUnmount(): void;
+    /** @hidden */
+    render(): React.JSX.Element;
+    /** @hidden */
+    handleItemSelect: (index: number, state: ComboInternalState) => void;
+    /** @hidden */
+    onNavigate(state: InternalState, keyCode: number, skipItems?: number): void;
+    private onPopupOpened;
+    private componentRef;
+    private getCurrentValueDisabledStatus;
+    private toggleBtnClick;
+    private applyValueOnEnter;
+    private closeOpenedApplyStateNonMobileMode;
+    private applyValueOnRejectSuggestions;
+    private selectFocusedItem;
+    private renderAdaptiveListContainer;
+    private renderMobileListFilter;
+    private renderListContainer;
+    private listContainerContent;
+    private renderList;
+    private handleMobileFilterChange;
+    private renderSearchBar;
+    private onScroll;
+    private handleItemClick;
+    private handleBlur;
+    private onInputClick;
+    private onInputKeyDown;
+    private inputOnChange;
+    private clearValue;
+    private clearButtonClick;
+    private clearValueOnEnterOrEsc;
+    private clearValueOnBlur;
+    private clearValueOnToggleBtnClick;
+    private triggerOnChange;
+    private getFocusedIndex;
+    private suggestValue;
+    private applyState;
+    private setValidity;
+    private calculateMedia;
+    private handleFocus;
+}
+/**
+ * Represents the PropsContext of the `ComboBox` component.
+ * Used for global configuration of all `ComboBox` instances.
+ *
+ * For more information, refer to the [Dropdowns Props Context](https://www.telerik.com/kendo-react-ui/components/dropdowns/props-context) article.
+ */
+export declare const ComboBoxPropsContext: React.Context<(p: ComboBoxProps) => ComboBoxProps>;
+/**
+ * Represent the `ref` of the ComboBox component.
+ */
+export interface ComboBoxHandle extends Pick<ComboBoxWithoutContext, keyof ComboBoxWithoutContext> {
+    /**
+     * The ComboBox element.
+     */
+    element: HTMLSpanElement | null;
+    /**
+     * The index of the selected item.
+     */
+    index: number;
+    /**
+     * Gets the mobile mode of the ComboBox component.
+     */
+    mobileMode: boolean;
+    /**
+     * Gets the `name` property of the ComboBox.
+     */
+    name: string | undefined;
+    /**
+     * Represents the validity state into which the component is set.
+     */
+    validity: FormComponentValidity;
+    /**
+     * The value of the ComboBox.
+     */
+    value: any;
+}
+/** @hidden */
+export type ComboBox = ComboBoxHandle;
+/**
+ * Represents the [KendoReact ComboBox component](https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox).
+ *
+ * Accepts properties of type [ComboBoxProps](https://www.telerik.com/kendo-react-ui/components/dropdowns/api/comboboxprops).
+ * Obtaining the `ref` returns an object of type [ComboBoxHandle](https://www.telerik.com/kendo-react-ui/components/dropdowns/api/comboboxhandle).
+ *
+ * @example
+ * ```jsx
+ * const App = () => {
+ *    const combobox = React.useRef(null);
+ *    return (
+ *       <div>
+ *           <ComboBox
+ *               data={[ "Albania", "Andorra", "Austria", "Belarus" ]}
+ *               ref={combobox}
+ *           />
+ *           <Button onClick={() => alert(combobox.current.value)}>alert value</Button>
+ *       </div>
+ *    );
+ * }
+ * ```
+ */
+export declare const ComboBox: React.ForwardRefExoticComponent<ComboBoxProps & React.RefAttributes<any>>;

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