@progress/kendo-react-grid 10.2.0 → 11.0.0-develop.1

package/columnMenu/GridColumnMenuFilter.mjs

@@ -6,23 +6,26 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as r from "react";
-import { isCompositeFilterDescriptor as T } from "@progress/kendo-data-query";
-import { GridColumnMenuItem as te } from "./GridColumnMenuItem.mjs";
-import { GridColumnMenuItemGroup as le } from "./GridColumnMenuItemGroup.mjs";
-import { GridColumnMenuItemContent as re } from "./GridColumnMenuItemContent.mjs";
-import { useLocalization as ie } from "@progress/kendo-react-intl";
-import { getFilterType as w, getDefaultOperator as oe, IsUnaryFilter as h, operatorMap as x, booleanFilterValues as ne, filterLogicList as ae, defaultHideSecondFilter as ce } from "../filterCommon.mjs";
-import { filterTitle as N, messages as p, filterSubmitButton as _, filterClearButton as z } from "../messages/index.mjs";
-import { GridColumnMenuFilterUI as se } from "./GridColumnMenuFilterUI.mjs";
-import { Button as H } from "@progress/kendo-react-buttons";
-import { filterIcon as ue } from "@progress/kendo-svg-icons";
-const S = (e) => e || { filters: [], logic: "and" }, v = (e, f) => S(f).filters.filter((i) => T(i) ? i.filters && i.filters.length && !i.filters.find((d) => T(d) || d.field !== e) : !1)[0] || null, xe = (e, f) => !!v(e, f), pe = (e) => {
-  const f = r.useCallback(() => {
+import * as l from "react";
+import { isCompositeFilterDescriptor as $ } from "@progress/kendo-data-query";
+import { GridColumnMenuItem as se } from "./GridColumnMenuItem.mjs";
+import { GridColumnMenuItemGroup as ue } from "./GridColumnMenuItemGroup.mjs";
+import { GridColumnMenuItemContent as fe } from "./GridColumnMenuItemContent.mjs";
+import { useLocalization as de } from "@progress/kendo-react-intl";
+import { getFilterType as j, getDefaultOperator as me, IsUnaryFilter as v, operatorMap as y, booleanFilterValues as ge, filterLogicList as Ce, defaultHideSecondFilter as Fe } from "../filterCommon.mjs";
+import { adaptiveColumnMenuFilterTitle as q, messages as p, filterTitle as J, filterSubmitButton as K, filterClearButton as Q } from "../messages/index.mjs";
+import { GridColumnMenuFilterUI as he } from "./GridColumnMenuFilterUI.mjs";
+import { Button as W } from "@progress/kendo-react-buttons";
+import { filterIcon as ve } from "@progress/kendo-svg-icons";
+import { GridContext as pe } from "../GridClientWrapper.mjs";
+import { GridColumnMenuAdaptiveContext as xe } from "./adaptiveContext/GridColumnMenuAdaptiveContext.mjs";
+import { GridAdaptiveFilterMenu as Ee } from "./adaptiveContent/GridAdaptiveFilterMenu.mjs";
+const k = (e) => e || { filters: [], logic: "and" }, x = (e, i) => k(i).filters.filter((c) => $(c) ? c.filters && c.filters.length && !c.filters.find((g) => $(g) || g.field !== e) : !1)[0] || null, Oe = (e, i) => !!x(e, i), Ve = (e) => {
+  const i = l.useContext(pe), { actionSheetRef: E } = l.useContext(xe), I = l.useCallback(() => {
     let t;
     if (e.column && e.column.field) {
-      const n = w(e.column.filter), l = oe(e.filterOperators, n);
-      t = v(e.column.field, e.filter), t = t ? {
+      const n = j(e.column.filter), r = me(e.filterOperators, n);
+      t = x(e.column.field, e.filter), t = t ? {
         ...t,
         filters: t.filters.map((o) => ({ ...o }))
       } : {
@@ -30,115 +33,134 @@ const S = (e) => e || { filters: [], logic: "and" }, v = (e, f) => S(f).filters.
         filters: [
           {
             field: e.column.field,
-            operator: l,
-            value: h(l) ? null : void 0
+            operator: r,
+            value: v(r) ? null : void 0
           },
           {
             field: e.column.field,
-            operator: l,
-            value: h(l) ? null : void 0
+            operator: r,
+            value: v(r) ? null : void 0
           }
         ]
-      }, t.filters.filter((o) => o.field === e.column.field).length === 1 && t.filters.splice(1, 0, { field: e.column.field, operator: l });
+      }, t.filters.filter((o) => o.field === e.column.field).length === 1 && t.filters.splice(1, 0, { field: e.column.field, operator: r });
     }
     return t;
-  }, [e.column]), [E, M] = r.useState(e.expanded || !1), [i, d] = r.useState(f()), I = () => e.expanded !== void 0, R = () => {
-    const t = I(), n = !(t ? e.expanded : E);
-    e.onExpandChange && e.onExpandChange(n), t || M(n);
-  }, A = (t) => {
-    y(0, t);
-  }, j = (t) => {
-    y(1, t);
-  }, y = (t, n) => {
-    const l = i.filters.map((o, a) => a === t ? {
+  }, [e.column]), [c, g] = l.useState(e.expanded || !1), [L, M] = l.useState(!1), [s, P] = l.useState(I()), T = () => e.expanded !== void 0, X = () => {
+    const t = T(), n = !(t ? e.expanded : c);
+    i.mobileMode && E.current.element.style.setProperty("--kendo-actionsheet-view-current", 2), e.onExpandChange && e.onExpandChange(n), M(!L), !t && !i.mobileMode && g(n);
+  }, Y = (t) => {
+    D(0, t);
+  }, Z = (t) => {
+    D(1, t);
+  }, D = (t, n) => {
+    const r = s.filters.map((o, a) => a === t ? {
       ...o,
       value: n.value,
       operator: n.operator
     } : o);
-    d({
-      ...i,
-      filters: l
+    P({
+      ...s,
+      filters: r
     });
-  }, q = (t) => {
-    d({
-      ...i,
-      logic: t.target.value.operator
-    });
-  }, J = (t) => {
+  }, ee = (t) => {
+    let n = t.target.value;
+    t.target.tagName === "SPAN" && (n = t.target.parentElement.value), P({ ...s, logic: n });
+  }, w = (t) => {
     if (t.preventDefault(), !e.onFilterChange)
       return;
-    const n = e.column.field, l = S(e.filter), o = v(n, e.filter), a = l.filters.filter((u) => u !== o);
-    a.length ? e.onFilterChange({ ...l, filters: a }, t) : e.onFilterChange(null, t), e.onCloseMenu && e.onCloseMenu();
-  }, L = () => ({
-    ...i,
-    filters: i.filters.filter((t) => t.value !== void 0 && t.value !== null && t.value !== "" || t.value === null && t.operator)
-  }), K = (t) => {
+    const n = e.column.field, r = k(e.filter), o = x(n, e.filter), a = r.filters.filter((m) => m !== o);
+    a.length ? e.onFilterChange({ ...r, filters: a }, t) : e.onFilterChange(null, t), e.onCloseMenu && e.onCloseMenu();
+  }, A = () => ({
+    ...s,
+    filters: s.filters.filter((t) => t.value !== void 0 && t.value !== null && t.value !== "" || t.value === null && t.operator)
+  }), N = (t) => {
     if (t.preventDefault(), !e.onFilterChange)
       return;
-    const n = e.column.field, l = S(e.filter), o = v(n, e.filter), a = L();
-    let u = null;
+    const n = e.column.field, r = k(e.filter), o = x(n, e.filter), a = A();
+    let m = null;
     if (o && a.filters.length > 0) {
-      const F = l.filters.map((C) => C === o ? a : C);
-      u = {
-        ...l,
+      const F = r.filters.map((h) => h === o ? a : h);
+      m = {
+        ...r,
         filters: F
       };
     } else if (a.filters.length === 0) {
-      const F = l.filters.filter((C) => C !== o);
-      F.length && (u = {
-        ...l,
+      const F = r.filters.filter((h) => h !== o);
+      F.length && (m = {
+        ...r,
         filters: F
       });
     } else
-      u = {
-        ...l,
-        filters: [...l.filters, a]
+      m = {
+        ...r,
+        filters: [...r.filters, a]
       };
-    e.onFilterChange(u, t), e.onCloseMenu && e.onCloseMenu();
-  }, { column: m, filterUI: Q, hideSecondFilter: b, filterOperators: W } = e, c = ie();
-  if (!m || !m.field)
-    return /* @__PURE__ */ r.createElement("div", null);
-  const g = w(m.filter), X = b !== void 0 ? b : ce[g], s = i.filters, k = x(W[g], c), D = x(ne, c), Y = {
-    field: m.field,
-    value: s[0].value,
-    operator: s[0].operator,
-    operators: k,
-    booleanValues: D,
-    onChange: A,
-    filterType: g
-  }, Z = {
-    field: m.field,
-    value: s[1].value,
-    operator: s[1].operator,
-    operators: k,
-    booleanValues: D,
-    onChange: j,
-    filterType: g
-  }, O = i.logic, P = x(ae, c), G = {
-    value: P.find((t) => t.operator === (O === null ? "" : O)),
-    onChange: q,
-    data: P
-  }, U = Q, V = {
-    firstFilterProps: Y,
-    secondFilterProps: Z,
-    logicData: G.data,
-    logicValue: G.value,
-    onLogicChange: G.onChange,
-    hideSecondFilter: X
-  }, $ = L().filters.length !== 0 || h(s[0].operator) || h(s[1].operator), ee = I() ? e.expanded : E, B = e.alwaysExpand;
-  return /* @__PURE__ */ r.createElement(le, null, !B && /* @__PURE__ */ r.createElement(
-    te,
+    e.onFilterChange(m, t), e.onCloseMenu && e.onCloseMenu();
+  }, { column: u, filterUI: te, hideSecondFilter: O, filterOperators: le } = e, f = de();
+  if (!u || !u.field)
+    return /* @__PURE__ */ l.createElement("div", null);
+  const C = j(u.filter), re = O !== void 0 ? O : Fe[C], d = s.filters, V = y(le[C], f), B = y(ge, f), ne = {
+    field: u.field,
+    value: d[0].value,
+    operator: d[0].operator,
+    operators: V,
+    booleanValues: B,
+    onChange: Y,
+    filterType: C
+  }, oe = {
+    field: u.field,
+    value: d[1].value,
+    operator: d[1].operator,
+    operators: V,
+    booleanValues: B,
+    onChange: Z,
+    filterType: C
+  }, U = s.logic, R = y(Ce, f), S = {
+    value: R.find((t) => t.operator === (U === null ? "" : U)),
+    onChange: ee,
+    data: R
+  }, G = te, b = {
+    firstFilterProps: ne,
+    secondFilterProps: oe,
+    logicData: S.data,
+    logicValue: S.value,
+    onLogicChange: S.onChange,
+    hideSecondFilter: re
+  }, _ = A().filters.length !== 0 || v(d[0].operator) || v(d[1].operator), z = T() ? e.expanded : c, H = e.alwaysExpand && !i.mobileMode, ie = () => {
+    M(!1), i.mobileMode && E.current.element.style.setProperty("--kendo-actionsheet-view-current", 1);
+  }, ae = () => {
+    M(!1), e.onCloseMenu && e.onCloseMenu();
+  }, ce = `${f.toLanguageString(
+    q,
+    p[q]
+  )} ${u.title || u.field}`;
+  return /* @__PURE__ */ l.createElement(ue, null, !H && /* @__PURE__ */ l.createElement("div", { className: "k-expander" }, /* @__PURE__ */ l.createElement(
+    se,
     {
-      title: c.toLanguageString(N, p[N]),
+      title: f.toLanguageString(J, p[J]),
       iconClass: "k-i-filter",
-      svgIcon: ue,
-      onClick: R
+      svgIcon: ve,
+      expandable: !0,
+      expanded: !!z,
+      onClick: X
+    }
+  )), i.mobileMode && L ? /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(
+    Ee,
+    {
+      FilterUI: G,
+      filterUIProps: b,
+      onBackView: ie,
+      adaptiveTitle: ce,
+      handleClose: ae,
+      submit: N,
+      clear: w,
+      isFilterValid: _
     }
-  ), /* @__PURE__ */ r.createElement(re, { show: B || !!ee }, /* @__PURE__ */ r.createElement("form", { className: "k-filter-menu", onSubmit: K, onReset: J }, /* @__PURE__ */ r.createElement("div", { className: "k-filter-menu-container" }, U ? /* @__PURE__ */ r.createElement(U, { ...V }) : /* @__PURE__ */ r.createElement(se, { ...V }), /* @__PURE__ */ r.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ r.createElement(H, { themeColor: "primary", disabled: !$ }, c.toLanguageString(_, p[_])), /* @__PURE__ */ r.createElement(H, { type: "reset" }, c.toLanguageString(z, p[z])))))));
+  )) : /* @__PURE__ */ l.createElement(fe, { show: (H || !!z) && !i.mobileMode }, /* @__PURE__ */ l.createElement("form", { className: "k-filter-menu", onSubmit: N, onReset: w }, /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, G ? /* @__PURE__ */ l.createElement(G, { ...b }) : /* @__PURE__ */ l.createElement(he, { ...b }), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ l.createElement(W, { themeColor: "primary", disabled: !_ }, f.toLanguageString(K, p[K])), /* @__PURE__ */ l.createElement(W, { type: "reset" }, f.toLanguageString(Q, p[Q])))))));
 };
 export {
-  pe as GridColumnMenuFilter,
-  v as filterGroupByField,
-  xe as isColumnMenuFilterActive,
-  S as rootFilterOrDefault
+  Ve as GridColumnMenuFilter,
+  x as filterGroupByField,
+  Oe as isColumnMenuFilterActive,
+  k as rootFilterOrDefault
 };

package/columnMenu/GridColumnMenuFilterCell.js

@@ -6,4 +6,4 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react"),d=require("@progress/kendo-react-dropdowns"),g=require("@progress/kendo-react-inputs"),h=require("@progress/kendo-react-dateinputs"),i=require("../filterCommon.js");function b(e){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const c=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(l,o,c.get?c:{enumerable:!0,get:()=>e[o]})}}return l.default=e,Object.freeze(l)}const a=b(f),D=e=>{const l=()=>{if(e.filterType==="boolean")return;const n=e.operators.find(r=>r.operator===e.operator)||null;return a.createElement(d.DropDownList,{value:n,onChange:c,data:e.operators,textField:"text"})},o=(n,r)=>{i.cellInputChange(n,r,e)},c=n=>{i.cellOperatorChange(n,e.value,e.onChange)},m=n=>{i.cellBoolDropdownChange(n,e.onChange)},C=(n,r,s)=>{switch(n){case"numeric":return a.createElement(g.NumericTextBox,{value:r,onChange:t=>{o(t.value,t.syntheticEvent)},rangeOnEnter:!1});case"date":return a.createElement(h.DatePicker,{value:r,onChange:t=>{o(t.value,t.syntheticEvent)}});case"boolean":{const t=u=>u==null;return a.createElement(d.DropDownList,{onChange:m,value:s.find(u=>u.operator===(t(r)?"":r)),data:s,textField:"text"})}default:return a.createElement(g.Input,{value:r||"",onChange:t=>{o(t.target.value,t.syntheticEvent)}})}};return a.createElement(a.Fragment,null,l(),C(e.filterType,e.value,e.booleanValues))};exports.GridColumnMenuFilterCell=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),d=require("@progress/kendo-react-dropdowns"),s=require("@progress/kendo-react-inputs"),h=require("@progress/kendo-react-dateinputs"),c=require("../filterCommon.js"),p=require("../GridClientWrapper.js");function D(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const l=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,l.get?l:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const r=D(b),v=e=>{const t=r.useContext(p.GridContext),a=()=>{if(e.filterType==="boolean")return;const n=e.operators.find(o=>o.operator===e.operator)||null;return r.createElement(d.DropDownList,{adaptive:t.adaptive,size:t.mobileMode?"large":"medium",value:n,onChange:m,data:e.operators,textField:"text"})},l=n=>{c.cellInputChange(n.value,n.syntheticEvent,e)},m=n=>{c.cellOperatorChange(n,e.value,e.onChange)},g=n=>{c.cellBoolDropdownChange(n,e.onChange)},C=(n,o,u)=>{switch(n){case"numeric":return r.createElement(s.NumericTextBox,{value:o,size:t.mobileMode?"large":"medium",onChange:l,rangeOnEnter:!1});case"date":return r.createElement(h.DatePicker,{value:o,size:t.mobileMode?"large":"medium",onChange:l});case"boolean":{const f=i=>i==null;return r.createElement(d.DropDownList,{adaptive:t.adaptive,onChange:g,size:t.mobileMode?"large":"medium",value:u.find(i=>i.operator===(f(o)?"":o)),data:u,textField:"text"})}default:return r.createElement(s.Input,{className:"k-input-lg",value:o||"",onChange:l})}};return r.createElement(r.Fragment,null,a(),C(e.filterType,e.value,e.booleanValues))};exports.GridColumnMenuFilterCell=v;

package/columnMenu/GridColumnMenuFilterCell.mjs

@@ -6,72 +6,75 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as o from "react";
-import { DropDownList as i } from "@progress/kendo-react-dropdowns";
-import { Input as C, NumericTextBox as d } from "@progress/kendo-react-inputs";
+import * as n from "react";
+import { DropDownList as m } from "@progress/kendo-react-dropdowns";
+import { Input as s, NumericTextBox as h } from "@progress/kendo-react-inputs";
 import { DatePicker as f } from "@progress/kendo-react-dateinputs";
-import { cellOperatorChange as E, cellInputChange as s, cellBoolDropdownChange as v } from "../filterCommon.mjs";
-const w = (e) => {
-  const u = () => {
+import { cellOperatorChange as x, cellInputChange as p, cellBoolDropdownChange as E } from "../filterCommon.mjs";
+import { GridContext as b } from "../GridClientWrapper.mjs";
+const z = (e) => {
+  const r = n.useContext(b), c = () => {
     if (e.filterType === "boolean")
       return;
-    const n = e.operators.find((r) => r.operator === e.operator) || null;
-    return /* @__PURE__ */ o.createElement(i, { value: n, onChange: m, data: e.operators, textField: "text" });
-  }, l = (n, r) => {
-    s(n, r, e);
-  }, m = (n) => {
-    E(n, e.value, e.onChange);
-  }, h = (n) => {
-    v(n, e.onChange);
-  }, g = (n, r, c) => {
-    switch (n) {
+    const t = e.operators.find((o) => o.operator === e.operator) || null;
+    return /* @__PURE__ */ n.createElement(
+      m,
+      {
+        adaptive: r.adaptive,
+        size: r.mobileMode ? "large" : "medium",
+        value: t,
+        onChange: d,
+        data: e.operators,
+        textField: "text"
+      }
+    );
+  }, l = (t) => {
+    p(t.value, t.syntheticEvent, e);
+  }, d = (t) => {
+    x(t, e.value, e.onChange);
+  }, u = (t) => {
+    E(t, e.onChange);
+  }, g = (t, o, i) => {
+    switch (t) {
       case "numeric":
-        return /* @__PURE__ */ o.createElement(
-          d,
+        return /* @__PURE__ */ n.createElement(
+          h,
           {
-            value: r,
-            onChange: (t) => {
-              l(t.value, t.syntheticEvent);
-            },
+            value: o,
+            size: r.mobileMode ? "large" : "medium",
+            onChange: l,
             rangeOnEnter: !1
           }
         );
       case "date":
-        return /* @__PURE__ */ o.createElement(
+        return /* @__PURE__ */ n.createElement(
           f,
           {
-            value: r,
-            onChange: (t) => {
-              l(t.value, t.syntheticEvent);
-            }
+            value: o,
+            size: r.mobileMode ? "large" : "medium",
+            onChange: l
           }
         );
       case "boolean": {
-        const t = (a) => a == null;
-        return /* @__PURE__ */ o.createElement(
-          i,
+        const C = (a) => a == null;
+        return /* @__PURE__ */ n.createElement(
+          m,
           {
-            onChange: h,
-            value: c.find((a) => a.operator === (t(r) ? "" : r)),
-            data: c,
+            adaptive: r.adaptive,
+            onChange: u,
+            size: r.mobileMode ? "large" : "medium",
+            value: i.find((a) => a.operator === (C(o) ? "" : o)),
+            data: i,
             textField: "text"
           }
         );
       }
       default:
-        return /* @__PURE__ */ o.createElement(
-          C,
-          {
-            value: r || "",
-            onChange: (t) => {
-              l(t.target.value, t.syntheticEvent);
-            }
-          }
-        );
+        return /* @__PURE__ */ n.createElement(s, { className: "k-input-lg", value: o || "", onChange: l });
     }
   };
-  return /* @__PURE__ */ o.createElement(o.Fragment, null, u(), g(e.filterType, e.value, e.booleanValues));
+  return /* @__PURE__ */ n.createElement(n.Fragment, null, c(), g(e.filterType, e.value, e.booleanValues));
 };
 export {
-  w as GridColumnMenuFilterCell
+  z as GridColumnMenuFilterCell
 };

package/columnMenu/GridColumnMenuFilterUI.js

@@ -6,4 +6,4 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),o=require("./GridColumnMenuFilterCell.js"),s=require("@progress/kendo-react-dropdowns");function d(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const t=d(u),m=e=>{const{firstFilterProps:r,hideSecondFilter:n,secondFilterProps:l,logicData:i,logicValue:a,onLogicChange:c}=e;return t.createElement(t.Fragment,null,t.createElement(o.GridColumnMenuFilterCell,{...r}),!n&&t.createElement(t.Fragment,null,t.createElement(s.DropDownList,{data:i,value:a,onChange:c,className:"k-filter-and",textField:"text"}),t.createElement(o.GridColumnMenuFilterCell,{...l})))};exports.GridColumnMenuFilterUI=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),d=require("./GridColumnMenuFilterCell.js"),m=require("../GridClientWrapper.js"),u=require("@progress/kendo-react-buttons");function g(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(r,n,l.get?l:{enumerable:!0,get:()=>t[n]})}}return r.default=t,Object.freeze(r)}const e=g(s),p=t=>{const{firstFilterProps:r,hideSecondFilter:n,secondFilterProps:l,logicValue:o,onLogicChange:i}=t,c=e.useContext(m.GridContext),a=(o==null?void 0:o.operator)==="and";return e.createElement(e.Fragment,null,e.createElement(d.GridColumnMenuFilterCell,{...r}),!n&&e.createElement(e.Fragment,null,e.createElement(u.ButtonGroup,null,e.createElement(u.Button,{type:"button",value:"and",size:c.mobileMode?"large":"medium",togglable:!0,selected:a,onClick:i},"And"),e.createElement(u.Button,{type:"button",value:"or",size:c.mobileMode?"large":"medium",togglable:!0,selected:!a,onClick:i},"Or")),e.createElement(d.GridColumnMenuFilterCell,{...l})))};exports.GridColumnMenuFilterUI=p;

package/columnMenu/GridColumnMenuFilterUI.mjs

@@ -7,21 +7,35 @@
  */
 "use client";
 import * as e from "react";
-import { GridColumnMenuFilterCell as t } from "./GridColumnMenuFilterCell.mjs";
-import { DropDownList as c } from "@progress/kendo-react-dropdowns";
-const d = (r) => {
-  const { firstFilterProps: l, hideSecondFilter: n, secondFilterProps: o, logicData: a, logicValue: i, onLogicChange: m } = r;
-  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(t, { ...l }), !n && /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-    c,
+import { GridColumnMenuFilterCell as l } from "./GridColumnMenuFilterCell.mjs";
+import { GridContext as d } from "../GridClientWrapper.mjs";
+import { ButtonGroup as s, Button as m } from "@progress/kendo-react-buttons";
+const E = (i) => {
+  const { firstFilterProps: a, hideSecondFilter: c, secondFilterProps: u, logicValue: t, onLogicChange: r } = i, o = e.useContext(d), n = (t == null ? void 0 : t.operator) === "and";
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(l, { ...a }), !c && /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement(
+    m,
     {
-      data: a,
-      value: i,
-      onChange: m,
-      className: "k-filter-and",
-      textField: "text"
-    }
-  ), /* @__PURE__ */ e.createElement(t, { ...o })));
+      type: "button",
+      value: "and",
+      size: o.mobileMode ? "large" : "medium",
+      togglable: !0,
+      selected: n,
+      onClick: r
+    },
+    "And"
+  ), /* @__PURE__ */ e.createElement(
+    m,
+    {
+      type: "button",
+      value: "or",
+      size: o.mobileMode ? "large" : "medium",
+      togglable: !0,
+      selected: !n,
+      onClick: r
+    },
+    "Or"
+  )), /* @__PURE__ */ e.createElement(l, { ...u })));
 };
 export {
-  d as GridColumnMenuFilterUI
+  E as GridColumnMenuFilterUI
 };

package/columnMenu/GridColumnMenuItem.js

@@ -6,4 +6,4 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),o=require("@progress/kendo-react-common");function i(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const c=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,c.get?c:{enumerable:!0,get:()=>t[e]})}}return n.default=t,Object.freeze(n)}const r=i(l),u=t=>{const{title:n,iconClass:e,svgIcon:c,selected:a}=t;return r.createElement("div",{onClick:t.onClick,className:`k-columnmenu-item ${a?"k-selected":""}`},(e||c)&&r.createElement(o.IconWrap,{name:e&&o.toIconName(e),icon:c}),n)};exports.GridColumnMenuItem=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react"),i=require("@progress/kendo-react-common"),f=require("../GridClientWrapper.js"),r=require("@progress/kendo-svg-icons");function I(n){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(t,e,o.get?o:{enumerable:!0,get:()=>n[e]})}}return t.default=n,Object.freeze(t)}const c=I(p),v=n=>{const{title:t,iconClass:e,svgIcon:o,selected:s,expandable:l,expanded:u}=n,{mobileMode:m,dir:d}=c.useContext(f.GridContext);let a;return l&&(m?a=d==="rtl"?r.chevronLeftIcon:r.chevronRightIcon:a=u?r.chevronUpIcon:r.chevronDownIcon),c.createElement("div",{onClick:n.onClick,className:`k-columnmenu-item ${s?"k-selected":""}`},(e||o)&&c.createElement(i.IconWrap,{name:e&&i.toIconName(e),icon:o}),t,c.createElement("span",{className:"k-spacer"}),l&&c.createElement(i.IconWrap,{icon:a}))};exports.GridColumnMenuItem=v;

package/columnMenu/GridColumnMenuItem.mjs

@@ -6,12 +6,15 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as c from "react";
-import { IconWrap as l, toIconName as a } from "@progress/kendo-react-common";
-const r = (t) => {
-  const { title: o, iconClass: e, svgIcon: n, selected: m } = t;
-  return /* @__PURE__ */ c.createElement("div", { onClick: t.onClick, className: `k-columnmenu-item ${m ? "k-selected" : ""}` }, (e || n) && /* @__PURE__ */ c.createElement(l, { name: e && a(e), icon: n }), o);
+import * as e from "react";
+import { IconWrap as m, toIconName as p } from "@progress/kendo-react-common";
+import { GridContext as I } from "../GridClientWrapper.mjs";
+import { chevronLeftIcon as v, chevronRightIcon as f, chevronDownIcon as h, chevronUpIcon as u } from "@progress/kendo-svg-icons";
+const E = (t) => {
+  const { title: i, iconClass: o, svgIcon: c, selected: a, expandable: r, expanded: l } = t, { mobileMode: s, dir: d } = e.useContext(I);
+  let n;
+  return r && (s ? n = d === "rtl" ? v : f : n = l ? u : h), /* @__PURE__ */ e.createElement("div", { onClick: t.onClick, className: `k-columnmenu-item ${a ? "k-selected" : ""}` }, (o || c) && /* @__PURE__ */ e.createElement(m, { name: o && p(o), icon: c }), i, /* @__PURE__ */ e.createElement("span", { className: "k-spacer" }), r && /* @__PURE__ */ e.createElement(m, { icon: n }));
 };
 export {
-  r as GridColumnMenuItem
+  E as GridColumnMenuItem
 };

package/columnMenu/GridColumnMenuWrapper.js

@@ -6,4 +6,4 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("react"),_=require("@progress/kendo-react-popup"),a=require("@progress/kendo-react-common"),j=require("@progress/kendo-svg-icons"),E=require("../messages/index.js"),z=require("@progress/kendo-react-intl");function A(n){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const u in n)if(u!=="default"){const l=Object.getOwnPropertyDescriptor(n,u);Object.defineProperty(c,u,l.get?l:{enumerable:!0,get:()=>n[u]})}}return c.default=n,Object.freeze(c)}const o=A(W),$=[".k-columnmenu-item-content",".k-filter-menu-container"].map(n=>a.TABBABLE_ELEMENTS.map(c=>`${n} ${c}`)),x=[[".k-tabstrip-items"],[".k-columnmenu-item"],...$],F=n=>{const[c,u]=o.useState(!1),l=o.useRef(null),i=o.useRef(null),s=o.useRef(null),m=o.useRef(0),{columnMenu:M,...v}=n,{column:k,columnMenuIcon:d,navigatable:w}=n,p=z.useLocalization(),b=k.title||k.field,y=b?`${b} `:"",C="#",D=e=>{const t=a.getActiveElement(document);clearTimeout(m.current),m.current=window.setTimeout(()=>{t&&e.relatedTarget!==l.current&&i.current&&!i.current.contains(t)&&f()})},S=()=>{clearTimeout(m.current)},T=e=>{e.preventDefault(),c&&n.onCloseMenu&&n.onCloseMenu(),u(!c)},f=()=>{n.onCloseMenu&&n.onCloseMenu(),u(!1),!n.navigatable&&l.current&&l.current.focus()},I=e=>{var t;if(e.keyCode===a.Keys.tab){const r=e.target,h=r&&((t=r.closest(".k-grid"))==null?void 0:t.getElementsByClassName("k-grid-content")[0]);h&&h.scrollWidth>h.clientWidth&&r.scrollIntoView({inline:"center"})}},g=o.useMemo(()=>n.show!==void 0?n.show:c,[n.show,c]),R=e=>{var t;(t=s.current)==null||t.triggerKeyboardEvent(e)},O=e=>{var t;(t=s.current)==null||t.triggerMouseEvent(e)},K=(e,t,r)=>{r.preventDefault(),r.shiftKey?t.focusPrevious(e):t.focusNext(e)},P=(e,t,r)=>{e&&e.click()},q=(e,t,r)=>{r.preventDefault(),f()},B=(e,t,r)=>{t.focusElement(e)},N=e=>{!e.isAnchorClicked&&u(!1)};return o.useEffect(()=>(g&&i.current&&(s.current=new a.Navigation({tabIndex:0,root:i,selectors:x,keyboardEvents:{keydown:{Tab:K,Enter:P,Escape:q}},mouseEvents:{mousedown:B}}),s.current.focusElement(s.current.first,null)),()=>{s.current&&(s.current=null)}),[g]),o.createElement(o.Fragment,null,o.createElement("a",{className:"k-grid-header-menu k-grid-column-menu",ref:l,onClick:T,onKeyDown:I,href:C,tabIndex:w?-1:void 0,"aria-label":`${w?"":y}${p.toLanguageString(E.columnMenu,E.messages[E.columnMenu])}`},d?o.createElement(a.IconWrap,{name:d.name,icon:d}):o.createElement(a.IconWrap,{name:"more-vertical",icon:j.moreVerticalIcon})),o.createElement(_.Popup,{anchor:l.current,show:g,popupClass:"k-column-menu k-column-menu-popup k-grid-columnmenu-popup",onMouseDownOutside:N},o.createElement("div",{ref:i,onBlur:D,onFocus:S,onMouseDown:O,onKeyDown:R,style:{outline:"none"}},M&&o.createElement(M,{...v,onCloseMenu:f}))))};exports.GridColumnMenuWrapper=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),W=require("@progress/kendo-react-popup"),a=require("@progress/kendo-react-common"),B=require("@progress/kendo-svg-icons"),h=require("../messages/index.js"),_=require("@progress/kendo-react-intl"),j=require("../GridClientWrapper.js"),z=require("./adaptiveContext/GridColumnMenuAdaptiveContext.js"),$=require("./adaptiveContent/GridAdaptiveColumnMenu.js");function F(t){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const c in t)if(c!=="default"){const s=Object.getOwnPropertyDescriptor(t,c);Object.defineProperty(u,c,s.get?s:{enumerable:!0,get:()=>t[c]})}}return u.default=t,Object.freeze(u)}const n=F(N),L=[".k-columnmenu-item-content",".k-filter-menu-container"].map(t=>a.TABBABLE_ELEMENTS.map(u=>`${t} ${u}`)),V=[[".k-tabstrip-items"],[".k-columnmenu-item"],...L],H=t=>{const u=n.useContext(j.GridContext),[c,s]=n.useState(!1),i=n.useRef(null),m=n.useRef(null),l=n.useRef(null),M=n.useRef(0),{columnMenu:d,...C}=t,{column:b,columnMenuIcon:E,navigatable:p}=t,w=_.useLocalization(),k=b.title||b.field,y=k?`${k} `:"",D="#",S=e=>{const o=a.getActiveElement(document);clearTimeout(M.current),M.current=window.setTimeout(()=>{!u.mobileMode&&o&&e.relatedTarget!==i.current&&m.current&&!m.current.contains(o)&&f()})},T=()=>{clearTimeout(M.current)},q=e=>{e.preventDefault(),c&&t.onCloseMenu&&t.onCloseMenu(),s(!c)},f=()=>{t.onCloseMenu&&t.onCloseMenu(),s(!1),!t.navigatable&&i.current&&i.current.focus()},A=e=>{var o;if(e.keyCode===a.Keys.tab){const r=e.target,v=r&&((o=r.closest(".k-grid"))==null?void 0:o.getElementsByClassName("k-grid-content")[0]);v&&v.scrollWidth>v.clientWidth&&r.scrollIntoView({inline:"center"})}},g=n.useMemo(()=>t.show!==void 0?t.show:c,[t.show,c]),I=e=>{var o;(o=l.current)==null||o.triggerKeyboardEvent(e)},R=e=>{var o;(o=l.current)==null||o.triggerMouseEvent(e)},x=(e,o,r)=>{r.preventDefault(),r.shiftKey?o.focusPrevious(e):o.focusNext(e)},G=(e,o,r)=>{e&&(r.preventDefault(),e.click())},O=(e,o,r)=>{r.preventDefault(),f()},P=(e,o,r)=>{o.focusElement(e)},K=e=>{!e.isAnchorClicked&&s(!1)};return n.useEffect(()=>(g&&m.current&&(l.current=new a.Navigation({tabIndex:0,root:m,selectors:V,keyboardEvents:{keydown:{Tab:x,Enter:G,Escape:O}},mouseEvents:{mousedown:P}}),l.current.focusElement(l.current.first,null)),()=>{l.current&&(l.current=null)}),[g]),n.createElement(n.Fragment,null,n.createElement("a",{className:"k-grid-header-menu k-grid-column-menu",ref:i,onClick:q,onKeyDown:A,href:D,tabIndex:p?-1:void 0,"aria-label":`${p?"":y}${w.toLanguageString(h.columnMenu,h.messages[h.columnMenu])}`},E?n.createElement(a.IconWrap,{name:E.name,icon:E}):n.createElement(a.IconWrap,{name:"more-vertical",icon:B.moreVerticalIcon})),n.createElement(z.GridColumnMenuAdaptiveProvider,null,u.mobileMode?n.createElement($.GridAdaptiveColumnMenu,{computedShow:g,ColumnMenu:d,closeMenu:f},d&&n.createElement(d,{...C,onCloseMenu:f})):n.createElement(W.Popup,{anchor:i.current,show:g,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:K},n.createElement("div",{ref:m,onBlur:S,onFocus:T,onMouseDown:R,onKeyDown:I,className:"k-column-menu k-column-menu-md"},d&&n.createElement(d,{...C,onCloseMenu:f})))))};exports.GridColumnMenuWrapper=H;