@homebound/beam 2.190.0 → 2.190.1

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

@@ -101,7 +101,7 @@ export interface GridTableProps<R extends Kinded, S, X> {
     activeRowId?: string;
     /**
      * Defines which cell in the table should be provided with an "active" styling.
-     * Expected format is `${row.kind}_${row.id}_${column.name}`.
+     * Expected format is `${row.kind}_${row.id}_${column.id}`.
      */
     activeCellId?: string;
 }

package/dist/components/Table/components/EditColumnsButton.js

@@ -21,17 +21,17 @@ function EditColumnsButton(props) {
             // Only include options that can be hidden and have the `name` property defined.
             if (!column.canHide)
                 return acc;
-            if (!column.name || column.name.length === 0) {
+            if (!column.id || column.id.length === 0) {
                 console.warn("Column is missing 'name' property required by the Edit Columns button", column);
                 return acc;
             }
             // Add current column as an option
-            return { ...acc, options: acc.options.concat({ label: column.name, value: column.name }) };
+            return { ...acc, options: acc.options.concat({ label: column.id, value: column.id }) };
         }, { options: [] });
     }, [allColumns]);
-    const selectedValues = selectedColumns.map((column) => column.name);
+    const selectedValues = selectedColumns.map((column) => column.id);
     const setSelectedValues = (0, react_1.useCallback)((values) => {
-        setSelectedColumns(allColumns.filter((column) => (column.canHide ? values.includes(column.name) : true)));
+        setSelectedColumns(allColumns.filter((column) => (column.canHide ? values.includes(column.id) : true)));
     }, [allColumns, setSelectedColumns]);
     return ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.OverlayTrigger, Object.assign({}, props, { menuTriggerProps: menuTriggerProps, state: state, buttonRef: buttonRef }, tid, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ css: {
                 ...Css_1.Css.bgWhite.py5.px3.maxwPx(380).bshBasic.$,

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

@@ -100,8 +100,8 @@ function RowImpl(props) {
                         : {}),
                 }
                 : {};
-            const cellId = `${row.kind}_${row.id}_${column.name}`;
-            const applyCellHighlight = cellHighlight && !!column.name && !isHeader && !isTotals;
+            const cellId = `${row.kind}_${row.id}_${column.id}`;
+            const applyCellHighlight = cellHighlight && !!column.id && !isHeader && !isTotals;
             const isCellActive = rowState.activeCellId === cellId;
             // Note that it seems expensive to calc a per-cell class name/CSS-in-JS output,
             // vs. setting global/table-wide CSS like `style.cellCss` on the root grid div with

package/dist/components/Table/hooks/useColumns.js

@@ -6,27 +6,27 @@ const react_1 = require("react");
 const useSessionStorage_1 = require("../../../hooks/useSessionStorage");
 function useColumns(tableColumns, maybeStorageKey) {
     const { selectedColumns, hideColumns } = tableColumns.reduce((acc, column) => {
-        // Only include options that can be hidden and have the `name` property defined.
-        if (!column.name || column.name.length === 0) {
-            console.warn("Column is missing 'name' property required by the Edit Columns button", column);
+        // Only include options that can be hidden and have the `id` property defined.
+        if (!column.id || column.id.length === 0) {
+            console.warn("Column is missing 'id' property required by the Edit Columns button", column);
             return acc;
         }
         // Add hide-able columns
         if (column.canHide) {
-            acc.hideColumns.push(column.name);
+            acc.hideColumns.push(column.id);
         }
         // Add selected columns
         if (!column.canHide || (column.canHide && column.initVisible)) {
-            acc.selectedColumns.push(column.name);
+            acc.selectedColumns.push(column.id);
         }
         return { ...acc };
     }, { selectedColumns: [], hideColumns: [] });
     const storageKey = maybeStorageKey !== null && maybeStorageKey !== void 0 ? maybeStorageKey : (0, change_case_1.camelCase)(hideColumns.map((c) => c).join(""));
     const [storageNames, setStorageNames] = (0, useSessionStorage_1.useSessionStorage)(storageKey, selectedColumns);
-    const storageColumns = storageNames && storageNames.map((sc) => tableColumns.find((column) => column.name === sc));
+    const storageColumns = storageNames && storageNames.map((sc) => tableColumns.find((column) => column.id === sc));
     const [columns, setColumns] = (0, react_1.useState)(storageColumns);
     (0, react_1.useEffect)(() => {
-        setStorageNames(columns.map((column) => column.name));
+        setStorageNames(columns.map((column) => column.id));
     }, [columns]);
     return [columns, setColumns];
 }

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

@@ -64,8 +64,8 @@ export declare type GridColumn<R extends Kinded, S = {}> = {
     wrapAction?: false;
     /** Used as a signal to defer adding the 'indent' styling */
     isAction?: true;
-    /** Column name that will be used to generate an unique identifier for every row cell */
-    name?: string;
+    /** Column id that will be used to generate an unique identifier for every row cell */
+    id?: string;
     /** Flag that will allow to know which columns are hide-able */
     canHide?: boolean;
     /** Flag that will allow to know which hide-able columns are visible on initial load */

package/package.json

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