@progress/kendo-react-grid 11.0.0-develop.9 → 11.0.0

package/rows/GridRow.mjs

@@ -6,62 +6,61 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as n from "react";
-import { useUnstyled as h, uGrid as v, classNames as C, useDroppable as T } from "@progress/kendo-react-common";
+import * as a from "react";
+import { useUnstyled as b, uGrid as h, classNames as C, useDroppable as T } from "@progress/kendo-react-common";
 import { GRID_ROW_INDEX_ATTRIBUTE as k } from "../constants/index.mjs";
-import { GridContext as E } from "../GridClientWrapper.mjs";
-const N = (e) => {
-  var R;
-  const a = n.useContext(E), {
-    reorderRowDropTargetRef: g,
+import { GridContext as v } from "../utils/GridContext.mjs";
+const F = (e) => {
+  var u;
+  const n = a.useContext(v), {
+    reorderRowDropTargetRef: w,
     reorderRowDragTargetRef: r,
-    activeDragRowDataItemRef: m
-  } = a, { rowType: o, isAltRow: D, isInEdit: f, isSelected: I } = e, i = h(), x = i && i.uGrid ? i.uGrid : v, y = C(
-    x.tr({
-      selected: I,
+    activeDragRowDataItemRef: R
+  } = n, { rowType: o, isAltRow: g, isInEdit: m, isSelected: D } = e, i = b(), f = i && i.uGrid ? i.uGrid : h, I = C(
+    f.tr({
+      selected: D,
       isHeader: o === "groupHeader",
       isFooter: o === "groupFooter",
       isMaster: o !== "groupHeader" && o !== "groupFooter",
-      isAltRow: D,
-      isInEdit: f
+      isAltRow: g,
+      isInEdit: m
     })
-  ), l = n.useRef(null);
-  T(l, {
+  ), c = a.useRef(null);
+  T(c, {
     onDragOver: (t) => {
-      if (e.isRowReorderable && m.current) {
-        const b = t.originalEvent.target;
-        g.current = b.closest(".k-table-row");
+      if (e.isRowReorderable && R.current) {
+        const y = t.originalEvent.target;
+        w.current = y.closest(".k-table-row");
       }
     },
     onDrop: () => {
       r.current && e.isRowReorderable && (r.current.style.userSelect = "");
     }
   });
-  const c = {
-    onClick: (t) => a.rowClick(t, e.dataItem),
-    onDoubleClick: (t) => a.rowDblClick(t, e.dataItem)
-  }, s = {
-    ref: l,
+  const x = {
+    onClick: (t) => n.rowClick(t, e.dataItem),
+    onDoubleClick: (t) => n.rowDblClick(t, e.dataItem)
+  }, l = {
+    ref: c,
     id: e.id,
-    ...c,
-    className: y,
+    ...x,
+    className: I,
     style: {
       height: e.rowHeight ? e.rowHeight + "px" : "",
       visibility: e.isHidden ? "hidden" : "",
-      userSelect: (R = r == null ? void 0 : r.current) == null ? void 0 : R.style.userSelect
+      userSelect: (u = r == null ? void 0 : r.current) == null ? void 0 : u.style.userSelect
     },
     role: "row",
     "aria-rowindex": e.ariaRowIndex,
     "absolute-row-index": e.absoluteRowIndex,
     [k]: e.rowType === "data" ? e.dataIndex : void 0
-  }, u = e.rowType || "data", d = e.rows;
-  if (d && d[u]) {
-    const t = d[u];
-    return /* @__PURE__ */ n.createElement(t, { key: e.absoluteRowIndex, ...e, trProps: s }, e.children);
+  }, s = e.rowType || "data", d = e.rows;
+  if (d && d[s]) {
+    const t = d[s];
+    return /* @__PURE__ */ a.createElement(t, { key: e.absoluteRowIndex, ...e, trProps: l }, e.children);
   }
-  const w = /* @__PURE__ */ n.createElement("tr", { key: e.absoluteRowIndex, ...s }, e.children);
-  return e.render ? e.render.call(void 0, w, { ...e, ...c }) : w;
+  return /* @__PURE__ */ a.createElement("tr", { key: e.absoluteRowIndex, ...l }, e.children);
 };
 export {
-  N as GridRow
+  F as GridRow
 };

package/toolbar-tools/GridToolbarCheckboxFilter.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const qe=require("react"),ye=require("react-dom"),E=require("@progress/kendo-react-common"),De=require("../columnMenu/GridColumnMenuItem.js"),we=require("../columnMenu/GridColumnMenuItemContent.js"),Ne=require("../columnMenu/GridColumnMenuItemGroup.js"),Ae=require("../utils/GridContext.js"),F=require("@progress/kendo-svg-icons"),ce=require("@progress/kendo-data-query"),B=require("@progress/kendo-react-buttons"),V=require("@progress/kendo-react-inputs"),o=require("../messages/index.js"),Ge=require("@progress/kendo-react-intl"),se=require("../utils/index.js"),Oe=require("../columnMenu/GridColumnMenuCheckboxFilter.js"),Te=require("./adaptiveContent/GridAdaptiveToolbarCheckboxFilter.js"),Pe=require("@progress/kendo-react-popup"),ue=require("@progress/kendo-react-indicators"),Le=require("./adaptiveContext/GridToolbarAdaptiveContext.js");function Ve(l){const m=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const k in l)if(k!=="default"){const v=Object.getOwnPropertyDescriptor(l,k);Object.defineProperty(m,k,v.get?v:{enumerable:!0,get:()=>l[k]})}}return m.default=l,Object.freeze(m)}const n=Ve(qe),je={uniqueData:!0},de=l=>{var oe,ie;const{uniqueData:m=je.uniqueData,svgIcon:k,icon:v}=l,c=n.useContext(Ae.GridContext),C=c.columnsRef,M=c.defaultFilter,[D,I]=n.useState(!1),x=n.useRef(null),w=n.useRef(null),j=n.useRef(null),N=n.useRef(0),g=Ge.useLocalization(),i=n.useRef(null),fe=E.useDocument(x),A=()=>M?E.clone(M):{filters:[],logic:"and"},me=()=>{var r;const e=(r=i==null?void 0:i.current)==null?void 0:r.field;return A().filters.findIndex(u=>u.filters&&u.filters.length>0&&u.filters[0].field===e)},b=(e,t)=>{var u;const a=((u=i==null?void 0:i.current)==null?void 0:u.field)||"",r=e.map(d=>se.getNestedValue(a,d));return t?r.filter((d,y)=>r.indexOf(d)===y):r},s=n.useRef(me()),[ge,S]=n.useState(!1),[h,z]=n.useState((C==null?void 0:C.map(e=>({column:e,expanded:!1})))||[]),[K,_]=n.useState(""),[q,p]=n.useState(b(l.data,m)||[]),[R,$]=n.useState(b(l.data,!1)||[]),[f,H]=n.useState(A()),[he,Q]=n.useState(!1),ke=g.toLanguageString(o.filterClearButton,o.messages[o.filterClearButton]),W=n.useMemo(()=>(C==null?void 0:C.filter(e=>{var t;return(t=e.title||e.field)==null?void 0:t.toLowerCase()}))||[],[C]);n.useEffect(()=>{M&&S(!0)},[M]),n.useEffect(()=>{var a;const e=((a=i==null?void 0:i.current)==null?void 0:a.field)||"",t=l.data.map(r=>se.getNestedValue(e,r));Oe.isArrayEqual(t,R)||(p(t),$(t))},[R,l.data]),n.useEffect(()=>{h.find(e=>e.expanded)&&p(b(l.data,m)||[])},[h,l.data,m]);const J=n.useCallback(e=>{const t=f.filters.some(a=>a.field===e.field);return n.createElement(n.Fragment,null,e.title||e.field,t&&n.createElement("span",{className:"k-columnmenu-indicators"},n.createElement(E.SvgIcon,{key:1,icon:F.filterIcon})))},[f]),U=n.useCallback((e,t)=>{z(a=>(i.current=t,a.map(r=>r.column.field===t.field?{...r,expanded:!r.expanded}:{...r,expanded:!1}))),p(b(l.data,m)||[]),$(b(l.data,m)||[]),Q(!he)},[]),X=e=>{var r;const t=l.searchBoxFilterOperator?l.searchBoxFilterOperator:"startswith",a={logic:"and",filters:[{field:(r=i==null?void 0:i.current)==null?void 0:r.field,operator:t,value:e.target.value,ignoreCase:!0}]};_(e.target.value),p(b(ce.filterBy(l.data||[],a),m))},Ce=()=>{var a;const e=l.searchBoxFilterOperator?l.searchBoxFilterOperator:"startswith",t={logic:"and",filters:[{field:(a=i==null?void 0:i.current)==null?void 0:a.field,operator:e,value:"",ignoreCase:!0}]};_(""),p(b(ce.filterBy(l.data||[],t),m))},Y=()=>{let e=!1;if(f){const t=[...f.filters];return s.current===-1?!1:(e=q.every(a=>s.current!==-1&&t[s.current].filters?t[s.current].filters.findIndex(u=>u.value===a)>=0:!1),e)}return e},G=(e,t)=>{var y;const a=((y=i==null?void 0:i.current)==null?void 0:y.field)||"",r={...f},u=[...f.filters];let d=[];if(s.current!==-1&&r.filters[s.current].filters&&t!=="all"&&(d=r.filters[s.current].filters),e.value&&t==="all")q.forEach(L=>{d.push({field:a,operator:"eq",value:L})});else if(e.value)d.push({field:a,operator:"eq",value:t});else if(f){const L=d.findIndex(Se=>Se.value===t);d.splice(L,1)}r.logic="and",s.current!==-1?u[s.current]={logic:"or",filters:d}:u.push({logic:"or",filters:d}),(!e.value&&t==="all"||d.length===0)&&u.splice(s.current,1),r.filters=u,H(r)},O=[];if(f){const e=[...f.filters];s.current=e.findIndex(t=>{var a;return t.filters&&t.filters.length>0?t.filters[0].field===((a=i==null?void 0:i.current)==null?void 0:a.field):!1}),s.current!==-1&&e[s.current].filters.length>0&&e[s.current].filters.forEach(t=>{var a;t.field===((a=i==null?void 0:i.current)==null?void 0:a.field)&&O.push(t.value)})}const T=O.filter((e,t)=>O.indexOf(e)===t),Z=e=>{if(e.preventDefault(),!c.filterChange)return;const t=f||null;t!==null&&t.filters.length>0?(s.current>=0&&t.filters.splice(s.current,1),c.filterChange(t,e)):c.filterChange(null,e),l.onCloseMenu&&l.onCloseMenu(),S(!1)},ee=e=>{if(e.preventDefault(),!c.filterChange)return;const t=f||null;c.filterChange(t,e),l.onCloseMenu&&l.onCloseMenu(),S(!0),I(!1)},te=l.searchBox?n.createElement(l.searchBox,{value:K,onChange:X}):n.createElement("div",{className:`k-searchbox k-textbox k-input k-input-solid ${c!=null&&c.mobileMode?"k-input-lg":"k-input-md"}`},n.createElement(E.IconWrap,{className:"k-input-icon",name:"search",icon:F.searchIcon}),n.createElement(V.Input,{className:"k-input-inner",type:"text",placeholder:g.toLanguageString(o.searchPlaceholder,o.messages[o.searchPlaceholder]),value:K,onChange:e=>X(e.nativeEvent)}),n.createElement(B.Button,{type:"button",rounded:null,className:"k-input-button",onClick:Ce,icon:"x","aria-label":ke,svgIcon:F.xIcon})),be=()=>{Q(!1)},Ee=e=>{e.preventDefault(),I(!D)},xe=e=>{!e.isAnchorClicked&&I(!1)},P=n.useMemo(()=>l.show!==void 0?l.show:D,[l.show,D]),ve=e=>{const t=E.getActiveElement(document);clearTimeout(N.current),N.current=window.setTimeout(()=>{!c.mobileMode&&t&&e.relatedTarget!==x.current&&w.current&&!w.current.contains(t)&&ne()})},ne=()=>{var e;l.onCloseMenu&&l.onCloseMenu(),I(!1),x.current&&((e=x.current.element)==null||e.focus())},pe=()=>{clearTimeout(N.current)},{onFocus:Fe,onBlur:Be}=E.useAsyncFocusBlur({onFocus:e=>pe(),onBlur:e=>ve(e)}),Me=e=>{var t;(t=j.current)==null||t.triggerMouseEvent(e)},Ie=e=>{var t;(t=j.current)==null||t.triggerKeyboardEvent(e)},re=e=>{if(e.preventDefault(),!c.filterChange)return;const t=f||null;t!==null&&t.filters.length>0?(t.filters=[],c.filterChange(t,e)):c.filterChange(null,e),H(A()),S(!1),z(a=>a.map(r=>({...r,expanded:!1})))},le=n.createElement(B.Button,{ref:x,togglable:!0,selected:P,svgIcon:k||(v?void 0:F.filterIcon),icon:v,size:c.mobileMode?"large":"medium",className:E.classNames("k-toolbar-button",{"k-icon-button":c.mobileMode}),title:g.toLanguageString(o.toolbarCheckboxFilter,o.messages[o.toolbarCheckboxFilter]),onClick:Ee},!c.mobileMode&&g.toLanguageString(o.toolbarCheckboxFilter,o.messages[o.toolbarCheckboxFilter])),ae=n.createElement(n.Fragment,null,W.map(e=>{var t,a;return e.filterable&&n.createElement(Ne.GridColumnMenuItemGroup,{key:e.id},n.createElement("div",{className:"k-expander"},n.createElement(De.GridColumnMenuItem,{title:J(e),expandable:!0,expanded:!!((t=h==null?void 0:h.find(r=>r.column.field===e.field))!=null&&t.expanded),onClick:r=>U(r,e)})),n.createElement(we.GridColumnMenuItemContent,{show:!!((a=h==null?void 0:h.find(r=>r.column.field===e.field))!=null&&a.expanded)},n.createElement("form",{className:"k-filter-menu",onSubmit:ee,onReset:Z},n.createElement("div",{className:"k-filter-menu-container"},te,n.createElement("ul",{className:"k-multicheck-wrap"},n.createElement("li",{className:"k-item k-check-all-wrap"},n.createElement(V.Checkbox,{label:g.toLanguageString(o.filterCheckAll,o.messages[o.filterCheckAll]),onChange:r=>G(r,"all"),checked:Y()})),q.map((r,u)=>n.createElement("li",{className:"k-item",key:u},n.createElement(V.Checkbox,{label:String(r),onChange:d=>G(d,r),checked:T.includes(r)})))),n.createElement("div",{className:"k-filter-selected-items"},T.length+" "+g.toLanguageString(o.filterSelectedItems,o.messages[o.filterSelectedItems])),n.createElement("div",{className:"k-actions k-hstack k-justify-content-stretch"},n.createElement(B.Button,{themeColor:"primary",type:"submit"},g.toLanguageString(o.filterSubmitButton,o.messages[o.filterSubmitButton])),n.createElement(B.Button,{className:"k-button",type:"reset"},g.toLanguageString(o.filterClearButton,o.messages[o.filterClearButton])))))))}),n.createElement("div",{className:"k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer"},n.createElement(B.Button,{svgIcon:F.filterClearIcon,onClick:re},g.toLanguageString(o.filterClearAllButton,o.messages[o.filterClearAllButton]))));return n.createElement(n.Fragment,null,ge?n.createElement(ue.BadgeContainer,null,le,n.createElement(ue.Badge,{themeColor:"primary"})):le,c.mobileMode?n.createElement(Le.GridToolbarAdaptiveProvider,null,ye.createPortal(n.createElement(Te.GridAdaptiveToolbarCheckboxFilter,{filtered:W,computedShow:P,expandState:h,currentData:q,uniqueFilterValues:T,searchBox:te,renderTitle:J,onBackView:be,isAllSelected:Y,handleCheckBoxChange:G,clear:Z,submit:ee,onClose:ne,onFilterExpand:U,handleClearAllFilters:re},ae),(oe=fe())==null?void 0:oe.body)):n.createElement(Pe.Popup,{anchor:(ie=x.current)==null?void 0:ie.element,show:P,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:xe},n.createElement("div",{ref:w,onBlur:Be,onFocus:Fe,onMouseDown:Me,onKeyDown:Ie,className:"k-column-menu k-column-menu-md"},ae)))};de.displayName="KendoReactGridToolbarCheckboxFilter";exports.GridToolbarCheckboxFilter=de;

package/toolbar-tools/GridToolbarCheckboxFilter.mjs

@@ -0,0 +1,312 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import * as r from "react";
+import Ae from "react-dom";
+import { useDocument as Le, SvgIcon as Oe, IconWrap as Te, useAsyncFocusBlur as Ge, classNames as Pe, clone as Ve, getActiveElement as qe } from "@progress/kendo-react-common";
+import { GridColumnMenuItem as ze } from "../columnMenu/GridColumnMenuItem.mjs";
+import { GridColumnMenuItemContent as Ke } from "../columnMenu/GridColumnMenuItemContent.mjs";
+import { GridColumnMenuItemGroup as je } from "../columnMenu/GridColumnMenuItemGroup.mjs";
+import { GridContext as He } from "../utils/GridContext.mjs";
+import { filterIcon as ie, searchIcon as We, xIcon as _e, filterClearIcon as $e } from "@progress/kendo-svg-icons";
+import { filterBy as ce } from "@progress/kendo-data-query";
+import { Button as b } from "@progress/kendo-react-buttons";
+import { Input as Je, Checkbox as se } from "@progress/kendo-react-inputs";
+import { filterClearButton as B, messages as g, searchPlaceholder as ue, toolbarCheckboxFilter as D, filterCheckAll as fe, filterSelectedItems as me, filterSubmitButton as de, filterClearAllButton as ge } from "../messages/index.mjs";
+import { useLocalization as Qe } from "@progress/kendo-react-intl";
+import { getNestedValue as he } from "../utils/index.mjs";
+import { isArrayEqual as Ue } from "../columnMenu/GridColumnMenuCheckboxFilter.mjs";
+import { GridAdaptiveToolbarCheckboxFilter as Xe } from "./adaptiveContent/GridAdaptiveToolbarCheckboxFilter.mjs";
+import { Popup as Ye } from "@progress/kendo-react-popup";
+import { BadgeContainer as Ze, Badge as Re } from "@progress/kendo-react-indicators";
+import { GridToolbarAdaptiveProvider as et } from "./adaptiveContext/GridToolbarAdaptiveContext.mjs";
+const tt = {
+  uniqueData: !0
+}, rt = (a) => {
+  var ae, oe;
+  const { uniqueData: h = tt.uniqueData, svgIcon: P, icon: V } = a, i = r.useContext(He), k = i.columnsRef, v = i.defaultFilter, [S, x] = r.useState(!1), p = r.useRef(null), I = r.useRef(null), q = r.useRef(null), N = r.useRef(0), m = Qe(), o = r.useRef(null), ke = Le(p), y = () => v ? Ve(v) : { filters: [], logic: "and" }, Ee = () => {
+    var n;
+    const e = (n = o == null ? void 0 : o.current) == null ? void 0 : n.field;
+    return y().filters.findIndex(
+      (s) => s.filters && s.filters.length > 0 && s.filters[0].field === e
+    );
+  }, E = (e, t) => {
+    var s;
+    const l = ((s = o == null ? void 0 : o.current) == null ? void 0 : s.field) || "", n = e.map((u) => he(l, u));
+    return t ? n.filter((u, w) => n.indexOf(u) === w) : n;
+  }, c = r.useRef(Ee()), [pe, F] = r.useState(!1), [d, z] = r.useState(
+    (k == null ? void 0 : k.map((e) => ({ column: e, expanded: !1 }))) || []
+  ), [K, j] = r.useState(""), [M, C] = r.useState(E(a.data, h) || []), [H, W] = r.useState(E(a.data, !1) || []), [f, _] = r.useState(y()), [Ce, $] = r.useState(!1), be = m.toLanguageString(B, g[B]), J = r.useMemo(
+    () => (k == null ? void 0 : k.filter((e) => {
+      var t;
+      return (t = e.title || e.field) == null ? void 0 : t.toLowerCase();
+    })) || [],
+    [k]
+  );
+  r.useEffect(() => {
+    v && F(!0);
+  }, [v]), r.useEffect(() => {
+    var l;
+    const e = ((l = o == null ? void 0 : o.current) == null ? void 0 : l.field) || "", t = a.data.map((n) => he(e, n));
+    Ue(t, H) || (C(t), W(t));
+  }, [H, a.data]), r.useEffect(() => {
+    d.find((e) => e.expanded) && C(E(a.data, h) || []);
+  }, [d, a.data, h]);
+  const Q = r.useCallback(
+    (e) => {
+      const t = f.filters.some((l) => l.field === e.field);
+      return /* @__PURE__ */ r.createElement(r.Fragment, null, e.title || e.field, t && /* @__PURE__ */ r.createElement("span", { className: "k-columnmenu-indicators" }, /* @__PURE__ */ r.createElement(Oe, { key: 1, icon: ie })));
+    },
+    [f]
+  ), U = r.useCallback((e, t) => {
+    z((l) => (o.current = t, l.map((n) => n.column.field === t.field ? { ...n, expanded: !n.expanded } : { ...n, expanded: !1 }))), C(E(a.data, h) || []), W(E(a.data, h) || []), $(!Ce);
+  }, []), X = (e) => {
+    var n;
+    const t = a.searchBoxFilterOperator ? a.searchBoxFilterOperator : "startswith", l = {
+      logic: "and",
+      filters: [
+        {
+          field: (n = o == null ? void 0 : o.current) == null ? void 0 : n.field,
+          operator: t,
+          value: e.target.value,
+          ignoreCase: !0
+        }
+      ]
+    };
+    j(e.target.value), C(E(ce(a.data || [], l), h));
+  }, ve = () => {
+    var l;
+    const e = a.searchBoxFilterOperator ? a.searchBoxFilterOperator : "startswith", t = {
+      logic: "and",
+      filters: [
+        { field: (l = o == null ? void 0 : o.current) == null ? void 0 : l.field, operator: e, value: "", ignoreCase: !0 }
+      ]
+    };
+    j(""), C(E(ce(a.data || [], t), h));
+  }, Y = () => {
+    let e = !1;
+    if (f) {
+      const t = [...f.filters];
+      return c.current === -1 ? !1 : (e = M.every((l) => c.current !== -1 && t[c.current].filters ? t[c.current].filters.findIndex(
+        (s) => s.value === l
+      ) >= 0 : !1), e);
+    }
+    return e;
+  }, A = (e, t) => {
+    var w;
+    const l = ((w = o == null ? void 0 : o.current) == null ? void 0 : w.field) || "", n = { ...f }, s = [...f.filters];
+    let u = [];
+    if (c.current !== -1 && n.filters[c.current].filters && t !== "all" && (u = n.filters[c.current].filters), e.value && t === "all")
+      M.forEach((G) => {
+        u.push({ field: l, operator: "eq", value: G });
+      });
+    else if (e.value)
+      u.push({ field: l, operator: "eq", value: t });
+    else if (f) {
+      const G = u.findIndex((ye) => ye.value === t);
+      u.splice(G, 1);
+    }
+    n.logic = "and", c.current !== -1 ? s[c.current] = {
+      logic: "or",
+      filters: u
+    } : s.push({
+      logic: "or",
+      filters: u
+    }), (!e.value && t === "all" || u.length === 0) && s.splice(c.current, 1), n.filters = s, _(n);
+  }, L = [];
+  if (f) {
+    const e = [...f.filters];
+    c.current = e.findIndex((t) => {
+      var l;
+      return t.filters && t.filters.length > 0 ? t.filters[0].field === ((l = o == null ? void 0 : o.current) == null ? void 0 : l.field) : !1;
+    }), c.current !== -1 && e[c.current].filters.length > 0 && e[c.current].filters.forEach((t) => {
+      var l;
+      t.field === ((l = o == null ? void 0 : o.current) == null ? void 0 : l.field) && L.push(t.value);
+    });
+  }
+  const O = L.filter((e, t) => L.indexOf(e) === t), Z = (e) => {
+    if (e.preventDefault(), !i.filterChange)
+      return;
+    const t = f || null;
+    t !== null && t.filters.length > 0 ? (c.current >= 0 && t.filters.splice(c.current, 1), i.filterChange(t, e)) : i.filterChange(null, e), a.onCloseMenu && a.onCloseMenu(), F(!1);
+  }, R = (e) => {
+    if (e.preventDefault(), !i.filterChange)
+      return;
+    const t = f || null;
+    i.filterChange(t, e), a.onCloseMenu && a.onCloseMenu(), F(!0), x(!1);
+  }, ee = a.searchBox ? /* @__PURE__ */ r.createElement(a.searchBox, { value: K, onChange: X }) : /* @__PURE__ */ r.createElement(
+    "div",
+    {
+      className: `k-searchbox k-textbox k-input k-input-solid ${i != null && i.mobileMode ? "k-input-lg" : "k-input-md"}`
+    },
+    /* @__PURE__ */ r.createElement(Te, { className: "k-input-icon", name: "search", icon: We }),
+    /* @__PURE__ */ r.createElement(
+      Je,
+      {
+        className: "k-input-inner",
+        type: "text",
+        placeholder: m.toLanguageString(ue, g[ue]),
+        value: K,
+        onChange: (e) => X(e.nativeEvent)
+      }
+    ),
+    /* @__PURE__ */ r.createElement(
+      b,
+      {
+        type: "button",
+        rounded: null,
+        className: "k-input-button",
+        onClick: ve,
+        icon: "x",
+        "aria-label": be,
+        svgIcon: _e
+      }
+    )
+  ), xe = () => {
+    $(!1);
+  }, Fe = (e) => {
+    e.preventDefault(), x(!S);
+  }, Me = (e) => {
+    !e.isAnchorClicked && x(!1);
+  }, T = r.useMemo(() => a.show !== void 0 ? a.show : S, [a.show, S]), we = (e) => {
+    const t = qe(document);
+    clearTimeout(N.current), N.current = window.setTimeout(() => {
+      !i.mobileMode && t && e.relatedTarget !== p.current && I.current && !I.current.contains(t) && te();
+    });
+  }, te = () => {
+    var e;
+    a.onCloseMenu && a.onCloseMenu(), x(!1), p.current && ((e = p.current.element) == null || e.focus());
+  }, Be = () => {
+    clearTimeout(N.current);
+  }, { onFocus: De, onBlur: Se } = Ge({
+    onFocus: (e) => Be(),
+    onBlur: (e) => we(e)
+  }), Ie = (e) => {
+    var t;
+    (t = q.current) == null || t.triggerMouseEvent(e);
+  }, Ne = (e) => {
+    var t;
+    (t = q.current) == null || t.triggerKeyboardEvent(e);
+  }, re = (e) => {
+    if (e.preventDefault(), !i.filterChange)
+      return;
+    const t = f || null;
+    t !== null && t.filters.length > 0 ? (t.filters = [], i.filterChange(t, e)) : i.filterChange(null, e), _(y()), F(!1), z(
+      (l) => l.map((n) => ({
+        ...n,
+        expanded: !1
+      }))
+    );
+  }, ne = /* @__PURE__ */ r.createElement(
+    b,
+    {
+      ref: p,
+      togglable: !0,
+      selected: T,
+      svgIcon: P || (V ? void 0 : ie),
+      icon: V,
+      size: i.mobileMode ? "large" : "medium",
+      className: Pe("k-toolbar-button", {
+        "k-icon-button": i.mobileMode
+      }),
+      title: m.toLanguageString(D, g[D]),
+      onClick: Fe
+    },
+    !i.mobileMode && m.toLanguageString(D, g[D])
+  ), le = /* @__PURE__ */ r.createElement(r.Fragment, null, J.map((e) => {
+    var t, l;
+    return e.filterable && /* @__PURE__ */ r.createElement(je, { key: e.id }, /* @__PURE__ */ r.createElement("div", { className: "k-expander" }, /* @__PURE__ */ r.createElement(
+      ze,
+      {
+        title: Q(e),
+        expandable: !0,
+        expanded: !!((t = d == null ? void 0 : d.find((n) => n.column.field === e.field)) != null && t.expanded),
+        onClick: (n) => U(n, e)
+      }
+    )), /* @__PURE__ */ r.createElement(
+      Ke,
+      {
+        show: !!((l = d == null ? void 0 : d.find((n) => n.column.field === e.field)) != null && l.expanded)
+      },
+      /* @__PURE__ */ r.createElement("form", { className: "k-filter-menu", onSubmit: R, onReset: Z }, /* @__PURE__ */ r.createElement("div", { className: "k-filter-menu-container" }, ee, /* @__PURE__ */ r.createElement("ul", { className: "k-multicheck-wrap" }, /* @__PURE__ */ r.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ r.createElement(
+        se,
+        {
+          label: m.toLanguageString(
+            fe,
+            g[fe]
+          ),
+          onChange: (n) => A(n, "all"),
+          checked: Y()
+        }
+      )), M.map((n, s) => /* @__PURE__ */ r.createElement("li", { className: "k-item", key: s }, /* @__PURE__ */ r.createElement(
+        se,
+        {
+          label: String(n),
+          onChange: (u) => A(u, n),
+          checked: O.includes(n)
+        }
+      )))), /* @__PURE__ */ r.createElement("div", { className: "k-filter-selected-items" }, O.length + " " + m.toLanguageString(
+        me,
+        g[me]
+      )), /* @__PURE__ */ r.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ r.createElement(b, { themeColor: "primary", type: "submit" }, m.toLanguageString(
+        de,
+        g[de]
+      )), /* @__PURE__ */ r.createElement(b, { className: "k-button", type: "reset" }, m.toLanguageString(
+        B,
+        g[B]
+      )))))
+    ));
+  }), /* @__PURE__ */ r.createElement("div", { className: "k-actions k-actions-stretched k-actions-horizontal k-column-menu-footer" }, /* @__PURE__ */ r.createElement(b, { svgIcon: $e, onClick: re }, m.toLanguageString(ge, g[ge]))));
+  return /* @__PURE__ */ r.createElement(r.Fragment, null, pe ? /* @__PURE__ */ r.createElement(Ze, null, ne, /* @__PURE__ */ r.createElement(Re, { themeColor: "primary" })) : ne, i.mobileMode ? /* @__PURE__ */ r.createElement(et, null, Ae.createPortal(
+    /* @__PURE__ */ r.createElement(
+      Xe,
+      {
+        filtered: J,
+        computedShow: T,
+        expandState: d,
+        currentData: M,
+        uniqueFilterValues: O,
+        searchBox: ee,
+        renderTitle: Q,
+        onBackView: xe,
+        isAllSelected: Y,
+        handleCheckBoxChange: A,
+        clear: Z,
+        submit: R,
+        onClose: te,
+        onFilterExpand: U,
+        handleClearAllFilters: re
+      },
+      le
+    ),
+    (ae = ke()) == null ? void 0 : ae.body
+  )) : /* @__PURE__ */ r.createElement(
+    Ye,
+    {
+      anchor: (oe = p.current) == null ? void 0 : oe.element,
+      show: T,
+      popupClass: "k-grid-columnmenu-popup",
+      onMouseDownOutside: Me
+    },
+    /* @__PURE__ */ r.createElement(
+      "div",
+      {
+        ref: I,
+        onBlur: Se,
+        onFocus: De,
+        onMouseDown: Ie,
+        onKeyDown: Ne,
+        className: "k-column-menu k-column-menu-md"
+      },
+      le
+    )
+  ));
+};
+rt.displayName = "KendoReactGridToolbarCheckboxFilter";
+export {
+  rt as GridToolbarCheckboxFilter
+};

package/toolbar-tools/GridToolbarColumnsChooser.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const te=require("react"),oe=require("react-dom"),y=require("@progress/kendo-react-buttons"),h=require("@progress/kendo-react-common"),b=require("@progress/kendo-react-inputs"),F=require("@progress/kendo-svg-icons"),ne=require("../columnMenu/GridColumnMenuItemContent.js"),n=require("../messages/index.js"),le=require("../utils/GridContext.js"),re=require("@progress/kendo-react-intl"),se=require("./adaptiveContent/GridAdaptiveToolbarColumnChooser.js"),ce=require("@progress/kendo-react-popup"),K=require("@progress/kendo-react-indicators"),ae=require("./adaptiveContext/GridToolbarAdaptiveContext.js");function ue(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const r in l)if(r!=="default"){const u=Object.getOwnPropertyDescriptor(l,r);Object.defineProperty(s,r,u.get?u:{enumerable:!0,get:()=>l[r]})}}return s.default=l,Object.freeze(s)}const t=ue(te),_=l=>{var L,P;const s=t.useContext(le.GridContext),r=s.columnsState,u=s.onColumnsStateChange,[k,f]=t.useState(!1),[d,V]=t.useState(""),[H,S]=t.useState(!1),B=r.reduce((e,o)=>({...e,[o.id||""]:!o.hidden}),{}),[c,p]=t.useState(B),i=t.useRef(null),v=t.useRef(null),R=t.useRef(null),M=t.useRef(0),m=re.useLocalization(),W=h.useDocument(i),A=t.useMemo(()=>(r==null?void 0:r.filter(e=>{var o;return(o=e.title||e.field)==null?void 0:o.toLowerCase().includes(d.toLowerCase())}))||[],[r,d]),g=t.useMemo(()=>Object.values(c).filter(e=>e).length,[c]),C=t.useMemo(()=>g===(r==null?void 0:r.length),[r,g]),I=t.useCallback(e=>{var z;e.preventDefault();const a=(w=>(w==null?void 0:w.map(j=>({...j,hidden:!c[j.id||""]})))||[])(r);u&&u(a),(z=l.onCloseMenu)==null||z.call(void 0),f(!1)},[r,u,l.onCloseMenu,c]),T=e=>{e.preventDefault(),p(B),S(!1)},q=t.useCallback(()=>{const e={...c};Object.keys(e).forEach((o,a)=>e[o]=C&&a===0?!0:!C),p(e),S(!0)},[c,C]),D=t.useCallback((e,o)=>{const a={...c};a[o||""]=e,p(a),S(!0)},[c]),x=e=>{V(String(e.target.value))},J=e=>{e.preventDefault(),f(!k)},E=t.useMemo(()=>l.show!==void 0?l.show:k,[l.show,k]),N=()=>{var e;l.onCloseMenu&&l.onCloseMenu(),f(!1),i.current&&((e=i.current.element)==null||e.focus())},Q=e=>{const o=h.getActiveElement(document);clearTimeout(M.current),M.current=window.setTimeout(()=>{!s.mobileMode&&o&&e.relatedTarget!==i.current&&v.current&&!v.current.contains(o)&&N()})},U=()=>{clearTimeout(M.current)},{onFocus:X,onBlur:Y}=h.useAsyncFocusBlur({onFocus:e=>U(),onBlur:e=>Q(e)}),Z=e=>{var o;(o=R.current)==null||o.triggerMouseEvent(e)},$=e=>{var o;(o=R.current)==null||o.triggerKeyboardEvent(e)},ee=e=>{!e.isAnchorClicked&&f(!1)},G=t.createElement(ne.GridColumnMenuItemContent,{show:!0},t.createElement("form",{onSubmit:I,onReset:T,className:"k-filter-menu"},t.createElement("div",{className:"k-filter-menu-container"},t.createElement(b.TextBox,{className:"k-searchbox",value:d,onChange:x,size:s.mobileMode?"large":"medium",prefix:()=>t.createElement(b.InputPrefix,null,t.createElement(h.IconWrap,{name:"search",icon:F.searchIcon}))}),t.createElement("ul",{className:"k-reset k-multicheck-wrap"},!d&&t.createElement("li",{className:"k-item k-check-all-wrap"},t.createElement(b.Checkbox,{checked:C,onChange:q,label:m.toLanguageString(n.filterSelectAll,n.messages[n.filterSelectAll]),size:s.mobileMode?"large":"medium"})),A.map(e=>t.createElement("li",{key:e.id,className:"k-item"},t.createElement(b.Checkbox,{disabled:c[e.id||""]&&g===1,checked:c[e.id||""],onChange:o=>{var a;return D(!!((a=o.target.element)!=null&&a.checked),e.id)},label:e.title||e.field,size:s.mobileMode?"large":"medium"})))),t.createElement("div",{className:"k-filter-selected-items"},g," ",m.toLanguageString(n.columnMenuColumnChooserSelectedItems,n.messages[n.columnMenuColumnChooserSelectedItems])),t.createElement("div",{className:"k-actions k-actions-start k-actions-horizontal"},t.createElement(y.Button,{type:"submit",themeColor:"primary"},m.toLanguageString(n.filterApplyButton,n.messages[n.filterApplyButton])),t.createElement(y.Button,{type:"reset"},m.toLanguageString(n.filterResetButton,n.messages[n.filterResetButton])))))),O=t.createElement(y.Button,{ref:i,togglable:!0,selected:E,svgIcon:l.svgIcon?l.svgIcon:l.icon?void 0:F.columnsIcon,icon:l.icon,size:s.mobileMode?"large":"medium",className:h.classNames("k-toolbar-button",{"k-icon-button":s.mobileMode}),title:m.toLanguageString(n.toolbarColumnsChooser,n.messages[n.toolbarColumnsChooser]),onClick:J},!s.mobileMode&&m.toLanguageString(n.toolbarColumnsChooser,n.messages[n.toolbarColumnsChooser]));return t.createElement(t.Fragment,null,H?t.createElement(K.BadgeContainer,null,O,t.createElement(K.Badge,{themeColor:"primary"})):O,s.mobileMode?t.createElement(ae.GridToolbarAdaptiveProvider,null,oe.createPortal(t.createElement(se.GridAdaptiveToolbarColumnChooser,{computedShow:E,filter:d,filtered:A,selectedColumns:c,allSelected:C,checkedCount:g,onClose:N,onApply:I,onReset:T,onFilter:x,onCheckChange:D,onSelectAll:q},G),(L=W())==null?void 0:L.body)):t.createElement(ce.Popup,{anchor:(P=i.current)==null?void 0:P.element,show:E,popupClass:"k-grid-columnmenu-popup",onMouseDownOutside:ee},t.createElement("div",{ref:v,onBlur:Y,onFocus:X,onMouseDown:Z,onKeyDown:$,className:"k-column-menu k-column-menu-md"},G)))};_.displayName="KendoReactGridToolbarColumnsChooser";exports.GridToolbarColumnsChooser=_;

package/toolbar-tools/GridToolbarColumnsChooser.mjs

@@ -0,0 +1,178 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * 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 { Button as w } from "@progress/kendo-react-buttons";
+import { useDocument as ne, useAsyncFocusBlur as le, IconWrap as re, classNames as ae, getActiveElement as ce } from "@progress/kendo-react-common";
+import { TextBox as se, InputPrefix as ie, Checkbox as K } from "@progress/kendo-react-inputs";
+import { searchIcon as ue, columnsIcon as me } from "@progress/kendo-svg-icons";
+import { GridColumnMenuItemContent as de } from "../columnMenu/GridColumnMenuItemContent.mjs";
+import { filterSelectAll as j, messages as u, columnMenuColumnChooserSelectedItems as V, filterApplyButton as H, filterResetButton as W, toolbarColumnsChooser as h } from "../messages/index.mjs";
+import { GridContext as ge } from "../utils/GridContext.mjs";
+import { useLocalization as fe } from "@progress/kendo-react-intl";
+import { GridAdaptiveToolbarColumnChooser as he } from "./adaptiveContent/GridAdaptiveToolbarColumnChooser.mjs";
+import { Popup as Ce } from "@progress/kendo-react-popup";
+import { BadgeContainer as be, Badge as ke } from "@progress/kendo-react-indicators";
+import { GridToolbarAdaptiveProvider as pe } from "./adaptiveContext/GridToolbarAdaptiveContext.mjs";
+const Ee = (n) => {
+  var F, G;
+  const a = t.useContext(ge), l = a.columnsState, C = a.onColumnsStateChange, [b, f] = t.useState(!1), [m, _] = t.useState(""), [q, k] = t.useState(!1), y = l.reduce((e, o) => ({ ...e, [o.id || ""]: !o.hidden }), {}), [r, p] = t.useState(y), s = t.useRef(null), E = t.useRef(null), B = t.useRef(null), M = t.useRef(0), i = fe(), J = ne(s), D = t.useMemo(
+    () => (l == null ? void 0 : l.filter(
+      (e) => {
+        var o;
+        return (o = e.title || e.field) == null ? void 0 : o.toLowerCase().includes(m.toLowerCase());
+      }
+    )) || [],
+    [l, m]
+  ), d = t.useMemo(
+    () => Object.values(r).filter((e) => e).length,
+    [r]
+  ), g = t.useMemo(() => d === (l == null ? void 0 : l.length), [l, d]), N = t.useCallback(
+    (e) => {
+      var O;
+      e.preventDefault();
+      const c = ((v) => (v == null ? void 0 : v.map((P) => ({
+        ...P,
+        hidden: !r[P.id || ""]
+      }))) || [])(l);
+      C && C(c), (O = n.onCloseMenu) == null || O.call(void 0), f(!1);
+    },
+    [l, C, n.onCloseMenu, r]
+  ), A = (e) => {
+    e.preventDefault(), p(y), k(!1);
+  }, x = t.useCallback(() => {
+    const e = { ...r };
+    Object.keys(e).forEach(
+      (o, c) => e[o] = g && c === 0 ? !0 : !g
+    ), p(e), k(!0);
+  }, [r, g]), T = t.useCallback(
+    (e, o) => {
+      const c = { ...r };
+      c[o || ""] = e, p(c), k(!0);
+    },
+    [r]
+  ), I = (e) => {
+    _(String(e.target.value));
+  }, Q = (e) => {
+    e.preventDefault(), f(!b);
+  }, S = t.useMemo(() => n.show !== void 0 ? n.show : b, [n.show, b]), L = () => {
+    var e;
+    n.onCloseMenu && n.onCloseMenu(), f(!1), s.current && ((e = s.current.element) == null || e.focus());
+  }, U = (e) => {
+    const o = ce(document);
+    clearTimeout(M.current), M.current = window.setTimeout(() => {
+      !a.mobileMode && o && e.relatedTarget !== s.current && E.current && !E.current.contains(o) && L();
+    });
+  }, X = () => {
+    clearTimeout(M.current);
+  }, { onFocus: Y, onBlur: Z } = le({
+    onFocus: (e) => X(),
+    onBlur: (e) => U(e)
+  }), $ = (e) => {
+    var o;
+    (o = B.current) == null || o.triggerMouseEvent(e);
+  }, ee = (e) => {
+    var o;
+    (o = B.current) == null || o.triggerKeyboardEvent(e);
+  }, te = (e) => {
+    !e.isAnchorClicked && f(!1);
+  }, R = /* @__PURE__ */ t.createElement(de, { show: !0 }, /* @__PURE__ */ t.createElement("form", { onSubmit: N, onReset: A, className: "k-filter-menu" }, /* @__PURE__ */ t.createElement("div", { className: "k-filter-menu-container" }, /* @__PURE__ */ t.createElement(
+    se,
+    {
+      className: "k-searchbox",
+      value: m,
+      onChange: I,
+      size: a.mobileMode ? "large" : "medium",
+      prefix: () => /* @__PURE__ */ t.createElement(ie, null, /* @__PURE__ */ t.createElement(re, { name: "search", icon: ue }))
+    }
+  ), /* @__PURE__ */ t.createElement("ul", { className: "k-reset k-multicheck-wrap" }, !m && /* @__PURE__ */ t.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ t.createElement(
+    K,
+    {
+      checked: g,
+      onChange: x,
+      label: i.toLanguageString(j, u[j]),
+      size: a.mobileMode ? "large" : "medium"
+    }
+  )), D.map((e) => /* @__PURE__ */ t.createElement("li", { key: e.id, className: "k-item" }, /* @__PURE__ */ t.createElement(
+    K,
+    {
+      disabled: r[e.id || ""] && d === 1,
+      checked: r[e.id || ""],
+      onChange: (o) => {
+        var c;
+        return T(!!((c = o.target.element) != null && c.checked), e.id);
+      },
+      label: e.title || e.field,
+      size: a.mobileMode ? "large" : "medium"
+    }
+  )))), /* @__PURE__ */ t.createElement("div", { className: "k-filter-selected-items" }, d, " ", i.toLanguageString(
+    V,
+    u[V]
+  )), /* @__PURE__ */ t.createElement("div", { className: "k-actions k-actions-start k-actions-horizontal" }, /* @__PURE__ */ t.createElement(w, { type: "submit", themeColor: "primary" }, i.toLanguageString(H, u[H])), /* @__PURE__ */ t.createElement(w, { type: "reset" }, i.toLanguageString(W, u[W])))))), z = /* @__PURE__ */ t.createElement(
+    w,
+    {
+      ref: s,
+      togglable: !0,
+      selected: S,
+      svgIcon: n.svgIcon ? n.svgIcon : n.icon ? void 0 : me,
+      icon: n.icon,
+      size: a.mobileMode ? "large" : "medium",
+      className: ae("k-toolbar-button", {
+        "k-icon-button": a.mobileMode
+      }),
+      title: i.toLanguageString(h, u[h]),
+      onClick: Q
+    },
+    !a.mobileMode && i.toLanguageString(h, u[h])
+  );
+  return /* @__PURE__ */ t.createElement(t.Fragment, null, q ? /* @__PURE__ */ t.createElement(be, null, z, /* @__PURE__ */ t.createElement(ke, { themeColor: "primary" })) : z, a.mobileMode ? /* @__PURE__ */ t.createElement(pe, null, oe.createPortal(
+    /* @__PURE__ */ t.createElement(
+      he,
+      {
+        computedShow: S,
+        filter: m,
+        filtered: D,
+        selectedColumns: r,
+        allSelected: g,
+        checkedCount: d,
+        onClose: L,
+        onApply: N,
+        onReset: A,
+        onFilter: I,
+        onCheckChange: T,
+        onSelectAll: x
+      },
+      R
+    ),
+    (F = J()) == null ? void 0 : F.body
+  )) : /* @__PURE__ */ t.createElement(
+    Ce,
+    {
+      anchor: (G = s.current) == null ? void 0 : G.element,
+      show: S,
+      popupClass: "k-grid-columnmenu-popup",
+      onMouseDownOutside: te
+    },
+    /* @__PURE__ */ t.createElement(
+      "div",
+      {
+        ref: E,
+        onBlur: Z,
+        onFocus: Y,
+        onMouseDown: $,
+        onKeyDown: ee,
+        className: "k-column-menu k-column-menu-md"
+      },
+      R
+    )
+  ));
+};
+Ee.displayName = "KendoReactGridToolbarColumnsChooser";
+export {
+  Ee as GridToolbarColumnsChooser
+};