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

package/ComboBox/ComboBox.mjs

@@ -8,13 +8,13 @@
 import * as g from "react";
 import m from "prop-types";
 import _ from "../common/DropDownBase.mjs";
-import { classNames as S, uComboBox as k, Keys as y, validatePackage as et, getLicenseMessage as st, svgIconPropType as it, canUseDOM as R, IconWrap as ot, WatermarkOverlay as at, createPropsContext as nt, withIdHOC as lt, withPropsContext as rt, withUnstyledHOC as pt, withAdaptiveModeContext as dt } from "@progress/kendo-react-common";
+import { classNames as S, uComboBox as F, Keys as I, validatePackage as et, getLicenseMessage as st, svgIconPropType as it, canUseDOM as A, IconWrap as ot, WatermarkOverlay as at, createPropsContext as nt, withIdHOC as lt, withPropsContext as rt, withUnstyledHOC as pt, withAdaptiveModeContext as dt } from "@progress/kendo-react-common";
 import { FloatingLabel as ht } from "@progress/kendo-react-labels";
-import { getPlainDataDuplicates as ut, getFilteredData as C, areSame as D, getItemValue as w, isPresent as F, getItemIndexByText as A, suggestValue as ct, itemIndexStartsWith as z } from "../common/utils.mjs";
+import { getPlainDataDuplicates as ct, getFilteredData as y, areSame as D, getItemValue as w, isPresent as k, getItemIndexByText as z, suggestValue as ut, itemIndexStartsWith as P } from "../common/utils.mjs";
 import gt from "../common/SearchBar.mjs";
 import mt from "../common/ListContainer.mjs";
-import vt from "../common/List.mjs";
-import ft from "../common/ListFilter.mjs";
+import ft from "../common/List.mjs";
+import vt from "../common/ListFilter.mjs";
 import K from "../common/GroupStickyHeader.mjs";
 import { packageMetadata as H } from "../package-metadata.mjs";
 import bt from "../common/ClearButton.mjs";
@@ -25,18 +25,18 @@ import { provideLocalizationService as U } from "@progress/kendo-react-intl";
 import { ActionSheetContent as yt } from "@progress/kendo-react-layout";
 import j from "../common/withCustomComponent.mjs";
 import { AdaptiveMode as Ct } from "../common/AdaptiveMode.mjs";
-const St = "Please enter a valid value!", M = class M extends g.Component {
+const St = "Please enter a valid value!", E = class E extends g.Component {
   constructor(s) {
-    super(s), this.state = {}, this.base = new _(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.showLicenseWatermark = !1, this.focus = () => {
+    super(s), this.state = {}, this.base = new _(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 t = this.props.textField !== void 0, e = this.props.dataItemKey !== void 0;
       if (this.props.data && this.props.data.length > 0 && !t && !e) {
         const i = this.props.data;
-        this.duplicates = ut(i), this.hasDuplicates = this.duplicates.length > 0;
+        this.duplicates = ct(i), this.hasDuplicates = this.duplicates.length > 0;
       }
     }, this.handleItemSelect = (t, e) => {
-      const { virtual: i, dataItemKey: r } = this.props, n = C(this.props), a = i ? i.skip : 0, p = n[t - a], l = this.hasDuplicates || !D(p, this.value, r);
+      const { virtual: i, dataItemKey: r } = this.props, n = y(this.props), a = i ? i.skip : 0, p = n[t - a], l = this.hasDuplicates || !D(p, this.value, r);
       this.triggerOnChange(p, e), this.state.text !== void 0 && (e.data.text = void 0), l && this.base.triggerPageChangeCornerItems(p, e);
     }, this.onPopupOpened = () => {
       setTimeout(() => {
@@ -46,7 +46,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       this._element = t, this.base.wrapper = t;
     }, this.toggleBtnClick = (t) => {
       this._skipFocus = !0;
-      const { skipDisabledItems: e, textField: i } = this.props, r = C(this.props), n = this.getFocusedIndex(), a = this.getCurrentValueDisabledStatus(i, r, n), p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, l = this.base.initState();
+      const { skipDisabledItems: e, textField: i } = this.props, r = y(this.props), n = this.getFocusedIndex(), a = this.getCurrentValueDisabledStatus(i, r, n), p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, l = this.base.initState();
       if (l.syntheticEvent = t, !e && i && a && this.clearValueOnToggleBtnClick(t), this.base.togglePopup(l), !p && this.mobileMode) {
         const o = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text || null;
         this.base.filterChanged(o, l);
@@ -57,9 +57,9 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     }, this.closeOpenedApplyStateNonMobileMode = (t, e) => {
       e && !this.mobileMode && this.base.togglePopup(t);
     }, this.renderMobileListFilter = () => {
-      const t = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, e = w(this.value, this.props.textField), i = F(t) ? t : e;
+      const t = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, e = w(this.value, this.props.textField), i = k(t) ? t : e;
       return /* @__PURE__ */ g.createElement(
-        ft,
+        vt,
         {
           value: i,
           ref: (r) => {
@@ -74,13 +74,13 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         }
       );
     }, this.listContainerContent = () => {
-      const { header: t, footer: e, size: i, groupStickyHeaderItemRender: r, groupField: n, list: a, groupMode: p, unstyled: l, virtual: o } = this.props, h = C(this.props), d = l && l.uComboBox;
-      let { group: v } = this.state;
-      return v === void 0 && n !== void 0 && (v = w(h[0], n)), /* @__PURE__ */ g.createElement(
+      const { header: t, footer: e, size: i, groupStickyHeaderItemRender: r, groupField: n, list: a, groupMode: p, unstyled: l, virtual: o } = this.props, c = y(this.props), d = l && l.uComboBox;
+      let { group: b } = this.state;
+      return b === void 0 && n !== void 0 && (b = w(c[0], n)), /* @__PURE__ */ g.createElement(
         "div",
         {
           className: S(
-            k.list({
+            F.list({
               c: d,
               list: a,
               size: "large",
@@ -89,13 +89,13 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
             })
           )
         },
-        t && /* @__PURE__ */ g.createElement("div", { className: S(k.listHeader({ c: d })) }, t),
-        !a && v && h.length !== 0 && /* @__PURE__ */ g.createElement(K, { group: v, groupMode: p, render: r }),
+        t && /* @__PURE__ */ g.createElement("div", { className: S(F.listHeader({ c: d })) }, t),
+        !a && b && c.length !== 0 && /* @__PURE__ */ g.createElement(K, { group: b, groupMode: p, render: r }),
         this.renderList(),
         e && /* @__PURE__ */ g.createElement(
           "div",
           {
-            className: S(k.listFooter({ c: d }), this.props.footerClassName)
+            className: S(F.listFooter({ c: d }), this.props.footerClassName)
           },
           e
         )
@@ -107,14 +107,14 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       const { vs: e, list: i } = this.base;
       e.scrollHandler(t);
       const { groupField: r } = this.props;
-      let n = C(this.props);
+      let n = y(this.props);
       if (!r || !n.length)
         return;
       const a = this.itemHeight = this.itemHeight || (e.enabled ? e.itemHeight : i ? i.children[0].offsetHeight : 0), l = t.target.scrollTop - e.skip * a;
       this.props.groupMode === "modern" && (n = this.base.getGroupedDataModernMode(n, r));
       let o = n[0][r];
-      for (let h = 1; h < n.length && !(a * h > l); h++)
-        n[h] && n[h][r] && (o = n[h][r]);
+      for (let c = 1; c < n.length && !(a * c > l); c++)
+        n[c] && n[c][r] && (o = n[c][r]);
       o !== this.state.group && (this.setState({
         group: o
       }), this.props.onGroupScroll && this.props.onGroupScroll.call(void 0, { group: o }));
@@ -122,7 +122,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       this.navigationIndex = t, this.base.handleItemClick(t, e), this._valueDuringOnChange = void 0;
     }, this.handleBlur = (t) => {
       if (this.state.focused && !this._skipBlur) {
-        const e = this.base.initState(), { textField: i } = this.props, r = C(this.props), n = this.getFocusedIndex(), p = !(n === -1) && this.getCurrentValueDisabledStatus(i, r, n);
+        const e = this.base.initState(), { textField: i } = this.props, r = y(this.props), n = this.getFocusedIndex(), p = !(n === -1) && this.getCurrentValueDisabledStatus(i, r, n);
         e.data.focused = !1, e.events.push({ type: "onBlur" }), e.syntheticEvent = t, i && p && this.clearValueOnBlur(t), this.applyValueOnRejectSuggestions(t.currentTarget.value, e);
       }
     }, this.onInputClick = (t) => {
@@ -132,59 +132,59 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         r.syntheticEvent = t, this.base.togglePopup(r), this.base.filterChanged(i, r), this.applyState(r);
       }
     }, this.onInputKeyDown = (t) => {
-      const { skipDisabledItems: e, textField: i, dataItemKey: r, groupField: n } = this.props, a = C(this.props), p = this.value, l = Math.max(
+      const { skipDisabledItems: e, textField: i, dataItemKey: r, groupField: n } = this.props, a = y(this.props), p = this.value, l = Math.max(
         0,
         a.findIndex((u) => D(u, p, r))
-      ), o = t.keyCode, h = this.props.opened !== void 0 ? this.props.opened : this.state.opened, d = this.base.initState();
-      if (d.syntheticEvent = t, !t.altKey && (o === y.up || o === y.down)) {
+      ), o = t.keyCode, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, d = this.base.initState();
+      if (d.syntheticEvent = t, !t.altKey && (o === I.up || o === I.down)) {
         if (t.preventDefault(), n !== "" && i)
-          if (!this.props.skipDisabledItems && h)
+          if (!this.props.skipDisabledItems && c)
             this.onNavigate(d, o);
           else {
             let u = 0;
-            if (o === y.down || o === y.right) {
-              const c = a.slice(l + 1 < a.length ? l + 1 : l).find((f) => !f.disabled && f[i]);
-              u = c && a.findIndex((f) => f[i] === c[i]);
-            } else if (o === y.up || o === y.left) {
-              let c;
+            if (o === I.down || o === I.right) {
+              const h = a.slice(l + 1 < a.length ? l + 1 : l).find((v) => !v.disabled && v[i]);
+              u = h && a.findIndex((v) => v[i] === h[i]);
+            } else if (o === I.up || o === I.left) {
+              let h;
               if (l === 0)
-                c = a, u = a.findIndex((f) => !f.disabled && f[i]);
+                h = a, u = a.findIndex((v) => !v.disabled && v[i]);
               else {
-                c = a.slice(0, l);
-                let f = c.pop();
-                for (; f && f.disabled; )
-                  f = c.pop();
-                u = f && a.findIndex((E) => E[i] === f[i]);
+                h = a.slice(0, l);
+                let v = h.pop();
+                for (; v && v.disabled; )
+                  v = h.pop();
+                u = v && a.findIndex((M) => M[i] === v[i]);
               }
             }
             if (u !== void 0) {
-              const c = u - l;
-              this.onNavigate(d, o, c);
-            } else u === void 0 && a.findIndex((c) => c[i] === p[i]) === a.length - 1 && this.onNavigate(d, o);
+              const h = u - l;
+              this.onNavigate(d, o, h);
+            } else u === void 0 && a.findIndex((h) => h[i] === p[i]) === a.length - 1 && this.onNavigate(d, o);
           }
-        else if (!this.props.skipDisabledItems && h)
+        else if (!this.props.skipDisabledItems && c)
           this.onNavigate(d, o);
         else {
           let u = null;
-          if (o === y.down || o === y.right)
-            u = a.slice(l + 1).find((c) => !c.disabled);
-          else if (o === y.up || o === y.left) {
-            const c = a.slice(0, l);
-            for (u = c.pop(); u && u.disabled; )
-              u = c.pop();
+          if (o === I.down || o === I.right)
+            u = a.slice(l + 1).find((h) => !h.disabled);
+          else if (o === I.up || o === I.left) {
+            const h = a.slice(0, l);
+            for (u = h.pop(); u && u.disabled; )
+              u = h.pop();
           }
           if (u) {
-            const c = u.id - l - 1;
-            this.onNavigate(d, o, c);
+            const h = u.id - l - 1;
+            this.onNavigate(d, o, h);
           } else
             this.onNavigate(d, o);
         }
         this.applyState(d);
       }
-      const v = () => {
+      const b = () => {
         t.preventDefault(), this.base.togglePopup(d), this.applyState(d);
-      }, x = this.getFocusedIndex(), I = x === -1, b = !I && this.getCurrentValueDisabledStatus(i, a, x);
-      h ? o === y.pageUp ? (t.preventDefault(), this.base.scrollPopupByPageSize(-1)) : o === y.pageDown ? (t.preventDefault(), this.base.scrollPopupByPageSize(1)) : t.altKey && o === y.up ? v() : o === y.enter ? (t.preventDefault(), (i && !I && t.currentTarget.value ? a[x][i] : void 0) ? !e && i && b ? this.clearValueOnEnterOrEsc(t) : b || this.applyValueOnEnter(t.currentTarget.value, d) : this.applyValueOnEnter(t.currentTarget.value, d)) : o === y.esc && (!e && i && b && this.clearValueOnEnterOrEsc(t), this.applyValueOnRejectSuggestions(t.currentTarget.value, d)) : !h && o === y.esc ? this.clearValueOnEnterOrEsc(t) : t.altKey && o === y.down && v();
+      }, x = this.getFocusedIndex(), C = x === -1, f = !C && this.getCurrentValueDisabledStatus(i, a, x);
+      c ? o === I.pageUp ? (t.preventDefault(), this.base.scrollPopupByPageSize(-1)) : o === I.pageDown ? (t.preventDefault(), this.base.scrollPopupByPageSize(1)) : t.altKey && o === I.up ? b() : o === I.enter ? (t.preventDefault(), (i && !C && t.currentTarget.value ? a[x][i] : void 0) ? !e && i && f ? this.clearValueOnEnterOrEsc(t) : f || this.applyValueOnEnter(t.currentTarget.value, d) : this.applyValueOnEnter(t.currentTarget.value, d)) : o === I.esc && (!e && i && f && this.clearValueOnEnterOrEsc(t), this.applyValueOnRejectSuggestions(t.currentTarget.value, d)) : !c && o === I.esc ? this.clearValueOnEnterOrEsc(t) : t.altKey && o === I.down && b();
     }, this.inputOnChange = (t) => {
       const e = this.base.initState();
       e.syntheticEvent = t;
@@ -192,11 +192,11 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       if (this.props.suggest) {
         const a = r.selectionEnd === n.length;
         let p = this.props.filter !== void 0 ? this.props.filter : this.state.text;
-        F(p) || (p = w(this.value, this.props.textField) || "");
+        k(p) || (p = w(this.value, this.props.textField) || "");
         const l = p && p === n, o = p && p.length > n.length;
         l || o || !a ? this._suggested = "" : this.suggestValue(n);
       }
-      this.props.filter === void 0 && (e.data.text = n), this.state.focusedItem !== void 0 && (e.data.focusedItem = void 0), i || this.base.togglePopup(e), this.base.filterChanged(n, e), this.applyState(e), this.setState({ group: void 0 });
+      this.props.filter === void 0 && (e.data.text = n), this.state.focusedItem !== void 0 && (e.data.focusedItem = void 0), i ? this.scrollToFocused = !0 : this.base.togglePopup(e), this.base.filterChanged(n, e), this.applyState(e), this.setState({ group: void 0 });
     }, this.clearButtonClick = (t) => {
       const e = this.base.initState();
       e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
@@ -226,7 +226,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     return this.props.id;
   }
   get document() {
-    if (R)
+    if (A)
       return this.element && this.element.ownerDocument || document;
   }
   /** @hidden */
@@ -257,7 +257,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
    * The index of the selected item.
    */
   get index() {
-    const { dataItemKey: s } = this.props, t = C(this.props), e = this.value;
+    const { dataItemKey: s } = this.props, t = y(this.props), e = this.value;
     return t.findIndex((i) => D(i, e, s));
   }
   /**
@@ -278,33 +278,40 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     };
   }
   get validityStyles() {
-    return this.props.validityStyles !== void 0 ? this.props.validityStyles : M.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 : M.defaultProps.required;
+    return this.props.required !== void 0 ? this.props.required : E.defaultProps.required;
   }
   /** @hidden */
   componentDidUpdate(s, t) {
-    var v;
-    const { dataItemKey: e, virtual: i, groupField: r = "", textField: n } = this.props, a = C(this.props), p = s.virtual ? s.virtual.total : 0, l = this.props.opened !== void 0 ? this.props.opened : this.state.opened, o = s.opened !== void 0 ? s.opened : t.opened;
+    var b, x;
+    const { dataItemKey: e, virtual: i, groupField: r = "", textField: n } = this.props, a = y(this.props), p = s.virtual ? s.virtual.total : 0, l = this.props.opened !== void 0 ? this.props.opened : this.state.opened, o = s.opened !== void 0 ? s.opened : t.opened;
     s.data !== a && this.checkForDuplicatePlainTextRecords();
-    const h = !o && l, d = this.value;
+    const c = !o && l, d = this.value;
     if (this._valueOnDidUpdate = d, this.base.didUpdate(), i && i.total !== p)
       this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
     else {
-      const x = s.value !== void 0 ? s.value : t.value;
-      let I = this.hasDuplicates ? this.navigationIndex || 0 : a.findIndex((u) => D(u, d, e));
-      this.props.groupMode === "modern" && n && d && (I = (v = this.base.getGroupedDataModernMode(a, r)) == null ? void 0 : v.map((u) => u[n]).indexOf(d[n]));
-      const b = !D(x, d, e);
-      h && i ? this.base.scrollToVirtualItem(i, I) : h && !i ? (this.onPopupOpened(), a && a.length !== 0 && this.base.resetGroupStickyHeader(a[0][r], this), this.base.scrollToItem(I)) : (this.hasDuplicates || l && o && d && b) && this.base.scrollToItem(I);
+      const C = s.value !== void 0 ? s.value : t.value;
+      let f = this.hasDuplicates ? this.navigationIndex || 0 : a.findIndex((h) => D(h, d, e));
+      this.props.groupMode === "modern" && n && d && (f = (b = this.base.getGroupedDataModernMode(a, r)) == null ? void 0 : b.map((h) => h[n]).indexOf(d[n]));
+      const u = !D(C, d, e);
+      if (c && i ? this.base.scrollToVirtualItem(i, f) : c && !i ? (this.onPopupOpened(), a && a.length !== 0 && this.base.resetGroupStickyHeader(a[0][r], this), this.base.scrollToItem(f)) : (this.hasDuplicates || l && o && d && u) && this.base.scrollToItem(f), l && o && this.scrollToFocused) {
+        const h = (x = this.props.filter ? this.props.filter : this.state.text) != null ? x : "";
+        if (h) {
+          const { focusedItemIndex: v = P } = this.props, M = v(a, h, n);
+          this.base.scrollToItem(M);
+        } else
+          this.base.scrollToItem(0);
+      }
     }
-    h && this._input && this._input.focus(), this.setValidity();
+    this.scrollToFocused = !1, c && this._input && this._input.focus(), this.setValidity();
   }
   /** @hidden */
   componentDidMount() {
     var s;
-    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();
+    this.observerResize = A && 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() {
@@ -322,34 +329,34 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     ), {
       dir: e,
       disabled: i,
-      clearButton: r = M.defaultProps.clearButton,
+      clearButton: r = E.defaultProps.clearButton,
       label: n,
       textField: a,
       className: p,
       style: l,
       loading: o,
-      iconClassName: h,
+      iconClassName: c,
       virtual: d,
-      size: v,
+      size: b,
       rounded: x,
-      fillMode: I,
-      opened: b = this.state.opened,
+      fillMode: C,
+      opened: f = this.state.opened,
       placeholder: u,
-      svgIcon: c,
-      unstyled: f
-    } = this.props, E = !this.validityStyles || this.validity.valid, O = this.props.filter !== void 0 ? this.props.filter : this.state.text, $ = w(this.value, a), V = F(O) ? O : $, Y = r && (!!V || F(this.value)), B = this.base.vs, L = this.props.id || this._inputId, T = f && f.uComboBox;
+      svgIcon: h,
+      unstyled: v
+    } = this.props, M = !this.validityStyles || this.validity.valid, O = this.props.filter !== void 0 ? this.props.filter : this.state.text, $ = w(this.value, a), T = k(O) ? O : $, Y = r && (!!T || k(this.value)), B = this.base.vs, N = this.props.id || this._inputId, V = v && v.uComboBox;
     B.enabled = d !== void 0, d !== void 0 && (B.skip = d.skip, B.total = d.total, B.pageSize = d.pageSize);
-    const [J, Q] = j(this.props.prefix || g.Fragment), [X, Z] = j(this.props.suffix || g.Fragment), N = /* @__PURE__ */ g.createElement(g.Fragment, null, /* @__PURE__ */ g.createElement(
+    const [J, Q] = j(this.props.prefix || g.Fragment), [X, Z] = j(this.props.suffix || g.Fragment), R = /* @__PURE__ */ g.createElement(g.Fragment, null, /* @__PURE__ */ g.createElement(
       "span",
       {
         className: S(
-          k.wrapper({
-            c: T,
-            size: v,
+          F.wrapper({
+            c: V,
+            size: b,
             rounded: x,
-            fillMode: I,
+            fillMode: C,
             disabled: i,
-            invalid: !E,
+            invalid: !M,
             loading: o,
             required: this.required
           }),
@@ -361,12 +368,12 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         onFocus: this.handleFocus
       },
       this.props.prefix && /* @__PURE__ */ g.createElement(J, { ...Q }),
-      this.renderSearchBar(V || "", L, u),
+      this.renderSearchBar(T || "", N, u),
       Y && !o && /* @__PURE__ */ g.createElement(bt, { onClick: this.clearButtonClick, key: "clearbutton" }),
       o && /* @__PURE__ */ g.createElement(
         ot,
         {
-          className: S(k.loadingIcon({ c: T })),
+          className: S(F.loadingIcon({ c: V })),
           name: "loading",
           key: "loading"
         }
@@ -377,15 +384,15 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         {
           tabIndex: -1,
           type: "button",
-          "aria-label": b ? t : s,
-          icon: h ? void 0 : "caret-alt-down",
-          svgIcon: c || It,
-          iconClass: h,
-          size: v,
-          fillMode: I,
+          "aria-label": f ? t : s,
+          icon: c ? void 0 : "caret-alt-down",
+          svgIcon: h || It,
+          iconClass: c,
+          size: b,
+          fillMode: C,
           rounded: null,
           themeColor: "base",
-          className: S(k.inputButton({ c: T })),
+          className: S(F.inputButton({ c: V })),
           onClick: this.toggleBtnClick,
           onMouseDown: (tt) => tt.preventDefault()
         }
@@ -396,24 +403,24 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       ht,
       {
         label: n,
-        editorId: L,
-        editorValue: V,
-        editorValid: E,
+        editorId: N,
+        editorValue: T,
+        editorValid: M,
         editorDisabled: i,
         style: { width: l ? l.width : void 0 },
-        children: N,
-        unstyled: f
+        children: R,
+        unstyled: v
       }
-    ) : N;
+    ) : R;
   }
   /** @hidden */
   onNavigate(s, t, e) {
-    const { virtual: i = { skip: 0 } } = this.props, r = C(this.props), n = this.props.filter ? this.props.filter : this.state.text;
+    const { virtual: i = { skip: 0 } } = this.props, r = y(this.props), n = this.props.filter ? this.props.filter : this.state.text;
     let a = -1, p;
     const l = this.base.vs, o = this.value;
     this._suggested = "";
-    const h = this.hasDuplicates && this.duplicates.indexOf(o) !== -1;
-    if (a = this.getFocusedIndex(h), a !== -1 && !F(o))
+    const c = this.hasDuplicates && this.duplicates.indexOf(o) !== -1;
+    if (a = this.getFocusedIndex(c), a !== -1 && !k(o))
       this.handleItemSelect(a, s);
     else if (n === "")
       this.handleItemSelect(0, s);
@@ -433,7 +440,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     return s && t && t[e] && t[e].disabled;
   }
   applyValueOnEnter(s, t) {
-    const { textField: e, allowCustom: i } = this.props, r = C(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened, p = w(this.value, e) === s ? this.index : A(r, s, e), l = p !== -1;
+    const { textField: e, allowCustom: i } = this.props, r = y(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened, p = w(this.value, e) === s ? this.index : z(r, s, e), l = p !== -1;
     let o;
     if (this._suggested = "", l)
       o = r[p];
@@ -444,19 +451,19 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
     this.triggerOnChange(o, t), n && this.base.togglePopup(t), this.props.filter === void 0 && this.state.text !== void 0 && (t.data.text = void 0), this.applyState(t);
   }
   applyValueOnRejectSuggestions(s, t) {
-    const { textField: e, allowCustom: i } = this.props, r = C(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened, a = w(this.value, e);
-    if (this._suggested = "", s === a || s === "" && !F(a))
+    const { textField: e, allowCustom: i } = this.props, r = y(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened, a = w(this.value, e);
+    if (this._suggested = "", s === a || s === "" && !k(a))
       return this.closeOpenedApplyStateNonMobileMode(t, n), this.applyState(t);
-    const p = A(r, s, e, !0), l = p !== -1;
+    const p = z(r, s, e, !0), l = p !== -1;
     let o = null;
     l ? o = r[p] : i && (o = s ? e ? { [e]: s } : s : null), this.triggerOnChange(o, t), this.state.text !== void 0 && (t.data.text = void 0, this.base.filterChanged("", t)), this.closeOpenedApplyStateNonMobileMode(t, n), this.applyState(t);
   }
   selectFocusedItem(s, t) {
-    const e = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { textField: i, virtual: r = { skip: 0 }, focusedItemIndex: n = z } = this.props, a = C(this.props), p = r.skip, l = s === "" && p === 0 ? 0 : n(a, s, i);
+    const e = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { textField: i, virtual: r = { skip: 0 }, focusedItemIndex: n = P } = this.props, a = y(this.props), p = r.skip, l = s === "" && p === 0 ? 0 : n(a, s, i);
     return l !== -1 ? this.handleItemSelect(l + p, t) : (this.triggerOnChange(null, t), this.state.text !== void 0 && (t.data.text = void 0)), e && this.base.togglePopup(t), this.applyState(t);
   }
   renderAdaptiveListContainer() {
-    const { windowWidth: s = 0 } = this.state, { groupField: t, adaptiveTitle: e = this.props.label, adaptiveSubtitle: i } = this.props, r = C(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    const { windowWidth: s = 0 } = this.state, { groupField: t, adaptiveTitle: e = this.props.label, adaptiveSubtitle: i } = this.props, r = y(this.props), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
     let { group: a } = this.state;
     a === void 0 && t !== void 0 && (a = w(r[0], t));
     const p = {
@@ -480,21 +487,21 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       list: p,
       virtual: l,
       groupStickyHeaderItemRender: o,
-      unstyled: h
-    } = this.props, d = C(this.props), v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, x = s.getPopupSettings(), I = x.width !== void 0 ? x.width : s.popupWidth, b = h && h.uComboBox;
+      unstyled: c
+    } = this.props, d = y(this.props), b = this.props.opened !== void 0 ? this.props.opened : this.state.opened, x = s.getPopupSettings(), C = x.width !== void 0 ? x.width : s.popupWidth, f = c && c.uComboBox;
     let { group: u } = this.state;
     return u === void 0 && r !== void 0 && (u = w(d[0], r)), /* @__PURE__ */ g.createElement(
       mt,
       {
-        width: I,
+        width: C,
         popupSettings: {
           ...x,
           anchor: x.anchor || this.element,
-          show: v,
+          show: b,
           popupClass: S(
             x.popupClass,
-            k.listContainer({
-              c: b,
+            F.listContainer({
+              c: f,
               popup: !0
             })
           )
@@ -506,8 +513,8 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         "div",
         {
           className: S(
-            k.list({
-              c: b,
+            F.list({
+              c: f,
               list: p,
               size: a,
               tableSize: a,
@@ -515,14 +522,14 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
             })
           )
         },
-        e && /* @__PURE__ */ g.createElement("div", { className: S(k.listHeader({ c: b })) }, e),
+        e && /* @__PURE__ */ g.createElement("div", { className: S(F.listHeader({ c: f })) }, e),
         !p && u && d.length !== 0 && /* @__PURE__ */ g.createElement(K, { group: u, groupMode: n, render: o }),
         this.renderList(),
         i && /* @__PURE__ */ g.createElement(
           "div",
           {
             className: S(
-              k.listFooter({ c: b }),
+              F.listFooter({ c: f }),
               this.props.footerClassName
             )
           },
@@ -541,16 +548,16 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       groupHeaderItemRender: n,
       virtual: a = { skip: 0, total: void 0 },
       unstyled: p
-    } = this.props, l = C(this.props), o = s.getPopupSettings(), h = s.vs, d = a.skip, v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, x = `translateY(${h.translate}px)`, I = v ? this.getFocusedIndex(this.hasDuplicates) : void 0, b = this.props.filter !== void 0 ? this.props.filter : this.state.text, u = w(this.value, t), c = F(b) && b !== u ? null : this.value, f = this.props.list || vt, E = p && p.uComboBox;
+    } = this.props, l = y(this.props), o = s.getPopupSettings(), c = s.vs, d = a.skip, b = this.props.opened !== void 0 ? this.props.opened : this.state.opened, x = `translateY(${c.translate}px)`, C = b ? this.getFocusedIndex(this.hasDuplicates) : void 0, f = this.props.filter !== void 0 ? this.props.filter : this.state.text, u = w(this.value, t), h = k(f) && f !== u ? null : this.value, v = this.props.list || ft, M = p && p.uComboBox;
     return /* @__PURE__ */ g.createElement(
-      f,
+      v,
       {
         id: s.listBoxId,
         virtual: !!a,
-        show: v,
+        show: b,
         data: l,
-        focusedIndex: I,
-        value: c,
+        focusedIndex: C,
+        value: h,
         textField: t,
         valueField: e,
         groupField: this.props.groupField,
@@ -559,16 +566,16 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         optionsGuid: s.guid,
         hasDuplicates: this.hasDuplicates,
         listRef: (O) => {
-          h.list = this.base.list = O, this.itemHeight = 0;
+          c.list = this.base.list = O, this.itemHeight = 0;
         },
         wrapperStyle: this.mobileMode ? {} : { maxHeight: o.height },
         wrapperCssClass: S(
-          k.listContent({
-            c: E,
+          F.listContent({
+            c: M,
             virtual: a
           })
         ),
-        listStyle: h.enabled ? { transform: x } : void 0,
+        listStyle: c.enabled ? { transform: x } : void 0,
         key: "listkey",
         skip: d,
         onClick: this.handleItemClick,
@@ -577,7 +584,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         noDataRender: i,
         onMouseDown: (O) => O.preventDefault(),
         onScroll: this.onScroll,
-        wrapperRef: h.scrollerRef,
+        wrapperRef: c.scrollerRef,
         scroller: this.base.renderScrollElement(),
         ariaSetSize: a.total
       }
@@ -592,26 +599,26 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       ariaLabelledBy: p,
       ariaDescribedBy: l,
       dataItemKey: o,
-      virtual: h = { skip: 0 },
+      virtual: c = { skip: 0 },
       unstyled: d,
-      inputAttributes: v
-    } = this.props, x = C(this.props), I = this.props.opened !== void 0 ? this.props.opened : this.state.opened, b = this.value, u = Math.max(
+      inputAttributes: b
+    } = this.props, x = y(this.props), C = this.props.opened !== void 0 ? this.props.opened : this.state.opened, f = this.value, u = Math.max(
       0,
-      x.findIndex((c) => D(c, b, o))
+      x.findIndex((h) => D(h, f, o))
     );
-    return this._suggested && !D(this._valueOnDidUpdate, b, o) && (this._suggested = ""), /* @__PURE__ */ g.createElement(
+    return this._suggested && !D(this._valueOnDidUpdate, f, o) && (this._suggested = ""), /* @__PURE__ */ g.createElement(
       gt,
       {
         id: t,
-        readOnly: I && this.mobileMode,
+        readOnly: C && this.mobileMode,
         placeholder: e,
         tabIndex: i,
         accessKey: r,
         title: a,
         value: s + this._suggested,
         suggestedText: this._suggested,
-        ref: (c) => {
-          this._input = c && c.input;
+        ref: (h) => {
+          this._input = h && h.input;
         },
         onClick: this.onInputClick,
         onKeyDown: this.onInputKeyDown,
@@ -619,9 +626,9 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         onFocus: this.base.handleFocus,
         onBlur: this.handleBlur,
         disabled: n,
-        expanded: I,
+        expanded: C,
         owns: this.base.listBoxId,
-        activedescendant: `option-${this.base.guid}-${u + h.skip}`,
+        activedescendant: `option-${this.base.guid}-${u + c.skip}`,
         role: "combobox",
         ariaLabelledBy: p,
         ariaLabel: this.props.ariaLabel,
@@ -630,7 +637,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
         render: this.props.valueRender,
         ariaControls: this.base.listBoxId,
         unstyled: d,
-        inputAttributes: v
+        inputAttributes: b
       }
     );
   }
@@ -642,21 +649,21 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
   }
   triggerOnChange(s, t) {
     const e = this.value;
-    !this.hasDuplicates && (!F(e) && !F(s) || D(e, s, this.props.dataItemKey)) || (this.props.value === void 0 && (t.data.value = s), this._valueDuringOnChange = s, t.events.push({ type: "onChange" }));
+    !this.hasDuplicates && (!k(e) && !k(s) || D(e, s, this.props.dataItemKey)) || (this.props.value === void 0 && (t.data.value = s), this._valueDuringOnChange = s, t.events.push({ type: "onChange" }));
   }
   getFocusedIndex(s) {
     const t = this.value, {
       textField: e,
       dataItemKey: i,
       virtual: r = { skip: 0 },
-      focusedItemIndex: n = z,
+      focusedItemIndex: n = P,
       skipDisabledItems: a
-    } = this.props, p = C(this.props), l = this.props.filter ? this.props.filter : this.state.text;
-    return s && this.navigationIndex !== void 0 ? this.navigationIndex : F(t) && l === void 0 ? p.findIndex((o) => D(o, t, i)) : l ? n(p, l, e) : a && e && !l && r.skip === 0 ? p.findIndex((o) => !o.disabled && o[e]) : r.skip === 0 ? 0 : -1;
+    } = this.props, p = y(this.props), l = this.props.filter ? this.props.filter : this.state.text;
+    return s && this.navigationIndex !== void 0 ? this.navigationIndex : k(t) && l === void 0 ? p.findIndex((o) => D(o, t, i)) : l ? n(p, l, e) : a && e && !l && r.skip === 0 ? p.findIndex((o) => !o.disabled && o[e]) : r.skip === 0 ? 0 : -1;
   }
   suggestValue(s) {
     const { data: t, textField: e } = this.props;
-    this._suggested = ct(s, t, e);
+    this._suggested = ut(s, t, e);
   }
   applyState(s) {
     this.base.applyState(s), this._valueDuringOnChange = void 0;
@@ -666,7 +673,7 @@ const St = "Please enter a valid value!", M = class M extends g.Component {
       this.setState({ windowWidth: t.target.clientWidth });
   }
 };
-M.displayName = "ComboBox", M.propTypes = {
+E.displayName = "ComboBox", E.propTypes = {
   ..._.propTypes,
   size: m.oneOf([null, "small", "medium", "large"]),
   rounded: m.oneOf([null, "small", "medium", "large", "full"]),
@@ -692,7 +699,7 @@ M.displayName = "ComboBox", M.propTypes = {
   valueRender: m.func,
   skipDisabledItems: m.bool,
   inputAttributes: m.object
-}, M.defaultProps = {
+}, E.defaultProps = {
   ..._.defaultProps,
   size: "medium",
   rounded: "medium",
@@ -706,18 +713,18 @@ M.displayName = "ComboBox", M.propTypes = {
   prefix: void 0,
   suffix: void 0
 };
-let P = M;
-const kt = nt(), Ft = lt(
+let L = E;
+const Ft = nt(), kt = lt(
   rt(
-    kt,
+    Ft,
     pt(
-      dt(P)
+      dt(L)
     )
   )
 );
-Ft.displayName = "KendoReactComboBox";
+kt.displayName = "KendoReactComboBox";
 export {
-  Ft as ComboBox,
-  kt as ComboBoxPropsContext,
-  P as ComboBoxWithoutContext
+  kt as ComboBox,
+  Ft as ComboBoxPropsContext,
+  L as ComboBoxWithoutContext
 };