@hitachivantara/uikit-react-core
Version:
UI Kit Core React components.
51 lines (50 loc) • 1.99 kB
JavaScript
import { useForkRef } from "../../hooks/useForkRef.js";
import { HvFocus } from "../../Focus/Focus.js";
import TableContext from "../TableContext.js";
import { TableSectionContext } from "../TableSectionContext.js";
import { useClasses } from "./TableBody.styles.js";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { Children, forwardRef, isValidElement, useContext, useRef } from "react";
import { jsx } from "react/jsx-runtime";
//#region src/Table/TableBody/TableBody.tsx
var tableSectionContext = {
type: "body",
filterClassName: "_trgrid"
};
var defaultComponent = "tbody";
/**
* HvTableBody acts as a `tbody` element.
* `HvTableCell` and `HvTableRow` elements in it inherit body-specific styles
*/
var HvTableBody = forwardRef(function HvTableBody(props, externalRef) {
const { classes: classesProp, className, component, children, withNavigation = false, ...others } = useDefaultProps("HvTableBody", props);
const { classes, cx } = useClasses(classesProp);
const tableContext = useContext(TableContext);
const bodyRef = useRef(null);
const handleRef = useForkRef(externalRef, bodyRef);
const Component = component || tableContext?.components?.TBody || defaultComponent;
return /* @__PURE__ */ jsx(TableSectionContext.Provider, {
value: tableSectionContext,
children: /* @__PURE__ */ jsx(Component, {
className: cx(classes.root, className),
ref: handleRef,
role: Component === defaultComponent ? null : "rowgroup",
...others,
children: withNavigation ? Children.map(children, (element) => {
if (!isValidElement(element)) return void 0;
return /* @__PURE__ */ jsx(HvFocus, {
id: `my-id-${element.key}`,
rootRef: bodyRef,
strategy: "grid",
filterClass: tableSectionContext.filterClassName,
navigationJump: 1,
focusDisabled: false,
selected: element.props.selected,
children: element
}, `row-${element.key}`);
}) : children
})
});
});
//#endregion
export { HvTableBody };