@progress/kendo-react-dropdowns 14.5.0-develop.8 → 14.5.0-develop.9

package/DropDownList/DropDownList.mjs

@@ -9,14 +9,14 @@ import * as i from "react";
 import C from "prop-types";
 import { getLicenseMessage as Qt, usePropsContext as Xt, validatePackage as Zt, useUnstyled as Rt, useId as en, useKendoPaste as tn, canUseDOM as tt, useAdaptiveModeContext as nn, classNames as L, uDropDownList as P, getTabIndex as rn, IconWrap as on, createPropsContext as sn, Keys as h, WatermarkOverlay as an, sizeMap as ln, svgIconPropType as dn } from "@progress/kendo-react-common";
 import { FloatingLabel as cn } from "@progress/kendo-react-labels";
-import { caretAltDownIcon as un } from "@progress/kendo-svg-icons";
+import { chevronDownIcon as un } from "@progress/kendo-svg-icons";
 import pn from "../common/ListContainer.mjs";
 import mn from "../common/ListFilter.mjs";
 import nt from "../common/GroupStickyHeader.mjs";
 import fn from "../common/ListDefaultItem.mjs";
-import gn from "../common/List.mjs";
+import vn from "../common/List.mjs";
 import dt from "../common/DropDownBase.mjs";
-import { getFilteredData as E, getItemIndexByText as vn, areSame as F, getItemValue as ne, isPresent as rt, itemIndexStartsWith as hn, sameCharsOnly as In, shuffleData as yn, matchText as ot } from "../common/utils.mjs";
+import { getFilteredData as E, getItemIndexByText as gn, areSame as F, getItemValue as ne, isPresent as rt, itemIndexStartsWith as hn, sameCharsOnly as In, shuffleData as yn, matchText as ot } from "../common/utils.mjs";
 import { packageMetadata as it } from "../package-metadata.mjs";
 import { Button as wn } from "@progress/kendo-react-buttons";
 import { useLocalization as xn } from "@progress/kendo-react-intl";
@@ -40,17 +40,17 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       features: e
     });
   }
-  const K = Rt(), ge = en(n.id), ve = () => {
+  const K = Rt(), ve = en(n.id), ge = () => {
     var e;
     if (tt)
-      return ((e = A.current) == null ? void 0 : e.ownerDocument) || window.document;
-  }, gt = () => {
+      return ((e = B.current) == null ? void 0 : e.ownerDocument) || window.document;
+  }, vt = () => {
     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 B.current !== void 0 && B.current !== null ? e = B.current : n.value !== void 0 ? e = n.value : m.value !== void 0 && m.value !== null ? e = m.value : n.defaultValue !== void 0 && n.defaultValue !== null && (e = n.defaultValue), !rt(e) && n.defaultItem !== void 0 && n.defaultItem !== null && (e = n.defaultItem), e;
-  }, vt = () => {
+    return A.current !== void 0 && A.current !== null ? e = A.current : n.value !== void 0 ? e = n.value : m.value !== void 0 && m.value !== null ? e = m.value : n.defaultValue !== void 0 && n.defaultValue !== null && (e = n.defaultValue), !rt(e) && n.defaultItem !== void 0 && n.defaultItem !== null && (e = n.defaultItem), e;
+  }, gt = () => {
     const { dataItemKey: e } = n, r = E(n), o = k();
     return r.findIndex((l) => F(l, o, e));
   }, he = () => n.required !== void 0 ? n.required : O.required, Ie = () => {
@@ -76,18 +76,18 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     );
   }, V = (e, r) => {
     const o = k();
-    F(o, e, n.dataItemKey) || (n.value === void 0 && (r.data.value = e), t.current.updateComponentArgs({ value: e }), B.current = e, r.events.push({ type: "onChange" }));
+    F(o, e, n.dataItemKey) || (n.value === void 0 && (r.data.value = e), t.current.updateComponentArgs({ value: e }), A.current = e, r.events.push({ type: "onChange" }));
   }, M = (e) => {
     var r;
-    (r = t == null ? void 0 : t.current) == null || r.applyState(e), B.current = void 0;
+    (r = t == null ? void 0 : t.current) == null || r.applyState(e), A.current = void 0;
   }, Q = (e, r) => {
     var u;
-    const { virtual: o, dataItemKey: l, defaultItem: a } = n, c = E(n), p = o ? o.skip : 0, f = k(), d = e === -1 && a !== void 0 ? a : c[e - p], g = !F(d, f, l);
-    V(d, r), g && ((u = t == null ? void 0 : t.current) == null || u.triggerPageChangeCornerItems(d, r));
+    const { virtual: o, dataItemKey: l, defaultItem: a } = n, c = E(n), p = o ? o.skip : 0, f = k(), d = e === -1 && a !== void 0 ? a : c[e - p], v = !F(d, f, l);
+    V(d, r), v && ((u = t == null ? void 0 : t.current) == null || u.triggerPageChangeCornerItems(d, r));
   }, H = (e, r, o) => {
-    var S, v;
-    const { defaultItem: l, dataItemKey: a, virtual: c = { skip: 0, total: 0, pageSize: 0 } } = n, p = k(), f = E(n), d = (S = t == null ? void 0 : t.current) == null ? void 0 : S.vs, g = f.findIndex((I) => F(I, p, a)), u = (v = t == null ? void 0 : t.current) == null ? void 0 : v.navigation.navigate({
-      current: c.skip + g,
+    var S, g;
+    const { defaultItem: l, dataItemKey: a, virtual: c = { skip: 0, total: 0, pageSize: 0 } } = n, p = k(), f = E(n), d = (S = t == null ? void 0 : t.current) == null ? void 0 : S.vs, v = f.findIndex((I) => F(I, p, a)), u = (g = t == null ? void 0 : t.current) == null ? void 0 : g.navigation.navigate({
+      current: c.skip + v,
       max: (d != null && d.enabled ? c.total : f.length) - 1,
       min: l !== void 0 ? -1 : 0,
       keyCode: r,
@@ -95,7 +95,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     });
     u !== void 0 && Q(u, e), M(e);
   }, yt = (e) => {
-    A.current = e, t.current.wrapper = e;
+    B.current = e, t.current.wrapper = e;
   }, wt = (e) => /* @__PURE__ */ i.createElement(
     "select",
     {
@@ -118,7 +118,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       filterable: a,
       skipDisabledItems: c = !0
     } = n, p = k(), f = E(n), d = n.filter ? n.filter : m.text;
-    return c && e && !d && !p ? f.findIndex((g) => !g.disabled) : rt(p) && d === void 0 || a && d === "" ? f.findIndex((g) => F(g, p, r)) : d ? Ce.current ? l(f, d, e) : f.findIndex((g) => F(g, p, r)) : o.skip === 0 ? 0 : -1;
+    return c && e && !d && !p ? f.findIndex((v) => !v.disabled) : rt(p) && d === void 0 || a && d === "" ? f.findIndex((v) => F(v, p, r)) : d ? Ce.current ? l(f, d, e) : f.findIndex((v) => F(v, p, r)) : o.skip === 0 ? 0 : -1;
   }, Te = (e, r) => r !== void 0 && r !== -1 && e && e.length > 0 && e[r].disabled, xe = () => {
     const e = E(n), r = t.current.initState(), o = we();
     Te(e, o) && (V(null, r), M(r));
@@ -139,8 +139,8 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       dataItemKey: p,
       groupField: f = "",
       textField: d,
-      skipDisabledItems: g = !0
-    } = n, u = E(n), S = k(), v = u.findIndex((w) => F(w, S, p)), I = n.opened !== void 0 ? n.opened : m.opened, s = e.keyCode, N = s === h.home || s === h.end, b = s === h.up || s === h.down, Y = !I && (e.altKey && s === h.down || s === h.enter || s === h.space), te = I && (e.altKey && s === h.up || s === h.esc), ce = a && (s === h.left || s === h.right), ue = b || ce && !r || N, y = t.current.initState();
+      skipDisabledItems: v = !0
+    } = n, u = E(n), S = k(), g = u.findIndex((w) => F(w, S, p)), I = n.opened !== void 0 ? n.opened : m.opened, s = e.keyCode, N = s === h.home || s === h.end, b = s === h.up || s === h.down, Y = !I && (e.altKey && s === h.down || s === h.enter || s === h.space), te = I && (e.altKey && s === h.up || s === h.esc), ce = a && (s === h.left || s === h.right), ue = b || ce && !r || N, y = t.current.initState();
     if (y.syntheticEvent = e, !o) {
       if (N && ((T = t == null ? void 0 : t.current) != null && T.vs.enabled))
         s === h.home ? c.skip !== 0 ? ((pe = t == null ? void 0 : t.current) == null || pe.triggerOnPageChange(y, 0, c.pageSize), W.current = !0) : V(u[0], y) : c.skip < c.total - c.pageSize ? ((G = t == null ? void 0 : t.current) == null || G.triggerOnPageChange(
@@ -159,21 +159,21 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
         te && xe(), (et = t == null ? void 0 : t.current) == null || et.togglePopup(y), e.preventDefault();
       else if (ue) {
         if (Ce.current = !1, f !== "" && d)
-          if (!g && I)
+          if (!v && I)
             H(y, s);
           else {
             let w;
             if (s === h.down || s === h.right) {
-              const x = u.slice(v + 1).find((D) => !D.disabled);
+              const x = u.slice(g + 1).find((D) => !D.disabled);
               w = x && u.indexOf(x);
             } else if (s === h.up || s === h.left) {
               let x;
-              if (v === 0 && l)
+              if (g === 0 && l)
                 w = -1;
-              else if (v === -1)
+              else if (g === -1)
                 x = u, w = u.findIndex((D) => !D.disabled);
               else {
-                x = u.slice(0, v);
+                x = u.slice(0, g);
                 let D = x.pop();
                 for (; D && D.disabled; )
                   D = x.pop();
@@ -181,25 +181,25 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
               }
             }
             if (w !== void 0) {
-              const x = w - v;
+              const x = w - g;
               H(y, s, x);
-            } else w === void 0 && v === u.length - 1 && H(y, s);
+            } else w === void 0 && g === u.length - 1 && H(y, s);
           }
-        else if (!g && I || N)
+        else if (!v && I || N)
           H(y, s);
         else if (d) {
           let w;
           if (s === h.down || s === h.right) {
-            const x = u.slice(v + 1).find((D) => !D.disabled);
+            const x = u.slice(g + 1).find((D) => !D.disabled);
             w = x && u.indexOf(x);
           } else if (s === h.up || s === h.left) {
             let x;
-            if (v === 0 && l)
+            if (g === 0 && l)
               w = -1;
-            else if (v === -1)
+            else if (g === -1)
               x = u, w = u.findIndex((D) => !D.disabled);
             else {
-              x = u.slice(0, v);
+              x = u.slice(0, g);
               let D = x.pop();
               for (; D && D.disabled; )
                 D = x.pop();
@@ -207,9 +207,9 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
             }
           }
           if (w !== void 0) {
-            const x = w - v;
+            const x = w - g;
             H(y, s, x);
-          } else w === void 0 && v === u.length - 1 && H(y, s);
+          } else w === void 0 && g === u.length - 1 && H(y, s);
         } else
           H(y, s);
         e.preventDefault();
@@ -258,18 +258,18 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     );
   }, Ct = (e, r) => {
     var o;
-    (o = t == null ? void 0 : t.current) == null || o.handleItemClick(e, r), B.current = void 0;
+    (o = t == null ? void 0 : t.current) == null || o.handleItemClick(e, r), A.current = void 0;
   }, kt = (e) => {
     const { vs: r, list: o } = t.current;
     r.scrollHandler(e);
     const { groupField: l } = n;
     let a = E(n);
     if (!(!l || !a.length) && l) {
-      const c = Be.current = Be.current || (r.enabled ? r.itemHeight : o ? o.children[0].offsetHeight : 0), f = e.target.scrollTop - r.skip * c;
+      const c = Ae.current = Ae.current || (r.enabled ? r.itemHeight : o ? o.children[0].offsetHeight : 0), f = e.target.scrollTop - r.skip * c;
       a = t.current.getGroupedDataModernMode(a, l);
       let d = a[0][l];
-      for (let g = 1; g < a.length && !(c * g > f); g++)
-        a[g] && a[g][l] && (d = a[g][l]);
+      for (let v = 1; v < a.length && !(c * v > f); v++)
+        a[v] && a[v][l] && (d = a[v][l]);
       d !== m.group && R({ group: d });
     }
   }, Ve = () => {
@@ -281,9 +281,9 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       groupHeaderItemRender: l,
       listNoDataRender: a,
       itemRender: c
-    } = n, p = E(n), f = K && K.uDropDownList, d = t.current.vs, g = o.skip, u = n.opened !== void 0 ? n.opened : m.opened, S = t.current.getPopupSettings(), v = `translateY(${d.translate}px)`, I = k();
+    } = n, p = E(n), f = K && K.uDropDownList, d = t.current.vs, v = o.skip, u = n.opened !== void 0 ? n.opened : m.opened, S = t.current.getPopupSettings(), g = `translateY(${d.translate}px)`, I = k();
     return /* @__PURE__ */ i.createElement(
-      gn,
+      vn,
       {
         id: Le,
         show: u,
@@ -299,9 +299,9 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
         },
         wrapperStyle: { maxHeight: _ ? void 0 : S.height },
         wrapperCssClass: L(P.listContent({ c: f })),
-        listStyle: d.enabled ? { transform: v } : void 0,
+        listStyle: d.enabled ? { transform: g } : void 0,
         key: "listkey",
-        skip: g,
+        skip: v,
         onClick: Ct,
         itemRender: c,
         groupHeaderItemRender: l,
@@ -330,7 +330,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
   }, bt = (e) => {
     "onMouseDownOutside" in (n.popupSettings || {}) && n.popupSettings.onMouseDownOutside.call(void 0, e);
   }, Pt = () => {
-    const { header: e, footer: r, dir: o, groupField: l, groupStickyHeaderItemRender: a, list: c } = n, p = E(n), f = t.current, d = f.getPopupSettings(), g = n.opened !== void 0 ? n.opened : m.opened, u = d.width !== void 0 ? d.width : f.popupWidth, S = K && K.uDropDownList, v = {
+    const { header: e, footer: r, dir: o, groupField: l, groupStickyHeaderItemRender: a, list: c } = n, p = E(n), f = t.current, d = f.getPopupSettings(), v = n.opened !== void 0 ? n.opened : m.opened, u = d.width !== void 0 ? d.width : f.popupWidth, S = K && K.uDropDownList, g = {
       dir: o !== void 0 ? o : f.dirCalculated,
       width: u,
       popupSettings: {
@@ -342,8 +342,8 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
             popup: !0
           })
         ),
-        anchor: d.anchor || A.current,
-        show: g,
+        anchor: d.anchor || B.current,
+        show: v,
         onOpen: ye,
         onClose: Lt,
         onMouseDownOutside: bt
@@ -351,7 +351,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       itemsCount: [p.length]
     };
     let { group: I } = m;
-    return I === void 0 && l !== void 0 && (I = ne(p[0], l)), /* @__PURE__ */ i.createElement(pn, { ...v }, ze(!1), e && /* @__PURE__ */ i.createElement("div", { className: L(P.listHeader({ c: S })) }, e), /* @__PURE__ */ i.createElement(
+    return I === void 0 && l !== void 0 && (I = ne(p[0], l)), /* @__PURE__ */ i.createElement(pn, { ...g }, ze(!1), e && /* @__PURE__ */ i.createElement("div", { className: L(P.listHeader({ c: S })) }, e), /* @__PURE__ */ i.createElement(
       "div",
       {
         className: L(
@@ -383,15 +383,15 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     const { dataItemKey: r } = n, o = E(n), l = k();
     let a = o.map((b, Y) => ({ item: b, itemIndex: Y }));
     const c = $.current.word, p = $.current.last, f = In(c, p);
-    let d = a.length, g = Math.max(
+    let d = a.length, v = Math.max(
       0,
       o.findIndex((b) => F(b, l, r))
     ), u;
-    n.defaultItem && (u = { item: n.defaultItem, itemIndex: -1 }, d += 1, g += 1), g += f ? 1 : 0, a = yn(a, g, u);
-    let S, v, I, s = 0;
+    n.defaultItem && (u = { item: n.defaultItem, itemIndex: -1 }, d += 1, v += 1), v += f ? 1 : 0, a = yn(a, v, u);
+    let S, g, I, s = 0;
     const { textField: N } = n;
     for (; s < d; ) {
-      if (S = ne(a[s].item, N), v = f && ot(S, p, J), I = ot(S, c, J), v || I) {
+      if (S = ne(a[s].item, N), g = f && ot(S, p, J), I = ot(S, c, J), g || I) {
         s = a[s].itemIndex;
         break;
       }
@@ -399,10 +399,10 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     }
     if (s !== d) {
       const b = t.current.initState();
-      b.syntheticEvent = e, Q(s, b), M(b), B.current = void 0;
+      b.syntheticEvent = e, Q(s, b), M(b), A.current = void 0;
     }
   }, Kt = (e) => {
-    clearTimeout(Ae.current), n.filterable || (Ae.current = window.setTimeout(() => $.current.word = "", mt), Mt(e));
+    clearTimeout(Be.current), n.filterable || (Be.current = window.setTimeout(() => $.current.word = "", mt), Mt(e));
   }, Nt = (e) => {
     oe.current || t.current.handleFocus(e);
   }, Tt = (e) => {
@@ -421,15 +421,15 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
   }, zt = () => {
     const e = t.current.initState();
     e.data.opened = m.opened, t.current.togglePopup(e), M(e);
-  }, He = i.useRef(null), A = i.useRef(null), Se = i.useRef(null), X = i.useRef(null);
+  }, He = i.useRef(null), B = i.useRef(null), Se = i.useRef(null), X = i.useRef(null);
   i.useImperativeHandle(
     He,
     () => ({
       get element() {
-        return A.current;
+        return B.current;
       },
       get index() {
-        return vt();
+        return gt();
       },
       get name() {
         return n.name;
@@ -446,7 +446,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       get opened() {
         return m.opened;
       },
-      focus: gt,
+      focus: vt,
       props: n,
       togglePopup: zt
     })
@@ -454,7 +454,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     ut,
     () => He.current
   );
-  const Ae = i.useRef(null), $ = i.useRef({ word: "", last: "" }), oe = i.useRef(!1), B = i.useRef(null), W = i.useRef(!1), Ce = i.useRef(!1), q = i.useRef({}), ke = i.useRef({}), t = i.useRef(
+  const Be = i.useRef(null), $ = i.useRef({ word: "", last: "" }), oe = i.useRef(!1), A = i.useRef(null), W = i.useRef(!1), Ce = i.useRef(!1), q = i.useRef({}), ke = i.useRef({}), t = i.useRef(
     new dt({
       props: n,
       setState: () => {
@@ -467,23 +467,23 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       handleItemSelect: () => {
       }
     })
-  ), Be = i.useRef(0), Z = i.useRef(null), [m, Vt] = i.useState({}), [Ee, Ht] = i.useState(), [, We] = i.useReducer((e) => e, !0), qe = xn(), Ue = n.name || n.id, At = i.useCallback(
+  ), Ae = i.useRef(0), Z = i.useRef(null), [m, Vt] = i.useState({}), [Ee, Ht] = i.useState(), [, We] = i.useReducer((e) => e, !0), qe = xn(), Ue = n.name || n.id, Bt = i.useCallback(
     (e) => {
       if (e == null || !t.current)
         return;
-      const r = E(n), { textField: o } = n, l = String(e), a = vn(r, l, o, !1, J), c = a !== -1 ? r[a] : void 0;
+      const r = E(n), { textField: o } = n, l = String(e), a = gn(r, l, o, !1, J), c = a !== -1 ? r[a] : void 0;
       if (c !== void 0) {
         const p = t.current.initState();
         p.syntheticEvent = {
-          target: A.current
+          target: B.current
         }, V(c, p), M(p);
       }
     },
     [n, J]
   );
-  tn(A, {
+  tn(B, {
     fieldName: Ue,
-    onValueChange: At,
+    onValueChange: Bt,
     enabled: !!Ue
   });
   const R = (e) => {
@@ -495,15 +495,15 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       setState: R,
       state: m,
       forceUpdate: We,
-      element: A.current,
+      element: B.current,
       handleItemSelect: Q,
       value: k()
     });
   }, [R, m, We, Q, k]), i.useEffect(() => {
-    var g, u, S, v, I, s, N, b, Y, te, ce, ue, y;
+    var v, u, S, g, I, s, N, b, Y, te, ce, ue, y;
     const { dataItemKey: e, virtual: r, groupField: o = "", textField: l } = n, a = E(n), c = q.current.virtual ? q.current.virtual.total : 0, p = n.opened !== void 0 ? n.opened : m.opened, f = q.current.opened !== void 0 ? q.current.opened : ke.current.opened, d = !f && p;
-    if ((g = t == null ? void 0 : t.current) == null || g.didUpdate(), (u = t == null ? void 0 : t.current) != null && u.getPopupSettings().animate || d && ye(), r && r.total !== c)
-      (S = t == null ? void 0 : t.current) == null || S.vs.calcScrollElementHeight(), (v = t == null ? void 0 : t.current) == null || v.vs.reset();
+    if ((v = t == null ? void 0 : t.current) == null || v.didUpdate(), (u = t == null ? void 0 : t.current) != null && u.getPopupSettings().animate || d && ye(), r && r.total !== c)
+      (S = t == null ? void 0 : t.current) == null || S.vs.calcScrollElementHeight(), (g = t == null ? void 0 : t.current) == null || g.vs.reset();
     else {
       const T = k(), pe = q.current.value !== void 0 ? q.current.value : ke.current.value;
       let G = a.findIndex((j) => F(j, T, e));
@@ -518,12 +518,12 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
     W.current = !1, ke.current = m, q.current = n, Ne();
   }), i.useEffect(() => {
     var e, r;
-    return Z.current = tt && window.ResizeObserver && new window.ResizeObserver(It.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Ne(), (r = ve()) != null && r.body && Z.current && Z.current.observe(ve().body), () => {
+    return Z.current = tt && window.ResizeObserver && new window.ResizeObserver(It.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Ne(), (r = ge()) != null && r.body && Z.current && Z.current.observe(ge().body), () => {
       var o;
-      (o = ve()) != null && o.body && Z.current && Z.current.disconnect();
+      (o = ge()) != null && o.body && Z.current && Z.current.disconnect();
     };
   }, []);
-  const _e = ge + "-accessibility-id", Le = ge + "-listbox-id", Ge = ge + "-guid", Bt = qe.toLanguageString(
+  const _e = ve + "-accessibility-id", Le = ve + "-listbox-id", Ge = ve + "-guid", At = qe.toLanguageString(
     st,
     at[st]
   ), {
@@ -594,7 +594,7 @@ const Cn = "Please select a value from the list!", Fe = i.forwardRef((ct, ut) =>
       {
         tabIndex: -1,
         type: "button",
-        "aria-label": Bt,
+        "aria-label": At,
         size: z,
         fillMode: fe,
         className: L(P.inputButton({ c: ee })),

package/DropDownTree/DropDownTree.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const et=require("react"),n=require("prop-types"),o=require("@progress/kendo-react-common"),tt=require("@progress/kendo-react-popup"),nt=require("@progress/kendo-react-intl"),Ie=require("@progress/kendo-react-treeview"),Se=require("../package-metadata.js"),G=require("../common/utils.js"),at=require("./useDropdownWidth.js"),ot=require("./ListNoData.js"),E=require("../messages/index.js"),rt=require("@progress/kendo-react-labels"),Re=require("../common/ListFilter.js"),st=require("@progress/kendo-react-buttons"),Te=require("@progress/kendo-svg-icons"),it=require("../common/AdaptiveMode.js"),lt=require("@progress/kendo-react-layout");function ct(u){const v=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const C in u)if(C!=="default"){const x=Object.getOwnPropertyDescriptor(u,C);Object.defineProperty(v,C,x.get?x:{enumerable:!0,get:()=>u[C]})}}return v.default=u,Object.freeze(v)}const t=ct(et),{sizeMap:ut,roundedMap:dt}=o.kendoThemeMaps,pt=12e3,ft=2e3,vt="Please select a value from the list!",mt=u=>t.createElement("span",{className:"k-input-value-text"},u.children),Me=u=>u.split("_").map(v=>parseInt(v,10)),gt=(u,v)=>{const{validationMessage:C,valid:x,required:s}=u;return{customError:C!==void 0,valid:!!(x!==void 0?x:!s||v),valueMissing:!v}},re={selectField:"selected",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},data:[],required:!1,style:{},validityStyles:!0,size:void 0,rounded:void 0,fillMode:void 0},Pe=o.createPropsContext(),se=t.forwardRef((u,v)=>{const C=!o.validatePackage(Se.packageMetadata,{component:"DropDownTree"}),x=o.getLicenseMessage(Se.packageMetadata),s=o.usePropsContext(Pe,u),r={...re,...s},qe=o.useId(),ie=r.id||qe,{data:N,dataItemKey:L,popupSettings:m={},style:V,opened:d,disabled:R,onOpen:W=o.noop,onClose:g=o.noop,placeholder:j,label:T,name:Ke,selectField:Z,subItemsField:z,validationMessage:$,valid:Oe,required:J,validityStyles:Ne}=r,Q=o.getTabIndex(r.tabIndex,R),i=t.useRef(null),b=t.useRef(null),M=t.useRef(null),Y=t.useRef(null),U=t.useRef(null),D=t.useRef(null),X=t.useRef(!1),[le,Le]=t.useState(void 0),w=r.value!==void 0,y=w?r.value:le!==void 0?le:r.defaultValue,A=G.isPresent(y),ee=A?G.getItemValue(y,r.textField):"",te=gt({validationMessage:$,valid:Oe,required:J},A),ce=t.useContext(o.ZIndexContext),Ve=ce?ce+ft:pt,We=t.useCallback(()=>b.current&&b.current.focus(),[]);t.useImperativeHandle(i,()=>({props:r,element:b.current,focus:We})),t.useImperativeHandle(v,()=>i.current);const F=o.useRtl(b,r.dir),ze={width:at.useDropdownWidth(b,re,{...re.popupSettings,...m},V),...F!==void 0?{direction:F}:{}},[Ae,ue]=t.useState(!1),l=d!==void 0?d:Ae,[f,ne]=t.useState(!1),[ae,Be]=t.useState(),[de,_e]=t.useState(""),pe=o.useAdaptiveModeContext(),k=!!(ae&&pe&&ae<=pe.medium&&r.adaptive),He=t.useCallback(()=>{U.current&&U.current.setCustomValidity&&U.current.setCustomValidity(te.valid?"":$===void 0?vt:$)},[$,te]);t.useEffect(He),t.useEffect(()=>{const e=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Qe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const fe=t.useCallback(e=>{if(!l){if(W){const a={...e};W.call(void 0,a)}d===void 0&&ue(!0)}},[l,d,W]),I=t.useCallback(e=>{if(l){if(g){const a={...e};g.call(void 0,a)}d===void 0&&(ue(!1),k&&setTimeout(()=>{var a;h((a=Y.current)==null?void 0:a.element)},300))}},[l,d,g,k]),ve=t.useCallback(e=>{if(!e.isDefaultPrevented()&&i.current){ne(!0);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};(l?I:fe)(a)}},[l,d,W,g]),P=t.useCallback(e=>{X.current=!0,e(),window.setTimeout(()=>X.current=!1,0)},[]),je=t.useCallback(e=>{var S,we;const{keyCode:a,altKey:c}=e,p=D.current&&D.current.element;if(!i.current||e.isDefaultPrevented()&&((S=M.current)==null?void 0:S.element)===e.target)return;const K={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(l)if(a===o.Keys.esc||c&&a===o.Keys.up)e.preventDefault(),I(K);else if(p&&p.querySelector(".k-focus")&&(a===o.Keys.up||a===o.Keys.down||a===o.Keys.left||a===o.Keys.right||a===o.Keys.home||a===o.Keys.end)){if(a===o.Keys.up&&((we=M.current)!=null&&we.element)){const H=Array.from(p.querySelectorAll(".k-treeview-item")),Fe=[...H].reverse().find(O=>O==null?void 0:O.querySelector(".k-focus"));if(Fe&&H.indexOf(Fe)===0)return P(()=>{var O;h((O=M.current)==null?void 0:O.element)})}P(o.noop)}else a===o.Keys.down&&P(()=>{var H;h(((H=M.current)==null?void 0:H.element)||p)});else c&&a===o.Keys.down?(e.preventDefault(),fe(K)):l||a===o.Keys.esc&&ye(e)},[l,d,W,g]),me=t.useCallback(e=>{const{keyCode:a,altKey:c}=e;c||a!==o.Keys.up&&a!==o.Keys.down||(e.preventDefault(),P(a===o.Keys.up?()=>{h(b.current)}:()=>{var p;h((p=D.current)==null?void 0:p.element)}))},[]),h=t.useCallback(e=>{e&&P(()=>e.focus())},[]),Ze=t.useCallback(e=>{var a;m.onOpen&&m.onOpen(e),!f&&l&&!d?I({target:i.current}):s.filterable?h((a=M.current)==null?void 0:a.element):h(D.current&&D.current.element)},[g,s.filterable,f,d,l]),$e=t.useCallback(e=>{m.onClose&&m.onClose(e),f&&h(b.current)},[f]),Ue=t.useCallback(e=>{if(!f&&!X.current&&(ne(!0),s.onFocus&&i.current)){const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};s.onFocus.call(void 0,a)}},[f,s.onFocus]),Xe=t.useCallback(e=>{if(f&&!X.current&&i.current){ne(!1);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(s.onBlur){const c={...a};s.onBlur.call(void 0,c)}k||I(a)}},[f,s.onBlur,l,d,g]),Ge=t.useCallback(()=>{f&&P(o.noop),k&&setTimeout(()=>{var e;h((e=Y.current)==null?void 0:e.element)},300)},[f,k]),ge=t.useCallback((e,a,c)=>{if(s.onChange){const p={value:a,level:c?Me(c):[],...e};s.onChange.call(void 0,p)}w||Le(a)},[s.onChange,w]),be=t.useCallback(e=>{if(G.areSame(e.item,y,L)||!i.current)return;const{item:a,itemHierarchicalIndex:c,nativeEvent:p,syntheticEvent:K}=e,S={syntheticEvent:K,nativeEvent:p,target:i.current};ge(S,a,c),I(S)},[w,y,s.onChange,L,l,d,g]),ye=t.useCallback(e=>{if(!i.current)return;const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};ge(a,null),I(a),e.preventDefault()},[w,s.onChange,l,d,g]),he=t.useCallback(e=>{if(e.syntheticEvent.stopPropagation(),s.onExpandChange&&i.current){const{item:a,itemHierarchicalIndex:c,nativeEvent:p,syntheticEvent:K}=e,S={level:Me(c),item:a,nativeEvent:p,syntheticEvent:K,target:i.current};s.onExpandChange.call(void 0,S)}},[s.onExpandChange]),Ee=t.useCallback(e=>{if(s.onFilterChange&&i.current){const c={filter:{field:s.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:i.current};s.onFilterChange.call(void 0,c),s.filter===void 0&&_e(e.target.value)}},[s.onFilterChange,s.filter,s.textField]),Je=()=>{const e=r.filterable?t.createElement(Re,{value:r.filter===void 0?de:r.filter,ref:Y,onChange:Ee,onKeyDown:me,size:"large",rounded:B,fillMode:_,placeholder:j}):null,a={title:r.adaptiveTitle||T,subTitle:r.adaptiveSubtitle,expand:l,onClose:c=>I(c),windowWidth:ae,mobileFilter:e};return t.createElement(it.AdaptiveMode,{...a},t.createElement(lt.ActionSheetContent,null,N.length>0?t.createElement(Ie.TreeView,{ref:D,tabIndex:Q,data:Ce,focusIdField:L,textField:r.textField,selectField:Z,expandField:r.expandField,childrenField:z,expandIcons:!0,onItemClick:be,onExpandChange:he,size:"large",item:r.item,dir:F,animate:!1}):t.createElement(ke,null,oe.toLanguageString(E.nodata,E.messages[E.nodata]))))},Qe=t.useCallback(e=>{for(const a of e)Be(a.target.clientWidth)},[]),Ce=t.useMemo(()=>w||!A?N:o.mapTree(N,z,e=>o.extendDataItem(e,z,{[Z]:G.areSame(e,y,L)})),[N,y,w,A,Z,z]),ke=r.listNoData||ot.ListNoData,Ye=r.valueHolder||mt,oe=nt.useLocalization(),xe=!Ne||te.valid,{size:q,rounded:B,fillMode:_}=r,De=t.createElement(t.Fragment,null,t.createElement("span",{className:o.classNames("k-dropdowntree k-picker",r.className,{[`k-picker-${ut[q]||q}`]:q,[`k-rounded-${dt[B]||B}`]:B,[`k-picker-${_}`]:_,"k-focus":f,"k-invalid":!xe,"k-loading":r.loading,"k-required":J,"k-disabled":r.disabled}),tabIndex:Q,accessKey:r.accessKey,id:ie,style:T?{...V,width:void 0}:V,dir:F,ref:b,onKeyDown:R?void 0:je,onMouseDown:Ge,onClick:R?void 0:ve,onFocus:k?e=>ve(e):Ue,onBlur:Xe,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":R,"aria-label":T,"aria-labelledby":r.ariaLabelledBy,"aria-describedby":r.ariaDescribedBy,"aria-required":J},t.createElement("span",{className:"k-input-inner"},(ee||j)&&t.createElement(Ye,{item:y},ee||j)),r.loading&&t.createElement(o.IconWrap,{className:"k-input-loading-icon",name:"loading"}),A&&!R&&t.createElement("span",{onClick:ye,className:"k-clear-value",title:oe.toLanguageString(E.clear,E.messages[E.clear]),role:"button",tabIndex:-1,onMouseDown:e=>e.preventDefault()},t.createElement(o.IconWrap,{name:"x",icon:Te.xIcon})),t.createElement(st.Button,{tabIndex:-1,type:"button","aria-label":"select",className:"k-input-button",size:q,fillMode:_,icon:"caret-alt-down",svgIcon:Te.caretAltDownIcon}),t.createElement("select",{name:Ke,ref:U,tabIndex:-1,"aria-hidden":!0,title:T,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:r.valueMap?r.valueMap.call(void 0,y):y})),!k&&t.createElement(o.ZIndexContext.Provider,{value:Ve},t.createElement(tt.Popup,{...m,className:o.classNames(m.className,{"k-rtl":F==="rtl"}),popupClass:o.classNames(m.popupClass,"k-dropdowntree-popup k-list-container"),style:ze,anchor:m.anchor||b.current,show:l,onOpen:Ze,onClose:$e},r.filterable&&t.createElement(Re,{value:r.filter===void 0?de:r.filter,ref:M,onChange:Ee,onKeyDown:me,size:q,rounded:B,fillMode:_,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),N.length>0?t.createElement(Ie.TreeView,{style:{height:m.height},ref:D,tabIndex:Q,data:Ce,focusIdField:L,textField:r.textField,selectField:Z,expandField:r.expandField,childrenField:z,expandIcons:!0,onItemClick:be,onExpandChange:he,size:q,item:r.item,dir:F,animate:!1}):t.createElement(ke,null,oe.toLanguageString(E.nodata,E.messages[E.nodata])),C&&t.createElement(o.WatermarkOverlay,{message:x})))),k&&Je());return T?t.createElement(rt.FloatingLabel,{label:T,editorValue:ee,editorPlaceholder:j,editorValid:xe,editorDisabled:R,editorId:ie,style:{width:V?V.width:void 0},children:De,dir:F}):De}),bt={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,value:n.any,valueMap:n.func,placeholder:n.string,dataItemKey:n.string.isRequired,textField:n.string.isRequired,selectField:n.string,expandField:n.string,subItemsField:n.string,className:n.string,style:n.object,label:n.string,validationMessage:n.string,validityStyles:n.bool,valid:n.bool,required:n.bool,name:n.string,id:n.string,ariaLabelledBy:n.string,ariaDescribedBy:n.string,filterable:n.bool,filter:n.string,loading:n.bool,popupSettings:n.shape({animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),popupClass:n.string,className:n.string,appendTo:n.any,width:n.oneOfType([n.string,n.number]),height:n.oneOfType([n.string,n.number])}),onOpen:n.func,onClose:n.func,onFocus:n.func,onBlur:n.func,onChange:n.func,onFilterChange:n.func,onExpandChange:n.func,item:n.func,valueHolder:n.func,listNoData:n.func,adaptiveTitle:n.string,adaptiveSubtitle:n.string,adaptive:n.bool};se.displayName="KendoReactDropDownTree";se.propTypes=bt;exports.DropDownTree=se;exports.DropDownTreePropsContext=Pe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const et=require("react"),n=require("prop-types"),a=require("@progress/kendo-react-common"),tt=require("@progress/kendo-react-popup"),nt=require("@progress/kendo-react-intl"),Ie=require("@progress/kendo-react-treeview"),Se=require("../package-metadata.js"),G=require("../common/utils.js"),ot=require("./useDropdownWidth.js"),at=require("./ListNoData.js"),E=require("../messages/index.js"),rt=require("@progress/kendo-react-labels"),Re=require("../common/ListFilter.js"),st=require("@progress/kendo-react-buttons"),Te=require("@progress/kendo-svg-icons"),it=require("../common/AdaptiveMode.js"),lt=require("@progress/kendo-react-layout");function ct(u){const v=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const C in u)if(C!=="default"){const x=Object.getOwnPropertyDescriptor(u,C);Object.defineProperty(v,C,x.get?x:{enumerable:!0,get:()=>u[C]})}}return v.default=u,Object.freeze(v)}const t=ct(et),{sizeMap:ut,roundedMap:dt}=a.kendoThemeMaps,pt=12e3,ft=2e3,vt="Please select a value from the list!",mt=u=>t.createElement("span",{className:"k-input-value-text"},u.children),Me=u=>u.split("_").map(v=>parseInt(v,10)),gt=(u,v)=>{const{validationMessage:C,valid:x,required:s}=u;return{customError:C!==void 0,valid:!!(x!==void 0?x:!s||v),valueMissing:!v}},re={selectField:"selected",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},data:[],required:!1,style:{},validityStyles:!0,size:void 0,rounded:void 0,fillMode:void 0},Pe=a.createPropsContext(),se=t.forwardRef((u,v)=>{const C=!a.validatePackage(Se.packageMetadata,{component:"DropDownTree"}),x=a.getLicenseMessage(Se.packageMetadata),s=a.usePropsContext(Pe,u),r={...re,...s},qe=a.useId(),ie=r.id||qe,{data:N,dataItemKey:L,popupSettings:m={},style:V,opened:d,disabled:R,onOpen:W=a.noop,onClose:g=a.noop,placeholder:j,label:T,name:Ke,selectField:Z,subItemsField:z,validationMessage:$,valid:Oe,required:J,validityStyles:Ne}=r,Q=a.getTabIndex(r.tabIndex,R),i=t.useRef(null),b=t.useRef(null),M=t.useRef(null),Y=t.useRef(null),U=t.useRef(null),D=t.useRef(null),X=t.useRef(!1),[le,Le]=t.useState(void 0),w=r.value!==void 0,y=w?r.value:le!==void 0?le:r.defaultValue,B=G.isPresent(y),ee=B?G.getItemValue(y,r.textField):"",te=gt({validationMessage:$,valid:Oe,required:J},B),ce=t.useContext(a.ZIndexContext),Ve=ce?ce+ft:pt,We=t.useCallback(()=>b.current&&b.current.focus(),[]);t.useImperativeHandle(i,()=>({props:r,element:b.current,focus:We})),t.useImperativeHandle(v,()=>i.current);const F=a.useRtl(b,r.dir),ze={width:ot.useDropdownWidth(b,re,{...re.popupSettings,...m},V),...F!==void 0?{direction:F}:{}},[Be,ue]=t.useState(!1),l=d!==void 0?d:Be,[f,ne]=t.useState(!1),[oe,Ae]=t.useState(),[de,_e]=t.useState(""),pe=a.useAdaptiveModeContext(),k=!!(oe&&pe&&oe<=pe.medium&&r.adaptive),He=t.useCallback(()=>{U.current&&U.current.setCustomValidity&&U.current.setCustomValidity(te.valid?"":$===void 0?vt:$)},[$,te]);t.useEffect(He),t.useEffect(()=>{const e=a.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Qe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const fe=t.useCallback(e=>{if(!l){if(W){const o={...e};W.call(void 0,o)}d===void 0&&ue(!0)}},[l,d,W]),I=t.useCallback(e=>{if(l){if(g){const o={...e};g.call(void 0,o)}d===void 0&&(ue(!1),k&&setTimeout(()=>{var o;h((o=Y.current)==null?void 0:o.element)},300))}},[l,d,g,k]),ve=t.useCallback(e=>{if(!e.isDefaultPrevented()&&i.current){ne(!0);const o={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};(l?I:fe)(o)}},[l,d,W,g]),P=t.useCallback(e=>{X.current=!0,e(),window.setTimeout(()=>X.current=!1,0)},[]),je=t.useCallback(e=>{var S,we;const{keyCode:o,altKey:c}=e,p=D.current&&D.current.element;if(!i.current||e.isDefaultPrevented()&&((S=M.current)==null?void 0:S.element)===e.target)return;const K={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(l)if(o===a.Keys.esc||c&&o===a.Keys.up)e.preventDefault(),I(K);else if(p&&p.querySelector(".k-focus")&&(o===a.Keys.up||o===a.Keys.down||o===a.Keys.left||o===a.Keys.right||o===a.Keys.home||o===a.Keys.end)){if(o===a.Keys.up&&((we=M.current)!=null&&we.element)){const H=Array.from(p.querySelectorAll(".k-treeview-item")),Fe=[...H].reverse().find(O=>O==null?void 0:O.querySelector(".k-focus"));if(Fe&&H.indexOf(Fe)===0)return P(()=>{var O;h((O=M.current)==null?void 0:O.element)})}P(a.noop)}else o===a.Keys.down&&P(()=>{var H;h(((H=M.current)==null?void 0:H.element)||p)});else c&&o===a.Keys.down?(e.preventDefault(),fe(K)):l||o===a.Keys.esc&&ye(e)},[l,d,W,g]),me=t.useCallback(e=>{const{keyCode:o,altKey:c}=e;c||o!==a.Keys.up&&o!==a.Keys.down||(e.preventDefault(),P(o===a.Keys.up?()=>{h(b.current)}:()=>{var p;h((p=D.current)==null?void 0:p.element)}))},[]),h=t.useCallback(e=>{e&&P(()=>e.focus())},[]),Ze=t.useCallback(e=>{var o;m.onOpen&&m.onOpen(e),!f&&l&&!d?I({target:i.current}):s.filterable?h((o=M.current)==null?void 0:o.element):h(D.current&&D.current.element)},[g,s.filterable,f,d,l]),$e=t.useCallback(e=>{m.onClose&&m.onClose(e),f&&h(b.current)},[f]),Ue=t.useCallback(e=>{if(!f&&!X.current&&(ne(!0),s.onFocus&&i.current)){const o={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};s.onFocus.call(void 0,o)}},[f,s.onFocus]),Xe=t.useCallback(e=>{if(f&&!X.current&&i.current){ne(!1);const o={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(s.onBlur){const c={...o};s.onBlur.call(void 0,c)}k||I(o)}},[f,s.onBlur,l,d,g]),Ge=t.useCallback(()=>{f&&P(a.noop),k&&setTimeout(()=>{var e;h((e=Y.current)==null?void 0:e.element)},300)},[f,k]),ge=t.useCallback((e,o,c)=>{if(s.onChange){const p={value:o,level:c?Me(c):[],...e};s.onChange.call(void 0,p)}w||Le(o)},[s.onChange,w]),be=t.useCallback(e=>{if(G.areSame(e.item,y,L)||!i.current)return;const{item:o,itemHierarchicalIndex:c,nativeEvent:p,syntheticEvent:K}=e,S={syntheticEvent:K,nativeEvent:p,target:i.current};ge(S,o,c),I(S)},[w,y,s.onChange,L,l,d,g]),ye=t.useCallback(e=>{if(!i.current)return;const o={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};ge(o,null),I(o),e.preventDefault()},[w,s.onChange,l,d,g]),he=t.useCallback(e=>{if(e.syntheticEvent.stopPropagation(),s.onExpandChange&&i.current){const{item:o,itemHierarchicalIndex:c,nativeEvent:p,syntheticEvent:K}=e,S={level:Me(c),item:o,nativeEvent:p,syntheticEvent:K,target:i.current};s.onExpandChange.call(void 0,S)}},[s.onExpandChange]),Ee=t.useCallback(e=>{if(s.onFilterChange&&i.current){const c={filter:{field:s.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:i.current};s.onFilterChange.call(void 0,c),s.filter===void 0&&_e(e.target.value)}},[s.onFilterChange,s.filter,s.textField]),Je=()=>{const e=r.filterable?t.createElement(Re,{value:r.filter===void 0?de:r.filter,ref:Y,onChange:Ee,onKeyDown:me,size:"large",rounded:A,fillMode:_,placeholder:j}):null,o={title:r.adaptiveTitle||T,subTitle:r.adaptiveSubtitle,expand:l,onClose:c=>I(c),windowWidth:oe,mobileFilter:e};return t.createElement(it.AdaptiveMode,{...o},t.createElement(lt.ActionSheetContent,null,N.length>0?t.createElement(Ie.TreeView,{ref:D,tabIndex:Q,data:Ce,focusIdField:L,textField:r.textField,selectField:Z,expandField:r.expandField,childrenField:z,expandIcons:!0,onItemClick:be,onExpandChange:he,size:"large",item:r.item,dir:F,animate:!1}):t.createElement(ke,null,ae.toLanguageString(E.nodata,E.messages[E.nodata]))))},Qe=t.useCallback(e=>{for(const o of e)Ae(o.target.clientWidth)},[]),Ce=t.useMemo(()=>w||!B?N:a.mapTree(N,z,e=>a.extendDataItem(e,z,{[Z]:G.areSame(e,y,L)})),[N,y,w,B,Z,z]),ke=r.listNoData||at.ListNoData,Ye=r.valueHolder||mt,ae=nt.useLocalization(),xe=!Ne||te.valid,{size:q,rounded:A,fillMode:_}=r,De=t.createElement(t.Fragment,null,t.createElement("span",{className:a.classNames("k-dropdowntree k-picker",r.className,{[`k-picker-${ut[q]||q}`]:q,[`k-rounded-${dt[A]||A}`]:A,[`k-picker-${_}`]:_,"k-focus":f,"k-invalid":!xe,"k-loading":r.loading,"k-required":J,"k-disabled":r.disabled}),tabIndex:Q,accessKey:r.accessKey,id:ie,style:T?{...V,width:void 0}:V,dir:F,ref:b,onKeyDown:R?void 0:je,onMouseDown:Ge,onClick:R?void 0:ve,onFocus:k?e=>ve(e):Ue,onBlur:Xe,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":R,"aria-label":T,"aria-labelledby":r.ariaLabelledBy,"aria-describedby":r.ariaDescribedBy,"aria-required":J},t.createElement("span",{className:"k-input-inner"},(ee||j)&&t.createElement(Ye,{item:y},ee||j)),r.loading&&t.createElement(a.IconWrap,{className:"k-input-loading-icon",name:"loading"}),B&&!R&&t.createElement("span",{onClick:ye,className:"k-clear-value",title:ae.toLanguageString(E.clear,E.messages[E.clear]),role:"button",tabIndex:-1,onMouseDown:e=>e.preventDefault()},t.createElement(a.IconWrap,{name:"x",icon:Te.xIcon})),t.createElement(st.Button,{tabIndex:-1,type:"button","aria-label":"select",className:"k-input-button",size:q,fillMode:_,icon:"chevron-down",svgIcon:Te.chevronDownIcon}),t.createElement("select",{name:Ke,ref:U,tabIndex:-1,"aria-hidden":!0,title:T,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:r.valueMap?r.valueMap.call(void 0,y):y})),!k&&t.createElement(a.ZIndexContext.Provider,{value:Ve},t.createElement(tt.Popup,{...m,className:a.classNames(m.className,{"k-rtl":F==="rtl"}),popupClass:a.classNames(m.popupClass,"k-dropdowntree-popup k-list-container"),style:ze,anchor:m.anchor||b.current,show:l,onOpen:Ze,onClose:$e},r.filterable&&t.createElement(Re,{value:r.filter===void 0?de:r.filter,ref:M,onChange:Ee,onKeyDown:me,size:q,rounded:A,fillMode:_,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),N.length>0?t.createElement(Ie.TreeView,{style:{height:m.height},ref:D,tabIndex:Q,data:Ce,focusIdField:L,textField:r.textField,selectField:Z,expandField:r.expandField,childrenField:z,expandIcons:!0,onItemClick:be,onExpandChange:he,size:q,item:r.item,dir:F,animate:!1}):t.createElement(ke,null,ae.toLanguageString(E.nodata,E.messages[E.nodata])),C&&t.createElement(a.WatermarkOverlay,{message:x})))),k&&Je());return T?t.createElement(rt.FloatingLabel,{label:T,editorValue:ee,editorPlaceholder:j,editorValid:xe,editorDisabled:R,editorId:ie,style:{width:V?V.width:void 0},children:De,dir:F}):De}),bt={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,value:n.any,valueMap:n.func,placeholder:n.string,dataItemKey:n.string.isRequired,textField:n.string.isRequired,selectField:n.string,expandField:n.string,subItemsField:n.string,className:n.string,style:n.object,label:n.string,validationMessage:n.string,validityStyles:n.bool,valid:n.bool,required:n.bool,name:n.string,id:n.string,ariaLabelledBy:n.string,ariaDescribedBy:n.string,filterable:n.bool,filter:n.string,loading:n.bool,popupSettings:n.shape({animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),popupClass:n.string,className:n.string,appendTo:n.any,width:n.oneOfType([n.string,n.number]),height:n.oneOfType([n.string,n.number])}),onOpen:n.func,onClose:n.func,onFocus:n.func,onBlur:n.func,onChange:n.func,onFilterChange:n.func,onExpandChange:n.func,item:n.func,valueHolder:n.func,listNoData:n.func,adaptiveTitle:n.string,adaptiveSubtitle:n.string,adaptive:n.bool};se.displayName="KendoReactDropDownTree";se.propTypes=bt;exports.DropDownTree=se;exports.DropDownTreePropsContext=Pe;

package/DropDownTree/DropDownTree.mjs

@@ -19,14 +19,14 @@ import { clear as Ne, messages as ie, nodata as j } from "../messages/index.mjs"
 import { FloatingLabel as xt } from "@progress/kendo-react-labels";
 import Oe from "../common/ListFilter.mjs";
 import { Button as wt } from "@progress/kendo-react-buttons";
-import { xIcon as Dt, caretAltDownIcon as Ft } from "@progress/kendo-svg-icons";
+import { xIcon as Dt, chevronDownIcon as Ft } from "@progress/kendo-svg-icons";
 import { AdaptiveMode as It } from "../common/AdaptiveMode.mjs";
 import { ActionSheetContent as St } from "@progress/kendo-react-layout";
 const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please select a value from the list!", Ot = (E) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, E.children), Ve = (E) => E.split("_").map((D) => parseInt(D, 10)), Vt = (E, D) => {
-  const { validationMessage: G, valid: B, required: r } = E;
+  const { validationMessage: G, valid: A, required: r } = E;
   return {
     customError: G !== void 0,
-    valid: !!(B !== void 0 ? B : !r || D),
+    valid: !!(A !== void 0 ? A : !r || D),
     valueMissing: !D
   };
 }, le = {
@@ -45,7 +45,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
   rounded: void 0,
   fillMode: void 0
 }, Lt = gt(), Le = t.forwardRef((E, D) => {
-  const G = !at(Me, { component: "DropDownTree" }), B = rt(Me), r = it(Lt, E), a = {
+  const G = !at(Me, { component: "DropDownTree" }), A = rt(Me), r = it(Lt, E), a = {
     ...le,
     ...r
   }, We = lt(), se = a.id || We, {
@@ -66,7 +66,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
     valid: ze,
     required: J,
     validityStyles: qe
-  } = a, Q = st(a.tabIndex, F), i = t.useRef(null), v = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), $ = t.useRef(null), y = t.useRef(null), U = t.useRef(!1), [ce, Ae] = t.useState(void 0), C = a.value !== void 0, g = C ? a.value : ce !== void 0 ? ce : a.defaultValue, K = yt(g), ee = K ? Et(g, a.textField) : "", te = Vt({ validationMessage: Z, valid: ze, required: J }, K), ue = t.useContext(Se), Be = ue ? ue + Pt : Mt, He = t.useCallback(() => v.current && v.current.focus(), []);
+  } = a, Q = st(a.tabIndex, F), i = t.useRef(null), v = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), $ = t.useRef(null), y = t.useRef(null), U = t.useRef(!1), [ce, Be] = t.useState(void 0), C = a.value !== void 0, g = C ? a.value : ce !== void 0 ? ce : a.defaultValue, K = yt(g), ee = K ? Et(g, a.textField) : "", te = Vt({ validationMessage: Z, valid: ze, required: J }, K), ue = t.useContext(Se), Ae = ue ? ue + Pt : Mt, He = t.useCallback(() => v.current && v.current.focus(), []);
   t.useImperativeHandle(i, () => ({
     props: a,
     element: v.current,
@@ -147,8 +147,8 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
           e.preventDefault(), x(M);
         else if (d && d.querySelector(".k-focus") && (o === c.up || o === c.down || o === c.left || o === c.right || o === c.home || o === c.end)) {
           if (o === c.up && ((Fe = S.current) != null && Fe.element)) {
-            const A = Array.from(d.querySelectorAll(".k-treeview-item")), Ie = [...A].reverse().find((P) => P == null ? void 0 : P.querySelector(".k-focus"));
-            if (Ie && A.indexOf(Ie) === 0)
+            const B = Array.from(d.querySelectorAll(".k-treeview-item")), Ie = [...B].reverse().find((P) => P == null ? void 0 : P.querySelector(".k-focus"));
+            if (Ie && B.indexOf(Ie) === 0)
               return T(() => {
                 var P;
                 b((P = S.current) == null ? void 0 : P.element);
@@ -156,8 +156,8 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
           }
           T(X);
         } else o === c.down && T(() => {
-          var A;
-          b(((A = S.current) == null ? void 0 : A.element) || d);
+          var B;
+          b(((B = S.current) == null ? void 0 : B.element) || d);
         });
       else s && o === c.down ? (e.preventDefault(), me(M)) : l || o === c.esc && Ee(e);
     },
@@ -229,7 +229,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
         };
         r.onChange.call(void 0, d);
       }
-      C || Ae(o);
+      C || Be(o);
     },
     [r.onChange, C]
   ), he = t.useCallback(
@@ -391,7 +391,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
         className: "k-input-button",
         size: R,
         fillMode: q,
-        icon: "caret-alt-down",
+        icon: "chevron-down",
         svgIcon: Ft
       }
     ),
@@ -407,7 +407,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
       },
       /* @__PURE__ */ t.createElement("option", { value: a.valueMap ? a.valueMap.call(void 0, g) : g })
     ),
-    !h && /* @__PURE__ */ t.createElement(Se.Provider, { value: Be }, /* @__PURE__ */ t.createElement(
+    !h && /* @__PURE__ */ t.createElement(Se.Provider, { value: Ae }, /* @__PURE__ */ t.createElement(
       bt,
       {
         ...f,
@@ -454,7 +454,7 @@ const { sizeMap: Tt, roundedMap: Rt } = mt, Mt = 12e3, Pt = 2e3, Nt = "Please se
           animate: !1
         }
       ) : /* @__PURE__ */ t.createElement(xe, null, ae.toLanguageString(j, ie[j])),
-      G && /* @__PURE__ */ t.createElement(vt, { message: B })
+      G && /* @__PURE__ */ t.createElement(vt, { message: A })
     ))
   ), h && tt());
   return I ? /* @__PURE__ */ t.createElement(

package/common/AdaptiveMode.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),c=require("@progress/kendo-react-layout"),v=require("@progress/kendo-svg-icons"),i=require("@progress/kendo-react-buttons"),h=require("@progress/kendo-react-common");function k(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const o=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(e,a,o.get?o:{enumerable:!0,get:()=>t[a]})}}return e.default=t,Object.freeze(e)}const n=k(y),C=t=>{const{footer:e,windowWidth:a=0,mobileFilter:o,children:s,navigatable:d,navigatableElements:u,expand:b,animation:m,title:p,subTitle:f,onClose:r}=t,l=h.useAdaptiveModeContext(),g={navigatable:d||!1,navigatableElements:u||[],expand:b,animation:m!==!1,suffixActions:n.createElement(i.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",size:"large",themeColor:"primary",svgIcon:v.checkIcon,onClick:r}),filter:o,onClose:r,animationStyles:l&&a<=l.small?{top:0,width:"100%",height:"100%"}:void 0,title:p,subTitle:f,className:"k-adaptive-actionsheet",position:l&&a<=l.small?"fullscreen":void 0};return n.createElement(c.ActionSheet,{...g},s,e&&n.createElement(c.ActionSheetFooter,{className:"k-actions k-actions-stretched"},n.createElement(i.Button,{size:"large",tabIndex:0,"aria-label":e.cancelText,"aria-disabled":"false",type:"button",onClick:e.onCancel},e.cancelText),n.createElement(i.Button,{tabIndex:0,themeColor:"primary",size:"large","aria-label":e.applyText,"aria-disabled":"false",type:"button",onClick:e.onApply},e.applyText)))};exports.AdaptiveMode=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react"),r=require("@progress/kendo-react-layout"),h=require("@progress/kendo-svg-icons"),i=require("@progress/kendo-react-buttons"),s=require("@progress/kendo-react-common");function k(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const o=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(e,a,o.get?o:{enumerable:!0,get:()=>t[a]})}}return e.default=t,Object.freeze(e)}const n=k(v),C=t=>{const{footer:e,windowWidth:a=0,mobileFilter:o,children:d,navigatable:u,navigatableElements:p,expand:b,animation:m,title:f,subTitle:g,onClose:c}=t,l=s.useAdaptiveModeContext(),y={navigatable:u||!1,navigatableElements:p||[],expand:b,animation:m!==!1,suffixActions:n.createElement(i.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",size:"large",themeColor:"primary",svgIcon:h.checkIcon,onClick:c}),filter:o,onClose:c,animationStyles:l&&a<=l.small?{top:0,width:"100%",height:"100%"}:void 0,title:f,subTitle:g,className:"k-adaptive-actionsheet",position:l&&a<=l.small?"fullscreen":void 0,appendTo:s.canUseDOM?document.body:null};return n.createElement(r.ActionSheet,{...y},d,e&&n.createElement(r.ActionSheetFooter,{className:"k-actions k-actions-stretched"},n.createElement(i.Button,{size:"large",tabIndex:0,"aria-label":e.cancelText,"aria-disabled":"false",type:"button",onClick:e.onCancel},e.cancelText),n.createElement(i.Button,{tabIndex:0,themeColor:"primary",size:"large","aria-label":e.applyText,"aria-disabled":"false",type:"button",onClick:e.onApply},e.applyText)))};exports.AdaptiveMode=C;

package/common/AdaptiveMode.mjs

@@ -6,14 +6,14 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as t from "react";
-import { ActionSheet as x, ActionSheetFooter as u } from "@progress/kendo-react-layout";
+import { ActionSheet as u, ActionSheetFooter as x } from "@progress/kendo-react-layout";
 import { checkIcon as C } from "@progress/kendo-svg-icons";
 import { Button as o } from "@progress/kendo-react-buttons";
-import { useAdaptiveModeContext as v } from "@progress/kendo-react-common";
+import { useAdaptiveModeContext as v, canUseDOM as y } from "@progress/kendo-react-common";
 const I = (i) => {
   const {
     footer: e,
-    windowWidth: l = 0,
+    windowWidth: n = 0,
     mobileFilter: r,
     children: s,
     navigatable: c,
@@ -22,7 +22,7 @@ const I = (i) => {
     animation: p,
     title: b,
     subTitle: f,
-    onClose: n
+    onClose: l
   } = i, a = v(), h = {
     navigatable: c || !1,
     navigatableElements: m || [],
@@ -39,18 +39,19 @@ const I = (i) => {
         size: "large",
         themeColor: "primary",
         svgIcon: C,
-        onClick: n
+        onClick: l
       }
     ),
     filter: r,
-    onClose: n,
-    animationStyles: a && l <= a.small ? { top: 0, width: "100%", height: "100%" } : void 0,
+    onClose: l,
+    animationStyles: a && n <= a.small ? { top: 0, width: "100%", height: "100%" } : void 0,
     title: b,
     subTitle: f,
     className: "k-adaptive-actionsheet",
-    position: a && l <= a.small ? "fullscreen" : void 0
+    position: a && n <= a.small ? "fullscreen" : void 0,
+    appendTo: y ? document.body : null
   };
-  return /* @__PURE__ */ t.createElement(x, { ...h }, s, e && /* @__PURE__ */ t.createElement(u, { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ t.createElement(
+  return /* @__PURE__ */ t.createElement(u, { ...h }, s, e && /* @__PURE__ */ t.createElement(x, { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ t.createElement(
     o,
     {
       size: "large",