@hitachivantara/uikit-react-core
Version:
UI Kit Core React components.
42 lines (41 loc) • 2.16 kB
JavaScript
import { capitalize } from "../../utils/helpers.js";
import TableContext from "../TableContext.js";
import { TableSectionContext } from "../TableSectionContext.js";
import { useClasses } from "./TableCell.styles.js";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { forwardRef, useContext } from "react";
import { jsx } from "react/jsx-runtime";
//#region src/Table/TableCell/TableCell.tsx
var defaultComponent = "td";
/**
* `HvTableCell` acts as a `td` element and inherits styles from its context
*/
var HvTableCell = forwardRef(function HvTableCell(props, ref) {
const { children, component, className, style, classes: classesProp, align = "inherit", variant = "default", type: typeProp, stickyColumn = false, stickyColumnMostLeft = false, stickyColumnLeastRight = false, groupColumnMostLeft = false, groupColumnMostRight = false, sorted = false, resizable = false, resizing = false, ...others } = useDefaultProps("HvTableCell", props);
const { classes, cx } = useClasses(classesProp);
const tableContext = useContext(TableContext);
const tableSectionContext = useContext(TableSectionContext);
const type = typeProp || tableSectionContext?.type || "body";
const Component = component || tableContext?.components?.Td || defaultComponent;
return /* @__PURE__ */ jsx(Component, {
ref,
role: Component === defaultComponent ? null : "cell",
style,
className: cx(classes.root, classes[type], align !== "inherit" && classes[`align${capitalize(align)}`], variant !== "default" && classes[`variant${capitalize(variant)}`], {
[classes.variantList]: tableContext.variant === "listrow",
[classes.variantListHead]: tableContext.variant === "listrow" && type !== "body",
[classes.sorted]: sorted,
[classes.stickyColumn]: stickyColumn,
[classes.stickyColumnMostLeft]: stickyColumnMostLeft,
[classes.stickyColumnLeastRight]: stickyColumnLeastRight,
[classes.groupColumnMostLeft]: groupColumnMostLeft,
[classes.groupColumnMostRight]: groupColumnMostRight,
[classes.resizable]: resizable,
[classes.resizing]: resizing
}, className),
...others,
children
});
});
//#endregion
export { HvTableCell };