@progress/kendo-react-grid/header/HeaderRow.mjs

React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import * as t from "react";
import { GridHeaderCell as F } from "./GridHeaderCell.mjs";
import { uGrid as j, classNames as o, IconWrap as q } from "@progress/kendo-react-common";
import { HeaderThElement as J } from "@progress/kendo-react-data-tools";
import { sortAriaLabel as y, messages as K } from "../messages/index.mjs";
import { sortAscSmallIcon as Q, sortDescSmallIcon as U } from "@progress/kendo-svg-icons";
import { clientColumn as G, isClientReference as N, resolveCells as X } from "../utils/index.mjs";
import { GridHeaderCellContainer as P } from "./client/GridHeaderCellContainer.mjs";
import { HeaderRowDraggable as Y } from "./client/HeaderRowDraggable.mjs";
import { GridHeaderRowContainer as Z } from "./client/GridHeaderRowContainer.mjs";
import { GridHeaderCellElementContainer as _ } from "./client/GridHeaderCellElementContainer.mjs";
import { HeaderCellResizer as $ } from "./client/HeaderCellResizer.mjs";
const p = {
  none: "none",
  asc: "ascending",
  desc: "descending"
}, de = (e) => {
  const R = e.columnsState || [], s = e.unstyled, c = s && s.uGrid ? s.uGrid : j;
  let w = 0, x = -1;
  const A = (a) => {
    if (!e.sort)
      return null;
    const n = o(c.sortIcon({}));
    return a >= 0 && [
      /* @__PURE__ */ t.createElement("span", { key: 1, className: n }, /* @__PURE__ */ t.createElement(
        q,
        {
          name: "sort-" + e.sort[a].dir + "-small",
          icon: e.sort[a].dir === "asc" ? Q : U
        }
      )),
      e.sort.length > 1 && /* @__PURE__ */ t.createElement("span", { key: 2, className: n }, /* @__PURE__ */ t.createElement("span", { className: o(c.sortOrder({})) }, a + 1))
    ];
  }, D = (a) => a.map((n) => {
    var H, M, v;
    const l = e.columns[n], i = R[n], m = (M = (H = l.locked) != null ? H : i == null ? void 0 : i.locked) != null ? M : !1, g = e.sortable && l.sortable, d = e.sort ? e.sort.findIndex((r) => r.field === l.field) : -1, W = d >= 0 && e.sort[d].dir || "none", h = l.columnMenu === null ? null : l.columnMenu || e.columnMenu, O = l.menuIcon || e.columnMenuIcon, T = o(
      o(
        c.headerTh({
          first: l.kFirst,
          filterable: !!h,
          locked: m,
          sorted: e.sort && e.sort.some((r) => r.field === l.field)
        })
      ),
      l.headerClassName
    );
    m === !1 && (l.left = 0);
    const V = e.localization.toLanguageString(y, K[y]), z = l.isAccessible ? {
      ariaSort: p[W],
      role: "columnheader",
      ariaColumnIndex: l.ariaColumnIndex,
      ariaSelected: !1,
      ariaDescription: g ? V : ""
    } : {
      role: "presentation"
    }, E = l.declarationIndex >= 0 ? ++x : --w, u = {
      field: l.field,
      title: l.title,
      selectionValue: (v = l.headerSelectionValue) != null ? v : e.headerSelectionValue,
      children: A(d),
      selectionChange: null,
      columnMenuWrapperProps: {
        column: {
          field: l.field,
          title: l.title,
          locked: m,
          filter: l.filter,
          id: l.id
        },
        sortable: g && e.sortable,
        sort: e.sort,
        filter: e.filter,
        filterable: e.filterable && l.filterable,
        filterOperators: e.filterOperators,
        navigatable: e.navigatable,
        group: e.group,
        groupable: e.groupable,
        columnMenu: h,
        columnMenuIcon: O
      }
    }, f = {
      ...z,
      colSpan: l.headerColSpan,
      rowSpan: l.rowSpan,
      className: T,
      columnId: l.id,
      navigatable: l.navigatable,
      role: "columnheader"
    }, C = G(l), S = {
      column: C,
      sortable: e.sortable,
      sort: e.sort,
      columnMenuWrapperProps: u.columnMenuWrapperProps
    }, k = l.defaultHeaderCell ? l.defaultHeaderCell : F, I = [
      /* @__PURE__ */ t.createElement(P, { key: 1, ...S, isClient: N(k) }, /* @__PURE__ */ t.createElement(k, { ...u })),
      /* @__PURE__ */ t.createElement($, { key: 2, column: C })
    ], b = X(e.cells, l.cells);
    if (b && b.headerCell) {
      const r = b.headerCell, B = N(r);
      return /* @__PURE__ */ t.createElement(
        P,
        {
          key: E,
          ...S,
          thProps: f,
          isCustom: !0,
          isClient: B
        },
        /* @__PURE__ */ t.createElement(r, { ...u, thProps: f, index: n }, I)
      );
    }
    return /* @__PURE__ */ t.createElement(_, { key: E, column: C }, /* @__PURE__ */ t.createElement(J, { ...f }, I));
  }), L = e.columns.map(G);
  return /* @__PURE__ */ t.createElement(
    Z,
    {
      sortable: e.sortable,
      sort: e.sort,
      navigatable: e.navigatable,
      groupable: e.groupable,
      columns: L
    },
    e.columnsMap.map((a, n) => /* @__PURE__ */ t.createElement(Y, { key: n, className: o(c.simpleTr({})), ariaRowIndex: n + 1 }, D(a)))
  );
};
export {
  de as HeaderRow
};