@progress/kendo-react-dropdowns 8.2.0 → 8.2.1-develop.2

package/AutoComplete/AutoComplete.mjs

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