@progress/kendo-react-dropdowns 11.0.0-develop.3 → 11.0.0-develop.5

package/DropDownList/DropDownList.mjs

@@ -5,452 +5,430 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as i from "react";
-import E from "prop-types";
-import { usePropsContext as Yt, validatePackage as $t, useUnstyled as jt, useId as Jt, canUseDOM as nt, useAdaptiveModeContext as Qt, classNames as C, uDropDownList as L, getTabIndex as Xt, IconWrap as Zt, svgIconPropType as Rt, createPropsContext as en, Keys as w, uDropDownsActionSheet as j, WatermarkOverlay as tn } from "@progress/kendo-react-common";
-import { FloatingLabel as nn } from "@progress/kendo-react-labels";
-import { caretAltDownIcon as rn, checkIcon as on } from "@progress/kendo-svg-icons";
+import * as s from "react";
+import C from "prop-types";
+import { usePropsContext as Yt, validatePackage as jt, useUnstyled as Jt, useId as Qt, canUseDOM as tt, useAdaptiveModeContext as Xt, classNames as L, uDropDownList as P, getTabIndex as Zt, IconWrap as Rt, svgIconPropType as en, createPropsContext as tn, Keys as I, WatermarkOverlay as nn, sizeMap as rn } from "@progress/kendo-react-common";
+import { FloatingLabel as on } from "@progress/kendo-react-labels";
+import { caretAltDownIcon as sn } from "@progress/kendo-svg-icons";
 import an from "../common/ListContainer.mjs";
-import sn from "../common/ListFilter.mjs";
-import rt from "../common/GroupStickyHeader.mjs";
-import ln from "../common/ListDefaultItem.mjs";
-import dn from "../common/List.mjs";
+import ln from "../common/ListFilter.mjs";
+import nt from "../common/GroupStickyHeader.mjs";
+import dn from "../common/ListDefaultItem.mjs";
+import cn from "../common/List.mjs";
 import lt from "../common/DropDownBase.mjs";
-import { getFilteredData as b, areSame as M, getItemValue as fe, isPresent as ot, itemIndexStartsWith as cn, sameCharsOnly as un, shuffleData as pn, matchText as it } from "../common/utils.mjs";
-import { packageMetadata as mn } from "../package-metadata.mjs";
-import { Button as at } from "@progress/kendo-react-buttons";
-import { useLocalization as fn } from "@progress/kendo-react-intl";
-import { dropDownListArrowBtnAriaLabel as st, messages as vn } from "../messages/index.mjs";
-import { ActionSheet as gn, ActionSheetHeader as hn, ActionSheetContent as In } from "@progress/kendo-react-layout";
-const yn = "Please select a value from the list!", Ke = i.forwardRef((dt, ct) => {
-  let Te = !1;
+import { getFilteredData as E, areSame as M, getItemValue as te, isPresent as rt, itemIndexStartsWith as un, sameCharsOnly as pn, shuffleData as mn, matchText as ot } from "../common/utils.mjs";
+import { packageMetadata as fn } from "../package-metadata.mjs";
+import { Button as gn } from "@progress/kendo-react-buttons";
+import { useLocalization as vn } from "@progress/kendo-react-intl";
+import { dropDownListArrowBtnAriaLabel as it, messages as st, dropDownListAdaptiveFilterPlaceholder as at } from "../messages/index.mjs";
+import { ActionSheetContent as In } from "@progress/kendo-react-layout";
+import { AdaptiveMode as hn } from "../common/AdaptiveMode.mjs";
+const yn = "Please select a value from the list!", Fe = s.forwardRef((dt, ct) => {
+  let Ke = !1;
   const n = Yt(wn, dt), {
     delay: ut = T.delay,
     tabIndex: pt = T.tabIndex,
-    ignoreCase: ve = T.ignoreCase,
-    size: ne = T.size,
-    rounded: ze = T.rounded,
-    fillMode: ge = T.fillMode,
+    ignoreCase: pe = T.ignoreCase,
+    size: O = T.size,
+    rounded: Ne = T.rounded,
+    fillMode: me = T.fillMode,
     groupMode: Dn = T.groupMode
   } = n;
   if (n.filterable || n.virtual) {
     const e = [];
-    n.filterable && e.push("filterable"), n.virtual && e.push("virtualization"), Te = !$t(mn, {
+    n.filterable && e.push("filterable"), n.virtual && e.push("virtualization"), Ke = !jt(fn, {
       component: "DropDownList",
       features: e
     });
   }
-  const N = jt(), he = Jt(n.id), Ie = () => {
+  const F = Jt(), fe = Qt(n.id), ge = () => {
     var e;
-    if (nt)
-      return ((e = Q.current) == null ? void 0 : e.ownerDocument) || window.document;
+    if (tt)
+      return ((e = J.current) == null ? void 0 : e.ownerDocument) || window.document;
   }, mt = () => {
     var e, r;
     (e = t == null ? void 0 : t.current) != null && e.wrapper && ((r = t == null ? void 0 : t.current) == null || r.wrapper.focus({ preventScroll: !0 }));
   }, k = () => {
     let e;
-    return A.current !== void 0 && A.current !== null ? e = A.current : n.value !== void 0 ? e = n.value : p.value !== void 0 && p.value !== null ? e = p.value : n.defaultValue !== void 0 && n.defaultValue !== null && (e = n.defaultValue), !ot(e) && n.defaultItem !== void 0 && n.defaultItem !== null && (e = n.defaultItem), e;
+    return H.current !== void 0 && H.current !== null ? e = H.current : n.value !== void 0 ? e = n.value : p.value !== void 0 && p.value !== null ? e = p.value : n.defaultValue !== void 0 && n.defaultValue !== null && (e = n.defaultValue), !rt(e) && n.defaultItem !== void 0 && n.defaultItem !== null && (e = n.defaultItem), e;
   }, ft = () => {
-    const { dataItemKey: e } = n, r = b(n), a = k();
-    return r.findIndex((c) => M(c, a, e));
-  }, ye = () => n.required !== void 0 ? n.required : T.required, we = () => {
-    const e = n.validationMessage !== void 0, r = k(), a = !ye() || r !== null && r !== "" && r !== void 0, c = n.valid !== void 0 ? n.valid : a;
+    const { dataItemKey: e } = n, r = E(n), o = k();
+    return r.findIndex((l) => M(l, o, e));
+  }, ve = () => n.required !== void 0 ? n.required : T.required, Ie = () => {
+    const e = n.validationMessage !== void 0, r = k(), o = !ve() || r !== null && r !== "" && r !== void 0, l = n.valid !== void 0 ? n.valid : o;
     return {
       customError: e,
-      valid: c,
+      valid: l,
       valueMissing: r === null
     };
-  }, vt = () => n.validityStyles !== void 0 ? n.validityStyles : T.validityStyles, re = (e) => {
-    oe.current = !0, e.focus(), window.setTimeout(() => oe.current = !1, 30);
-  }, De = () => {
-    X.current && re(X.current), n.adaptive && setTimeout(() => {
-      X.current && re(X.current);
+  }, gt = () => n.validityStyles !== void 0 ? n.validityStyles : T.validityStyles, ne = (e) => {
+    re.current = !0, e.focus(), window.setTimeout(() => re.current = !1, 30);
+  }, he = () => {
+    Q.current && ne(Q.current), n.adaptive && setTimeout(() => {
+      Q.current && ne(Q.current);
     }, 300);
-  }, gt = i.useCallback((e) => {
+  }, vt = s.useCallback((e) => {
     for (const r of e)
-      Tt(r.target.clientWidth);
-  }, []), Oe = () => {
+      Ot(r.target.clientWidth);
+  }, []), Te = () => {
     var e;
-    (e = Ee.current) != null && e.setCustomValidity && Ee.current.setCustomValidity(
-      we().valid ? "" : n.validationMessage || yn
+    (e = xe.current) != null && e.setCustomValidity && xe.current.setCustomValidity(
+      Ie().valid ? "" : n.validationMessage || yn
     );
-  }, q = (e, r) => {
-    const a = k();
-    M(a, e, n.dataItemKey) || (n.value === void 0 && (r.data.value = e), t.current.updateComponentArgs({ value: e }), A.current = e, r.events.push({ type: "onChange" }));
-  }, F = (e) => {
+  }, U = (e, r) => {
+    const o = k();
+    M(o, e, n.dataItemKey) || (n.value === void 0 && (r.data.value = e), t.current.updateComponentArgs({ value: e }), H.current = e, r.events.push({ type: "onChange" }));
+  }, K = (e) => {
     var r;
-    (r = t == null ? void 0 : t.current) == null || r.applyState(e), A.current = void 0;
-  }, J = (e, r) => {
-    var l;
-    const { virtual: a, dataItemKey: c, defaultItem: u } = n, m = b(n), v = a ? a.skip : 0, f = k(), o = e === -1 && u !== void 0 ? u : m[e - v], d = !M(o, f, c);
-    q(o, r), d && ((l = t == null ? void 0 : t.current) == null || l.triggerPageChangeCornerItems(o, r));
-  }, O = (e, r, a) => {
-    var I, h;
-    const { defaultItem: c, dataItemKey: u, virtual: m = { skip: 0, total: 0, pageSize: 0 } } = n, v = k(), f = b(n), o = (I = t == null ? void 0 : t.current) == null ? void 0 : I.vs, d = f.findIndex((y) => M(y, v, u)), l = (h = t == null ? void 0 : t.current) == null ? void 0 : h.navigation.navigate({
-      current: m.skip + d,
-      max: (o != null && o.enabled ? m.total : f.length) - 1,
-      min: c !== void 0 ? -1 : 0,
+    (r = t == null ? void 0 : t.current) == null || r.applyState(e), H.current = void 0;
+  }, j = (e, r) => {
+    var c;
+    const { virtual: o, dataItemKey: l, defaultItem: d } = n, u = E(n), g = o ? o.skip : 0, m = k(), i = e === -1 && d !== void 0 ? d : u[e - g], f = !M(i, m, l);
+    U(i, r), f && ((c = t == null ? void 0 : t.current) == null || c.triggerPageChangeCornerItems(i, r));
+  }, V = (e, r, o) => {
+    var x, h;
+    const { defaultItem: l, dataItemKey: d, virtual: u = { skip: 0, total: 0, pageSize: 0 } } = n, g = k(), m = E(n), i = (x = t == null ? void 0 : t.current) == null ? void 0 : x.vs, f = m.findIndex((w) => M(w, g, d)), c = (h = t == null ? void 0 : t.current) == null ? void 0 : h.navigation.navigate({
+      current: u.skip + f,
+      max: (i != null && i.enabled ? u.total : m.length) - 1,
+      min: l !== void 0 ? -1 : 0,
       keyCode: r,
-      skipItems: a || void 0
+      skipItems: o || void 0
     });
-    l !== void 0 && J(l, e), F(e);
-  }, ht = (e) => {
-    Q.current = e, t.current.wrapper = e;
-  }, It = (e) => /* @__PURE__ */ i.createElement(
+    c !== void 0 && j(c, e), K(e);
+  }, It = (e) => {
+    J.current = e, t.current.wrapper = e;
+  }, ht = (e) => /* @__PURE__ */ s.createElement(
     "select",
     {
       name: n.name,
       ref: (r) => {
-        Ee.current = r;
+        xe.current = r;
       },
       tabIndex: -1,
       "aria-hidden": !0,
       title: n.label,
       style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
     },
-    /* @__PURE__ */ i.createElement("option", { value: n.valueMap ? n.valueMap.call(void 0, e) : e })
-  ), Se = () => {
+    /* @__PURE__ */ s.createElement("option", { value: n.valueMap ? n.valueMap.call(void 0, e) : e })
+  ), ye = () => {
     const {
       textField: e,
       dataItemKey: r,
-      virtual: a = { skip: 0 },
-      focusedItemIndex: c = cn,
-      filterable: u,
-      skipDisabledItems: m = !0
-    } = n, v = k(), f = b(n), o = n.filter ? n.filter : p.text;
-    return m && e && !o && !v ? f.findIndex((d) => !d.disabled && d[e]) : ot(v) && o === void 0 || u && o === "" ? f.findIndex((d) => M(d, v, r)) : o ? ke.current ? c(f, o, e) : f.findIndex((d) => M(d, v, r)) : a.skip === 0 ? 0 : -1;
-  }, Ae = (e, r) => r !== void 0 && r !== -1 && e && e.length > 0 && e[r].disabled, xe = () => {
-    const e = b(n), r = t.current.initState(), a = Se();
-    Ae(e, a) && (q(null, r), F(r));
-  }, Ce = (e) => {
+      virtual: o = { skip: 0 },
+      focusedItemIndex: l = un,
+      filterable: d,
+      skipDisabledItems: u = !0
+    } = n, g = k(), m = E(n), i = n.filter ? n.filter : p.text;
+    return u && e && !i && !g ? m.findIndex((f) => !f.disabled && f[e]) : rt(g) && i === void 0 || d && i === "" ? m.findIndex((f) => M(f, g, r)) : i ? Se.current ? l(m, i, e) : m.findIndex((f) => M(f, g, r)) : o.skip === 0 ? 0 : -1;
+  }, ze = (e, r) => r !== void 0 && r !== -1 && e && e.length > 0 && e[r].disabled, we = () => {
+    const e = E(n), r = t.current.initState(), o = ye();
+    ze(e, o) && (U(null, r), K(r));
+  }, De = (e) => {
     if (e.isPropagationStopped())
       return;
     const r = t.current.initState();
-    r.syntheticEvent = e, p.focused || (r.data.focused = !0), xe(), t.current.togglePopup(r), F(r);
-  }, He = (e) => {
-    var z, pe, W, me, $, et, tt;
+    r.syntheticEvent = e, p.focused || (r.data.focused = !0), we(), t.current.togglePopup(r), K(r);
+  }, Oe = (e) => {
+    var z, ce, q, ue, Y, Re, et;
     e && e.target instanceof Element && e.target.nodeName === "INPUT" && e.stopPropagation && e.stopPropagation();
     const {
       filterable: r,
-      disabled: a,
-      defaultItem: c,
-      leftRightKeysNavigation: u = !0,
-      virtual: m = { skip: 0, total: 0, pageSize: 0 },
-      dataItemKey: v,
-      groupField: f = "",
-      textField: o,
-      skipDisabledItems: d = !0
-    } = n, l = b(n), I = k(), h = l.findIndex((x) => M(x, I, v)), y = n.opened !== void 0 ? n.opened : p.opened, s = e.keyCode, K = s === w.home || s === w.end, P = s === w.up || s === w.down, Y = !y && (e.altKey && s === w.down || s === w.enter || s === w.space), te = y && (e.altKey && s === w.up || s === w.esc), ce = u && (s === w.left || s === w.right), ue = P || ce && !r || K, S = t.current.initState();
-    if (S.syntheticEvent = e, !a) {
-      if (K && ((z = t == null ? void 0 : t.current) != null && z.vs.enabled))
-        s === w.home ? m.skip !== 0 ? ((pe = t == null ? void 0 : t.current) == null || pe.triggerOnPageChange(S, 0, m.pageSize), H.current = !0) : q(l[0], S) : m.skip < m.total - m.pageSize ? ((W = t == null ? void 0 : t.current) == null || W.triggerOnPageChange(
-          S,
-          m.total - m.pageSize,
-          m.pageSize
-        ), H.current = !0) : q(l[l.length - 1], S);
-      else if (y && s === w.pageUp)
-        e.preventDefault(), (me = t == null ? void 0 : t.current) == null || me.scrollPopupByPageSize(-1);
-      else if (y && s === w.pageDown)
-        e.preventDefault(), ($ = t == null ? void 0 : t.current) == null || $.scrollPopupByPageSize(1);
-      else if (y && s === w.enter) {
-        const x = Se();
-        Ae(l, x) ? (q(null, S), F(S)) : J(x, S), (et = t == null ? void 0 : t.current) == null || et.togglePopup(S), e.preventDefault();
-      } else if (Y || te)
-        te && xe(), (tt = t == null ? void 0 : t.current) == null || tt.togglePopup(S), e.preventDefault();
-      else if (ue) {
-        if (ke.current = !1, f !== "" && o)
-          if (!d && y)
-            O(S, s);
+      disabled: o,
+      defaultItem: l,
+      leftRightKeysNavigation: d = !0,
+      virtual: u = { skip: 0, total: 0, pageSize: 0 },
+      dataItemKey: g,
+      groupField: m = "",
+      textField: i,
+      skipDisabledItems: f = !0
+    } = n, c = E(n), x = k(), h = c.findIndex((S) => M(S, x, g)), w = n.opened !== void 0 ? n.opened : p.opened, a = e.keyCode, N = a === I.home || a === I.end, b = a === I.up || a === I.down, $ = !w && (e.altKey && a === I.down || a === I.enter || a === I.space), ee = w && (e.altKey && a === I.up || a === I.esc), le = d && (a === I.left || a === I.right), de = b || le && !r || N, D = t.current.initState();
+    if (D.syntheticEvent = e, !o) {
+      if (N && ((z = t == null ? void 0 : t.current) != null && z.vs.enabled))
+        a === I.home ? u.skip !== 0 ? ((ce = t == null ? void 0 : t.current) == null || ce.triggerOnPageChange(D, 0, u.pageSize), A.current = !0) : U(c[0], D) : u.skip < u.total - u.pageSize ? ((q = t == null ? void 0 : t.current) == null || q.triggerOnPageChange(
+          D,
+          u.total - u.pageSize,
+          u.pageSize
+        ), A.current = !0) : U(c[c.length - 1], D);
+      else if (w && a === I.pageUp)
+        e.preventDefault(), (ue = t == null ? void 0 : t.current) == null || ue.scrollPopupByPageSize(-1);
+      else if (w && a === I.pageDown)
+        e.preventDefault(), (Y = t == null ? void 0 : t.current) == null || Y.scrollPopupByPageSize(1);
+      else if (w && a === I.enter) {
+        const S = ye();
+        ze(c, S) ? (U(null, D), K(D)) : j(S, D), (Re = t == null ? void 0 : t.current) == null || Re.togglePopup(D), e.preventDefault();
+      } else if ($ || ee)
+        ee && we(), (et = t == null ? void 0 : t.current) == null || et.togglePopup(D), e.preventDefault();
+      else if (de) {
+        if (Se.current = !1, m !== "" && i)
+          if (!f && w)
+            V(D, a);
           else {
-            let x;
-            if (s === w.down || s === w.right) {
-              const D = l.slice(h + 1).find((g) => !g.disabled && g[o]);
-              x = D && l.findIndex((g) => g[o] === D[o]);
-            } else if (s === w.up || s === w.left) {
-              let D;
-              if (h === 0 && c)
-                x = -1;
+            let S;
+            if (a === I.down || a === I.right) {
+              const y = c.slice(h + 1).find((v) => !v.disabled && v[i]);
+              S = y && c.findIndex((v) => v[i] === y[i]);
+            } else if (a === I.up || a === I.left) {
+              let y;
+              if (h === 0 && l)
+                S = -1;
               else if (h === -1)
-                D = l, x = l.findIndex((g) => !g.disabled && g[o]);
+                y = c, S = c.findIndex((v) => !v.disabled && v[i]);
               else {
-                D = l.slice(0, h);
-                let g = D.pop();
-                for (; g && g.disabled; )
-                  g = D.pop();
-                x = g && l.findIndex((Fe) => Fe[o] === g[o]);
+                y = c.slice(0, h);
+                let v = y.pop();
+                for (; v && v.disabled; )
+                  v = y.pop();
+                S = v && c.findIndex((Me) => Me[i] === v[i]);
               }
             }
-            if (x !== void 0) {
-              const D = x - h;
-              O(S, s, D);
-            } else x === void 0 && l.findIndex((D) => D[o] === I[o]) === l.length - 1 && O(S, s);
+            if (S !== void 0) {
+              const y = S - h;
+              V(D, a, y);
+            } else S === void 0 && c.findIndex((y) => y[i] === x[i]) === c.length - 1 && V(D, a);
           }
-        else if (!d && y || K)
-          O(S, s);
-        else if (o) {
-          let x;
-          if (s === w.down || s === w.right) {
-            const D = l.slice(h + 1).find((g) => !g.disabled && g[o]);
-            x = D && l.findIndex((g) => g[o] === D[o]);
-          } else if (s === w.up || s === w.left) {
-            let D;
-            if (h === 0 && c)
-              x = -1;
+        else if (!f && w || N)
+          V(D, a);
+        else if (i) {
+          let S;
+          if (a === I.down || a === I.right) {
+            const y = c.slice(h + 1).find((v) => !v.disabled && v[i]);
+            S = y && c.findIndex((v) => v[i] === y[i]);
+          } else if (a === I.up || a === I.left) {
+            let y;
+            if (h === 0 && l)
+              S = -1;
             else if (h === -1)
-              D = l, x = l.find((g) => !g.disabled && g[o]);
+              y = c, S = c.find((v) => !v.disabled && v[i]);
             else {
-              D = l.slice(0, h);
-              let g = D.pop();
-              for (; g && g.disabled; )
-                g = D.pop();
-              x = g && l.findIndex((Fe) => Fe[o] === g[o]);
+              y = c.slice(0, h);
+              let v = y.pop();
+              for (; v && v.disabled; )
+                v = y.pop();
+              S = v && c.findIndex((Me) => Me[i] === v[i]);
             }
           }
-          if (x !== void 0) {
-            const D = x - h;
-            O(S, s, D);
-          } else x === void 0 && l.findIndex((D) => D[o] === I[o]) === l.length - 1 && O(S, s);
+          if (S !== void 0) {
+            const y = S - h;
+            V(D, a, y);
+          } else S === void 0 && c.findIndex((y) => y[i] === x[i]) === c.length - 1 && V(D, a);
         } else
-          O(S, s);
+          V(D, a);
         e.preventDefault();
       }
-      F(S);
+      K(D);
     }
   }, yt = (e) => {
     const r = t.current.initState();
-    r.syntheticEvent = e.syntheticEvent, n.filter === void 0 && (r.data.text = e.target.value), t.current.filterChanged(e.target.value, r), ke.current = !0, F(r), R({ group: void 0, text: String(e.target.value) });
-  }, Ve = () => {
-    const e = n.filter !== void 0 ? n.filter : p.text;
-    return n.filterable && /* @__PURE__ */ i.createElement(
-      sn,
+    r.syntheticEvent = e.syntheticEvent, n.filter === void 0 && (r.data.text = e.target.value), t.current.filterChanged(e.target.value, r), Se.current = !0, K(r), Z({ group: void 0, text: String(e.target.value) });
+  }, Ve = (e) => {
+    const r = n.filter !== void 0 ? n.filter : p.text;
+    return n.filterable && /* @__PURE__ */ s.createElement(
+      ln,
       {
-        value: e,
-        ref: (r) => {
-          X.current = r && r.element;
+        value: r,
+        ref: (o) => {
+          Q.current = o && o.element;
         },
         onChange: yt,
-        onKeyDown: He,
-        size: ne,
-        rounded: ze,
-        fillMode: ge,
-        renderListFilterWrapper: !0
+        onKeyDown: Oe,
+        size: e ? "large" : O,
+        rounded: Ne,
+        fillMode: me,
+        renderListFilterWrapper: !0,
+        placeholder: Ue.toLanguageString(
+          at,
+          st[at]
+        )
       }
     );
   }, wt = (e) => {
-    var a;
+    var o;
     const r = t.current.initState();
-    r.syntheticEvent = e, (a = t == null ? void 0 : t.current) == null || a.togglePopup(r), q(n.defaultItem, r), F(r);
-  }, Be = () => {
-    const { textField: e, defaultItem: r, dataItemKey: a } = n, c = k();
-    return r !== void 0 && /* @__PURE__ */ i.createElement(
-      ln,
+    r.syntheticEvent = e, (o = t == null ? void 0 : t.current) == null || o.togglePopup(r), U(n.defaultItem, r), K(r);
+  }, Dt = () => {
+    const { textField: e, defaultItem: r, dataItemKey: o } = n, l = k();
+    return r !== void 0 && /* @__PURE__ */ s.createElement(
+      dn,
       {
         defaultItem: r,
         textField: e,
-        selected: M(c, r, a),
+        selected: M(l, r, o),
         key: "defaultitemkey",
         onClick: wt
       }
     );
-  }, Dt = (e, r) => {
-    var a;
-    (a = t == null ? void 0 : t.current) == null || a.handleItemClick(e, r), A.current = void 0;
+  }, xt = (e, r) => {
+    var o;
+    (o = t == null ? void 0 : t.current) == null || o.handleItemClick(e, r), H.current = void 0;
   }, St = (e) => {
-    const { vs: r, list: a } = t.current;
+    const { vs: r, list: o } = t.current;
     r.scrollHandler(e);
-    const { groupField: c } = n;
-    let u = b(n);
-    if (!(!c || !u.length) && c) {
-      const m = _e.current = _e.current || (r.enabled ? r.itemHeight : a ? a.children[0].offsetHeight : 0), f = e.target.scrollTop - r.skip * m;
-      u = t.current.getGroupedDataModernMode(u, c);
-      let o = u[0][c];
-      for (let d = 1; d < u.length && !(m * d > f); d++)
-        u[d] && u[d][c] && (o = u[d][c]);
-      o !== p.group && R({ group: o });
+    const { groupField: l } = n;
+    let d = E(n);
+    if (!(!l || !d.length) && l) {
+      const u = We.current = We.current || (r.enabled ? r.itemHeight : o ? o.children[0].offsetHeight : 0), m = e.target.scrollTop - r.skip * u;
+      d = t.current.getGroupedDataModernMode(d, l);
+      let i = d[0][l];
+      for (let f = 1; f < d.length && !(u * f > m); f++)
+        d[f] && d[f][l] && (i = d[f][l]);
+      i !== p.group && Z({ group: i });
     }
-  }, We = () => {
-    var s;
+  }, He = () => {
+    var a;
     const {
       textField: e,
       dataItemKey: r,
-      virtual: a = { skip: 0, total: void 0 },
-      groupHeaderItemRender: c,
-      listNoDataRender: u,
-      itemRender: m
-    } = n, v = b(n), f = N && N.uDropDownList, o = t.current.vs, d = a.skip, l = n.opened !== void 0 ? n.opened : p.opened, I = t.current.getPopupSettings(), h = `translateY(${o.translate}px)`, y = k();
-    return /* @__PURE__ */ i.createElement(
-      dn,
+      virtual: o = { skip: 0, total: void 0 },
+      groupHeaderItemRender: l,
+      listNoDataRender: d,
+      itemRender: u
+    } = n, g = E(n), m = F && F.uDropDownList, i = t.current.vs, f = o.skip, c = n.opened !== void 0 ? n.opened : p.opened, x = t.current.getPopupSettings(), h = `translateY(${i.translate}px)`, w = k();
+    return /* @__PURE__ */ s.createElement(
+      cn,
       {
-        id: be,
-        show: l,
-        data: v.slice(),
-        focusedIndex: Se(),
-        value: y,
+        id: Ee,
+        show: c,
+        data: g.slice(),
+        focusedIndex: ye(),
+        value: w,
         textField: e,
         valueField: r,
-        optionsGuid: $e,
+        optionsGuid: Ge,
         groupField: n.groupField,
         groupMode: "modern",
-        listRef: (K) => {
-          o.list = t.current.list = K;
+        listRef: (N) => {
+          i.list = t.current.list = N;
         },
-        wrapperStyle: { maxHeight: de ? void 0 : I.height },
-        wrapperCssClass: C(L.listContent({ c: f })),
-        listStyle: o.enabled ? { transform: h } : void 0,
+        wrapperStyle: { maxHeight: G ? void 0 : x.height },
+        wrapperCssClass: L(P.listContent({ c: m })),
+        listStyle: i.enabled ? { transform: h } : void 0,
         key: "listkey",
-        skip: d,
-        onClick: Dt,
-        itemRender: m,
-        groupHeaderItemRender: c,
-        noDataRender: u,
+        skip: f,
+        onClick: xt,
+        itemRender: u,
+        groupHeaderItemRender: l,
+        noDataRender: d,
         onScroll: St,
-        wrapperRef: o.scrollerRef,
-        scroller: (s = t == null ? void 0 : t.current) == null ? void 0 : s.renderScrollElement(),
-        ariaSetSize: a.total
+        wrapperRef: i.scrollerRef,
+        scroller: (a = t == null ? void 0 : t.current) == null ? void 0 : a.renderScrollElement(),
+        ariaSetSize: o.total
       }
     );
-  }, xt = () => {
-    var h;
-    const { header: e, footer: r, adaptiveTitle: a, groupField: c, groupStickyHeaderItemRender: u, list: m } = n, v = b(n), f = n.opened !== void 0 ? n.opened : p.opened, o = N && N.uDropDownList, d = N && N.uDropDownsActionSheet, l = {
-      navigatable: !1,
-      navigatableElements: [],
-      expand: f,
-      animation: !0,
-      onClose: (y) => Ce(y),
-      className: C(
-        j.wrapper({
-          c: d
-        }),
-        "k-adaptive-actionsheet"
-      ),
-      animationStyles: _ && G && _ <= G.small ? { top: 0, width: "100%", height: "100%" } : void 0,
-      position: _ && G && _ <= G.small ? "fullscreen" : void 0
-    };
-    let { group: I } = p;
-    return I === void 0 && c !== void 0 && (I = fe(v[0], c)), /* @__PURE__ */ i.createElement(gn, { ...l }, /* @__PURE__ */ i.createElement(hn, { className: C(j.header({ c: d })) }, /* @__PURE__ */ i.createElement("div", { className: C(j.titleBar({ c: d })) }, /* @__PURE__ */ i.createElement("div", { className: C(j.title({ c: d })) }, /* @__PURE__ */ i.createElement("div", null, a)), /* @__PURE__ */ i.createElement("div", { className: C(j.actions({ c: d })) }, /* @__PURE__ */ i.createElement(
-      at,
-      {
-        tabIndex: 0,
-        "aria-label": "Cancel",
-        "aria-disabled": "false",
-        type: "button",
-        fillMode: "flat",
-        onClick: Ce,
-        themeColor: "primary",
-        svgIcon: on
-      }
-    ))), /* @__PURE__ */ i.createElement("div", { className: C(j.titleBarGroup({ c: d })) }, Ve())), /* @__PURE__ */ i.createElement(In, null, e && /* @__PURE__ */ i.createElement("div", { className: C(L.listHeader({ c: o })) }, e), /* @__PURE__ */ i.createElement(
-      "div",
-      {
-        className: C(
-          L.list({
-            c: o,
-            size: "large",
-            virtual: (h = t == null ? void 0 : t.current) == null ? void 0 : h.vs.enabled
-          })
-        )
-      },
-      Be(),
-      !m && I && v.length !== 0 && /* @__PURE__ */ i.createElement(
-        rt,
-        {
-          group: I,
-          groupMode: "modern",
-          render: u
-        }
-      ),
-      We()
-    ), r && /* @__PURE__ */ i.createElement("div", { className: C(L.listFooter({ c: o })) }, r)));
   }, Ct = () => {
+    const { groupField: e } = n, r = E(n), o = n.opened !== void 0 ? n.opened : p.opened, l = F && F.uDropDownList, d = {
+      title: n.adaptiveTitle || n.label,
+      subTitle: n.adaptiveSubtitle,
+      expand: o,
+      onClose: (g) => De(g),
+      windowWidth: ke,
+      mobileFilter: Ve(!0)
+    };
+    let { group: u } = p;
+    return u === void 0 && e !== void 0 && (u = te(r[0], e)), /* @__PURE__ */ s.createElement(hn, { ...d }, /* @__PURE__ */ s.createElement(In, null, /* @__PURE__ */ s.createElement("div", { className: L(P.listContainer({ c: l, popup: !1 })) }, bt())));
+  }, kt = () => {
     p.focused && window.setTimeout(() => {
-      p.focused && t.current.wrapper && re(t.current.wrapper);
+      p.focused && t.current.wrapper && ne(t.current.wrapper);
     });
   }, Et = (e) => {
     "onMouseDownOutside" in (n.popupSettings || {}) && n.popupSettings.onMouseDownOutside.call(void 0, e);
-  }, kt = () => {
-    const { header: e, footer: r, dir: a, groupField: c, groupStickyHeaderItemRender: u, list: m } = n, v = b(n), f = t.current, o = f.getPopupSettings(), d = n.opened !== void 0 ? n.opened : p.opened, l = o.width !== void 0 ? o.width : f.popupWidth, I = N && N.uDropDownList, h = {
-      dir: a !== void 0 ? a : f.dirCalculated,
-      width: l,
+  }, Lt = () => {
+    const { header: e, footer: r, dir: o, groupField: l, groupStickyHeaderItemRender: d, list: u } = n, g = E(n), m = t.current, i = m.getPopupSettings(), f = n.opened !== void 0 ? n.opened : p.opened, c = i.width !== void 0 ? i.width : m.popupWidth, x = F && F.uDropDownList, h = {
+      dir: o !== void 0 ? o : m.dirCalculated,
+      width: c,
       popupSettings: {
-        ...o,
-        popupClass: C(
-          o.popupClass,
-          L.listContainer({
-            c: I
+        ...i,
+        popupClass: L(
+          i.popupClass,
+          P.listContainer({
+            c: x,
+            popup: !0
           })
         ),
-        anchor: o.anchor || Q.current,
-        show: d,
-        onOpen: De,
-        onClose: Ct,
+        anchor: i.anchor || J.current,
+        show: f,
+        onOpen: he,
+        onClose: kt,
         onMouseDownOutside: Et
       },
-      itemsCount: [v.length]
+      itemsCount: [g.length]
     };
-    let { group: y } = p;
-    return y === void 0 && c !== void 0 && (y = fe(v[0], c)), /* @__PURE__ */ i.createElement(an, { ...h }, Ve(), e && /* @__PURE__ */ i.createElement("div", { className: C(L.listHeader({ c: I })) }, e), /* @__PURE__ */ i.createElement(
+    let { group: w } = p;
+    return w === void 0 && l !== void 0 && (w = te(g[0], l)), /* @__PURE__ */ s.createElement(an, { ...h }, Ve(!1), e && /* @__PURE__ */ s.createElement("div", { className: L(P.listHeader({ c: x })) }, e), /* @__PURE__ */ s.createElement(
       "div",
       {
-        className: C(
-          L.list({
-            c: I,
-            size: ne,
+        className: L(
+          P.list({
+            c: x,
+            size: O,
             virtual: t.current.vs.enabled
           })
         )
       },
-      Be(),
-      !m && y && v.length !== 0 && /* @__PURE__ */ i.createElement(rt, { group: y, groupMode: "modern", render: u }),
-      We()
-    ), r && /* @__PURE__ */ i.createElement("div", { className: C(L.listFooter({ c: I })) }, r), Te && /* @__PURE__ */ i.createElement(tn, null));
-  }, Lt = (e) => {
-    const { dataItemKey: r } = n, a = b(n), c = k();
-    let u = a.map((P, Y) => ({ item: P, itemIndex: Y }));
-    const m = U.current.word, v = U.current.last, f = un(m, v);
-    let o = u.length, d = Math.max(
+      Dt(),
+      !u && w && g.length !== 0 && /* @__PURE__ */ s.createElement(nt, { group: w, groupMode: "modern", render: d }),
+      He()
+    ), r && /* @__PURE__ */ s.createElement("div", { className: L(P.listFooter({ c: x })) }, r), Ke && /* @__PURE__ */ s.createElement(nn, null));
+  }, bt = () => {
+    const { header: e, footer: r, groupStickyHeaderItemRender: o, groupField: l, list: d } = n, u = E(n), g = F && F.uDropDownList;
+    let { group: m } = p;
+    return m === void 0 && l !== void 0 && (m = te(u[0], l)), /* @__PURE__ */ s.createElement(s.Fragment, null, e && /* @__PURE__ */ s.createElement("div", { className: L(P.listHeader({ c: g })) }, e), /* @__PURE__ */ s.createElement(
+      "div",
+      {
+        className: L("k-list", {
+          [`k-list-${G ? "lg" : rn[O] || O}`]: O
+        })
+      },
+      !d && m && u.length !== 0 && /* @__PURE__ */ s.createElement(nt, { group: m, groupMode: "modern", render: o }),
+      He()
+    ), r && /* @__PURE__ */ s.createElement("div", { className: "k-list-footer" }, r));
+  }, Pt = (e) => {
+    const { dataItemKey: r } = n, o = E(n), l = k();
+    let d = o.map((b, $) => ({ item: b, itemIndex: $ }));
+    const u = _.current.word, g = _.current.last, m = pn(u, g);
+    let i = d.length, f = Math.max(
       0,
-      a.findIndex((P) => M(P, c, r))
-    ), l;
-    n.defaultItem && (l = { item: n.defaultItem, itemIndex: -1 }, o += 1, d += 1), d += f ? 1 : 0, u = pn(u, d, l);
-    let I, h, y, s = 0;
-    const { textField: K } = n;
-    for (; s < o; ) {
-      if (I = fe(u[s].item, K), h = f && it(I, v, ve), y = it(I, m, ve), h || y) {
-        s = u[s].itemIndex;
+      o.findIndex((b) => M(b, l, r))
+    ), c;
+    n.defaultItem && (c = { item: n.defaultItem, itemIndex: -1 }, i += 1, f += 1), f += m ? 1 : 0, d = mn(d, f, c);
+    let x, h, w, a = 0;
+    const { textField: N } = n;
+    for (; a < i; ) {
+      if (x = te(d[a].item, N), h = m && ot(x, g, pe), w = ot(x, u, pe), h || w) {
+        a = d[a].itemIndex;
         break;
       }
-      s++;
+      a++;
     }
-    if (s !== o) {
-      const P = t.current.initState();
-      P.syntheticEvent = e, J(s, P), F(P), A.current = void 0;
+    if (a !== i) {
+      const b = t.current.initState();
+      b.syntheticEvent = e, j(a, b), K(b), H.current = void 0;
     }
-  }, bt = (e) => {
-    clearTimeout(Ue.current), n.filterable || (Ue.current = window.setTimeout(() => U.current.word = "", ut), Lt(e));
-  }, Pt = (e) => {
-    oe.current || t.current.handleFocus(e);
   }, Mt = (e) => {
-    if (oe.current || !p.focused)
+    clearTimeout(Be.current), n.filterable || (Be.current = window.setTimeout(() => _.current.word = "", ut), Pt(e));
+  }, Ft = (e) => {
+    re.current || t.current.handleFocus(e);
+  }, Kt = (e) => {
+    if (re.current || !p.focused)
       return;
-    const r = n.opened !== void 0 ? n.opened : p.opened, a = t.current.initState();
-    a.syntheticEvent = e, a.data.focused = !1, a.events.push({ type: "onBlur" }), r && xe(), r && !de && t.current.togglePopup(a), F(a);
+    const r = n.opened !== void 0 ? n.opened : p.opened, o = t.current.initState();
+    o.syntheticEvent = e, o.data.focused = !1, o.events.push({ type: "onBlur" }), r && we(), r && !G && t.current.togglePopup(o), K(o);
   }, Nt = (e) => {
-    if (n.filterable || e.which === 0 || e.keyCode === w.enter)
+    if (n.filterable || e.which === 0 || e.keyCode === I.enter)
       return;
     let r = String.fromCharCode(e.charCode || e.keyCode);
-    ve && (r = r.toLowerCase()), r === " " && e.preventDefault(), U.current = {
-      word: U.current.word + r,
-      last: U.current.last + r
-    }, bt(e);
-  }, Ft = () => {
+    pe && (r = r.toLowerCase()), r === " " && e.preventDefault(), _.current = {
+      word: _.current.word + r,
+      last: _.current.last + r
+    }, Mt(e);
+  }, Tt = () => {
     const e = t.current.initState();
-    e.data.opened = p.opened, t.current.togglePopup(e), F(e);
-  }, qe = i.useRef(null), Q = i.useRef(null), Ee = i.useRef(null), X = i.useRef(null);
-  i.useImperativeHandle(
-    qe,
+    e.data.opened = p.opened, t.current.togglePopup(e), K(e);
+  }, Ae = s.useRef(null), J = s.useRef(null), xe = s.useRef(null), Q = s.useRef(null);
+  s.useImperativeHandle(
+    Ae,
     () => ({
       get element() {
-        return Q.current;
+        return J.current;
       },
       get index() {
         return ft();
@@ -459,7 +437,7 @@ const yn = "Please select a value from the list!", Ke = i.forwardRef((dt, ct) =>
         return n.name;
       },
       get validity() {
-        return we();
+        return Ie();
       },
       get value() {
         return k();
@@ -472,13 +450,13 @@ const yn = "Please select a value from the list!", Ke = i.forwardRef((dt, ct) =>
       },
       focus: mt,
       props: n,
-      togglePopup: Ft
+      togglePopup: Tt
     })
-  ), i.useImperativeHandle(
+  ), s.useImperativeHandle(
     ct,
-    () => qe.current
+    () => Ae.current
   );
-  const Ue = i.useRef(null), U = i.useRef({ word: "", last: "" }), oe = i.useRef(!1), A = i.useRef(null), H = i.useRef(!1), ke = i.useRef(!1), V = i.useRef({}), Le = i.useRef({}), t = i.useRef(
+  const Be = s.useRef(null), _ = s.useRef({ word: "", last: "" }), re = s.useRef(!1), H = s.useRef(null), A = s.useRef(!1), Se = s.useRef(!1), B = s.useRef({}), Ce = s.useRef({}), t = s.useRef(
     new lt({
       props: n,
       setState: () => {
@@ -491,159 +469,159 @@ const yn = "Please select a value from the list!", Ke = i.forwardRef((dt, ct) =>
       handleItemSelect: () => {
       }
     })
-  ), _e = i.useRef(0), Z = i.useRef(null), [p, Kt] = i.useState({}), [_, Tt] = i.useState(), [, Ge] = i.useReducer((e) => e, !0), zt = fn(), R = (e) => {
-    Kt({ ...p, ...e });
+  ), We = s.useRef(0), X = s.useRef(null), [p, zt] = s.useState({}), [ke, Ot] = s.useState(), [, qe] = s.useReducer((e) => e, !0), Ue = vn(), Z = (e) => {
+    zt({ ...p, ...e });
   };
-  i.useEffect(() => {
+  s.useEffect(() => {
     t.current.updateComponentArgs({
       props: n,
-      setState: R,
+      setState: Z,
       state: p,
-      forceUpdate: Ge,
-      element: Q.current,
-      handleItemSelect: J,
+      forceUpdate: qe,
+      element: J.current,
+      handleItemSelect: j,
       value: k()
     });
-  }, [R, p, Ge, J, k]), i.useEffect(() => {
-    var d, l, I, h, y, s, K, P, Y, te, ce, ue, S;
-    const { dataItemKey: e, virtual: r, groupField: a = "", textField: c } = n, u = b(n), m = V.current.virtual ? V.current.virtual.total : 0, v = n.opened !== void 0 ? n.opened : p.opened, f = V.current.opened !== void 0 ? V.current.opened : Le.current.opened, o = !f && v;
-    if ((d = t == null ? void 0 : t.current) == null || d.didUpdate(), (l = t == null ? void 0 : t.current) != null && l.getPopupSettings().animate || o && De(), r && r.total !== m)
-      (I = t == null ? void 0 : t.current) == null || I.vs.calcScrollElementHeight(), (h = t == null ? void 0 : t.current) == null || h.vs.reset();
+  }, [Z, p, qe, j, k]), s.useEffect(() => {
+    var f, c, x, h, w, a, N, b, $, ee, le, de, D;
+    const { dataItemKey: e, virtual: r, groupField: o = "", textField: l } = n, d = E(n), u = B.current.virtual ? B.current.virtual.total : 0, g = n.opened !== void 0 ? n.opened : p.opened, m = B.current.opened !== void 0 ? B.current.opened : Ce.current.opened, i = !m && g;
+    if ((f = t == null ? void 0 : t.current) == null || f.didUpdate(), (c = t == null ? void 0 : t.current) != null && c.getPopupSettings().animate || i && he(), r && r.total !== u)
+      (x = t == null ? void 0 : t.current) == null || x.vs.calcScrollElementHeight(), (h = t == null ? void 0 : t.current) == null || h.vs.reset();
     else {
-      const z = k(), pe = V.current.value !== void 0 ? V.current.value : Le.current.value;
-      let W = u.findIndex(($) => M($, z, e));
-      a !== "" && z && c && (W = (s = (y = t == null ? void 0 : t.current) == null ? void 0 : y.getGroupedDataModernMode(u, a)) == null ? void 0 : s.map(($) => $[c]).indexOf(z[c]));
-      const me = !M(pe, z, e);
-      o && r ? (K = t == null ? void 0 : t.current) == null || K.scrollToVirtualItem(r, W) : o && !r ? (De(), u && u.length !== 0 && ((P = t == null ? void 0 : t.current) == null || P.resetGroupStickyHeader(u[0][a], {
-        setState: R,
+      const z = k(), ce = B.current.value !== void 0 ? B.current.value : Ce.current.value;
+      let q = d.findIndex((Y) => M(Y, z, e));
+      o !== "" && z && l && (q = (a = (w = t == null ? void 0 : t.current) == null ? void 0 : w.getGroupedDataModernMode(d, o)) == null ? void 0 : a.map((Y) => Y[l]).indexOf(z[l]));
+      const ue = !M(ce, z, e);
+      i && r ? (N = t == null ? void 0 : t.current) == null || N.scrollToVirtualItem(r, q) : i && !r ? (he(), d && d.length !== 0 && ((b = t == null ? void 0 : t.current) == null || b.resetGroupStickyHeader(d[0][o], {
+        setState: Z,
         group: p.group,
         state: p
-      })), (Y = t == null ? void 0 : t.current) == null || Y.scrollToItem(W)) : v && f && z && me && !H.current ? (ce = t == null ? void 0 : t.current) == null || ce.scrollToItem(W, (te = t == null ? void 0 : t.current) == null ? void 0 : te.vs.enabled) : v && f && H.current && (H.current && r && r.skip === 0 ? (ue = t == null ? void 0 : t.current) == null || ue.vs.reset() : H.current && r && r.skip === r.total - r.pageSize && ((S = t == null ? void 0 : t.current) == null || S.vs.scrollToEnd()));
+      })), ($ = t == null ? void 0 : t.current) == null || $.scrollToItem(q)) : g && m && z && ue && !A.current ? (le = t == null ? void 0 : t.current) == null || le.scrollToItem(q, (ee = t == null ? void 0 : t.current) == null ? void 0 : ee.vs.enabled) : g && m && A.current && (A.current && r && r.skip === 0 ? (de = t == null ? void 0 : t.current) == null || de.vs.reset() : A.current && r && r.skip === r.total - r.pageSize && ((D = t == null ? void 0 : t.current) == null || D.vs.scrollToEnd()));
     }
-    H.current = !1, Le.current = p, V.current = n, Oe();
-  }), i.useEffect(() => {
+    A.current = !1, Ce.current = p, B.current = n, Te();
+  }), s.useEffect(() => {
     var e, r;
-    return Z.current = nt && window.ResizeObserver && new window.ResizeObserver(gt.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Oe(), (r = Ie()) != null && r.body && Z.current && Z.current.observe(Ie().body), () => {
-      var a;
-      (a = Ie()) != null && a.body && Z.current && Z.current.disconnect();
+    return X.current = tt && window.ResizeObserver && new window.ResizeObserver(vt.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Te(), (r = ge()) != null && r.body && X.current && X.current.observe(ge().body), () => {
+      var o;
+      (o = ge()) != null && o.body && X.current && X.current.disconnect();
     };
   }, []);
-  const Ye = he + "-accessibility-id", be = he + "-listbox-id", $e = he + "-guid", Ot = zt.toLanguageString(
-    st,
-    vn[st]
+  const _e = fe + "-accessibility-id", Ee = fe + "-listbox-id", Ge = fe + "-guid", Vt = Ue.toLanguageString(
+    it,
+    st[it]
   ), {
-    style: ie,
-    className: At,
-    label: Pe,
-    dir: Ht,
-    virtual: B,
-    adaptive: Sn,
-    dataItemKey: Vt,
-    disabled: ae,
-    loading: je,
-    iconClassName: Je,
-    svgIcon: Bt,
-    valueRender: Qe
-  } = n, Me = n.opened !== void 0 ? n.opened : p.opened, se = k(), Ne = fe(se, n.textField), Xe = !vt() || we().valid, le = t.current, Wt = le.vs, ee = N && N.uDropDownList;
-  Wt.enabled = B !== void 0;
-  const G = Qt(), de = !!(_ && G && _ <= G.medium && n.adaptive);
-  B !== void 0 && (le.vs.skip = B.skip, le.vs.total = B.total, le.vs.pageSize = B.pageSize);
-  const qt = b(n), { focused: Ut } = p, _t = qt.findIndex((e) => M(e, se, Vt)), Ze = /* @__PURE__ */ i.createElement("span", { id: Ye, className: C(L.inputInner({ c: ee })) }, Ne && /* @__PURE__ */ i.createElement("span", { className: C(L.inputText({ c: ee })) }, Ne)), Gt = Qe !== void 0 ? Qe.call(void 0, Ze, se) : Ze, Re = /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
+    style: oe,
+    className: Ht,
+    label: Le,
+    dir: At,
+    virtual: W,
+    adaptive: xn,
+    dataItemKey: Bt,
+    disabled: ie,
+    loading: $e,
+    iconClassName: Ye,
+    svgIcon: Wt,
+    valueRender: je
+  } = n, be = n.opened !== void 0 ? n.opened : p.opened, se = k(), Pe = te(se, n.textField), Je = !gt() || Ie().valid, ae = t.current, qt = ae.vs, R = F && F.uDropDownList;
+  qt.enabled = W !== void 0;
+  const Qe = Xt(), G = !!(ke && Qe && ke <= Qe.medium && n.adaptive);
+  W !== void 0 && (ae.vs.skip = W.skip, ae.vs.total = W.total, ae.vs.pageSize = W.pageSize);
+  const Ut = E(n), { focused: _t } = p, Gt = Ut.findIndex((e) => M(e, se, Bt)), Xe = /* @__PURE__ */ s.createElement("span", { id: _e, className: L(P.inputInner({ c: R })) }, Pe && /* @__PURE__ */ s.createElement("span", { className: L(P.inputText({ c: R })) }, Pe)), $t = je !== void 0 ? je.call(void 0, Xe, se) : Xe, Ze = /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
     "span",
     {
-      ref: ht,
-      className: C(
-        L.wrapper({
-          c: ee,
-          size: ne,
-          rounded: ze,
-          fillMode: ge,
-          focused: Ut,
-          disabled: ae,
-          invalid: !Xe,
-          loading: je,
-          required: ye()
+      ref: It,
+      className: L(
+        P.wrapper({
+          c: R,
+          size: O,
+          rounded: Ne,
+          fillMode: me,
+          focused: _t,
+          disabled: ie,
+          invalid: !Je,
+          loading: $e,
+          required: ve()
         }),
-        At
+        Ht
       ),
-      style: Pe ? { ...ie, width: void 0 } : ie,
-      dir: Ht,
-      onMouseDown: Me ? (e) => {
-        e.target.nodeName !== "INPUT" && (re(t.current.wrapper), e.preventDefault());
+      style: Le ? { ...oe, width: void 0 } : oe,
+      dir: At,
+      onMouseDown: be ? (e) => {
+        e.target.nodeName !== "INPUT" && (ne(t.current.wrapper), e.preventDefault());
       } : void 0,
-      onFocus: Pt,
-      onBlur: Mt,
-      tabIndex: Xt(pt, ae),
+      onFocus: G ? (e) => De(e) : Ft,
+      onBlur: Kt,
+      tabIndex: Zt(pt, ie),
       accessKey: n.accessKey,
-      onKeyDown: He,
+      onKeyDown: Oe,
       onKeyPress: Nt,
-      onClick: ae ? void 0 : Ce,
+      onClick: ie ? void 0 : De,
       role: "combobox",
-      "aria-required": ye(),
-      "aria-disabled": ae || void 0,
+      "aria-required": ve(),
+      "aria-disabled": ie || void 0,
       "aria-haspopup": "listbox",
-      "aria-expanded": Me || !1,
-      "aria-owns": be,
-      "aria-activedescendant": Me ? "option-" + $e + "-" + (_t + (B ? B.skip : 0)) : void 0,
+      "aria-expanded": be || !1,
+      "aria-owns": Ee,
+      "aria-activedescendant": be ? "option-" + Ge + "-" + (Gt + (W ? W.skip : 0)) : void 0,
       "aria-label": n.ariaLabel || n.label,
       "aria-labelledby": n.ariaLabelledBy,
-      "aria-describedby": n.ariaDescribedBy || Ye,
-      "aria-controls": be,
+      "aria-describedby": n.ariaDescribedBy || _e,
+      "aria-controls": Ee,
       id: n.id,
       title: n.title
     },
-    Gt,
-    je && /* @__PURE__ */ i.createElement(Zt, { className: C(L.loadingIcon({ c: ee })), name: "loading" }),
-    /* @__PURE__ */ i.createElement(
-      at,
+    $t,
+    $e && /* @__PURE__ */ s.createElement(Rt, { className: L(P.loadingIcon({ c: R })), name: "loading" }),
+    /* @__PURE__ */ s.createElement(
+      gn,
       {
         tabIndex: -1,
         type: "button",
-        "aria-label": Ot,
-        size: ne,
-        fillMode: ge,
-        className: C(L.inputButton({ c: ee })),
+        "aria-label": Vt,
+        size: O,
+        fillMode: me,
+        className: L(P.inputButton({ c: R })),
         rounded: null,
         themeColor: "base",
-        iconClass: Je,
-        svgIcon: Je ? void 0 : Bt || rn,
+        iconClass: Ye,
+        svgIcon: Ye ? void 0 : Wt || sn,
         onMouseDown: (e) => p.focused && e.preventDefault()
       }
     ),
-    It(se),
-    !de && kt()
-  ), de && xt());
-  return Pe ? /* @__PURE__ */ i.createElement(
-    nn,
+    ht(se),
+    !G && Lt()
+  ), G && Ct());
+  return Le ? /* @__PURE__ */ s.createElement(
+    on,
     {
-      label: Pe,
-      editorValue: Ne,
-      editorValid: Xe,
+      label: Le,
+      editorValue: Pe,
+      editorValid: Je,
       editorDisabled: n.disabled,
-      style: { width: ie ? ie.width : void 0 },
-      children: Re
+      style: { width: oe ? oe.width : void 0 },
+      children: Ze
     }
-  ) : Re;
+  ) : Ze;
 });
-Ke.propTypes = {
-  delay: E.number,
-  ignoreCase: E.bool,
-  iconClassName: E.string,
-  svgIcon: Rt,
-  defaultItem: E.any,
-  valueRender: E.func,
-  valueMap: E.func,
-  validationMessage: E.string,
-  required: E.bool,
-  id: E.string,
-  ariaLabelledBy: E.string,
-  ariaDescribedBy: E.string,
-  ariaLabel: E.string,
-  leftRightKeysNavigation: E.bool,
-  title: E.string,
-  groupField: E.string,
-  list: E.any,
-  skipDisabledItems: E.bool
+Fe.propTypes = {
+  delay: C.number,
+  ignoreCase: C.bool,
+  iconClassName: C.string,
+  svgIcon: en,
+  defaultItem: C.any,
+  valueRender: C.func,
+  valueMap: C.func,
+  validationMessage: C.string,
+  required: C.bool,
+  id: C.string,
+  ariaLabelledBy: C.string,
+  ariaDescribedBy: C.string,
+  ariaLabel: C.string,
+  leftRightKeysNavigation: C.bool,
+  title: C.string,
+  groupField: C.string,
+  list: C.any,
+  skipDisabledItems: C.bool
 };
 const T = {
   delay: 500,
@@ -656,11 +634,11 @@ const T = {
   fillMode: "solid",
   groupMode: "modern"
 };
-Ke.displayName = "KendoReactDropDownList";
-const wn = en();
-Ke.displayName = "KendoReactDropDownList";
+Fe.displayName = "KendoReactDropDownList";
+const wn = tn();
+Fe.displayName = "KendoReactDropDownList";
 export {
-  Ke as DropDownList,
+  Fe as DropDownList,
   wn as DropDownListPropsContext,
   T as dropDownListDefaultProps
 };