@homebound/beam 2.247.0 → 2.248.0

package/dist/components/Table/components/Row.js

@@ -72,11 +72,27 @@ function RowImpl(props) {
     let currentExpandedColumnCount = 0;
     let firstContentColumnStylesApplied = false;
     let minStickyLeftOffset = 0;
+    let expandColumnHidden = false;
     return ((0, jsx_runtime_1.jsx)(RowTag, { css: rowCss, ...others, "data-gridrow": true, ...getCount(row.id), children: columns.map((column, columnIndex) => {
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d, _e;
+            // If the expandable column was hidden, then we need to look at the previous column to format the `expandHeader` and 'header' kinds correctly.
+            const maybeExpandedColumn = expandColumnHidden ? columns[columnIndex - 1] : column;
+            // Figure out if this column should be considered 'expanded' or not. If the column is hidden on expand, then we need to look at the previous column to see if it's expanded.
+            const isExpanded = tableState.expandedColumnIds.includes(maybeExpandedColumn.id);
+            // If the column is hidden on expand, we don't want to render it. We'll flag that it was hidden, so on the next column we can render this column's "expandHeader" property.
+            if (column.hideOnExpand && isExpanded) {
+                expandColumnHidden = true;
+                return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
+            }
             // Need to keep track of the expanded columns so we can add borders as expected for the header rows
-            const isExpanded = tableState.expandedColumnIds.includes(column.id);
-            const numExpandedColumns = isExpanded ? (_b = (_a = tableState.getExpandedColumns(column)) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0 : 0;
+            const numExpandedColumns = isExpanded
+                ? ((_a = tableState.getExpandedColumns(maybeExpandedColumn)) === null || _a === void 0 ? void 0 : _a.length)
+                    ? // Subtract 1 if the column is hidden on expand, since we're not rendering it.
+                        tableState.getExpandedColumns(maybeExpandedColumn).length - (maybeExpandedColumn.hideOnExpand ? 1 : 0)
+                    : 0
+                : 0;
+            // If we're rendering the Expandable Header row, then we might need to render the previous column's `expandHeader` property in the case where the column is hidden on expand.
+            column = isExpandableHeader ? maybeExpandedColumn : column;
             const { wrapAction = true, isAction = false } = column;
             const applyFirstContentColumnStyles = !isHeader && !isAction && !firstContentColumnStylesApplied;
             firstContentColumnStylesApplied || (firstContentColumnStylesApplied = applyFirstContentColumnStyles);
@@ -99,6 +115,8 @@ function RowImpl(props) {
                     currentExpandedColumnCount -= 1;
                 }
             }
+            // Reset the expandColumnHidden flag once done with logic based upon it.
+            expandColumnHidden = false;
             // Decrement colspan count and skip if greater than 1.
             if (currentColspan > 1) {
                 currentColspan -= 1;
@@ -122,7 +140,7 @@ function RowImpl(props) {
                 column.expandedWidth !== undefined;
             const content = (0, utils_1.toContent)(maybeContent, isHeader, canSortColumn, sortOn === "client", style, as, alignment, column, isExpandableHeader, isExpandable, minStickyLeftOffset);
             (0, sortRows_1.ensureClientSideSortValueIsSortable)(sortOn, isHeader || isTotals || isExpandableHeader, column, columnIndex, maybeContent);
-            const maybeSticky = (_c = (((0, utils_1.isGridCellContent)(maybeContent) && maybeContent.sticky) || column.sticky)) !== null && _c !== void 0 ? _c : undefined;
+            const maybeSticky = (_b = (((0, utils_1.isGridCellContent)(maybeContent) && maybeContent.sticky) || column.sticky)) !== null && _b !== void 0 ? _b : undefined;
             const maybeStickyColumnStyles = maybeSticky && columnSizes
                 ? {
                     ...Css_1.Css.sticky.z(utils_1.zIndices.stickyColumns).bgWhite.$,
@@ -177,13 +195,13 @@ function RowImpl(props) {
                     currentExpandedColumnCount === 0 &&
                     Css_1.Css.boxShadow(`inset -1px -1px 0 ${Css_1.Palette.Gray200}`).$),
                 // Or level-specific styling
-                ...(!isHeader && !isTotals && !isExpandableHeader && !!style.levels && ((_d = style.levels[level]) === null || _d === void 0 ? void 0 : _d.cellCss)),
+                ...(!isHeader && !isTotals && !isExpandableHeader && !!style.levels && ((_c = style.levels[level]) === null || _c === void 0 ? void 0 : _c.cellCss)),
                 // Level specific styling for the first content column
-                ...(applyFirstContentColumnStyles && !!style.levels && ((_e = style.levels[level]) === null || _e === void 0 ? void 0 : _e.firstContentColumn)),
+                ...(applyFirstContentColumnStyles && !!style.levels && ((_d = style.levels[level]) === null || _d === void 0 ? void 0 : _d.firstContentColumn)),
                 // The specific cell's css (if any from GridCellContent)
                 ...rowStyleCellCss,
                 // Apply active row styling for non-nested card styles.
-                ...(isActive ? Css_1.Css.bgColor((_f = style.activeBgColor) !== null && _f !== void 0 ? _f : Css_1.Palette.LightBlue50).$ : {}),
+                ...(isActive ? Css_1.Css.bgColor((_e = style.activeBgColor) !== null && _e !== void 0 ? _e : Css_1.Palette.LightBlue50).$ : {}),
                 // Add any cell specific style overrides
                 ...((0, utils_1.isGridCellContent)(maybeContent) && maybeContent.typeScale ? Css_1.Css[maybeContent.typeScale].$ : {}),
                 // And any cell specific css

package/dist/components/Table/types.d.ts

@@ -82,6 +82,8 @@ export type GridColumn<R extends Kinded> = {
     expandColumns?: GridColumn<R>[] | (() => Promise<GridColumn<R>[]>);
     /** Determines whether the group should initially be expanded on load of the table */
     initExpanded?: boolean;
+    /** Determines whether this column should be hidden when expanded (only the 'expandColumns' would show) */
+    hideOnExpand?: boolean;
 };
 export type GridColumnWithId<R extends Kinded> = GridColumn<R> & {
     id: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/beam",
-  "version": "2.247.0",
+  "version": "2.248.0",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",