@hitachivantara/uikit-react-core 5.82.4 → 5.83.1

package/dist/cjs/Input/Input.cjs

@@ -11,6 +11,7 @@ const useControlled = require("../hooks/useControlled.cjs");
 const useIsMounted = require("../hooks/useIsMounted.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
+const generic = require("../types/generic.cjs");
 const keyboardUtils = require("../utils/keyboardUtils.cjs");
 const setId = require("../utils/setId.cjs");
 const Input_styles = require("./Input.styles.cjs");
@@ -46,7 +47,7 @@ const changeInputValue = (input, value = "") => {
   setInputValue?.call(input, value);
   input?.dispatchEvent(event);
 };
-const HvInput = React.forwardRef(function HvInput2(props, ref) {
+const HvInput = generic.fixedForwardRef(function HvInput2(props, ref) {
   const {
     classes: classesProp,
     className,
@@ -123,7 +124,7 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
   const performValidation = React.useCallback(() => {
     const inputValidity = validations.validateInput(
       inputRef.current,
-      value,
+      String(value),
       required,
       minCharQuantity,
       maxCharQuantity,
@@ -209,12 +210,12 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
     if (eventTargetIsInsideContainer(suggestionsRef.current, event)) return;
     setFocused(false);
     const inputValidity = performValidation();
-    onBlur?.(event, value, inputValidity);
+    onBlur?.(event, String(value), inputValidity);
   };
   const onFocusHandler = (event) => {
     setFocused(true);
     setValidationState(utils$1.validationStates.standBy);
-    onFocus?.(event, value);
+    onFocus?.(event, String(value));
   };
   const getSuggestions = (li) => {
     const listEl = document.getElementById(
@@ -235,9 +236,9 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
       const li = getSuggestions(0);
       li?.focus();
     } else if (keyboardUtils.isKey(event, "Enter")) {
-      onEnter?.(event, value);
+      onEnter?.(event, String(value));
     }
-    onKeyDown?.(event, value);
+    onKeyDown?.(event, String(value));
   };
   const onContainerBlurHandler = (event) => {
     if (event.relatedTarget) {
@@ -290,7 +291,7 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
   ]);
   const handleSearch = React.useCallback(
     (event) => {
-      onEnter?.(event, value);
+      onEnter?.(event, String(value));
     },
     [onEnter, value]
   );
@@ -413,6 +414,7 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
           hasLabel && /* @__PURE__ */ jsxRuntime.jsx(
             Label.HvLabel,
             {
+              showGutter: true,
               id: setId.setId(elementId, "label"),
               className: classes.label,
               htmlFor: setId.setId(elementId, "input"),
@@ -466,7 +468,7 @@ const HvInput = React.forwardRef(function HvInput2(props, ref) {
               onFocus: (event) => {
                 inputProps.onFocus?.(event);
                 if (canShowSuggestions && suggestOnFocus) {
-                  suggestionHandler(value);
+                  suggestionHandler(String(value));
                 }
               },
               onClick: (event) => {

package/dist/cjs/Input/Input.styles.cjs

@@ -7,7 +7,7 @@ require("../FormElement/Suggestions/Suggestions.cjs");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvInput", {
   root: { display: "block" },
   labelContainer: { display: "flex", alignItems: "flex-start" },
-  label: { paddingBottom: "6px", display: "block" },
+  label: {},
   description: {},
   adornmentsBox: {
     display: "flex",

package/dist/cjs/RadioGroup/RadioGroup.cjs

@@ -117,6 +117,7 @@ const HvRadioGroup = React.forwardRef(
           label && /* @__PURE__ */ jsxRuntime.jsx(
             Label.HvLabel,
             {
+              showGutter: true,
               id: setId.setId(elementId, "label"),
               label,
               className: classes.label

package/dist/cjs/RadioGroup/RadioGroup.styles.cjs

@@ -9,7 +9,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvRadioGrou
     overflowClipMargin: 4,
     verticalAlign: "top"
   },
-  label: { marginBottom: uikitStyles.theme.space.xs },
+  label: {},
   group: { display: "flex" },
   vertical: {
     flexDirection: "column",

package/dist/cjs/Select/Option.cjs

@@ -42,8 +42,7 @@ const HvOption = generic.fixedForwardRef(function HvOption2(props, ref) {
       className: cx(classes.root, className, {
         [classes.highlighted]: highlighted
       }),
-      ...getRootProps(),
-      ...others,
+      ...getRootProps(others),
       children
     }
   );

package/dist/cjs/Select/Select.cjs

@@ -11,6 +11,7 @@ const useUniqueId = require("../hooks/useUniqueId.cjs");
 const generic = require("../types/generic.cjs");
 const document = require("../utils/document.cjs");
 const setId = require("../utils/setId.cjs");
+const Option = require("./Option.cjs");
 const Select_styles = require("./Select.styles.cjs");
 const FormElement = require("../FormElement/FormElement.cjs");
 const Label = require("../FormElement/Label/Label.cjs");
@@ -27,9 +28,12 @@ function defaultRenderValue(options) {
   return options?.label ?? null;
 }
 const mergeIds = (...ids) => clsx.clsx(ids) || void 0;
+function renderOptions(options) {
+  return options?.map((option) => /* @__PURE__ */ jsxRuntime.jsx(Option.HvOption, { ...option, children: option.label }, option.value));
+}
 const HvSelect = generic.fixedForwardRef(function HvSelect2(props, ref) {
   const {
-    children,
+    children: childrenProp,
     classes: classesProp,
     className,
     id: idProp,
@@ -118,6 +122,7 @@ const HvSelect = generic.fixedForwardRef(function HvSelect2(props, ref) {
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const isInvalid = validationState === "invalid";
   const actualValue = multiple ? value.map((v) => getOptionMetadata(v)).filter((v) => v !== void 0) : getOptionMetadata(value) ?? null;
+  const children = childrenProp ?? renderOptions(optionsProp);
   const isOpen = open && !!children;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     FormElement.HvFormElement,
@@ -137,6 +142,7 @@ const HvSelect = generic.fixedForwardRef(function HvSelect2(props, ref) {
           label && /* @__PURE__ */ jsxRuntime.jsx(
             Label.HvLabel,
             {
+              showGutter: true,
               id: labelId,
               htmlFor: id,
               label,

package/dist/cjs/Select/Select.styles.cjs

@@ -18,10 +18,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSelect",
     display: "flex",
     alignItems: "flex-start"
   },
-  label: {
-    display: "block",
-    paddingBottom: 6
-  },
+  label: {},
   description: {},
   select: {},
   popper: {

package/dist/cjs/SelectionList/SelectionList.cjs

@@ -169,6 +169,7 @@ const HvSelectionList = React.forwardRef(function HvSelectionList2(props, ref) {
         label && /* @__PURE__ */ jsxRuntime.jsx(
           Label.HvLabel,
           {
+            showGutter: true,
             id: setId.setId(elementId, "label"),
             label,
             className: classes.label

package/dist/cjs/SelectionList/SelectionList.styles.cjs

@@ -12,7 +12,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSelection
     width: "100%",
     paddingBottom: uikitStyles.theme.space.xs
   },
-  label: { marginBottom: uikitStyles.theme.space.xs, float: "left" },
+  label: {},
   description: { float: "left" },
   horizontal: {
     flexDirection: "row",

package/dist/cjs/Slider/utils.cjs

@@ -28,7 +28,7 @@ const knobsPositionsToKnobsValues = (knobPositions, stepValue, minPointValue) =>
   return knobsValues;
 };
 const calculateStepValue = (maxPointValue, minPointValue, divisionQuantity) => Math.abs(maxPointValue - minPointValue) / divisionQuantity;
-const createMark = (markProperties, markstep, divisionQuantity, minPointValue, maxPointValue, stepValue, markDigits, disabled, formatMark = (mark) => mark) => {
+const createMark = (markProperties, markStep, divisionQuantity, minPointValue, maxPointValue, stepValue, markDigits, disabled, formatMark = (mark) => mark) => {
   const marks = {};
   const values = [];
   if (markProperties.length > 0) {
@@ -48,13 +48,13 @@ const createMark = (markProperties, markstep, divisionQuantity, minPointValue, m
       }
     });
   } else {
-    const roundedMarkStep = Math.floor(markstep);
+    const roundedMarkStep = Math.max(1, Math.floor(markStep));
     for (let index = 0; index <= divisionQuantity; index += roundedMarkStep) {
       let labelValue = knobsPositionToScaledValue(
         index,
         minPointValue,
         stepValue
-      ).toFixed(markDigits);
+      ).toFixed(Math.max(0, Math.min(8, markDigits)));
       values.push(labelValue);
       labelValue = formatMark?.(labelValue) || labelValue;
       marks[index] = disabled ? {

package/dist/cjs/Switch/Switch.cjs

@@ -82,6 +82,7 @@ const HvSwitch = React.forwardRef(
           label && /* @__PURE__ */ jsxRuntime.jsx(
             Label.HvLabel,
             {
+              showGutter: true,
               id: setId.setId(elementId, "label"),
               htmlFor: setId.setId(elementId, "input"),
               label,

package/dist/cjs/Switch/Switch.styles.cjs

@@ -8,7 +8,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvSwitch",
     flexDirection: "column",
     alignItems: "flex-start"
   },
-  label: { marginBottom: uikitStyles.theme.space.xs },
+  label: {},
   error: {},
   switchContainer: {
     height: "32px",

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

@@ -2,7 +2,22 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const utils = require("../utils/utils.cjs");
+const getBorderStyles = (color, rowBorderRadius) => {
+  return {
+    "& td": {
+      borderTop: `1px solid ${color}`,
+      borderBottom: `1px solid ${color}`
+    },
+    "& td:first-of-type": {
+      borderLeft: `1px solid ${color}`,
+      borderRadius: `${rowBorderRadius} 0 0 ${rowBorderRadius}`
+    },
+    "& td:last-of-type": {
+      borderRight: `1px solid ${color}`,
+      borderRadius: `0 ${rowBorderRadius} ${rowBorderRadius} 0`
+    }
+  };
+};
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTableRow", {
   /** Styles applied to the component root class. */
   root: {
@@ -48,16 +63,16 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTableRow"
     // only applied on custom `display`
     marginBottom: uikitStyles.theme.space.xs,
     borderRadius: uikitStyles.theme.radii.round,
-    ...utils.getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round),
+    ...getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round),
     backgroundColor: uikitStyles.theme.colors.atmo1,
     "&$selected": {
-      ...utils.getBorderStyles(uikitStyles.theme.colors.secondary, uikitStyles.theme.radii.round),
+      ...getBorderStyles(uikitStyles.theme.colors.secondary, uikitStyles.theme.radii.round),
       "&:hover": {
-        ...utils.getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round)
+        ...getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round)
       }
     },
     "&:hover": {
-      ...utils.getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round)
+      ...getBorderStyles(uikitStyles.theme.colors.atmo4, uikitStyles.theme.radii.round)
     },
     "&.HvIsFocused": {
       borderRadius: uikitStyles.theme.radii.round

package/dist/cjs/Table/hooks/{useBulkActions.cjs → useHvBulkActions.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const reactTable = require("react-table");
 const useInstanceHook = (instance) => {
@@ -64,7 +64,7 @@ const useInstanceHook = (instance) => {
     subtractivePageBulkDeselection: !!instance.subtractivePageBulkDeselection
   });
 };
-const defaultgetHvBulkActionsProps = (props, { instance }) => {
+const defaultGetHvBulkActionsProps = (props, { instance }) => {
   const {
     rows,
     initialRows,
@@ -86,10 +86,9 @@ const defaultgetHvBulkActionsProps = (props, { instance }) => {
   };
   return [props, nextProps];
 };
-const useBulkActions = (hooks) => {
-  hooks.getHvBulkActionsProps = [defaultgetHvBulkActionsProps];
+const useHvBulkActions = (hooks) => {
+  hooks.getHvBulkActionsProps = [defaultGetHvBulkActionsProps];
   hooks.useInstance.push(useInstanceHook);
 };
-useBulkActions.pluginName = "useHvBulkActions";
-exports.default = useBulkActions;
-exports.defaultgetHvBulkActionsProps = defaultgetHvBulkActionsProps;
+useHvBulkActions.pluginName = "useHvBulkActions";
+exports.useHvBulkActions = useHvBulkActions;

package/dist/cjs/Table/hooks/{useFilters.cjs → useHvFilters.cjs}

@@ -1,6 +1,6 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const useHvFilters = reactTable.useFilters.bind({});
 useHvFilters.pluginName = "useHvFilters";
-exports.default = useHvFilters;
+exports.useHvFilters = useHvFilters;

package/dist/cjs/Table/hooks/{useGlobalFilter.cjs → useHvGlobalFilter.cjs}

@@ -1,6 +1,6 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const useHvGlobalFilter = reactTable.useGlobalFilter.bind({});
 useHvGlobalFilter.pluginName = "useHvGlobalFilter";
-exports.default = useHvGlobalFilter;
+exports.useHvGlobalFilter = useHvGlobalFilter;

package/dist/cjs/Table/hooks/{useHeaderGroups.cjs → useHvHeaderGroups.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const replaceHeaderPlaceholders = (headerGroups) => {
   const [headerGroup] = headerGroups;
   const hasPlaceholderHeaders = headerGroup.headers.some(
@@ -80,11 +80,11 @@ const useInstanceHook = (instance) => {
     replaceHeaderPlaceholders(instance.headerGroups);
   }
 };
-const useHeaderGroups = (hooks) => {
+const useHvHeaderGroups = (hooks) => {
   hooks.visibleColumns.push(visibleColumnsHook);
   hooks.useInstance.push(useInstanceHook);
   hooks.getHeaderProps.push(getHeaderPropsHook);
   hooks.getCellProps.push(getCellPropsHook);
 };
-useHeaderGroups.pluginName = "useHvHeaderGroups";
-exports.default = useHeaderGroups;
+useHvHeaderGroups.pluginName = "useHvHeaderGroups";
+exports.useHvHeaderGroups = useHvHeaderGroups;

package/dist/cjs/Table/hooks/{usePagination.cjs → useHvPagination.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const useInstanceHook = (instance) => {
   reactTable.ensurePluginOrder(
@@ -47,10 +47,10 @@ const defaultGetHvPaginationProps = (props, { instance }) => {
   };
   return [props, nextProps];
 };
-const usePagination = (hooks) => {
+const useHvPagination = (hooks) => {
   hooks.getHvPaginationProps = [defaultGetHvPaginationProps];
   hooks.useInstance.push(useInstanceHook);
 };
-usePagination.pluginName = "useHvPagination";
-exports.default = usePagination;
+useHvPagination.pluginName = "useHvPagination";
 exports.defaultGetHvPaginationProps = defaultGetHvPaginationProps;
+exports.useHvPagination = useHvPagination;

package/dist/cjs/Table/hooks/{useResizeColumns.cjs → useHvResizeColumns.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const getHeaderPropsHook = (props, { column }) => {
   const resizerProps = column.getResizerProps?.() || {};
@@ -28,10 +28,10 @@ const useInstanceHook = (instance) => {
     "useHvResizeColumns"
   );
 };
-const useResizeColumns = (hooks) => {
+const useHvResizeColumns = (hooks) => {
   hooks.getHeaderProps.push(getHeaderPropsHook);
   hooks.getCellProps.push(getCellPropsHook);
   hooks.useInstance.push(useInstanceHook);
 };
-useResizeColumns.pluginName = "useHvResizeColumns";
-exports.default = useResizeColumns;
+useHvResizeColumns.pluginName = "useHvResizeColumns";
+exports.useHvResizeColumns = useHvResizeColumns;

package/dist/cjs/Table/hooks/{useRowExpand.cjs → useHvRowExpand.cjs}

@@ -1,8 +1,9 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useLabels = require("../../hooks/useLabels.cjs");
+const DefaultCell = require("../renderers/DefaultCell.cjs");
 const Button = require("../../Button/Button.cjs");
 const Typography = require("../../Typography/Typography.cjs");
 const DEFAULT_LABELS = {
@@ -39,7 +40,7 @@ const visibleColumnsHook = (columns, { instance }) => {
   );
   if (firstDataColumnIndex !== -1) {
     const firstDataColumn = columns[firstDataColumnIndex];
-    if (firstDataColumn.Cell == null) {
+    if (firstDataColumn.Cell == null || firstDataColumn.Cell !== DefaultCell.DefaultCell) {
       firstDataColumn.Cell = CellWithExpandButton;
       firstDataColumn.variant = "expand";
       return columns;
@@ -68,10 +69,10 @@ const getRowPropsHook = (props, { row }) => {
   };
   return [props, nextProps];
 };
-const useRowExpand = (hooks) => {
+const useHvRowExpand = (hooks) => {
   hooks.visibleColumns.push(visibleColumnsHook);
   hooks.getRowProps.push(getRowPropsHook);
 };
-useRowExpand.pluginName = "useHvRowExpand";
+useHvRowExpand.pluginName = "useHvRowExpand";
 exports.CellWithExpandButton = CellWithExpandButton;
-exports.default = useRowExpand;
+exports.useHvRowExpand = useHvRowExpand;

package/dist/cjs/Table/hooks/{useRowSelection.cjs → useHvRowSelection.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const reactTable = require("react-table");
@@ -425,7 +425,7 @@ function prepareRow(row, { instance }) {
   row.toggleRowLockedSelection = (set) => instance.toggleRowLockedSelection(row.id, set);
   row.isSelectionLocked = instance.state?.lockedSelectionRowIds?.[row.id] || false;
 }
-const useRowSelection = (hooks) => {
+const useHvRowSelection = (hooks) => {
   hooks.visibleColumns.push(visibleColumnsHook);
   hooks.getRowProps.push(getRowPropsHook);
   hooks.getHeaderProps.push(getHeaderPropsHook);
@@ -438,12 +438,8 @@ const useRowSelection = (hooks) => {
   hooks.useInstance.push(useInstance);
   hooks.prepareRow.push(prepareRow);
 };
-useRowSelection.pluginName = "useHvRowSelection";
-exports.CellWithCheckBox = CellWithCheckBox;
-exports.default = useRowSelection;
+useHvRowSelection.pluginName = "useHvRowSelection";
 exports.defaultGetToggleAllPageRowsSelectedProps = defaultGetToggleAllPageRowsSelectedProps;
 exports.defaultGetToggleAllRowsSelectedProps = defaultGetToggleAllRowsSelectedProps;
 exports.defaultGetToggleRowSelectedProps = defaultGetToggleRowSelectedProps;
-exports.prepareRow = prepareRow;
-exports.reducer = reducer;
-exports.useInstance = useInstance;
+exports.useHvRowSelection = useHvRowSelection;

package/dist/cjs/Table/hooks/{useRowState.cjs → useHvRowState.cjs}

@@ -1,6 +1,6 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const useHvRowState = reactTable.useRowState.bind({});
 useHvRowState.pluginName = "useHvRowState";
-exports.default = useHvRowState;
+exports.useHvRowState = useHvRowState;

package/dist/cjs/Table/hooks/{useSortBy.cjs → useHvSortBy.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const getHeaderPropsHook = (props, { instance, column }) => {
   const { isMultiSortEvent = (e) => e.shiftKey } = instance;
@@ -27,10 +27,10 @@ const getCellPropsHook = (props, { cell }) => {
 const useInstanceHook = (instance) => {
   reactTable.ensurePluginOrder(instance.plugins, ["useSortBy"], "useHvSortBy");
 };
-const useSortBy = (hooks) => {
+const useHvSortBy = (hooks) => {
   hooks.getHeaderProps.push(getHeaderPropsHook);
   hooks.getCellProps.push(getCellPropsHook);
   hooks.useInstance.push(useInstanceHook);
 };
-useSortBy.pluginName = "useHvSortBy";
-exports.default = useSortBy;
+useHvSortBy.pluginName = "useHvSortBy";
+exports.useHvSortBy = useHvSortBy;

package/dist/cjs/Table/hooks/{useSticky.cjs → useHvSticky.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const reactTable = require("react-table");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const isSticky = (value) => /left|right/i.test(value);
@@ -155,7 +155,7 @@ const getCellPropsHook = (props, { instance, cell }) => {
   const nextProps = instance.hasStickyColumns ? getCellProps(cell.column, false) : {};
   return [props, nextProps];
 };
-const useSticky = (hooks) => {
+const useHvTableSticky = (hooks) => {
   hooks.visibleColumns.push(visibleColumnsHook);
   hooks.useInstance.push(useInstanceHook);
   hooks.getTableProps.push(getTablePropsHook);
@@ -165,7 +165,5 @@ const useSticky = (hooks) => {
   hooks.getRowProps.push(getRowPropsHook);
   hooks.getCellProps.push(getCellPropsHook);
 };
-useSticky.pluginName = "useHvTableSticky";
-exports.default = useSticky;
-exports.getHeaderGroupPropsHook = getHeaderGroupPropsHook;
-exports.getTableHeadPropsHook = getTableHeadPropsHook;
+useHvTableSticky.pluginName = "useHvTableSticky";
+exports.useHvTableSticky = useHvTableSticky;

package/dist/cjs/Table/hooks/{useTable.cjs → useHvTable.cjs}

@@ -1,8 +1,9 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const reactTable = require("react-table");
-const useTableStyles = require("./useTableStyles.cjs");
+const DefaultCell = require("../renderers/DefaultCell.cjs");
+const useHvTableStyles = require("./useHvTableStyles.cjs");
 const toTitleCase = (str) => {
   return str.replace(/([^A-Z])([A-Z])/g, "$1 $2").replace(/[_-]+/g, " ").toLowerCase().replace(/(^\w|\b\w)/g, (m) => m.toUpperCase()).replace(/\s+/g, " ").trim();
 };
@@ -63,16 +64,17 @@ function useHvTable(options, ...plugins) {
     (plugin) => plugin.pluginName === "useHvTableStyles"
   );
   if (indexOfHvTableStylesPlugin === -1) {
-    plugins.push(useTableStyles.default);
+    plugins.push(useHvTableStyles.useHvTableStyles);
   }
   return reactTable.useTable(
     {
       data,
       columns,
+      defaultColumn: { Cell: DefaultCell.DefaultCell },
       ...others
     },
     useHvTableSetup,
     ...plugins
   );
 }
-exports.default = useHvTable;
+exports.useHvTable = useHvTable;

package/dist/cjs/Table/hooks/{useTableStyles.cjs → useHvTableStyles.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const getTablePropsHook = (props, { instance }) => {
   const nextProps = {
@@ -78,13 +78,12 @@ const getCellPropsHook = (props, { cell }) => {
   }
   return [props, nextProps];
 };
-const useTableStyles = (hooks) => {
+const useHvTableStyles = (hooks) => {
   hooks.getTableProps.push(getTablePropsHook);
   hooks.getHeaderProps.push(getHeaderFooterPropsHook);
   hooks.getFooterProps.push(getHeaderFooterPropsHook);
   hooks.getRowProps.push(getRowPropsHook);
   hooks.getCellProps.push(getCellPropsHook);
 };
-useTableStyles.pluginName = "useHvTableStyles";
-exports.default = useTableStyles;
-exports.getHeaderFooterPropsHook = getHeaderFooterPropsHook;
+useHvTableStyles.pluginName = "useHvTableStyles";
+exports.useHvTableStyles = useHvTableStyles;

package/dist/cjs/Table/renderers/{DateColumnCell/DateColumnCell.cjs → DateColumnCell.cjs}

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const dayjs = require("dayjs");
-const OverflowTooltip = require("../../../OverflowTooltip/OverflowTooltip.cjs");
+const OverflowTooltip = require("../../OverflowTooltip/OverflowTooltip.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const dayjs__default = /* @__PURE__ */ _interopDefault(dayjs);
 const HvDateColumnCell = ({

package/dist/cjs/Table/renderers/DefaultCell.cjs

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const EM_DASH = "—";
+const DefaultCell = ({
+  row,
+  value
+}) => {
+  switch (true) {
+    case row.subRows.length > 0:
+      return value;
+    case value instanceof Date:
+      return value.toISOString().slice(0, 10);
+    case typeof value === "object":
+      return value;
+    case (value == null || value === ""):
+      return EM_DASH;
+    default:
+      return String(value);
+  }
+};
+exports.DefaultCell = DefaultCell;

package/dist/cjs/Table/renderers/{DropdownColumnCell/DropdownColumnCell.cjs → DropdownColumnCell.cjs}

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const Dropdown = require("../../../Dropdown/Dropdown.cjs");
+const Dropdown = require("../../Dropdown/Dropdown.cjs");
 const HvDropdownColumnCell = ({
   dropdownProps,
   ...others