@kaizen/components 0.0.0-canary-rollup-20240408071509 → 0.0.0-canary-rollup--tree-shake-20240408080317

package/dist/esm/Slider/Slider.mjs

@@ -11,20 +11,48 @@ import styles from './Slider.module.scss.mjs';
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896335/Slider Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-slider--docs Storybook}
  */
-var Slider = function (_a) {
-    var propsId = _a.id, labelText = _a.labelText, description = _a.description, _b = _a.labelPosition, labelPosition = _b === void 0 ? "inline" : _b, _c = _a.variant, variant = _c === void 0 ? "default" : _c, disabled = _a.disabled, readOnlyMessage = _a.readOnlyMessage, restProps = __rest(_a, ["id", "labelText", "description", "labelPosition", "variant", "disabled", "readOnlyMessage"]);
+const Slider = /*#__PURE__*/function () {
+  const Slider = function (_a) {
+    var propsId = _a.id,
+      labelText = _a.labelText,
+      description = _a.description,
+      _b = _a.labelPosition,
+      labelPosition = _b === void 0 ? "inline" : _b,
+      _c = _a.variant,
+      variant = _c === void 0 ? "default" : _c,
+      disabled = _a.disabled,
+      readOnlyMessage = _a.readOnlyMessage,
+      restProps = __rest(_a, ["id", "labelText", "description", "labelPosition", "variant", "disabled", "readOnlyMessage"]);
     var id = propsId !== null && propsId !== void 0 ? propsId : useId();
     var descriptionId = "".concat(id, "-description");
-    return (React.createElement(FieldGroup, { inline: true },
-        React.createElement("div", { className: classnames(styles.wrapper, labelPosition === "inline" && styles.labelInline) },
-            React.createElement("div", { className: styles.labelWrapper },
-                React.createElement("div", { className: styles.label },
-                    React.createElement(Label, { htmlFor: id, labelText: labelText, variant: variant, disabled: disabled })),
-                description && (React.createElement(Text, { variant: "small", id: descriptionId, classNameOverride: disabled ? styles.descriptionDisabled : undefined }, description))),
-            React.createElement("div", { className: styles.inputWrapper },
-                React.createElement(InputRange, __assign({ id: id, "aria-describedby": descriptionId, disabled: disabled }, restProps)),
-                readOnlyMessage && (React.createElement("div", { className: styles.readOnlyMessage }, readOnlyMessage))))));
-};
-Slider.displayName = "Slider";
-
+    return /*#__PURE__*/React.createElement(FieldGroup, {
+      inline: true
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.wrapper, labelPosition === "inline" && styles.labelInline)
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.labelWrapper
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.label
+    }, /*#__PURE__*/React.createElement(Label, {
+      htmlFor: id,
+      labelText: labelText,
+      variant: variant,
+      disabled: disabled
+    })), description && ( /*#__PURE__*/React.createElement(Text, {
+      variant: "small",
+      id: descriptionId,
+      classNameOverride: disabled ? styles.descriptionDisabled : undefined
+    }, description))), /*#__PURE__*/React.createElement("div", {
+      className: styles.inputWrapper
+    }, /*#__PURE__*/React.createElement(InputRange, __assign({
+      id: id,
+      "aria-describedby": descriptionId,
+      disabled: disabled
+    }, restProps)), readOnlyMessage && ( /*#__PURE__*/React.createElement("div", {
+      className: styles.readOnlyMessage
+    }, readOnlyMessage)))));
+  };
+  Slider.displayName = "Slider";
+  return Slider;
+}();
 export { Slider };

package/dist/esm/Slider/Slider.module.scss.mjs

@@ -1,3 +1,10 @@
-var styles = {"wrapper":"Slider-module_wrapper__zVX6g","labelWrapper":"Slider-module_labelWrapper__WuUIw","label":"Slider-module_label__CfIjh","labelInline":"Slider-module_labelInline__zjINd","inputWrapper":"Slider-module_inputWrapper__n16yj","descriptionDisabled":"Slider-module_descriptionDisabled__8GwiS","readOnlyMessage":"Slider-module_readOnlyMessage__Zscoa"};
-
+var styles = {
+  "wrapper": "Slider-module_wrapper__zVX6g",
+  "labelWrapper": "Slider-module_labelWrapper__WuUIw",
+  "label": "Slider-module_label__CfIjh",
+  "labelInline": "Slider-module_labelInline__zjINd",
+  "inputWrapper": "Slider-module_inputWrapper__n16yj",
+  "descriptionDisabled": "Slider-module_descriptionDisabled__8GwiS",
+  "readOnlyMessage": "Slider-module_readOnlyMessage__Zscoa"
+};
 export { styles as default };

package/dist/esm/SplitButton/SplitButton.mjs

@@ -14,12 +14,34 @@ import styles from './SplitButton.module.scss.mjs';
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896196/Split+Button Guidance} |
  * {@link https://cultureamp.design/storybook/?path=/docs/components-splitbutton--docs Storybook}
  */
-var SplitButton = function (_a) {
-    var actionButtonProps = _a.actionButtonProps, dropdownButtonProps = _a.dropdownButtonProps, dropdownContent = _a.dropdownContent, isDropdownInitOpen = _a.isDropdownInitOpen, disabled = _a.disabled, isReversed = _a.isReversed, dir = _a.dir, classNameOverride = _a.classNameOverride, restProps = __rest(_a, ["actionButtonProps", "dropdownButtonProps", "dropdownContent", "isDropdownInitOpen", "disabled", "isReversed", "dir", "classNameOverride"]);
-    return (React.createElement("div", __assign({ dir: dir, className: classnames(styles.splitButton, classNameOverride) }, restProps),
-        React.createElement(ActionButton, __assign({ disabled: disabled, isReversed: isReversed }, actionButtonProps)),
-        React.createElement(Menu, { align: dir === "rtl" ? "left" : "right", dropdownWidth: "contain", button: React.createElement(DropdownButton, __assign({ disabled: disabled, isReversed: isReversed }, dropdownButtonProps)), menuVisible: isDropdownInitOpen }, dropdownContent)));
-};
-SplitButton.displayName = "SplitButton";
-
+const SplitButton = /*#__PURE__*/function () {
+  const SplitButton = function (_a) {
+    var actionButtonProps = _a.actionButtonProps,
+      dropdownButtonProps = _a.dropdownButtonProps,
+      dropdownContent = _a.dropdownContent,
+      isDropdownInitOpen = _a.isDropdownInitOpen,
+      disabled = _a.disabled,
+      isReversed = _a.isReversed,
+      dir = _a.dir,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["actionButtonProps", "dropdownButtonProps", "dropdownContent", "isDropdownInitOpen", "disabled", "isReversed", "dir", "classNameOverride"]);
+    return /*#__PURE__*/React.createElement("div", __assign({
+      dir: dir,
+      className: classnames(styles.splitButton, classNameOverride)
+    }, restProps), /*#__PURE__*/React.createElement(ActionButton, __assign({
+      disabled: disabled,
+      isReversed: isReversed
+    }, actionButtonProps)), /*#__PURE__*/React.createElement(Menu, {
+      align: dir === "rtl" ? "left" : "right",
+      dropdownWidth: "contain",
+      button: /*#__PURE__*/React.createElement(DropdownButton, __assign({
+        disabled: disabled,
+        isReversed: isReversed
+      }, dropdownButtonProps)),
+      menuVisible: isDropdownInitOpen
+    }, dropdownContent));
+  };
+  SplitButton.displayName = "SplitButton";
+  return SplitButton;
+}();
 export { SplitButton };

package/dist/esm/SplitButton/SplitButton.module.scss.mjs

@@ -1,3 +1,4 @@
-var styles = {"splitButton":"SplitButton-module_splitButton__oNIKE"};
-
+var styles = {
+  "splitButton": "SplitButton-module_splitButton__oNIKE"
+};
 export { styles as default };

package/dist/esm/SplitButton/subcomponents/ActionButton/ActionButton.mjs

@@ -3,11 +3,15 @@ import React from 'react';
 import classnames from 'classnames';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
 import styles from './ActionButton.module.scss.mjs';
-
-var ActionButton = function (_a) {
-    var classNameOverride = _a.classNameOverride, restProps = __rest(_a, ["classNameOverride"]);
-    return (React.createElement(BaseButton, __assign({ classNameOverride: classnames(styles.actionButton, classNameOverride) }, restProps)));
-};
-ActionButton.displayName = "ActionButton";
-
+const ActionButton = /*#__PURE__*/function () {
+  const ActionButton = function (_a) {
+    var classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["classNameOverride"]);
+    return /*#__PURE__*/React.createElement(BaseButton, __assign({
+      classNameOverride: classnames(styles.actionButton, classNameOverride)
+    }, restProps));
+  };
+  ActionButton.displayName = "ActionButton";
+  return ActionButton;
+}();
 export { ActionButton };

package/dist/esm/SplitButton/subcomponents/ActionButton/ActionButton.module.scss.mjs

@@ -1,3 +1,4 @@
-var styles = {"actionButton":"ActionButton-module_actionButton__mJRl4"};
-
+var styles = {
+  "actionButton": "ActionButton-module_actionButton__mJRl4"
+};
 export { styles as default };

package/dist/esm/SplitButton/subcomponents/BaseButton/BaseButton.mjs

@@ -2,25 +2,36 @@ import { __rest, __assign } from 'tslib';
 import React from 'react';
 import classnames from 'classnames';
 import styles from './BaseButton.module.scss.mjs';
-
 var isAnchor = function (attributes) {
-    return !attributes.disabled && attributes.href !== undefined;
+  return !attributes.disabled && attributes.href !== undefined;
 };
-var BaseButton = function (_a) {
-    var label = _a.label, icon = _a.icon, isReversed = _a.isReversed, classNameOverride = _a.classNameOverride, attributes = __rest(_a, ["label", "icon", "isReversed", "classNameOverride"]);
+const BaseButton = /*#__PURE__*/function () {
+  const BaseButton = function (_a) {
+    var label = _a.label,
+      icon = _a.icon,
+      isReversed = _a.isReversed,
+      classNameOverride = _a.classNameOverride,
+      attributes = __rest(_a, ["label", "icon", "isReversed", "classNameOverride"]);
     var className = classnames(styles.baseButton, classNameOverride, isReversed ? styles.isReversed : styles.default);
-    var contentProps = icon
-        ? {
-            children: React.createElement(React.Fragment, null, icon),
-            "aria-label": label,
-        }
-        : { children: label };
-    var children = contentProps.children, restContentProps = __rest(contentProps, ["children"]);
+    var contentProps = icon ? {
+      children: /*#__PURE__*/React.createElement(React.Fragment, null, icon),
+      "aria-label": label
+    } : {
+      children: label
+    };
+    var children = contentProps.children,
+      restContentProps = __rest(contentProps, ["children"]);
     if (isAnchor(attributes)) {
-        return (React.createElement("a", __assign({ className: className }, restContentProps, attributes), children));
+      return /*#__PURE__*/React.createElement("a", __assign({
+        className: className
+      }, restContentProps, attributes), children);
     }
-    return (React.createElement("button", __assign({ type: "button", className: className }, restContentProps, attributes), children));
-};
-BaseButton.displayName = "BaseButton";
-
+    return /*#__PURE__*/React.createElement("button", __assign({
+      type: "button",
+      className: className
+    }, restContentProps, attributes), children);
+  };
+  BaseButton.displayName = "BaseButton";
+  return BaseButton;
+}();
 export { BaseButton };

package/dist/esm/SplitButton/subcomponents/BaseButton/BaseButton.module.scss.mjs

@@ -1,3 +1,6 @@
-var styles = {"baseButton":"BaseButton-module_baseButton__0XYh4","default":"BaseButton-module_default__6JNZx","isReversed":"BaseButton-module_isReversed__j8nyW"};
-
+var styles = {
+  "baseButton": "BaseButton-module_baseButton__0XYh4",
+  "default": "BaseButton-module_default__6JNZx",
+  "isReversed": "BaseButton-module_isReversed__j8nyW"
+};
 export { styles as default };

package/dist/esm/SplitButton/subcomponents/DropdownButton/DropdownButton.mjs

@@ -6,17 +6,25 @@ import '../../../Icon/subcomponents/SVG/SVG.mjs';
 import { ChevronDownIcon } from '../../../Icon/ChevronDownIcon.mjs';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
 import styles from './DropdownButton.module.scss.mjs';
-
-var DropdownButton = function (_a) {
-    var classNameOverride = _a.classNameOverride, ariaLabel = _a["aria-label"], restProps = __rest(_a, ["classNameOverride", "aria-label"]);
+const DropdownButton = /*#__PURE__*/function () {
+  const DropdownButton = function (_a) {
+    var classNameOverride = _a.classNameOverride,
+      ariaLabel = _a["aria-label"],
+      restProps = __rest(_a, ["classNameOverride", "aria-label"]);
     var formatMessage = useIntl().formatMessage;
-    return (React.createElement(BaseButton, __assign({ label: ariaLabel ||
-            formatMessage({
-                id: "splitButton.dropdownButton.label",
-                defaultMessage: "Additional actions",
-                description: "Label for a dropdown menu holding additional actions",
-            }), icon: React.createElement(ChevronDownIcon, { role: "presentation" }), classNameOverride: classnames(styles.dropdownButton, classNameOverride) }, restProps)));
-};
-DropdownButton.displayName = "DropdownButton";
-
+    return /*#__PURE__*/React.createElement(BaseButton, __assign({
+      label: ariaLabel || formatMessage({
+        id: "splitButton.dropdownButton.label",
+        defaultMessage: "Additional actions",
+        description: "Label for a dropdown menu holding additional actions"
+      }),
+      icon: /*#__PURE__*/React.createElement(ChevronDownIcon, {
+        role: "presentation"
+      }),
+      classNameOverride: classnames(styles.dropdownButton, classNameOverride)
+    }, restProps));
+  };
+  DropdownButton.displayName = "DropdownButton";
+  return DropdownButton;
+}();
 export { DropdownButton };

package/dist/esm/SplitButton/subcomponents/DropdownButton/DropdownButton.module.scss.mjs

@@ -1,3 +1,4 @@
-var styles = {"dropdownButton":"DropdownButton-module_dropdownButton__PqQH6"};
-
+var styles = {
+  "dropdownButton": "DropdownButton-module_dropdownButton__PqQH6"
+};
 export { styles as default };

package/dist/esm/Table/Table.mjs

@@ -17,102 +17,226 @@ import styles from './Table.module.scss.mjs';
  * {@link https://cultureamp.design/?path=/docs/components-table--docs Storybook}
  */
 var TableContainer = function (_a) {
-    var _b = _a.variant, variant = _b === void 0 ? "compact" : _b, children = _a.children, otherProps = __rest(_a, ["variant", "children"]);
-    return (React.createElement("div", __assign({ role: "table", className: classnames(styles.container, variant === "default" && styles.defaultSpacing, variant === "data" && styles.dataVariant) }, otherProps), children));
+  var _b = _a.variant,
+    variant = _b === void 0 ? "compact" : _b,
+    children = _a.children,
+    otherProps = __rest(_a, ["variant", "children"]);
+  return /*#__PURE__*/React.createElement("div", __assign({
+    role: "table",
+    className: classnames(styles.container, variant === "default" && styles.defaultSpacing, variant === "data" && styles.dataVariant)
+  }, otherProps), children);
 };
 var TableHeader = function (_a) {
-    var children = _a.children, otherProps = __rest(_a, ["children"]);
-    return (React.createElement("div", __assign({ role: "rowgroup" }, otherProps), children));
+  var children = _a.children,
+    otherProps = __rest(_a, ["children"]);
+  return /*#__PURE__*/React.createElement("div", __assign({
+    role: "rowgroup"
+  }, otherProps), children);
 };
 var ratioToPercent = function (width) {
-    return width != null ? "".concat(width * 100, "%") : width;
+  return width != null ? "".concat(width * 100, "%") : width;
 };
 var TableHeaderRowCell = function (_a) {
-    var labelText = _a.labelText, onClick = _a.onClick, href = _a.href, width = _a.width, flex = _a.flex, icon = _a.icon, checkable = _a.checkable, checkedStatus = _a.checkedStatus, onCheck = _a.onCheck, reversed = _a.reversed, sortingRaw = _a.sorting, 
+  var labelText = _a.labelText,
+    onClick = _a.onClick,
+    href = _a.href,
+    width = _a.width,
+    flex = _a.flex,
+    icon = _a.icon,
+    checkable = _a.checkable,
+    checkedStatus = _a.checkedStatus,
+    onCheck = _a.onCheck,
+    reversed = _a.reversed,
+    sortingRaw = _a.sorting,
     // I can't say for certain why "nowrap" was the default value. Normally you wouldn't
     // want to clip off information because it doesn't fit on one line.
     // My assumption is that because since the cell width rows are decoupled, a heading
     // cell with a word longer than the column width would push the columns out of
     // alignment? I'm not sure.
     // Anyway, we can override this default behaviour by setting wrapping to "wrap".
-    _b = _a.wrapping, 
+    _b = _a.wrapping,
     // I can't say for certain why "nowrap" was the default value. Normally you wouldn't
     // want to clip off information because it doesn't fit on one line.
     // My assumption is that because since the cell width rows are decoupled, a heading
     // cell with a word longer than the column width would push the columns out of
     // alignment? I'm not sure.
     // Anyway, we can override this default behaviour by setting wrapping to "wrap".
-    wrapping = _b === void 0 ? "nowrap" : _b, _c = _a.align, align = _c === void 0 ? "start" : _c, tooltipInfo = _a.tooltipInfo, 
+    wrapping = _b === void 0 ? "nowrap" : _b,
+    _c = _a.align,
+    align = _c === void 0 ? "start" : _c,
+    tooltipInfo = _a.tooltipInfo,
     // If set, this will hide the tooltip exclamation icon. Useful in situations where
     // the table header does not have enough space. However, we should always show a
     // tooltip icon as the default based on design system tooltip guidelines.
-    _d = _a.isTooltipIconHidden, 
+    _d = _a.isTooltipIconHidden,
     // If set, this will hide the tooltip exclamation icon. Useful in situations where
     // the table header does not have enough space. However, we should always show a
     // tooltip icon as the default based on design system tooltip guidelines.
-    isTooltipIconHidden = _d === void 0 ? false : _d, tooltipPortalSelector = _a.tooltipPortalSelector, 
+    isTooltipIconHidden = _d === void 0 ? false : _d,
+    tooltipPortalSelector = _a.tooltipPortalSelector,
     // If set, this will show the arrow in the direction provided
     // when the header cell is hovered over.
-    sortingArrowsOnHover = _a.sortingArrowsOnHover, classNameOverride = _a.classNameOverride, 
+    sortingArrowsOnHover = _a.sortingArrowsOnHover,
+    classNameOverride = _a.classNameOverride,
     // There aren't any other props in the type definition, so I'm unsure why we
     // have this spread.
     otherProps = __rest(_a, ["labelText", "onClick", "href", "width", "flex", "icon", "checkable", "checkedStatus", "onCheck", "reversed", "sorting", "wrapping", "align", "tooltipInfo", "isTooltipIconHidden", "tooltipPortalSelector", "sortingArrowsOnHover", "classNameOverride"]);
-    var sorting = sortingRaw;
-    var _e = React.useState(false), isHovered = _e[0], setIsHovered = _e[1];
-    var updateHoverState = function (hoverState) {
-        if (sortingArrowsOnHover && hoverState != isHovered)
-            setIsHovered(hoverState);
-    };
-    var headerColor = !!reversed
-        ? "white-reduced-opacity"
-        : "dark-reduced-opacity";
-    var hoveredHeaderColor = !!reversed ? "white" : "dark";
-    // For this "cellContents" variable, we start at the inner most child, and
-    // wrap it elements, depending on what the props dictate.
-    var cellContents = (React.createElement("div", { className: styles.headerRowCellLabelAndIcons },
-        icon && (React.createElement("span", { className: styles.headerRowCellIcon }, cloneElement(icon, { title: labelText, role: "img" }))),
-        checkable && (React.createElement("div", { className: styles.headerRowCellCheckbox },
-            React.createElement(Checkbox, { checkedStatus: checkedStatus, onCheck: onCheck }))),
-        tooltipInfo != null && !isTooltipIconHidden ? (React.createElement("div", { className: styles.headerRowCellTooltipIcon },
-            React.createElement(ExclamationIcon, { role: "presentation" }))) : null,
-        !icon ? (React.createElement(Heading, { tag: "div", variant: "heading-6", color: sorting || isHovered ? hoveredHeaderColor : headerColor, classNameOverride: styles.headerRowCellLabel }, labelText)) : null,
-        (sorting || (isHovered && sortingArrowsOnHover)) && (React.createElement("div", { className: classnames(align === "center" && styles.headerRowCellIconAlignCenter, align === "end" && styles.headerRowCellIconAlignEnd, reversed && styles.whiteText) }, sorting === "ascending" || sortingArrowsOnHover === "ascending" ? (React.createElement(SortAscendingIcon, { role: "presentation" })) : (React.createElement(SortDescendingIcon, { role: "presentation" }))))));
-    cellContents = href ? (React.createElement("a", { className: classnames(styles.headerRowCellButton, reversed && styles.headerRowCellButtonReversed), href: href, onClick: onClick, onMouseEnter: function () { return updateHoverState(true); }, onFocus: function () { return updateHoverState(true); }, onMouseLeave: function () { return updateHoverState(false); }, onBlur: function () { return updateHoverState(false); } }, cellContents)) : onClick ? (React.createElement("button", { type: "button", className: classnames(styles.headerRowCellButton, reversed && styles.headerRowCellButtonReversed), onClick: onClick, onMouseEnter: function () { return updateHoverState(true); }, onFocus: function () { return updateHoverState(true); }, onMouseLeave: function () { return updateHoverState(false); }, onBlur: function () { return updateHoverState(false); } }, cellContents)) : (
-    // This div wrapper probably isn't needed, but it's a bit easier
-    // for this flex positioning, to have the dom tree depth match for
-    // each permutation.
-    React.createElement("div", { className: styles.headerRowCellNoButton }, cellContents));
-    cellContents =
-        tooltipInfo != null ? (React.createElement(Tooltip, { animationDuration: 0, classNameOverride: styles.headerRowCellTooltip, text: tooltipInfo, portalSelector: tooltipPortalSelector }, cellContents)) : (
-        // Again, this wrapper is just to make the dom tree consistent between
-        // different permutations.
-        React.createElement("div", { className: styles.headerRowCellTooltip }, cellContents));
-    return (React.createElement("div", __assign({ className: classnames(styles.headerRowCell, wrapping === "nowrap" && styles.headerRowCellNoWrap, align === "center" && styles.headerRowCellAlignCenter, align === "end" && styles.headerRowCellAlignEnd, sorting && styles.headerRowCellActive, classNameOverride), style: {
-            width: ratioToPercent(width),
-            flex: flex,
-        }, role: "columnheader" }, otherProps), cellContents));
+  var sorting = sortingRaw;
+  var _e = React.useState(false),
+    isHovered = _e[0],
+    setIsHovered = _e[1];
+  var updateHoverState = function (hoverState) {
+    if (sortingArrowsOnHover && hoverState != isHovered) setIsHovered(hoverState);
+  };
+  var headerColor = !!reversed ? "white-reduced-opacity" : "dark-reduced-opacity";
+  var hoveredHeaderColor = !!reversed ? "white" : "dark";
+  // For this "cellContents" variable, we start at the inner most child, and
+  // wrap it elements, depending on what the props dictate.
+  var cellContents = /*#__PURE__*/React.createElement("div", {
+    className: styles.headerRowCellLabelAndIcons
+  }, icon && ( /*#__PURE__*/React.createElement("span", {
+    className: styles.headerRowCellIcon
+  }, /*#__PURE__*/cloneElement(icon, {
+    title: labelText,
+    role: "img"
+  }))), checkable && ( /*#__PURE__*/React.createElement("div", {
+    className: styles.headerRowCellCheckbox
+  }, /*#__PURE__*/React.createElement(Checkbox, {
+    checkedStatus: checkedStatus,
+    onCheck: onCheck
+  }))), tooltipInfo != null && !isTooltipIconHidden ? ( /*#__PURE__*/React.createElement("div", {
+    className: styles.headerRowCellTooltipIcon
+  }, /*#__PURE__*/React.createElement(ExclamationIcon, {
+    role: "presentation"
+  }))) : null, !icon ? ( /*#__PURE__*/React.createElement(Heading, {
+    tag: "div",
+    variant: "heading-6",
+    color: sorting || isHovered ? hoveredHeaderColor : headerColor,
+    classNameOverride: styles.headerRowCellLabel
+  }, labelText)) : null, (sorting || isHovered && sortingArrowsOnHover) && ( /*#__PURE__*/React.createElement("div", {
+    className: classnames(align === "center" && styles.headerRowCellIconAlignCenter, align === "end" && styles.headerRowCellIconAlignEnd, reversed && styles.whiteText)
+  }, sorting === "ascending" || sortingArrowsOnHover === "ascending" ? ( /*#__PURE__*/React.createElement(SortAscendingIcon, {
+    role: "presentation"
+  })) : ( /*#__PURE__*/React.createElement(SortDescendingIcon, {
+    role: "presentation"
+  })))));
+  cellContents = href ? ( /*#__PURE__*/React.createElement("a", {
+    className: classnames(styles.headerRowCellButton, reversed && styles.headerRowCellButtonReversed),
+    href: href,
+    onClick: onClick,
+    onMouseEnter: function () {
+      return updateHoverState(true);
+    },
+    onFocus: function () {
+      return updateHoverState(true);
+    },
+    onMouseLeave: function () {
+      return updateHoverState(false);
+    },
+    onBlur: function () {
+      return updateHoverState(false);
+    }
+  }, cellContents)) : onClick ? ( /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: classnames(styles.headerRowCellButton, reversed && styles.headerRowCellButtonReversed),
+    onClick: onClick,
+    onMouseEnter: function () {
+      return updateHoverState(true);
+    },
+    onFocus: function () {
+      return updateHoverState(true);
+    },
+    onMouseLeave: function () {
+      return updateHoverState(false);
+    },
+    onBlur: function () {
+      return updateHoverState(false);
+    }
+  }, cellContents)) : (
+  /*#__PURE__*/
+  // This div wrapper probably isn't needed, but it's a bit easier
+  // for this flex positioning, to have the dom tree depth match for
+  // each permutation.
+  React.createElement("div", {
+    className: styles.headerRowCellNoButton
+  }, cellContents));
+  cellContents = tooltipInfo != null ? ( /*#__PURE__*/React.createElement(Tooltip, {
+    animationDuration: 0,
+    classNameOverride: styles.headerRowCellTooltip,
+    text: tooltipInfo,
+    portalSelector: tooltipPortalSelector
+  }, cellContents)) : (
+  /*#__PURE__*/
+  // Again, this wrapper is just to make the dom tree consistent between
+  // different permutations.
+  React.createElement("div", {
+    className: styles.headerRowCellTooltip
+  }, cellContents));
+  return /*#__PURE__*/React.createElement("div", __assign({
+    className: classnames(styles.headerRowCell, wrapping === "nowrap" && styles.headerRowCellNoWrap, align === "center" && styles.headerRowCellAlignCenter, align === "end" && styles.headerRowCellAlignEnd, sorting && styles.headerRowCellActive, classNameOverride),
+    style: {
+      width: ratioToPercent(width),
+      flex: flex
+    },
+    role: "columnheader"
+  }, otherProps), cellContents);
 };
 var TableCard = function (_a) {
-    var children = _a.children, expanded = _a.expanded, _b = _a.expandedStyle, expandedStyle = _b === void 0 ? "well" : _b, onClick = _a.onClick, href = _a.href, _c = _a.forceHoverState, forceHoverState = _c === void 0 ? false : _c, classNameOverride = _a.classNameOverride, otherProps = __rest(_a, ["children", "expanded", "expandedStyle", "onClick", "href", "forceHoverState", "classNameOverride"]);
-    var className = classnames(styles.card, expanded && styles.expanded, expanded && styles[expandedStyle], (forceHoverState || onClick != null || href != null) &&
-        styles.hasHoverState, classNameOverride);
-    return href != null ? (React.createElement("a", __assign({ href: href, className: className, onClick: onClick }, otherProps), children)) : onClick ? (React.createElement("button", __assign({ type: "button", className: className, onClick: onClick }, otherProps), children)) : (React.createElement("div", __assign({ className: className }, otherProps), children));
+  var children = _a.children,
+    expanded = _a.expanded,
+    _b = _a.expandedStyle,
+    expandedStyle = _b === void 0 ? "well" : _b,
+    onClick = _a.onClick,
+    href = _a.href,
+    _c = _a.forceHoverState,
+    forceHoverState = _c === void 0 ? false : _c,
+    classNameOverride = _a.classNameOverride,
+    otherProps = __rest(_a, ["children", "expanded", "expandedStyle", "onClick", "href", "forceHoverState", "classNameOverride"]);
+  var className = classnames(styles.card, expanded && styles.expanded, expanded && styles[expandedStyle], (forceHoverState || onClick != null || href != null) && styles.hasHoverState, classNameOverride);
+  return href != null ? ( /*#__PURE__*/React.createElement("a", __assign({
+    href: href,
+    className: className,
+    onClick: onClick
+  }, otherProps), children)) : onClick ? ( /*#__PURE__*/React.createElement("button", __assign({
+    type: "button",
+    className: className,
+    onClick: onClick
+  }, otherProps), children)) : ( /*#__PURE__*/React.createElement("div", __assign({
+    className: className
+  }, otherProps), children));
 };
 var TableRow = function (_a) {
-    var children = _a.children, classNameOverride = _a.classNameOverride, otherProps = __rest(_a, ["children", "classNameOverride"]);
-    return (React.createElement("div", __assign({ className: classnames(styles.row, classNameOverride), role: "row" }, otherProps), children));
+  var children = _a.children,
+    classNameOverride = _a.classNameOverride,
+    otherProps = __rest(_a, ["children", "classNameOverride"]);
+  return /*#__PURE__*/React.createElement("div", __assign({
+    className: classnames(styles.row, classNameOverride),
+    role: "row"
+  }, otherProps), children);
 };
 var TableRowCell = function (_a) {
-    var children = _a.children, width = _a.width, flex = _a.flex, href = _a.href, classNameOverride = _a.classNameOverride, otherProps = __rest(_a, ["children", "width", "flex", "href", "classNameOverride"]);
-    return href != null ? (React.createElement("a", __assign({ 
-        // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
-        role: "cell", style: {
-            width: ratioToPercent(width),
-            flex: flex,
-        }, className: classnames(styles.rowCell, classNameOverride), href: href }, otherProps), children)) : (React.createElement("div", __assign({ role: "cell", style: {
-            width: ratioToPercent(width),
-            flex: flex,
-        }, className: classnames(styles.rowCell, classNameOverride) }, otherProps), children));
+  var children = _a.children,
+    width = _a.width,
+    flex = _a.flex,
+    href = _a.href,
+    classNameOverride = _a.classNameOverride,
+    otherProps = __rest(_a, ["children", "width", "flex", "href", "classNameOverride"]);
+  return href != null ? ( /*#__PURE__*/React.createElement("a", __assign({
+    // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
+    role: "cell",
+    style: {
+      width: ratioToPercent(width),
+      flex: flex
+    },
+    className: classnames(styles.rowCell, classNameOverride),
+    href: href
+  }, otherProps), children)) : ( /*#__PURE__*/React.createElement("div", __assign({
+    role: "cell",
+    style: {
+      width: ratioToPercent(width),
+      flex: flex
+    },
+    className: classnames(styles.rowCell, classNameOverride)
+  }, otherProps), children));
 };
-
 export { TableCard, TableContainer, TableHeader, TableHeaderRowCell, TableRow, TableRowCell };

package/dist/esm/Table/Table.module.scss.mjs

@@ -1,3 +1,30 @@
-var styles = {"container":"Table-module_container__w-zFG","headerRowCell":"Table-module_headerRowCell__kW0YN","headerRowCellNoWrap":"Table-module_headerRowCellNoWrap__BSuzX","headerRowCellLabel":"Table-module_headerRowCellLabel__5v6m8","headerRowCellAlignCenter":"Table-module_headerRowCellAlignCenter__cobEI","headerRowCellAlignEnd":"Table-module_headerRowCellAlignEnd__dQOOQ","headerRowCellCheckbox":"Table-module_headerRowCellCheckbox__CdMiY","headerRowCellTooltip":"Table-module_headerRowCellTooltip__uzbpY","headerRowCellButton":"Table-module_headerRowCellButton__uikM7","headerRowCellButtonReversed":"Table-module_headerRowCellButtonReversed__uk87N","headerRowCellNoButton":"Table-module_headerRowCellNoButton__dqf1B","headerRowCellLabelAndIcons":"Table-module_headerRowCellLabelAndIcons__OCCVi","headerRowCellTooltipIcon":"Table-module_headerRowCellTooltipIcon__X0ETJ","headerRowCellIcon":"Table-module_headerRowCellIcon__gB3zI","headerRowCellActive":"Table-module_headerRowCellActive__wshmg","card":"Table-module_card__RGyjC","well":"Table-module_well__xQmO5","row":"Table-module_row__GYSl1","popout":"Table-module_popout__PeAVV","expanded":"Table-module_expanded__dasr3","hasHoverState":"Table-module_hasHoverState__u5n3E","rowCell":"Table-module_rowCell__A5-2R","defaultSpacing":"Table-module_defaultSpacing__zq1Ci","dataVariant":"Table-module_dataVariant__vBOag","rowCellAlignCenter":"Table-module_rowCellAlignCenter__apkoC","rowCellAlignEnd":"Table-module_rowCellAlignEnd__qZfa1","whiteText":"Table-module_whiteText__4f-q5"};
-
+var styles = {
+  "container": "Table-module_container__w-zFG",
+  "headerRowCell": "Table-module_headerRowCell__kW0YN",
+  "headerRowCellNoWrap": "Table-module_headerRowCellNoWrap__BSuzX",
+  "headerRowCellLabel": "Table-module_headerRowCellLabel__5v6m8",
+  "headerRowCellAlignCenter": "Table-module_headerRowCellAlignCenter__cobEI",
+  "headerRowCellAlignEnd": "Table-module_headerRowCellAlignEnd__dQOOQ",
+  "headerRowCellCheckbox": "Table-module_headerRowCellCheckbox__CdMiY",
+  "headerRowCellTooltip": "Table-module_headerRowCellTooltip__uzbpY",
+  "headerRowCellButton": "Table-module_headerRowCellButton__uikM7",
+  "headerRowCellButtonReversed": "Table-module_headerRowCellButtonReversed__uk87N",
+  "headerRowCellNoButton": "Table-module_headerRowCellNoButton__dqf1B",
+  "headerRowCellLabelAndIcons": "Table-module_headerRowCellLabelAndIcons__OCCVi",
+  "headerRowCellTooltipIcon": "Table-module_headerRowCellTooltipIcon__X0ETJ",
+  "headerRowCellIcon": "Table-module_headerRowCellIcon__gB3zI",
+  "headerRowCellActive": "Table-module_headerRowCellActive__wshmg",
+  "card": "Table-module_card__RGyjC",
+  "well": "Table-module_well__xQmO5",
+  "row": "Table-module_row__GYSl1",
+  "popout": "Table-module_popout__PeAVV",
+  "expanded": "Table-module_expanded__dasr3",
+  "hasHoverState": "Table-module_hasHoverState__u5n3E",
+  "rowCell": "Table-module_rowCell__A5-2R",
+  "defaultSpacing": "Table-module_defaultSpacing__zq1Ci",
+  "dataVariant": "Table-module_dataVariant__vBOag",
+  "rowCellAlignCenter": "Table-module_rowCellAlignCenter__apkoC",
+  "rowCellAlignEnd": "Table-module_rowCellAlignEnd__qZfa1",
+  "whiteText": "Table-module_whiteText__4f-q5"
+};
 export { styles as default };