@hitachivantara/uikit-react-core 6.8.1 → 6.9.0

package/dist/Table/TableCell/TableCell.styles.js

@@ -1,164 +1,127 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvTableCell", {
-  /** Styles applied to the component root class. */
-  root: {
-    verticalAlign: "inherit",
-    alignContent: "inherit",
-    textAlign: "left",
-    borderColor: theme.colors.border,
-    padding: theme.spacing(0, "sm"),
-    borderBottomWidth: 1
-  },
-  /** Styles applied to the cell when it's in the table head. */
-  head: {
-    height: 52,
-    verticalAlign: "top",
-    alignContent: "start",
-    backgroundColor: theme.colors.bgContainer,
-    borderTop: "1px solid transparent",
-    ...theme.typography.label
-  },
-  /** Styles applied to the cell when it's in the table body. */
-  body: {
-    minHeight: 32,
-    "td&": {
-      height: 32
-    },
-    backgroundColor: "inherit",
-    "&$sorted": {
-      backgroundColor: theme.alpha("primary", 0.1)
-    }
-  },
-  /** Styles applied to the cell when it's in the table footer. */
-  footer: {},
-  /** Styles applied to the cell when it's part of a sorted column. */
-  sorted: {},
-  /** Styles applied to the component root when it is left aligned */
-  alignLeft: {
-    textAlign: "left"
-  },
-  /** Styles applied to the component root when it is center aligned */
-  alignCenter: {
-    textAlign: "center"
-  },
-  /** Styles applied to the component root when it is right aligned */
-  alignRight: {
-    textAlign: "right",
-    flexDirection: "row-reverse"
-  },
-  /** Styles applied to the component root when it is justified */
-  alignJustify: {
-    textAlign: "justify"
-  },
-  /** Styles applied to the component root when its variant is none */
-  variantNone: {
-    padding: 0
-  },
-  /** Styles applied to the component root when its variant is checkbox */
-  variantCheckbox: {
-    boxSizing: "content-box",
-    padding: 0,
-    width: 32,
-    maxWidth: 32,
-    borderRightWidth: 1
-  },
-  /** Styles applied to the component root when its variant is actions */
-  variantActions: {
-    boxSizing: "content-box",
-    padding: 0,
-    width: 32,
-    maxWidth: 32,
-    borderLeftWidth: 1
-  },
-  /** Styles applied to the component root when its variant is expand */
-  variantExpand: {
-    paddingLeft: 0,
-    paddingTop: 0,
-    paddingBottom: 0
-  },
-  /** Styles applied to the component root when its variant is list */
-  variantList: {
-    minHeight: 52,
-    "td&": {
-      height: 52
-    },
-    padding: "0, 0, 0, 32px",
-    borderWidth: 0
-  },
-  /** Styles applied to the cell when its variant is list and the type is head. */
-  variantListHead: {
-    backgroundColor: "inherit",
-    "td&": {
-      height: 16
-    }
-  },
-  /** Styles applied to the cell when its variant is list and actions. */
-  variantListactions: {
-    verticalAlign: "middle",
-    alignContent: "center",
-    borderLeft: "none",
-    paddingLeft: "0",
-    textAlign: "center",
-    width: 130,
-    maxWidth: 130
-  },
-  /** Styles applied to the cell when its variant is list and checkbox. */
-  variantListcheckbox: {
-    borderRight: "none",
-    padding: 0,
-    textAlign: "center",
-    width: 34,
-    maxWidth: 34
-  },
-  /** Styles applied to the cell when it's part of a sticky column. */
-  stickyColumn: {
-    position: "sticky",
-    zIndex: 2,
-    backgroundColor: theme.colors.bgPage,
-    "&$groupColumnMostRight+$stickyColumn": {
-      borderLeft: 0
-    }
-  },
-  /** Styles applied to the cell when it's part of the last sticky to the left column. */
-  stickyColumnMostLeft: {
-    borderRightWidth: 1
-  },
-  /** Styles applied to the cell when it's part of the first right sticky column. */
-  stickyColumnLeastRight: {
-    borderLeftWidth: 1
-  },
-  /** Styles applied to the cell when it's part of the first column in the group. */
-  groupColumnMostLeft: {
-    borderLeftWidth: 1,
-    "&:first-of-type": {
-      borderLeftWidth: 0
-    }
-  },
-  /** Styles applied to the cell when it's part of the last column in the group. */
-  groupColumnMostRight: {
-    borderRightWidth: 1,
-    // due to the ":has()" selector not being supported in browsers,
-    // this need to be managed with inline styles
-    // To be uncommented when not needed (see comment in src/Table/hooks/useSticky.js)
-    // "&:last-child,&:has(+ $stickyColumnLeastRight)": {
-    "&:last-child": {
-      borderRightWidth: 0
-    },
-    "&+:not($stickyColumn)": {
-      borderLeftWidth: 0
-    }
-  },
-  /** Styles applied to the cell when it's part of a resizable column. */
-  resizable: {
-    borderRightWidth: 1
-  },
-  /** Styles applied to the cell when it's part of a resizing column. */
-  resizing: {
-    borderRight: `2px solid ${theme.colors.primaryStrong}`
-  }
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/Table/TableCell/TableCell.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvTableCell", {
+	/** Styles applied to the component root class. */
+	root: {
+		verticalAlign: "inherit",
+		alignContent: "inherit",
+		textAlign: "left",
+		borderColor: theme.colors.border,
+		padding: theme.spacing(0, "sm"),
+		borderBottomWidth: 1
+	},
+	/** Styles applied to the cell when it's in the table head. */
+	head: {
+		height: 52,
+		verticalAlign: "top",
+		alignContent: "start",
+		backgroundColor: theme.colors.bgContainer,
+		borderTop: "1px solid transparent",
+		...theme.typography.label
+	},
+	/** Styles applied to the cell when it's in the table body. */
+	body: {
+		minHeight: 32,
+		"td&": { height: 32 },
+		backgroundColor: "inherit",
+		"&$sorted": { backgroundColor: theme.alpha("primary", .1) }
+	},
+	/** Styles applied to the cell when it's in the table footer. */
+	footer: {},
+	/** Styles applied to the cell when it's part of a sorted column. */
+	sorted: {},
+	/** Styles applied to the component root when it is left aligned */
+	alignLeft: { textAlign: "left" },
+	/** Styles applied to the component root when it is center aligned */
+	alignCenter: { textAlign: "center" },
+	/** Styles applied to the component root when it is right aligned */
+	alignRight: {
+		textAlign: "right",
+		flexDirection: "row-reverse"
+	},
+	/** Styles applied to the component root when it is justified */
+	alignJustify: { textAlign: "justify" },
+	/** Styles applied to the component root when its variant is none */
+	variantNone: { padding: 0 },
+	/** Styles applied to the component root when its variant is checkbox */
+	variantCheckbox: {
+		boxSizing: "content-box",
+		padding: 0,
+		width: 32,
+		maxWidth: 32,
+		borderRightWidth: 1
+	},
+	/** Styles applied to the component root when its variant is actions */
+	variantActions: {
+		boxSizing: "content-box",
+		padding: 0,
+		width: 32,
+		maxWidth: 32,
+		borderLeftWidth: 1
+	},
+	/** Styles applied to the component root when its variant is expand */
+	variantExpand: {
+		paddingLeft: 0,
+		paddingTop: 0,
+		paddingBottom: 0
+	},
+	/** Styles applied to the component root when its variant is list */
+	variantList: {
+		minHeight: 52,
+		"td&": { height: 52 },
+		padding: "0, 0, 0, 32px",
+		borderWidth: 0
+	},
+	/** Styles applied to the cell when its variant is list and the type is head. */
+	variantListHead: {
+		backgroundColor: "inherit",
+		"td&": { height: 16 }
+	},
+	/** Styles applied to the cell when its variant is list and actions. */
+	variantListactions: {
+		verticalAlign: "middle",
+		alignContent: "center",
+		borderLeft: "none",
+		paddingLeft: "0",
+		textAlign: "center",
+		width: 130,
+		maxWidth: 130
+	},
+	/** Styles applied to the cell when its variant is list and checkbox. */
+	variantListcheckbox: {
+		borderRight: "none",
+		padding: 0,
+		textAlign: "center",
+		width: 34,
+		maxWidth: 34
+	},
+	/** Styles applied to the cell when it's part of a sticky column. */
+	stickyColumn: {
+		position: "sticky",
+		zIndex: 2,
+		backgroundColor: theme.colors.bgPage,
+		"&$groupColumnMostRight+$stickyColumn": { borderLeft: 0 }
+	},
+	/** Styles applied to the cell when it's part of the last sticky to the left column. */
+	stickyColumnMostLeft: { borderRightWidth: 1 },
+	/** Styles applied to the cell when it's part of the first right sticky column. */
+	stickyColumnLeastRight: { borderLeftWidth: 1 },
+	/** Styles applied to the cell when it's part of the first column in the group. */
+	groupColumnMostLeft: {
+		borderLeftWidth: 1,
+		"&:first-of-type": { borderLeftWidth: 0 }
+	},
+	/** Styles applied to the cell when it's part of the last column in the group. */
+	groupColumnMostRight: {
+		borderRightWidth: 1,
+		"&:last-child": { borderRightWidth: 0 },
+		"&+:not($stickyColumn)": { borderLeftWidth: 0 }
+	},
+	/** Styles applied to the cell when it's part of a resizable column. */
+	resizable: { borderRightWidth: 1 },
+	/** Styles applied to the cell when it's part of a resizing column. */
+	resizing: { borderRight: `2px solid ${theme.colors.primaryStrong}` }
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Table/TableContainer/TableContainer.js

@@ -1,29 +1,19 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./TableContainer.styles.js";
-import { staticClasses } from "./TableContainer.styles.js";
-const HvTableContainer = forwardRef(
-  function HvTableContainer2(props, ref) {
-    const {
-      classes: classesProp,
-      className,
-      component,
-      ...others
-    } = useDefaultProps("HvTableContainer", props);
-    const { classes, cx } = useClasses(classesProp);
-    const Component = component || "div";
-    return /* @__PURE__ */ jsx(
-      Component,
-      {
-        ref,
-        className: cx(classes.root, className),
-        ...others
-      }
-    );
-  }
-);
-export {
-  HvTableContainer,
-  staticClasses as tableContainerClasses
-};
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Table/TableContainer/TableContainer.tsx
+/**
+* HvTableContainer is a container for the HvTable
+*/
+var HvTableContainer = forwardRef(function HvTableContainer(props, ref) {
+	const { classes: classesProp, className, component, ...others } = useDefaultProps("HvTableContainer", props);
+	const { classes, cx } = useClasses(classesProp);
+	return /* @__PURE__ */ jsx(component || "div", {
+		ref,
+		className: cx(classes.root, className),
+		...others
+	});
+});
+//#endregion
+export { HvTableContainer };

package/dist/Table/TableContainer/TableContainer.styles.js

@@ -1,13 +1,9 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
-const { staticClasses, useClasses } = createClasses("HvTableContainer", {
-  root: {
-    width: "100%",
-    overflow: "auto",
-    // extra padding to avoid cutting focus rings in the last line
-    paddingBottom: 3
-  }
-});
-export {
-  staticClasses,
-  useClasses
-};
+//#region src/Table/TableContainer/TableContainer.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvTableContainer", { root: {
+	width: "100%",
+	overflow: "auto",
+	paddingBottom: 3
+} });
+//#endregion
+export { staticClasses, useClasses };

package/dist/Table/TableContext.js

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-const TableContext = createContext({});
-export {
-  TableContext as default
-};
+//#region src/Table/TableContext.ts
+var TableContext = createContext({});
+//#endregion
+export { TableContext as default };

package/dist/Table/TableHead/TableHead.js

@@ -1,42 +1,30 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef, useContext } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import TableContext from "../TableContext.js";
 import { TableSectionContext } from "../TableSectionContext.js";
 import { useClasses } from "./TableHead.styles.js";
-import { staticClasses } from "./TableHead.styles.js";
-const tableSectionContext = {
-  type: "head"
-};
-const defaultComponent = "thead";
-const HvTableHead = forwardRef(
-  function HvTableHead2(props, ref) {
-    const {
-      classes: classesProp,
-      className,
-      component,
-      stickyHeader,
-      ...others
-    } = useDefaultProps("HvTableHead", props);
-    const { classes, cx } = useClasses(classesProp);
-    const tableContext = useContext(TableContext);
-    const Component = component || tableContext?.components?.THead || defaultComponent;
-    return /* @__PURE__ */ jsx(TableSectionContext.Provider, { value: tableSectionContext, children: /* @__PURE__ */ jsx(
-      Component,
-      {
-        className: cx(
-          classes.root,
-          { [classes.stickyHeader]: stickyHeader },
-          className
-        ),
-        ref,
-        role: Component === defaultComponent ? null : "rowgroup",
-        ...others
-      }
-    ) });
-  }
-);
-export {
-  HvTableHead,
-  staticClasses as tableHeadClasses
-};
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Table/TableHead/TableHead.tsx
+var tableSectionContext = { type: "head" };
+var defaultComponent = "thead";
+/**
+* HvTableHead acts as a `thead` element.
+* `HvTableCell` and `HvTableRow` elements in it inherit header-specific styles
+*/
+var HvTableHead = forwardRef(function HvTableHead(props, ref) {
+	const { classes: classesProp, className, component, stickyHeader, ...others } = useDefaultProps("HvTableHead", props);
+	const { classes, cx } = useClasses(classesProp);
+	const tableContext = useContext(TableContext);
+	const Component = component || tableContext?.components?.THead || defaultComponent;
+	return /* @__PURE__ */ jsx(TableSectionContext.Provider, {
+		value: tableSectionContext,
+		children: /* @__PURE__ */ jsx(Component, {
+			className: cx(classes.root, { [classes.stickyHeader]: stickyHeader }, className),
+			ref,
+			role: Component === defaultComponent ? null : "rowgroup",
+			...others
+		})
+	});
+});
+//#endregion
+export { HvTableHead };

package/dist/Table/TableHead/TableHead.styles.js

@@ -1,9 +1,12 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
-const { staticClasses, useClasses } = createClasses("HvTableHead", {
-  root: {},
-  stickyHeader: { position: "sticky", zIndex: 3, top: 0 }
+//#region src/Table/TableHead/TableHead.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvTableHead", {
+	root: {},
+	stickyHeader: {
+		position: "sticky",
+		zIndex: 3,
+		top: 0
+	}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };