@progress/kendo-react-grid 6.1.1 → 7.0.0-develop.10

package/index.mjs

@@ -0,0 +1,3814 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as l from "react";
+import * as p from "prop-types";
+import { guid as oe, Keys as me, IconWrap as O, classNames as y, getScrollbarWidth as St, kendoThemeMaps as K, Draggable as yt, dispatchEvent as ps, memoizeOne as B, validatePackage as us, shouldShowValidationUI as gs, canUseDOM as ot, setScrollbarWidth as lt, getter as ye, WatermarkOverlay as fs, toIconName as ms, clone as Cs } from "@progress/kendo-react-common";
+import { tableKeyboardNavigationTools as z, useTableKeyboardNavigation as q, TABLE_ROW_INDEX_ATTRIBUTE as bs, TABLE_COL_INDEX_ATTRIBUTE as xs, isRtl as wt, tableKeyboardNavigationHeaderAttributes as nt, ColumnResizer as ks, HeaderThElement as Rt, getIndex as at, tableKeyboardNavigation as X, getSelectionOptions as ht, mapColumns as vs, tableColumnsVirtualization as Es, Pager as Is, TableKeyboardNavigationContext as we, tableKeyboardNavigationScopeAttributes as ct, TableSelection as dt, tableKeyboardNavigationBodyAttributes as pt, DropClue as ut, DragClue as gt, updateLeft as Ss, updateRight as ys } from "@progress/kendo-react-data-tools";
+import { getSelectedState as Yr, getSelectedStateFromKeyDown as Jr, setSelectedState as Qr } from "@progress/kendo-react-data-tools";
+import { useLocalization as Ft, provideLocalizationService as T, registerForLocalization as G, useInternationalization as ws, registerForIntl as Nt } from "@progress/kendo-react-intl";
+import { minusIcon as Rs, plusIcon as Fs, moreVerticalIcon as Ns, sortAscSmallIcon as We, sortDescSmallIcon as Ve, filterIcon as Ke, filterClearIcon as Ds, xCircleIcon as Ms, caretAltDownIcon as Ts, caretAltLeftIcon as Gs, caretAltRightIcon as Hs, groupIcon as zs, ungroupIcon as Ls, searchIcon as Dt, xIcon as Os } from "@progress/kendo-svg-icons";
+import { NumericTextBox as Ue, TextBox as Mt, Input as Tt, Checkbox as fe, InputPrefix as _s } from "@progress/kendo-react-inputs";
+import { DatePicker as qe } from "@progress/kendo-react-dateinputs";
+import { Popup as Ps } from "@progress/kendo-react-popup";
+import { Button as W } from "@progress/kendo-react-buttons";
+import { DropDownList as le } from "@progress/kendo-react-dropdowns";
+import { isCompositeFilterDescriptor as ft, filterBy as mt } from "@progress/kendo-data-query";
+import { Reveal as As } from "@progress/kendo-react-animation";
+const ce = (r) => null;
+ce.displayName = "KendoReactGridColumn";
+ce.defaultProps = {
+  filterable: !0,
+  editable: !0,
+  sortable: !0,
+  resizable: !0,
+  reorderable: !0,
+  groupable: !0
+};
+ce.propTypes = {
+  field: p.string,
+  title: p.string,
+  editable: p.bool,
+  sortable: p.oneOfType([
+    p.bool,
+    p.shape({
+      allowUnsort: p.bool.isRequired
+    })
+  ]),
+  cell: p.any,
+  filterCell: p.any,
+  filterTitle: p.string,
+  filterable: p.bool,
+  filter: p.oneOf(["text", "numeric", "boolean", "date"]),
+  editor: p.oneOf(["text", "numeric", "boolean", "date"]),
+  width: p.oneOfType([p.string, p.number]),
+  minResizableWidth: p.number,
+  headerCell: p.any,
+  footerCell: p.any,
+  headerSelectionValue: p.bool,
+  format: p.string,
+  headerClassName: p.string,
+  className: p.string,
+  reorderable: p.bool,
+  resizable: p.bool,
+  orderIndex: p.number,
+  groupable: p.bool,
+  columnMenu: p.any,
+  locked: p.bool
+};
+function M(r, t) {
+  const s = (r || "").split(".");
+  let o = t;
+  return s.forEach((e) => {
+    o = o ? o[e] : void 0;
+  }), o;
+}
+function Gt(r, t, s, o, e, i, n = 0) {
+  let a = n;
+  for (let h = 0; h < t.length; h++) {
+    if (!e || t[h].value === void 0 || t[h].items === void 0) {
+      r[r.length] = {
+        dataIndex: o.index,
+        dataItem: t[h],
+        rowType: "data",
+        level: n,
+        expanded: i === void 0 || M(i, t[h])
+      }, o.index++;
+      continue;
+    }
+    a = Math.max(a, n + 1);
+    const c = i === void 0 || M(i, t[h]) === void 0 || M(i, t[h]);
+    r[r.length] = {
+      dataIndex: -1,
+      dataItem: t[h],
+      level: n,
+      rowType: "groupHeader",
+      expanded: c
+    }, c && (a = Math.max(
+      Gt(r, t[h].items, s, o, e, i, n + 1),
+      a
+    )), (s === "always" || c && s === "visible") && (r[r.length] = {
+      dataIndex: -1,
+      dataItem: t[h],
+      rowType: "groupFooter",
+      level: n,
+      expanded: c
+    });
+  }
+  return a;
+}
+function Ht(r, t, s, o = 0) {
+  let e = [];
+  if (!r)
+    return [];
+  r && r.length === void 0 && (r = [r]), r.forEach((n, a) => {
+    n = n.props ? n.props : n;
+    const h = t[a] || null, c = Ht(n.children, h && h.children || [], s, o + 1);
+    e.push(
+      Object.assign(
+        { depth: o },
+        ce.defaultProps,
+        c.length ? { cell: () => null, filterCell: () => null } : {},
+        h ? { width: h.width, orderIndex: h.orderIndex } : {},
+        n,
+        {
+          id: n.id ? n.id : z.generateNavigatableId(`${s.prevId++}`, s.idPrefix, "column"),
+          declarationIndex: e.length,
+          children: c,
+          rowSpan: 0,
+          colSpan: 0,
+          isAccessible: !0,
+          left: h && Math.floor(h.left),
+          right: h && Math.floor(h.right)
+        }
+      )
+    );
+  });
+  const i = (n, a) => n.orderIndex === a.orderIndex ? n.declarationIndex - a.declarationIndex : (n.orderIndex || 0) - (a.orderIndex || 0);
+  if (e.sort(i), o === 0) {
+    let n = [];
+    const a = (h, c) => h.forEach((d) => {
+      d.parentIndex = c, a(d.children, n.push(d) - 1);
+    });
+    return a(e, -1), n;
+  }
+  return e;
+}
+function Bs(r, t, s, o) {
+  let e = [];
+  Array.isArray(r) ? e = r : r && (e = r.data);
+  const i = [];
+  if (e.length > 0) {
+    let n = e[0];
+    if (t)
+      for (let h = 0; h < t.length; h++)
+        n = n.items && n.items[0];
+    Object.getOwnPropertyNames(n).forEach((h) => {
+      h !== s && i.push(Object.assign(
+        {
+          id: z.generateNavigatableId(`${o.prevId++}`, o.idPrefix, "column"),
+          declarationIndex: -1,
+          parentIndex: -1,
+          depth: 0,
+          colSpan: 0,
+          rowSpan: 0,
+          index: 0,
+          left: 0,
+          right: 0,
+          rightBorder: !1,
+          children: [],
+          ariaColumnIndex: 0,
+          isAccessible: !0
+        },
+        ce.defaultProps,
+        { field: h }
+      ));
+    });
+  }
+  return i;
+}
+const Ws = (r, t) => {
+  let s = r[t.parentIndex];
+  for (; s; ) {
+    if (s.footerCell)
+      return !0;
+    s = r[s.parentIndex];
+  }
+  return !1;
+}, Vs = (r) => r.filter((t) => Ws(r, t) ? !1 : !!t.footerCell || !(t.children && t.children.length > 0)), Se = (r) => r.width !== void 0 ? Math.floor(parseFloat(r.width.toString())) + "px" : void 0, zt = (r) => (r.sort((t, s) => t.declarationIndex - s.declarationIndex), r.map((t) => {
+  const {
+    declarationIndex: s,
+    parentIndex: o,
+    depth: e,
+    colSpan: i,
+    rowSpan: n,
+    index: a,
+    kFirst: h,
+    children: c,
+    ...d
+  } = t;
+  return c.length ? {
+    children: zt(c),
+    ...d
+  } : d;
+})), Re = typeof window < "u" && /Firefox/.test(window.navigator.userAgent), Ct = 17895697, Ce = (r, t) => {
+  if (!(!r && !t))
+    return t ? r ? {
+      ...r,
+      ...t,
+      select: {
+        ...r.select || {},
+        ...t.select || {}
+      },
+      hierarchy: {
+        ...r.hierarchy || {},
+        ...t.hierarchy || {}
+      },
+      group: {
+        ...r.group || {},
+        ...t.group || {}
+      },
+      edit: {
+        ...r.edit || {},
+        ...t.edit || {}
+      }
+    } : t : r;
+}, Ks = (r) => {
+  const t = l.useCallback(
+    (d) => {
+      r.selectionChange && r.selectionChange({ syntheticEvent: d });
+    },
+    [r.selectionChange]
+  ), s = l.useMemo(() => oe(), []), o = M(r.field, r.dataItem), e = q(r.id);
+  let i = {
+    colSpan: r.colSpan,
+    style: r.style,
+    className: r.className,
+    ["aria-colindex"]: r.ariaColumnIndex,
+    role: "gridcell",
+    ...e
+  }, n = [
+    /* @__PURE__ */ l.createElement(
+      "input",
+      {
+        key: "1",
+        checked: typeof o == "boolean" && o,
+        id: s,
+        type: "checkbox",
+        className: "k-checkbox k-checkbox-md k-rounded-md",
+        onChange: t
+      }
+    ),
+    /* @__PURE__ */ l.createElement("label", { className: "k-checkbox-label", htmlFor: s, key: "2" })
+  ];
+  const a = r.rowType !== "groupHeader" ? /* @__PURE__ */ l.createElement(
+    "td",
+    {
+      ...i
+    },
+    n
+  ) : null, h = r.rowType || "data", c = r.cells;
+  if (c && c.select && c.select[h]) {
+    const d = c.select[h];
+    return /* @__PURE__ */ l.createElement(d, { ...r, tdProps: i }, n);
+  }
+  return r.render ? r.render.call(void 0, a, r) : a;
+}, Fe = "grid.noRecords", Us = "grid.pagerInfo", qs = "grid.pagerFirstPage", $s = "grid.pagerPreviousPage", js = "grid.pagerNextPage", Xs = "grid.pagerLastPage", Ys = "grid.pagerItemsPerPage", Js = "grid.pagerPage", Qs = "grid.pagerPageSizeAriaLabel", Zs = "grid.pagerOf", er = "grid.pagerTotalPages", Ne = "grid.groupPanelEmpty", Lt = "grid.groupColumn", Ot = "grid.ungroupColumn", De = "grid.columnMenu", U = "grid.filterClearButton", ne = "grid.filterSubmitButton", ae = "grid.filterTitle", Me = "grid.sortAscending", Te = "grid.sortDescending", Ge = "grid.searchPlaceholder", He = "grid.filterCheckAll", ze = "grid.filterChooseOperator", Le = "grid.filterSelectedItems", Oe = "grid.sortAriaLabel", _e = "grid.filterAriaLabel", Pe = "grid.groupPanelAriaLabel", _t = "grid.groupExpand", Pt = "grid.groupCollapse", At = "grid.detailExpand", Bt = "grid.detailCollapse", v = {
+  [At]: "Expand detail row",
+  [Bt]: "Collapse detail row",
+  [_t]: "Expand group",
+  [Pt]: "Collapse Group",
+  [Fe]: "No records available",
+  [Ne]: "Drag a column header and drop it here to group by that column",
+  [U]: "Clear",
+  [ne]: "Filter",
+  [ae]: "Filter",
+  [Me]: "Sort Ascending",
+  [Te]: "Sort Descending",
+  [Oe]: "Sortable",
+  [Lt]: "Group Column",
+  [Ot]: "Ungroup Column",
+  [De]: "Column menu",
+  [Ys]: "items per page",
+  [Us]: "{0} - {1} of {2} items",
+  [qs]: "Go to the first page",
+  [$s]: "Go to the previous page",
+  [js]: "Go to the next page",
+  [Xs]: "Go to the last page",
+  [Js]: "Page",
+  [Qs]: "Page size",
+  [Zs]: "of",
+  [er]: "{0}",
+  [Ge]: "Search",
+  [He]: "Check All",
+  [ze]: "Choose Operator",
+  [Le]: "selected items",
+  [_e]: "Filter",
+  [Pe]: "Group panel",
+  "grid.filterEqOperator": "Is equal to",
+  "grid.filterNotEqOperator": "Is not equal to",
+  "grid.filterIsNullOperator": "Is null",
+  "grid.filterIsNotNullOperator": "Is not null",
+  "grid.filterIsEmptyOperator": "Is empty",
+  "grid.filterIsNotEmptyOperator": "Is not empty",
+  "grid.filterStartsWithOperator": "Starts with",
+  "grid.filterContainsOperator": "Contains",
+  "grid.filterNotContainsOperator": "Does not contain",
+  "grid.filterEndsWithOperator": "Ends with",
+  "grid.filterGteOperator": "Is greater than or equal to",
+  "grid.filterGtOperator": "Is greater than",
+  "grid.filterLteOperator": "Is less than or equal to",
+  "grid.filterLtOperator": "Is less than",
+  "grid.filterIsTrue": "Is true",
+  "grid.filterIsFalse": "Is false",
+  "grid.filterBooleanAll": "(All)",
+  "grid.filterAfterOrEqualOperator": "Is after or equal to",
+  "grid.filterAfterOperator": "Is after",
+  "grid.filterBeforeOperator": "Is before",
+  "grid.filterBeforeOrEqualOperator": "Is before or equal to",
+  "grid.filterAndLogic": "And",
+  "grid.filterOrLogic": "Or"
+};
+function tr(r) {
+  const t = r.replace(/^pager\.([a-z])/, (s, o) => "grid.pager" + o.toUpperCase());
+  return { messageKey: t, defaultMessage: v[t] };
+}
+const sr = (r) => {
+  let t = null, s = null, o = null;
+  const e = M(r.field, r.dataItem), i = q(r.id), n = Ft(), a = l.useCallback(
+    (d) => {
+      d.isDefaultPrevented() || d.keyCode === me.enter && r.onChange && (d.preventDefault(), r.onChange({
+        dataItem: r.dataItem,
+        dataIndex: r.dataIndex,
+        syntheticEvent: d,
+        field: r.field,
+        value: !e
+      }));
+    },
+    [r.dataItem, r.dataIndex, r.field, r.onChange, e]
+  );
+  if (r.rowType === "groupFooter")
+    s = {
+      className: "k-table-td k-hierarchy-cell",
+      role: "gridcell",
+      ...i
+    }, t = /* @__PURE__ */ l.createElement(
+      "td",
+      {
+        ...s
+      }
+    );
+  else if (r.rowType !== "groupHeader") {
+    const d = e ? Bt : At, g = n.toLanguageString(d, v[d]);
+    s = {
+      className: "k-table-td k-hierarchy-cell",
+      onKeyDown: a,
+      "aria-expanded": !!e,
+      role: "gridcell",
+      "aria-colindex": r.ariaColumnIndex,
+      ...i
+    }, o = /* @__PURE__ */ l.createElement(
+      "a",
+      {
+        onClick: (m) => {
+          m.preventDefault(), r.onChange && r.onChange({
+            dataItem: r.dataItem,
+            dataIndex: r.dataIndex,
+            syntheticEvent: m,
+            field: r.field,
+            value: !e
+          });
+        },
+        "aria-label": g,
+        href: "#",
+        tabIndex: -1
+      },
+      /* @__PURE__ */ l.createElement(O, { name: e ? "minus" : "plus", icon: e ? Rs : Fs })
+    ), t = /* @__PURE__ */ l.createElement(
+      "td",
+      {
+        ...s
+      },
+      o
+    );
+  }
+  const h = r.rowType || "data", c = r.cells;
+  if (c && c.hierarchy && c.hierarchy[h]) {
+    const d = c.hierarchy[h];
+    return /* @__PURE__ */ l.createElement(d, { ...r, tdProps: s }, o);
+  }
+  return r.render ? r.render.call(void 0, t, r) : t;
+}, rr = bs, re = xs, ir = (r) => {
+  const t = M(r.field, r.dataItem);
+  let s = null;
+  const o = y("k-table-td", "k-grid-edit-cell", {
+    ["k-selected"]: r.isSelected
+  }, r.className), e = l.useMemo(() => oe(), []), i = q(r.id);
+  let n = null, a = null;
+  const h = l.useCallback(
+    (u) => {
+      if (r.onChange) {
+        const b = u.target.type === "checkbox" ? u.target.checked : u.target.value;
+        r.onChange({
+          dataItem: r.dataItem,
+          dataIndex: r.dataIndex,
+          field: r.field,
+          syntheticEvent: u,
+          value: b
+        });
+      }
+    },
+    [r.onChange, r.dataItem, r.dataIndex, r.field]
+  ), c = l.useCallback((u) => {
+    r.onContextMenu && r.onContextMenu.call(void 0, u, r.dataItem, r.field);
+  }, [r.onContextMenu, r.dataItem, r.field]), d = l.useCallback(
+    (u) => {
+      r.onChange && r.onChange({
+        dataItem: r.dataItem,
+        dataIndex: r.dataIndex,
+        field: r.field,
+        syntheticEvent: u.syntheticEvent,
+        value: u.value
+      });
+    },
+    [r.onChange, r.dataItem, r.dataIndex, r.field]
+  );
+  switch (r.editor) {
+    case "numeric": {
+      n = {
+        onContextMenu: c,
+        colSpan: r.colSpan,
+        style: r.style,
+        className: o,
+        ["aria-colindex"]: r.ariaColumnIndex,
+        ["aria-selected"]: r.isSelected,
+        [re]: r.columnIndex,
+        role: "gridcell",
+        ...i
+      }, a = /* @__PURE__ */ l.createElement(
+        Ue,
+        {
+          width: "100%",
+          value: t === void 0 ? null : t,
+          onChange: d
+        }
+      ), s = /* @__PURE__ */ l.createElement(
+        "td",
+        {
+          ...n
+        },
+        a
+      );
+      break;
+    }
+    case "date":
+      n = {
+        onContextMenu: c,
+        colSpan: r.colSpan,
+        style: r.style,
+        className: o,
+        ["aria-colindex"]: r.ariaColumnIndex,
+        ["aria-selected"]: r.isSelected,
+        [re]: r.columnIndex,
+        role: "gridcell",
+        ...i
+      }, a = /* @__PURE__ */ l.createElement(
+        qe,
+        {
+          width: "100%",
+          value: t,
+          onChange: d
+        }
+      ), s = /* @__PURE__ */ l.createElement(
+        "td",
+        {
+          ...n
+        },
+        a
+      );
+      break;
+    case "boolean":
+      n = {
+        onContextMenu: c,
+        colSpan: r.colSpan,
+        style: r.style,
+        className: o,
+        ["aria-colindex"]: r.ariaColumnIndex,
+        ["aria-selected"]: r.isSelected,
+        [re]: r.columnIndex,
+        role: "gridcell",
+        ...i
+      }, a = [
+        /* @__PURE__ */ l.createElement(
+          "input",
+          {
+            checked: t || !1,
+            id: e,
+            type: "checkbox",
+            className: "k-checkbox k-checkbox-md k-rounded-md",
+            onChange: h,
+            key: 1
+          }
+        ),
+        /* @__PURE__ */ l.createElement("label", { className: "k-checkbox-label", htmlFor: e, key: 2 })
+      ], s = /* @__PURE__ */ l.createElement(
+        "td",
+        {
+          ...n
+        },
+        a
+      );
+      break;
+    default:
+      n = {
+        onContextMenu: c,
+        colSpan: r.colSpan,
+        style: r.style,
+        className: o,
+        ["aria-colindex"]: r.ariaColumnIndex,
+        ["aria-selected"]: r.isSelected,
+        [re]: r.columnIndex,
+        role: "gridcell",
+        ...i
+      }, a = /* @__PURE__ */ l.createElement(
+        "input",
+        {
+          style: { width: "100%" },
+          className: "k-input",
+          value: t || "",
+          onChange: h
+        }
+      ), s = /* @__PURE__ */ l.createElement(
+        "td",
+        {
+          ...n
+        },
+        a
+      );
+  }
+  const g = r.editor || "text", m = r.cells;
+  if (m && m.edit && m.edit[g]) {
+    const u = m.edit[g];
+    return /* @__PURE__ */ l.createElement(u, { ...r, tdProps: n }, a);
+  }
+  return r.render ? r.render.call(void 0, s, r) : s;
+};
+class or extends l.Component {
+  constructor() {
+    super(...arguments), this.headerWrap = null, this.table = null, this.syncScroll = !1, this.scrollbarWidth = St(), this.onScroll = (t) => {
+      if (this.syncScroll) {
+        this.syncScroll = !1;
+        return;
+      }
+      if (!this.headerWrap)
+        return;
+      const s = this.headerWrap.scrollLeft, o = this.props.scrollableDataElement();
+      o && o.scrollLeft !== s && (o.scrollLeft = s);
+    };
+  }
+  get element() {
+    return this.props.elemRef.current;
+  }
+  componentDidMount() {
+    const t = wt(this.element);
+    this.props.columnResize && this.props.columnResize.setIsRtl(t), this.forceUpdate();
+  }
+  /**
+   *
+   * @param scrollLeft - Scrolls to the left (in pixels).
+   */
+  setScrollLeft(t) {
+    this.headerWrap && this.headerWrap.scrollLeft !== t && (this.syncScroll = !0, this.headerWrap.scrollLeft = t);
+  }
+  /**
+   *
+   * @param width - Scrolls the width (in pixels).
+   */
+  setWidth(t) {
+    this.table && (this.table.style.width = t + "px");
+  }
+  render() {
+    return this.props.staticHeaders ? /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        ref: this.props.elemRef,
+        className: y(
+          "k-grid-header",
+          { "k-grid-draggable-header": this.props.draggable }
+        ),
+        role: "presentation"
+      },
+      /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          ref: (t) => {
+            this.headerWrap = t;
+          },
+          className: "k-grid-header-wrap",
+          style: this.scrollbarWidth ? {} : { borderWidth: 0 },
+          onScroll: this.onScroll,
+          role: "presentation"
+        },
+        /* @__PURE__ */ l.createElement(
+          "table",
+          {
+            ref: (t) => {
+              this.table = t;
+            },
+            className: y(
+              "k-table k-grid-header-table",
+              {
+                "k-table-md": !this.props.size,
+                [`k-table-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+              },
+              this.props.className
+            ),
+            role: "presentation"
+          },
+          /* @__PURE__ */ l.createElement("colgroup", { ref: (t) => {
+            this.props.columnResize.colGroupHeader = t;
+          } }, this.props.cols),
+          /* @__PURE__ */ l.createElement("thead", { className: "k-table-thead", role: "rowgroup", ...nt }, this.props.headerRow, this.props.filterRow)
+        )
+      )
+    ) : /* @__PURE__ */ l.createElement(
+      "thead",
+      {
+        role: "presentation",
+        className: y(
+          "k-table-thead",
+          { "k-grid-draggable-header": this.props.draggable }
+        ),
+        ...nt
+      },
+      this.props.headerRow,
+      this.props.filterRow
+    );
+  }
+}
+const Wt = (...r) => Object.assign({ allowUnsort: !0, mode: "single" }, ...r);
+class lr extends l.PureComponent {
+  constructor() {
+    super(...arguments), this.draggable = null, this.onPress = (t) => {
+      const s = this.draggable && this.draggable.element;
+      s && this.props.pressHandler && this.props.pressHandler(t.event, s);
+    }, this.onDrag = (t) => {
+      const s = this.draggable && this.draggable.element;
+      s && this.props.dragHandler && this.props.dragHandler(t.event, s);
+    }, this.onRelease = (t) => {
+      this.draggable && this.draggable.element && this.props.releaseHandler && this.props.releaseHandler(t.event);
+    };
+  }
+  render() {
+    return /* @__PURE__ */ l.createElement(
+      yt,
+      {
+        onPress: this.onPress,
+        onDrag: this.onDrag,
+        onRelease: this.onRelease,
+        hint: this.props.dragClue,
+        autoScroll: { boundaryElementRef: this.props.headerRef, direction: { horizontal: !0, vertical: !1 } },
+        scrollContainer: this.props.containerRef || void 0,
+        ref: (t) => {
+          this.draggable = t;
+        }
+      },
+      /* @__PURE__ */ l.createElement("tr", { className: "k-table-row", style: { touchAction: "none" }, role: "row", "aria-rowindex": this.props.ariaRowIndex }, this.props.children)
+    );
+  }
+}
+class Vt extends l.Component {
+  constructor() {
+    super(...arguments), this.state = {
+      show: !1
+    }, this._anchor = null, this._content = null, this.blurTimeout = void 0, this.willBlur = !1, this.blur = () => {
+      if (this.willBlur) {
+        this.willBlur = !1;
+        return;
+      }
+      clearTimeout(this.blurTimeout), this.blurTimeout = window.setTimeout(() => {
+        this.closeMenu();
+      });
+    }, this.focus = () => {
+      clearTimeout(this.blurTimeout);
+    }, this.anchorClick = (t) => {
+      t.preventDefault(), this.setState(
+        {
+          show: !this.state.show
+        },
+        () => this.state.show && this._content && this._content.focus()
+      );
+    }, this.closeMenu = () => {
+      this.setState({ show: !1 });
+    }, this.onAnchorMouseDown = (t) => {
+      this.willBlur = this.state.show && t.currentTarget === this._anchor;
+    }, this.onAnchorKeyDown = (t) => {
+      var s;
+      if (t.keyCode === me.tab) {
+        const o = t.target, e = o && ((s = o.closest(".k-grid")) == null ? void 0 : s.getElementsByClassName("k-grid-content")[0]);
+        e && e.scrollWidth > e.clientWidth && o.scrollIntoView({ inline: "center" });
+      }
+    };
+  }
+  render() {
+    const { columnMenu: t, ...s } = this.props, { column: o } = this.props, e = T(this), i = o.title || o.field, n = i ? `${i} ` : "";
+    return /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(
+      "a",
+      {
+        className: "k-grid-header-menu k-grid-column-menu",
+        ref: (a) => this._anchor = a,
+        onClick: this.anchorClick,
+        onMouseDown: this.onAnchorMouseDown,
+        onKeyDown: this.onAnchorKeyDown,
+        href: "#",
+        "aria-label": `${n}${e.toLanguageString(De, v[De])}`
+      },
+      /* @__PURE__ */ l.createElement(O, { name: "more-vertical", icon: Ns })
+    ), /* @__PURE__ */ l.createElement(
+      Ps,
+      {
+        anchor: this._anchor,
+        show: this.state.show
+      },
+      /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          ref: (a) => this._content = a,
+          className: "k-grid-columnmenu-popup",
+          tabIndex: 0,
+          onBlur: this.blur,
+          onFocus: this.focus,
+          style: { outline: "none" }
+        },
+        t && /* @__PURE__ */ l.createElement(
+          t,
+          {
+            ...s,
+            onCloseMenu: this.closeMenu
+          }
+        )
+      )
+    ));
+  }
+}
+class nr extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    const { columnMenuWrapperProps: t } = this.props, s = this.props.onClick ? {
+      onClick: this.props.onClick
+    } : {}, o = /* @__PURE__ */ l.createElement("span", { className: "k-cell-inner" }, /* @__PURE__ */ l.createElement(
+      "span",
+      {
+        className: y(
+          "k-link",
+          {
+            "!k-cursor-default": !this.props.columnMenuWrapperProps.sortable
+          }
+        ),
+        ...s
+      },
+      /* @__PURE__ */ l.createElement("span", { className: "k-column-title" }, this.props.title || this.props.field || " "),
+      this.props.children
+    ), t.columnMenu && /* @__PURE__ */ l.createElement(Vt, { ...t }));
+    return this.props.render ? this.props.render.call(void 0, o, this.props) : o;
+  }
+}
+const ar = {
+  true: { asc: "desc", desc: "", "": "asc" },
+  false: { asc: "desc", desc: "asc", "": "asc" }
+}, hr = {
+  none: "none",
+  asc: "ascending",
+  desc: "descending"
+};
+class Kt extends l.Component {
+  constructor(t) {
+    super(t), this.serviceIndex = 0, this.index = -1, this.cellKeyDown = (s, o) => {
+      s.isDefaultPrevented() || s.keyCode === me.enter && this.cellClick(s, o);
+    }, this.cells = (s) => s.map((o) => {
+      const e = this.props.columns[o], i = this.props.sortable && e.sortable, n = this.props.sort ? this.props.sort.findIndex((k) => k.field === e.field) : -1, a = n >= 0 && this.props.sort[n].dir || "none", h = e.columnMenu === null ? null : e.columnMenu || this.props.columnMenu, c = y({
+        "k-first": e.kFirst,
+        "k-filterable": !!h,
+        "k-table-th": !0,
+        "k-header": !0,
+        "k-grid-header-sticky": e.locked,
+        "k-sorted": this.props.sort && this.props.sort.some((k) => k.field === e.field)
+      }, e.headerClassName), d = e.left !== void 0 ? this.props.isRtl ? { left: e.right, right: e.left } : { left: e.left, right: e.right } : {}, g = T(this).toLanguageString(Oe, v[Oe]);
+      let m = e.isAccessible ? {
+        ariaSort: hr[a],
+        role: "columnheader",
+        ariaColumnIndex: e.ariaColumnIndex,
+        ariaSelected: !1,
+        ariaDescription: i ? g : ""
+      } : {
+        role: "presentation"
+      };
+      const u = e.declarationIndex >= 0 ? ++this.index : --this.serviceIndex, b = e.headerCell ? e.headerCell : nr, E = /* @__PURE__ */ l.createElement(
+        b,
+        {
+          key: 1,
+          field: e.field,
+          onClick: i && ((k) => this.cellClick(k, e)) || void 0,
+          selectionChange: this.props.selectionChange,
+          title: e.title,
+          selectionValue: e.headerSelectionValue,
+          render: this.props.cellRender,
+          children: this.sortIcon(n),
+          columnMenuWrapperProps: {
+            column: {
+              field: e.field,
+              title: e.title,
+              locked: e.locked,
+              filter: e.filter,
+              id: e.id
+            },
+            sortable: i && this.props.sortable,
+            sort: this.props.sort,
+            onSortChange: this.props.sortChange,
+            filter: this.props.filter,
+            filterable: this.props.filterable && e.filterable,
+            filterOperators: this.props.filterOperators,
+            onFilterChange: this.props.filterChange,
+            group: this.props.group,
+            groupable: this.props.groupable,
+            onGroupChange: this.props.groupChange,
+            columnMenu: h
+          }
+        }
+      ), C = {
+        ...m,
+        key: u,
+        colSpan: e.colSpan,
+        rowSpan: e.rowSpan,
+        className: c,
+        style: d,
+        columnId: e.id,
+        navigatable: e.navigatable,
+        onKeyDown: i && ((k) => this.cellKeyDown(k, e)) || void 0,
+        role: "columnheader"
+      }, x = [
+        E,
+        this.props.columnResize && this.props.columnResize.resizable && e.resizable && /* @__PURE__ */ l.createElement(
+          ks,
+          {
+            key: 2,
+            resize: (k, _, D) => this.props.columnResize && this.props.columnResize.dragHandler(k, e, _, D),
+            autofit: (k) => this.props.columnResize && this.props.columnResize.dblClickHandler(k, [e.id])
+          }
+        )
+      ], I = Ce(this.props.cells, e.cells);
+      if (I && I.headerCell) {
+        const k = I.headerCell;
+        return /* @__PURE__ */ l.createElement(k, { key: u, thProps: C, index: o }, x);
+      }
+      return /* @__PURE__ */ l.createElement(
+        Rt,
+        {
+          ...C,
+          key: u
+        },
+        x
+      );
+    }), this.cellClick = this.cellClick.bind(this);
+  }
+  cellClick(t, s) {
+    if (t.preventDefault(), !this.props.sortChange)
+      return;
+    const { allowUnsort: o, mode: e } = Wt(this.props.sortable || !1, s.sortable || !1), i = (this.props.sort || []).filter((h) => h.field === s.field)[0], n = ar[o][i && i.dir || ""], a = e === "single" ? [] : (this.props.sort || []).filter((h) => h.field !== s.field);
+    n !== "" && s.field && a.push({ field: s.field, dir: n }), this.props.sortChange(a, t);
+  }
+  sortIcon(t) {
+    return this.props.sort ? t >= 0 && [
+      /* @__PURE__ */ l.createElement("span", { key: 1, className: "k-sort-icon" }, /* @__PURE__ */ l.createElement(
+        O,
+        {
+          name: "sort-" + this.props.sort[t].dir + "-small",
+          icon: this.props.sort[t].dir === "asc" ? We : Ve
+        }
+      )),
+      this.props.sort.length > 1 && /* @__PURE__ */ l.createElement("span", { key: 2, className: "k-sort-icon" }, /* @__PURE__ */ l.createElement("span", { className: "k-sort-order" }, t + 1))
+    ] : null;
+  }
+  render() {
+    return this.serviceIndex = 0, this.index = -1, this.props.columnsMap.map((t, s) => this.props.pressHandler && /* @__PURE__ */ l.createElement(
+      lr,
+      {
+        key: s,
+        pressHandler: this.props.pressHandler,
+        dragHandler: this.props.dragHandler,
+        releaseHandler: this.props.releaseHandler,
+        ariaRowIndex: s + 1,
+        dragClue: this.props.dragClue,
+        headerRef: this.props.headerRef,
+        containerRef: this.props.containerRef
+      },
+      this.cells(t)
+    ) || /* @__PURE__ */ l.createElement("tr", { key: s, className: "k-table-row", role: "row", "aria-rowindex": s + 1 }, this.cells(t)));
+  }
+}
+G(Kt);
+const cr = [
+  { text: "grid.filterAndLogic", operator: "and" },
+  { text: "grid.filterOrLogic", operator: "or" }
+], bt = {
+  text: [
+    { text: "grid.filterContainsOperator", operator: "contains" },
+    { text: "grid.filterNotContainsOperator", operator: "doesnotcontain" },
+    { text: "grid.filterEqOperator", operator: "eq" },
+    { text: "grid.filterNotEqOperator", operator: "neq" },
+    { text: "grid.filterStartsWithOperator", operator: "startswith" },
+    { text: "grid.filterEndsWithOperator", operator: "endswith" },
+    { text: "grid.filterIsNullOperator", operator: "isnull" },
+    { text: "grid.filterIsNotNullOperator", operator: "isnotnull" },
+    { text: "grid.filterIsEmptyOperator", operator: "isempty" },
+    { text: "grid.filterIsNotEmptyOperator", operator: "isnotempty" }
+  ],
+  numeric: [
+    { text: "grid.filterEqOperator", operator: "eq" },
+    { text: "grid.filterNotEqOperator", operator: "neq" },
+    { text: "grid.filterGteOperator", operator: "gte" },
+    { text: "grid.filterGtOperator", operator: "gt" },
+    { text: "grid.filterLteOperator", operator: "lte" },
+    { text: "grid.filterLtOperator", operator: "lt" },
+    { text: "grid.filterIsNullOperator", operator: "isnull" },
+    { text: "grid.filterIsNotNullOperator", operator: "isnotnull" }
+  ],
+  date: [
+    { text: "grid.filterEqOperator", operator: "eq" },
+    { text: "grid.filterNotEqOperator", operator: "neq" },
+    { text: "grid.filterAfterOrEqualOperator", operator: "gte" },
+    { text: "grid.filterAfterOperator", operator: "gt" },
+    { text: "grid.filterBeforeOperator", operator: "lt" },
+    { text: "grid.filterBeforeOrEqualOperator", operator: "lte" },
+    { text: "grid.filterIsNullOperator", operator: "isnull" },
+    { text: "grid.filterIsNotNullOperator", operator: "isnotnull" }
+  ],
+  boolean: [
+    { text: "grid.filterEqOperator", operator: "eq" }
+  ]
+}, L = (r) => r === "isnull" || r === "isnotnull" || r === "isempty" || r === "isnotempty", ie = (r, t) => r.map((s) => ({
+  text: t.toLanguageString(s.text, v[s.text]),
+  operator: s.operator
+})), dr = "eq", Ut = [
+  { text: "grid.filterBooleanAll", operator: "" },
+  { text: "grid.filterIsTrue", operator: !0 },
+  { text: "grid.filterIsFalse", operator: !1 }
+], pr = {
+  text: !1,
+  numeric: !1,
+  date: !1,
+  boolean: !0
+}, qt = (r, t, s) => {
+  const o = $t(s.operators);
+  let e = s.operator;
+  switch (s.filterType) {
+    case "numeric":
+      (!e || L(e)) && (e = o), r === null && e === o && (e = "");
+      break;
+    case "date":
+      (!e || L(e)) && (e = o), r === null && e === o && (e = "");
+      break;
+    case "text":
+      (!e || L(e)) && (e = o), !r && e === o && (e = "");
+      break;
+    default:
+      return;
+  }
+  s.onChange({ value: r, operator: e, syntheticEvent: t });
+}, $t = (r, t) => t ? r[t][0].operator : r[0].operator, Ae = (r) => r || "text", jt = (r, t) => {
+  const s = r.target.value;
+  t({
+    value: s.operator,
+    operator: s.operator === "" ? "" : dr,
+    syntheticEvent: r.syntheticEvent
+  });
+}, Xt = (r, t, s) => {
+  let o = t;
+  const e = r.target.value;
+  r.target.state.opened && (L(e.operator) && (o = null), t === null && !L(e.operator) && (o = void 0), s({ value: o, operator: e.operator, syntheticEvent: r.syntheticEvent }));
+};
+class Yt extends l.Component {
+  constructor(t) {
+    super(t), this._inputRef = l.createRef(), this.renderOperatorEditor = (s) => {
+      if (this.props.filterType === "boolean")
+        return;
+      const o = this.props.operators.find((e) => e.operator === this.props.operator) || null;
+      return /* @__PURE__ */ l.createElement(
+        le,
+        {
+          size: this.props.size,
+          value: o,
+          onChange: this.operatorChange,
+          className: "k-dropdown-operator",
+          iconClassName: "k-i-filter k-icon",
+          svgIcon: Ke,
+          data: this.props.operators,
+          textField: "text",
+          title: s.toLanguageString(ze, v[ze]),
+          popupSettings: {
+            width: ""
+          }
+        }
+      );
+    }, this.inputChange = this.inputChange.bind(this), this.clear = this.clear.bind(this), this.operatorChange = this.operatorChange.bind(this), this.boolDropdownChange = this.boolDropdownChange.bind(this);
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const t = T(this), s = /* @__PURE__ */ l.createElement("div", { className: "k-filtercell" }, /* @__PURE__ */ l.createElement("div", { className: "k-filtercell-wrapper" }, this.filterComponent(this.props.filterType, this.props.value, this.props.booleanValues), /* @__PURE__ */ l.createElement("div", { className: "k-filtercell-operator" }, this.renderOperatorEditor(t), " ", /* @__PURE__ */ l.createElement(
+      W,
+      {
+        size: this.props.size,
+        icon: "filter-clear",
+        svgIcon: Ds,
+        className: y({
+          "k-clear-button-visible": !!(!(this.props.value === null || this.props.value === "") || this.props.operator)
+        }),
+        title: t.toLanguageString(U, v[U]),
+        type: "button",
+        onClick: this.clear,
+        disabled: !(!(this.props.value === null || this.props.value === "") || this.props.operator)
+      }
+    ))));
+    return this.props.render ? this.props.render.call(void 0, s, this.props) : s;
+  }
+  inputChange(t, s) {
+    qt(t, s, this.props);
+  }
+  operatorChange(t) {
+    Xt(t, this.props.value, this.props.onChange);
+  }
+  boolDropdownChange(t) {
+    jt(t, this.props.onChange);
+  }
+  clear(t) {
+    t.preventDefault(), this.props.onChange({ value: "", operator: "", syntheticEvent: t }), this._inputRef.current && (this._inputRef.current.element.value = "", setTimeout(() => {
+      this._inputRef.current.element.focus();
+    }, 0));
+  }
+  filterComponent(t, s, o) {
+    switch (t) {
+      case "numeric":
+        return /* @__PURE__ */ l.createElement(
+          Ue,
+          {
+            ref: this._inputRef,
+            size: this.props.size,
+            value: s,
+            onChange: (e) => {
+              this.inputChange(e.value, e.syntheticEvent);
+            },
+            title: this.props.title,
+            ariaLabel: this.props.ariaLabel
+          }
+        );
+      case "date":
+        return /* @__PURE__ */ l.createElement(
+          qe,
+          {
+            ref: this._inputRef,
+            size: this.props.size,
+            value: s,
+            onChange: (e) => {
+              this.inputChange(e.value, e.syntheticEvent);
+            },
+            title: this.props.title,
+            ariaLabel: this.props.ariaLabel
+          }
+        );
+      case "boolean": {
+        const e = (i) => i == null;
+        return /* @__PURE__ */ l.createElement(
+          le,
+          {
+            ref: this._inputRef,
+            size: this.props.size,
+            onChange: this.boolDropdownChange,
+            value: o.find((i) => i.operator === (e(s) ? "" : s)),
+            data: o,
+            textField: "text",
+            title: this.props.title,
+            ariaLabel: this.props.ariaLabel
+          }
+        );
+      }
+      default:
+        return /* @__PURE__ */ l.createElement(
+          Mt,
+          {
+            ref: this._inputRef,
+            size: this.props.size,
+            value: s || "",
+            onChange: (e) => {
+              this.inputChange(e.target.value, e.syntheticEvent);
+            },
+            title: this.props.title,
+            "aria-label": this.props.ariaLabel
+          }
+        );
+    }
+  }
+}
+G(Yt);
+const ur = "k-table-row k-filter-row";
+class Jt extends l.Component {
+  headerCellClassName(t, s) {
+    let o = `${s ? "k-grid-header-sticky" : ""}`;
+    return this.props.sort && this.props.sort.filter((e) => e.field === t).length > 0 && (o += " k-sorted"), o;
+  }
+  setFilter(t, s, o, e) {
+    if (!this.props.filterChange)
+      return;
+    const i = [];
+    (t !== "" && t !== null || s !== "") && i.push({
+      field: o,
+      operator: s,
+      value: t
+    }), this.props.filter && this.props.filter.filters && (this.props.filter.filters || []).forEach((h) => {
+      const c = h;
+      c && c.field !== o && i.push(c);
+    });
+    const n = this.props.filter && this.props.filter.logic ? this.props.filter.logic : "and";
+    this.props.filterChange(i.length > 0 ? { logic: n, filters: i } : null, e);
+  }
+  render() {
+    const t = T(this), s = this.props.filter && this.props.filter.filters || [], o = (a) => {
+      if (a === void 0)
+        return;
+      const h = s.filter((c) => c.field === a);
+      return h.length ? h[0] : void 0;
+    };
+    let e = 0, i = -1;
+    const n = this.props.columns.filter((a) => a.children.length === 0).map(
+      (a) => {
+        const h = Ae(a.filter), c = o(a.field), d = a.filterable ? t.toLanguageString(_e, v[_e]) : void 0;
+        let g = c && c.value;
+        g === void 0 && (g = h === "text" ? "" : null);
+        const m = a.filterable && {
+          render: this.props.cellRender,
+          field: a.field,
+          title: a.filterTitle,
+          value: g,
+          operator: c && c.operator,
+          operators: ie(this.props.filterOperators[h] || [], t),
+          booleanValues: ie(Ut, t),
+          filterType: h,
+          ariaLabel: d,
+          onChange: (k) => {
+            this.setFilter(k.value, k.operator, a.field, k.syntheticEvent);
+          }
+        }, u = a.declarationIndex >= 0 ? ++i : --e, b = {
+          ariaLabel: d,
+          ariaColumnIndex: a.ariaColumnIndex
+        }, E = a.left !== void 0 ? this.props.isRtl ? { left: a.right, right: a.left } : { left: a.left, right: a.right } : {}, C = {
+          columnId: z.getFilterColumnId(a.id),
+          navigatable: a.navigatable,
+          style: E,
+          className: y("k-table-th", this.headerCellClassName(a.field, a.locked) || void 0),
+          role: "columnheader",
+          ...b
+        }, x = m && (a.filterCell ? /* @__PURE__ */ l.createElement(a.filterCell, { ...m }) : /* @__PURE__ */ l.createElement(Yt, { size: this.props.size, ...m })), I = Ce(this.props.cells, a.cells);
+        if (I && I.filterCell) {
+          const k = I.filterCell;
+          return /* @__PURE__ */ l.createElement(k, { key: u, ...m, thProps: C, index: i }, x);
+        }
+        return /* @__PURE__ */ l.createElement(
+          Rt,
+          {
+            key: u,
+            ...C
+          },
+          x
+        );
+      }
+    );
+    return /* @__PURE__ */ l.createElement("tr", { className: ur, "aria-rowindex": this.props.ariaRowIndex, role: "row" }, n);
+  }
+}
+G(Jt);
+class Qt extends l.Component {
+  constructor() {
+    super(...arguments), this.draggable = null, this.onPress = (t) => {
+      const s = this.draggable && this.draggable.element;
+      s && this.props.onPress && this.props.onPress(t.event, s);
+    }, this.onDrag = (t) => {
+      const s = this.draggable && this.draggable.element;
+      s && this.props.onDrag && this.props.onDrag(t.event, s);
+    }, this.onRelease = (t) => {
+      this.draggable && this.draggable.element && this.props.onRelease && this.props.onRelease(t.event);
+    }, this.sortChange = (t) => {
+      if (t.preventDefault(), this.props.onSortChange) {
+        const s = this.props.dir === "asc" ? "desc" : "asc";
+        this.props.onSortChange(t, s);
+      }
+    }, this.groupRemove = (t) => {
+      t.preventDefault(), t.stopPropagation(), this.props.onRemove && this.props.onRemove(t);
+    }, this.onContextMenu = (t) => {
+      const s = {
+        title: this.props.title,
+        dir: this.props.dir,
+        index: this.props.index
+      };
+      this.props.onContextMenu && this.props.onContextMenu.call(void 0, t, { dataItem: { ...s } });
+    };
+  }
+  render() {
+    const { dir: t } = this.props;
+    return /* @__PURE__ */ l.createElement(
+      yt,
+      {
+        onPress: this.onPress,
+        onDrag: this.onDrag,
+        onRelease: this.onRelease,
+        ref: (s) => {
+          this.draggable = s;
+        }
+      },
+      /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          className: "k-chip k-chip-md k-chip-solid k-chip-solid-base k-rounded-md",
+          onClick: this.sortChange,
+          onContextMenu: this.onContextMenu,
+          role: "button",
+          style: { touchAction: "none" }
+        },
+        /* @__PURE__ */ l.createElement("span", null, /* @__PURE__ */ l.createElement(
+          O,
+          {
+            name: "sort-" + t + "-small",
+            icon: t === "asc" ? We : Ve,
+            size: "small"
+          }
+        )),
+        /* @__PURE__ */ l.createElement("span", { className: "k-chip-content" }, this.props.title),
+        /* @__PURE__ */ l.createElement("span", { className: "k-chip-actions" }, /* @__PURE__ */ l.createElement(
+          "span",
+          {
+            className: "k-chip-action k-chip-remove-action",
+            onClick: this.groupRemove
+          },
+          /* @__PURE__ */ l.createElement(
+            O,
+            {
+              name: "x-circle",
+              icon: Ms,
+              size: "small"
+            }
+          )
+        ))
+      )
+    );
+  }
+}
+G(Qt);
+class Zt extends l.Component {
+  constructor() {
+    super(...arguments), this.onGroupRemove = (t, s) => {
+      const o = this.props.group.slice();
+      o.splice(s, 1), this.props.groupChange(o, t);
+    }, this.onGroupSortChange = (t, s, o, e) => {
+      const i = Object.assign({}, o, { dir: e }), n = this.props.group.slice();
+      n.splice(s, 1, i), this.props.groupChange(n, t);
+    };
+  }
+  render() {
+    const s = (this.props.group || []).map((o, e) => /* @__PURE__ */ l.createElement(
+      Qt,
+      {
+        key: e,
+        index: e,
+        dir: o.dir || "asc",
+        title: this.props.resolveTitle(o.field),
+        onRemove: (i) => {
+          this.onGroupRemove(i, e);
+        },
+        onSortChange: (i, n) => {
+          this.onGroupSortChange(i, e, o, n);
+        },
+        onPress: this.props.pressHandler,
+        onDrag: this.props.dragHandler,
+        onRelease: this.props.releaseHandler,
+        onContextMenu: this.props.onContextMenu
+      }
+    ));
+    return /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        ref: this.props.refCallback,
+        className: "k-grouping-header",
+        role: "toolbar",
+        "aria-label": T(this).toLanguageString(Pe, v[Pe]),
+        "aria-controls": this.props.ariaControls || ""
+      },
+      /* @__PURE__ */ l.createElement("div", { className: "k-chip-list k-chip-list-md", role: "none" }, s),
+      /* @__PURE__ */ l.createElement("div", { className: "k-grouping-drop-container" }, !s.length && T(this).toLanguageString(Ne, v[Ne]), " ")
+    );
+  }
+}
+G(Zt);
+class gr extends l.Component {
+  constructor() {
+    super(...arguments), this.footerWrap = null, this.table = null, this.scrollbarWidth = St();
+  }
+  componentDidMount() {
+    this.setState({});
+  }
+  /**
+   *
+   * @param scrollLeft - Scrolls to the left (in pixels).
+   */
+  setScrollLeft(t) {
+    this.footerWrap && (this.footerWrap.scrollLeft = t);
+  }
+  /**
+   *
+   * @param width - Scrolls the width (in pixels).
+   */
+  setWidth(t) {
+    this.table && (this.table.style.width = t + "px");
+  }
+  render() {
+    return this.props.staticHeaders ? /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        className: "k-grid-footer",
+        role: "presentation"
+      },
+      /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          ref: (t) => {
+            this.footerWrap = t;
+          },
+          className: "k-grid-footer-wrap",
+          style: this.scrollbarWidth ? {} : { borderWidth: 0 },
+          role: "presentation"
+        },
+        /* @__PURE__ */ l.createElement(
+          "table",
+          {
+            ref: (t) => {
+              this.table = t;
+            },
+            className: y(
+              "k-table k-grid-footer-table",
+              {
+                "k-table-md": !this.props.size,
+                [`k-table-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+              },
+              this.props.className
+            ),
+            role: "presentation"
+          },
+          /* @__PURE__ */ l.createElement("colgroup", { ref: (t) => {
+            this.props.columnResize.colGroupFooter = t;
+          }, role: "presentation" }, this.props.cols),
+          /* @__PURE__ */ l.createElement("tfoot", { className: "k-table-tfoot", role: "presentation" }, this.props.row)
+        )
+      )
+    ) : /* @__PURE__ */ l.createElement("tfoot", { className: "k-table-tfoot" }, this.props.row);
+  }
+}
+class fr {
+  constructor(t) {
+    this.table = null, this.containerHeight = 0, this.topCacheCount = 0, this.attendedSkip = 0, this.propsSkip = 0, this.total = 0, this.scrollableVirtual = !1, this.realSkip = 0, this.pageSize = 0, this.PageChange = null, this.tableBodyRef = l.createRef(), this.fixedScroll = !1, this.askedSkip = void 0, this.containerRef = l.createRef(), this.tableTransform = "", this.prevScrollPos = 0, this.tableTranslate = 0, this.scrollSyncing = !1, this.reactVersion = Number.parseFloat(l.version), this.topItems = (s, o) => {
+      if (!this.container || o)
+        return { topItemsCount: 0, topItemsHeight: 0 };
+      const e = this.container.clientHeight, i = Math.ceil(e / s[0].line), n = Math.ceil((s.length - i) / 2);
+      let a = 0;
+      for (let h = 0; h < n; h++)
+        a += s[h].line + s[h].acc;
+      return {
+        topItemsCount: n,
+        topItemsHeight: a,
+        itemsNeededOnScreen: i + i / 2
+      };
+    }, this.horizontalScrollbarHeight = () => this.container ? this.container.offsetHeight - this.container.clientHeight : 0, t && (this.topCacheCount = 4, this.attendedSkip = -this.topCacheCount), this.scrollHandler = this.scrollHandler.bind(this);
+  }
+  get container() {
+    return this.containerRef.current;
+  }
+  /**
+   * @return - The row heights in an array.
+   */
+  get rowHeights() {
+    const t = [], s = this.tableBodyRef.current && this.tableBodyRef.current.children || [];
+    let o = 0;
+    for (let e = 0; e < s.length; e++) {
+      if (s[e].className.indexOf("k-grouping-row") > -1) {
+        o += s[e].scrollHeight;
+        continue;
+      }
+      s[e].className.indexOf("k-detail-row") > -1 ? t[t.length - 1].line += s[e].scrollHeight : (t.push({
+        line: s[e].scrollHeight,
+        acc: o
+      }), o = 0);
+    }
+    return t;
+  }
+  changePage(t, s) {
+    this.attendedSkip = t - this.topCacheCount, this.PageChange && this.PageChange(
+      {
+        skip: Math.max(0, t - this.topCacheCount),
+        take: this.pageSize
+      },
+      s
+    );
+  }
+  translate(t, s) {
+    this.tableTranslate = t, this.scrollableVirtual && this.table && (this.reactVersion <= 17 || s ? this.table.style.transform = "translateY(" + t + "px)" : this.tableTransform = "translateY(" + t + "px)");
+  }
+  reset() {
+    this.scrollSyncing = !0, !this.fixedScroll && (this.container && (this.container.scrollTop = 0), this.translate(0, !0));
+  }
+  localScrollUp(t) {
+    if (!this.container)
+      return;
+    const s = this.rowHeights, o = this.container.scrollTop;
+    let e = this.tableTranslate, i = 0;
+    const {
+      topItemsCount: n,
+      topItemsHeight: a,
+      itemsNeededOnScreen: h
+    } = this.topItems(s, !!this.topCacheCount), c = o - e;
+    if (!(c > a || s.length <= h)) {
+      for (; i < this.topCacheCount + this.attendedSkip - this.realSkip + n && this.propsSkip - i > 0 && !(e + (s[s.length - 1 - i].line + s[s.length - 1 - i].acc) + c <= o); )
+        e -= s[s.length - 1 - i].line + s[s.length - 1 - i].acc, i++;
+      if (i === 0 && this.topCacheCount === 0 && this.attendedSkip > 0 && (e = Math.max(e - s[0].line, 0), i = 1), this.propsSkip - i <= 0 && e > o) {
+        this.translate(0), this.changePage(0, t), this.container.scrollTop = 0;
+        return;
+      }
+      if (e > o && (e = o), e !== this.tableTranslate) {
+        this.translate(Math.max(0, e - a));
+        const d = Math.max(0, this.propsSkip - i - n);
+        this.changePage(d, t);
+      }
+    }
+  }
+  localScrollDown(t) {
+    if (!this.container)
+      return;
+    const s = this.rowHeights, o = this.container.scrollTop;
+    let e = this.tableTranslate, i = 0;
+    const {
+      topItemsCount: n,
+      topItemsHeight: a,
+      itemsNeededOnScreen: h
+    } = this.topItems(s, !!this.topCacheCount);
+    for (; i < s.length - this.topCacheCount && !(e + s[i].line + s[i].acc > o); )
+      e += s[i].line + s[i].acc, i++;
+    n > this.propsSkip + i || s.length <= h || (i >= s.length - this.topCacheCount && this.propsSkip + i >= this.total ? (this.translate(e - a), this.changePage(this.total - 1 - n, t)) : e !== this.tableTranslate && this.propsSkip + i - n !== this.propsSkip && (this.translate(e - a), this.changePage(this.propsSkip + i - n, t)));
+  }
+  scrollNonStrict(t) {
+    const s = this.total * this.prevScrollPos / this.containerHeight;
+    let o = Math.floor(s);
+    o >= this.total && (o = this.total - 1);
+    const e = Math.min(s - o, 1);
+    let i = 0;
+    const n = o - this.propsSkip, a = this.rowHeights;
+    n >= 0 && n <= 1 ? i = -((a[0].line + a[0].acc) * e) : n === -1 && (i = -((a[a.length - 1].line + a[a.length - 1].acc) * e));
+    const { topItemsCount: h, topItemsHeight: c } = this.topItems(a, !!this.topCacheCount);
+    this.translate(Math.max(0, i - c - this.horizontalScrollbarHeight() + this.containerHeight * s / this.total)), this.changePage(o - h, t);
+  }
+  scrollHandler(t) {
+    if (!this.scrollableVirtual)
+      return;
+    if (this.scrollSyncing || !this.container || !this.table) {
+      this.scrollSyncing = !1;
+      return;
+    }
+    const s = this.container.scrollTop, o = this.prevScrollPos;
+    if (this.prevScrollPos = s, this.askedSkip !== void 0) {
+      this.translate(this.containerHeight * this.askedSkip / this.total), this.changePage(this.askedSkip, t), this.prevScrollPos = s, this.askedSkip = void 0;
+      return;
+    }
+    s - o < 0 && s > this.tableTranslate - this.table.scrollHeight / 10 ? this.localScrollUp(t) : s - o > 0 && s < this.tableTranslate + this.table.scrollHeight * 2 / 3 ? this.localScrollDown(t) : this.scrollNonStrict(t), this.prevScrollPos = s;
+  }
+}
+class xt {
+  constructor(t = 0, s, o, e) {
+    this.total = t, this.offsets = [], this.heights = [];
+    let i = 0;
+    for (let n = 0; n < t; n++) {
+      this.offsets.push(i);
+      const a = e && e[n].expanded && e[n].rowType === "data" ? o : s;
+      i += a, this.heights.push(a);
+    }
+  }
+  height(t) {
+    return this.heights[t];
+  }
+  index(t) {
+    if (t < 0)
+      return;
+    const s = this.offsets.reduce((o, e, i) => {
+      if (o !== void 0)
+        return o;
+      if (e === t)
+        return i;
+      if (e > t)
+        return i - 1;
+    }, void 0);
+    return s === void 0 ? this.total - 1 : s;
+  }
+  offset(t) {
+    return this.offsets[t];
+  }
+  totalHeight() {
+    const t = this.offsets[this.offsets.length - 1], s = this.heights[this.heights.length - 1];
+    return t + s;
+  }
+}
+class kt {
+  constructor(t) {
+    this.table = null, this.containerHeight = 0, this.topCacheCount = 0, this.attendedSkip = 0, this.propsSkip = 0, this.total = 0, this.scrollableVirtual = !1, this.realSkip = 0, this.pageSize = 0, this.PageChange = null, this.tableBodyRef = l.createRef(), this.fixedScroll = !1, this.askedSkip = void 0, this.containerRef = l.createRef(), this.tableTransform = "", this.scrollSyncing = !1, this.lastLoaded = 0, this.firstLoaded = 0, this.lastScrollTop = 0, this.reactVersion = Number.parseFloat(l.version), this.firstLoaded = this.pageSize, this.lastLoaded = this.realSkip + this.pageSize, this.scrollHandler = this.scrollHandler.bind(this);
+  }
+  get container() {
+    return this.containerRef.current;
+  }
+  translate(t, s) {
+    this.scrollableVirtual && this.table && (Re || this.reactVersion <= 17 || s ? this.table.style.transform = "translateY(" + t + "px)" : this.tableTransform = "translateY(" + t + "px)");
+  }
+  changePage(t, s) {
+    this.PageChange && this.PageChange({ skip: Math.max(0, t), take: this.pageSize }, s);
+  }
+  reset() {
+    this.scrollSyncing = !0, !this.fixedScroll && (this.container && (this.container.scrollTop = 0), this.translate(0, !0));
+  }
+  scrollHandler(t) {
+    if (!this.scrollableVirtual || !this.container || !this.table || !this.rowHeightService || !this.containerRef.current)
+      return;
+    if (this.scrollSyncing) {
+      this.scrollSyncing = !1;
+      return;
+    }
+    const s = this.container.scrollTop, o = this.lastScrollTop >= s, e = !o;
+    this.lastScrollTop = s;
+    let i = this.rowHeightService.index(s), n = this.rowHeightService.offset(i);
+    const { offsetHeight: a } = this.containerRef.current, h = this.rowHeightService.index(s + a);
+    if (e && h >= this.lastLoaded && this.lastLoaded < this.total) {
+      const c = i + this.pageSize - this.total;
+      c > 0 && (i = i - c, n = this.rowHeightService.offset(i)), this.firstLoaded = i, this.translate(n);
+      let d = this.firstLoaded + this.pageSize;
+      this.lastLoaded = Math.min(d, this.total), this.changePage(this.firstLoaded, t);
+    } else if (o && i < this.firstLoaded) {
+      const c = Math.floor(this.pageSize * 0.3);
+      this.firstLoaded = Math.max(i - c, 0), this.translate(this.rowHeightService.offset(this.firstLoaded)), this.lastLoaded = Math.min(this.firstLoaded + this.pageSize, this.total), this.changePage(this.firstLoaded, t);
+    }
+  }
+}
+const mr = 1, Cr = 20;
+class br {
+  constructor(t) {
+    this.columns = [], this.resizable = !1, this.isRtl = !1, this.setIsRtl = (s) => {
+      this.isRtl = s;
+    }, this.dragHandler = (s, o, e, i) => {
+      const n = s.originalEvent;
+      i || (n.preventDefault(), n.stopPropagation(), n.stopImmediatePropagation());
+      const a = e.closest("th");
+      if (!a || !a)
+        return;
+      const h = a.clientWidth;
+      let c = h;
+      if (this.isRtl ? c += e.getBoundingClientRect().right - e.offsetWidth / 2 - s.clientX : c += s.clientX - e.getBoundingClientRect().left - e.offsetWidth / 2, !i && Math.abs(c - h) < 1)
+        return;
+      this.fixateInitialWidths(a.parentElement.clientWidth), this.setWidths(o, Math.floor(c) / h);
+      const d = this.columns.filter((g) => !g.children.length).findIndex((g) => g.id === o.id);
+      this.onResize(d, h, c, n, i, o.id);
+    }, this.dblClickHandler = (s, o) => {
+      const e = this.columns.filter((m) => o.indexOf(m.id) > -1);
+      if (!this.colGroupMain || !e.length)
+        return;
+      const i = {}, n = e;
+      for (; n.length > 0; ) {
+        const m = n.pop();
+        if (!m)
+          break;
+        m.children.length ? n.push(...m.children) : i[m.id] = m;
+      }
+      const a = this.columns.filter((m) => !m.children.length), h = [];
+      a.forEach((m, u) => {
+        i[m.id] && h.push(u);
+      });
+      const c = [this.colGroupMain.parentElement], d = [this.colGroupMain];
+      this.colGroupHeader && (c.push(this.colGroupHeader.parentElement), d.push(this.colGroupHeader)), this.colGroupFooter && (c.push(this.colGroupFooter.parentElement), d.push(this.colGroupFooter)), c.forEach((m) => m.classList.add("k-autofitting"));
+      let g = [];
+      d.forEach((m) => {
+        h.forEach((u) => {
+          m.children[u] && (m.children[u].width = "", g[u] = Math.max(g[u] || 0, m.children[u].offsetWidth + mr));
+        });
+      }), d.forEach((m) => {
+        h.forEach((u) => {
+          m.children[u] && (m.children[u].width = g[u] + "px", a[u].width = g[u]);
+        });
+      }), c.forEach((m) => m.classList.remove("k-autofitting")), this.onResize(h[0], 0, 0, s, !0, o[0]);
+    }, this.updateColElements = (s) => {
+      const o = this.columns.filter((i) => !i.children.length);
+      let e = 1e-10;
+      for (let i = 0; i < s.length; i++) {
+        const n = s[i], a = o.findIndex((g) => g.id === n.id), h = parseFloat((n.width || 0).toString()), c = Math.floor(h);
+        e += h - c;
+        const d = c + Math.floor(e);
+        if (e -= Math.floor(e), this.colGroupMain && this.colGroupMain.children[a]) {
+          const g = parseInt(this.colGroupMain.children[a].width, 10);
+          this.colGroupMain.children[a].width = d + "px", this.updateNextLockedCol(
+            this.colGroupMain.parentElement,
+            n,
+            g - d
+          );
+        }
+        if (this.colGroupHeader && this.colGroupHeader.children[a]) {
+          const g = parseInt(this.colGroupHeader.children[a].width, 10);
+          this.colGroupHeader.children[a].width = d + "px", this.updateNextLockedCol(
+            this.colGroupHeader.parentElement,
+            n,
+            g - d
+          );
+        }
+        if (this.colGroupFooter && this.colGroupFooter.children[a]) {
+          const g = parseInt(this.colGroupFooter.children[a].width, 10);
+          this.colGroupFooter.children[a].width = d + "px", this.updateNextLockedCol(
+            this.colGroupFooter.parentElement,
+            n,
+            g - d
+          );
+        }
+      }
+    }, this.onResize = t;
+  }
+  fixateInitialWidths(t) {
+    const s = this.columns.filter((n) => !n.children.length);
+    let o = 0, e = this.colGroupMain ? this.colGroupMain.children : [];
+    for (let n = 0; n < e.length; n++)
+      e[n].width ? t -= parseFloat(e[n].width) : o++;
+    if (o === 0)
+      return;
+    const i = Math.floor(t / o);
+    for (let n = 0; n < e.length; n++) {
+      const a = e[n];
+      a.width || (a.width = i, s[n].width = i.toString(), this.colGroupHeader && (this.colGroupHeader.children[n].width = i), this.colGroupFooter && (this.colGroupFooter.children[n].width = i));
+    }
+  }
+  setWidths(t, s) {
+    const o = this.columns.findIndex((n) => n.id === t.id), e = [];
+    let i = t.children.length;
+    for (let n = o + 1; i > 0 && n < this.columns.length; n++, i--) {
+      const a = this.columns[n];
+      a.children.length ? i += a.children.length : e.push(a);
+    }
+    return e.length === 0 && e.push(t), e.forEach((n) => {
+      let a = n.width ? parseFloat(n.width.toString()) * s : 0;
+      const h = n.minResizableWidth === void 0 ? 10 : n.minResizableWidth;
+      a < h && (a = h), n.width = a;
+    }), this.updateColElements(e), e;
+  }
+  updateNextLockedCol(t, s, o) {
+    const e = s.index, i = this.colGroupMain.parentElement.closest(".k-grid"), n = i == null ? void 0 : i.clientWidth, a = this.columns.filter((h) => h.locked).map((h) => parseInt(h.width + "", 10)).reduce((h, c) => h + c, 0);
+    !s.locked || n <= a + Cr || this.columns.forEach((h) => {
+      if (h != null && h.locked && o) {
+        const c = t == null ? void 0 : t.querySelectorAll('[aria-colindex="' + h.ariaColumnIndex + '"]');
+        c == null || c.forEach((d) => {
+          const g = d.style;
+          this.isRtl ? (h.index > e && g && g.right && (g.right = parseInt(g.right, 10) - o + "px"), h.index < e && g && g.left && (g.left = parseInt(g.left, 10) - o + "px")) : (h.index > e && g && g.left && (g.left = parseInt(g.left, 10) - o + "px"), h.index < e && g && g.right && (g.right = parseInt(g.right, 10) - o + "px"));
+        });
+      }
+    });
+  }
+}
+class xr {
+  constructor(t, s, o) {
+    this.refDragElementClue = l.createRef(), this.refDropElementClue = l.createRef(), this.columns = [], this.reorderable = !1, this.groupable = !1, this.startColumn = -1, this.startGroup = -1, this.currentColumn = -1, this.currentGroup = -1, this.groupPanelDivElement = null, this.refGroupPanelDiv = (e) => {
+      this.groupPanelDivElement = e && e.children ? e.children[0] : e;
+    }, this.pressHandler = (e, i) => {
+      const n = this.getColumnIndex(e, i);
+      if (this.startGroup = this.getGroupIndex(e), n >= 0) {
+        const a = this.columns[n];
+        (a.reorderable && this.reorderable || a.groupable && this.groupable) && (this.startColumn = n);
+      }
+    }, this.dragHandler = (e, i) => {
+      if (e.isTouch || e.originalEvent.preventDefault(), e.originalEvent.stopPropagation(), this.startColumn === -1 && this.startGroup === -1)
+        return;
+      this.currentColumn = this.getColumnIndex(e, i);
+      const n = this.groupPanelDivElement && this.groupPanelDivElement.children;
+      this.currentGroup = this.isTargetGroupingContainer(e) ? n && n.length ? n.length : 0 : this.getGroupIndex(e);
+      const a = !this.isValid();
+      a && (this.currentColumn = -1, this.currentGroup = -1);
+      const h = this.currentColumn >= 0 ? i.children[this.columns[this.currentColumn].index] : this.isTargetGroupingContainer(e) ? e.originalEvent.target : this.groupPanelDivElement && this.groupPanelDivElement.children[this.currentGroup];
+      this.updateDragElementClue(e, i, h, a), this.updateDropElementClue(e, i, h, a);
+    }, this.releaseHandler = (e) => {
+      const i = this.startColumn, n = this.currentColumn, a = this.startGroup, h = this.currentGroup;
+      e.originalEvent.preventDefault(), this.dropElementClue && this.dropElementClue.setState({ visible: !1 }), this.dragElementClue && this.dragElementClue.setState({ visible: !1 });
+      const c = this.isValid();
+      this.startColumn = this.startGroup = this.currentColumn = this.currentGroup = -1, c && (i >= 0 && n >= 0 ? this.columnReorder(i, n, e.originalEvent) : a >= 0 && h >= 0 ? this.groupReorder(a, h, e.originalEvent) : i >= 0 && h >= 0 && this.columnToGroup(i, h, e.originalEvent));
+    }, this.columnReorder = t, this.groupReorder = s, this.columnToGroup = o;
+  }
+  get dragClueRef() {
+    return this.refDragElementClue;
+  }
+  get dropClueRef() {
+    return this.refDropElementClue;
+  }
+  get dragElementClue() {
+    return this.refDragElementClue.current;
+  }
+  get dropElementClue() {
+    return this.refDropElementClue.current;
+  }
+  getColumnIndex(t, s) {
+    if (!s || s.parentElement === this.groupPanelDivElement)
+      return -1;
+    const o = at(t, s);
+    if (o === -1)
+      return -1;
+    for (let e = 0; e < s.parentNode.children.length; e++)
+      if (s.parentNode.children[e] === s)
+        return this.columns.findIndex((i) => i.index === o && i.depth === e);
+    return -1;
+  }
+  isTargetGroupingContainer(t) {
+    const s = t.originalEvent.target;
+    return s.className.indexOf ? s.className.indexOf("k-grouping-drop-container") !== -1 : !1;
+  }
+  getGroupIndex(t) {
+    return at(t, this.groupPanelDivElement);
+  }
+  isValid() {
+    return this.startGroup >= 0 ? this.currentGroup >= 0 && this.currentGroup !== this.startGroup : this.startColumn === -1 ? !1 : this.currentGroup >= 0 ? this.columns[this.startColumn].groupable === !0 && this.groupable === !0 : this.reorderable === !0 && this.currentColumn >= 0 && this.currentColumn !== this.startColumn && this.columns[this.startColumn].reorderable === !0 && this.columns[this.currentColumn].parentIndex === this.columns[this.startColumn].parentIndex;
+  }
+  updateDragElementClue(t, s, o, e) {
+    if (!this.dragElementClue)
+      return;
+    const i = this.startColumn >= 0 ? s.children[this.columns[this.startColumn].index].innerText : s.innerText;
+    this.dragElementClue.setState({
+      visible: !0,
+      top: t.pageY + 10,
+      left: t.pageX,
+      innerText: i,
+      status: e || !o ? "k-i-cancel" : "k-i-plus"
+    });
+  }
+  updateDropElementClue(t, s, o, e) {
+    if (!this.dropElementClue)
+      return;
+    if (e || !o) {
+      this.dropElementClue.setState({ visible: !1 });
+      return;
+    }
+    const i = o.getBoundingClientRect(), a = (o.closest(".k-grouping-header") || o).getBoundingClientRect();
+    let h = i.left + t.pageX - t.clientX - 6;
+    !this.isTargetGroupingContainer(t) && (this.currentColumn > this.startColumn || this.currentGroup > this.startGroup && this.startGroup !== -1) && (h += i.width);
+    const c = a.top + t.pageY - t.clientY;
+    this.dropElementClue.setState({
+      visible: !0,
+      top: c,
+      left: h,
+      height: this.currentColumn >= 0 ? s.clientHeight : a.height
+    });
+  }
+}
+const kr = (r) => {
+  let t = null;
+  const s = ws(), o = q(r.id), e = l.useCallback((c) => {
+    r.onContextMenu && r.onContextMenu.call(void 0, c, r.dataItem, r.field);
+  }, [r.onContextMenu, r.dataItem, r.field]);
+  let i = null, n = null;
+  if (r.rowType === "groupFooter")
+    i = {
+      onContextMenu: e,
+      className: r.className
+    }, t = /* @__PURE__ */ l.createElement("td", { ...i });
+  else if (r.rowType !== "groupHeader") {
+    if (r.field !== void 0) {
+      const d = M(r.field, r.dataItem);
+      d != null && (n = r.format ? s.format(r.format, d) : d.toString());
+    }
+    const c = y(
+      "k-table-td",
+      r.className,
+      { "k-selected": r.isSelected }
+    );
+    i = {
+      onContextMenu: e,
+      colSpan: r.colSpan,
+      style: r.style,
+      className: c,
+      role: "gridcell",
+      "aria-colindex": r.ariaColumnIndex,
+      "aria-selected": r.isSelected,
+      [re]: r.columnIndex,
+      ...o
+    }, t = /* @__PURE__ */ l.createElement("td", { ...i }, n);
+  }
+  const a = r.rowType || "data", h = r.cells;
+  if (h && h[a]) {
+    const c = h[a];
+    return /* @__PURE__ */ l.createElement(c, { ...r, tdProps: i }, n);
+  }
+  return r.render ? r.render.call(void 0, t, r) : t;
+}, vt = (r) => {
+  let t = null;
+  const { columnIndex: s, level: o, columnsCount: e, rowType: i, dataItem: n, field: a, onChange: h, expanded: c, render: d, dataIndex: g, ariaColumnIndex: m, isRtl: u } = r, b = a || "", E = q(r.id), C = Ft();
+  let x = null, I = null, k = null;
+  const _ = l.useCallback(
+    (F) => {
+      F.isDefaultPrevented() || F.keyCode === me.enter && h && (F.preventDefault(), h({
+        dataItem: n,
+        dataIndex: g,
+        syntheticEvent: F,
+        field: void 0,
+        value: !c
+      }));
+    },
+    [c, h, n, g]
+  ), D = l.useCallback((F) => {
+    r.onContextMenu && r.onContextMenu.call(void 0, F, r.dataItem, r.field);
+  }, [r.onContextMenu, r.dataItem, r.field]), de = (F, ke) => {
+    const pe = c ? Pt : _t, ve = C.toLanguageString(pe, v[pe]);
+    return x = {
+      className: "k-table-td",
+      style: { ...r.style, ...ke },
+      colSpan: F,
+      key: "g-colspan",
+      role: "gridcell",
+      ["aria-selected"]: !1,
+      ["aria-expanded"]: c,
+      ["aria-colindex"]: m,
+      onKeyDown: _,
+      onContextMenu: D,
+      ...E
+    }, k = /* @__PURE__ */ l.createElement("p", { className: "k-reset" }, /* @__PURE__ */ l.createElement(
+      "a",
+      {
+        onClick: (J) => {
+          J.preventDefault(), h && h({
+            dataItem: n,
+            dataIndex: g,
+            syntheticEvent: J,
+            field: void 0,
+            value: !c
+          });
+        },
+        href: "#",
+        tabIndex: -1,
+        "aria-label": ve
+      },
+      /* @__PURE__ */ l.createElement(
+        O,
+        {
+          name: c ? "caret-alt-down" : u ? "caret-alt-left" : "caret-alt-right",
+          icon: c ? Ts : u ? Gs : Hs
+        }
+      )
+    ), n[b] instanceof Date && n[b].toString ? n[b].toString() : n[b]), /* @__PURE__ */ l.createElement(
+      "td",
+      {
+        ...x
+      },
+      k
+    );
+  };
+  s === void 0 || o === void 0 || s < o || e === void 0 || i !== "groupHeader" || n[b] === void 0 ? (x = {
+    style: r.style,
+    key: "g" + s,
+    className: y(
+      "k-table-td",
+      "k-group-cell",
+      { "k-grid-content-sticky": r.locked }
+    ),
+    role: "gridcell",
+    onContextMenu: D
+  }, t = /* @__PURE__ */ l.createElement(
+    "td",
+    {
+      ...x
+    }
+  )) : s <= o && !r.locked ? t = de(e - s, {}) : s <= o && r.locked && (I = {
+    className: "k-table-td",
+    role: "gridcell",
+    colSpan: e - s,
+    style: { borderLeftWidth: 0, borderRightWidth: 0 },
+    onContextMenu: D
+  }, t = /* @__PURE__ */ l.createElement(l.Fragment, null, de(0, { position: "sticky", zIndex: 2 }), /* @__PURE__ */ l.createElement(
+    "td",
+    {
+      ...I
+    }
+  )));
+  const Y = r.rowType || "data", $ = r.cells;
+  if ($ && $.group && $.group[Y]) {
+    const F = $.group[Y];
+    return /* @__PURE__ */ l.createElement(F, { ...r, tdProps: x, td2Props: I }, k);
+  }
+  return d ? d.call(void 0, t, r) : t;
+};
+class vr extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    const t = y(
+      "k-table-row",
+      {
+        "k-grouping-row": this.props.rowType === "groupHeader",
+        "k-group-footer": this.props.rowType === "groupFooter",
+        "k-master-row": this.props.rowType !== "groupHeader" && this.props.rowType !== "groupFooter",
+        "k-table-alt-row k-alt": this.props.rowType !== "groupHeader" && this.props.rowType !== "groupFooter" && this.props.isAltRow,
+        "k-selected": this.props.isSelected,
+        "k-grid-edit-row": this.props.isInEdit
+      }
+    ), s = /* @__PURE__ */ l.createElement(
+      "tr",
+      {
+        id: this.props.id,
+        onClick: this.props.onClick,
+        onDoubleClick: this.props.onDoubleClick,
+        className: t,
+        style: {
+          height: this.props.rowHeight ? this.props.rowHeight + "px" : "",
+          visibility: this.props.isHidden ? "hidden" : ""
+        },
+        role: "row",
+        "aria-rowindex": this.props.ariaRowIndex,
+        "absolute-row-index": this.props.absoluteRowIndex,
+        key: this.props.absoluteRowIndex,
+        [rr]: this.props.rowType === "data" ? this.props.dataIndex : void 0
+      },
+      this.props.children
+    );
+    return this.props.render ? this.props.render.call(void 0, s, this.props) : s;
+  }
+}
+class Er extends l.Component {
+  constructor() {
+    super(...arguments), this._inputId = oe();
+  }
+  render() {
+    const { columnMenuWrapperProps: t } = this.props, s = [
+      /* @__PURE__ */ l.createElement(
+        "input",
+        {
+          key: 0,
+          checked: this.props.selectionValue,
+          id: this._inputId,
+          type: "checkbox",
+          className: "k-checkbox k-checkbox-md k-rounded-md",
+          onChange: (o) => this.props.selectionChange({
+            field: this.props.field,
+            syntheticEvent: o
+          })
+        }
+      ),
+      /* @__PURE__ */ l.createElement("label", { key: 1, className: "k-checkbox-label", htmlFor: this._inputId }),
+      t.columnMenu && /* @__PURE__ */ l.createElement(Vt, { ...t })
+    ];
+    return this.props.render ? this.props.render.call(void 0, s, this.props) : s;
+  }
+}
+class $e extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    return this.props.children || T(this).toLanguageString(Fe, v[Fe]);
+  }
+}
+$e.displayName = "KendoReactGridNoRecords";
+G($e);
+class Ir extends l.Component {
+  constructor() {
+    super(...arguments), this._element = null, this.renderCell = (t, s) => {
+      const o = {
+        colSpan: t.colSpan !== 1 ? t.colSpan : void 0,
+        style: t.left !== void 0 ? this.props.isRtl ? { left: t.right, right: t.left } : { left: t.left, right: t.right } : {},
+        className: y(
+          "k-table-td",
+          t.locked && t.left !== void 0 ? "k-grid-footer-sticky" : ""
+        ),
+        key: s,
+        role: "gridcell",
+        ["aria-colindex"]: t.ariaColumnIndex
+      }, e = {
+        field: t.field,
+        ariaColumnIndex: t.ariaColumnIndex,
+        ...o
+      }, i = Ce(this.props.cells, t.cells);
+      if (i && i.footerCell) {
+        const n = i.footerCell;
+        return /* @__PURE__ */ l.createElement(n, { ...e, tdProps: o, index: s });
+      }
+      return t.footerCell && /* @__PURE__ */ l.createElement(t.footerCell, { ...e, key: s }) || /* @__PURE__ */ l.createElement("td", { ...o });
+    };
+  }
+  get element() {
+    return this._element;
+  }
+  render() {
+    return /* @__PURE__ */ l.createElement("tr", { className: "k-table-row", role: "row", "aria-rowindex": this.props.ariaRowIndex }, Vs(this.props.columns).map(this.renderCell));
+  }
+}
+const Sr = ({
+  buttonCount: r = 10,
+  info: t = !0,
+  type: s = "numeric",
+  pageSizes: o = void 0,
+  previousNext: e = !0,
+  responsive: i = void 0,
+  pageSizeValue: n = void 0
+}) => ({
+  buttonCount: r,
+  info: t,
+  pageSizes: o === !0 ? [5, 10, 20] : o || void 0,
+  previousNext: e,
+  responsive: i !== !1,
+  type: s,
+  pageSizeValue: n
+}), yr = (r) => Sr(r === !0 ? {} : r), Et = {
+  name: "@progress/kendo-react-grid",
+  productName: "KendoReact",
+  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
+  publishDate: 1701439815,
+  version: "",
+  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
+}, wr = (r) => {
+  const { colSpan: t, ariaColIndex: s, dataItem: o, dataIndex: e, id: i } = r, n = q(i), a = l.useCallback((h) => {
+    r.onContextMenu && r.onContextMenu.call(void 0, h, r.dataItem);
+  }, [r.onContextMenu, r.dataItem]);
+  return /* @__PURE__ */ l.createElement(
+    "td",
+    {
+      onContextMenu: a,
+      className: "k-table-td k-detail-cell",
+      colSpan: t,
+      "aria-colindex": s,
+      role: "gridcell",
+      ...n
+    },
+    /* @__PURE__ */ l.createElement(r.detail, { dataItem: o, dataIndex: e })
+  );
+}, Rr = (r) => {
+  const t = q(r.id);
+  return /* @__PURE__ */ l.createElement("td", { className: "k-table-td k-hierarchy-cell", ...t, role: "gridcell" });
+};
+class be extends l.Component {
+  constructor(t) {
+    super(t), this._columns = [], this._columnsMap = [[]], this._columnsMutations = 0, this._resized = !1, this._shouldUpdateLeftRight = !0, this.contextStateRef = { current: void 0 }, this.navigationStateRef = { current: void 0 }, this._data = [], this._slicedData = void 0, this.wrapperScrollTop = 0, this.showLicenseWatermark = !1, this.headerRef = l.createRef(), this.headerElementRef = l.createRef(), this._element = null, this.tableElement = null, this.containerRef = l.createRef(), this.tableBodyRef = l.createRef(), this._footer = null, this.forceUpdateTimeout = void 0, this.isRtl = !1, this._gridId = oe(), this._gridRoleElementId = oe(), this.observer = null, this.handleIntersection = (e) => {
+      const i = { rowIndex: this.rowIndex };
+      e.forEach((n) => {
+        n.isIntersecting || this.setCurrentOnTop(i);
+      });
+    }, this.setCurrentOnTop = (e) => {
+      if (!this.vs.container || this.props.scrollable === "none")
+        return;
+      this.observer && this.observer.disconnect();
+      const { rowIndex: i } = e;
+      if (this.props.scrollable === "virtual")
+        this.vs.askedSkip = i, this.vs.container.scroll(0, Math.round(this.vs.askedSkip / this.vs.total * this.vs.container.scrollHeight));
+      else if (this.element) {
+        const n = i < 1 ? this.element.querySelector("tbody > tr:nth-child(1)") : this.element.querySelector(`tbody > tr:nth-child(${i + 1})`);
+        n && this.containerRef.current && (this.containerRef.current.scrollTop = n.offsetTop);
+      }
+    }, this.scrollIntoView = (e) => {
+      if (!this.vs.container || this.props.scrollable === "none")
+        return;
+      this.rowIndex = e.rowIndex;
+      const { rowIndex: i } = e, n = this.element;
+      if (this.observer && n) {
+        this.observer.disconnect();
+        const a = n.querySelector(`[absolute-row-index="${i}"]`);
+        a ? this.observer.observe(a) : this.setCurrentOnTop(e);
+      }
+    }, this.fitColumns = (e) => {
+      this.columnResize.dblClickHandler(null, e);
+    }, this.onContextMenu = (e, i, n) => {
+      if (this.props.onContextMenu) {
+        const a = {
+          target: this,
+          syntheticEvent: e,
+          nativeEvent: e.nativeEvent,
+          dataItem: i,
+          field: n
+        };
+        this.props.onContextMenu.call(void 0, a);
+      }
+    }, this.getVirtualScroll = (e) => {
+      const { rowHeight: i, detailRowHeight: n, detail: a, expandField: h, groupable: c } = e, d = this.isAllData(), g = i !== void 0 && i > 0, m = n !== void 0 && n > 0, u = c === !0 || typeof c == "object" && c.enabled !== !1;
+      return !g || u && !d || !!(a && h) && (!m || !d) ? fr : kt;
+    }, this.isAllData = () => {
+      const { data: e, total: i } = this.props;
+      return Array.isArray(e) ? e.length === i : e ? i === e.total : !1;
+    }, this.initializeVirtualization = (e, i) => {
+      if (this.reInitVirtualization(
+        this.props.scrollable === "virtual",
+        this.props.total,
+        this.props.filter,
+        this.props.group,
+        this.props.sort,
+        i || this.props.rowHeight === void 0 || this.props.rowHeight === 0
+      ), this.vs.fixedScroll = this.props.fixedScroll || !1, this.vs.PageChange = this.pageChange, this.vs.realSkip = this.props.skip || 0, this.vs.pageSize = (this.props.take !== void 0 ? this.props.take : this.props.pageSize) || 0, this.vs.scrollableVirtual = this.props.scrollable === "virtual", this.vs.total = e, this.vs.propsSkip = (this.props.skip || 0) + (this.props.scrollable === "virtual" ? this.vs.topCacheCount + (this.vs.attendedSkip - (this.props.skip || 0)) : 0), this.props.rowHeight !== void 0 && this.props.rowHeight > 0 && !i) {
+        const n = this.props.rowHeight * e;
+        this.vs.containerHeight = Re ? Math.min(Ct, n) : n;
+      } else
+        this.vs.containerHeight = 1533915;
+      if (this.vs.containerRef = this.containerRef, this.vs.tableBodyRef = this.tableBodyRef, this.vs.table = this.tableElement, this._slicedData = void 0, this.vs instanceof kt) {
+        const { rowHeight: n = 0, detail: a, expandField: h } = this.props;
+        let { detailRowHeight: c = 0 } = this.props;
+        c = a && h ? c : n, this.isAllData() ? (this.vs.total = this._data.length, this._slicedData = this._data.slice(this.vs.realSkip, this.vs.realSkip + this.vs.pageSize), this.vs.rowHeightService = this.rowHeightService(this.vs, this._data.length, n, c, this._data)) : this.vs.rowHeightService = new xt(e, n, c);
+        const d = this.vs.rowHeightService.totalHeight();
+        this.vs.containerHeight = Re ? Math.min(Ct, d) : d;
+      }
+    }, this.scrollHandler = (e) => {
+      if (e.target !== e.currentTarget)
+        return;
+      clearTimeout(this.forceUpdateTimeout), this.vs.table = this.tableElement;
+      const i = e.currentTarget.scrollLeft, n = e.currentTarget.scrollTop;
+      this.props.columnVirtualization && (!this.vs.scrollableVirtual || n === this.wrapperScrollTop) && (this.forceUpdateTimeout = window.setTimeout(() => {
+        this.forceUpdate();
+      }, 0)), this._header && this._header.setScrollLeft(i), this._footer && this._footer.setScrollLeft(i), this.vs && n !== this.wrapperScrollTop && this.vs.scrollHandler(e), ps(this.props.onScroll, e, this, void 0), this.wrapperScrollTop = n;
+    }, this.onKeyDown = (e) => {
+      if (X.onKeyDown(e, {
+        contextStateRef: this.contextStateRef,
+        navigationStateRef: this.navigationStateRef,
+        onNavigationAction: this.onNavigationAction
+      }), this.props.onKeyDown) {
+        const { mode: i, cell: n } = ht(this.props.selectable), a = {
+          dataItems: this.getLeafDataItems(),
+          mode: i,
+          cell: n,
+          componentId: this._gridId,
+          selectedField: this.props.selectedField,
+          ...this.getArguments(e)
+        };
+        this.props.onKeyDown.call(void 0, a);
+      }
+    }, this.onFocus = (e) => {
+      X.onFocus(e, {
+        contextStateRef: this.contextStateRef
+      });
+    }, this.onNavigationAction = (e) => {
+      if (this.props.onNavigationAction) {
+        const i = {
+          focusElement: e.focusElement,
+          ...this.getArguments(e.event)
+        };
+        this.props.onNavigationAction.call(void 0, i);
+      }
+    }, this.rowClick = (e, i) => {
+      this.props.onRowClick && e.target.nodeName === "TD" && this.props.onRowClick.call(
+        void 0,
+        {
+          dataItem: i.dataItem,
+          ...this.getArguments(e)
+        }
+      );
+    }, this.rowDblClick = (e, i) => {
+      this.props.onRowDoubleClick && e.target.nodeName === "TD" && this.props.onRowDoubleClick.call(
+        void 0,
+        {
+          dataItem: i.dataItem,
+          ...this.getArguments(e)
+        }
+      );
+    }, this.itemChange = (e) => {
+      const i = this.props.onItemChange;
+      if (e.field === this.props.expandField || this.props.group && e.field === void 0) {
+        const n = this.props.onExpandChange;
+        n && n.call(
+          void 0,
+          {
+            ...this.getArguments(e.syntheticEvent),
+            dataItem: e.dataItem,
+            dataIndex: e.dataIndex,
+            value: e.value
+          }
+        );
+        return;
+      }
+      i && i.call(
+        void 0,
+        {
+          ...this.getArguments(e.syntheticEvent),
+          dataItem: e.dataItem,
+          field: e.field,
+          value: e.value
+        }
+      );
+    }, this.onHeaderSelectionChange = (e) => {
+      this.props.onHeaderSelectionChange && this.props.onHeaderSelectionChange.call(
+        void 0,
+        {
+          field: e.field,
+          nativeEvent: e.syntheticEvent && e.syntheticEvent.nativeEvent,
+          syntheticEvent: e.syntheticEvent,
+          target: this,
+          dataItems: this.getLeafDataItems(),
+          selectedField: this.props.selectedField
+        }
+      );
+    }, this.selectionRelease = (e) => {
+      if (this.props.onSelectionChange) {
+        const i = {
+          syntheticEvent: void 0,
+          target: this,
+          selectedField: this.props.selectedField || "",
+          componentId: this._gridId,
+          dataItems: this.getLeafDataItems(),
+          dataItem: null,
+          ...e
+        };
+        this.props.onSelectionChange.call(void 0, i);
+      }
+    }, this.pageChange = (e, i, n) => {
+      this.raiseDataEvent(
+        this.props.onPageChange,
+        { page: e },
+        { skip: e.skip, take: e.take },
+        i,
+        n
+      );
+    }, this.pagerPageChange = (e) => {
+      this.pageChange({ skip: e.skip, take: e.take }, e.syntheticEvent, e.targetEvent);
+    }, this.sortChange = (e, i) => {
+      this.raiseDataEvent(
+        this.props.onSortChange,
+        { sort: e },
+        { sort: e, ...this.props.scrollable === "virtual" ? { skip: 0 } : {} },
+        i
+      );
+    }, this.filterChange = (e, i) => {
+      this.raiseDataEvent(
+        this.props.onFilterChange,
+        { filter: e },
+        { filter: e || void 0, skip: 0 },
+        i
+      );
+    }, this.groupChange = (e, i) => {
+      const n = i.nativeEvent ? i : { nativeEvent: i.nativeEvent || i.originalEvent };
+      this.raiseDataEvent(
+        this.props.onGroupChange,
+        { group: e },
+        { group: e, skip: 0 },
+        n
+      );
+    }, this.onResize = (e, i, n, a, h, c) => {
+      this.resetTableWidth(), this._shouldUpdateLeftRight = !0, this._resized = !0, this._columnsMutations++, this.props.onColumnResize && this.props.onColumnResize.call(
+        void 0,
+        {
+          columns: this.columns,
+          nativeEvent: a,
+          targetColumnId: c,
+          index: e,
+          newWidth: i,
+          oldWidth: n,
+          end: h,
+          target: this
+        }
+      );
+    }, this.reInitVirtualization = B((e, i, n, a, h, c) => {
+      this.vs.reset();
+      const d = this.getVirtualScroll(this.props);
+      this.vs = new d(c);
+    }), this.flatData = B((e, i, n, a, h, c, d) => {
+      const g = [], m = Gt(
+        g,
+        e,
+        i,
+        { index: n },
+        a !== void 0,
+        h
+      );
+      return { flattedData: g, resolvedGroupsCount: m };
+    }), this.rowHeightService = B((e, i, n, a, h) => new xt(i, n, a, h)), this.childrenToArray = B((e) => l.Children.toArray(e)), this.readColumns = B(
+      (e, i, n) => {
+        const a = e.filter((h) => h && h.type && h.type.displayName === "KendoReactGridColumn");
+        return Ht(a, this.columns, { prevId: 0, idPrefix: i });
+      }
+    ), this.mapColumns = B(
+      (e) => vs(e)
+    ), this.configureColumns = B((e, i, n) => {
+      this.props.selectedField && e.filter((c) => c.field === this.props.selectedField).forEach((c) => {
+        c.width = c.width || "50px", c.cell = c.cell || Ks, c.headerCell = c.headerCell || Er;
+      });
+      const a = {
+        id: "",
+        resizable: !0,
+        width: "32px",
+        title: " ",
+        declarationIndex: -1,
+        orderIndex: -1,
+        children: [],
+        parentIndex: -1,
+        depth: 0,
+        colSpan: 0,
+        rowSpan: 0,
+        left: 0,
+        right: 0,
+        index: 0,
+        rightBorder: !1,
+        ariaColumnIndex: 0,
+        isAccessible: !0
+      };
+      let h = 0;
+      this.props.expandField && this.props.onExpandChange && this.props.detail && (e.unshift({
+        ...a,
+        cell: sr,
+        field: this.props.expandField,
+        headerClassName: "k-hierarchy-cell k-header",
+        id: z.generateNavigatableId(`${this._columns.length}`, n, "column")
+      }), h++);
+      for (let c = 0; c < i; c++)
+        e.unshift({
+          ...a,
+          isAccessible: !1,
+          cell: vt,
+          field: "value",
+          locked: this.props.lockGroups
+        }), h++;
+      e.slice(h).forEach((c) => c.parentIndex >= 0 && (c.parentIndex += h));
+    }), this.getHeaderRow = B((e, i, n, a, h, c, d, g, m, u, b, E) => /* @__PURE__ */ l.createElement(
+      Kt,
+      {
+        cells: this.props.cells,
+        sort: e,
+        sortable: i,
+        sortChange: this.sortChange,
+        group: n || [],
+        groupable: a,
+        groupChange: this.groupChange,
+        filter: h,
+        filterable: c,
+        filterOperators: d,
+        filterChange: this.filterChange,
+        columnMenu: m,
+        selectionChange: this.onHeaderSelectionChange,
+        columns: u,
+        columnResize: this.columnResize,
+        pressHandler: this.dragLogic.pressHandler,
+        dragHandler: this.dragLogic.dragHandler,
+        releaseHandler: this.dragLogic.releaseHandler,
+        columnsMap: b,
+        cellRender: g,
+        isRtl: E,
+        dragClue: this.dragLogic.dragClueRef,
+        headerRef: this.headerElementRef,
+        containerRef: this.containerRef
+      }
+    )), this.resolveTitle = (e) => {
+      const i = this._columns.find((a) => a.field === e), n = i && (i.title || i.field);
+      return n === void 0 ? e : n;
+    }, this.getLeafDataItems = () => this._data.filter((e) => e.rowType === "data").map((e) => e.dataItem), us(Et), this.showLicenseWatermark = gs(Et);
+    const s = this.props.groupable === !0 || typeof this.props.groupable == "object" && this.props.groupable.enabled !== !1, o = this.getVirtualScroll(t);
+    this.vs = new o(s || t.rowHeight === void 0 || t.rowHeight === 0), this.dragLogic = new xr(
+      this.columnReorder.bind(this),
+      this.groupReorder.bind(this),
+      this.columnToGroup.bind(this)
+    ), this.columnResize = new br(this.onResize), X.onConstructor({
+      navigatable: !!t.navigatable,
+      contextStateRef: this.contextStateRef,
+      navigationStateRef: this.navigationStateRef,
+      idPrefix: this._gridId
+    });
+  }
+  /* eslint-disable max-len */
+  /**
+   * A getter of the current columns. Gets the current column width or current columns, or any other [`GridColumnProps`]({% slug api_grid_gridcolumnprops %}) for each defined column. Can be used on each Grid instance. To obtain the instance of the rendered Grid, use the `ref` callback. The following example demonstrates how to reorder the columns by dragging their handlers and check the properties afterwards. You can check the result in the browser console.
+   *
+   * @example
+   * ```jsx
+   * class App extends React.Component {
+   *     constructor(props) {
+   *         super(props);
+   *         this.state = {
+   *             data: [
+   *                 { 'foo': 'A1', 'bar': 'B1' },
+   *                 { 'foo': 'A2', 'bar': 'B2' },
+   *                 { 'foo': 'A3', 'bar': 'B2' }
+   *             ]
+   *         };
+   *         this.grid = null;
+   *     }
+   *     render() {
+   *         return (
+   *             <div>
+   *                 <Grid
+   *                     data={this.state.data}
+   *                     reorderable={true}
+   *                     ref={(g) => { this.grid = g; }}
+   *                 >
+   *                     <GridColumn field="foo" />
+   *                     <GridColumn field="bar" />
+   *                 </Grid>
+   *                 <button onClick={() => console.log(JSON.stringify(this.grid.columns))}>
+   *                     log current properties into browser console.
+   *                 </button>
+   *             </div>
+   *         );
+   *     }
+   * }
+   * ReactDOM.render(<App />, document.querySelector('my-app'));
+   * ```
+   */
+  // tslint:enable:max-line-length
+  get columns() {
+    const t = this._columns.filter((s) => s.declarationIndex >= 0 && s.parentIndex === -1);
+    return zt(t);
+  }
+  /**
+   * Returns the HTML element of the Grid component.
+   */
+  get element() {
+    return this._element;
+  }
+  get document() {
+    if (ot)
+      return this.element && this.element.ownerDocument || document;
+  }
+  get _header() {
+    return this.headerRef.current;
+  }
+  /**
+   * @hidden
+   */
+  componentDidMount() {
+    this.resetTableWidth(), lt();
+    const t = wt(this.element);
+    this.isRtl = t, X.onComponentDidMount({
+      scope: this.element || void 0,
+      contextStateRef: this.contextStateRef,
+      navigationStateRef: this.navigationStateRef
+    }), this.isRtl && this.forceUpdate();
+    const s = {
+      rootMargin: "0px",
+      threshold: 0.9
+    };
+    this.observer = ot && window.IntersectionObserver && new window.IntersectionObserver(this.handleIntersection, s) || null;
+  }
+  /**
+   * @hidden
+   */
+  getSnapshotBeforeUpdate() {
+    return X.onGetSnapshotBeforeUpdate({
+      document: this.document,
+      contextStateRef: this.contextStateRef,
+      navigationStateRef: this.navigationStateRef
+    }), null;
+  }
+  /**
+   * @hidden
+   */
+  componentDidUpdate() {
+    this.resetTableWidth(), lt(), this.vs.tableTransform && this.vs.table && (this.vs.table.style.transform = this.vs.tableTransform, this.vs.tableTransform = ""), X.onComponentDidUpdate({
+      scope: this.element || void 0,
+      contextStateRef: this.contextStateRef,
+      navigationStateRef: this.navigationStateRef
+    });
+  }
+  /**
+   * @hidden
+   */
+  componentWillUnmount() {
+    clearTimeout(this.forceUpdateTimeout);
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    var rt;
+    let t = this.props.total || 0;
+    const s = z.getIdPrefix(this.navigationStateRef);
+    let o = [];
+    Array.isArray(this.props.data) ? (o = this.props.data, t = t || this.props.data.length) : this.props.data && (o = this.props.data.data, t = t || this.props.data.total);
+    const e = typeof this.props.groupable == "object" && this.props.groupable.footer || "none", { resolvedGroupsCount: i, flattedData: n } = this.flatData(
+      o,
+      e,
+      this.props.skip || 0,
+      this.props.group,
+      this.props.expandField,
+      this.props.filter,
+      this.props.sort
+    );
+    this._data = n;
+    const a = this.props.groupable === !0 || typeof this.props.groupable == "object" && this.props.groupable.enabled !== !1;
+    this.columnResize.resizable = this.props.resizable || !1, this.dragLogic.reorderable = this.props.reorderable || !1, this.dragLogic.groupable = a;
+    const h = this.props.selectable && this.props.selectable.drag ? "none" : void 0;
+    this.initializeVirtualization(t, a);
+    const c = this.childrenToArray(this.props.children);
+    this.initColumns(c, i);
+    const d = c.map((f) => f && f.type && f.type.displayName === "KendoReactGridToolbar" ? l.cloneElement(f, { ...f.props, ariaControls: this._gridRoleElementId }) : null), g = c.filter((f) => f && f.type && f.type.displayName === "KendoReactGridNoRecords"), m = c.filter((f) => f && f.type && f.type.displayName === "KendoReactGridStatusBar"), u = this._columns.filter((f) => f.children.length === 0), b = a && /* @__PURE__ */ l.createElement(
+      Zt,
+      {
+        group: this.props.group || [],
+        groupChange: this.groupChange,
+        pressHandler: this.dragLogic.pressHandler,
+        dragHandler: this.dragLogic.dragHandler,
+        releaseHandler: this.dragLogic.releaseHandler,
+        refCallback: this.dragLogic.refGroupPanelDiv,
+        resolveTitle: this.resolveTitle,
+        ariaControls: this._gridRoleElementId,
+        onContextMenu: this.onContextMenu
+      }
+    ), { sort: E, sortable: C, group: x, filter: I, filterable: k, filterOperators: _ = bt, headerCellRender: D, columnMenu: de } = this.props, Y = /* @__PURE__ */ l.createElement(
+      or,
+      {
+        size: this.props.size,
+        columnResize: this.columnResize,
+        staticHeaders: this.props.scrollable !== "none",
+        scrollableDataElement: () => this.vs.container,
+        draggable: this.props.reorderable || a,
+        ref: this.headerRef,
+        elemRef: this.headerElementRef,
+        headerRow: this.getHeaderRow(
+          E,
+          C,
+          x,
+          a,
+          I,
+          k,
+          _,
+          D,
+          de,
+          this._columns,
+          this._columnsMap,
+          this.isRtl
+        ),
+        filterRow: this.props.filterable && /* @__PURE__ */ l.createElement(
+          Jt,
+          {
+            cells: this.props.cells,
+            size: this.props.size,
+            columns: this._columns,
+            filter: this.props.filter,
+            filterOperators: this.props.filterOperators || bt,
+            filterChange: this.filterChange,
+            sort: this.props.sort,
+            cellRender: this.props.filterCellRender,
+            isRtl: this.isRtl,
+            ariaRowIndex: this._columnsMap.length + 1
+          }
+        ) || void 0,
+        cols: u.map((f, w) => /* @__PURE__ */ l.createElement(
+          "col",
+          {
+            key: w.toString(),
+            width: Se(f)
+          }
+        ))
+      }
+    ), $ = this.vs && this.vs.container && this.vs.container.scrollLeft || 0, F = parseFloat(((this.props.style || {}).width || "").toString()), { colSpans: ke, hiddenColumns: pe } = Es({
+      enabled: this.props.columnVirtualization,
+      columns: u,
+      tableViewPortWidth: F,
+      scrollLeft: $
+    }), ve = (f, w, R) => {
+      let j = !1;
+      const V = this.props.selectedField ? M(this.props.selectedField, f.dataItem) : void 0;
+      return {
+        row: u.map((S, N) => {
+          if (pe[N])
+            return null;
+          const ee = S.id ? S.id : N, te = `${S.className ? S.className + " " : ""}${S.locked ? "k-grid-content-sticky" : ""}`, P = S.left !== void 0 ? this.isRtl ? { left: S.right, right: S.left } : { left: S.left, right: S.right } : {};
+          let A = !1;
+          if (S.editable && this.props.editField) {
+            const H = M(this.props.editField, f.dataItem);
+            H && (H === !0 || H === S.field) && (j = !0, A = !0);
+          }
+          let Ie = S.cell || A && ir || kr;
+          return /* @__PURE__ */ l.createElement(
+            Ie,
+            {
+              onContextMenu: this.onContextMenu,
+              key: ee,
+              locked: this.props.lockGroups,
+              id: z.generateNavigatableId(`${w}-${String(N)}`, s),
+              colSpan: ke[N],
+              dataItem: f.dataItem,
+              field: S.field,
+              editor: S.editor,
+              format: S.format,
+              className: te,
+              render: this.props.cellRender,
+              cells: Ce(this.props.cells, S.cells),
+              onChange: this.itemChange,
+              selectionChange: this.props.onSelectionChange ? (H) => {
+                this.selectionChange({ event: H, dataItem: f.dataItem, dataIndex: R, columnIndex: N });
+              } : void 0,
+              columnIndex: N,
+              columnsCount: u.length,
+              rowType: f.rowType,
+              level: f.level,
+              expanded: f.expanded,
+              dataIndex: f.dataIndex,
+              style: P,
+              ariaColumnIndex: S.ariaColumnIndex,
+              isSelected: Array.isArray(V) && V.indexOf(N) > -1
+            }
+          );
+        }),
+        isInEdit: j,
+        isSelected: typeof V == "boolean" && V
+      };
+    };
+    let J = 0;
+    if (this.props.scrollable === "virtual")
+      for (let f = 0; f < this.vs.topCacheCount + this.vs.attendedSkip - (this.props.skip || 0); f++) {
+        const w = this._data.shift();
+        if (w)
+          this._data.push(w), J++, w.rowType === "groupHeader" && f--;
+        else
+          break;
+      }
+    const Xe = (f) => f >= this._data.length - J;
+    let Ye = this.vs.realSkip || 0;
+    const Q = [], Ee = this._columnsMap.length + (this.props.filterable ? 1 : 0) + 1;
+    let Z = 0;
+    if (this._data.length) {
+      let f = -1, w = 0;
+      (this._slicedData || this._data).forEach((R, j) => {
+        R.rowType === "data" && (Ye++, f++);
+        const V = Ye % 2 === 0, S = this.props.dataItemKey && ye(this.props.dataItemKey)(R.dataItem), N = j + (this.vs.realSkip || 0), ee = S || "ai" + N, te = ee + "_1", P = ve(R, ee, f);
+        if (Z = N + Ee + w, Q.push(/* @__PURE__ */ l.createElement(
+          vr,
+          {
+            key: ee,
+            dataItem: R.dataItem,
+            isAltRow: V,
+            isInEdit: P.isInEdit,
+            rowType: R.rowType,
+            isHidden: Xe(j),
+            onClick: (A) => this.rowClick(A, R),
+            onDoubleClick: (A) => this.rowDblClick(A, R),
+            selectedField: this.props.selectedField,
+            rowHeight: this.props.rowHeight,
+            render: this.props.rowRender,
+            ariaRowIndex: Z,
+            absoluteRowIndex: N,
+            dataIndex: f,
+            isSelected: P.isSelected
+          },
+          P.row
+        )), this.props.detail && R.rowType === "data" && R.expanded) {
+          const A = u.length - (this.props.expandField ? 1 : 0) - (this.props.group ? this.props.group.length : 0) || 1;
+          w++, Z = N + Ee + w, Q.push(/* @__PURE__ */ l.createElement(
+            "tr",
+            {
+              key: te,
+              className: y(
+                "k-table-row",
+                V ? "k-detail-row k-table-alt-row k-alt" : "k-detail-row"
+              ),
+              style: { visibility: Xe(j) ? "hidden" : "", height: this.props.detailRowHeight },
+              role: "row",
+              "aria-rowindex": Z
+            },
+            this.props.group && this.props.group.map((Ie, H) => {
+              var it;
+              const se = (it = P == null ? void 0 : P.row[H]) == null ? void 0 : it.props.style, ds = se ? this.isRtl ? { left: se.right, right: se.left } : { left: se.left, right: se.right } : {};
+              return /* @__PURE__ */ l.createElement(
+                vt,
+                {
+                  id: "",
+                  dataIndex: R.dataIndex,
+                  field: Ie.field,
+                  dataItem: R.dataItem,
+                  key: H,
+                  style: ds,
+                  ariaColumnIndex: 1 + H,
+                  isSelected: !1,
+                  locked: this.props.lockGroups,
+                  isRtl: this.isRtl,
+                  cells: this.props.cells
+                }
+              );
+            }),
+            this.props.expandField && /* @__PURE__ */ l.createElement(
+              Rr,
+              {
+                id: z.generateNavigatableId(`${te}-dhcell`, s)
+              }
+            ),
+            /* @__PURE__ */ l.createElement(
+              wr,
+              {
+                onContextMenu: this.onContextMenu,
+                dataItem: R.dataItem,
+                dataIndex: R.dataIndex,
+                colSpan: A,
+                ariaColIndex: 2 + (this.props.group ? this.props.group.length : 0),
+                detail: this.props.detail,
+                id: z.generateNavigatableId(`${te}-dcell`, s)
+              }
+            )
+          ));
+        }
+      });
+    } else
+      Q.push(/* @__PURE__ */ l.createElement("tr", { key: "no-records", className: "k-table-row k-grid-norecords", role: "row", "aria-rowindex": Ee }, /* @__PURE__ */ l.createElement("td", { className: "k-table-td", colSpan: u.length, role: "gridcell" }, g.length ? g : /* @__PURE__ */ l.createElement($e, null))));
+    const Je = {
+      size: this.props.size,
+      onPageChange: this.pagerPageChange,
+      total: t,
+      dir: this.isRtl ? "rtl" : void 0,
+      skip: this.vs.propsSkip || 0,
+      take: (this.props.take !== void 0 ? this.props.take : this.props.pageSize) || 10,
+      messagesMap: tr,
+      ...yr(this.props.pageable || {})
+    }, Qe = this.props.pager ? /* @__PURE__ */ l.createElement(this.props.pager, { ...Je }) : /* @__PURE__ */ l.createElement(Is, { className: "k-grid-pager", ...Je }), hs = (f) => this.props.sort && this.props.sort.filter((w) => w.field === f).length > 0, cs = (f, w) => /* @__PURE__ */ l.createElement(
+      "col",
+      {
+        key: w.toString(),
+        width: Se(f)
+      }
+    ), Ze = (rt = this.props.cells) != null && rt.footerCell || this._columns.some(
+      (f) => {
+        var w;
+        return !!(f.footerCell || (w = f.cells) != null && w.footerCell);
+      }
+    ) ? /* @__PURE__ */ l.createElement(
+      gr,
+      {
+        size: this.props.size,
+        columnResize: this.columnResize,
+        staticHeaders: this.props.scrollable !== "none",
+        ref: (f) => this._footer = f,
+        row: /* @__PURE__ */ l.createElement(
+          Ir,
+          {
+            cells: this.props.cells,
+            columns: this._columns,
+            isRtl: this.isRtl,
+            ariaRowIndex: Z + 1
+          }
+        ),
+        cols: u.map(cs)
+      }
+    ) : null, et = /* @__PURE__ */ l.createElement(
+      "colgroup",
+      {
+        ref: (f) => {
+          this.columnResize.colGroupMain = f;
+        }
+      },
+      u.map(
+        (f, w) => /* @__PURE__ */ l.createElement(
+          "col",
+          {
+            key: w.toString(),
+            className: hs(f.field) ? "k-sorted" : void 0,
+            width: Se(f)
+          }
+        )
+      )
+    ), tt = this.dragLogic.reorderable || this.dragLogic.groupable, st = this.props.columnVirtualization ? "block" : "table";
+    if (this.props.scrollable === "none")
+      return /* @__PURE__ */ l.createElement(we.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          id: this.props.id,
+          style: this.props.style,
+          className: y(
+            "k-grid",
+            {
+              "k-grid-md": !this.props.size,
+              [`k-grid-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+            },
+            this.props.className
+          ),
+          ref: (f) => {
+            this._element = f;
+          },
+          "aria-label": this.props.ariaLabel,
+          onKeyDown: this.onKeyDown,
+          onFocus: this.onFocus,
+          ...ct
+        },
+        d,
+        b,
+        /* @__PURE__ */ l.createElement(
+          dt,
+          {
+            selectable: this.props.selectable,
+            onRelease: this.selectionRelease,
+            childRef: (f) => {
+              this.tableElement = f;
+            }
+          },
+          /* @__PURE__ */ l.createElement(
+            "table",
+            {
+              className: y(
+                "k-table k-grid-table",
+                { [`k-table-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size }
+              ),
+              style: { userSelect: h, display: st }
+            },
+            et,
+            Y,
+            /* @__PURE__ */ l.createElement("tbody", { role: "rowgroup", className: "k-table-tbody", ...pt }, Q),
+            Ze
+          )
+        ),
+        tt && /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(ut, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ l.createElement(gt, { ref: this.dragLogic.refDragElementClue }))
+      ), m, this.props.pageable && Qe);
+    let ue = this.props.style || {};
+    return this.props.scrollable === "virtual" && (ue.height || (ue = Object.assign({}, ue, { height: "450px" }))), /* @__PURE__ */ l.createElement(we.Provider, { value: this.contextStateRef.current }, /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        id: this.props.id,
+        style: ue,
+        className: y(
+          "k-grid",
+          {
+            "k-grid-md": !this.props.size,
+            [`k-grid-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size,
+            "k-grid-virtual": this.props.scrollable === "virtual"
+          },
+          this.props.className
+        ),
+        ref: (f) => {
+          this._element = f;
+        },
+        "aria-label": this.props.ariaLabel,
+        onKeyDown: this.onKeyDown,
+        onFocus: this.onFocus,
+        ...ct
+      },
+      d,
+      b,
+      /* @__PURE__ */ l.createElement(
+        "div",
+        {
+          className: "k-grid-aria-root",
+          role: "grid",
+          "aria-colcount": u.length,
+          "aria-rowcount": t,
+          id: this._gridRoleElementId
+        },
+        Y,
+        /* @__PURE__ */ l.createElement("div", { className: "k-grid-container", role: "presentation" }, /* @__PURE__ */ l.createElement(
+          "div",
+          {
+            ref: this.containerRef,
+            className: "k-grid-content k-virtual-content",
+            onScroll: this.scrollHandler,
+            role: "presentation"
+          },
+          /* @__PURE__ */ l.createElement("div", { className: "k-grid-table-wrap", role: "presentation" }, /* @__PURE__ */ l.createElement(
+            dt,
+            {
+              selectable: this.props.selectable,
+              onRelease: this.selectionRelease,
+              childRef: (f) => {
+                this.tableElement = f;
+              }
+            },
+            /* @__PURE__ */ l.createElement(
+              "table",
+              {
+                className: y(
+                  "k-table k-grid-table",
+                  {
+                    "k-table-md": !this.props.size,
+                    [`k-table-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+                  }
+                ),
+                role: "presentation",
+                style: { userSelect: h, display: st }
+              },
+              et,
+              /* @__PURE__ */ l.createElement(
+                "tbody",
+                {
+                  className: "k-table-tbody",
+                  ref: this.tableBodyRef,
+                  role: "rowgroup",
+                  ...pt
+                },
+                Q
+              )
+            )
+          )),
+          /* @__PURE__ */ l.createElement("div", { className: "k-height-container", role: "presentation" }, /* @__PURE__ */ l.createElement(
+            "div",
+            {
+              style: this.props.scrollable === "virtual" ? { height: this.vs.containerHeight + "px" } : {}
+            }
+          ))
+        )),
+        Ze,
+        tt && /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(ut, { ref: this.dragLogic.refDropElementClue }), /* @__PURE__ */ l.createElement(gt, { ref: this.dragLogic.refDragElementClue })),
+        this.showLicenseWatermark && /* @__PURE__ */ l.createElement(fs, null)
+      ),
+      m,
+      this.props.pageable && Qe
+    ));
+  }
+  selectionChange(t) {
+    if (this.props.onSelectionChange) {
+      const { event: s, dataItem: o, dataIndex: e, columnIndex: i } = t, { mode: n, cell: a } = ht(this.props.selectable), h = {
+        ...this.getArguments(s.syntheticEvent),
+        dataItem: o,
+        startColIndex: i,
+        endColIndex: i,
+        startRowIndex: e,
+        endRowIndex: e,
+        dataItems: this.getLeafDataItems(),
+        altKey: !1,
+        ctrlKey: !1,
+        shiftKey: !1,
+        metaKey: !1,
+        mode: n,
+        cell: a,
+        isDrag: !1,
+        componentId: this._gridId,
+        selectedField: this.props.selectedField || ""
+      };
+      this.props.onSelectionChange.call(void 0, h);
+    }
+  }
+  raiseDataEvent(t, s, o, e, i) {
+    const n = this.props.onDataStateChange;
+    if (t) {
+      const a = { ...this.getArguments(e), ...s, targetEvent: i };
+      t.call(void 0, a);
+    } else
+      n && n.call(
+        void 0,
+        {
+          ...this.getArguments(e),
+          targetEvent: i || {},
+          dataState: {
+            ...this.getDataState(),
+            ...o
+          }
+        }
+      );
+  }
+  columnReorder(t, s, o) {
+    const e = this._columns[t], i = e.depth, n = (d) => {
+      do
+        d++;
+      while (d < this._columns.length && this._columns[d].depth > i);
+      return d;
+    }, a = this._columns.splice(t, n(t) - t);
+    this._columns.splice(t < s ? n(s - a.length) : s, 0, ...a), this._columns.filter((d) => d.declarationIndex >= 0).forEach((d, g) => d.orderIndex = g), this._columnsMutations++;
+    const h = this._columns[t].locked && this._columns[s].locked;
+    Ss(this._columnsMap, this._columns, h || this._shouldUpdateLeftRight), ys(this._columnsMap, this._columns, h || this._shouldUpdateLeftRight), this._resized && (this._shouldUpdateLeftRight = !1, this._resized = !1);
+    const c = this.columns;
+    if (this.forceUpdate(), this.props.onColumnReorder) {
+      const d = {
+        target: this,
+        columns: c,
+        columnId: e.id,
+        nativeEvent: o
+      };
+      this.props.onColumnReorder.call(void 0, d);
+    }
+  }
+  groupReorder(t, s, o) {
+    if (this.props.group === void 0)
+      return;
+    const e = this.props.group.slice();
+    e.splice(s, 0, ...e.splice(t, 1)), this.groupChange(e, o);
+  }
+  columnToGroup(t, s, o) {
+    const e = this._columns[t].field;
+    if (!e)
+      return;
+    const i = (this.props.group || []).slice();
+    i.splice(s, 0, { field: e }), this.groupChange(i, o);
+  }
+  resetTableWidth() {
+    let t = 0;
+    if (!this.columnResize.colGroupMain)
+      return;
+    const s = this.columnResize.colGroupMain.children;
+    for (let o = 0; o < s.length; o++) {
+      const e = s[o].width;
+      if (!e)
+        return;
+      t += parseFloat(e.toString());
+    }
+    t = Math.round(t), this._header && this._header.setWidth(t), this._footer && this._footer.setWidth(t), this.tableElement && (this.tableElement.style.width = t + "px");
+  }
+  initColumns(t, s) {
+    const o = z.getIdPrefix(this.navigationStateRef);
+    this._columns = this.readColumns(t, o, this._columnsMutations), this._columns.length === 0 && (this._columns = Bs(this.props.data, this.props.group, this.props.expandField, { prevId: 0, idPrefix: o })), this.configureColumns(this._columns, s, o), this._columnsMap = this.mapColumns(this._columns), this.columnResize.columns = this._columns, this.dragLogic.columns = this._columns;
+  }
+  getDataState() {
+    return {
+      filter: this.props.filter,
+      sort: this.props.sort,
+      skip: this.props.skip,
+      take: this.props.take !== void 0 ? this.props.take : this.props.pageSize,
+      group: this.props.group
+    };
+  }
+  getArguments(t) {
+    return {
+      nativeEvent: t && t.nativeEvent,
+      syntheticEvent: t,
+      target: this
+    };
+  }
+}
+be.displayName = "KendoReactGrid";
+be.defaultProps = {
+  // never use this
+};
+be.propTypes = {
+  data: p.oneOfType([
+    p.array,
+    p.shape({
+      data: p.array,
+      total: p.number
+    })
+  ]),
+  sortable: p.oneOfType([
+    p.bool,
+    p.shape({
+      mode: p.oneOf(["single", "multiple"]),
+      allowUnsort: p.bool
+    })
+  ]),
+  onSortChange: p.func,
+  sort: p.array,
+  filterable: p.bool,
+  filter: p.any,
+  onFilterChange: p.func,
+  pageable: p.oneOfType([
+    p.bool,
+    p.shape({
+      buttonCount: p.number,
+      info: p.bool,
+      type: p.oneOf(["numeric", "input"]),
+      pageSizes: p.oneOfType(
+        [
+          p.bool,
+          p.arrayOf(p.oneOfType([
+            p.string,
+            p.number
+          ]))
+        ]
+      ),
+      previousNext: p.bool
+    })
+  ]),
+  pageSize: p.number,
+  onPageChange: p.func,
+  total: p.number,
+  skip: p.number,
+  take: p.number,
+  fixedScroll: p.bool,
+  onExpandChange: p.func,
+  expandField: p.string,
+  selectedField: p.string,
+  onSelectionChange: p.func,
+  onHeaderSelectionChange: p.func,
+  resizable: p.bool,
+  reorderable: p.bool,
+  group: p.any,
+  groupable: p.oneOfType([
+    p.bool,
+    p.shape({
+      enabled: p.bool,
+      footer: p.oneOf(["always", "visible", "none"])
+    })
+  ]),
+  onGroupChange: p.func,
+  onRowClick: p.func,
+  onRowDoubleClick: p.func,
+  onItemChange: p.func,
+  editField: p.string,
+  scrollable: p.oneOf(["none", "scrollable", "virtual"]),
+  rowHeight: p.number,
+  detailRowHeight: p.number,
+  detail: p.any,
+  style: p.object,
+  onDataStateChange: p.func,
+  onColumnResize: p.func,
+  onColumnReorder: p.func,
+  dataItemKey: p.string,
+  navigatable: p.bool,
+  size: p.oneOf(["small", "medium"])
+};
+be.contextType = we;
+class xe extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    const { children: t } = this.props;
+    return /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        id: this.props.id,
+        className: y("k-columnmenu-item-wrapper", this.props.className),
+        style: this.props.style
+      },
+      t
+    );
+  }
+}
+class he extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    const { title: t, iconClass: s, svgIcon: o, selected: e } = this.props;
+    return /* @__PURE__ */ l.createElement("div", { onClick: this.props.onClick, className: `k-columnmenu-item ${e ? "k-selected" : ""}` }, (s || o) && /* @__PURE__ */ l.createElement(O, { name: s && ms(s), icon: o }), t);
+  }
+}
+class es extends l.Component {
+  constructor() {
+    super(...arguments), this.onGroupClick = (t) => {
+      if (t.preventDefault(), this.props.onGroupChange) {
+        const { column: s } = this.props;
+        if (!s.field)
+          return;
+        const o = (this.props.group || []).slice(), e = o.findIndex((i) => i.field === s.field);
+        e > -1 ? o.splice(e, 1) : o.push({
+          field: s.field
+        }), this.props.onGroupChange(o, t);
+      }
+      this.props.onCloseMenu && this.props.onCloseMenu();
+    };
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const { group: t, column: s } = this.props, o = T(this), e = !!(t && s.field && t.find((n) => n.field === s.field)), i = e ? Ot : Lt;
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
+      he,
+      {
+        title: o.toLanguageString(i, v[i]),
+        iconClass: e ? "k-i-ungroup" : "k-i-group",
+        svgIcon: e ? Ls : zs,
+        onClick: this.onGroupClick
+      }
+    ));
+  }
+}
+Nt(es);
+G(es);
+const ts = "asc", ss = "desc", Fr = {
+  true: {
+    asc: { asc: "", desc: "desc" },
+    desc: { asc: "asc", desc: "" },
+    "": { asc: "asc", desc: "desc" }
+  },
+  false: {
+    asc: { asc: "asc", desc: "desc" },
+    desc: { asc: "asc", desc: "desc" },
+    "": { asc: "asc", desc: "desc" }
+  }
+}, rs = (r, t) => t ? t.findIndex((s) => s.field === r) : -1, is = (r, t) => !!(t && r > -1 && t[r].dir === ts), os = (r, t) => !!(t && r > -1 && t[r].dir === ss);
+class je extends l.Component {
+  constructor() {
+    super(...arguments), this.onAscClick = (t) => {
+      this.onSort(t, ts), this.props.onCloseMenu && this.props.onCloseMenu();
+    }, this.onDescClick = (t) => {
+      this.onSort(t, ss), this.props.onCloseMenu && this.props.onCloseMenu();
+    }, this.onSort = (t, s) => {
+      if (t.preventDefault(), !this.props.onSortChange)
+        return;
+      const { column: o, sortable: e, sort: i } = this.props, { allowUnsort: n, mode: a } = Wt(e || !1, !1), h = (i || []).filter((g) => g.field === o.field)[0], c = Fr[n][h && h.dir || ""][s], d = a === "single" ? [] : (this.props.sort || []).filter((g) => g.field !== o.field);
+      c !== "" && o.field && d.push({ field: o.field, dir: c }), this.props.onSortChange(d, t);
+    };
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const { sort: t, column: s } = this.props, o = rs(s.field, t), e = T(this);
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
+      he,
+      {
+        title: e.toLanguageString(Me, v[Me]),
+        iconClass: "k-i-sort-asc-sm",
+        svgIcon: We,
+        selected: is(o, t),
+        onClick: this.onAscClick
+      }
+    ), /* @__PURE__ */ l.createElement(
+      he,
+      {
+        title: e.toLanguageString(Te, v[Te]),
+        iconClass: "k-i-sort-desc-sm",
+        svgIcon: Ve,
+        selected: os(o, t),
+        onClick: this.onDescClick
+      }
+    ));
+  }
+}
+je.active = (r, t) => {
+  const s = rs(r, t);
+  return os(s, t) || is(s, t);
+};
+Nt(je);
+G(je);
+class ls extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    return /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        id: this.props.id,
+        className: y("k-columnmenu-item-content", this.props.className),
+        style: this.props.style
+      },
+      /* @__PURE__ */ l.createElement(As, { style: { position: "relative", display: "block" } }, this.props.show ? this.props.children : null)
+    );
+  }
+}
+class It extends l.Component {
+  constructor(t) {
+    super(t), this.renderOperatorEditor = () => {
+      if (this.props.filterType === "boolean")
+        return;
+      const s = this.props.operators.find((o) => o.operator === this.props.operator) || null;
+      return /* @__PURE__ */ l.createElement(
+        le,
+        {
+          value: s,
+          onChange: this.operatorChange,
+          data: this.props.operators,
+          textField: "text"
+        }
+      );
+    }, this.inputChange = this.inputChange.bind(this), this.operatorChange = this.operatorChange.bind(this), this.boolDropdownChange = this.boolDropdownChange.bind(this);
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    return /* @__PURE__ */ l.createElement(l.Fragment, null, this.renderOperatorEditor(), this.filterComponent(this.props.filterType, this.props.value, this.props.booleanValues));
+  }
+  inputChange(t, s) {
+    qt(t, s, this.props);
+  }
+  operatorChange(t) {
+    Xt(t, this.props.value, this.props.onChange);
+  }
+  boolDropdownChange(t) {
+    jt(t, this.props.onChange);
+  }
+  filterComponent(t, s, o) {
+    switch (t) {
+      case "numeric":
+        return /* @__PURE__ */ l.createElement(
+          Ue,
+          {
+            value: s,
+            onChange: (e) => {
+              this.inputChange(e.value, e.syntheticEvent);
+            },
+            rangeOnEnter: !1
+          }
+        );
+      case "date":
+        return /* @__PURE__ */ l.createElement(
+          qe,
+          {
+            value: s,
+            onChange: (e) => {
+              this.inputChange(e.value, e.syntheticEvent);
+            }
+          }
+        );
+      case "boolean": {
+        const e = (i) => i == null;
+        return /* @__PURE__ */ l.createElement(
+          le,
+          {
+            onChange: this.boolDropdownChange,
+            value: o.find((i) => i.operator === (e(s) ? "" : s)),
+            data: o,
+            textField: "text"
+          }
+        );
+      }
+      default:
+        return /* @__PURE__ */ l.createElement(
+          Tt,
+          {
+            value: s || "",
+            onChange: (e) => {
+              this.inputChange(e.target.value, e.syntheticEvent);
+            }
+          }
+        );
+    }
+  }
+}
+class Nr extends l.Component {
+  render() {
+    const {
+      firstFilterProps: t,
+      hideSecondFilter: s,
+      secondFilterProps: o,
+      logicData: e,
+      logicValue: i,
+      onLogicChange: n
+    } = this.props;
+    return /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(It, { ...t }), !s && /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(
+      le,
+      {
+        data: e,
+        value: i,
+        onChange: n,
+        className: "k-filter-and",
+        textField: "text"
+      }
+    ), /* @__PURE__ */ l.createElement(It, { ...o })));
+  }
+}
+const Be = (r) => r || { filters: [], logic: "and" }, ge = (r, t) => Be(t).filters.filter((e) => ft(e) ? e.filters && e.filters.length && e.filters.length <= 2 && !e.filters.find((i) => ft(i) || i.field !== r) : !1)[0] || null;
+class ns extends l.Component {
+  constructor(t) {
+    super(t), this.removeGroup = (o, e) => {
+      const i = [...e.filters], n = i.findIndex((a) => a === o);
+      return n > -1 && i.splice(n, 1), {
+        ...e,
+        filters: i
+      };
+    }, this.insertGroup = (o, e) => ({
+      ...e,
+      filters: [
+        o,
+        ...e.filters
+      ]
+    }), this.isControlled = () => this.props.expanded !== void 0, this.onFilterExpand = () => {
+      const o = this.isControlled(), e = !(o ? this.props.expanded : this.state.expanded);
+      this.props.onExpandChange && this.props.onExpandChange(e), o || this.setState({
+        expanded: e
+      });
+    }, this.firstFilterChange = (o) => {
+      this.filterChange(0, o);
+    }, this.secondFilterChange = (o) => {
+      this.filterChange(1, o);
+    }, this.filterChange = (o, e) => {
+      const i = this.state.filterGroup.filters.map((n, a) => a === o ? {
+        ...n,
+        value: e.value,
+        operator: e.operator
+      } : n);
+      this.setState({
+        filterGroup: {
+          ...this.state.filterGroup,
+          filters: i
+        }
+      });
+    }, this.logicChange = (o) => {
+      this.setState({
+        filterGroup: {
+          ...this.state.filterGroup,
+          logic: o.target.value.operator
+        }
+      });
+    }, this.clear = (o) => {
+      if (o.preventDefault(), !this.props.onFilterChange)
+        return;
+      const e = this.props.column.field, i = Be(this.props.filter), n = ge(e, this.props.filter), a = i.filters.filter((h) => h !== n);
+      a.length ? this.props.onFilterChange({ ...i, filters: a }, o) : this.props.onFilterChange(null, o), this.props.onCloseMenu && this.props.onCloseMenu();
+    }, this.currentFilterGroup = () => ({
+      ...this.state.filterGroup,
+      filters: this.state.filterGroup.filters.filter((o) => o.value !== void 0 && o.value !== null && o.value !== "" || o.value === null && o.operator)
+    }), this.submit = (o) => {
+      if (o.preventDefault(), !this.props.onFilterChange)
+        return;
+      const e = this.props.column.field, i = Be(this.props.filter), n = ge(e, this.props.filter), a = this.currentFilterGroup();
+      let h = null;
+      if (n && a.filters.length > 0) {
+        const c = i.filters.map((d) => d === n ? a : d);
+        h = {
+          ...i,
+          filters: c
+        };
+      } else if (a.filters.length === 0) {
+        const c = i.filters.filter((d) => d !== n);
+        c.length && (h = {
+          ...i,
+          filters: c
+        });
+      } else
+        h = {
+          ...i,
+          filters: [...i.filters, a]
+        };
+      this.props.onFilterChange(h, o), this.props.onCloseMenu && this.props.onCloseMenu();
+    };
+    let s;
+    if (t.column && t.column.field) {
+      const o = Ae(t.column.filter), e = $t(t.filterOperators, o);
+      s = ge(t.column.field, t.filter), s = s ? {
+        ...s,
+        filters: s.filters.map((i) => ({ ...i }))
+      } : {
+        logic: "and",
+        filters: [
+          { field: t.column.field, operator: e, value: L(e) ? null : void 0 },
+          { field: t.column.field, operator: e, value: L(e) ? null : void 0 }
+        ]
+      }, s.filters.filter((i) => i.field === t.column.field).length === 1 && s.filters.splice(1, 0, { field: t.column.field, operator: e });
+    }
+    this.state = {
+      expanded: t.expanded || !1,
+      filterGroup: s
+    };
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const { column: t, filterUI: s, hideSecondFilter: o, filterOperators: e } = this.props;
+    if (!t || !t.field)
+      return /* @__PURE__ */ l.createElement("div", null);
+    const i = Ae(t.filter), n = o !== void 0 ? o : pr[i], a = T(this), h = this.state.filterGroup.filters, c = ie(e[i], a), d = ie(Ut, a), g = {
+      field: t.field,
+      value: h[0].value,
+      operator: h[0].operator,
+      operators: c,
+      booleanValues: d,
+      onChange: this.firstFilterChange,
+      filterType: i
+    }, m = {
+      field: t.field,
+      value: h[1].value,
+      operator: h[1].operator,
+      operators: c,
+      booleanValues: d,
+      onChange: this.secondFilterChange,
+      filterType: i
+    }, u = this.state.filterGroup.logic, b = ie(cr, a), E = {
+      value: b.find((D) => D.operator === (u === null ? "" : u)),
+      onChange: this.logicChange,
+      data: b
+    }, C = s, x = {
+      firstFilterProps: g,
+      secondFilterProps: m,
+      logicData: E.data,
+      logicValue: E.value,
+      onLogicChange: E.onChange,
+      hideSecondFilter: n
+    }, I = this.currentFilterGroup().filters.length !== 0 || L(h[0].operator) || L(h[1].operator), k = this.isControlled() ? this.props.expanded : this.state.expanded, _ = this.props.alwaysExpand;
+    return /* @__PURE__ */ l.createElement(xe, null, !_ && /* @__PURE__ */ l.createElement(
+      he,
+      {
+        title: a.toLanguageString(ae, v[ae]),
+        iconClass: "k-i-filter",
+        svgIcon: Ke,
+        onClick: this.onFilterExpand
+      }
+    ), /* @__PURE__ */ l.createElement(ls, { show: _ || !!k }, /* @__PURE__ */ l.createElement("div", { className: "kendo-grid-filter-menu-container" }, /* @__PURE__ */ l.createElement(
+      "form",
+      {
+        className: "k-filter-menu k-group k-reset k-state-border-up",
+        onSubmit: this.submit,
+        onReset: this.clear,
+        onKeyDown: (D) => D.stopPropagation()
+      },
+      /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, C ? /* @__PURE__ */ l.createElement(C, { ...x }) : /* @__PURE__ */ l.createElement(Nr, { ...x }), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ l.createElement(
+        W,
+        {
+          themeColor: "primary",
+          disabled: !I
+        },
+        a.toLanguageString(ne, v[ne])
+      ), /* @__PURE__ */ l.createElement(
+        W,
+        {
+          type: "reset"
+        },
+        a.toLanguageString(U, v[U])
+      )))
+    ))));
+  }
+}
+ns.active = (r, t) => !!ge(r, t);
+G(ns);
+const Dr = (r, t) => r.length !== t.length ? !1 : r.every((s, o) => s === t[o]);
+class as extends l.Component {
+  constructor(t) {
+    super(t), this.defaultFilter = () => this.props.filter ? Cs(this.props.filter) : { filters: [], logic: "and" }, this.isControlled = () => this.props.expanded !== void 0, this.parseData = (s, o) => {
+      let e = this.props.column.field || "", i = s.map((n) => M(e, n));
+      return o ? i.filter((n, a) => i.indexOf(n) === a) : i;
+    }, this.getFilterIndex = () => {
+      let s = this.props.column.field;
+      return this.defaultFilter().filters.findIndex((i) => i.filters && i.filters.length > 0 && i.filters[0].field === s);
+    }, this.onFilterExpand = () => {
+      const s = this.isControlled(), o = !(s ? this.props.expanded : this.state.expanded);
+      this.props.onExpandChange && this.props.onExpandChange(o), s || this.setState({
+        expanded: o
+      });
+    }, this.handleSearchChange = (s) => {
+      let o = this.props.searchBoxFilterOperator ? this.props.searchBoxFilterOperator : "startswith", e = {
+        logic: "and",
+        filters: [
+          { field: this.props.column.field, operator: o, value: s.target.value, ignoreCase: !0 }
+        ]
+      };
+      this.setState({
+        value: s.target.value,
+        data: this.parseData(mt(this.props.data || [], e), this.props.uniqueData)
+      });
+    }, this.handleClear = () => {
+      let s = this.props.searchBoxFilterOperator ? this.props.searchBoxFilterOperator : "startswith", o = {
+        logic: "and",
+        filters: [
+          { field: this.props.column.field, operator: s, value: "", ignoreCase: !0 }
+        ]
+      };
+      this.setState({
+        value: "",
+        data: this.parseData(mt(this.props.data || [], o), this.props.uniqueData)
+      });
+    }, this.clear = (s) => {
+      if (s.preventDefault(), !this.props.onFilterChange)
+        return;
+      let o = this.state.currentFilter || null;
+      o !== null && o.filters.length > 0 ? (this.compositeFilterIndex >= 0 && o.filters.splice(this.compositeFilterIndex, 1), this.props.onFilterChange(o, s)) : this.props.onFilterChange(null, s), this.props.onCloseMenu && this.props.onCloseMenu();
+    }, this.submit = (s) => {
+      if (s.preventDefault(), !this.props.onFilterChange)
+        return;
+      let o = this.state.currentFilter || null;
+      this.props.onFilterChange(o, s), this.props.onCloseMenu && this.props.onCloseMenu();
+    }, this.handleCheckBoxChange = (s, o) => {
+      const e = this.props.column.field || "";
+      let i = { ...this.state.currentFilter }, n = [...this.state.currentFilter.filters], a = [];
+      if (this.compositeFilterIndex !== -1 && i.filters[this.compositeFilterIndex].filters && o !== "all" && (a = i.filters[this.compositeFilterIndex].filters), s.value && o === "all")
+        this.state.data.forEach((h) => {
+          a.push({ field: e, operator: "eq", value: h });
+        });
+      else if (s.value)
+        a.push({ field: e, operator: "eq", value: o });
+      else if (this.state.currentFilter) {
+        let h = a.findIndex((c) => c.value === o);
+        a.splice(h, 1);
+      }
+      i.logic = "and", this.compositeFilterIndex !== -1 ? n[this.compositeFilterIndex] = {
+        logic: "or",
+        filters: a
+      } : n.push({
+        logic: "or",
+        filters: a
+      }), (!s.value && o === "all" || a.length === 0) && n.splice(this.compositeFilterIndex, 1), i.filters = n, this.setState({ currentFilter: i });
+    }, this.isAllSelected = () => {
+      let s = !1;
+      if (this.state.currentFilter) {
+        let o = [...this.state.currentFilter.filters];
+        return this.compositeFilterIndex === -1 ? !1 : (s = this.state.data.every((e) => this.compositeFilterIndex !== -1 && o[this.compositeFilterIndex].filters ? o[this.compositeFilterIndex].filters.findIndex((n) => n.value === e) >= 0 : !1), s);
+      }
+      return s;
+    }, this.compositeFilterIndex = this.getFilterIndex(), this.state = {
+      expanded: t.expanded || !1,
+      value: "",
+      data: this.parseData(this.props.data, this.props.uniqueData) || [],
+      dataFromProps: this.parseData(this.props.data, !1) || [],
+      currentFilter: this.defaultFilter()
+    };
+  }
+  /**
+   * @hidden
+   */
+  componentDidUpdate() {
+    let t = this.props.column.field || "", s = this.props.data.map((o) => M(t, o));
+    Dr(s, this.state.dataFromProps) || this.setState({
+      data: s,
+      dataFromProps: s
+    });
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const { column: t } = this.props;
+    if (!t || !t.field)
+      return /* @__PURE__ */ l.createElement("div", null);
+    const s = T(this), o = this.isControlled() ? this.props.expanded : this.state.expanded;
+    let e = [];
+    if (this.state.currentFilter) {
+      const a = [...this.state.currentFilter.filters];
+      this.compositeFilterIndex = a.findIndex((h) => h.filters && h.filters.length > 0 ? h.filters[0].field === t.field : !1), this.compositeFilterIndex !== -1 && a[this.compositeFilterIndex].filters.length > 0 && a[this.compositeFilterIndex].filters.forEach((h) => {
+        h.field === this.props.column.field && e.push(h.value);
+      });
+    }
+    const i = this.props.searchBox ? /* @__PURE__ */ l.createElement(this.props.searchBox, { value: this.state.value, onChange: this.handleSearchChange }) : /* @__PURE__ */ l.createElement("div", { className: "k-searchbox k-textbox k-input k-input-md k-input-solid" }, /* @__PURE__ */ l.createElement(O, { className: "k-input-icon", name: "search", icon: Dt }), /* @__PURE__ */ l.createElement(
+      Tt,
+      {
+        className: "k-input-inner",
+        type: "text",
+        placeholder: s.toLanguageString(Ge, v[Ge]),
+        value: this.state.value,
+        onChange: (a) => this.handleSearchChange(a.nativeEvent)
+      }
+    ), /* @__PURE__ */ l.createElement(
+      W,
+      {
+        type: "button",
+        rounded: null,
+        className: "k-input-button",
+        onClick: this.handleClear,
+        icon: "x",
+        svgIcon: Os
+      }
+    )), n = e.filter((a, h) => e.indexOf(a) === h);
+    return /* @__PURE__ */ l.createElement(xe, null, /* @__PURE__ */ l.createElement(
+      he,
+      {
+        title: s.toLanguageString(ae, v[ae]),
+        iconClass: "k-i-filter",
+        svgIcon: Ke,
+        onClick: this.onFilterExpand
+      }
+    ), /* @__PURE__ */ l.createElement(ls, { show: !!o }, /* @__PURE__ */ l.createElement("div", { className: "kendo-grid-filter-menu-container" }, /* @__PURE__ */ l.createElement(
+      "form",
+      {
+        className: "k-filter-menu k-group k-reset k-state-border-up",
+        onSubmit: this.submit,
+        onReset: this.clear
+      },
+      /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, i, /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-multicheck-wrap" }, /* @__PURE__ */ l.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ l.createElement(
+        fe,
+        {
+          label: s.toLanguageString(He, v[He]),
+          onChange: (a) => this.handleCheckBoxChange(a, "all"),
+          checked: this.isAllSelected()
+        }
+      )), this.state.data.map((a, h) => /* @__PURE__ */ l.createElement("li", { className: "k-item", key: h }, /* @__PURE__ */ l.createElement(
+        fe,
+        {
+          label: String(a),
+          onChange: (c) => this.handleCheckBoxChange(c, a),
+          checked: n.includes(a)
+        }
+      )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, n.length + " " + s.toLanguageString(Le, v[Le])), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-hstack k-justify-content-stretch" }, /* @__PURE__ */ l.createElement(
+        W,
+        {
+          themeColor: "primary",
+          type: "submit"
+        },
+        s.toLanguageString(ne, v[ne])
+      ), /* @__PURE__ */ l.createElement(
+        W,
+        {
+          className: "k-button",
+          type: "reset"
+        },
+        s.toLanguageString(U, v[U])
+      )))
+    ))));
+  }
+}
+as.defaultProps = {
+  uniqueData: !0
+};
+G(as);
+const Mr = (r) => {
+  const [t, s] = l.useState(""), o = l.useMemo(() => new Set(r.columnsState.map((u) => u.id)), [r.columnsState]), e = l.useMemo(() => r.columns.filter((u) => {
+    var b;
+    return (b = u.title || u.field) == null ? void 0 : b.toLowerCase().includes(t.toLowerCase());
+  }), [r.columns, t]), [i, n] = l.useState(r.columns.map((u) => o.has(u.id))), a = l.useCallback(() => {
+    const u = r.columns.filter((b, E) => i[E]);
+    r.onColumnsChange.call(void 0, u), r.onCloseMenu.call(void 0);
+  }, [i, r.columns, r.onColumnsChange, r.onCloseMenu]), h = l.useCallback(() => {
+    n(r.columns.map((u) => o.has(u.id)));
+  }, [o, r.columns]), c = i.filter((u) => u).length, d = c === i.length, g = l.useCallback(() => {
+    n(r.columns.map((u, b) => d && b === 0 ? !0 : !d));
+  }, [r.columns, d]), m = l.useCallback((u, b) => {
+    const E = i.slice();
+    E[b] = u, n(E);
+  }, [i]);
+  return /* @__PURE__ */ l.createElement("form", { className: "k-filter-menu k-group k-reset" }, /* @__PURE__ */ l.createElement("div", { className: "k-filter-menu-container" }, /* @__PURE__ */ l.createElement(
+    Mt,
+    {
+      className: "k-searchbox",
+      value: t,
+      onChange: (u) => s(String(u.target.value)),
+      prefix: () => /* @__PURE__ */ l.createElement(_s, null, /* @__PURE__ */ l.createElement(O, { name: "search", icon: Dt }))
+    }
+  ), /* @__PURE__ */ l.createElement("ul", { className: "k-reset k-multicheck-wrap" }, !t && /* @__PURE__ */ l.createElement("li", { className: "k-item k-check-all-wrap" }, /* @__PURE__ */ l.createElement(
+    fe,
+    {
+      checked: d,
+      onChange: g,
+      label: "(Select all)"
+    }
+  )), e.map((u, b) => /* @__PURE__ */ l.createElement("li", { key: u.id, className: "k-item" }, /* @__PURE__ */ l.createElement(
+    fe,
+    {
+      disabled: i[b] && c === 1,
+      checked: i[b],
+      onChange: (E) => {
+        var C;
+        return m(!!((C = E.target.element) != null && C.checked), b);
+      },
+      label: u.title || u.field
+    }
+  )))), /* @__PURE__ */ l.createElement("div", { className: "k-filter-selected-items" }, c, " selected items"), /* @__PURE__ */ l.createElement("div", { className: "k-actions k-actions-start k-actions-horizontal" }, /* @__PURE__ */ l.createElement(W, { type: "button", themeColor: "primary", onClick: a }, "Apply"), /* @__PURE__ */ l.createElement(W, { type: "button", onClick: h }, "Reset"))));
+};
+Mr.displayName = "GridColumnMenuColumnsList";
+class qr extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    return null;
+  }
+}
+class Tr extends l.Component {
+  /**
+   * @hidden
+   */
+  render() {
+    return /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        className: y(
+          "k-toolbar k-grid-toolbar",
+          {
+            "k-toolbar-md": !this.props.size,
+            [`k-toolbar-${K.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+          },
+          this.props.className
+        ),
+        "aria-label": this.props.ariaLabel,
+        "aria-controls": this.props.ariaControls,
+        role: "toolbar"
+      },
+      this.props.children
+    );
+  }
+}
+Tr.displayName = "KendoReactGridToolbar";
+const Gr = (r) => {
+  const { data: t = [] } = r;
+  return /* @__PURE__ */ l.createElement("div", { className: "k-selection-aggregates k-grid-selection-aggregates" }, t.map((s, o) => /* @__PURE__ */ l.createElement("div", { key: o }, /* @__PURE__ */ l.createElement("span", { className: "k-selection-aggregates-item-text" }, s.type, ": "), /* @__PURE__ */ l.createElement("span", { className: "k-selection-aggregates-item-value" }, s.formattedValue))));
+};
+Gr.displayName = "KendoReactGridStatusBar";
+const Hr = (r) => {
+  var s;
+  const t = r.slice();
+  for (let o = 0; o < t.length; o++)
+    for (; t[o] && ((s = t[o].children) != null && s.length); )
+      t.splice(o, 1, ...t[o].children);
+  return t;
+}, $r = (r) => {
+  const { dataItems: t, target: s, selectedField: o } = r, i = Hr(s.columns).map((C) => C.field).filter((C) => C && typeof C == "string").map((C) => ye(C)), n = ye(o), a = { dates: [], numbers: [], booleans: [], others: [] }, h = (C) => {
+    typeof C == "number" ? a.numbers.push(C) : typeof C == "boolean" ? a.booleans.push(C) : C instanceof Date ? a.dates.push(C) : a.others.push(C);
+  };
+  t.forEach((C) => {
+    const x = n(C);
+    x && x.forEach((I) => {
+      h(i[I](C));
+    });
+  });
+  const c = a.dates.map((C) => C.getTime()), d = a.booleans.filter((C) => C).length, g = a.booleans.filter((C) => !C).length, m = a.numbers.length ? a.numbers.reduce((C, x) => C += x, 0) : void 0, u = {
+    sum: m,
+    average: typeof m == "number" ? m / a.numbers.length : void 0,
+    min: a.numbers.length ? Math.min(...a.numbers) : void 0,
+    max: a.numbers.length ? Math.max(...a.numbers) : void 0,
+    count: a.numbers.length + a.booleans.length + a.dates.length + a.others.length,
+    isTrue: d > 0 ? d : void 0,
+    isFalse: g > 0 ? g : void 0,
+    earliest: a.dates.length ? new Date(Math.min(...c)) : void 0,
+    latest: a.dates.length ? new Date(Math.max(...c)) : void 0
+  }, b = (C, x) => (x === "sum" || x === "average") && typeof C == "number" ? C.toFixed(2) : (x === "earliest" || x === "latest") && C instanceof Date ? C.toLocaleDateString() : String(C), E = [];
+  return Object.keys(u).forEach((C) => {
+    const x = C, I = u[x];
+    I !== void 0 && E.push({ type: x, value: I, formattedValue: b(I, x) });
+  }), E;
+};
+export {
+  re as GRID_COL_INDEX_ATTRIBUTE,
+  rr as GRID_ROW_INDEX_ATTRIBUTE,
+  be as Grid,
+  kr as GridCell,
+  ce as GridColumn,
+  as as GridColumnMenuCheckboxFilter,
+  Mr as GridColumnMenuColumnsList,
+  ns as GridColumnMenuFilter,
+  It as GridColumnMenuFilterCell,
+  Nr as GridColumnMenuFilterUI,
+  es as GridColumnMenuGroup,
+  he as GridColumnMenuItem,
+  ls as GridColumnMenuItemContent,
+  xe as GridColumnMenuItemGroup,
+  je as GridColumnMenuSort,
+  Vt as GridColumnMenuWrapper,
+  xr as GridCommonDragLogic,
+  qr as GridDetailRow,
+  ir as GridEditCell,
+  Yt as GridFilterCell,
+  vt as GridGroupCell,
+  nr as GridHeaderCell,
+  sr as GridHierarchyCell,
+  $e as GridNoRecords,
+  vr as GridRow,
+  Ks as GridSelectionCell,
+  Tr as GridToolbar,
+  Gr as StatusBar,
+  Ut as booleanFilterValues,
+  ge as filterGroupByField,
+  Yr as getSelectedState,
+  Jr as getSelectedStateFromKeyDown,
+  $r as getStatusData,
+  v as gridMessages,
+  Hr as leafColumns,
+  bt as operators,
+  qs as pagerFirstPage,
+  Us as pagerInfo,
+  Ys as pagerItemPerPage,
+  Xs as pagerLastPage,
+  js as pagerNextPage,
+  $s as pagerPreviousPage,
+  Be as rootFilterOrDefault,
+  Qr as setSelectedState
+};