@hitachivantara/uikit-react-core 5.39.0 → 5.39.2

package/dist/cjs/components/Table/TableHeader/TableHeader.cjs

@@ -16,78 +16,123 @@ const Typography = require("../../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const capitalize__default = /* @__PURE__ */ _interopDefault(capitalize);
 const defaultComponent = "th";
-const HvTableHeader = React.forwardRef((props, externalRef) => {
-  const {
-    children,
-    component,
-    className,
-    style,
-    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
-  } = useDefaultProps.useDefaultProps("HvTableHeader", props);
-  const {
-    classes,
-    cx,
-    css
-  } = TableHeader_styles.useClasses(classesProp);
-  const {
-    colors
-  } = useTheme.useTheme();
-  const tableContext = React.useContext(TableContext.default);
-  const tableSectionContext = React.useContext(TableSectionContext.default);
-  const type = typeProp || tableSectionContext?.type || "body";
-  const isHeadCell = type === "head";
-  const scope = scopeProp ?? (isHeadCell ? "col" : "row");
-  const Sort = React.useMemo(() => utils.getSortIcon(sorted && sortDirection), [sorted, sortDirection]);
-  const Component = component || tableContext?.components?.Th || defaultComponent;
-  const role = Component === defaultComponent ? null : isHeadCell ? "columnheader" : "rowheader";
-  const paragraph = utils.isParagraph(children);
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref: externalRef, role, scope, style, className: cx(classes.root, classes[type], type === "body" && css({
-    [`&.${TableHeader_styles.staticClasses.sorted}`]: {
-      backgroundColor: material.alpha(material.hexToRgb(colors?.atmo1 || uikitStyles.theme.colors.atmo1), 0.4)
-    }
-  }), {
-    [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",
-    [classes[`align${capitalize__default.default(align)}`]]: align !== "inherit",
-    [classes[`variant${capitalize__default.default(variant)}`]]: variant !== "default"
-  }, className), "aria-sort": sortable ? sortDirection : void 0, ...others, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.headerContent, {
-    [classes[`alignFlex${capitalize__default.default(align)}`]]: align !== "inherit"
-  }), children: [
-    isHeadCell && sortable && /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { className: classes.sortButton, icon: true, overrideIconColors: false, "aria-label": "Sort", ...sortButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(Sort, { 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 })
-  ] }) });
-});
+const HvTableHeader = React.forwardRef(
+  (props, externalRef) => {
+    const {
+      children,
+      component,
+      className,
+      style,
+      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
+    } = useDefaultProps.useDefaultProps("HvTableHeader", props);
+    const { classes, cx, css } = TableHeader_styles.useClasses(classesProp);
+    const { colors } = useTheme.useTheme();
+    const tableContext = React.useContext(TableContext.default);
+    const tableSectionContext = React.useContext(TableSectionContext.default);
+    const type = typeProp || tableSectionContext?.type || "body";
+    const isHeadCell = type === "head";
+    const scope = scopeProp ?? (isHeadCell ? "col" : "row");
+    const Sort = React.useMemo(
+      () => utils.getSortIcon(sorted && sortDirection),
+      [sorted, sortDirection]
+    );
+    const Component = component || tableContext?.components?.Th || defaultComponent;
+    const role = Component === defaultComponent ? null : isHeadCell ? "columnheader" : "rowheader";
+    const paragraph = utils.isParagraph(children);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Component,
+      {
+        ref: externalRef,
+        role,
+        scope,
+        style,
+        className: cx(
+          classes.root,
+          classes[type],
+          type === "body" && css({
+            [`&.${TableHeader_styles.staticClasses.sorted}`]: {
+              backgroundColor: material.alpha(
+                material.hexToRgb(colors?.atmo1 || uikitStyles.theme.colors.atmo1),
+                0.4
+              )
+            }
+          }),
+          {
+            [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",
+            [classes[`align${capitalize__default.default(align)}`]]: align !== "inherit",
+            [classes[`variant${capitalize__default.default(variant)}`]]: variant !== "default"
+          },
+          className
+        ),
+        "aria-sort": sortable ? sortDirection : void 0,
+        ...others,
+        children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cx(classes.headerContent, {
+              [classes[`alignFlex${capitalize__default.default(align)}`]]: align !== "inherit"
+            }),
+            children: [
+              isHeadCell && sortable && /* @__PURE__ */ jsxRuntime.jsx(
+                Button.HvButton,
+                {
+                  className: classes.sortButton,
+                  icon: true,
+                  overrideIconColors: false,
+                  "aria-label": "Sort",
+                  ...sortButtonProps,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(Sort, { 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;
 //# sourceMappingURL=TableHeader.cjs.map

package/dist/cjs/components/Table/TableHeader/TableHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeader.cjs","sources":["../../../../../src/components/Table/TableHeader/TableHeader.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  ThHTMLAttributes,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport capitalize from \"lodash/capitalize\";\n\nimport { hexToRgb, alpha } from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { getSortIcon, isParagraph } from \"./utils\";\nimport { useClasses, staticClasses } from \"./TableHeader.styles\";\nimport {\n  HvTableCellAlign,\n  HvTableCellType,\n  HvTableCellVariant,\n} from \"../Table\";\n\nexport { staticClasses as tableHeaderClasses };\n\nexport type HvTableHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableHeaderProps\n  extends Omit<ThHTMLAttributes<HTMLTableCellElement>, \"align\"> {\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to th. */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children?: React.ReactNode;\n  /** The scope of cells that the header element relates to. */\n  scope?: \"col\" | \"row\" | \"colgroup\" | \"rowgroup\";\n  /** Set the text-align on the table cell content. */\n  align?: HvTableCellAlign;\n  /** Sets the cell's variant. */\n  variant?: HvTableCellVariant;\n  /** Specify the cell type. The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components. */\n  type?: HvTableCellType;\n  /** The cell is part of a sticky column. */\n  stickyColumn?: boolean;\n  /** The cell is part of the last sticky to the left column. */\n  stickyColumnMostLeft?: boolean;\n  /** The cell is part of the first sticky to the right column. */\n  stickyColumnLeastRight?: boolean;\n  /** The cell is part of the first column in the group. */\n  groupColumnMostLeft?: boolean;\n  /** The cell is part of the last column in the group. */\n  groupColumnMostRight?: boolean;\n  /** Whether or not the cell is sorted */\n  sorted?: boolean;\n  /** Whether or not the cell is sortable */\n  sortable?: boolean;\n  /** Set sort direction icon and aria-sort. */\n  sortDirection?: \"ascending\" | \"descending\" | false;\n  /** Extra props to be passed onto the text in the header. */\n  headerTextProps?: HvTypographyProps;\n  /** Whether or not the cell is resizable */\n  resizable?: boolean;\n  /** Whether or not the cell is being resized */\n  resizing?: boolean;\n  /** The resize props injected in the resize handler */\n  resizerProps?: HTMLAttributes<HTMLDivElement>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableHeaderClasses;\n  /** Extra props to be passed onto the sort button in the header. */\n  sortButtonProps?: HvButtonProps;\n}\n\nconst defaultComponent = \"th\";\n\n/**\n * `HvTableHeader` acts as a `th` element and inherits styles from its context\n */\nexport const HvTableHeader = forwardRef<HTMLElement, HvTableHeaderProps>(\n  (props, externalRef) => {\n    const {\n      children,\n      component,\n      className,\n      style,\n      classes: classesProp,\n      scope: scopeProp,\n      align = \"inherit\",\n      variant = \"default\",\n      type: typeProp,\n      stickyColumn = false,\n      stickyColumnMostLeft = false,\n      stickyColumnLeastRight = false,\n      groupColumnMostLeft = false,\n      groupColumnMostRight = false,\n      sortDirection = \"none\",\n      sorted,\n      sortable,\n      headerTextProps,\n      resizerProps = {},\n      resizable = false,\n      resizing = false,\n      sortButtonProps,\n      ...others\n    } = useDefaultProps(\"HvTableHeader\", props);\n    const { classes, cx, css } = useClasses(classesProp);\n\n    const { colors } = useTheme();\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const type = typeProp || tableSectionContext?.type || \"body\";\n    const isHeadCell = type === \"head\";\n\n    const scope = scopeProp ?? (isHeadCell ? \"col\" : \"row\");\n\n    const Sort = useMemo(\n      () => getSortIcon(sorted && sortDirection),\n      [sorted, sortDirection]\n    );\n\n    const Component =\n      component || tableContext?.components?.Th || defaultComponent;\n\n    const role =\n      Component === defaultComponent\n        ? null\n        : isHeadCell\n        ? \"columnheader\"\n        : \"rowheader\";\n    const paragraph = isParagraph(children);\n\n    return (\n      <Component\n        ref={externalRef}\n        role={role}\n        scope={scope}\n        style={style}\n        className={cx(\n          classes.root,\n          classes[type],\n          type === \"body\" &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundColor: alpha(\n                  hexToRgb(colors?.atmo1 || theme.colors.atmo1),\n                  0.4\n                ),\n              },\n            }),\n          {\n            [classes.groupColumnMostLeft]: groupColumnMostLeft,\n            [classes.groupColumnMostRight]: groupColumnMostRight,\n            [classes.sortable]: sortable,\n            [classes.sorted]: sorted,\n            [classes.resizable]: resizable,\n            [classes.resizing]: resizing,\n            [classes.stickyColumn]: stickyColumn,\n            [classes.stickyColumnMostLeft]: stickyColumnMostLeft,\n            [classes.stickyColumnLeastRight]: stickyColumnLeastRight,\n            [classes.variantList]: tableContext.variant === \"listrow\",\n            [classes[`align${capitalize(align)}`]]: align !== \"inherit\",\n            [classes[`variant${capitalize(variant)}`]]: variant !== \"default\",\n          },\n          className\n        )}\n        aria-sort={sortable ? sortDirection : undefined}\n        {...others}\n      >\n        <div\n          className={cx(classes.headerContent, {\n            [classes[`alignFlex${capitalize(align)}`]]: align !== \"inherit\",\n          })}\n        >\n          {isHeadCell && sortable && (\n            <HvButton\n              className={classes.sortButton}\n              icon\n              overrideIconColors={false}\n              aria-label=\"Sort\"\n              {...sortButtonProps}\n            >\n              <Sort className={classes.sortIcon} />\n            </HvButton>\n          )}\n          <HvTypography\n            component=\"div\"\n            className={cx({\n              [classes.headerText]: !paragraph,\n              [classes.headerParagraph]: paragraph,\n              [classes.sortableHeaderText]: sortable,\n            })}\n            variant=\"label\"\n            {...headerTextProps}\n          >\n            {children}\n          </HvTypography>\n          {resizable && <div {...resizerProps} className={classes.resizer} />}\n        </div>\n      </Component>\n    );\n  }\n);\n"],"names":["defaultComponent","HvTableHeader","forwardRef","props","externalRef","children","component","className","style","classes","classesProp","scope","scopeProp","align","variant","type","typeProp","stickyColumn","stickyColumnMostLeft","stickyColumnLeastRight","groupColumnMostLeft","groupColumnMostRight","sortDirection","sorted","sortable","headerTextProps","resizerProps","resizable","resizing","sortButtonProps","others","useDefaultProps","cx","css","useClasses","colors","useTheme","tableContext","useContext","TableContext","tableSectionContext","TableSectionContext","isHeadCell","Sort","useMemo","getSortIcon","Component","components","Th","role","paragraph","isParagraph","root","staticClasses","backgroundColor","alpha","hexToRgb","atmo1","theme","variantList","capitalize","undefined","jsxs","headerContent","jsx","HvButton","sortButton","sortIcon","HvTypography","headerText","headerParagraph","sortableHeaderText","resizer"],"mappings":"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"}
+{"version":3,"file":"TableHeader.cjs","sources":["../../../../../src/components/Table/TableHeader/TableHeader.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  ThHTMLAttributes,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport capitalize from \"lodash/capitalize\";\n\nimport { hexToRgb, alpha } from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { getSortIcon, isParagraph } from \"./utils\";\nimport { useClasses, staticClasses } from \"./TableHeader.styles\";\nimport {\n  HvTableCellAlign,\n  HvTableCellType,\n  HvTableCellVariant,\n} from \"../Table\";\n\nexport { staticClasses as tableHeaderClasses };\n\nexport type HvTableHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableHeaderProps\n  extends Omit<ThHTMLAttributes<HTMLTableCellElement>, \"align\"> {\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to th. */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children?: React.ReactNode;\n  /** The scope of cells that the header element relates to. */\n  scope?: \"col\" | \"row\" | \"colgroup\" | \"rowgroup\";\n  /** Set the text-align on the table cell content. */\n  align?: HvTableCellAlign;\n  /** Sets the cell's variant. */\n  variant?: HvTableCellVariant;\n  /** Specify the cell type. The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components. */\n  type?: HvTableCellType;\n  /** The cell is part of a sticky column. */\n  stickyColumn?: boolean;\n  /** The cell is part of the last sticky to the left column. */\n  stickyColumnMostLeft?: boolean;\n  /** The cell is part of the first sticky to the right column. */\n  stickyColumnLeastRight?: boolean;\n  /** The cell is part of the first column in the group. */\n  groupColumnMostLeft?: boolean;\n  /** The cell is part of the last column in the group. */\n  groupColumnMostRight?: boolean;\n  /** Whether or not the cell is sorted */\n  sorted?: boolean;\n  /** Whether or not the cell is sortable */\n  sortable?: boolean;\n  /** Set sort direction icon and aria-sort. */\n  sortDirection?: \"ascending\" | \"descending\" | false;\n  /** Extra props to be passed onto the text in the header. */\n  headerTextProps?: HvTypographyProps;\n  /** Whether or not the cell is resizable */\n  resizable?: boolean;\n  /** Whether or not the cell is being resized */\n  resizing?: boolean;\n  /** The resize props injected in the resize handler */\n  resizerProps?: HTMLAttributes<HTMLDivElement>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableHeaderClasses;\n  /** Extra props to be passed onto the sort button in the header. */\n  sortButtonProps?: HvButtonProps;\n}\n\nconst defaultComponent = \"th\";\n\n/**\n * `HvTableHeader` acts as a `th` element and inherits styles from its context\n */\nexport const HvTableHeader = forwardRef<HTMLElement, HvTableHeaderProps>(\n  (props, externalRef) => {\n    const {\n      children,\n      component,\n      className,\n      style,\n      classes: classesProp,\n      scope: scopeProp,\n      align = \"inherit\",\n      variant = \"default\",\n      type: typeProp,\n      stickyColumn = false,\n      stickyColumnMostLeft = false,\n      stickyColumnLeastRight = false,\n      groupColumnMostLeft = false,\n      groupColumnMostRight = false,\n      sortDirection = \"none\",\n      sorted,\n      sortable,\n      headerTextProps,\n      resizerProps = {},\n      resizable = false,\n      resizing = false,\n      sortButtonProps,\n      ...others\n    } = useDefaultProps(\"HvTableHeader\", props);\n    const { classes, cx, css } = useClasses(classesProp);\n\n    const { colors } = useTheme();\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const type = typeProp || tableSectionContext?.type || \"body\";\n    const isHeadCell = type === \"head\";\n\n    const scope = scopeProp ?? (isHeadCell ? \"col\" : \"row\");\n\n    const Sort = useMemo(\n      () => getSortIcon(sorted && sortDirection),\n      [sorted, sortDirection]\n    );\n\n    const Component =\n      component || tableContext?.components?.Th || defaultComponent;\n\n    const role =\n      Component === defaultComponent\n        ? null\n        : isHeadCell\n        ? \"columnheader\"\n        : \"rowheader\";\n    const paragraph = isParagraph(children);\n\n    return (\n      <Component\n        ref={externalRef}\n        role={role}\n        scope={scope}\n        style={style}\n        className={cx(\n          classes.root,\n          classes[type],\n          type === \"body\" &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundColor: alpha(\n                  hexToRgb(colors?.atmo1 || theme.colors.atmo1),\n                  0.4\n                ),\n              },\n            }),\n          {\n            [classes.groupColumnMostLeft]: groupColumnMostLeft,\n            [classes.groupColumnMostRight]: groupColumnMostRight,\n            [classes.sortable]: sortable,\n            [classes.sorted]: sorted,\n            [classes.resizable]: resizable,\n            [classes.resizing]: resizing,\n            [classes.stickyColumn]: stickyColumn,\n            [classes.stickyColumnMostLeft]: stickyColumnMostLeft,\n            [classes.stickyColumnLeastRight]: stickyColumnLeastRight,\n            [classes.variantList]: tableContext.variant === \"listrow\",\n            [classes[`align${capitalize(align)}`]]: align !== \"inherit\",\n            [classes[`variant${capitalize(variant)}`]]: variant !== \"default\",\n          },\n          className\n        )}\n        aria-sort={sortable ? sortDirection : undefined}\n        {...others}\n      >\n        <div\n          className={cx(classes.headerContent, {\n            [classes[`alignFlex${capitalize(align)}`]]: align !== \"inherit\",\n          })}\n        >\n          {isHeadCell && sortable && (\n            <HvButton\n              className={classes.sortButton}\n              icon\n              overrideIconColors={false}\n              aria-label=\"Sort\"\n              {...sortButtonProps}\n            >\n              <Sort className={classes.sortIcon} />\n            </HvButton>\n          )}\n          <HvTypography\n            component=\"div\"\n            className={cx({\n              [classes.headerText]: !paragraph,\n              [classes.headerParagraph]: paragraph,\n              [classes.sortableHeaderText]: sortable,\n            })}\n            variant=\"label\"\n            {...headerTextProps}\n          >\n            {children}\n          </HvTypography>\n          {resizable && <div {...resizerProps} className={classes.resizer} />}\n        </div>\n      </Component>\n    );\n  }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useTheme","useContext","TableContext","TableSectionContext","useMemo","getSortIcon","isParagraph","jsx","staticClasses","alpha","hexToRgb","theme","capitalize","jsxs","HvButton","HvTypography"],"mappings":"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"}

package/dist/cjs/components/Table/TableHeader/TableHeader.styles.cjs

@@ -2,10 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const classes = require("../../../utils/classes.cjs");
-const {
-  staticClasses,
-  useClasses
-} = classes.createClasses("HvTableHeader", {
+const { staticClasses, useClasses } = classes.createClasses("HvTableHeader", {
   root: {
     "--first-row-cell-height": "52px",
     "--cell-height": "32px",
@@ -67,15 +64,9 @@ const {
       borderLeft: 0
     }
   },
-  stickyColumnMostLeft: {
-    borderRight: `solid 1px ${uikitStyles.theme.colors.atmo4}`
-  },
-  stickyColumnLeastRight: {
-    borderLeft: `solid 1px ${uikitStyles.theme.colors.atmo4}`
-  },
-  groupColumnMostLeft: {
-    borderLeft: `solid 1px ${uikitStyles.theme.colors.atmo4}`
-  },
+  stickyColumnMostLeft: { borderRight: `solid 1px ${uikitStyles.theme.colors.atmo4}` },
+  stickyColumnLeastRight: { borderLeft: `solid 1px ${uikitStyles.theme.colors.atmo4}` },
+  groupColumnMostLeft: { borderLeft: `solid 1px ${uikitStyles.theme.colors.atmo4}` },
   groupColumnMostRight: {
     borderRight: `solid 1px ${uikitStyles.theme.colors.atmo4}`,
     // due to the ":has()" selector not being supported in browsers,
@@ -89,22 +80,10 @@ const {
       borderLeft: 0
     }
   },
-  headerContent: {
-    display: "flex",
-    alignItems: "flex-start",
-    width: "100%"
-  },
-  headerText: {
-    overflow: "hidden",
-    textOverflow: "ellipsis"
-  },
-  headerParagraph: {
-    overflow: "hidden",
-    display: "-webkit-box"
-  },
-  sortableHeaderText: {
-    paddingTop: "8px"
-  },
+  headerContent: { display: "flex", alignItems: "flex-start", width: "100%" },
+  headerText: { overflow: "hidden", textOverflow: "ellipsis" },
+  headerParagraph: { overflow: "hidden", display: "-webkit-box" },
+  sortableHeaderText: { paddingTop: "8px" },
   sorted: {
     "& $sortIcon": {
       visibility: "visible"
@@ -120,35 +99,15 @@ const {
       }
     }
   },
-  sortIcon: {
-    display: "inline-flex",
-    visibility: "hidden"
-  },
-  alignLeft: {
-    textAlign: "left"
-  },
-  alignRight: {
-    textAlign: "right",
-    flexDirection: "row-reverse"
-  },
-  alignCenter: {
-    textAlign: "center"
-  },
-  alignJustify: {
-    textAlign: "justify"
-  },
-  alignFlexLeft: {
-    justifyContent: "flex-start"
-  },
-  alignFlexRight: {
-    justifyContent: "flex-end"
-  },
-  alignFlexCenter: {
-    justifyContent: "center"
-  },
-  alignFlexJustify: {
-    textAlign: "justify"
-  },
+  sortIcon: { display: "inline-flex", visibility: "hidden" },
+  alignLeft: { textAlign: "left" },
+  alignRight: { textAlign: "right", flexDirection: "row-reverse" },
+  alignCenter: { textAlign: "center" },
+  alignJustify: { textAlign: "justify" },
+  alignFlexLeft: { justifyContent: "flex-start" },
+  alignFlexRight: { justifyContent: "flex-end" },
+  alignFlexCenter: { justifyContent: "center" },
+  alignFlexJustify: { textAlign: "justify" },
   variantCheckbox: {
     padding: 0,
     width: 32,
@@ -162,9 +121,7 @@ const {
     maxWidth: 32,
     borderLeft: `solid 1px ${uikitStyles.theme.colors.atmo4}`
   },
-  variantNone: {
-    padding: 0
-  },
+  variantNone: { padding: 0 },
   variantList: {
     backgroundColor: "inherit",
     borderBottom: 0,
@@ -174,12 +131,8 @@ const {
       height: 16
     }
   },
-  resizable: {
-    borderRight: `solid 1px ${uikitStyles.theme.colors.atmo4}`
-  },
-  resizing: {
-    borderRight: `solid 2px ${uikitStyles.theme.colors.secondary}`
-  },
+  resizable: { borderRight: `solid 1px ${uikitStyles.theme.colors.atmo4}` },
+  resizing: { borderRight: `solid 2px ${uikitStyles.theme.colors.secondary}` },
   resizer: {
     display: "inline-block",
     width: 10,

package/dist/cjs/components/Table/TableHeader/TableHeader.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeader.styles.cjs","sources":["../../../../../src/components/Table/TableHeader/TableHeader.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTableHeader\", {\n  root: {\n    \"--first-row-cell-height\": \"52px\",\n    \"--cell-height\": \"32px\",\n    height: \"var(--cell-height)\",\n    verticalAlign: \"inherit\",\n    textAlign: \"left\",\n    padding: theme.spacing(0, 1, 0, 4),\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\n  head: {\n    paddingTop: 8,\n    verticalAlign: \"top\",\n    ...theme.typography.label,\n    transition: \"background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms\",\n    backgroundColor: theme.colors.atmo1,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n\n    \"*:first-of-type > &\": {\n      height: \"var(--first-row-cell-height)\",\n      borderTop: \"1px solid transparent\",\n    },\n\n    \"&$variantList\": {\n      backgroundColor: \"inherit\",\n      borderBottom: 0,\n      \"*:first-of-type > &\": {\n        borderTop: 0,\n      },\n    },\n\n    \"&$sortable\": {\n      verticalAlign: \"initial\",\n      paddingTop: 0,\n      paddingLeft: 0,\n      cursor: \"pointer\",\n\n      \"&:hover\": {\n        backgroundColor: \"transparent\",\n\n        \"& $sortIcon\": {\n          visibility: \"visible\",\n        },\n      },\n      \"&:focus-within\": {\n        backgroundColor: \"transparent\",\n\n        \"& $sortIcon\": {\n          visibility: \"visible\",\n        },\n      },\n    },\n  },\n  body: {\n    backgroundColor: \"inherit\",\n    ...theme.typography.body,\n    \"&$sortable:not($variantNone)\": {\n      paddingLeft: 32,\n    },\n  },\n  footer: {},\n  stickyColumn: {\n    position: \"sticky\",\n    zIndex: 2,\n\n    \"&$groupColumnMostRight+$stickyColumn\": {\n      borderLeft: 0,\n    },\n  },\n  stickyColumnMostLeft: { borderRight: `solid 1px ${theme.colors.atmo4}` },\n  stickyColumnLeastRight: { borderLeft: `solid 1px ${theme.colors.atmo4}` },\n  groupColumnMostLeft: { borderLeft: `solid 1px ${theme.colors.atmo4}` },\n  groupColumnMostRight: {\n    borderRight: `solid 1px ${theme.colors.atmo4}`,\n    // due to the \":has()\" selector not being supported in browsers,\n    // this need to be managed with inline styles\n    // To be uncommented when not needed (see comment in src/Table/hooks/useSticky.js)\n    // \"&:last-child,&:has(+ $stickyColumnLeastRight)\": {\n    \"&:last-child\": {\n      borderRight: 0,\n    },\n    \"&+:not($stickyColumn)\": {\n      borderLeft: 0,\n    },\n  },\n  headerContent: { display: \"flex\", alignItems: \"flex-start\", width: \"100%\" },\n  headerText: { overflow: \"hidden\", textOverflow: \"ellipsis\" },\n  headerParagraph: { overflow: \"hidden\", display: \"-webkit-box\" },\n  sortableHeaderText: { paddingTop: \"8px\" },\n  sorted: {\n    \"& $sortIcon\": {\n      visibility: \"visible\",\n    },\n  },\n  sortable: {},\n  sortButton: {\n    \"$root$sortable &\": {\n      boxShadow: \"none\",\n      backgroundColor: \"transparent\",\n      \"&:hover\": {\n        backgroundColor: theme.colors.primary_20,\n      },\n    },\n  },\n  sortIcon: { display: \"inline-flex\", visibility: \"hidden\" },\n  alignLeft: { textAlign: \"left\" },\n  alignRight: { textAlign: \"right\", flexDirection: \"row-reverse\" },\n  alignCenter: { textAlign: \"center\" },\n  alignJustify: { textAlign: \"justify\" },\n  alignFlexLeft: { justifyContent: \"flex-start\" },\n  alignFlexRight: { justifyContent: \"flex-end\" },\n  alignFlexCenter: { justifyContent: \"center\" },\n  alignFlexJustify: { textAlign: \"justify\" },\n  variantCheckbox: {\n    padding: 0,\n    width: 32,\n    maxWidth: 32,\n    borderRight: `solid 1px ${theme.colors.atmo4}`,\n  },\n  variantExpand: {},\n  variantActions: {\n    padding: 0,\n    width: 32,\n    maxWidth: 32,\n    borderLeft: `solid 1px ${theme.colors.atmo4}`,\n  },\n  variantNone: { padding: 0 },\n  variantList: {\n    backgroundColor: \"inherit\",\n    borderBottom: 0,\n    height: 16,\n    \":first-of-type > &\": {\n      borderTop: 0,\n      height: 16,\n    },\n  },\n  resizable: { borderRight: `solid 1px ${theme.colors.atmo4}` },\n  resizing: { borderRight: `solid 2px ${theme.colors.secondary}` },\n  resizer: {\n    display: \"inline-block\",\n    width: 10,\n    height: \"100%\",\n    position: \"absolute\",\n    right: 0,\n    top: 0,\n    transform: \"translateX(50%)\",\n    zIndex: 1,\n    touchAction: \"none\",\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","verticalAlign","textAlign","padding","theme","spacing","borderBottom","colors","atmo4","head","paddingTop","typography","label","transition","backgroundColor","atmo1","borderTop","paddingLeft","cursor","visibility","body","footer","stickyColumn","position","zIndex","borderLeft","stickyColumnMostLeft","borderRight","stickyColumnLeastRight","groupColumnMostLeft","groupColumnMostRight","headerContent","display","alignItems","width","headerText","overflow","textOverflow","headerParagraph","sortableHeaderText","sorted","sortable","sortButton","boxShadow","primary_20","sortIcon","alignLeft","alignRight","flexDirection","alignCenter","alignJustify","alignFlexLeft","justifyContent","alignFlexRight","alignFlexCenter","alignFlexJustify","variantCheckbox","maxWidth","variantExpand","variantActions","variantNone","variantList","resizable","resizing","secondary","resizer","right","top","transform","touchAction"],"mappings":"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"}
+{"version":3,"file":"TableHeader.styles.cjs","sources":["../../../../../src/components/Table/TableHeader/TableHeader.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTableHeader\", {\n  root: {\n    \"--first-row-cell-height\": \"52px\",\n    \"--cell-height\": \"32px\",\n    height: \"var(--cell-height)\",\n    verticalAlign: \"inherit\",\n    textAlign: \"left\",\n    padding: theme.spacing(0, 1, 0, 4),\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\n  head: {\n    paddingTop: 8,\n    verticalAlign: \"top\",\n    ...theme.typography.label,\n    transition: \"background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms\",\n    backgroundColor: theme.colors.atmo1,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n\n    \"*:first-of-type > &\": {\n      height: \"var(--first-row-cell-height)\",\n      borderTop: \"1px solid transparent\",\n    },\n\n    \"&$variantList\": {\n      backgroundColor: \"inherit\",\n      borderBottom: 0,\n      \"*:first-of-type > &\": {\n        borderTop: 0,\n      },\n    },\n\n    \"&$sortable\": {\n      verticalAlign: \"initial\",\n      paddingTop: 0,\n      paddingLeft: 0,\n      cursor: \"pointer\",\n\n      \"&:hover\": {\n        backgroundColor: \"transparent\",\n\n        \"& $sortIcon\": {\n          visibility: \"visible\",\n        },\n      },\n      \"&:focus-within\": {\n        backgroundColor: \"transparent\",\n\n        \"& $sortIcon\": {\n          visibility: \"visible\",\n        },\n      },\n    },\n  },\n  body: {\n    backgroundColor: \"inherit\",\n    ...theme.typography.body,\n    \"&$sortable:not($variantNone)\": {\n      paddingLeft: 32,\n    },\n  },\n  footer: {},\n  stickyColumn: {\n    position: \"sticky\",\n    zIndex: 2,\n\n    \"&$groupColumnMostRight+$stickyColumn\": {\n      borderLeft: 0,\n    },\n  },\n  stickyColumnMostLeft: { borderRight: `solid 1px ${theme.colors.atmo4}` },\n  stickyColumnLeastRight: { borderLeft: `solid 1px ${theme.colors.atmo4}` },\n  groupColumnMostLeft: { borderLeft: `solid 1px ${theme.colors.atmo4}` },\n  groupColumnMostRight: {\n    borderRight: `solid 1px ${theme.colors.atmo4}`,\n    // due to the \":has()\" selector not being supported in browsers,\n    // this need to be managed with inline styles\n    // To be uncommented when not needed (see comment in src/Table/hooks/useSticky.js)\n    // \"&:last-child,&:has(+ $stickyColumnLeastRight)\": {\n    \"&:last-child\": {\n      borderRight: 0,\n    },\n    \"&+:not($stickyColumn)\": {\n      borderLeft: 0,\n    },\n  },\n  headerContent: { display: \"flex\", alignItems: \"flex-start\", width: \"100%\" },\n  headerText: { overflow: \"hidden\", textOverflow: \"ellipsis\" },\n  headerParagraph: { overflow: \"hidden\", display: \"-webkit-box\" },\n  sortableHeaderText: { paddingTop: \"8px\" },\n  sorted: {\n    \"& $sortIcon\": {\n      visibility: \"visible\",\n    },\n  },\n  sortable: {},\n  sortButton: {\n    \"$root$sortable &\": {\n      boxShadow: \"none\",\n      backgroundColor: \"transparent\",\n      \"&:hover\": {\n        backgroundColor: theme.colors.primary_20,\n      },\n    },\n  },\n  sortIcon: { display: \"inline-flex\", visibility: \"hidden\" },\n  alignLeft: { textAlign: \"left\" },\n  alignRight: { textAlign: \"right\", flexDirection: \"row-reverse\" },\n  alignCenter: { textAlign: \"center\" },\n  alignJustify: { textAlign: \"justify\" },\n  alignFlexLeft: { justifyContent: \"flex-start\" },\n  alignFlexRight: { justifyContent: \"flex-end\" },\n  alignFlexCenter: { justifyContent: \"center\" },\n  alignFlexJustify: { textAlign: \"justify\" },\n  variantCheckbox: {\n    padding: 0,\n    width: 32,\n    maxWidth: 32,\n    borderRight: `solid 1px ${theme.colors.atmo4}`,\n  },\n  variantExpand: {},\n  variantActions: {\n    padding: 0,\n    width: 32,\n    maxWidth: 32,\n    borderLeft: `solid 1px ${theme.colors.atmo4}`,\n  },\n  variantNone: { padding: 0 },\n  variantList: {\n    backgroundColor: \"inherit\",\n    borderBottom: 0,\n    height: 16,\n    \":first-of-type > &\": {\n      borderTop: 0,\n      height: 16,\n    },\n  },\n  resizable: { borderRight: `solid 1px ${theme.colors.atmo4}` },\n  resizing: { borderRight: `solid 2px ${theme.colors.secondary}` },\n  resizer: {\n    display: \"inline-block\",\n    width: 10,\n    height: \"100%\",\n    position: \"absolute\",\n    right: 0,\n    top: 0,\n    transform: \"translateX(50%)\",\n    zIndex: 1,\n    touchAction: \"none\",\n  },\n});\n"],"names":["createClasses","theme"],"mappings":"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"}

package/dist/cjs/components/Table/TableHeader/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../../../../src/components/Table/TableHeader/utils.ts"],"sourcesContent":["import {\n  SortXS,\n  SortAscendingXS,\n  SortDescendingXS,\n} from \"@hitachivantara/uikit-react-icons\";\n\nexport const getSortIcon = (dir) => {\n  switch (dir) {\n    case \"ascending\":\n      return SortAscendingXS;\n    case \"descending\":\n      return SortDescendingXS;\n    default:\n      return SortXS;\n  }\n};\n\nexport const getSortDir = (sortDirection) => {\n  switch (sortDirection) {\n    case \"asc\":\n      return \"ascending\";\n    case \"desc\":\n      return \"descending\";\n    default:\n      return null;\n  }\n};\n\nexport const isParagraph = (children) => {\n  if (typeof children === \"string\" && /\\s/.test(children)) return true;\n  return false;\n};\n"],"names":["getSortIcon","dir","SortAscendingXS","SortDescendingXS","SortXS","isParagraph","children","test"],"mappings":";;;AAMO,MAAMA,cAAeC,CAAQ,QAAA;AAClC,UAAQA,KAAG;AAAA,IACT,KAAK;AACIC,aAAAA;IACT,KAAK;AACIC,aAAAA;IACT;AACSC,aAAAA;EACX;AACF;AAaO,MAAMC,cAAeC,CAAa,aAAA;AACvC,MAAI,OAAOA,aAAa,YAAY,KAAKC,KAAKD,QAAQ;AAAU,WAAA;AACzD,SAAA;AACT;;;"}
+{"version":3,"file":"utils.cjs","sources":["../../../../../src/components/Table/TableHeader/utils.ts"],"sourcesContent":["import {\n  SortXS,\n  SortAscendingXS,\n  SortDescendingXS,\n} from \"@hitachivantara/uikit-react-icons\";\n\nexport const getSortIcon = (dir) => {\n  switch (dir) {\n    case \"ascending\":\n      return SortAscendingXS;\n    case \"descending\":\n      return SortDescendingXS;\n    default:\n      return SortXS;\n  }\n};\n\nexport const getSortDir = (sortDirection) => {\n  switch (sortDirection) {\n    case \"asc\":\n      return \"ascending\";\n    case \"desc\":\n      return \"descending\";\n    default:\n      return null;\n  }\n};\n\nexport const isParagraph = (children) => {\n  if (typeof children === \"string\" && /\\s/.test(children)) return true;\n  return false;\n};\n"],"names":["SortAscendingXS","SortDescendingXS","SortXS"],"mappings":";;;AAMa,MAAA,cAAc,CAAC,QAAQ;AAClC,UAAQ,KAAK;AAAA,IACX,KAAK;AACI,aAAAA;IACT,KAAK;AACI,aAAAC;IACT;AACS,aAAAC;EACX;AACF;AAaa,MAAA,cAAc,CAAC,aAAa;AACvC,MAAI,OAAO,aAAa,YAAY,KAAK,KAAK,QAAQ;AAAU,WAAA;AACzD,SAAA;AACT;;;"}

package/dist/cjs/components/Table/TableRow/TableRow.cjs

@@ -2,53 +2,53 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
-const hexToRgbA = require("../../../utils/hexToRgbA.cjs");
-const useTheme = require("../../../hooks/useTheme.cjs");
 const TableContext = require("../TableContext.cjs");
 const TableSectionContext = require("../TableSectionContext.cjs");
 const TableRow_styles = require("./TableRow.styles.cjs");
 const useDefaultProps = require("../../../hooks/useDefaultProps.cjs");
 const defaultComponent = "tr";
-const HvTableRow = React.forwardRef((props, externalRef) => {
-  const {
-    classes: classesProp,
-    className,
-    component,
-    hover = false,
-    selected = false,
-    expanded = false,
-    striped = false,
-    ...others
-  } = useDefaultProps.useDefaultProps("HvTableRow", props);
-  const {
-    classes,
-    cx,
-    css
-  } = TableRow_styles.useClasses(classesProp);
-  const {
-    colors
-  } = useTheme.useTheme();
-  const tableContext = React.useContext(TableContext.default);
-  const tableSectionContext = React.useContext(TableSectionContext.default);
-  const type = tableSectionContext?.type || "body";
-  const isList = tableContext.variant === "listrow";
-  const Component = component || tableContext?.components?.Tr || defaultComponent;
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref: externalRef, className: cx(tableSectionContext.filterClassName, classes.root, classes[type], striped && css({
-    "&:nth-of-type(even)": {
-      backgroundColor: hexToRgbA.hexToRgbA(colors?.atmo1, 0.6)
-    },
-    "&:nth-of-type(odd)": {
-      backgroundColor: "transparent"
-    }
-  }), {
-    [classes.hover]: hover,
-    [classes.selected]: selected,
-    [classes.expanded]: expanded,
-    [classes.striped]: striped,
-    [classes.variantList]: isList && type === "body",
-    [classes.variantListHead]: isList && type === "head"
-  }, className), role: Component === defaultComponent ? null : "row", ...others });
-});
+const HvTableRow = React.forwardRef(
+  (props, externalRef) => {
+    const {
+      classes: classesProp,
+      className,
+      component,
+      hover = false,
+      selected = false,
+      expanded = false,
+      striped = false,
+      ...others
+    } = useDefaultProps.useDefaultProps("HvTableRow", props);
+    const { classes, cx } = TableRow_styles.useClasses(classesProp);
+    const tableContext = React.useContext(TableContext.default);
+    const tableSectionContext = React.useContext(TableSectionContext.default);
+    const type = tableSectionContext?.type || "body";
+    const isList = tableContext.variant === "listrow";
+    const Component = component || tableContext?.components?.Tr || defaultComponent;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Component,
+      {
+        ref: externalRef,
+        className: cx(
+          tableSectionContext.filterClassName,
+          classes.root,
+          classes[type],
+          {
+            [classes.hover]: hover,
+            [classes.selected]: selected,
+            [classes.expanded]: expanded,
+            [classes.striped]: striped,
+            [classes.variantList]: isList && type === "body",
+            [classes.variantListHead]: isList && type === "head"
+          },
+          className
+        ),
+        role: Component === defaultComponent ? null : "row",
+        ...others
+      }
+    );
+  }
+);
 exports.tableRowClasses = TableRow_styles.staticClasses;
 exports.HvTableRow = HvTableRow;
 //# sourceMappingURL=TableRow.cjs.map

package/dist/cjs/components/Table/TableRow/TableRow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.cjs","sources":["../../../../../src/components/Table/TableRow/TableRow.tsx"],"sourcesContent":["import { forwardRef, useContext } from \"react\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableRow.styles\";\n\nexport { staticClasses as tableRowClasses };\n\nexport type HvTableRowClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableRowProps\n  extends HvBaseProps<HTMLTableRowElement, \"children\"> {\n  /** Content to be rendered */\n  children: React.ReactNode;\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to tbody. */\n  component?: React.ElementType;\n  /** Whether the table row will shade on hover. */\n  hover?: boolean;\n  /** Whether the table row will have the selected shading. */\n  selected?: boolean;\n  /** Whether the table row is expanded. */\n  expanded?: boolean;\n  /** Whether the table row background is striped. */\n  striped?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableRowClasses;\n}\n\nconst defaultComponent = \"tr\";\n\n/**\n * `HvTableRow` acts as a `tr` element and inherits styles from its context\n */\nexport const HvTableRow = forwardRef<HTMLElement, HvTableRowProps>(\n  (props, externalRef) => {\n    const {\n      classes: classesProp,\n      className,\n      component,\n      hover = false,\n      selected = false,\n      expanded = false,\n      striped = false,\n      ...others\n    } = useDefaultProps(\"HvTableRow\", props);\n    const { classes, cx, css } = useClasses(classesProp);\n    const { colors } = useTheme();\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const type = tableSectionContext?.type || \"body\";\n\n    const isList = tableContext.variant === \"listrow\";\n\n    const Component =\n      component || tableContext?.components?.Tr || defaultComponent;\n\n    return (\n      <Component\n        ref={externalRef}\n        className={cx(\n          tableSectionContext.filterClassName,\n          classes.root,\n          classes[type],\n          striped &&\n            css({\n              \"&:nth-of-type(even)\": {\n                backgroundColor: hexToRgbA(colors?.atmo1, 0.6),\n              },\n              \"&:nth-of-type(odd)\": {\n                backgroundColor: \"transparent\",\n              },\n            }),\n          {\n            [classes.hover]: hover,\n            [classes.selected]: selected,\n            [classes.expanded]: expanded,\n            [classes.striped]: striped,\n            [classes.variantList]: isList && type === \"body\",\n            [classes.variantListHead]: isList && type === \"head\",\n          },\n          className\n        )}\n        role={Component === defaultComponent ? null : \"row\"}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["defaultComponent","HvTableRow","forwardRef","props","externalRef","classes","classesProp","className","component","hover","selected","expanded","striped","others","useDefaultProps","cx","css","useClasses","colors","useTheme","tableContext","useContext","TableContext","tableSectionContext","TableSectionContext","type","isList","variant","Component","components","Tr","jsx","filterClassName","root","backgroundColor","hexToRgbA","atmo1","variantList","variantListHead"],"mappings":";;;;;;;;;;AAkCA,MAAMA,mBAAmB;AAKlB,MAAMC,aAAaC,MAAAA,WACxB,CAACC,OAAOC,gBAAgB;AAChB,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,UAAU;AAAA,IACV,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,cAAcX,KAAK;AACjC,QAAA;AAAA,IAAEE;AAAAA,IAASU;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,gBAAAA,WAAWX,WAAW;AAC7C,QAAA;AAAA,IAAEY;AAAAA,MAAWC,SAAS,SAAA;AACtBC,QAAAA,eAAeC,iBAAWC,aAAAA,OAAY;AACtCC,QAAAA,sBAAsBF,iBAAWG,oBAAAA,OAAmB;AAEpDC,QAAAA,OAAOF,qBAAqBE,QAAQ;AAEpCC,QAAAA,SAASN,aAAaO,YAAY;AAExC,QAAMC,YACJpB,aAAaY,cAAcS,YAAYC,MAAM9B;AAE/C,SACG+B,2BAAAA,IAAA,WAAA,EACC,KAAK3B,aACL,WAAWW,GACTQ,oBAAoBS,iBACpB3B,QAAQ4B,MACR5B,QAAQoB,IAAI,GACZb,WACEI,IAAI;AAAA,IACF,uBAAuB;AAAA,MACrBkB,iBAAiBC,UAAAA,UAAUjB,QAAQkB,OAAO,GAAG;AAAA,IAC/C;AAAA,IACA,sBAAsB;AAAA,MACpBF,iBAAiB;AAAA,IACnB;AAAA,EAAA,CACD,GACH;AAAA,IACE,CAAC7B,QAAQI,KAAK,GAAGA;AAAAA,IACjB,CAACJ,QAAQK,QAAQ,GAAGA;AAAAA,IACpB,CAACL,QAAQM,QAAQ,GAAGA;AAAAA,IACpB,CAACN,QAAQO,OAAO,GAAGA;AAAAA,IACnB,CAACP,QAAQgC,WAAW,GAAGX,UAAUD,SAAS;AAAA,IAC1C,CAACpB,QAAQiC,eAAe,GAAGZ,UAAUD,SAAS;AAAA,EAAA,GAEhDlB,SACF,GACA,MAAMqB,cAAc5B,mBAAmB,OAAO,OAC1Ca,GAAAA,OACJ,CAAA;AAEN,CACF;;;"}
+{"version":3,"file":"TableRow.cjs","sources":["../../../../../src/components/Table/TableRow/TableRow.tsx"],"sourcesContent":["import { forwardRef, useContext } from \"react\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableRow.styles\";\n\nexport { staticClasses as tableRowClasses };\n\nexport type HvTableRowClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableRowProps\n  extends HvBaseProps<HTMLTableRowElement, \"children\"> {\n  /** Content to be rendered */\n  children: React.ReactNode;\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to tbody. */\n  component?: React.ElementType;\n  /** Whether the table row will shade on hover. */\n  hover?: boolean;\n  /** Whether the table row will have the selected shading. */\n  selected?: boolean;\n  /** Whether the table row is expanded. */\n  expanded?: boolean;\n  /** Whether the table row background is striped. */\n  striped?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableRowClasses;\n}\n\nconst defaultComponent = \"tr\";\n\n/**\n * `HvTableRow` acts as a `tr` element and inherits styles from its context\n */\nexport const HvTableRow = forwardRef<HTMLElement, HvTableRowProps>(\n  (props, externalRef) => {\n    const {\n      classes: classesProp,\n      className,\n      component,\n      hover = false,\n      selected = false,\n      expanded = false,\n      striped = false,\n      ...others\n    } = useDefaultProps(\"HvTableRow\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const type = tableSectionContext?.type || \"body\";\n\n    const isList = tableContext.variant === \"listrow\";\n\n    const Component =\n      component || tableContext?.components?.Tr || defaultComponent;\n\n    return (\n      <Component\n        ref={externalRef}\n        className={cx(\n          tableSectionContext.filterClassName,\n          classes.root,\n          classes[type],\n          {\n            [classes.hover]: hover,\n            [classes.selected]: selected,\n            [classes.expanded]: expanded,\n            [classes.striped]: striped,\n            [classes.variantList]: isList && type === \"body\",\n            [classes.variantListHead]: isList && type === \"head\",\n          },\n          className\n        )}\n        role={Component === defaultComponent ? null : \"row\"}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useContext","TableContext","TableSectionContext","jsx"],"mappings":";;;;;;;;AAgCA,MAAM,mBAAmB;AAKlB,MAAM,aAAaA,MAAA;AAAA,EACxB,CAAC,OAAO,gBAAgB;AAChB,UAAA;AAAA,MACJ,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,WAAW;AAAA,MACX,UAAU;AAAA,MACV,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,cAAc,KAAK;AAEvC,UAAM,EAAE,SAAS,GAAG,IAAIC,2BAAW,WAAW;AAExC,UAAA,eAAeC,iBAAWC,aAAAA,OAAY;AACtC,UAAA,sBAAsBD,iBAAWE,oBAAAA,OAAmB;AAEpD,UAAA,OAAO,qBAAqB,QAAQ;AAEpC,UAAA,SAAS,aAAa,YAAY;AAExC,UAAM,YACJ,aAAa,cAAc,YAAY,MAAM;AAG7C,WAAAC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW;AAAA,UACT,oBAAoB;AAAA,UACpB,QAAQ;AAAA,UACR,QAAQ,IAAI;AAAA,UACZ;AAAA,YACE,CAAC,QAAQ,KAAK,GAAG;AAAA,YACjB,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,OAAO,GAAG;AAAA,YACnB,CAAC,QAAQ,WAAW,GAAG,UAAU,SAAS;AAAA,YAC1C,CAAC,QAAQ,eAAe,GAAG,UAAU,SAAS;AAAA,UAChD;AAAA,UACA;AAAA,QACF;AAAA,QACA,MAAM,cAAc,mBAAmB,OAAO;AAAA,QAC7C,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;;;"}

package/dist/cjs/components/Table/TableRow/TableRow.styles.cjs

@@ -3,10 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const classes = require("../../../utils/classes.cjs");
 const utils = require("../utils/utils.cjs");
-const {
-  staticClasses,
-  useClasses
-} = classes.createClasses("HvTableRow", {
+const { staticClasses, useClasses } = classes.createClasses("HvTableRow", {
   /** Styles applied to the component root class. */
   root: {
     color: "inherit",
@@ -34,11 +31,13 @@ const {
   /** Styles applied to the component root when striped. */
   striped: {
     "&:nth-of-type(even)": {
+      backgroundColor: uikitStyles.theme.alpha("atmo1", 0.6),
       "&:hover": {
         backgroundColor: uikitStyles.theme.colors.containerBackgroundHover
       }
     },
     "&:nth-of-type(odd)": {
+      backgroundColor: "transparent",
       "&:hover": {
         backgroundColor: uikitStyles.theme.colors.containerBackgroundHover
       }