@progress/kendo-react-dropdowns 10.0.0 → 10.1.0-develop.2

package/DropDownTree/DropDownTree.mjs

@@ -7,27 +7,27 @@
  */
 import * as t from "react";
 import n from "prop-types";
-import { createPropsContext as Ze, validatePackage as et, usePropsContext as tt, useId as nt, getTabIndex as ot, useRtl as at, useAdaptiveModeContext as rt, canUseDOM as it, Keys as c, noop as j, mapTree as lt, extendDataItem as st, classNames as ae, IconWrap as Fe, WatermarkOverlay as ct, kendoThemeMaps as ut } from "@progress/kendo-react-common";
-import { Popup as dt } from "@progress/kendo-react-popup";
-import { useLocalization as pt } from "@progress/kendo-react-intl";
-import { TreeView as De } from "@progress/kendo-react-treeview";
-import { packageMetadata as mt } from "../package-metadata.mjs";
-import { getItemValue as ft, areSame as Ie, isPresent as vt } from "../common/utils.mjs";
-import { useDropdownWidth as gt } from "./useDropdownWidth.mjs";
-import { ListNoData as bt } from "./ListNoData.mjs";
-import { clear as Se, messages as re, nodata as G } from "../messages/index.mjs";
-import { FloatingLabel as ht } from "@progress/kendo-react-labels";
-import Me from "../common/ListFilter.mjs";
-import { Button as yt } from "@progress/kendo-react-buttons";
-import { xIcon as Et, caretAltDownIcon as Ct } from "@progress/kendo-svg-icons";
-import { AdaptiveMode as kt } from "../common/AdaptiveMode.mjs";
-import { ActionSheetContent as xt } from "@progress/kendo-react-layout";
-const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the list!", It = (E) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, E.children), Re = (E) => E.split("_").map((D) => parseInt(D, 10)), St = (E, D) => {
-  const { validationMessage: U, valid: r, required: a } = E;
+import { createPropsContext as nt, validatePackage as ot, usePropsContext as at, useId as rt, getTabIndex as it, ZIndexContext as Fe, useRtl as lt, useAdaptiveModeContext as st, canUseDOM as ct, Keys as c, noop as $, mapTree as ut, extendDataItem as dt, classNames as ae, IconWrap as Ie, WatermarkOverlay as pt, kendoThemeMaps as mt } from "@progress/kendo-react-common";
+import { Popup as ft } from "@progress/kendo-react-popup";
+import { useLocalization as vt } from "@progress/kendo-react-intl";
+import { TreeView as Se } from "@progress/kendo-react-treeview";
+import { packageMetadata as gt } from "../package-metadata.mjs";
+import { getItemValue as bt, areSame as Re, isPresent as ht } from "../common/utils.mjs";
+import { useDropdownWidth as Et } from "./useDropdownWidth.mjs";
+import { ListNoData as yt } from "./ListNoData.mjs";
+import { clear as Te, messages as re, nodata as U } from "../messages/index.mjs";
+import { FloatingLabel as Ct } from "@progress/kendo-react-labels";
+import Ne from "../common/ListFilter.mjs";
+import { Button as kt } from "@progress/kendo-react-buttons";
+import { xIcon as xt, caretAltDownIcon as wt } from "@progress/kendo-svg-icons";
+import { AdaptiveMode as Dt } from "../common/AdaptiveMode.mjs";
+import { ActionSheetContent as Ft } from "@progress/kendo-react-layout";
+const { sizeMap: It, roundedMap: St } = mt, Rt = 12e3, Tt = 2e3, Nt = "Please select a value from the list!", Pt = (y) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, y.children), Pe = (y) => y.split("_").map((F) => parseInt(F, 10)), Mt = (y, F) => {
+  const { validationMessage: X, valid: r, required: a } = y;
   return {
-    customError: U !== void 0,
-    valid: !!(r !== void 0 ? r : !a || D),
-    valueMissing: !D
+    customError: X !== void 0,
+    valid: !!(r !== void 0 ? r : !a || F),
+    valueMissing: !F
   };
 }, ie = {
   selectField: "selected",
@@ -44,64 +44,64 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
   size: "medium",
   rounded: "medium",
   fillMode: "solid"
-}, Mt = Ze(), Te = t.forwardRef((E, D) => {
-  const U = !et(mt, { component: "DropDownTree" }), r = tt(Mt, E), a = {
+}, Ot = nt(), Me = t.forwardRef((y, F) => {
+  const X = !ot(gt, { component: "DropDownTree" }), r = at(Ot, y), a = {
     ...ie,
     ...r
-  }, Ne = nt(), le = a.id || Ne, {
-    data: T,
-    dataItemKey: N,
+  }, Oe = rt(), le = a.id || Oe, {
+    data: N,
+    dataItemKey: P,
     popupSettings: b = {},
-    style: P,
+    style: M,
     opened: u,
     disabled: I,
-    onOpen: V = j,
-    onClose: m = j,
-    placeholder: J,
-    label: O,
-    name: Pe,
+    onOpen: O = $,
+    onClose: m = $,
+    placeholder: j,
+    label: V,
+    name: Ve,
     selectField: z,
-    subItemsField: K,
+    subItemsField: W,
     validationMessage: H,
-    valid: Ve,
-    required: Q,
-    validityStyles: Oe
-  } = a, X = ot(a.tabIndex, I), i = t.useRef(null), f = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), $ = t.useRef(null), h = t.useRef(null), _ = t.useRef(!1), [se, Ke] = t.useState(void 0), C = a.value !== void 0, v = C ? a.value : se !== void 0 ? se : a.defaultValue, L = vt(v), Z = L ? ft(v, a.textField) : "", ee = St({ validationMessage: H, valid: Ve, required: Q }, L), Le = t.useCallback(() => f.current && f.current.focus(), []);
+    valid: We,
+    required: G,
+    validityStyles: Le
+  } = a, J = it(a.tabIndex, I), i = t.useRef(null), f = t.useRef(null), S = t.useRef(null), Q = t.useRef(null), _ = t.useRef(null), h = t.useRef(null), Z = t.useRef(!1), [se, Ke] = t.useState(void 0), C = a.value !== void 0, v = C ? a.value : se !== void 0 ? se : a.defaultValue, L = ht(v), Y = L ? bt(v, a.textField) : "", ee = Mt({ validationMessage: H, valid: We, required: G }, L), ce = t.useContext(Fe), Be = ce ? ce + Tt : Rt, qe = t.useCallback(() => f.current && f.current.focus(), []);
   t.useImperativeHandle(i, () => ({
     props: a,
     element: f.current,
-    focus: Le
-  })), t.useImperativeHandle(D, () => i.current);
-  const k = at(f, a.dir), We = {
-    width: gt(
+    focus: qe
+  })), t.useImperativeHandle(F, () => i.current);
+  const k = lt(f, a.dir), Ae = {
+    width: Et(
       f,
       ie,
       { ...ie.popupSettings, ...b },
-      P
+      M
     ),
     ...k !== void 0 ? { direction: k } : {}
-  }, [Be, ce] = t.useState(!1), l = u !== void 0 ? u : Be, [d, te] = t.useState(!1), [ne, qe] = t.useState(), [ue, Ae] = t.useState(""), de = rt(), x = !!(ne && de && ne <= de.medium && a.adaptive), ze = t.useCallback(() => {
-    $.current && $.current.setCustomValidity && $.current.setCustomValidity(
-      ee.valid ? "" : H === void 0 ? Dt : H
+  }, [ze, ue] = t.useState(!1), l = u !== void 0 ? u : ze, [d, te] = t.useState(!1), [ne, He] = t.useState(), [de, _e] = t.useState(""), pe = st(), x = !!(ne && pe && ne <= pe.medium && a.adaptive), Ze = t.useCallback(() => {
+    _.current && _.current.setCustomValidity && _.current.setCustomValidity(
+      ee.valid ? "" : H === void 0 ? Nt : H
     );
   }, [H, ee]);
-  t.useEffect(ze), t.useEffect(() => {
-    const e = it && window.ResizeObserver && new window.ResizeObserver(Xe.bind(void 0));
+  t.useEffect(Ze), t.useEffect(() => {
+    const e = ct && window.ResizeObserver && new window.ResizeObserver(et.bind(void 0));
     return document != null && document.body && e && e.observe(document.body), () => {
       document != null && document.body && e && e.disconnect();
     };
   }, []);
-  const pe = t.useCallback(
+  const me = t.useCallback(
     (e) => {
       if (!l) {
-        if (V) {
+        if (O) {
           const o = { ...e };
-          V.call(void 0, o);
+          O.call(void 0, o);
         }
-        u === void 0 && ce(!0);
+        u === void 0 && ue(!0);
       }
     },
-    [l, u, V]
+    [l, u, O]
   ), w = t.useCallback(
     (e) => {
       if (l) {
@@ -109,14 +109,14 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
           const o = { ...e };
           m.call(void 0, o);
         }
-        u === void 0 && (ce(!1), x && setTimeout(() => {
+        u === void 0 && (ue(!1), x && setTimeout(() => {
           var o;
-          g((o = Y.current) == null ? void 0 : o.element);
+          g((o = Q.current) == null ? void 0 : o.element);
         }, 300));
       }
     },
     [l, u, m, x]
-  ), He = t.useCallback(
+  ), $e = t.useCallback(
     (e) => {
       if (!e.isDefaultPrevented() && i.current) {
         te(!0);
@@ -125,48 +125,48 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
           nativeEvent: e.nativeEvent,
           target: i.current
         };
-        (l ? w : pe)(o);
+        (l ? w : me)(o);
       }
     },
-    [l, u, V, m]
-  ), M = t.useCallback((e) => {
-    _.current = !0, e(), window.setTimeout(() => _.current = !1, 0);
-  }, []), $e = t.useCallback(
+    [l, u, O, m]
+  ), R = t.useCallback((e) => {
+    Z.current = !0, e(), window.setTimeout(() => Z.current = !1, 0);
+  }, []), Ue = t.useCallback(
     (e) => {
-      var F, xe;
+      var D, we;
       const { keyCode: o, altKey: s } = e, p = h.current && h.current.element;
-      if (!i.current || e.isDefaultPrevented() && ((F = S.current) == null ? void 0 : F.element) === e.target)
+      if (!i.current || e.isDefaultPrevented() && ((D = S.current) == null ? void 0 : D.element) === e.target)
         return;
-      const R = {
+      const T = {
         syntheticEvent: e,
         nativeEvent: e.nativeEvent,
         target: i.current
       };
       if (l)
         if (o === c.esc || s && o === c.up)
-          e.preventDefault(), w(R);
+          e.preventDefault(), w(T);
         else if (p && p.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 && ((xe = S.current) != null && xe.element)) {
-            const q = Array.from(p.querySelectorAll(".k-treeview-item")), we = [...q].reverse().find((A) => !!(A && A.querySelector(".k-focus")));
-            if (we && q.indexOf(we) === 0)
-              return M(() => {
+          if (o === c.up && ((we = S.current) != null && we.element)) {
+            const q = Array.from(p.querySelectorAll(".k-treeview-item")), De = [...q].reverse().find((A) => !!(A && A.querySelector(".k-focus")));
+            if (De && q.indexOf(De) === 0)
+              return R(() => {
                 var A;
                 g((A = S.current) == null ? void 0 : A.element);
               });
           }
-          M(j);
+          R($);
         } else
-          o === c.down && M(() => {
+          o === c.down && R(() => {
             var q;
             g(((q = S.current) == null ? void 0 : q.element) || p);
           });
       else
-        s && o === c.down ? (e.preventDefault(), pe(R)) : l || o === c.esc && ge(e);
+        s && o === c.down ? (e.preventDefault(), me(T)) : l || o === c.esc && be(e);
     },
-    [l, u, V, m]
-  ), me = t.useCallback((e) => {
+    [l, u, O, m]
+  ), fe = t.useCallback((e) => {
     const { keyCode: o, altKey: s } = e;
-    s || o !== c.up && o !== c.down || (e.preventDefault(), M(
+    s || o !== c.up && o !== c.down || (e.preventDefault(), R(
       o === c.up ? () => {
         g(f.current);
       } : () => {
@@ -174,15 +174,15 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
       }
     ));
   }, []), g = t.useCallback((e) => {
-    e && M(() => e.focus());
-  }, []), _e = t.useCallback(() => {
+    e && R(() => e.focus());
+  }, []), Xe = t.useCallback(() => {
     var e;
     !d && l && !u ? w({ target: i.current }) : r.filterable ? g((e = S.current) == null ? void 0 : e.element) : g(h.current && h.current.element);
   }, [m, r.filterable, d, u, l]), je = t.useCallback(() => {
     d && g(f.current);
   }, [d]), Ge = t.useCallback(
     (e) => {
-      if (!d && !_.current && (te(!0), r.onFocus && i.current)) {
+      if (!d && !Z.current && (te(!0), r.onFocus && i.current)) {
         const o = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
@@ -192,9 +192,9 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
       }
     },
     [d, r.onFocus]
-  ), Ue = t.useCallback(
+  ), Je = t.useCallback(
     (e) => {
-      if (d && !_.current && i.current) {
+      if (d && !Z.current && i.current) {
         te(!1);
         const o = {
           syntheticEvent: e,
@@ -209,17 +209,17 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
       }
     },
     [d, r.onBlur, l, u, m]
-  ), Je = t.useCallback(() => {
-    d && M(j), x && setTimeout(() => {
+  ), Qe = t.useCallback(() => {
+    d && R($), x && setTimeout(() => {
       var e;
-      g((e = Y.current) == null ? void 0 : e.element);
+      g((e = Q.current) == null ? void 0 : e.element);
     }, 300);
-  }, [d, x]), fe = t.useCallback(
+  }, [d, x]), ve = t.useCallback(
     (e, o, s) => {
       if (r.onChange) {
         const p = {
           value: o,
-          level: s ? Re(s) : [],
+          level: s ? Pe(s) : [],
           ...e
         };
         r.onChange.call(void 0, p);
@@ -227,19 +227,19 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
       C || Ke(o);
     },
     [r.onChange, C]
-  ), ve = t.useCallback(
+  ), ge = t.useCallback(
     (e) => {
-      if (Ie(e.item, v, N) || !i.current)
+      if (Re(e.item, v, P) || !i.current)
         return;
-      const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, F = {
-        syntheticEvent: R,
+      const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: T } = e, D = {
+        syntheticEvent: T,
         nativeEvent: p,
         target: i.current
       };
-      fe(F, o, s), w(F);
+      ve(D, o, s), w(D);
     },
-    [C, v, r.onChange, N, l, u, m]
-  ), ge = t.useCallback(
+    [C, v, r.onChange, P, l, u, m]
+  ), be = t.useCallback(
     (e) => {
       if (!i.current)
         return;
@@ -248,24 +248,24 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
         nativeEvent: e.nativeEvent,
         target: i.current
       };
-      fe(o, null), w(o), e.preventDefault();
+      ve(o, null), w(o), e.preventDefault();
     },
     [C, r.onChange, l, u, m]
-  ), be = t.useCallback(
+  ), he = t.useCallback(
     (e) => {
       if (e.syntheticEvent.stopPropagation(), r.onExpandChange && i.current) {
-        const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, F = {
-          level: Re(s),
+        const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: T } = e, D = {
+          level: Pe(s),
           item: o,
           nativeEvent: p,
-          syntheticEvent: R,
+          syntheticEvent: T,
           target: i.current
         };
-        r.onExpandChange.call(void 0, F);
+        r.onExpandChange.call(void 0, D);
       }
     },
     [r.onExpandChange]
-  ), he = t.useCallback(
+  ), Ee = t.useCallback(
     (e) => {
       if (r.onFilterChange && i.current) {
         const s = {
@@ -278,20 +278,20 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
           nativeEvent: e.nativeEvent,
           target: i.current
         };
-        r.onFilterChange.call(void 0, s), r.filter === void 0 && Ae(e.target.value);
+        r.onFilterChange.call(void 0, s), r.filter === void 0 && _e(e.target.value);
       }
     },
     [r.onFilterChange, r.filter, r.textField]
-  ), Qe = () => {
+  ), Ye = () => {
     const e = a.filterable ? /* @__PURE__ */ t.createElement(
-      Me,
+      Ne,
       {
-        value: a.filter === void 0 ? ue : a.filter,
-        ref: Y,
-        onChange: he,
-        onKeyDown: me,
-        size: y,
-        rounded: W,
+        value: a.filter === void 0 ? de : a.filter,
+        ref: Q,
+        onChange: Ee,
+        onKeyDown: fe,
+        size: E,
+        rounded: K,
         fillMode: B
       }
     ) : null, o = {
@@ -301,172 +301,172 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
       windowWidth: ne,
       mobileFilter: e
     };
-    return /* @__PURE__ */ t.createElement(kt, { ...o }, /* @__PURE__ */ t.createElement(xt, { overflowHidden: !0 }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, T.length > 0 ? /* @__PURE__ */ t.createElement(
-      De,
+    return /* @__PURE__ */ t.createElement(Dt, { ...o }, /* @__PURE__ */ t.createElement(Ft, { overflowHidden: !0 }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, N.length > 0 ? /* @__PURE__ */ t.createElement(
+      Se,
       {
         ref: h,
-        tabIndex: X,
+        tabIndex: J,
         data: ye,
-        focusIdField: N,
+        focusIdField: P,
         textField: a.textField,
         selectField: z,
         expandField: a.expandField,
-        childrenField: K,
+        childrenField: W,
         expandIcons: !0,
-        onItemClick: ve,
-        onExpandChange: be,
-        size: y,
+        onItemClick: ge,
+        onExpandChange: he,
+        size: E,
         item: a.item,
         dir: k,
         animate: b.animate
       }
-    ) : /* @__PURE__ */ t.createElement(Ee, null, oe.toLanguageString(G, re[G]))))));
-  }, Xe = t.useCallback((e) => {
+    ) : /* @__PURE__ */ t.createElement(Ce, null, oe.toLanguageString(U, re[U]))))));
+  }, et = t.useCallback((e) => {
     for (const o of e)
-      qe(o.target.clientWidth);
-  }, []), ye = t.useMemo(() => C || !L ? T : lt(
-    T,
-    K,
-    (e) => st(e, K, { [z]: Ie(e, v, N) })
-  ), [T, v, C, L, z, K]), Ee = a.listNoData || bt, Ye = a.valueHolder || It, oe = pt(), Ce = !Oe || ee.valid, { size: y, rounded: W, fillMode: B } = a, ke = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
+      He(o.target.clientWidth);
+  }, []), ye = t.useMemo(() => C || !L ? N : ut(
+    N,
+    W,
+    (e) => dt(e, W, { [z]: Re(e, v, P) })
+  ), [N, v, C, L, z, W]), Ce = a.listNoData || yt, tt = a.valueHolder || Pt, oe = vt(), ke = !Le || ee.valid, { size: E, rounded: K, fillMode: B } = a, xe = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
     "span",
     {
       className: ae("k-dropdowntree k-picker", a.className, {
-        [`k-picker-${wt[y] || y}`]: y,
-        [`k-rounded-${Ft[W] || W}`]: W,
+        [`k-picker-${It[E] || E}`]: E,
+        [`k-rounded-${St[K] || K}`]: K,
         [`k-picker-${B}`]: B,
         "k-focus": d,
-        "k-invalid": !Ce,
+        "k-invalid": !ke,
         "k-loading": a.loading,
-        "k-required": Q,
+        "k-required": G,
         "k-disabled": a.disabled
       }),
-      tabIndex: X,
+      tabIndex: J,
       accessKey: a.accessKey,
       id: le,
-      style: O ? { ...P, width: void 0 } : P,
+      style: V ? { ...M, width: void 0 } : M,
       dir: k,
       ref: f,
-      onKeyDown: I ? void 0 : $e,
-      onMouseDown: Je,
-      onClick: I ? void 0 : He,
+      onKeyDown: I ? void 0 : Ue,
+      onMouseDown: Qe,
+      onClick: I ? void 0 : $e,
       onFocus: Ge,
-      onBlur: Ue,
+      onBlur: Je,
       role: "combobox",
       "aria-haspopup": "tree",
       "aria-expanded": l,
       "aria-disabled": I,
-      "aria-label": O,
+      "aria-label": V,
       "aria-labelledby": a.ariaLabelledBy,
       "aria-describedby": a.ariaDescribedBy,
-      "aria-required": Q
+      "aria-required": G
     },
-    /* @__PURE__ */ t.createElement("span", { className: "k-input-inner" }, (Z || J) && /* @__PURE__ */ t.createElement(Ye, { item: v }, Z || J)),
-    a.loading && /* @__PURE__ */ t.createElement(Fe, { className: "k-input-loading-icon", name: "loading" }),
+    /* @__PURE__ */ t.createElement("span", { className: "k-input-inner" }, (Y || j) && /* @__PURE__ */ t.createElement(tt, { item: v }, Y || j)),
+    a.loading && /* @__PURE__ */ t.createElement(Ie, { className: "k-input-loading-icon", name: "loading" }),
     L && !I && /* @__PURE__ */ t.createElement(
       "span",
       {
-        onClick: ge,
+        onClick: be,
         className: "k-clear-value",
-        title: oe.toLanguageString(Se, re[Se]),
+        title: oe.toLanguageString(Te, re[Te]),
         role: "button",
         tabIndex: -1,
         onMouseDown: (e) => e.preventDefault()
       },
-      /* @__PURE__ */ t.createElement(Fe, { name: "x", icon: Et })
+      /* @__PURE__ */ t.createElement(Ie, { name: "x", icon: xt })
     ),
     /* @__PURE__ */ t.createElement(
-      yt,
+      kt,
       {
         tabIndex: -1,
         type: "button",
         "aria-label": "select",
         className: "k-input-button",
-        size: y,
+        size: E,
         fillMode: B,
         themeColor: "base",
         rounded: null,
         icon: "caret-alt-down",
-        svgIcon: Ct
+        svgIcon: wt
       }
     ),
     /* @__PURE__ */ t.createElement(
       "select",
       {
-        name: Pe,
-        ref: $,
+        name: Ve,
+        ref: _,
         tabIndex: -1,
         "aria-hidden": !0,
-        title: O,
+        title: V,
         style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
       },
       /* @__PURE__ */ t.createElement("option", { value: a.valueMap ? a.valueMap.call(void 0, v) : v })
     ),
-    !x && /* @__PURE__ */ t.createElement(
-      dt,
+    !x && /* @__PURE__ */ t.createElement(Fe.Provider, { value: Be }, /* @__PURE__ */ t.createElement(
+      ft,
       {
         ...b,
         className: ae(b.className, { "k-rtl": k === "rtl" }),
         popupClass: ae(b.popupClass, "k-dropdowntree-popup k-list-container"),
-        style: We,
+        style: Ae,
         anchor: b.anchor || f.current,
         show: l,
-        onOpen: _e,
+        onOpen: Xe,
         onClose: je
       },
       a.filterable && /* @__PURE__ */ t.createElement(
-        Me,
+        Ne,
         {
-          value: a.filter === void 0 ? ue : a.filter,
+          value: a.filter === void 0 ? de : a.filter,
           ref: S,
-          onChange: he,
-          onKeyDown: me,
-          size: y,
-          rounded: W,
+          onChange: Ee,
+          onKeyDown: fe,
+          size: E,
+          rounded: K,
           fillMode: B,
           renderListFilterWrapper: !0,
           renderPrefixSeparator: !0
         }
       ),
-      T.length > 0 ? /* @__PURE__ */ t.createElement(
-        De,
+      N.length > 0 ? /* @__PURE__ */ t.createElement(
+        Se,
         {
           style: { height: b.height },
           ref: h,
-          tabIndex: X,
+          tabIndex: J,
           data: ye,
-          focusIdField: N,
+          focusIdField: P,
           textField: a.textField,
           selectField: z,
           expandField: a.expandField,
-          childrenField: K,
+          childrenField: W,
           expandIcons: !0,
-          onItemClick: ve,
-          onExpandChange: be,
-          size: y,
+          onItemClick: ge,
+          onExpandChange: he,
+          size: E,
           item: a.item,
           dir: k,
           animate: b.animate
         }
-      ) : /* @__PURE__ */ t.createElement(Ee, null, oe.toLanguageString(G, re[G])),
-      U && /* @__PURE__ */ t.createElement(ct, null)
-    )
-  ), x && Qe());
-  return O ? /* @__PURE__ */ t.createElement(
-    ht,
+      ) : /* @__PURE__ */ t.createElement(Ce, null, oe.toLanguageString(U, re[U])),
+      X && /* @__PURE__ */ t.createElement(pt, null)
+    ))
+  ), x && Ye());
+  return V ? /* @__PURE__ */ t.createElement(
+    Ct,
     {
-      label: O,
-      editorValue: Z,
-      editorPlaceholder: J,
-      editorValid: Ce,
+      label: V,
+      editorValue: Y,
+      editorPlaceholder: j,
+      editorValid: ke,
       editorDisabled: I,
       editorId: le,
-      style: { width: P ? P.width : void 0 },
-      children: ke,
+      style: { width: M ? M.width : void 0 },
+      children: xe,
       dir: k
     }
-  ) : ke;
-}), Rt = {
+  ) : xe;
+}), Vt = {
   opened: n.bool,
   disabled: n.bool,
   dir: n.string,
@@ -522,9 +522,9 @@ const { sizeMap: wt, roundedMap: Ft } = ut, Dt = "Please select a value from the
   adaptiveTitle: n.string,
   adaptive: n.bool
 };
-Te.displayName = "KendoReactDropDownTree";
-Te.propTypes = Rt;
+Me.displayName = "KendoReactDropDownTree";
+Me.propTypes = Vt;
 export {
-  Te as DropDownTree,
-  Mt as DropDownTreePropsContext
+  Me as DropDownTree,
+  Ot as DropDownTreePropsContext
 };

package/common/ListContainer.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";const i=require("react"),s=require("@progress/kendo-react-popup");function u(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=u(i),p=e=>{const{children:n,width:t,dir:r,itemsCount:o,popupSettings:c}=e;return a.createElement(s.Popup,{style:{width:t,direction:r},contentKey:o&&o.join(),...c},n)};module.exports=p;
+"use strict";const d=require("react"),l=require("@progress/kendo-react-popup"),s=require("@progress/kendo-react-common");function p(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const r=p(d),f=12e3,m=2e3,x=e=>{const{children:n,width:t,dir:o,itemsCount:c,popupSettings:u}=e,i=r.useContext(s.ZIndexContext),a=i?i+m:f;return r.createElement(s.ZIndexContext.Provider,{value:a},r.createElement(l.Popup,{style:{width:t,direction:o},contentKey:c&&c.join(),...u},n))};module.exports=x;