@progress/kendo-react-dropdowns 13.3.0-develop.4 → 13.3.0-develop.6

package/MultiSelect/MultiSelect.mjs

@@ -5,9 +5,9 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as f from "react";
-import m from "prop-types";
-import { Keys as u, classNames as I, IconWrap as L, WatermarkOverlay as J, getLicenseMessage as Q, canUseDOM as B, validatePackage as X, createPropsContext as Z, withIdHOC as ee, withPropsContext as te, withAdaptiveModeContext as se, kendoThemeMaps as ie } from "@progress/kendo-react-common";
+import * as g from "react";
+import v from "prop-types";
+import { Keys as u, classNames as S, IconWrap as B, WatermarkOverlay as J, getLicenseMessage as Q, canUseDOM as V, validatePackage as X, createPropsContext as Z, withIdHOC as ee, withPropsContext as te, withAdaptiveModeContext as se, kendoThemeMaps as ie } from "@progress/kendo-react-common";
 import { plusIcon as oe } from "@progress/kendo-svg-icons";
 import { FloatingLabel as ae } from "@progress/kendo-react-labels";
 import ne from "../common/ListContainer.mjs";
@@ -15,180 +15,193 @@ import le from "../common/List.mjs";
 import de from "../common/GroupStickyHeader.mjs";
 import re from "./TagList.mjs";
 import he from "../common/SearchBar.mjs";
-import M from "../common/DropDownBase.mjs";
+import O from "../common/DropDownBase.mjs";
 import { ActiveDescendant as w } from "../common/settings.mjs";
-import { getFilteredData as b, areSame as E, removeDataItems as T, isPresent as O, getItemValue as P, preventDefaultNonInputs as pe, matchTags as V, itemIndexStartsWith as ce } from "../common/utils.mjs";
-import { packageMetadata as z } from "../package-metadata.mjs";
+import { getFilteredData as x, areSame as P, removeDataItems as D, isPresent as _, getItemValue as K, preventDefaultNonInputs as pe, matchTags as z, itemIndexStartsWith as ce } from "../common/utils.mjs";
+import { packageMetadata as A } from "../package-metadata.mjs";
 import ue from "../common/ClearButton.mjs";
 import { AdaptiveMode as fe } from "../common/AdaptiveMode.mjs";
 import { ActionSheetContent as ge } from "@progress/kendo-react-layout";
 import me from "../common/ListFilter.mjs";
-import A from "../common/withCustomComponent.mjs";
-const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H = (F) => F.preventDefault(), W = (F) => F === 2, y = class y extends f.Component {
+import H from "../common/withCustomComponent.mjs";
+const { sizeMap: M, roundedMap: ve } = ie, be = "Please enter a valid value!", W = (E) => E.preventDefault(), $ = (E) => E === 2, C = class C extends g.Component {
   constructor(n) {
     super(n), this.state = {
       activedescendant: w.PopupList,
       currentValue: []
-    }, this._element = null, this._valueItemsDuringOnChange = null, this.base = new M(this), this._tags = [], this._input = null, this._adaptiveInput = null, this._skipFocusEvent = !1, this._lastSelectedOrDeslectedItemIndex = null, this.itemHeight = 0, this.scrollToFocused = !1, this.showLicenseWatermark = !1, this.focus = () => {
+    }, this._element = null, this._valueItemsDuringOnChange = null, this.base = new O(this), this._tags = [], this._input = null, this._adaptiveInput = null, this._skipFocusEvent = !1, this._lastSelectedOrDeslectedItemIndex = null, this.itemHeight = 0, this.scrollToFocused = !1, this.showLicenseWatermark = !1, this.focus = () => {
       this._input && this._input.focus();
     }, this.handleItemSelect = (e, t) => {
-      const { dataItemKey: a, virtual: s } = this.props, o = b(this.props), p = s ? s.skip : 0, c = o[e - p], r = this.value.findIndex((g) => E(g, c, a));
-      this._lastSelectedOrDeslectedItemIndex = o.findIndex((g) => E(g, c, a));
-      let i = [];
-      r !== -1 ? (i = this.value, i.splice(r, 1)) : i = [...this.value, c], (this.props.filter !== void 0 ? this.props.filter : this.state.text) && !this.mobileMode && (this.state.text && (t.data.text = ""), this.base.filterChanged("", t)), this._adaptiveInput && this._adaptiveInput.blur(), this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.triggerOnChange(i, t), this.base.triggerPageChangeCornerItems(c, t);
+      const { dataItemKey: o, virtual: s } = this.props, a = x(this.props), i = s ? s.skip : 0, p = a[e - i], r = this.value.findIndex((h) => P(h, p, o));
+      this._lastSelectedOrDeslectedItemIndex = a.findIndex((h) => P(h, p, o));
+      let d = [];
+      r !== -1 ? (d = this.value, d.splice(r, 1)) : d = [...this.value, p], (this.props.filter !== void 0 ? this.props.filter : this.state.text) && !this.mobileMode && (this.state.text && (t.data.text = ""), this.base.filterChanged("", t)), this._adaptiveInput && this._adaptiveInput.blur(), this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.triggerOnChange(d, t), this.base.triggerPageChangeCornerItems(p, t);
     }, this.onTagDelete = (e, t) => {
-      const a = this.base.initState();
-      a.syntheticEvent = t, this.opened && this.base.togglePopup(a), !this.state.focused && !this.mobileMode && (a.data.focused = !0, this.focus());
+      const o = this.base.initState();
+      o.syntheticEvent = t, this.opened && this.base.togglePopup(o), !this.state.focused && !this.mobileMode && (o.data.focused = !0, this.focus());
       const s = this.value;
-      T(s, e, this.props.dataItemKey), this.triggerOnChange(s, a), this.applyState(a);
+      D(s, e, this.props.dataItemKey), this.triggerOnChange(s, o), this.applyState(o);
     }, this.itemFocus = (e, t) => {
-      const { allowCustom: a, virtual: s } = this.props, o = b(this.props), p = s ? s.skip : 0, c = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedIndex: r } = this.getFocusedState(), i = a && c, l = o[e - p];
-      l && r !== e ? this.state.focusedIndex !== e && (t.data.focusedIndex = e, t.data.activedescendant = w.PopupList) : i && e === -1 && this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.base.triggerPageChangeCornerItems(l, t);
+      const { allowCustom: o, virtual: s } = this.props, a = x(this.props), i = s ? s.skip : 0, p = s ? s.pageSize : 0, r = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedIndex: d } = this.getFocusedState(), l = o && r, h = a[e - i];
+      if (s && !h && e >= 0 && d !== e) {
+        const f = Math.floor(e / p) * p;
+        if (f !== i) {
+          this.state.focusedIndex !== e && (t.data.focusedIndex = e, t.data.activedescendant = w.PopupList), this.base.triggerOnPageChange(t, f, p);
+          return;
+        }
+      }
+      h && d !== e ? this.state.focusedIndex !== e && (t.data.focusedIndex = e, t.data.activedescendant = w.PopupList) : l && e === -1 && this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.base.triggerPageChangeCornerItems(h, t);
     }, this.componentRef = (e) => {
       this._element = e, this.base.wrapper = e;
     }, this.searchbarRef = (e) => {
       const t = this._input = e && e.input;
       t && this.state.focused && window.setTimeout(() => t.focus(), 0);
     }, this.onChangeHandler = (e) => {
-      const t = this.base.initState(), a = e.target.value;
-      t.syntheticEvent = e, this.props.filter === void 0 && (t.data.text = a), t.data.focusedIndex = void 0, this.opened ? this.scrollToFocused = !0 : (this.base.togglePopup(t), this.setState({ currentValue: this.value })), this.base.filterChanged(a, t), this.applyState(t), this.setState({ group: void 0 });
+      const t = this.base.initState(), o = e.target.value;
+      t.syntheticEvent = e, this.props.filter === void 0 && (t.data.text = o), t.data.focusedIndex = void 0, this.opened ? this.scrollToFocused = !0 : (this.base.togglePopup(t), this.setState({ currentValue: this.value })), this.base.filterChanged(o, t), this.applyState(t), this.setState({ group: void 0 });
     }, this.clearButtonClick = (e) => {
       const t = this.base.initState();
       t.syntheticEvent = e, e.stopPropagation(), this.value.length > 0 && this.triggerOnChange([], t), this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.opened && this.base.togglePopup(t);
-      const a = this.props.filter !== void 0 ? this.props.filter : this.state.text;
-      O(a) && a !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this._lastSelectedOrDeslectedItemIndex = null, this.applyState(t);
+      const o = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      _(o) && o !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this._lastSelectedOrDeslectedItemIndex = null, this.applyState(t);
     }, this.onInputKeyDown = (e) => {
-      const { textField: t, groupField: a } = this.props, s = b(this.props), o = e.keyCode, p = this.props.filter !== void 0 ? this.props.filter : this.state.text, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { focusedItem: r, focusedIndex: i } = this.getFocusedState(), l = this.base.initState();
-      if (l.syntheticEvent = e, !p && this.value.length > 0 && (o === u.left || o === u.right || o === u.home || o === u.end || o === u.delete || o === u.backspace) && !e.shiftKey)
-        return this.onTagsNavigate(e, l);
-      const g = () => {
-        e.preventDefault(), this.base.togglePopup(l), this.applyState(l);
+      const { textField: t, groupField: o, virtual: s } = this.props, a = x(this.props), i = e.keyCode, p = this.props.filter !== void 0 ? this.props.filter : this.state.text, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { focusedItem: d, focusedIndex: l } = this.getFocusedState(), h = this.base.initState();
+      if (h.syntheticEvent = e, !p && this.value.length > 0 && (i === u.left || i === u.right || i === u.home || i === u.end || i === u.delete || i === u.backspace) && !e.shiftKey)
+        return this.onTagsNavigate(e, h);
+      const f = () => {
+        e.preventDefault(), this.base.togglePopup(h), this.applyState(h);
       };
       if (this.opened)
-        if (o === u.pageUp)
+        if (i === u.pageUp)
           e.preventDefault(), this.base.scrollPopupByPageSize(-1);
-        else if (o === u.pageDown)
+        else if (i === u.pageDown)
           e.preventDefault(), this.base.scrollPopupByPageSize(1);
         else if ((e.ctrlKey || e.metaKey) && e.code === "KeyA") {
-          const h = (this.state.value && this.state.value.length) === s.length ? [] : s;
-          this.updateStateOnKeyboardNavigation(h, l);
+          const b = (this.state.value && this.state.value.length) === a.length ? [] : a;
+          this.updateStateOnKeyboardNavigation(b, h);
         } else if ((e.ctrlKey || e.metaKey) && e.shiftKey && e.keyCode === u.end) {
-          const d = s.slice(this.getFocusedState().focusedIndex);
-          this.itemFocus(s.length - 1, l), this.updateStateOnKeyboardNavigation(d, l);
+          const c = a.slice(this.getFocusedState().focusedIndex);
+          this.itemFocus(a.length - 1, h), this.updateStateOnKeyboardNavigation(c, h);
         } else if ((e.ctrlKey || e.metaKey) && e.shiftKey && e.keyCode === u.home) {
-          const d = s.slice(0, this.getFocusedState().focusedIndex + 1);
-          this.itemFocus(0, l), this.updateStateOnKeyboardNavigation(d, l);
+          const c = a.slice(0, this.getFocusedState().focusedIndex + 1);
+          this.itemFocus(0, h), this.updateStateOnKeyboardNavigation(c, h);
         } else if (e.shiftKey && e.keyCode === u.up) {
-          let d;
-          const h = this.getLastSelectedOrDeselectedIndex(1, i);
-          h === null ? d = i !== 0 ? s.slice(i - 1, i) : [s[i]] : h === i ? d = [s[h - 1]] : i >= 0 && (d = h > i ? s.slice(i - 1, h) : s.slice(h - 1, i)), d && d.length > 0 && (i >= 1 && this.itemFocus(i - 1, l), this.updateStateOnKeyboardNavigation(d, l));
+          let c;
+          const b = this.getLastSelectedOrDeselectedIndex(1, l);
+          b === null ? c = l !== 0 ? a.slice(l - 1, l) : [a[l]] : b === l ? c = [a[b - 1]] : l >= 0 && (c = b > l ? a.slice(l - 1, b) : a.slice(b - 1, l)), c && c.length > 0 && (l >= 1 && this.itemFocus(l - 1, h), this.updateStateOnKeyboardNavigation(c, h));
         } else if (e.shiftKey && e.keyCode === u.down) {
-          let d;
-          const h = this.getLastSelectedOrDeselectedIndex(0, i);
-          h === null ? d = i !== s.length - 1 ? s.slice(i, i + 1) : [s[i]] : h === i ? d = s.slice(i, i + 2) : i >= 0 && (d = h > i ? s.slice(i + 1, h + 1) : s.slice(h, i + 2)), d && d.length >= 1 && (this.itemFocus(i + 1, l), this.updateStateOnKeyboardNavigation(d, l));
-        } else if (e.altKey && o === u.up)
-          g();
-        else if (o === u.up || o === u.down) {
-          if (a !== "" && t)
-            if (!this.props.skipDisabledItems && c)
-              this.onNavigate(l, o);
+          let c;
+          const b = this.getLastSelectedOrDeselectedIndex(0, l);
+          b === null ? c = l !== a.length - 1 ? a.slice(l, l + 1) : [a[l]] : b === l ? c = a.slice(l, l + 2) : l >= 0 && (c = b > l ? a.slice(l + 1, b + 1) : a.slice(b, l + 2)), c && c.length >= 1 && (this.itemFocus(l + 1, h), this.updateStateOnKeyboardNavigation(c, h));
+        } else if (e.altKey && i === u.up)
+          f();
+        else if (i === u.up || i === u.down) {
+          const c = s ? s.skip : 0, b = l - c;
+          if (o !== "" && t)
+            if (!this.props.skipDisabledItems && r)
+              this.onNavigate(h, i);
             else {
-              let d = 0;
-              if (o === u.down || o === u.right) {
-                const h = s.slice(i + 1).find((v) => !v.disabled && v[t]);
-                d = h && s.findIndex((v) => v[t] === h[t]);
-              } else if (o === u.up || o === u.left) {
-                let h;
-                if (i === -1)
-                  h = s, d = s.findIndex((v) => !v.disabled && v[t]);
+              let m = 0;
+              if (i === u.down || i === u.right) {
+                const y = a.slice(b + 1).find((I) => !I.disabled && I[t]);
+                m = y && a.findIndex((I) => I[t] === y[t]), m && m !== -1 && (m = m + c);
+              } else if (i === u.up || i === u.left) {
+                let y;
+                if (l === -1)
+                  y = a, m = a.findIndex((I) => !I.disabled && I[t]), m !== -1 && (m = m + c);
                 else {
-                  h = s.slice(0, i);
-                  let v = h.pop();
-                  for (; v && v.disabled; )
-                    v = h.pop();
-                  d = v && s.findIndex((x) => x[t] === v[t]);
+                  y = a.slice(0, b);
+                  let I = y.pop();
+                  for (; I && I.disabled; )
+                    I = y.pop();
+                  m = I && a.findIndex((T) => T[t] === I[t]), m && m !== -1 && (m = m + c);
                 }
               }
-              if (d) {
-                const h = d - i;
-                this.onNavigate(l, o, h);
-              } else d !== void 0 && this.onNavigate(l, o);
+              if (m) {
+                const y = m - l;
+                this.onNavigate(h, i, y);
+              } else
+                this.onNavigate(h, i);
             }
-          else if (!this.props.skipDisabledItems && c)
-            this.onNavigate(l, o);
+          else if (!this.props.skipDisabledItems && r)
+            this.onNavigate(h, i);
           else {
-            let d = null;
-            if (o === u.down || o === u.right)
-              d = s.slice(i + 1).find((h) => !h.disabled);
-            else if (o === u.up || o === u.left) {
-              const h = s.slice(0, i);
-              for (d = h.pop(); d && d.disabled; )
-                d = h.pop();
+            let m = null;
+            if (i === u.down || i === u.right)
+              m = a.slice(b + 1).find((y) => !y.disabled);
+            else if (i === u.up || i === u.left) {
+              const y = a.slice(0, b);
+              for (m = y.pop(); m && m.disabled; )
+                m = y.pop();
             }
-            if (d) {
-              const h = d.id - i - 1;
-              this.onNavigate(l, o, h);
+            if (m) {
+              const y = a.indexOf(m);
+              if (y !== -1) {
+                const I = c + y - l;
+                this.onNavigate(h, i, I);
+              } else
+                this.onNavigate(h, i);
             } else
-              this.onNavigate(l, o);
+              this.onNavigate(h, i);
           }
-          this.applyState(l), e.preventDefault();
-        } else o === u.enter ? (e.preventDefault(), this.props.allowCustom && p && r === null ? this.customItemSelect(e) : r && r.disabled ? g() : this.selectFocusedItem(e)) : o === u.esc && g();
-      else e.altKey && o === u.down ? g() : o === u.esc && this.clearButtonClick(e);
+          this.applyState(h), e.preventDefault();
+        } else i === u.enter ? (e.preventDefault(), this.props.allowCustom && p && d === null ? this.customItemSelect(e) : d && d.disabled ? f() : this.selectFocusedItem(e)) : i === u.esc && f();
+      else e.altKey && i === u.down ? f() : i === u.esc && this.clearButtonClick(e);
     }, this.listContainerContent = () => {
-      const { header: e, footer: t, allowCustom: a, size: s, groupStickyHeaderItemRender: o, groupField: p, list: c } = this.props, r = b(this.props), i = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: l } = this.getFocusedState(), g = a && i && /* @__PURE__ */ f.createElement(
+      const { header: e, footer: t, allowCustom: o, size: s, groupStickyHeaderItemRender: a, groupField: i, list: p } = this.props, r = x(this.props), d = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: l } = this.getFocusedState(), h = o && d && /* @__PURE__ */ g.createElement(
         "div",
         {
-          className: I("k-list", {
-            [`k-list-${D[s] || s}`]: s
+          className: S("k-list", {
+            [`k-list-${M[s] || s}`]: s
           }),
           key: "customitem",
           onClick: this.customItemSelect,
-          onMouseDown: H
+          onMouseDown: W
         },
-        /* @__PURE__ */ f.createElement(
+        /* @__PURE__ */ g.createElement(
           "div",
           {
-            className: I("k-list-item k-custom-item", { "k-focus": W(l) }),
+            className: S("k-list-item k-custom-item", { "k-focus": $(l) }),
             style: { fontStyle: "italic" }
           },
-          i,
-          /* @__PURE__ */ f.createElement(L, { name: "plus", icon: oe, style: { position: "absolute", right: "0.5em" } })
+          d,
+          /* @__PURE__ */ g.createElement(B, { name: "plus", icon: oe, style: { position: "absolute", right: "0.5em" } })
         )
       );
-      let { group: d } = this.state;
-      return d === void 0 && p !== void 0 && (d = P(r[0], p)), /* @__PURE__ */ f.createElement(f.Fragment, null, e && /* @__PURE__ */ f.createElement("div", { className: "k-list-header" }, e), g, /* @__PURE__ */ f.createElement(
+      let { group: f } = this.state;
+      return f === void 0 && i !== void 0 && (f = K(r[0], i)), /* @__PURE__ */ g.createElement(g.Fragment, null, e && /* @__PURE__ */ g.createElement("div", { className: "k-list-header" }, e), h, /* @__PURE__ */ g.createElement(
         "div",
         {
-          className: I("k-list", {
-            [`k-list-${this.mobileMode ? "lg" : D[s] || s}`]: s,
+          className: S("k-list", {
+            [`k-list-${this.mobileMode ? "lg" : M[s] || s}`]: s,
             "k-virtual-list": this.base.vs.enabled
           })
         },
-        !c && d && r.length !== 0 && /* @__PURE__ */ f.createElement(de, { group: d, groupMode: "modern", render: o }),
+        !p && f && r.length !== 0 && /* @__PURE__ */ g.createElement(de, { group: f, groupMode: "modern", render: a }),
         this.renderList()
-      ), this.showLicenseWatermark && /* @__PURE__ */ f.createElement(J, { message: this.licenseMessage }), t && /* @__PURE__ */ f.createElement("div", { className: "k-list-footer" }, t));
+      ), this.showLicenseWatermark && /* @__PURE__ */ g.createElement(J, { message: this.licenseMessage }), t && /* @__PURE__ */ g.createElement("div", { className: "k-list-footer" }, t));
     }, this.renderListContainer = () => {
-      const e = this.base, { dir: t } = this.props, a = b(this.props), s = this.base.getPopupSettings(), o = s.width !== void 0 ? s.width : e.popupWidth, p = {
+      const e = this.base, { dir: t } = this.props, o = x(this.props), s = this.base.getPopupSettings(), a = s.width !== void 0 ? s.width : e.popupWidth, i = {
         dir: t !== void 0 ? t : e.dirCalculated,
-        width: o,
+        width: a,
         popupSettings: {
           ...s,
-          popupClass: I(s.popupClass, "k-list-container", "k-multiselect-popup"),
+          popupClass: S(s.popupClass, "k-list-container", "k-multiselect-popup"),
           anchor: s.anchor || this.element,
           show: this.opened,
           onOpen: this.onPopupOpened,
           onClose: this.onPopupClosed
         },
-        itemsCount: [a.length, this.value.length]
+        itemsCount: [o.length, this.value.length]
       };
-      return /* @__PURE__ */ f.createElement(ne, { ...p }, this.listContainerContent());
+      return /* @__PURE__ */ g.createElement(ne, { ...i }, this.listContainerContent());
     }, this.renderAdaptiveListContainer = () => {
-      const { adaptiveTitle: e, adaptiveSubtitle: t, filterable: a, filter: s } = this.props, { windowWidth: o = 0 } = this.state, p = s !== void 0 ? s : this.state.text, c = a ? /* @__PURE__ */ f.createElement(
+      const { adaptiveTitle: e, adaptiveSubtitle: t, filterable: o, filter: s } = this.props, { windowWidth: a = 0 } = this.state, i = s !== void 0 ? s : this.state.text, p = o ? /* @__PURE__ */ g.createElement(
         me,
         {
-          value: p,
-          ref: (i) => {
-            this._adaptiveInput = i && i.element;
+          value: i,
+          ref: (d) => {
+            this._adaptiveInput = d && d.element;
           },
           onChange: this.onChangeHandler,
           onKeyDown: this.onInputKeyDown,
@@ -201,101 +214,101 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
         title: e || this.props.label,
         subTitle: t,
         expand: this.opened,
-        onClose: (i) => this.closePopup(i),
-        windowWidth: o,
-        mobileFilter: c
+        onClose: (d) => this.closePopup(d),
+        windowWidth: a,
+        mobileFilter: p
       };
-      return /* @__PURE__ */ f.createElement(fe, { ...r }, /* @__PURE__ */ f.createElement(ge, null, /* @__PURE__ */ f.createElement("div", { className: "k-list-container" }, this.listContainerContent())));
+      return /* @__PURE__ */ g.createElement(fe, { ...r }, /* @__PURE__ */ g.createElement(ge, null, /* @__PURE__ */ g.createElement("div", { className: "k-list-container" }, this.listContainerContent())));
     }, this.closePopup = (e) => {
       const t = this.base.initState();
       t.syntheticEvent = e, e.stopPropagation(), this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.opened && this.base.togglePopup(t), t.events.push({ type: "onClose" });
-      const a = this.props.filter !== void 0 ? this.props.filter : this.state.text;
-      O(a) && a !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this.applyState(t);
+      const o = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      _(o) && o !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this.applyState(t);
     }, this.onCancel = (e) => {
       const t = this.base.initState();
       t.syntheticEvent = e, e.stopPropagation(), this.state.focusedIndex !== void 0 && (t.data.focusedIndex = void 0), this.opened && this.base.togglePopup(t), t.events.push({ type: "onCancel" });
-      const a = this.props.filter !== void 0 ? this.props.filter : this.state.text;
-      O(a) && a !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this.applyState(t);
+      const o = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      _(o) && o !== "" && this.base.filterChanged("", t), this.state.text && (t.data.text = ""), this.applyState(t);
     }, this.renderList = () => {
       const {
         textField: e,
         listNoDataRender: t,
-        itemRender: a,
+        itemRender: o,
         groupHeaderItemRender: s,
-        dataItemKey: o,
-        virtual: p = { skip: 0, total: void 0 }
-      } = this.props, c = b(this.props), r = this.base.vs, { focusedIndex: i } = this.getFocusedState(), l = this.base.getPopupSettings(), g = `translateY(${r.translate}px)`;
-      return /* @__PURE__ */ f.createElement(
+        dataItemKey: a,
+        virtual: i = { skip: 0, total: void 0 }
+      } = this.props, p = x(this.props), r = this.base.vs, { focusedIndex: d } = this.getFocusedState(), l = this.base.getPopupSettings(), h = `translateY(${r.translate}px)`;
+      return /* @__PURE__ */ g.createElement(
         le,
         {
           id: this.base.listBoxId,
           show: this.opened,
-          data: c.slice(),
-          focusedIndex: i - p.skip,
+          data: p.slice(),
+          focusedIndex: d - i.skip,
           value: this.value,
           textField: e,
-          valueField: o,
+          valueField: a,
           optionsGuid: this.base.guid,
           groupField: this.props.groupField,
           groupMode: "modern",
-          listRef: (d) => {
-            r.list = this.base.list = d;
+          listRef: (f) => {
+            r.list = this.base.list = f;
           },
           wrapperStyle: this.mobileMode ? {} : { maxHeight: l.height },
           wrapperCssClass: "k-list-content",
-          listStyle: r.enabled ? { transform: g } : void 0,
+          listStyle: r.enabled ? { transform: h } : void 0,
           key: "listKey",
-          skip: p.skip,
+          skip: i.skip,
           onClick: this.handleItemClick,
-          itemRender: a,
+          itemRender: o,
           groupHeaderItemRender: s,
           noDataRender: t,
-          onMouseDown: H,
+          onMouseDown: W,
           onBlur: this.handleBlur,
           onScroll: this.onScroll,
           wrapperRef: r.scrollerRef,
           scroller: this.base.renderScrollElement(),
-          ariaSetSize: p.total
+          ariaSetSize: i.total
         }
       );
     }, this.onScroll = (e) => {
-      const { vs: t, list: a } = this.base;
+      const { vs: t, list: o } = this.base;
       t.scrollHandler(e);
       const { groupField: s } = this.props;
-      let o = b(this.props);
-      if (!(!s || !o.length) && s) {
-        const p = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : a ? a.children[0].offsetHeight : 0), r = e.target.scrollTop - t.skip * p;
-        o = this.base.getGroupedDataModernMode(o, s);
-        let i = o[0][s];
-        for (let l = 1; l < o.length && !(p * l > r); l++)
-          o[l] && o[l][s] && (i = o[l][s]);
-        i !== this.state.group && this.setState({
-          group: i
+      let a = x(this.props);
+      if (!(!s || !a.length) && s) {
+        const i = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : o ? o.children[0].offsetHeight : 0), r = e.target.scrollTop - t.skip * i;
+        a = this.base.getGroupedDataModernMode(a, s);
+        let d = a[0][s];
+        for (let l = 1; l < a.length && !(i * l > r); l++)
+          a[l] && a[l][s] && (d = a[l][s]);
+        d !== this.state.group && this.setState({
+          group: d
         });
       }
     }, this.customItemSelect = (e) => {
-      const t = this.props.filter !== void 0 ? this.props.filter : this.state.text, { textField: a } = this.props;
+      const t = this.props.filter !== void 0 ? this.props.filter : this.state.text, { textField: o } = this.props;
       if (!t)
         return;
       const s = this.base.initState();
       s.syntheticEvent = e;
-      const o = a ? { [a]: t } : t;
+      const a = o ? { [o]: t } : t;
       this.state.text !== void 0 && (s.data.text = ""), s.data.focusedIndex = void 0, this.base.filterChanged("", s);
-      const p = [...this.value, o];
-      this.triggerOnChange(p, s), this.base.togglePopup(s), this.applyState(s);
+      const i = [...this.value, a];
+      this.triggerOnChange(i, s), this.base.togglePopup(s), this.applyState(s);
     }, this.handleWrapperClick = (e) => {
       const t = this._input;
       !this.opened && t && this.focusElement(t);
-      const a = this.base.initState();
-      a.syntheticEvent = e, !this.state.focused && !this.mobileMode && (a.events.push({ type: "onFocus" }), a.data.focused = !0), this.mobileMode && (this.setState({ currentValue: this.tagsToRender }), this.mobileMode && window.setTimeout(() => this._adaptiveInput && this._adaptiveInput.focus(), 300)), this.base.togglePopup(a), this.applyState(a);
+      const o = this.base.initState();
+      o.syntheticEvent = e, !this.state.focused && !this.mobileMode && (o.events.push({ type: "onFocus" }), o.data.focused = !0), this.mobileMode && (this.setState({ currentValue: this.tagsToRender }), this.mobileMode && window.setTimeout(() => this._adaptiveInput && this._adaptiveInput.focus(), 300)), this.base.togglePopup(o), this.applyState(o);
     }, this.handleItemClick = (e, t) => {
-      const a = this.base.initState();
-      a.syntheticEvent = t, this.handleItemSelect(e, a), this.props.autoClose && this.base.togglePopup(a), t.stopPropagation(), this.applyState(a);
+      const o = this.base.initState();
+      o.syntheticEvent = t, this.handleItemSelect(e, o), this.props.autoClose && this.base.togglePopup(o), t.stopPropagation(), this.applyState(o);
     }, this.handleBlur = (e) => {
       if (!this.state.focused || this._skipFocusEvent)
         return;
-      const t = this.base.initState(), { allowCustom: a, filterable: s } = this.props;
-      t.syntheticEvent = e, t.data.focused = !1, t.events.push({ type: "onBlur" }), this.opened && !this.mobileMode && (this.state.opened && (t.data.opened = !1), t.events.push({ type: "onClose" })), !a && !s && this.state.text && (t.data.text = ""), this.applyState(t);
+      const t = this.base.initState(), { allowCustom: o, filterable: s } = this.props;
+      t.syntheticEvent = e, t.data.focused = !1, t.events.push({ type: "onBlur" }), this.opened && !this.mobileMode && (this.state.opened && (t.data.opened = !1), t.events.push({ type: "onClose" })), !o && !s && this.state.text && (t.data.text = ""), this.applyState(t);
     }, this.handleFocus = (e) => {
       this._skipFocusEvent || this.base.handleFocus(e);
     }, this.onPopupOpened = () => {
@@ -308,19 +321,19 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
       this._input && this._input.setCustomValidity && this._input.setCustomValidity(
         this.validity.valid ? "" : this.props.validationMessage || be
       );
-    }, this.validate(n), this.licenseMessage = Q(z);
+    }, this.validate(n), this.licenseMessage = Q(A);
   }
   get _inputId() {
     return this.props.id;
   }
   get document() {
-    if (B)
+    if (V)
       return this.element && this.element.ownerDocument || document;
   }
   validate(n) {
     if (n.filterable || n.virtual) {
       const e = [];
-      n.filterable && e.push("filterable"), n.virtual && e.push("virtualization"), this.showLicenseWatermark = !X(z, {
+      n.filterable && e.push("filterable"), n.virtual && e.push("virtualization"), this.showLicenseWatermark = !X(A, {
         component: "MultiSelect",
         features: e
       });
@@ -337,8 +350,8 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
   /** @hidden */
   get tagsToRender() {
     const { tags: n, textField: e } = this.props, t = [];
-    return n === void 0 ? this.value.forEach((a) => {
-      t.push({ text: P(a, e), data: [a] });
+    return n === void 0 ? this.value.forEach((o) => {
+      t.push({ text: K(o, e), data: [o] });
     }) : t.push(...n), t;
   }
   /**
@@ -374,27 +387,27 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
   }
   /** @hidden */
   get required() {
-    return this.props.required !== void 0 ? this.props.required : y.defaultProps.required;
+    return this.props.required !== void 0 ? this.props.required : C.defaultProps.required;
   }
   get validityStyles() {
-    return this.props.validityStyles !== void 0 ? this.props.validityStyles : y.defaultProps.validityStyles;
+    return this.props.validityStyles !== void 0 ? this.props.validityStyles : C.defaultProps.validityStyles;
   }
   /** @hidden */
   componentDidUpdate(n, e) {
-    var g;
-    const { virtual: t, groupField: a = "" } = this.props, s = b(this.props), o = t ? t.skip : 0, p = n.virtual ? n.virtual.total : 0, c = n.opened !== void 0 ? n.opened : e.opened, r = !c && this.opened, i = c && !this.opened, l = this.base.getPopupSettings();
-    if (this.validate(this.props), this.base.didUpdate(), !l.animate && i && this.onPopupClosed(), t && t.total !== p)
+    var h;
+    const { virtual: t, groupField: o = "" } = this.props, s = x(this.props), a = t ? t.skip : 0, i = n.virtual ? n.virtual.total : 0, p = n.opened !== void 0 ? n.opened : e.opened, r = !p && this.opened, d = p && !this.opened, l = this.base.getPopupSettings();
+    if (this.validate(this.props), this.base.didUpdate(), !l.animate && d && this.onPopupClosed(), t && t.total !== i)
       this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
     else {
-      let { focusedItem: d, focusedIndex: h } = this.getFocusedState();
-      a !== "" && (h = (g = this.base.getGroupedDataModernMode(s, a)) == null ? void 0 : g.indexOf(d)), r && t ? this.base.scrollToVirtualItem(t, h - o) : r && !t ? (s && s.length !== 0 && this.base.resetGroupStickyHeader(s[0][a], this), this.base.scrollToItem(h)) : this.opened && c && d && this.scrollToFocused && this.base.scrollToItem(h - o);
+      let { focusedItem: f, focusedIndex: c } = this.getFocusedState();
+      o !== "" && (c = (h = this.base.getGroupedDataModernMode(s, o)) == null ? void 0 : h.indexOf(f)), r && t ? this.base.scrollToVirtualItem(t, c - a) : r && !t ? (s && s.length !== 0 && this.base.resetGroupStickyHeader(s[0][o], this), this.base.scrollToItem(c)) : this.opened && p && f && this.scrollToFocused && this.base.scrollToItem(c - a);
     }
     this.scrollToFocused = !1, this.setValidity();
   }
   /** @hidden */
   componentDidMount() {
     var n;
-    this.observerResize = B && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (n = this.document) != null && n.body && this.observerResize && this.observerResize.observe(this.document.body);
+    this.observerResize = V && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (n = this.document) != null && n.body && this.observerResize && this.observerResize.observe(this.document.body);
   }
   /** @hidden */
   componentWillUnmount() {
@@ -403,18 +416,18 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
   }
   /** @hidden */
   onNavigate(n, e, t) {
-    const { allowCustom: a } = this.props, s = b(this.props), o = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: p, focusedIndex: c } = this.getFocusedState(), r = a && o, i = W(p), l = this.base, g = l.vs;
-    if (this.opened && e === u.up && i)
+    const { allowCustom: o } = this.props, s = x(this.props), a = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: i, focusedIndex: p } = this.getFocusedState(), r = o && a, d = $(i), l = this.base, h = l.vs;
+    if (this.opened && e === u.up && d)
       this.state.focusedIndex !== void 0 && (n.data.focusedIndex = void 0);
     else {
-      const d = l.navigation.navigate({
+      const f = l.navigation.navigate({
         keyCode: e,
-        current: c,
-        max: (g.enabled ? g.total : s.length) - 1,
+        current: p,
+        max: (h.enabled ? h.total : s.length) - 1,
         min: r ? -1 : 0,
         skipItems: t || void 0
       });
-      d !== void 0 && (this.itemFocus(d, n), this.scrollToFocused = !0);
+      f !== void 0 && (this.itemFocus(f, n), this.scrollToFocused = !0);
     }
     this.applyState(n);
   }
@@ -424,92 +437,92 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
       style: n,
       className: e,
       label: t,
-      dir: a,
+      dir: o,
       disabled: s,
-      textField: o,
-      dataItemKey: p,
-      virtual: c,
+      textField: a,
+      dataItemKey: i,
+      virtual: p,
       size: r,
-      rounded: i,
+      rounded: d,
       fillMode: l,
-      loading: g,
-      filter: d
-    } = this.props, { text: h, focused: v, focusedTag: x, currentValue: $ } = this.state, C = this.base.vs, K = this.props.id || this._inputId;
-    C.enabled = c !== void 0, c !== void 0 && (C.skip = c.skip, C.total = c.total, C.pageSize = c.pageSize);
-    const S = this.mobileMode && this.opened ? $ : this.tagsToRender;
+      loading: h,
+      filter: f
+    } = this.props, { text: c, focused: b, focusedTag: m, currentValue: y } = this.state, I = this.base.vs, T = this.props.id || this._inputId;
+    I.enabled = p !== void 0, p !== void 0 && (I.skip = p.skip, I.total = p.total, I.pageSize = p.pageSize);
+    const k = this.mobileMode && this.opened ? y : this.tagsToRender;
     this.setItems(this.tagsToRender, this._tags);
-    const N = !this.validityStyles || this.validity.valid, q = !!(d !== void 0 ? d : h) || S && S.length > 0, [G, U] = A(this.props.prefix || f.Fragment), [j, Y] = A(this.props.suffix || f.Fragment), R = /* @__PURE__ */ f.createElement(f.Fragment, null, /* @__PURE__ */ f.createElement(
+    const R = !this.validityStyles || this.validity.valid, q = !!(f !== void 0 ? f : c) || k && k.length > 0, [G, U] = H(this.props.prefix || g.Fragment), [j, Y] = H(this.props.suffix || g.Fragment), L = /* @__PURE__ */ g.createElement(g.Fragment, null, /* @__PURE__ */ g.createElement(
       "div",
       {
         ref: this.componentRef,
-        className: I("k-multiselect k-input", e, {
-          [`k-input-${D[r] || r}`]: r,
-          [`k-rounded-${ve[i] || i}`]: i,
+        className: S("k-multiselect k-input", e, {
+          [`k-input-${M[r] || r}`]: r,
+          [`k-rounded-${ve[d] || d}`]: d,
           [`k-input-${l}`]: l,
-          "k-focus": v && !s,
-          "k-invalid": !N,
+          "k-focus": b && !s,
+          "k-invalid": !R,
           "k-disabled": s,
-          "k-loading": g,
+          "k-loading": h,
           "k-required": this.required
         }),
         style: t ? { ...n, width: void 0 } : n,
-        dir: a,
-        onFocus: (k) => {
-          this.mobileMode ? this.handleWrapperClick(k) : this.handleFocus(k);
+        dir: o,
+        onFocus: (F) => {
+          this.mobileMode ? this.handleWrapperClick(F) : this.handleFocus(F);
         },
         onBlur: this.handleBlur,
         onClick: this.handleWrapperClick,
         onMouseDown: pe
       },
-      this.props.prefix && /* @__PURE__ */ f.createElement(G, { ...U }),
-      /* @__PURE__ */ f.createElement("div", { className: I("k-input-values") }, /* @__PURE__ */ f.createElement(
+      this.props.prefix && /* @__PURE__ */ g.createElement(G, { ...U }),
+      /* @__PURE__ */ g.createElement("div", { className: S("k-input-values") }, /* @__PURE__ */ g.createElement(
         "div",
         {
-          className: I("k-chip-list", { [`k-chip-list-${D[r] || r}`]: r }),
+          className: S("k-chip-list", { [`k-chip-list-${M[r] || r}`]: r }),
           role: "listbox",
           id: "tagslist-" + this.base.guid
         },
-        S && S.length > 0 && /* @__PURE__ */ f.createElement(
+        k && k.length > 0 && /* @__PURE__ */ g.createElement(
           re,
           {
             tagRender: this.props.tagRender,
             onTagDelete: this.onTagDelete,
-            data: S,
+            data: k,
             guid: this.base.guid,
-            focused: x ? S.find((k) => V(k, x, p)) : void 0,
+            focused: m ? k.find((F) => z(F, m, i)) : void 0,
             size: r
           }
         )
-      ), this.renderSearchBar(K)),
-      g && /* @__PURE__ */ f.createElement(L, { className: "k-input-loading-icon", name: "loading" }),
-      this.props.suffix && /* @__PURE__ */ f.createElement(j, { ...Y }),
-      q && /* @__PURE__ */ f.createElement(ue, { onClick: this.clearButtonClick }),
+      ), this.renderSearchBar(T)),
+      h && /* @__PURE__ */ g.createElement(B, { className: "k-input-loading-icon", name: "loading" }),
+      this.props.suffix && /* @__PURE__ */ g.createElement(j, { ...Y }),
+      q && /* @__PURE__ */ g.createElement(ue, { onClick: this.clearButtonClick }),
       !this.mobileMode && this.renderListContainer()
     ), this.mobileMode && this.renderAdaptiveListContainer());
-    return t ? /* @__PURE__ */ f.createElement(
+    return t ? /* @__PURE__ */ g.createElement(
       ae,
       {
         label: t,
-        editorId: K,
-        editorValue: h || P(this.value[0], o),
-        editorValid: N,
+        editorId: T,
+        editorValue: c || K(this.value[0], a),
+        editorValid: R,
         editorDisabled: s,
         style: { width: n ? n.width : void 0 },
-        children: R
+        children: L
       }
-    ) : R;
+    ) : L;
   }
   renderSearchBar(n) {
-    const { activedescendant: e, focusedTag: t, currentValue: a } = this.state, { disabled: s, placeholder: o, ariaDescribedBy: p, ariaLabelledBy: c, ariaLabel: r, inputAttributes: i } = this.props, l = !this.mobileMode && (this.props.filter !== void 0 ? this.props.filter : this.state.text) || "", { focusedIndex: g } = this.getFocusedState(), d = this.value.length === 0 && !l ? o : void 0, h = a && a.length > 0 ? void 0 : o, v = e === w.TagsList && t !== void 0 ? `tag-${this.base.guid}-${t.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${g}`, x = {
+    const { activedescendant: e, focusedTag: t, currentValue: o } = this.state, { disabled: s, placeholder: a, ariaDescribedBy: i, ariaLabelledBy: p, ariaLabel: r, inputAttributes: d } = this.props, l = !this.mobileMode && (this.props.filter !== void 0 ? this.props.filter : this.state.text) || "", { focusedIndex: h } = this.getFocusedState(), f = this.value.length === 0 && !l ? a : void 0, c = o && o.length > 0 ? void 0 : a, b = e === w.TagsList && t !== void 0 ? `tag-${this.base.guid}-${t.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${h}`, m = {
       accessKey: this.props.accessKey,
       tabIndex: this.props.tabIndex
     };
-    return /* @__PURE__ */ f.createElement(
+    return /* @__PURE__ */ g.createElement(
       he,
       {
         id: n,
-        size: Math.max((d || "").length, l.length, 1),
-        placeholder: this.mobileMode && this.opened ? h : d,
+        size: Math.max((f || "").length, l.length, 1),
+        placeholder: this.mobileMode && this.opened ? c : f,
         value: l,
         onChange: this.onChangeHandler,
         onKeyDown: this.onInputKeyDown,
@@ -518,50 +531,50 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
         expanded: this.opened,
         owns: this.base.listBoxId,
         role: "combobox",
-        activedescendant: v,
-        ariaDescribedBy: `tagslist-${this.base.guid}${p ? " " + p : ""}`,
-        ariaLabelledBy: c,
+        activedescendant: b,
+        ariaDescribedBy: `tagslist-${this.base.guid}${i ? " " + i : ""}`,
+        ariaLabelledBy: p,
         ariaRequired: this.required,
         ariaLabel: r,
-        inputAttributes: i,
-        ...x
+        inputAttributes: d,
+        ...m
       }
     );
   }
   onTagsNavigate(n, e) {
-    const t = n.keyCode, { focusedTag: a } = this.state, s = this._tags, o = this.props.dataItemKey;
-    let p = a ? s.findIndex((i) => V(i, a, o)) : -1, c;
-    const r = p !== -1;
+    const t = n.keyCode, { focusedTag: o } = this.state, s = this._tags, a = this.props.dataItemKey;
+    let i = o ? s.findIndex((d) => z(d, o, a)) : -1, p;
+    const r = i !== -1;
     if (t === u.left)
-      r ? p = Math.max(0, p - 1) : p = s.length - 1, c = s[p];
+      r ? i = Math.max(0, i - 1) : i = s.length - 1, p = s[i];
     else if (t === u.right)
-      p === s.length - 1 ? c = void 0 : r && (p = Math.min(s.length - 1, p + 1), c = s[p]);
+      i === s.length - 1 ? p = void 0 : r && (i = Math.min(s.length - 1, i + 1), p = s[i]);
     else if (t === u.home && !n.shiftKey)
-      c = s[0];
+      p = s[0];
     else if (t === u.end && !n.shiftKey)
-      c = s[s.length - 1];
+      p = s[s.length - 1];
     else if (t === u.delete) {
       if (r) {
-        const i = this.value;
-        T(i, s[p].data, o), this.triggerOnChange(i, e);
+        const d = this.value;
+        D(d, s[i].data, a), this.triggerOnChange(d, e);
       }
     } else if (t === u.backspace) {
-      const i = this.value;
+      const d = this.value;
       if (r)
-        T(i, s[p].data, o), this.triggerOnChange(i, e);
+        D(d, s[i].data, a), this.triggerOnChange(d, e);
       else if (!r && s.length) {
         const l = s.pop();
-        T(i, l.data, o), this.triggerOnChange(i, e);
+        D(d, l.data, a), this.triggerOnChange(d, e);
       }
     }
-    c !== a && (e.data.focusedTag = c, e.data.activedescendant = w.TagsList), this.applyState(e);
+    p !== o && (e.data.focusedTag = p, e.data.activedescendant = w.TagsList), this.applyState(e);
   }
   triggerOnChange(n, e) {
     this.props.value === void 0 && (e.data.value = [...n]), this._valueItemsDuringOnChange = [], this.setItems(n, this._valueItemsDuringOnChange), e.events.push({ type: "onChange" });
   }
   selectFocusedItem(n, e) {
-    const { virtual: t } = this.props, a = b(this.props), { focusedIndex: s } = e || this.getFocusedState(), o = t ? t.skip : 0;
-    a[s - o] !== void 0 && this.handleItemClick(s, n);
+    const { virtual: t } = this.props, o = x(this.props), { focusedIndex: s } = e || this.getFocusedState(), a = t ? t.skip : 0;
+    o[s - a] !== void 0 && this.handleItemClick(s, n);
   }
   setItems(n, e) {
     e.length = 0, e.push(...n);
@@ -569,21 +582,21 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
   getFocusedState() {
     const { focusedIndex: n } = this.state, e = this.props.filter !== void 0 ? this.props.filter : this.state.text, {
       allowCustom: t,
-      dataItemKey: a,
+      dataItemKey: o,
       virtual: s,
-      textField: o,
-      focusedItemIndex: p = ce,
-      skipDisabledItems: c
-    } = this.props, r = b(this.props), i = s && s.skip || 0;
+      textField: a,
+      focusedItemIndex: i = ce,
+      skipDisabledItems: p
+    } = this.props, r = x(this.props), d = s && s.skip || 0;
     let l;
     if (n !== void 0)
       return {
         focusedIndex: n,
-        focusedItem: r[n - i],
+        focusedItem: r[n - d],
         focusedType: 1
         /* ListItem */
       };
-    const g = this.value;
+    const h = this.value;
     if (t && e)
       return {
         focusedItem: null,
@@ -592,30 +605,30 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
         /* CustomItem */
       };
     if (e)
-      return l = p(r, e, o), {
+      return l = i(r, e, a), {
         focusedItem: r[l],
-        focusedIndex: l + i,
+        focusedIndex: l + d,
         focusedType: 1
         /* ListItem */
       };
-    if (g.length) {
-      const d = g[g.length - 1];
-      return l = r.findIndex((h) => E(h, d, a)), r[l] !== void 0 ? {
-        focusedIndex: l + i,
+    if (h.length) {
+      const f = h[h.length - 1];
+      return l = r.findIndex((c) => P(c, f, o)), r[l] !== void 0 ? {
+        focusedIndex: l + d,
         focusedItem: r[l],
         focusedType: 1
         /* ListItem */
       } : { focusedType: 0, focusedIndex: -1 };
-    } else if (c && o && !e && i === 0) {
-      const d = r.findIndex((h) => !h.disabled && h[o]);
+    } else if (p && a && !e && d === 0) {
+      const f = r.findIndex((c) => !c.disabled && c[a]);
       return {
-        focusedIndex: d,
-        focusedItem: r[d - i],
+        focusedIndex: f,
+        focusedItem: r[f - d],
         focusedType: 1
         /* ListItem */
       };
     }
-    return i === 0 ? {
+    return d === 0 ? {
       focusedItem: r[0],
       focusedIndex: 0,
       focusedType: 1
@@ -651,33 +664,33 @@ const { sizeMap: D, roundedMap: ve } = ie, be = "Please enter a valid value!", H
     return this._lastSelectedOrDeslectedItemIndex === null && (this._lastSelectedOrDeslectedItemIndex = e), this._lastSelectedOrDeslectedItemIndex !== null ? this._lastSelectedOrDeslectedItemIndex + n : null;
   }
 };
-y.displayName = "MultiSelect", y.propTypes = {
-  ...M.propTypes,
-  autoClose: m.bool,
-  value: m.arrayOf(m.any),
-  defaultValue: m.arrayOf(m.any),
-  dataItemKey: m.string,
-  placeholder: m.string,
-  tags: m.arrayOf(
-    m.shape({
-      text: m.string,
-      data: m.arrayOf(m.any)
+C.displayName = "MultiSelect", C.propTypes = {
+  ...O.propTypes,
+  autoClose: v.bool,
+  value: v.arrayOf(v.any),
+  defaultValue: v.arrayOf(v.any),
+  dataItemKey: v.string,
+  placeholder: v.string,
+  tags: v.arrayOf(
+    v.shape({
+      text: v.string,
+      data: v.arrayOf(v.any)
     })
   ),
-  tagRender: m.func,
-  id: m.string,
-  ariaLabelledBy: m.string,
-  ariaDescribedBy: m.string,
-  groupField: m.string,
-  list: m.any,
-  adaptive: m.bool,
-  adaptiveTitle: m.string,
-  adaptiveSubtitle: m.string,
-  onCancel: m.func,
-  skipDisabledItems: m.bool,
-  inputAttributes: m.object
-}, y.defaultProps = {
-  ...M.defaultProps,
+  tagRender: v.func,
+  id: v.string,
+  ariaLabelledBy: v.string,
+  ariaDescribedBy: v.string,
+  groupField: v.string,
+  list: v.any,
+  adaptive: v.bool,
+  adaptiveTitle: v.string,
+  adaptiveSubtitle: v.string,
+  onCancel: v.func,
+  skipDisabledItems: v.bool,
+  inputAttributes: v.object
+}, C.defaultProps = {
+  ...O.defaultProps,
   autoClose: !0,
   required: !1,
   size: "medium",
@@ -688,16 +701,16 @@ y.displayName = "MultiSelect", y.propTypes = {
   prefix: void 0,
   suffix: void 0
 };
-let _ = y;
+let N = C;
 const Ie = Z(), ye = ee(
   te(
     Ie,
-    se(_)
+    se(N)
   )
 );
 ye.displayName = "KendoReactMultiSelect";
 export {
   ye as MultiSelect,
   Ie as MultiSelectPropsContext,
-  _ as MultiSelectWithoutContext
+  N as MultiSelectWithoutContext
 };