@hitachivantara/uikit-react-core/dist/cjs/Table/TableHeader/TableHeader.cjs

Core React components for the NEXT Design System.

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const icons = require("../../icons.cjs");
const helpers = require("../../utils/helpers.cjs");
const TableContext = require("../TableContext.cjs");
const TableSectionContext = require("../TableSectionContext.cjs");
const TableHeader_styles = require("./TableHeader.styles.cjs");
const utils = require("./utils.cjs");
const Button = require("../../Button/Button.cjs");
const Typography = require("../../Typography/Typography.cjs");
const defaultComponent = "th";
const HvTableHeader = React.forwardRef(
  function HvTableHeader2(props, ref) {
    const {
      children,
      component,
      className,
      style: styleProp,
      classes: classesProp,
      scope: scopeProp,
      align = "inherit",
      variant = "default",
      type: typeProp,
      stickyColumn = false,
      stickyColumnMostLeft = false,
      stickyColumnLeastRight = false,
      groupColumnMostLeft = false,
      groupColumnMostRight = false,
      sortDirection = "none",
      sorted,
      sortable,
      headerTextProps,
      resizerProps = {},
      resizable = false,
      resizing = false,
      sortButtonProps,
      ...others
    } = uikitReactUtils.useDefaultProps("HvTableHeader", props);
    const { classes, cx } = TableHeader_styles.useClasses(classesProp);
    const tableContext = React.useContext(TableContext.default);
    const tableSectionContext = React.useContext(TableSectionContext.TableSectionContext);
    const type = typeProp || tableSectionContext?.type || "body";
    const isHeadCell = type === "head";
    const scope = scopeProp ?? (isHeadCell ? "col" : "row");
    const Component = component || tableContext?.components?.Th || defaultComponent;
    const role = Component === defaultComponent ? null : isHeadCell ? "columnheader" : "rowheader";
    const paragraph = utils.isParagraph(children);
    const style = stickyColumn ? { ...styleProp, position: "sticky" } : styleProp;
    return /* @__PURE__ */ jsxRuntime.jsxs(
      Component,
      {
        ref,
        role,
        scope,
        style,
        className: cx(
          classes.root,
          classes[type],
          align !== "inherit" && classes[`align${helpers.capitalize(align)}`],
          variant !== "default" && classes[`variant${helpers.capitalize(variant)}`],
          {
            [classes.groupColumnMostLeft]: groupColumnMostLeft,
            [classes.groupColumnMostRight]: groupColumnMostRight,
            [classes.sortable]: sortable,
            [classes.sorted]: sorted,
            [classes.resizable]: resizable,
            [classes.resizing]: resizing,
            [classes.stickyColumn]: stickyColumn,
            [classes.stickyColumnMostLeft]: stickyColumnMostLeft,
            [classes.stickyColumnLeastRight]: stickyColumnLeastRight,
            [classes.variantList]: tableContext.variant === "listrow"
          },
          className
        ),
        "aria-sort": sortable ? sortDirection : void 0,
        ...others,
        children: [
          /* @__PURE__ */ jsxRuntime.jsxs(
            "div",
            {
              className: cx(
                classes.headerContent,
                align !== "inherit" && classes[`alignFlex${helpers.capitalize(align)}`]
              ),
              children: [
                isHeadCell && sortable && /* @__PURE__ */ jsxRuntime.jsx(
                  Button.HvButton,
                  {
                    className: classes.sortButton,
                    icon: true,
                    "aria-label": "Sort",
                    ...sortButtonProps,
                    children: /* @__PURE__ */ jsxRuntime.jsx(
                      icons.HvIcon,
                      {
                        name: utils.getSortIconName(sorted && sortDirection),
                        className: classes.sortIcon
                      }
                    )
                  }
                ),
                /* @__PURE__ */ jsxRuntime.jsx(
                  Typography.HvTypography,
                  {
                    component: "div",
                    className: cx({
                      [classes.headerText]: !paragraph,
                      [classes.headerParagraph]: paragraph,
                      [classes.sortableHeaderText]: sortable
                    }),
                    variant: "label",
                    ...headerTextProps,
                    children
                  }
                )
              ]
            }
          ),
          resizable && /* @__PURE__ */ jsxRuntime.jsx("div", { ...resizerProps, className: classes.resizer })
        ]
      }
    );
  }
);
exports.tableHeaderClasses = TableHeader_styles.staticClasses;
exports.HvTableHeader = HvTableHeader;