@progress/kendo-react-grid 15.1.0-develop.3 → 15.1.0-develop.5

package/toolbar-tools/GridToolbarFilter.mjs

@@ -5,270 +5,283 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as t from "react";
-import Oe from "react-dom";
-import { useDocument as Ve, SvgIcon as Ue, useAsyncFocusBlur as ze, classNames as Ke, getActiveElement as _e } from "@progress/kendo-react-common";
-import { GridColumnMenuItem as He } from "../columnMenu/GridColumnMenuItem.mjs";
-import { GridColumnMenuItemContent as je } from "../columnMenu/GridColumnMenuItemContent.mjs";
-import { GridColumnMenuItemGroup as qe } from "../columnMenu/GridColumnMenuItemGroup.mjs";
-import { GridContext as Je } from "../utils/GridContext.mjs";
-import { filterIcon as me, filterClearIcon as Qe } from "@progress/kendo-svg-icons";
-import { getFilterType as de, operatorMap as V, defaultHideSecondFilter as We, IsUnaryFilter as b, getDefaultOperator as Xe, filterLogicList as Ye, booleanFilterValues as Ze } from "../filterCommon.mjs";
-import { Button as k } from "@progress/kendo-react-buttons";
-import { GridColumnMenuFilterUI as $e } from "../columnMenu/GridColumnMenuFilterUI.mjs";
-import { toolbarFilter as M, messages as F, filterSubmitButton as ge, filterClearButton as pe, filterClearAllButton as he } from "../messages/index.mjs";
-import { useLocalization as xe } from "@progress/kendo-react-intl";
-import { rootFilterOrDefault as w, filterGroupByField as Re } from "../columnMenu/GridColumnMenuFilter.mjs";
-import { Popup as et } from "@progress/kendo-react-popup";
-import { BadgeContainer as tt, Badge as rt } from "@progress/kendo-react-indicators";
-import { GridToolbarAdaptiveProvider as ot } from "./adaptiveContext/GridToolbarAdaptiveContext.mjs";
-import { GridAdaptiveToolbarFilter as lt } from "./adaptiveContent/GridAdaptiveToolbarFilter.mjs";
-const nt = (c) => {
-  var re, oe, le, ne, ie, ae, se;
-  const n = t.useContext(Je), m = n.columnsRef, U = n.filter, p = n.defaultFilter, [S, E] = t.useState(!1), [ve, h] = t.useState(!1), [d, D] = t.useState(
-    (m == null ? void 0 : m.map((e) => ({ column: e, expanded: !1 }))) || []
-  ), [Fe, z] = t.useState(!1), g = t.useRef(null), y = t.useRef(null), K = t.useRef(null), I = t.useRef(0), r = t.useRef(null), f = xe(), Ee = Ve(g), _ = t.useMemo(
-    () => (m == null ? void 0 : m.filter((e) => {
-      var o;
-      return (o = e.title || e.field) == null ? void 0 : o.toLowerCase();
+import * as r from "react";
+import Pe from "react-dom";
+import { useDocument as Ae, SvgIcon as Ge, classNames as Oe } from "@progress/kendo-react-common";
+import { GridColumnMenuItem as Te } from "../columnMenu/GridColumnMenuItem.mjs";
+import { GridColumnMenuItemContent as Ve } from "../columnMenu/GridColumnMenuItemContent.mjs";
+import { GridColumnMenuItemGroup as Ue } from "../columnMenu/GridColumnMenuItemGroup.mjs";
+import { GridContext as ze } from "../utils/GridContext.mjs";
+import { filterIcon as fe, filterClearIcon as Ke } from "@progress/kendo-svg-icons";
+import { getFilterType as me, operatorMap as z, defaultHideSecondFilter as _e, IsUnaryFilter as D, getDefaultOperator as He, filterLogicList as je, booleanFilterValues as qe } from "../filterCommon.mjs";
+import { Button as y } from "@progress/kendo-react-buttons";
+import { GridColumnMenuFilterUI as Je } from "../columnMenu/GridColumnMenuFilterUI.mjs";
+import { toolbarFilter as I, messages as k, filterSubmitButton as de, filterClearButton as ge, filterClearAllButton as pe } from "../messages/index.mjs";
+import { useLocalization as Qe } from "@progress/kendo-react-intl";
+import { rootFilterOrDefault as N, filterGroupByField as We } from "../columnMenu/GridColumnMenuFilter.mjs";
+import { Popup as Xe } from "@progress/kendo-react-popup";
+import { BadgeContainer as Ye, Badge as Ze } from "@progress/kendo-react-indicators";
+import { GridToolbarAdaptiveProvider as $e } from "./adaptiveContext/GridToolbarAdaptiveContext.mjs";
+import { GridAdaptiveToolbarFilter as xe } from "./adaptiveContent/GridAdaptiveToolbarFilter.mjs";
+const Re = (u) => {
+  var re, le, oe, ie, ne, ae, se, ce;
+  const i = r.useContext(ze), d = i.columnsRef, g = i.filter, he = !!((re = g == null ? void 0 : g.filters) != null && re.length), [B, L] = r.useState(!1), [p, C] = r.useState(
+    (d == null ? void 0 : d.map((e) => ({ column: e, expanded: !1 }))) || []
+  ), [ve, K] = r.useState(!1), F = r.useRef(null), Fe = r.useRef(null), _ = r.useRef(null), t = r.useRef(null), m = Qe(), Ee = Ae(F), H = r.useMemo(
+    () => (d == null ? void 0 : d.filter((e) => {
+      var l;
+      return (l = e.title || e.field) == null ? void 0 : l.toLowerCase();
     })) || [],
-    [m]
-  );
-  t.useEffect(() => {
-    h(!!(p || U));
-  }, [p, U]);
-  const H = t.useCallback(
+    [d]
+  ), j = r.useCallback(
     (e) => {
-      const o = p && p.filters.some((i) => i.field === e.field);
-      return /* @__PURE__ */ t.createElement(t.Fragment, null, e.title || e.field, o && /* @__PURE__ */ t.createElement("span", { className: "k-columnmenu-indicators" }, /* @__PURE__ */ t.createElement(Ue, { key: 1, icon: me })));
+      var n;
+      const l = (n = g == null ? void 0 : g.filters) == null ? void 0 : n.some(
+        (o) => {
+          var a;
+          return o.field === e.field || ((a = o.filters) == null ? void 0 : a.some((f) => f.field === e.field));
+        }
+      );
+      return /* @__PURE__ */ r.createElement(r.Fragment, null, e.title || e.field, l && /* @__PURE__ */ r.createElement("span", { className: "k-columnmenu-indicators" }, /* @__PURE__ */ r.createElement(Ge, { key: 1, icon: fe })));
     },
-    [p]
-  ), j = (e, o) => {
-    D((i) => (r.current = o, i.map((l) => l.column.field === o.field ? { ...l, expanded: !l.expanded } : { ...l, expanded: !1 }))), B(q()), z(!Fe);
-  }, q = () => {
-    var o, i, l, s, ce, ue;
+    [g]
+  ), q = (e, l) => {
+    t.current = l, C((n) => n.map((o) => o.column.field === l.field ? { ...o, expanded: !o.expanded } : { ...o, expanded: !1 })), P(J()), K(!ve);
+  }, J = () => {
+    var l, n, o, a, f, v;
     let e;
-    if (r != null && r.current && ((o = r == null ? void 0 : r.current) != null && o.field)) {
-      const Ge = de((i = r == null ? void 0 : r.current) == null ? void 0 : i.filter), v = Xe(n.filterOperators, Ge);
-      e = Re((l = r == null ? void 0 : r.current) == null ? void 0 : l.field, n.filter), e = e ? {
+    if (t != null && t.current && ((l = t == null ? void 0 : t.current) != null && l.field)) {
+      const h = me((n = t == null ? void 0 : t.current) == null ? void 0 : n.filter), E = He(i.filterOperators, h);
+      if (e = We((o = t == null ? void 0 : t.current) == null ? void 0 : o.field, i.filter), !e) {
+        const b = N(i.filter).filters.filter(
+          (w) => {
+            var ue;
+            return !w.filters && w.field === ((ue = t == null ? void 0 : t.current) == null ? void 0 : ue.field);
+          }
+        );
+        b.length && (e = { logic: "and", filters: b.map((w) => ({ ...w })) });
+      }
+      e = e ? {
         ...e,
-        filters: e.filters.map((O) => ({ ...O }))
+        filters: e.filters.map((S) => ({ ...S }))
       } : {
         logic: "and",
         filters: [
           {
-            field: (s = r == null ? void 0 : r.current) == null ? void 0 : s.field,
-            operator: v,
-            value: b(v) ? null : void 0
+            field: (a = t == null ? void 0 : t.current) == null ? void 0 : a.field,
+            operator: E,
+            value: D(E) ? null : void 0
           },
           {
-            field: (ce = r == null ? void 0 : r.current) == null ? void 0 : ce.field,
-            operator: v,
-            value: b(v) ? null : void 0
+            field: (f = t == null ? void 0 : t.current) == null ? void 0 : f.field,
+            operator: E,
+            value: D(E) ? null : void 0
           }
         ]
-      }, e.filters.filter((O) => {
-        var fe;
-        return O.field === ((fe = r == null ? void 0 : r.current) == null ? void 0 : fe.field);
+      }, e.filters.filter((S) => {
+        var b;
+        return S.field === ((b = t == null ? void 0 : t.current) == null ? void 0 : b.field);
       }).length === 1 && e.filters.splice(1, 0, {
-        field: (ue = r == null ? void 0 : r.current) == null ? void 0 : ue.field,
-        operator: v
+        field: (v = t == null ? void 0 : t.current) == null ? void 0 : v.field,
+        operator: E
       });
     }
     return e;
-  }, Ce = (e) => {
-    J(0, e);
   }, be = (e) => {
-    J(1, e);
-  }, J = (e, o) => {
-    const i = u.filters.map((l, s) => s === e ? {
-      ...l,
-      value: o.value || "",
-      operator: o.operator || A[s].operator
-    } : l);
-    B({
-      ...u,
-      filters: i
+    Q(0, e);
+  }, ke = (e) => {
+    Q(1, e);
+  }, Q = (e, l) => {
+    const n = c.filters.map((o, a) => a === e ? {
+      ...o,
+      value: l.value || "",
+      operator: l.operator || A[a].operator
+    } : o);
+    P({
+      ...c,
+      filters: n
     });
-  }, [u, B] = t.useState(q()), a = u == null ? void 0 : u.filters, C = de((re = r == null ? void 0 : r.current) == null ? void 0 : re.filter), A = V(n.filterOperators[C], f), Q = V(Ze, f), ke = {
-    field: (oe = r == null ? void 0 : r.current) == null ? void 0 : oe.field,
-    value: a == null ? void 0 : a[0].value,
-    operator: a == null ? void 0 : a[0].operator,
+  }, [c, P] = r.useState(J()), s = c == null ? void 0 : c.filters, M = me((le = t == null ? void 0 : t.current) == null ? void 0 : le.filter), A = z(i.filterOperators[M], m), W = z(qe, m), Ce = {
+    field: (oe = t == null ? void 0 : t.current) == null ? void 0 : oe.field,
+    value: s == null ? void 0 : s[0].value,
+    operator: s == null ? void 0 : s[0].operator,
     operators: A,
-    booleanValues: Q,
-    onChange: Ce,
-    filterType: C
+    booleanValues: W,
+    onChange: be,
+    filterType: M
   }, Me = {
-    field: (le = r == null ? void 0 : r.current) == null ? void 0 : le.field,
-    value: a == null ? void 0 : a[1].value,
-    operator: a == null ? void 0 : a[1].operator,
+    field: (ie = t == null ? void 0 : t.current) == null ? void 0 : ie.field,
+    value: s == null ? void 0 : s[1].value,
+    operator: s == null ? void 0 : s[1].operator,
     operators: A,
-    booleanValues: Q,
-    onChange: be,
-    filterType: C
-  }, we = (e) => {
-    let o = e.target.value;
-    e.target.tagName === "SPAN" && (o = e.target.parentElement.value), B({ ...u, logic: o });
-  }, W = u == null ? void 0 : u.logic, X = V(Ye, f), T = {
-    value: X.find((e) => e.operator === (W === null ? "" : W)),
-    onChange: we,
-    data: X
-  }, Se = c.hideSecondFilter !== void 0 ? c.hideSecondFilter : We[C], N = c.filterUI, L = {
-    firstFilterProps: ke,
+    booleanValues: W,
+    onChange: ke,
+    filterType: M
+  }, Se = (e) => {
+    let l = e.target.value;
+    e.target.tagName === "SPAN" && (l = e.target.parentElement.value), P({ ...c, logic: l });
+  }, X = c == null ? void 0 : c.logic, Y = z(je, m), G = {
+    value: Y.find((e) => e.operator === (X === null ? "" : X)),
+    onChange: Se,
+    data: Y
+  }, we = u.hideSecondFilter !== void 0 ? u.hideSecondFilter : _e[M], O = u.filterUI, T = {
+    firstFilterProps: Ce,
     secondFilterProps: Me,
-    logicData: T.data,
-    logicValue: T.value,
-    onLogicChange: T.onChange,
-    hideSecondFilter: Se
-  }, Y = () => ({
-    ...u,
-    filters: u == null ? void 0 : u.filters.filter((e) => e.value !== void 0 && e.value !== null && e.value !== "" || e.value === null && e.operator)
-  }), P = ((ie = (ne = Y()) == null ? void 0 : ne.filters) == null ? void 0 : ie.length) !== 0 || b(a == null ? void 0 : a[0].operator) || b(a == null ? void 0 : a[1].operator), Z = (e) => {
-    if (e.preventDefault(), !n.filterChange)
+    logicData: G.data,
+    logicValue: G.value,
+    onLogicChange: G.onChange,
+    hideSecondFilter: we
+  }, Z = () => ({
+    ...c,
+    filters: c == null ? void 0 : c.filters.filter((e) => e.value !== void 0 && e.value !== null && e.value !== "" || e.value === null && e.operator)
+  }), V = ((ae = (ne = Z()) == null ? void 0 : ne.filters) == null ? void 0 : ae.length) !== 0 || D(s == null ? void 0 : s[0].operator) || D(s == null ? void 0 : s[1].operator), $ = (e) => {
+    if (e.preventDefault(), !i.filterChange)
       return;
-    const o = w(n.filter), i = {
-      ...o,
-      filters: o.filters.filter((l) => {
-        var s;
-        return l.field !== ((s = r == null ? void 0 : r.current) == null ? void 0 : s.field);
+    const l = N(i.filter), n = {
+      ...l,
+      filters: l.filters.filter((o) => {
+        var a, f;
+        return !(o.field === ((a = t == null ? void 0 : t.current) == null ? void 0 : a.field) || (f = o.filters) != null && f.some((v) => {
+          var h;
+          return v.field === ((h = t == null ? void 0 : t.current) == null ? void 0 : h.field);
+        }));
       })
     };
-    P && i.filters.push(Y()), n.filterChange(i, e), h(!0), E(!1);
-  }, $ = (e) => {
-    if (e.preventDefault(), !n.filterChange)
+    V && n.filters.push(Z()), i.filterChange(n, e), C(
+      (o) => o.map((a) => ({
+        ...a,
+        expanded: !1
+      }))
+    );
+  }, x = (e) => {
+    if (e.preventDefault(), !i.filterChange)
       return;
-    const o = w(n.filter), i = o.filters.filter((l) => {
-      var s;
-      return l.field !== ((s = r == null ? void 0 : r.current) == null ? void 0 : s.field);
+    const l = N(i.filter), n = l.filters.filter((o) => {
+      var a, f;
+      return !(o.field === ((a = t == null ? void 0 : t.current) == null ? void 0 : a.field) || (f = o.filters) != null && f.some((v) => {
+        var h;
+        return v.field === ((h = t == null ? void 0 : t.current) == null ? void 0 : h.field);
+      }));
     });
-    i.length === 0 ? n.filterChange(null, e) : n.filterChange({ ...o, filters: i }, e), c.onCloseMenu && c.onCloseMenu(), h(!1), D(
-      (l) => l.map((s) => ({
-        ...s,
+    n.length === 0 ? i.filterChange(null, e) : i.filterChange({ ...l, filters: n }, e), C(
+      (o) => o.map((a) => ({
+        ...a,
         expanded: !1
       }))
     );
   }, De = () => {
-    z(!1);
+    K(!1);
   }, ye = (e) => {
-    e.preventDefault(), E(!S);
+    e.preventDefault(), L(!B);
   }, Ie = (e) => {
-    !e.isAnchorClicked && E(!1);
-  }, G = t.useMemo(() => c.show !== void 0 ? c.show : S, [c.show, S]), Be = (e) => {
-    const o = _e(document);
-    clearTimeout(I.current), I.current = window.setTimeout(() => {
-      !n.mobileMode && o && e.relatedTarget !== g.current && y.current && !y.current.contains(o) && x();
-    });
-  }, x = () => {
+    !e.isAnchorClicked && L(!1);
+  }, U = r.useMemo(() => u.show !== void 0 ? u.show : B, [u.show, B]), R = () => {
     var e;
-    c.onCloseMenu && c.onCloseMenu(), E(!1), g.current && ((e = g.current.element) == null || e.focus());
-  }, Ae = () => {
-    clearTimeout(I.current);
-  }, { onFocus: Te, onBlur: Ne } = ze({
-    onFocus: (e) => Ae(),
-    onBlur: (e) => Be(e)
-  }), Le = (e) => {
-    var o;
-    (o = K.current) == null || o.triggerMouseEvent(e);
-  }, Pe = (e) => {
-    var o;
-    (o = K.current) == null || o.triggerKeyboardEvent(e);
-  }, R = t.useCallback(
+    u.onCloseMenu && u.onCloseMenu(), L(!1), F.current && ((e = F.current.element) == null || e.focus());
+  }, Ne = (e) => {
+    var l;
+    (l = _.current) == null || l.triggerMouseEvent(e);
+  }, Be = (e) => {
+    var l;
+    (l = _.current) == null || l.triggerKeyboardEvent(e);
+  }, ee = r.useCallback(
     (e) => {
-      if (e.preventDefault(), !n.filterChange)
+      if (e.preventDefault(), !i.filterChange)
+        return;
+      const l = N(i.filter);
+      if (!l.filters.length)
         return;
-      const o = w(n.filter), i = o.filters.filter(() => !1);
-      i.length === 0 ? n.filterChange(null, e) : n.filterChange({ ...o, filters: i }, e), h(!1), D(
-        (l) => l.map((s) => ({
-          ...s,
+      const n = l.filters.filter(() => !1);
+      n.length === 0 ? i.filterChange(null, e) : i.filterChange({ ...l, filters: n }, e), R(), C(
+        (o) => o.map((a) => ({
+          ...a,
           expanded: !1
         }))
       );
     },
-    [n, w]
-  ), ee = /* @__PURE__ */ t.createElement(
-    k,
+    [i]
+  ), Le = /* @__PURE__ */ r.createElement(
+    y,
     {
-      ref: g,
+      ref: F,
       togglable: !0,
-      selected: G,
-      svgIcon: c.svgIcon ? c.svgIcon : c.icon ? void 0 : me,
-      icon: c.icon,
-      size: n.mobileMode ? "large" : "medium",
-      className: Ke("k-toolbar-button", {
-        "k-icon-button": n.mobileMode
+      selected: U,
+      svgIcon: u.svgIcon ? u.svgIcon : u.icon ? void 0 : fe,
+      icon: u.icon,
+      size: i.mobileMode ? "large" : "medium",
+      className: Oe("k-toolbar-button", {
+        "k-icon-button": i.mobileMode
       }),
-      title: f.toLanguageString(M, F[M]),
+      title: m.toLanguageString(I, k[I]),
       onClick: ye
     },
-    !n.mobileMode && f.toLanguageString(M, F[M])
-  ), te = /* @__PURE__ */ t.createElement(t.Fragment, null, _.map((e) => {
-    var o, i;
-    return e.filterable && /* @__PURE__ */ t.createElement(qe, { key: e.id }, /* @__PURE__ */ t.createElement("div", { className: "k-expander" }, /* @__PURE__ */ t.createElement(
-      He,
+    !i.mobileMode && m.toLanguageString(I, k[I])
+  ), te = /* @__PURE__ */ r.createElement(r.Fragment, null, H.map((e) => {
+    var l, n;
+    return e.filterable && /* @__PURE__ */ r.createElement(Ue, { key: e.id }, /* @__PURE__ */ r.createElement("div", { className: "k-expander" }, /* @__PURE__ */ r.createElement(
+      Te,
       {
-        title: H(e),
+        title: j(e),
         expandable: !0,
-        expanded: !!((o = d == null ? void 0 : d.find((l) => l.column.field === e.field)) != null && o.expanded),
-        onClick: (l) => j(l, e)
+        expanded: !!((l = p == null ? void 0 : p.find((o) => o.column.field === e.field)) != null && l.expanded),
+        onClick: (o) => q(o, e)
       }
-    )), /* @__PURE__ */ t.createElement(
-      je,
+    )), /* @__PURE__ */ r.createElement(
+      Ve,
       {
-        show: !!((i = d == null ? void 0 : d.find((l) => l.column.field === e.field)) != null && i.expanded)
+        show: !!((n = p == null ? void 0 : p.find((o) => o.column.field === e.field)) != null && n.expanded)
       },
-      /* @__PURE__ */ t.createElement("form", { className: "k-filter-menu", onSubmit: Z, onReset: $ }, /* @__PURE__ */ t.createElement("div", { className: "k-filter-menu-container" }, N ? /* @__PURE__ */ t.createElement(N, { ...L }) : /* @__PURE__ */ t.createElement($e, { ...L }), /* @__PURE__ */ t.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ t.createElement(k, { themeColor: "primary", disabled: !P }, f.toLanguageString(
+      /* @__PURE__ */ r.createElement("form", { className: "k-filter-menu", onSubmit: $, onReset: x }, /* @__PURE__ */ r.createElement("div", { className: "k-filter-menu-container" }, O ? /* @__PURE__ */ r.createElement(O, { ...T }) : /* @__PURE__ */ r.createElement(Je, { ...T }), /* @__PURE__ */ r.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ r.createElement(y, { themeColor: "primary", disabled: !V }, m.toLanguageString(
+        de,
+        k[de]
+      )), /* @__PURE__ */ r.createElement(y, { type: "reset" }, m.toLanguageString(
         ge,
-        F[ge]
-      )), /* @__PURE__ */ t.createElement(k, { type: "reset" }, f.toLanguageString(
-        pe,
-        F[pe]
+        k[ge]
       )))))
     ));
-  }), /* @__PURE__ */ t.createElement("div", { className: "k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer" }, /* @__PURE__ */ t.createElement(k, { svgIcon: Qe, onClick: R }, f.toLanguageString(he, F[he]))));
-  return /* @__PURE__ */ t.createElement(t.Fragment, null, ve ? /* @__PURE__ */ t.createElement(tt, null, ee, /* @__PURE__ */ t.createElement(rt, { themeColor: "primary" })) : ee, n.mobileMode ? /* @__PURE__ */ t.createElement(ot, null, Oe.createPortal(
-    /* @__PURE__ */ t.createElement(
-      lt,
+  }), /* @__PURE__ */ r.createElement("div", { className: "k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer" }, /* @__PURE__ */ r.createElement(y, { svgIcon: Ke, onClick: ee }, m.toLanguageString(pe, k[pe]))));
+  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Ye, null, Le, he && /* @__PURE__ */ r.createElement(Ze, { themeColor: "primary" })), i.mobileMode ? /* @__PURE__ */ r.createElement($e, null, Pe.createPortal(
+    /* @__PURE__ */ r.createElement(
+      xe,
       {
-        filtered: _,
-        computedShow: G,
-        expandState: d,
-        FilterUI: N,
-        filterUIProps: L,
-        isFilterValid: P,
-        renderTitle: H,
+        filtered: H,
+        computedShow: U,
+        expandState: p,
+        FilterUI: O,
+        filterUIProps: T,
+        isFilterValid: V,
+        renderTitle: j,
         onBackView: De,
-        clear: $,
-        submit: Z,
-        onClose: x,
-        onFilterExpand: j,
-        handleClearAllFilters: R
+        clear: x,
+        submit: $,
+        onClose: R,
+        onFilterExpand: q,
+        handleClearAllFilters: ee
       },
       te
     ),
-    (ae = Ee()) == null ? void 0 : ae.body
-  )) : /* @__PURE__ */ t.createElement(
-    et,
+    (se = Ee()) == null ? void 0 : se.body
+  )) : /* @__PURE__ */ r.createElement(
+    Xe,
     {
-      anchor: (se = g.current) == null ? void 0 : se.element,
-      show: G,
+      anchor: (ce = F.current) == null ? void 0 : ce.element,
+      show: U,
       popupClass: "k-grid-columnmenu-popup",
       onMouseDownOutside: Ie
     },
-    /* @__PURE__ */ t.createElement(
+    /* @__PURE__ */ r.createElement(
       "div",
       {
-        ref: y,
-        onBlur: Ne,
-        onFocus: Te,
-        onMouseDown: Le,
-        onKeyDown: Pe,
+        ref: Fe,
+        onMouseDown: Ne,
+        onKeyDown: Be,
         className: "k-column-menu k-column-menu-md"
       },
       te
     )
   ));
 };
-nt.displayName = "KendoReactGridToolbarFilter";
+Re.displayName = "KendoReactGridToolbarFilter";
 export {
-  nt as GridToolbarFilter
+  Re as GridToolbarFilter
 };

package/toolbar-tools/GridToolbarSort.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 J=require("react"),Q=require("react-dom"),U=require("../columnMenu/GridColumnMenuItemGroup.js"),W=require("../columnMenu/GridColumnMenuItem.js"),X=require("../utils/GridContext.js"),R=require("@progress/kendo-react-buttons"),m=require("@progress/kendo-svg-icons"),Y=require("@progress/kendo-react-intl"),s=require("../messages/index.js"),u=require("@progress/kendo-react-common"),x=require("@progress/kendo-react-indicators"),Z=require("@progress/kendo-react-popup"),$=require("./adaptiveContext/GridToolbarAdaptiveContext.js"),ee=require("./adaptiveContent/GridAdaptiveToolbarSort.js");function te(r){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const l in r)if(l!=="default"){const i=Object.getOwnPropertyDescriptor(r,l);Object.defineProperty(n,l,i.get?i:{enumerable:!0,get:()=>r[l]})}}return n.default=r,Object.freeze(n)}const e=te(J),A=r=>{var q,B;const n=e.useContext(X.GridContext),l=n.columnsState,i=n.sortable,a=n.sort,h=n.defaultSort,[v,E]=e.useState(!0),[O,d]=e.useState(!1),[g,f]=e.useState(!1),c=e.useRef(null),b=e.useRef(null),M=e.useRef(null),C=e.useRef(0),S=Y.useLocalization(),N=u.useDocument(c);e.useEffect(()=>{h||a!=null&&a.length?(d(!0),E(!1)):d(!1)},[h,a]);const p=e.useMemo(()=>(l==null?void 0:l.filter(t=>{var o;return(o=t.title||t.field)==null?void 0:o.toLowerCase()}))||[],[l]),w=e.useCallback((t,o)=>{n.headerCellClick(t,o),E(!1),d(!0)},[n]),I=e.useCallback(t=>{n.sortChange([],t),d(!1)},[n]),D=e.useCallback(t=>{const o=a?a.findIndex(H=>H.field===t.field):-1;return e.createElement(e.Fragment,null,t.title||t.field,e.createElement("span",{className:"k-columnmenu-indicators"},o>=0&&[e.createElement(u.SvgIcon,{key:1,icon:a[o].dir==="asc"?m.sortAscSmallIcon:m.sortDescSmallIcon}),a.length>1&&e.createElement("span",{key:2,className:"k-sort-index"},o+1)]))},[a]),P=t=>{t.preventDefault(),f(!g)},k=e.useMemo(()=>r.show!==void 0?r.show:g,[r.show,g]),y=()=>{var t;r.onCloseMenu&&r.onCloseMenu(),f(!1),c.current&&((t=c.current.element)==null||t.focus())},F=t=>{const o=u.getActiveElement(document);clearTimeout(C.current),C.current=window.setTimeout(()=>{!n.mobileMode&&o&&t.relatedTarget!==c.current&&b.current&&!b.current.contains(o)&&y()})},j=()=>{clearTimeout(C.current)},{onFocus:z,onBlur:L}=u.useAsyncFocusBlur({onFocus:t=>j(),onBlur:t=>F(t)}),K=t=>{var o;(o=M.current)==null||o.triggerMouseEvent(t)},_=t=>{var o;(o=M.current)==null||o.triggerKeyboardEvent(t)},V=t=>{!t.isAnchorClicked&&f(!1)},G=e.createElement(e.Fragment,null,e.createElement(U.GridColumnMenuItemGroup,null,p.map(t=>e.createElement(W.GridColumnMenuItem,{key:t.id,title:D(t),onClick:o=>w(o,t)}))),e.createElement("div",{className:"k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer"},e.createElement(R.Button,{svgIcon:m.xIcon,onClick:I,disabled:v},S.toLanguageString(s.sortClearButton,s.messages[s.sortClearButton])))),T=e.createElement(R.Button,{ref:c,togglable:!0,selected:k,svgIcon:r.svgIcon?r.svgIcon:r.icon?void 0:m.arrowsSwapIcon,icon:r.icon,size:n.mobileMode?"large":"medium",className:u.classNames("k-toolbar-button",{"k-icon-button":n.mobileMode}),title:S.toLanguageString(s.toolbarSort,s.messages[s.toolbarSort]),onClick:P},!n.mobileMode&&S.toLanguageString(s.toolbarSort,s.messages[s.toolbarSort]));return i&&e.createElement(e.Fragment,null,O?e.createElement(x.BadgeContainer,null,T,e.createElement(x.Badge,{themeColor:"primary"})):T,n.mobileMode?e.createElement($.GridToolbarAdaptiveProvider,null,Q.createPortal(e.createElement(ee.GridAdaptiveToolbarSort,{filtered:p,computedShow:k,isDisabledButton:v,renderTitle:D,onClose:y,onClear:I,handleSorting:w},G),(q=N())==null?void 0:q.body)):e.createElement(Z.Popup,{anchor:(B=c.current)==null?void 0:B.element,show:k,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:V},e.createElement("div",{ref:b,onBlur:L,onFocus:z,onMouseDown:K,onKeyDown:_,className:"k-column-menu k-column-menu-md"},G)))};A.displayName="KendoReactGridToolbarSort";exports.GridToolbarSort=A;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const j=require("react"),z=require("react-dom"),L=require("../columnMenu/GridColumnMenuItemGroup.js"),K=require("../columnMenu/GridColumnMenuItem.js"),F=require("../utils/GridContext.js"),p=require("@progress/kendo-react-buttons"),d=require("@progress/kendo-svg-icons"),_=require("@progress/kendo-react-intl"),a=require("../messages/index.js"),C=require("@progress/kendo-react-common"),w=require("@progress/kendo-react-indicators"),V=require("@progress/kendo-react-popup"),H=require("./adaptiveContext/GridToolbarAdaptiveContext.js"),J=require("./adaptiveContent/GridAdaptiveToolbarSort.js");function Q(o){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const n in o)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(o,n);Object.defineProperty(c,n,s.get?s:{enumerable:!0,get:()=>o[n]})}}return c.default=o,Object.freeze(c)}const e=Q(j),G=o=>{var E,I;const{onCloseMenu:c}=o,n=e.useContext(F.GridContext),s=n.columnsState,q=n.sortable,l=n.sort,y=!!(l!=null&&l.length),[m,i]=e.useState(!1),u=e.useRef(null),D=e.useRef(null),f=e.useRef(null),g=_.useLocalization(),R=C.useDocument(u),k=e.useMemo(()=>(s==null?void 0:s.filter(t=>{var r;return(r=t.title||t.field)==null?void 0:r.toLowerCase()}))||[],[s]),S=e.useCallback((t,r)=>{n.headerCellClick(t,r)},[n]),h=e.useCallback(t=>{l!=null&&l.length&&(n.sortChange([],t),i(!1),c&&c())},[n,l,c]),M=e.useCallback(t=>{const r=l?l.findIndex(A=>A.field===t.field):-1;return e.createElement(e.Fragment,null,t.title||t.field,e.createElement("span",{className:"k-columnmenu-indicators"},r>=0&&[e.createElement(C.SvgIcon,{key:1,icon:l[r].dir==="asc"?d.sortAscSmallIcon:d.sortDescSmallIcon}),l.length>1&&e.createElement("span",{key:2,className:"k-sort-index"},r+1)]))},[l]),x=t=>{t.preventDefault(),i(!m)},b=e.useMemo(()=>o.show!==void 0?o.show:m,[o.show,m]),B=()=>{var t;o.onCloseMenu&&o.onCloseMenu(),i(!1),u.current&&((t=u.current.element)==null||t.focus())},T=t=>{var r;(r=f.current)==null||r.triggerMouseEvent(t)},O=t=>{var r;(r=f.current)==null||r.triggerKeyboardEvent(t)},N=t=>{!t.isAnchorClicked&&i(!1)},v=e.createElement(e.Fragment,null,e.createElement(L.GridColumnMenuItemGroup,null,k.map(t=>e.createElement(K.GridColumnMenuItem,{key:t.id,title:M(t),onClick:r=>S(r,t)}))),e.createElement("div",{className:"k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer"},e.createElement(p.Button,{svgIcon:d.xIcon,onClick:h},g.toLanguageString(a.sortClearButton,a.messages[a.sortClearButton])))),P=e.createElement(p.Button,{ref:u,togglable:!0,selected:b,svgIcon:o.svgIcon?o.svgIcon:o.icon?void 0:d.arrowsSwapIcon,icon:o.icon,size:n.mobileMode?"large":"medium",className:C.classNames("k-toolbar-button",{"k-icon-button":n.mobileMode}),title:g.toLanguageString(a.toolbarSort,a.messages[a.toolbarSort]),onClick:x},!n.mobileMode&&g.toLanguageString(a.toolbarSort,a.messages[a.toolbarSort]));return q&&e.createElement(e.Fragment,null,e.createElement(w.BadgeContainer,null,P,y&&e.createElement(w.Badge,{themeColor:"primary"})),n.mobileMode?e.createElement(H.GridToolbarAdaptiveProvider,null,z.createPortal(e.createElement(J.GridAdaptiveToolbarSort,{filtered:k,computedShow:b,renderTitle:M,onClose:B,onClear:h,handleSorting:S},v),(E=R())==null?void 0:E.body)):e.createElement(V.Popup,{anchor:(I=u.current)==null?void 0:I.element,show:b,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:N},e.createElement("div",{ref:D,onMouseDown:T,onKeyDown:O,className:"k-column-menu k-column-menu-md"},v)))};G.displayName="KendoReactGridToolbarSort";exports.GridToolbarSort=G;