@progress/kendo-react-dropdowns 7.5.0-develop.2 → 7.5.0-develop.20

package/MultiSelectTree/MultiSelectTree.mjs

@@ -8,7 +8,7 @@
 "use client";
 import * as t from "react";
 import a from "prop-types";
-import { createPropsContext as at, usePropsContext as it, validatePackage as ot, useId as rt, getTabIndex as lt, useRtl as st, canUseDOM as ct, noop as Z, Keys as r, classNames as ee, IconWrap as ut, kendoThemeMaps as dt } from "@progress/kendo-react-common";
+import { createPropsContext as at, usePropsContext as it, validatePackage as rt, useId as ot, getTabIndex as lt, useRtl as st, canUseDOM as ct, noop as Z, Keys as o, classNames as ee, IconWrap as ut, kendoThemeMaps as dt } from "@progress/kendo-react-common";
 import { Popup as pt } from "@progress/kendo-react-popup";
 import { useLocalization as ft } from "@progress/kendo-react-intl";
 import { TreeView as Te } from "@progress/kendo-react-treeview";
@@ -24,14 +24,14 @@ import Ne from "../common/ListFilter.mjs";
 import { AdaptiveMode as kt } from "../common/AdaptiveMode.mjs";
 import { ActionSheetContent as Ft } from "@progress/kendo-react-layout";
 import { MOBILE_MEDIUM_DEVISE as xt } from "../common/constants.mjs";
-const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt } = dt, St = (O) => O.split("_").map((R) => parseInt(R, 10)), Tt = (O, R) => {
-  const { validationMessage: n, valid: K, required: F } = O;
+const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: St } = dt, wt = (O) => O.split("_").map((R) => parseInt(R, 10)), Tt = (O, R) => {
+  const { validationMessage: n, valid: K, required: x } = O;
   return {
     customError: n !== void 0,
-    valid: !!(K !== void 0 ? K : !F || R),
+    valid: !!(K !== void 0 ? K : !x || R),
     valueMissing: !R
   };
-}, D = {
+}, F = {
   checkField: "checkField",
   checkIndeterminateField: "checkIndeterminateField",
   subItemsField: "items",
@@ -47,31 +47,31 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   validityStyles: !0
 }, Dt = at(), de = t.forwardRef((O, R) => {
   const n = it(Dt, O);
-  ot(mt);
-  const K = rt(), F = n.id || K, {
+  rt(mt);
+  const K = ot(), x = n.id || K, {
     data: q = [],
-    dataItemKey: x,
+    dataItemKey: I,
     popupSettings: M = {},
-    style: B = {},
-    opened: I,
+    style: L = {},
+    opened: S,
     disabled: C,
     onOpen: ae = Z,
     onClose: A = Z,
     placeholder: pe,
-    label: L,
+    label: B,
     name: Oe,
-    checkField: fe = D.checkField,
-    checkIndeterminateField: me = D.checkIndeterminateField,
-    subItemsField: ge = D.subItemsField,
+    checkField: fe = F.checkField,
+    checkIndeterminateField: me = F.checkIndeterminateField,
+    subItemsField: ge = F.subItemsField,
     validationMessage: W,
-    valid: Be,
+    valid: Le,
     tags: ve,
     value: m,
-    required: he = D.required,
-    validityStyles: Le = D.validityStyles
-  } = n, z = lt(n.tabIndex, C), l = t.useRef(null), y = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), _ = t.useRef(null), E = t.useRef(null), $ = t.useRef(!1), H = t.useRef([]), G = t.useRef(null), [N, Ve] = t.useState(), [Ke, be] = t.useState(!1), [d, oe] = t.useState(!1), [re, qe] = t.useState(), [Ae, We] = t.useState([]), [ye, ze] = t.useState(""), P = !!(re && re <= xt && n.adaptive), s = I !== void 0 ? I : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: W, valid: Be, required: he }, le), S = st(y, n.dir), _e = {
-    width: ht(y, D, M, B),
-    ...S !== void 0 ? { direction: S } : {}
+    required: he = F.required,
+    validityStyles: Be = F.validityStyles
+  } = n, z = lt(n.tabIndex, C), l = t.useRef(null), y = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), _ = t.useRef(null), E = t.useRef(null), $ = t.useRef(!1), H = t.useRef([]), G = t.useRef(null), [N, Ve] = t.useState(), [Ke, be] = t.useState(!1), [d, re] = t.useState(!1), [oe, qe] = t.useState(), [Ae, We] = t.useState([]), [ye, ze] = t.useState(""), P = !!(oe && oe <= xt && n.adaptive), s = S !== void 0 ? S : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: W, valid: Le, required: he }, le), T = st(y, n.dir), _e = {
+    width: ht(y, F, { ...F.popupSettings, ...M }, L),
+    ...T !== void 0 ? { direction: T } : {}
   }, $e = t.useCallback(() => y.current && y.current.focus(), []);
   H.current = ve === void 0 ? (m || []).map((e) => ({ text: gt(e, n.textField), data: [e] })) : [...ve], t.useImperativeHandle(
     l,
@@ -101,11 +101,11 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     [m, s]
   );
   const k = t.useCallback(
-    (e, i, o) => {
+    (e, i, r) => {
       if (n.onChange) {
         const b = {
           items: i,
-          operation: o,
+          operation: r,
           ...e
         };
         n.onChange.call(void 0, b);
@@ -114,16 +114,16 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     [n.onChange]
   ), U = t.useCallback(
     (e) => {
-      if (vt(e.item, m, x) || !l.current)
+      if (vt(e.item, m, I) || !l.current)
         return;
-      const { item: i, nativeEvent: o, syntheticEvent: b } = e, T = {
+      const { item: i, nativeEvent: r, syntheticEvent: b } = e, D = {
         syntheticEvent: b,
-        nativeEvent: o,
+        nativeEvent: r,
         target: l.current
       };
-      k(T, [i], "toggle");
+      k(D, [i], "toggle");
     },
-    [m, x, k]
+    [m, I, k]
   ), j = t.useCallback(
     (e) => {
       if (!s) {
@@ -131,13 +131,13 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           const i = { ...e };
           ae.call(void 0, i);
         }
-        I === void 0 && (be(!0), We(m || []), P && setTimeout(() => {
+        S === void 0 && (be(!0), We(m || []), P && setTimeout(() => {
           var i;
           u((i = ie.current) == null ? void 0 : i.element);
         }, 300));
       }
     },
-    [s, I, ae, P, ie]
+    [s, S, ae, P, ie]
   ), g = t.useCallback(
     (e) => {
       if (s) {
@@ -145,10 +145,10 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           const i = { ...e };
           A.call(void 0, i);
         }
-        I === void 0 && be(!1);
+        S === void 0 && be(!1);
       }
     },
-    [s, I, A]
+    [s, S, A]
   ), h = t.useCallback(
     (e) => {
       $.current = !0, e(), window.setTimeout(() => $.current = !1, 0);
@@ -172,7 +172,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     [d, u]
   ), je = t.useCallback(
     (e) => {
-      if (!d && !$.current && (oe(!0), n.onFocus && l.current)) {
+      if (!d && !$.current && (re(!0), n.onFocus && l.current)) {
         const i = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
@@ -185,20 +185,20 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   ), Je = t.useCallback(
     (e) => {
       if (d && !$.current && l.current) {
-        oe(!1);
+        re(!1);
         const i = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
           target: l.current
         };
         if (n.onBlur) {
-          const o = { ...i };
-          n.onBlur.call(void 0, o);
+          const r = { ...i };
+          n.onBlur.call(void 0, r);
         }
         P || g(i);
       }
     },
-    [d, n.onBlur, s, I, A]
+    [d, n.onBlur, s, S, A]
   ), Qe = t.useCallback(
     () => {
       d && h(Z);
@@ -207,7 +207,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   ), Xe = t.useCallback(
     (e) => {
       if (!e.isDefaultPrevented() && l.current) {
-        oe(!0);
+        re(!0);
         const i = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
@@ -219,26 +219,26 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     [s, j]
   ), Ye = t.useCallback(
     (e) => {
-      var Y, Se;
-      const { keyCode: i, altKey: o } = e, b = E.current && E.current.element;
+      var Y, we;
+      const { keyCode: i, altKey: r } = e, b = E.current && E.current.element;
       if (!l.current || e.isDefaultPrevented() && ((Y = w.current) == null ? void 0 : Y.element) === e.target)
         return;
-      const T = {
+      const D = {
         syntheticEvent: e,
         nativeEvent: e.nativeEvent,
         target: l.current
       };
-      if (m && m.length > 0 && (i === r.left || i === r.right || i === r.home || i === r.end || i === r.delete)) {
+      if (m && m.length > 0 && (i === o.left || i === o.right || i === o.home || i === o.end || i === o.delete)) {
         const c = H.current;
-        let p = N ? c.findIndex((nt) => De(nt, N, x)) : -1, f;
+        let p = N ? c.findIndex((nt) => De(nt, N, I)) : -1, f;
         const ue = p !== -1;
-        i === r.left ? (ue ? p = Math.max(0, p - 1) : p = c.length - 1, f = c[p]) : i === r.right ? p === c.length - 1 ? f = void 0 : ue && (p = Math.min(c.length - 1, p + 1), f = c[p]) : i === r.home ? f = c[0] : i === r.end ? f = c[c.length - 1] : i === r.delete && ue && k(T, c[p].data, "delete"), f !== N && Ve(f);
+        i === o.left ? (ue ? p = Math.max(0, p - 1) : p = c.length - 1, f = c[p]) : i === o.right ? p === c.length - 1 ? f = void 0 : ue && (p = Math.min(c.length - 1, p + 1), f = c[p]) : i === o.home ? f = c[0] : i === o.end ? f = c[c.length - 1] : i === o.delete && ue && k(D, c[p].data, "delete"), f !== N && Ve(f);
       }
       if (s)
-        if (i === r.esc || o && i === r.up)
-          e.preventDefault(), g(T);
-        else if (b && b.querySelector(".k-focus") && (i === r.up || i === r.down || i === r.left || i === r.right || i === r.home || i === r.end)) {
-          if (i === r.up && ((Se = w.current) != null && Se.element)) {
+        if (i === o.esc || r && i === o.up)
+          e.preventDefault(), g(D);
+        else if (b && b.querySelector(".k-focus") && (i === o.up || i === o.down || i === o.left || i === o.right || i === o.home || i === o.end)) {
+          if (i === o.up && ((we = w.current) != null && we.element)) {
             const c = Array.from(b.querySelectorAll(".k-treeview-item")), p = [...c].reverse().find((f) => !!(f && f.querySelector(".k-focus")));
             if (p && c.indexOf(p) === 0)
               return h(() => {
@@ -248,19 +248,19 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           }
           h(Z);
         } else
-          i === r.down && h(() => {
+          i === o.down && h(() => {
             var c;
             u(((c = w.current) == null ? void 0 : c.element) || b);
           });
       else
-        o && i === r.down && (e.preventDefault(), j(T));
+        r && i === o.down && (e.preventDefault(), j(D));
     },
-    [s, g, u, h, j, N, x, m, k]
+    [s, g, u, h, j, N, I, m, k]
   ), Ce = t.useCallback(
     (e) => {
-      const { keyCode: i, altKey: o } = e;
-      o || i !== r.up && i !== r.down || (e.preventDefault(), h(
-        i === r.up ? () => {
+      const { keyCode: i, altKey: r } = e;
+      r || i !== o.up && i !== o.down || (e.preventDefault(), h(
+        i === o.up ? () => {
           u(y.current);
         } : () => {
           u(E.current && E.current.element);
@@ -282,8 +282,8 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     [k, g]
   ), Ze = t.useCallback(
     (e, i) => {
-      var o;
-      g({ target: l.current }), d || u((o = w.current) == null ? void 0 : o.element), k({
+      var r;
+      g({ target: l.current }), d || u((r = w.current) == null ? void 0 : r.element), k({
         syntheticEvent: i,
         nativeEvent: i.nativeEvent,
         target: l.current
@@ -293,11 +293,11 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   ), Ee = t.useCallback(
     (e) => {
       if (n.onExpandChange && l.current) {
-        const { item: i, itemHierarchicalIndex: o, nativeEvent: b, syntheticEvent: T } = e, Y = {
-          level: St(o),
+        const { item: i, itemHierarchicalIndex: r, nativeEvent: b, syntheticEvent: D } = e, Y = {
+          level: wt(r),
           item: i,
           nativeEvent: b,
-          syntheticEvent: T,
+          syntheticEvent: D,
           target: l.current
         };
         n.onExpandChange.call(void 0, Y);
@@ -307,13 +307,13 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   ), ke = t.useCallback(
     (e) => {
       if (n.onFilterChange && l.current) {
-        const o = {
+        const r = {
           filter: { field: n.textField, operator: "contains", value: e.target.value },
           syntheticEvent: e.syntheticEvent,
           nativeEvent: e.nativeEvent,
           target: l.current
         };
-        n.onFilterChange.call(void 0, o), n.filter === void 0 && ze(e.target.value);
+        n.onFilterChange.call(void 0, r), n.filter === void 0 && ze(e.target.value);
       }
     },
     [n.onFilterChange, n.filter, n.textField]
@@ -344,14 +344,14 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
     ) : null, i = {
       adaptiveTitle: n.adaptiveTitle,
       expand: s,
-      onClose: (o) => n.onCancel ? Fe(o) : ce(o),
-      windowWidth: re,
+      onClose: (r) => n.onCancel ? Fe(r) : ce(r),
+      windowWidth: oe,
       mobileFilter: e,
       footer: {
         cancelText: J.toLanguageString(Re, ne[Re]),
-        onCancel: (o) => n.onCancel ? Fe(o) : ce(o),
+        onCancel: (r) => n.onCancel ? Fe(r) : ce(r),
         applyText: J.toLanguageString(Me, ne[Me]),
-        onApply: (o) => g(o)
+        onApply: (r) => g(r)
       }
     };
     return /* @__PURE__ */ t.createElement(kt, { ...i }, /* @__PURE__ */ t.createElement(Ft, { className: "!k-overflow-hidden" }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, q.length > 0 ? /* @__PURE__ */ t.createElement(
@@ -360,7 +360,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
         ref: E,
         tabIndex: z,
         data: q,
-        focusIdField: x,
+        focusIdField: I,
         textField: n.textField,
         checkField: fe,
         checkIndeterminateField: me,
@@ -373,7 +373,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
         checkboxes: !0,
         size: v,
         item: n.item,
-        dir: S
+        dir: T
       }
     ) : /* @__PURE__ */ t.createElement(xe, null, J.toLanguageString(te, ne[te]))))));
   }, tt = t.useCallback(
@@ -382,12 +382,12 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
         qe(i.target.clientWidth);
     },
     []
-  ), xe = n.listNoData || bt, J = ft(), Ie = !Le || se.valid, { size: v, rounded: V, fillMode: Q } = n, X = P && s ? Ae : H.current, we = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
+  ), xe = n.listNoData || bt, J = ft(), Ie = !Be || se.valid, { size: v, rounded: V, fillMode: Q } = n, X = P && s ? Ae : H.current, Se = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
     "span",
     {
       className: ee("k-multiselecttree k-input", n.className, {
         [`k-input-${Pe[v] || v}`]: v,
-        [`k-rounded-${wt[V] || V}`]: V,
+        [`k-rounded-${St[V] || V}`]: V,
         [`k-input-${Q}`]: Q,
         "k-focus": d && !C,
         "k-invalid": !Ie,
@@ -397,9 +397,9 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
       }),
       tabIndex: z,
       accessKey: n.accessKey,
-      id: F,
-      style: L ? { ...B, width: void 0 } : B,
-      dir: S,
+      id: x,
+      style: B ? { ...L, width: void 0 } : L,
+      dir: T,
       ref: y,
       onKeyDown: C ? void 0 : Ye,
       onMouseDown: Qe,
@@ -409,17 +409,17 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
       "aria-haspopup": "tree",
       "aria-expanded": s,
       "aria-disabled": C,
-      "aria-label": L,
+      "aria-label": B,
       "aria-labelledby": n.ariaLabelledBy,
-      "aria-describedby": n.ariaDescribedBy ? n.ariaDescribedBy : "tagslist-" + F,
+      "aria-describedby": n.ariaDescribedBy ? n.ariaDescribedBy : "tagslist-" + x,
       "aria-required": n.required,
       onClick: C ? void 0 : Xe
     },
     /* @__PURE__ */ t.createElement(
       "div",
       {
-        id: "tagslist-" + F,
-        className: ee("k-input-values k-chip-list k-selection-multiple", {
+        id: "tagslist-" + x,
+        className: ee("k-input-values k-chip-list", {
           [`k-chip-list-${Pe[v] || v}`]: v
         })
       },
@@ -429,8 +429,8 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           tag: n.tag,
           onTagDelete: Ze,
           data: X,
-          guid: F,
-          focused: N ? H.current.find((e) => De(e, N, x)) : void 0,
+          guid: x,
+          focused: N ? H.current.find((e) => De(e, N, I)) : void 0,
           size: v
         }
       )
@@ -445,7 +445,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
         ref: _,
         tabIndex: -1,
         "aria-hidden": !0,
-        title: L,
+        title: B,
         style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
       },
       /* @__PURE__ */ t.createElement(
@@ -463,7 +463,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           M.popupClass,
           "k-multiselecttree-popup"
         ),
-        className: ee(M.className, { "k-rtl": S === "rtl" }),
+        className: ee(M.className, { "k-rtl": T === "rtl" }),
         style: _e,
         anchor: M.anchor || y.current,
         show: s,
@@ -481,7 +481,9 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           tabIndex: z,
           size: v,
           rounded: V,
-          fillMode: Q
+          fillMode: Q,
+          renderListFilterWrapper: !0,
+          renderPrefixSeparator: !0
         }
       ),
       q.length > 0 ? /* @__PURE__ */ t.createElement(
@@ -491,7 +493,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           ref: E,
           tabIndex: z,
           data: q,
-          focusIdField: x,
+          focusIdField: I,
           textField: n.textField,
           checkField: fe,
           checkIndeterminateField: me,
@@ -504,25 +506,25 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
           checkboxes: !0,
           size: v,
           item: n.item,
-          dir: S
+          dir: T
         }
       ) : /* @__PURE__ */ t.createElement(xe, null, J.toLanguageString(te, ne[te]))
     )
   ), P && et());
-  return L ? /* @__PURE__ */ t.createElement(
+  return B ? /* @__PURE__ */ t.createElement(
     yt,
     {
-      label: L,
+      label: B,
       editorValue: le,
       editorPlaceholder: pe,
       editorValid: Ie,
       editorDisabled: C,
-      editorId: F,
-      style: { width: B ? B.width : void 0 },
-      children: we,
-      dir: S
+      editorId: x,
+      style: { width: L ? L.width : void 0 },
+      children: Se,
+      dir: T
     }
-  ) : we;
+  ) : Se;
 }), Rt = {
   opened: a.bool,
   disabled: a.bool,
@@ -582,7 +584,7 @@ const It = "Please select a value from the list!", { sizeMap: Pe, roundedMap: wt
   adaptive: a.bool
 };
 de.displayName = "KendoReactMultiSelectTree";
-de.defaultProps = D;
+de.defaultProps = F;
 de.propTypes = Rt;
 export {
   de as MultiSelectTree,

package/common/AdaptiveMode.js

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

package/common/AdaptiveMode.mjs

@@ -7,10 +7,11 @@
  */
 "use client";
 import * as e from "react";
-import { ActionSheet as f, ActionSheetHeader as k, ActionSheetFooter as E } from "@progress/kendo-react-layout";
+import { ActionSheet as k, ActionSheetHeader as f, ActionSheetFooter as E } from "@progress/kendo-react-layout";
 import { xIcon as v } from "@progress/kendo-svg-icons";
 import { Button as a } from "@progress/kendo-react-buttons";
-const o = 500, y = (c) => {
+import { classNames as x } from "@progress/kendo-react-common";
+const o = 500, C = (c) => {
   const {
     footer: t,
     children: s,
@@ -29,9 +30,13 @@ const o = 500, y = (c) => {
     animation: p !== !1,
     onClose: n,
     animationStyles: l <= o ? { top: 0, width: "100%", height: "100%" } : void 0,
-    className: l <= o ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom"
+    className: x(
+      "k-actionsheet",
+      "k-adaptive-actionsheet",
+      l <= o ? "k-actionsheet-fullscreen" : "k-actionsheet-bottom"
+    )
   };
-  return /* @__PURE__ */ e.createElement(f, { ...h }, /* @__PURE__ */ e.createElement(k, { className: "k-text-center" }, /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ e.createElement("div", null, b)), /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement(k, { ...h }, /* @__PURE__ */ e.createElement(f, { className: "k-text-center" }, /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ e.createElement("div", { className: "k-text-center" }, b), /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-subtitle k-text-center" })), /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ e.createElement(
     a,
     {
       tabIndex: 0,
@@ -69,5 +74,5 @@ const o = 500, y = (c) => {
   )));
 };
 export {
-  y as AdaptiveMode
+  C as AdaptiveMode
 };

package/common/DropDownBase.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const v=require("react"),i=require("prop-types"),y=require("./VirtualScroll.js"),S=require("./Navigation.js"),c=require("./utils.js");function b(l){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(n,t,e.get?e:{enumerable:!0,get:()=>l[t]})}}return n.default=l,Object.freeze(n)}const P=b(v),p=class p{constructor(n){this.wrapper=null,this.list=null,this.vs=new y,this.navigation=new S.Navigation,this.handleItemClick=(t,e)=>{const s=this.initState();s.syntheticEvent=e,e.stopPropagation(),this.component.handleItemSelect(t,s),this.togglePopup(s),this.applyState(s)},this.handleFocus=t=>{if(!this.component.state.focused){const e=this.initState();e.data.focused=!0,e.events.push({type:"onFocus"}),e.syntheticEvent=t,this.applyState(e)}},this.filterChanged=(t,e)=>{const{textField:s,filterable:o}=this.component.props;o&&e.events.push({type:"onFilterChange",filter:{field:s,operator:"contains",ignoreCase:!0,value:t}})},this.togglePopup=t=>{const e=this.component.props,s=e.opened!==void 0?e.opened:this.component.state.opened;e.opened===void 0&&(t.data.opened=!s),s?t.events.push({type:"onClose"}):(t.events.push({type:"onOpen"}),this.calculatePopupWidth())},this.pageChange=(t,e)=>{const s=this.initState();s.syntheticEvent=e,this.triggerOnPageChange(s,t.skip,t.take),this.applyState(s)},this.scrollToVirtualItem=(t,e)=>{const s=this.vs;if(s.enabled=!1,t.skip===0)s.reset();else if(t.skip+t.pageSize===t.total)s.scrollToEnd();else{let o=s.translate;o===0&&(s.calcScrollElementHeight(),o=s.itemHeight*t.skip,s.translateTo(o-s.itemHeight)),s.container&&(s.container.scrollTop=o),this.scrollToItem(e,!0)}window.setTimeout(()=>s.enabled=!0,10)},this.scrollPopupByPageSize=t=>{var r,u,d,g,f,m;const e=this.vs,s=(u=(r=this.list)==null?void 0:r.parentElement)==null?void 0:u.scrollTop,o=e.enabled&&e.itemHeight?e.itemHeight:this.list?this.list.children[0].offsetHeight:0,a=(g=(d=this.list)==null?void 0:d.parentElement)==null?void 0:g.offsetHeight;s!==void 0&&a!==void 0&&((m=(f=this.list)==null?void 0:f.parentElement)==null||m.scroll({top:s+t*Math.floor(a/o)*o}))},this.renderScrollElement=()=>{const t=this.vs;return t.enabled&&P.createElement("div",{ref:e=>t.scrollElement=e,key:"scrollElementKey"})},this.resetGroupStickyHeader=(t,e)=>{t!==e.state.group&&e.setState({...e.state,group:t})},this.listBoxId=n.props.id+"list",this.guid=n.props.id,this.component=n,this.vs.PageChange=this.pageChange}didMount(){const n=this.component.props,t=n.popupSettings||{},e=n.style||{},s=t.width;let o=n.opened===!0;s===void 0&&this.calculatePopupWidth(),n.dir===void 0&&e.direction===void 0&&(this.calculateDir(),o=!0),o&&this.component.forceUpdate()}calculateDir(){const n=this.component.element;n&&n.ownerDocument&&n.ownerDocument.defaultView&&(this.dirCalculated=n.ownerDocument.defaultView.getComputedStyle(n).direction||void 0)}calculatePopupWidth(){this.wrapper&&(this.popupWidth=this.wrapper.offsetWidth+"px")}scrollToItem(n,t,e){const s=this.list||this.vs.list;if(!s&&!e&&setTimeout(()=>{this.scrollToItem(n,t,!0)},10),s&&n>=0){const o=this.vs,a=o.container||s.parentNode,r=t!==void 0?t:o.enabled;c.scrollToItem(a,s,n,o.translate,r)}}initState(){return{data:{},events:[],syntheticEvent:void 0}}applyState(n){Object.keys(n.data).length>0&&this.component.setState(n.data);const t={syntheticEvent:n.syntheticEvent,nativeEvent:n.syntheticEvent?n.syntheticEvent.nativeEvent:void 0,target:this.component,value:this.component.value};n.events.forEach(e=>{const s=e.type;delete e.type;const o=s&&this.component.props[s];o&&o.call(void 0,{...t,...e})})}triggerOnPageChange(n,t,e){const s=this.component.props.virtual;if(s){const o=Math.min(Math.max(0,t),Math.max(0,s.total-e));o!==s.skip&&n.events.push({type:"onPageChange",page:{skip:o,take:e}})}}triggerPageChangeCornerItems(n,t){const e=this.component.props,{data:s=[],dataItemKey:o,virtual:a}=e,r=e.opened!==void 0?e.opened:this.component.state.opened;n&&a&&this.vs.enabled&&(a.skip>0&&c.areSame(n,s[0],o)?this.triggerOnPageChange(t,a.skip-1,a.pageSize):!r&&a.skip+a.pageSize<a.total&&c.areSame(n,s[s.length-1],o)&&this.triggerOnPageChange(t,a.skip+1,a.pageSize))}getPopupSettings(){return Object.assign({},p.defaultProps.popupSettings,this.component.props.popupSettings)}getGroupedDataModernMode(n,t){let e=[];return n.forEach((s,o)=>{n[o-1]&&s[t]!==n[o-1][t]&&e.push({[t]:s[t]}),e.push(n[o])}),e}};p.basicPropTypes={opened:i.bool,disabled:i.bool,dir:i.string,tabIndex:i.number,accessKey:i.string,data:i.array,textField:i.string,className:i.string,label:i.string,loading:i.bool,popupSettings:i.shape({animate:i.oneOfType([i.bool,i.shape({openDuration:i.number,closeDuration:i.number})]),popupClass:i.string,className:i.string,appendTo:i.any,width:i.oneOfType([i.string,i.number]),height:i.oneOfType([i.string,i.number])}),onOpen:i.func,onClose:i.func,onFocus:i.func,onBlur:i.func,onChange:i.func,itemRender:i.func,listNoDataRender:i.func,focusedItemIndex:i.func,header:i.node,footer:i.node},p.propTypes={...p.basicPropTypes,value:i.any,defaultValue:i.any,filterable:i.bool,filter:i.string,virtual:i.shape({pageSize:i.number.isRequired,skip:i.number.isRequired,total:i.number.isRequired}),onFilterChange:i.func,onPageChange:i.func},p.defaultProps={popupSettings:{height:"200px"},required:!1,validityStyles:!0};let h=p;module.exports=h;
+"use client";"use strict";const v=require("react"),n=require("prop-types"),y=require("./VirtualScrollStatic.js"),S=require("./Navigation.js"),c=require("./utils.js");function b(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const e in l)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(l,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>l[e]})}}return s.default=l,Object.freeze(s)}const P=b(v),a=class a{constructor(s){this.wrapper=null,this.list=null,this.vs=new y.VirtualScroll,this.navigation=new S.Navigation,this.handleItemClick=(e,t)=>{const i=this.initState();i.syntheticEvent=t,t.stopPropagation(),this.component.handleItemSelect(e,i),this.togglePopup(i),this.applyState(i)},this.handleFocus=e=>{if(!this.component.state.focused){const t=this.initState();t.data.focused=!0,t.events.push({type:"onFocus"}),t.syntheticEvent=e,this.applyState(t)}},this.filterChanged=(e,t)=>{const{textField:i,filterable:o}=this.component.props;o&&t.events.push({type:"onFilterChange",filter:{field:i,operator:"contains",ignoreCase:!0,value:e}})},this.togglePopup=e=>{const t=this.component.props,i=t.opened!==void 0?t.opened:this.component.state.opened;t.opened===void 0&&(e.data.opened=!i),i?e.events.push({type:"onClose"}):(e.events.push({type:"onOpen"}),this.calculatePopupWidth())},this.pageChange=(e,t)=>{const i=this.initState();i.syntheticEvent=t,this.triggerOnPageChange(i,e.skip,e.take),this.applyState(i)},this.scrollToVirtualItem=(e,t)=>{const i=this.vs;if(e.skip===0)i.reset();else{let o=i.translate;o===0&&(i.calcScrollElementHeight(),o=i.itemHeight*e.skip,i.translateTo(o,!0)),t<0&&o>0&&(o+=i.itemHeight*(e.pageSize/4)),i.container&&(i.container.scrollTop=o),this.scrollToItem(t,!0)}},this.scrollPopupByPageSize=e=>{var p,u,d,g,f,m;const t=this.vs,i=(u=(p=this.list)==null?void 0:p.parentElement)==null?void 0:u.scrollTop,o=t.enabled&&t.itemHeight?t.itemHeight:this.list?this.list.children[0].offsetHeight:0,r=(g=(d=this.list)==null?void 0:d.parentElement)==null?void 0:g.offsetHeight;i!==void 0&&r!==void 0&&((m=(f=this.list)==null?void 0:f.parentElement)==null||m.scroll({top:i+e*Math.floor(r/o)*o}))},this.renderScrollElement=()=>{const e=this.vs;return e.enabled&&P.createElement("div",{ref:t=>e.scrollElement=t,key:"scrollElementKey"})},this.resetGroupStickyHeader=(e,t)=>{e!==t.state.group&&t.setState({...t.state,group:e})},this.listBoxId=s.props.id+"list",this.guid=s.props.id,this.component=s,this.vs.PageChange=this.pageChange}didUpdate(){this.vs.listTransform&&this.vs.list&&(this.vs.list.style.transform=this.vs.listTransform,this.vs.listTransform="")}didMount(){const s=this.component.props,e=s.popupSettings||{},t=s.style||{},i=e.width;let o=s.opened===!0;i===void 0&&this.calculatePopupWidth(),s.dir===void 0&&t.direction===void 0&&(this.calculateDir(),o=!0),o&&this.component.forceUpdate()}calculateDir(){const s=this.component.element;s&&s.ownerDocument&&s.ownerDocument.defaultView&&(this.dirCalculated=s.ownerDocument.defaultView.getComputedStyle(s).direction||void 0)}calculatePopupWidth(){this.wrapper&&(this.popupWidth=this.wrapper.offsetWidth+"px")}scrollToItem(s,e,t){const i=this.list||this.vs.list;if(!i&&!t&&setTimeout(()=>{this.scrollToItem(s,e,!0)},10),s===0&&e&&this.vs.skip===0){this.vs.reset();return}if(i&&s>=0){const o=this.vs,r=o.container||i.parentNode,p=e!==void 0?e:o.enabled;c.scrollToItem(r,i,s,o.translate,p)}}initState(){return{data:{},events:[],syntheticEvent:void 0}}applyState(s){Object.keys(s.data).length>0&&this.component.setState(s.data);const e={syntheticEvent:s.syntheticEvent,nativeEvent:s.syntheticEvent?s.syntheticEvent.nativeEvent:void 0,target:this.component,value:this.component.value};s.events.forEach(t=>{const i=t.type;delete t.type;const o=i&&this.component.props[i];o&&o.call(void 0,{...e,...t})})}triggerOnPageChange(s,e,t){const i=this.component.props.virtual;if(i){const o=Math.min(Math.max(0,e),Math.max(0,i.total-t));o!==i.skip&&s.events.push({type:"onPageChange",page:{skip:o,take:t}})}}triggerPageChangeCornerItems(s,e){const t=this.component.props,{data:i=[],dataItemKey:o,virtual:r}=t,p=t.opened!==void 0?t.opened:this.component.state.opened;s&&r&&this.vs.enabled&&(r.skip>0&&c.areSame(s,i[0],o)?this.triggerOnPageChange(e,r.skip-1,r.pageSize):!p&&r.skip+r.pageSize<r.total&&c.areSame(s,i[i.length-1],o)&&this.triggerOnPageChange(e,r.skip+1,r.pageSize))}getPopupSettings(){return Object.assign({},a.defaultProps.popupSettings,this.component.props.popupSettings)}getAdaptiveAnimation(){const s=this.getPopupSettings();return s.animate!==void 0?s.animate:!0}getGroupedDataModernMode(s,e){const t=[];return s.forEach((i,o)=>{s[o-1]&&i[e]!==s[o-1][e]&&t.push({[e]:i[e]}),t.push(s[o])}),t}};a.basicPropTypes={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,textField:n.string,className:n.string,label: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,itemRender:n.func,listNoDataRender:n.func,focusedItemIndex:n.func,header:n.node,footer:n.node},a.propTypes={...a.basicPropTypes,value:n.any,defaultValue:n.any,filterable:n.bool,filter:n.string,virtual:n.shape({pageSize:n.number.isRequired,skip:n.number.isRequired,total:n.number.isRequired}),onFilterChange:n.func,onPageChange:n.func},a.defaultProps={popupSettings:{height:"200px"},required:!1,validityStyles:!0};let h=a;module.exports=h;