@progress/kendo-react-dropdowns 8.2.0-develop.4 → 8.2.0-develop.40

package/ComboBox/ComboBox.mjs

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