@progress/kendo-react-grid 9.3.1 → 9.4.0-develop.1

package/footer/Footer.mjs

@@ -6,45 +6,46 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as t from "react";
-import { classNames as s, kendoThemeMaps as n } from "@progress/kendo-react-common";
-const c = t.forwardRef((e, l) => {
-  const a = t.useRef(null), o = t.useRef(null);
-  return t.useImperativeHandle(l, () => ({
+import * as e from "react";
+import { classNames as n, kendoThemeMaps as s } from "@progress/kendo-react-common";
+import { GridContext as c } from "../GridClientWrapper.mjs";
+const i = (t) => {
+  const o = e.useRef(null), a = e.useRef(null), l = e.useContext(c);
+  return e.useImperativeHandle(l.footerRef, () => ({
     setScrollLeft: (r) => {
-      a.current && (a.current.scrollLeft = r);
+      o.current && (o.current.scrollLeft = r);
     },
     setWidth: (r) => {
-      o.current && (o.current.style.width = r + "px");
+      a.current && (a.current.style.width = r + "px");
     }
-  })), e.staticHeaders ? /* @__PURE__ */ t.createElement("div", { className: "k-grid-footer", role: "presentation" }, /* @__PURE__ */ t.createElement("div", { ref: a, className: "k-grid-footer-wrap", role: "presentation" }, /* @__PURE__ */ t.createElement(
+  })), t.staticHeaders ? /* @__PURE__ */ e.createElement("div", { className: "k-grid-footer", role: "presentation" }, /* @__PURE__ */ e.createElement("div", { ref: o, className: "k-grid-footer-wrap", role: "presentation" }, /* @__PURE__ */ e.createElement(
     "table",
     {
-      ref: o,
-      className: s(
+      ref: a,
+      className: n(
         "k-table k-grid-footer-table",
         {
-          "k-table-md": !e.size,
-          [`k-table-${n.sizeMap[e.size] || e.size}`]: e.size
+          "k-table-md": !t.size,
+          [`k-table-${s.sizeMap[t.size] || t.size}`]: t.size
         },
-        e.className
+        t.className
       ),
       role: "presentation"
     },
-    /* @__PURE__ */ t.createElement(
+    /* @__PURE__ */ e.createElement(
       "colgroup",
       {
         ref: (r) => {
-          e.columnResize.colGroupFooter = r;
+          l.columnResizeRef.current.colGroupFooter = r;
         },
         role: "presentation"
       },
-      e.cols
+      t.cols
     ),
-    /* @__PURE__ */ t.createElement("tfoot", { className: "k-table-tfoot", role: "presentation" }, e.row)
-  ))) : /* @__PURE__ */ t.createElement("tfoot", { className: "k-table-tfoot" }, e.row);
-});
-c.displayName = "KendoReactFooter";
+    /* @__PURE__ */ e.createElement("tfoot", { className: "k-table-tfoot", role: "presentation" }, t.row)
+  ))) : /* @__PURE__ */ e.createElement("tfoot", { className: "k-table-tfoot" }, t.row);
+};
+i.displayName = "KendoReactFooter";
 export {
-  c as Footer
+  i as Footer
 };

package/footer/FooterCell.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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react"),i=require("../utils/index.js"),f=require("@progress/kendo-react-common"),d=require("./client/FooterCellContainer.js");function b(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const o in t)if(o!=="default"){const n=Object.getOwnPropertyDescriptor(t,o);Object.defineProperty(e,o,n.get?n:{enumerable:!0,get:()=>t[o]})}}return e.default=t,Object.freeze(e)}const l=b(C),g=t=>{const{column:e,index:o,cells:n}=t,r={colSpan:e.colSpan!==1?e.colSpan:void 0,className:f.classNames("k-table-td",e.locked&&e.left!==void 0?"k-grid-footer-sticky":""),role:"gridcell","aria-colindex":e.ariaColumnIndex},a={field:e.field,ariaColumnIndex:e.ariaColumnIndex,...r},s=i.clientColumn(e),c=i.resolveCells(n,e.cells);if(c&&c.footerCell){const u=c.footerCell,m=i.isClientReference(u);return l.createElement(d.FooterCellContainer,{key:o,id:t.id,tdProps:r,isCustom:!0,isClient:m,column:s},l.createElement(u,{...a,tdProps:r,index:o}))}return l.createElement(d.FooterCellContainer,{key:o,id:t.id,column:s},e.footerCell&&l.createElement(e.footerCell,{...a})||l.createElement("td",{...r}))};exports.FooterCell=g;

package/footer/FooterCell.mjs

@@ -0,0 +1,43 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as l from "react";
+import { clientColumn as C, resolveCells as u, isClientReference as f } from "../utils/index.mjs";
+import { classNames as p } from "@progress/kendo-react-common";
+import { FooterCellContainer as m } from "./client/FooterCellContainer.mjs";
+const v = (t) => {
+  const { column: e, index: n, cells: a } = t, o = {
+    colSpan: e.colSpan !== 1 ? e.colSpan : void 0,
+    className: p("k-table-td", e.locked && e.left !== void 0 ? "k-grid-footer-sticky" : ""),
+    role: "gridcell",
+    "aria-colindex": e.ariaColumnIndex
+  }, c = {
+    field: e.field,
+    ariaColumnIndex: e.ariaColumnIndex,
+    ...o
+  }, i = C(e), r = u(a, e.cells);
+  if (r && r.footerCell) {
+    const s = r.footerCell, d = f(s);
+    return /* @__PURE__ */ l.createElement(
+      m,
+      {
+        key: n,
+        id: t.id,
+        tdProps: o,
+        isCustom: !0,
+        isClient: d,
+        column: i
+      },
+      /* @__PURE__ */ l.createElement(s, { ...c, tdProps: o, index: n })
+    );
+  }
+  return /* @__PURE__ */ l.createElement(m, { key: n, id: t.id, column: i }, e.footerCell && /* @__PURE__ */ l.createElement(e.footerCell, { ...c }) || /* @__PURE__ */ l.createElement("td", { ...o }));
+};
+export {
+  v as FooterCell
+};

package/footer/FooterRow.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react"),i=require("../utils/index.js"),b=require("@progress/kendo-react-common"),s=require("@progress/kendo-react-data-tools");function C(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const o in t)if(o!=="default"){const l=Object.getOwnPropertyDescriptor(t,o);Object.defineProperty(e,o,l.get?l:{enumerable:!0,get:()=>t[o]})}}return e.default=t,Object.freeze(e)}const r=C(g),y=t=>{const{column:e,index:o,isRtl:l,id:d,cells:u}=t,f=s.useTableKeyboardNavigation(d),n={colSpan:e.colSpan!==1?e.colSpan:void 0,style:e.left!==void 0?l?{left:e.right,right:e.left}:{left:e.left,right:e.right}:{},className:b.classNames("k-table-td",e.locked&&e.left!==void 0?"k-grid-footer-sticky":""),key:o,role:"gridcell","aria-colindex":e.ariaColumnIndex,...f},c={field:e.field,ariaColumnIndex:e.ariaColumnIndex,...n},a=i.resolveCells(u,e.cells);if(a&&a.footerCell){const m=a.footerCell;return r.createElement(m,{...c,tdProps:n,index:o})}return e.footerCell&&r.createElement(e.footerCell,{...c,key:o})||r.createElement("td",{...n})},k=t=>r.createElement("tr",{className:"k-table-row",role:"row","aria-rowindex":t.ariaRowIndex},i.footerColumns(t.columns).map((e,o)=>{const l=s.tableKeyboardNavigationTools.generateNavigatableId(`${o}-footercell`,t.idPrefix,"nodata");return r.createElement(y,{key:l,column:e,id:l,index:o,cells:t.cells,isRtl:t.isRtl})}));exports.FooterRow=k;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),l=require("../utils/index.js"),c=require("@progress/kendo-react-data-tools"),i=require("./FooterCell.js");function u(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(o,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return o.default=e,Object.freeze(o)}const a=u(n),s=e=>a.createElement("tr",{className:"k-table-row",role:"row","aria-rowindex":e.ariaRowIndex},l.footerColumns(e.columns).map((o,t)=>{const r=c.tableKeyboardNavigationTools.generateNavigatableId(`${t}-footercell`,e.idPrefix,"nodata");return a.createElement(i.FooterCell,{key:r,column:o,id:r,index:t,cells:e.cells})}));exports.FooterRow=s;

package/footer/FooterRow.mjs

@@ -6,47 +6,18 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as o from "react";
-import { footerColumns as f, resolveCells as u } from "../utils/index.mjs";
-import { classNames as C } from "@progress/kendo-react-common";
-import { tableKeyboardNavigationTools as g, useTableKeyboardNavigation as b } from "@progress/kendo-react-data-tools";
-const k = (t) => {
-  const { column: e, index: l, isRtl: r, id: c, cells: s } = t, d = b(c), a = {
-    colSpan: e.colSpan !== 1 ? e.colSpan : void 0,
-    style: e.left !== void 0 ? r ? { left: e.right, right: e.left } : { left: e.left, right: e.right } : {},
-    className: C("k-table-td", e.locked && e.left !== void 0 ? "k-grid-footer-sticky" : ""),
-    key: l,
-    role: "gridcell",
-    "aria-colindex": e.ariaColumnIndex,
-    ...d
-  }, n = {
-    field: e.field,
-    ariaColumnIndex: e.ariaColumnIndex,
-    ...a
-  }, i = u(s, e.cells);
-  if (i && i.footerCell) {
-    const m = i.footerCell;
-    return /* @__PURE__ */ o.createElement(m, { ...n, tdProps: a, index: l });
-  }
-  return e.footerCell && /* @__PURE__ */ o.createElement(e.footerCell, { ...n, key: l }) || /* @__PURE__ */ o.createElement("td", { ...a });
-}, I = (t) => /* @__PURE__ */ o.createElement("tr", { className: "k-table-row", role: "row", "aria-rowindex": t.ariaRowIndex }, f(t.columns).map((e, l) => {
-  const r = g.generateNavigatableId(
-    `${l}-footercell`,
-    t.idPrefix,
+import * as t from "react";
+import { footerColumns as l } from "../utils/index.mjs";
+import { tableKeyboardNavigationTools as i } from "@progress/kendo-react-data-tools";
+import { FooterCell as m } from "./FooterCell.mjs";
+const d = (e) => /* @__PURE__ */ t.createElement("tr", { className: "k-table-row", role: "row", "aria-rowindex": e.ariaRowIndex }, l(e.columns).map((a, o) => {
+  const r = i.generateNavigatableId(
+    `${o}-footercell`,
+    e.idPrefix,
     "nodata"
   );
-  return /* @__PURE__ */ o.createElement(
-    k,
-    {
-      key: r,
-      column: e,
-      id: r,
-      index: l,
-      cells: t.cells,
-      isRtl: t.isRtl
-    }
-  );
+  return /* @__PURE__ */ t.createElement(m, { key: r, column: a, id: r, index: o, cells: e.cells });
 }));
 export {
-  I as FooterRow
+  d as FooterRow
 };

package/footer/client/FooterCellContainer.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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),c=require("@progress/kendo-react-data-tools"),a=require("../../GridClientWrapper.js");function s(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const i=s(l),u=e=>{const n=i.useContext(a.GridContext),t=c.useTableKeyboardNavigation(e.id),o=n.getCellPositionStyle(e.column),r={...t,style:{...o}};return e.isCustom&&(n.isClient||e.isClient)?i.cloneElement(e.children,{tdProps:{...e.tdProps,...r},...t}):i.cloneElement(e.children,{...r})};exports.FooterCellContainer=u;

package/footer/client/FooterCellContainer.mjs

@@ -0,0 +1,26 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as e from "react";
+import { useTableKeyboardNavigation as r } from "@progress/kendo-react-data-tools";
+import { GridContext as s } from "../../GridClientWrapper.mjs";
+const a = (t) => {
+  const n = e.useContext(s), i = r(t.id), l = n.getCellPositionStyle(t.column), o = {
+    ...i,
+    style: { ...l }
+  };
+  return t.isCustom && (n.isClient || t.isClient) ? e.cloneElement(t.children, {
+    tdProps: { ...t.tdProps, ...o },
+    ...i
+  }) : e.cloneElement(t.children, {
+    ...o
+  });
+};
+export {
+  a as FooterCellContainer
+};

package/header/FilterRow.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),O=require("@progress/kendo-react-intl"),S=require("../cells/GridFilterCell.js"),u=require("../filterCommon.js"),k=require("@progress/kendo-react-data-tools"),v=require("../messages/index.js"),m=require("@progress/kendo-react-common"),q=require("../utils/index.js");function w(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const g=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(a,n,g.get?g:{enumerable:!0,get:()=>t[n]})}}return a.default=t,Object.freeze(a)}const d=w(T),y="k-table-row k-filter-row",_=t=>{const a=O.useLocalization(),n=(e,r)=>{let l=`${r?"k-grid-header-sticky":""}`;return t.sort&&t.sort.filter(o=>o.field===e).length>0&&(l+=" k-sorted"),l},g=(e,r,l,o)=>{if(!t.filterChange)return;const i=[];(e!==""&&e!==null||r!=="")&&i.push({field:l,operator:r,value:e}),t.filter&&t.filter.filters&&(t.filter.filters||[]).forEach(b=>{const c=b;c&&c.field!==l&&i.push(c)});const s=t.filter&&t.filter.logic?t.filter.logic:"and";t.filterChange(i.length>0?{logic:s,filters:i}:null,o)},x=t.filter&&t.filter.filters||[],L=e=>{if(e===void 0)return;const r=x.filter(l=>l.field===e);return r.length?r[0]:void 0};let E=0,F=-1;const I=t.columns.filter(e=>e.children.length===0).map(e=>{const r=u.getFilterType(e.filter),l=L(e.field),o=`${e.field} ${a.toLanguageString(v.filterAriaLabel,v.messages[v.filterAriaLabel])}`;let i=l&&l.value;i===void 0&&(i=r==="text"?"":null);const s=e.filterable&&{render:t.cellRender,field:e.field,title:e.filterTitle,value:i,operator:l&&l.operator,operators:u.operatorMap(t.filterOperators[r]||[],a),booleanValues:u.operatorMap(u.booleanFilterValues,a),filterType:r,ariaLabel:o,onChange:f=>{g(f.value,f.operator,e.field,f.syntheticEvent)}},C=e.declarationIndex>=0?++F:--E,b=e.left!==void 0?t.isRtl?{left:e.right,right:e.left}:{left:e.left,right:e.right}:{},c={columnId:k.tableKeyboardNavigationTools.getFilterColumnId(e.id),navigatable:e.navigatable||t.navigatable,style:b,className:m.classNames("k-table-td",n(e.field,e.locked)||void 0),role:"gridcell",ariaLabel:o,ariaColumnIndex:e.ariaColumnIndex},R=s&&(e.filterCell?d.createElement(e.filterCell,{...s}):d.createElement(S.GridFilterCell,{size:t.size,...s})),h=q.resolveCells(t.cells,e.cells);if(h&&h.filterCell){const f=h.filterCell;return d.createElement(f,{key:C,...s,tdProps:c,index:F},R)}return d.createElement(k.HeaderTdElement,{key:C,...c},R)});return d.createElement("tr",{className:y,"aria-rowindex":t.ariaRowIndex,role:"row"},I)};exports.FILTER_ROW_CLASS=y;exports.FilterRow=_;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),O=require("@progress/kendo-react-intl"),G=require("../cells/GridFilterCell.js"),d=require("../filterCommon.js"),k=require("@progress/kendo-react-data-tools"),F=require("../messages/index.js"),P=require("@progress/kendo-react-common"),f=require("../utils/index.js"),E=require("./client/GridFilterCellContainer.js"),_=require("./client/GridFilterCellElementContainer.js");function h(t){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const s=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(i,a,s.get?s:{enumerable:!0,get:()=>t[a]})}}return i.default=t,Object.freeze(i)}const n=h(w),x="k-table-row k-filter-row",z=t=>{const i=t.localization||new O.LocalizationService,a=(e,r)=>{let l=`${r?"k-grid-header-sticky":""}`;return t.sort&&t.sort.filter(c=>c.field===e).length>0&&(l+=" k-sorted"),l},s=t.filter&&t.filter.filters||[],L=e=>{if(e===void 0)return;const r=s.filter(l=>l.field===e);return r.length?r[0]:void 0};let q=0,v=-1;const I=t.columns.filter(e=>e.children.length===0).map(e=>{const r=d.getFilterType(e.filter),l=L(e.field),c=`${e.field} ${i.toLanguageString(F.filterAriaLabel,F.messages[F.filterAriaLabel])}`;let C=l&&l.value;C===void 0&&(C=r==="text"?"":null);const u=e.filterable&&{field:e.field,title:e.filterTitle,value:C,operator:l&&l.operator,operators:d.operatorMap(t.filterOperators[r]||[],i),booleanValues:d.operatorMap(d.booleanFilterValues,i),filterType:r,ariaLabel:e.columnType==="reorder"?"":c,size:t.size},b=e.declarationIndex>=0?++v:--q,R={columnId:k.tableKeyboardNavigationTools.getFilterColumnId(e.id),navigatable:e.navigatable||t.navigatable,className:P.classNames("k-table-td",a(e.field,e.locked)||void 0),role:"gridcell",ariaLabel:e.columnType==="reorder"?void 0:c,ariaColumnIndex:e.ariaColumnIndex},y=f.clientColumn(e),T={column:y,filter:t.filter,field:e.field,render:t.cellRender};let g=null;if(u&&e.columnType!=="reorder"){const o=e.filterCell?e.filterCell:G.GridFilterCell;g=n.createElement(E.GridFilterCellContainer,{...T,isClient:f.isClientReference(o)},n.createElement(o,{...u}))}const m=f.resolveCells(t.cells,e.cells);if(m&&m.filterCell){const o=m.filterCell,S=f.isClientReference(o);return n.createElement(E.GridFilterCellContainer,{key:b,...T,isClient:S,isCustom:!0},n.createElement(o,{key:b,...u,tdProps:R,index:v},g))}return n.createElement(_.GridFilterCellElementContainer,{key:b,column:y},n.createElement(k.HeaderTdElement,{...R},g))});return n.createElement("tr",{className:x,"aria-rowindex":t.ariaRowIndex,role:"row"},I)};exports.FILTER_ROW_CLASS=x;exports.FilterRow=z;

package/header/FilterRow.mjs

@@ -6,79 +6,83 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as s from "react";
-import { useLocalization as L } from "@progress/kendo-react-intl";
-import { GridFilterCell as y } from "../cells/GridFilterCell.mjs";
-import { getFilterType as R, operatorMap as v, booleanFilterValues as w } from "../filterCommon.mjs";
-import { tableKeyboardNavigationTools as T, HeaderTdElement as N } from "@progress/kendo-react-data-tools";
-import { filterAriaLabel as F, messages as z } from "../messages/index.mjs";
+import * as i from "react";
+import { LocalizationService as R } from "@progress/kendo-react-intl";
+import { GridFilterCell as h } from "../cells/GridFilterCell.mjs";
+import { getFilterType as z, operatorMap as u, booleanFilterValues as N } from "../filterCommon.mjs";
+import { tableKeyboardNavigationTools as P, HeaderTdElement as S } from "@progress/kendo-react-data-tools";
+import { filterAriaLabel as F, messages as p } from "../messages/index.mjs";
 import { classNames as A } from "@progress/kendo-react-common";
-import { resolveCells as S } from "../utils/index.mjs";
-const $ = "k-table-row k-filter-row", M = (t) => {
-  const d = L(), b = (e, r) => {
+import { clientColumn as G, isClientReference as E, resolveCells as $ } from "../utils/index.mjs";
+import { GridFilterCellContainer as x } from "./client/GridFilterCellContainer.mjs";
+import { GridFilterCellElementContainer as O } from "./client/GridFilterCellElementContainer.mjs";
+const V = "k-table-row k-filter-row", J = (t) => {
+  const n = t.localization || new R(), T = (e, r) => {
     let l = `${r ? "k-grid-header-sticky" : ""}`;
-    return t.sort && t.sort.filter((a) => a.field === e).length > 0 && (l += " k-sorted"), l;
-  }, x = (e, r, l, a) => {
-    if (!t.filterChange)
-      return;
-    const i = [];
-    (e !== "" && e !== null || r !== "") && i.push({
-      field: l,
-      operator: r,
-      value: e
-    }), t.filter && t.filter.filters && (t.filter.filters || []).forEach((g) => {
-      const n = g;
-      n && n.field !== l && i.push(n);
-    });
-    const o = t.filter && t.filter.logic ? t.filter.logic : "and";
-    t.filterChange(i.length > 0 ? { logic: o, filters: i } : null, a);
-  }, E = t.filter && t.filter.filters || [], k = (e) => {
+    return t.sort && t.sort.filter((o) => o.field === e).length > 0 && (l += " k-sorted"), l;
+  }, k = t.filter && t.filter.filters || [], y = (e) => {
     if (e === void 0)
       return;
-    const r = E.filter(
+    const r = k.filter(
       (l) => l.field === e
     );
     return r.length ? r[0] : void 0;
   };
-  let u = 0, h = -1;
-  const I = t.columns.filter((e) => e.children.length === 0).map((e) => {
-    const r = R(e.filter), l = k(e.field), a = `${e.field} ${d.toLanguageString(
+  let I = 0, C = -1;
+  const L = t.columns.filter((e) => e.children.length === 0).map((e) => {
+    const r = z(e.filter), l = y(e.field), o = `${e.field} ${n.toLanguageString(
       F,
-      z[F]
+      p[F]
     )}`;
-    let i = l && l.value;
-    i === void 0 && (i = r === "text" ? "" : null);
-    const o = e.filterable && {
-      render: t.cellRender,
+    let s = l && l.value;
+    s === void 0 && (s = r === "text" ? "" : null);
+    const f = e.filterable && {
       field: e.field,
       title: e.filterTitle,
-      value: i,
+      value: s,
       operator: l && l.operator,
-      operators: v(t.filterOperators[r] || [], d),
-      booleanValues: v(w, d),
+      operators: u(t.filterOperators[r] || [], n),
+      booleanValues: u(N, n),
       filterType: r,
-      ariaLabel: a,
-      onChange: (f) => {
-        x(f.value, f.operator, e.field, f.syntheticEvent);
-      }
-    }, c = e.declarationIndex >= 0 ? ++h : --u, g = e.left !== void 0 ? t.isRtl ? { left: e.right, right: e.left } : { left: e.left, right: e.right } : {}, n = {
-      columnId: T.getFilterColumnId(e.id),
+      ariaLabel: e.columnType === "reorder" ? "" : o,
+      size: t.size
+    }, d = e.declarationIndex >= 0 ? ++C : --I, v = {
+      columnId: P.getFilterColumnId(e.id),
       navigatable: e.navigatable || t.navigatable,
-      style: g,
-      className: A("k-table-td", b(e.field, e.locked) || void 0),
+      className: A("k-table-td", T(e.field, e.locked) || void 0),
       role: "gridcell",
-      ariaLabel: a,
+      ariaLabel: e.columnType === "reorder" ? void 0 : o,
       ariaColumnIndex: e.ariaColumnIndex
-    }, m = o && (e.filterCell ? /* @__PURE__ */ s.createElement(e.filterCell, { ...o }) : /* @__PURE__ */ s.createElement(y, { size: t.size, ...o })), C = S(t.cells, e.cells);
-    if (C && C.filterCell) {
-      const f = C.filterCell;
-      return /* @__PURE__ */ s.createElement(f, { key: c, ...o, tdProps: n, index: h }, m);
+    }, g = G(e), b = {
+      column: g,
+      filter: t.filter,
+      field: e.field,
+      render: t.cellRender
+    };
+    let c = null;
+    if (f && e.columnType !== "reorder") {
+      const a = e.filterCell ? e.filterCell : h;
+      c = /* @__PURE__ */ i.createElement(x, { ...b, isClient: E(a) }, /* @__PURE__ */ i.createElement(a, { ...f }));
+    }
+    const m = $(t.cells, e.cells);
+    if (m && m.filterCell) {
+      const a = m.filterCell, w = E(a);
+      return /* @__PURE__ */ i.createElement(
+        x,
+        {
+          key: d,
+          ...b,
+          isClient: w,
+          isCustom: !0
+        },
+        /* @__PURE__ */ i.createElement(a, { key: d, ...f, tdProps: v, index: C }, c)
+      );
     }
-    return /* @__PURE__ */ s.createElement(N, { key: c, ...n }, m);
+    return /* @__PURE__ */ i.createElement(O, { key: d, column: g }, /* @__PURE__ */ i.createElement(S, { ...v }, c));
   });
-  return /* @__PURE__ */ s.createElement("tr", { className: $, "aria-rowindex": t.ariaRowIndex, role: "row" }, I);
+  return /* @__PURE__ */ i.createElement("tr", { className: V, "aria-rowindex": t.ariaRowIndex, role: "row" }, L);
 };
 export {
-  $ as FILTER_ROW_CLASS,
-  M as FilterRow
+  V as FILTER_ROW_CLASS,
+  J as FilterRow
 };

package/header/GridHeaderCell.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@progress/kendo-react-common"),u=require("react"),i=require("../columnMenu/GridColumnMenuWrapper.js");function o(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const c=o(u),d=e=>{const t=l.useUnstyled(),n=t&&t.uGrid?t.uGrid:l.uGrid,{columnMenuWrapperProps:r}=e,s=e.onClick?{onClick:e.onClick}:{},a=c.createElement("span",{className:l.classNames(n.headerCellInner({}))},c.createElement("span",{className:l.classNames(n.headerCellLink({sortable:e.columnMenuWrapperProps.sortable})),...s},c.createElement("span",{className:l.classNames(n.columnTitle({}))},e.title||e.field||" "),e.children),r.columnMenu&&c.createElement(i.GridColumnMenuWrapper,{...r}));return e.render?e.render.call(void 0,a,e):a};exports.GridHeaderCell=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@progress/kendo-react-common"),s=require("react"),u=require("../columnMenu/GridColumnMenuWrapper.js");function i(e){const t=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(t,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const a=i(s),o=e=>{const t=r.useUnstyled(),n=t&&t.uGrid?t.uGrid:r.uGrid,l=e.onClick?{onClick:e.onClick}:{},c=a.createElement("span",{className:r.classNames(n.headerCellInner({}))},a.createElement("span",{className:r.classNames(n.headerCellLink({sortable:e.columnMenuWrapperProps.sortable})),...l},a.createElement("span",{className:r.classNames(n.columnTitle({}))},e.title||e.field||" "),e.children),e.columnMenuWrapperProps.columnMenu&&a.createElement(u.GridColumnMenuWrapper,{...e.columnMenuWrapperProps}));return e.render?e.render.call(void 0,c,e):c};exports.GridHeaderCell=o;

package/header/GridHeaderCell.mjs

@@ -6,27 +6,27 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import { useUnstyled as s, uGrid as m, classNames as t } from "@progress/kendo-react-common";
+import { useUnstyled as i, uGrid as s, classNames as a } from "@progress/kendo-react-common";
 import * as n from "react";
-import { GridColumnMenuWrapper as d } from "../columnMenu/GridColumnMenuWrapper.mjs";
-const C = (e) => {
-  const l = s(), r = l && l.uGrid ? l.uGrid : m, { columnMenuWrapperProps: a } = e, i = e.onClick ? {
+import { GridColumnMenuWrapper as m } from "../columnMenu/GridColumnMenuWrapper.mjs";
+const o = (e) => {
+  const l = i(), r = l && l.uGrid ? l.uGrid : s, c = e.onClick ? {
     onClick: e.onClick
-  } : {}, c = /* @__PURE__ */ n.createElement("span", { className: t(r.headerCellInner({})) }, /* @__PURE__ */ n.createElement(
+  } : {}, t = /* @__PURE__ */ n.createElement("span", { className: a(r.headerCellInner({})) }, /* @__PURE__ */ n.createElement(
     "span",
     {
-      className: t(
+      className: a(
         r.headerCellLink({
           sortable: e.columnMenuWrapperProps.sortable
         })
       ),
-      ...i
+      ...c
     },
-    /* @__PURE__ */ n.createElement("span", { className: t(r.columnTitle({})) }, e.title || e.field || " "),
+    /* @__PURE__ */ n.createElement("span", { className: a(r.columnTitle({})) }, e.title || e.field || " "),
     e.children
-  ), a.columnMenu && /* @__PURE__ */ n.createElement(d, { ...a }));
-  return e.render ? e.render.call(void 0, c, e) : c;
+  ), e.columnMenuWrapperProps.columnMenu && /* @__PURE__ */ n.createElement(m, { ...e.columnMenuWrapperProps }));
+  return e.render ? e.render.call(void 0, t, e) : t;
 };
 export {
-  C as GridHeaderCell
+  o as GridHeaderCell
 };

package/header/GridHeaderSelectionCell.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),d=require("../columnMenu/GridColumnMenuWrapper.js"),a=require("../messages/index.js"),s=require("@progress/kendo-react-intl"),m=require("@progress/kendo-react-common");function b(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,c.get?c:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const r=b(u),g=e=>{const n=m.useId(),t=s.useLocalization(),c=e.id||n,{columnMenuWrapperProps:l}=e,o=[r.createElement("span",{key:0,className:"k-checkbox-wrap"},r.createElement("input",{id:c,type:"checkbox",tabIndex:-1,className:"k-checkbox k-checkbox-md k-rounded-md","aria-label":t.toLanguageString(a.selectRow,a.messages[a.selectRow]),"aria-checked":e.selectionValue,checked:e.selectionValue,onChange:i=>e.selectionChange({field:e.field,syntheticEvent:i})})),l.columnMenu&&r.createElement(d.GridColumnMenuWrapper,{...l})];return e.render?e.render.call(void 0,o,e):o};exports.GridHeaderSelectionCell=g;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),d=require("../columnMenu/GridColumnMenuWrapper.js"),a=require("../messages/index.js"),s=require("@progress/kendo-react-intl"),m=require("@progress/kendo-react-common"),g=require("../GridClientWrapper.js");function b(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,c.get?c:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const r=b(u),k=e=>{const n=r.useContext(g.GridContext),t=m.useId(),c=s.useLocalization(),l=e.id||t,o=[r.createElement("span",{key:0,className:"k-checkbox-wrap"},r.createElement("input",{id:l,type:"checkbox",tabIndex:-1,className:"k-checkbox k-checkbox-md k-rounded-md","aria-label":c.toLanguageString(a.selectRow,a.messages[a.selectRow]),"aria-checked":e.selectionValue,checked:e.selectionValue,onChange:i=>n.onHeaderSelectionChange({field:e.field,syntheticEvent:i})})),e.columnMenuWrapperProps.columnMenu&&r.createElement(d.GridColumnMenuWrapper,{...e.columnMenuWrapperProps})];return e.render?e.render.call(void 0,o,e):o};exports.GridHeaderSelectionCell=k;

package/header/GridHeaderSelectionCell.mjs

@@ -6,32 +6,33 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as n from "react";
+import * as t from "react";
 import { GridColumnMenuWrapper as d } from "../columnMenu/GridColumnMenuWrapper.mjs";
-import { selectRow as a, messages as m } from "../messages/index.mjs";
+import { selectRow as c, messages as m } from "../messages/index.mjs";
 import { useLocalization as u } from "@progress/kendo-react-intl";
 import { useId as s } from "@progress/kendo-react-common";
+import { GridContext as k } from "../GridClientWrapper.mjs";
 const b = (e) => {
-  const l = s(), o = u(), i = e.id || l, { columnMenuWrapperProps: t } = e, c = [
-    /* @__PURE__ */ n.createElement("span", { key: 0, className: "k-checkbox-wrap" }, /* @__PURE__ */ n.createElement(
+  const o = t.useContext(k), a = s(), r = u(), i = e.id || a, n = [
+    /* @__PURE__ */ t.createElement("span", { key: 0, className: "k-checkbox-wrap" }, /* @__PURE__ */ t.createElement(
       "input",
       {
         id: i,
         type: "checkbox",
         tabIndex: -1,
         className: "k-checkbox k-checkbox-md k-rounded-md",
-        "aria-label": o.toLanguageString(a, m[a]),
+        "aria-label": r.toLanguageString(c, m[c]),
         "aria-checked": e.selectionValue,
         checked: e.selectionValue,
-        onChange: (r) => e.selectionChange({
+        onChange: (l) => o.onHeaderSelectionChange({
           field: e.field,
-          syntheticEvent: r
+          syntheticEvent: l
         })
       }
     )),
-    t.columnMenu && /* @__PURE__ */ n.createElement(d, { ...t })
+    e.columnMenuWrapperProps.columnMenu && /* @__PURE__ */ t.createElement(d, { ...e.columnMenuWrapperProps })
   ];
-  return e.render ? e.render.call(void 0, c, e) : c;
+  return e.render ? e.render.call(void 0, n, e) : n;
 };
 export {
   b as GridHeaderSelectionCell

package/header/GroupPanel.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react"),p=require("../drag/GroupingIndicator.js"),b=require("@progress/kendo-react-intl"),a=require("../messages/index.js");function f(e){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(l,r,c.get?c:{enumerable:!0,get:()=>e[r]})}}return l.default=e,Object.freeze(l)}const i=f(m),P=e=>{const l=(o,n)=>{const t=e.group.slice();t.splice(n,1),e.groupChange(t,o)},r=(o,n,t,s)=>{const d=Object.assign({},t,{dir:s}),g=e.group.slice();g.splice(n,1,d),e.groupChange(g,o)},c=b.useLocalization(),u=(e.group||[]).map((o,n)=>i.createElement(p.GroupingIndicator,{key:n,index:n,dir:o.dir||"asc",title:e.resolveTitle(o.field),onRemove:t=>{l(t,n)},onSortChange:(t,s)=>{r(t,n,o,s)},onPress:e.pressHandler,onDrag:e.dragHandler,onRelease:e.releaseHandler,onContextMenu:e.onContextMenu}));return i.createElement("div",{ref:e.refCallback,className:"k-grouping-header",role:"toolbar","aria-label":c.toLanguageString(a.groupPanelAriaLabel,a.messages[a.groupPanelAriaLabel]),"aria-controls":e.ariaControls||""},i.createElement("div",{className:"k-chip-list k-chip-list-md",role:"none"},u),i.createElement("div",{className:"k-grouping-drop-container"},!u.length&&c.toLanguageString(a.groupPanelEmpty,a.messages[a.groupPanelEmpty])," "))};exports.GroupPanel=P;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),P=require("../drag/GroupingIndicator.js"),C=require("@progress/kendo-react-intl"),c=require("../messages/index.js"),G=require("../GridClientWrapper.js");function v(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const s=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(r,a,s.get?s:{enumerable:!0,get:()=>t[a]})}}return r.default=t,Object.freeze(r)}const l=v(b),R=t=>{const r=l.useContext(G.GridContext),a=(o,e)=>{const n=t.group.slice();n.splice(e,1),r.groupChange(n,o)},s=(o,e,n,i)=>{const f=Object.assign({},n,{dir:i}),p=t.group.slice();p.splice(e,1,f),r.groupChange(p,o)},u=C.useLocalization(),d=t.group||[],m=o=>{const e=t.columns.find(i=>i.field===o),n=e&&(e.title||e.field);return n===void 0?o:n},g=d.map((o,e)=>l.createElement(P.GroupingIndicator,{key:e,index:e,dir:o.dir||"asc",title:m(o.field),onRemove:n=>{a(n,e)},onSortChange:(n,i)=>{s(n,e,o,i)},onPress:r.dragLogicRef.current.pressHandler,onDrag:r.dragLogicRef.current.dragHandler,onRelease:r.dragLogicRef.current.releaseHandler,onContextMenu:r.onContextMenu}));return l.createElement("div",{ref:r.dragLogicRef.current.refGroupPanelDiv,className:"k-grouping-header",role:"toolbar","aria-label":u.toLanguageString(c.groupPanelAriaLabel,c.messages[c.groupPanelAriaLabel]),"aria-controls":t.ariaControls||""},l.createElement("div",{className:"k-chip-list k-chip-list-md",role:"none"},g),l.createElement("div",{className:"k-grouping-drop-container"},!g.length&&u.toLanguageString(c.groupPanelEmpty,c.messages[c.groupPanelEmpty])," "))};exports.GroupPanel=R;

package/header/GroupPanel.mjs

@@ -6,49 +6,53 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as r from "react";
-import { GroupingIndicator as h } from "../drag/GroupingIndicator.mjs";
-import { useLocalization as C } from "@progress/kendo-react-intl";
-import { groupPanelAriaLabel as c, messages as g, groupPanelEmpty as u } from "../messages/index.mjs";
-const P = (e) => {
-  const m = (a, o) => {
-    const n = e.group.slice();
-    n.splice(o, 1), e.groupChange(n, a);
-  }, d = (a, o, n, t) => {
-    const p = Object.assign({}, n, { dir: t }), s = e.group.slice();
-    s.splice(o, 1, p), e.groupChange(s, a);
-  }, l = C(), i = (e.group || []).map((a, o) => /* @__PURE__ */ r.createElement(
-    h,
+import * as i from "react";
+import { GroupingIndicator as v } from "../drag/GroupingIndicator.mjs";
+import { useLocalization as G } from "@progress/kendo-react-intl";
+import { groupPanelAriaLabel as g, messages as u, groupPanelEmpty as m } from "../messages/index.mjs";
+import { GridContext as L } from "../GridClientWrapper.mjs";
+const b = (t) => {
+  const n = i.useContext(L), p = (r, e) => {
+    const o = t.group.slice();
+    o.splice(e, 1), n.groupChange(o, r);
+  }, d = (r, e, o, a) => {
+    const h = Object.assign({}, o, { dir: a }), s = t.group.slice();
+    s.splice(e, 1, h), n.groupChange(s, r);
+  }, l = G(), f = t.group || [], C = (r) => {
+    const e = t.columns.find((a) => a.field === r), o = e && (e.title || e.field);
+    return o === void 0 ? r : o;
+  }, c = f.map((r, e) => /* @__PURE__ */ i.createElement(
+    v,
     {
-      key: o,
-      index: o,
-      dir: a.dir || "asc",
-      title: e.resolveTitle(a.field),
-      onRemove: (n) => {
-        m(n, o);
+      key: e,
+      index: e,
+      dir: r.dir || "asc",
+      title: C(r.field),
+      onRemove: (o) => {
+        p(o, e);
       },
-      onSortChange: (n, t) => {
-        d(n, o, a, t);
+      onSortChange: (o, a) => {
+        d(o, e, r, a);
       },
-      onPress: e.pressHandler,
-      onDrag: e.dragHandler,
-      onRelease: e.releaseHandler,
-      onContextMenu: e.onContextMenu
+      onPress: n.dragLogicRef.current.pressHandler,
+      onDrag: n.dragLogicRef.current.dragHandler,
+      onRelease: n.dragLogicRef.current.releaseHandler,
+      onContextMenu: n.onContextMenu
     }
   ));
-  return /* @__PURE__ */ r.createElement(
+  return /* @__PURE__ */ i.createElement(
     "div",
     {
-      ref: e.refCallback,
+      ref: n.dragLogicRef.current.refGroupPanelDiv,
       className: "k-grouping-header",
       role: "toolbar",
-      "aria-label": l.toLanguageString(c, g[c]),
-      "aria-controls": e.ariaControls || ""
+      "aria-label": l.toLanguageString(g, u[g]),
+      "aria-controls": t.ariaControls || ""
     },
-    /* @__PURE__ */ r.createElement("div", { className: "k-chip-list k-chip-list-md", role: "none" }, i),
-    /* @__PURE__ */ r.createElement("div", { className: "k-grouping-drop-container" }, !i.length && l.toLanguageString(u, g[u]), " ")
+    /* @__PURE__ */ i.createElement("div", { className: "k-chip-list k-chip-list-md", role: "none" }, c),
+    /* @__PURE__ */ i.createElement("div", { className: "k-grouping-drop-container" }, !c.length && l.toLanguageString(m, u[m]), " ")
   );
 };
 export {
-  P as GroupPanel
+  b as GroupPanel
 };