@carbon/ibm-products 2.42.1-canary.18 → 2.42.1-canary.21

package/es/components/Datagrid/useNestedRows.js

@@ -63,16 +63,21 @@ var useNestedRows = function useNestedRows(hooks) {
         }
       }];
     };
+    var getIndentation = function getIndentation(depth) {
+      return 32 * depth + 16;
+    }; // row indentation padding
     var getCellProps = function getCellProps(props, _ref3) {
       var cell = _ref3.cell,
         instance = _ref3.instance;
-      // reduce the "first cell"s width to compensate added (left) margin
+      // we add a dynamic -ve margin right only if the cell is resized below minimum width i.e 50px, else we set the width based on indentation at different levels
       var isFirstCell = instance.columns.findIndex(function (c) {
         return c.id === cell.column.id;
       }) === 0;
       return [props, {
         style: {
-          marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
+          marginRight: isFirstCell && cell.row.depth > 0 && parseInt(props.style.width, 10) <= getIndentation(cell.row.depth) + 50 // indentation padding + expander cell or empty cell width
+          ? "".concat(parseInt(props.style.width, 10) - (getIndentation(cell.row.depth) + 50), "px") : '',
+          width: isFirstCell && cell.row.depth > 0 ? parseInt(props.style.width, 10) - getIndentation(cell.row.depth) : props.style.width
         }
       }];
     };

package/es/components/Datagrid/utils/getAutoSizedColumnWidth.d.ts

@@ -1 +1,8 @@
-export function getAutoSizedColumnWidth(rows: Array<object>, accessor: string, headerText: string): number;
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { Row } from 'react-table';
+export declare const getAutoSizedColumnWidth: (rows: Array<Row<object>>, accessor: string, headerText: string) => number;

package/es/components/Datagrid/utils/getAutoSizedColumnWidth.js

@@ -14,13 +14,6 @@ import { toConsumableArray as _toConsumableArray } from '../../../_virtual/_roll
  * LICENSE file in the root directory of this source tree.
  */
 
-/**
- * Calculates the auto sized width of a column
- * @param {Array<object>} rows - The datagrid rows
- * @param {string} accessor - The accessor for the column
- * @param {string} headerText - The header text for the column
- */
-
 var getAutoSizedColumnWidth = function getAutoSizedColumnWidth(rows, accessor, headerText) {
   var maxWidth = 400;
   var minWidth = 58;

package/lib/components/Datagrid/useNestedRows.js

@@ -71,16 +71,21 @@ var useNestedRows = function useNestedRows(hooks) {
         }
       }];
     };
+    var getIndentation = function getIndentation(depth) {
+      return 32 * depth + 16;
+    }; // row indentation padding
     var getCellProps = function getCellProps(props, _ref3) {
       var cell = _ref3.cell,
         instance = _ref3.instance;
-      // reduce the "first cell"s width to compensate added (left) margin
+      // we add a dynamic -ve margin right only if the cell is resized below minimum width i.e 50px, else we set the width based on indentation at different levels
       var isFirstCell = instance.columns.findIndex(function (c) {
         return c.id === cell.column.id;
       }) === 0;
       return [props, {
         style: {
-          marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
+          marginRight: isFirstCell && cell.row.depth > 0 && parseInt(props.style.width, 10) <= getIndentation(cell.row.depth) + 50 // indentation padding + expander cell or empty cell width
+          ? "".concat(parseInt(props.style.width, 10) - (getIndentation(cell.row.depth) + 50), "px") : '',
+          width: isFirstCell && cell.row.depth > 0 ? parseInt(props.style.width, 10) - getIndentation(cell.row.depth) : props.style.width
         }
       }];
     };

package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.d.ts

@@ -1 +1,8 @@
-export function getAutoSizedColumnWidth(rows: Array<object>, accessor: string, headerText: string): number;
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { Row } from 'react-table';
+export declare const getAutoSizedColumnWidth: (rows: Array<Row<object>>, accessor: string, headerText: string) => number;

package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.js

@@ -18,13 +18,6 @@ var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHel
  * LICENSE file in the root directory of this source tree.
  */
 
-/**
- * Calculates the auto sized width of a column
- * @param {Array<object>} rows - The datagrid rows
- * @param {string} accessor - The accessor for the column
- * @param {string} headerText - The header text for the column
- */
-
 var getAutoSizedColumnWidth = function getAutoSizedColumnWidth(rows, accessor, headerText) {
   var maxWidth = 400;
   var minWidth = 58;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.42.1-canary.18+07b412455",
+  "version": "2.42.1-canary.21+608e9b187",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -121,5 +121,5 @@
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
   },
-  "gitHead": "07b4124551093f8dc2f4db978201feecdace2e22"
+  "gitHead": "608e9b187c9de9f53094272bbefd0e2780b5cfeb"
 }