carbon-addons-iot-react 5.15.1 → 5.15.2

package/es/components/Table/TableHead/TableHead.js

@@ -1,4 +1,3 @@
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import debounce from '../../../node_modules/lodash-es/debounce.js';
@@ -272,21 +271,27 @@ var TableHead = function TableHead(_ref) {
   };
   var onManualColumnResize = function onManualColumnResize(modifiedColumnWidths) {
     if (percentageMode) {
-      var modifiedColumns = _toConsumableArray(columns);
-      Object.keys(modifiedColumns).forEach(function (key) {
-        if (modifiedColumns[key].hasOwnProperty('width')) {
-          delete modifiedColumns[key].width;
-        }
-      });
+      // Measure current rendered widths BEFORE switching to pixel mode
+      // This prevents unused space by preserving actual column widths
+      var measuredWidths = measureColumnWidths();
 
-      // while Resizing setting all column width to default DEFAULT_COLUMN_WIDTH 150px
-      var columnPropInlcudingWidths = addMissingColumnWidths({
-        ordering: ordering,
-        columns: modifiedColumns,
-        currentColumnWidths: {}
+      // Convert measured widths directly to column format with pixel values
+      // This preserves the actual rendered widths instead of using defaults
+      var columnsWithMeasuredWidths = columns.map(function (col) {
+        var measured = measuredWidths.find(function (m) {
+          return m.id === col.id;
+        });
+        return _objectSpread(_objectSpread({}, col), {}, {
+          width: measured ? "".concat(measured.width, "px") : col.width
+        });
       });
-      var newColumnWidths = createNewWidthsMap(ordering, columnPropInlcudingWidths);
-      setCurrentColumnWidths(newColumnWidths);
+
+      // Create width map from columns with measured values, then apply user's resize
+      var newColumnWidths = createNewWidthsMap(ordering, columnsWithMeasuredWidths, modifiedColumnWidths);
+
+      // Update both state and notify parent component
+      // This ensures horizontal scrollbar appears if total width exceeds container
+      updateColumnWidths(newColumnWidths);
       setPercentageMode(false);
     } else {
       var _newColumnWidths = createNewWidthsMap(ordering, currentColumnWidths, modifiedColumnWidths);

package/lib/components/Table/TableHead/TableHead.js

@@ -1,6 +1,5 @@
 'use strict';
 
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var debounce = require('../../../node_modules/lodash-es/debounce.js');
@@ -49,7 +48,6 @@ var iconsReact = require('@carbon/icons-react');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var _toConsumableArray__default = /*#__PURE__*/_interopDefault(_toConsumableArray);
 var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
 var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
 var React__default = /*#__PURE__*/_interopDefault(React);
@@ -284,21 +282,27 @@ var TableHead = function TableHead(_ref) {
   };
   var onManualColumnResize = function onManualColumnResize(modifiedColumnWidths) {
     if (percentageMode) {
-      var modifiedColumns = _toConsumableArray__default.default(columns);
-      Object.keys(modifiedColumns).forEach(function (key) {
-        if (modifiedColumns[key].hasOwnProperty('width')) {
-          delete modifiedColumns[key].width;
-        }
-      });
+      // Measure current rendered widths BEFORE switching to pixel mode
+      // This prevents unused space by preserving actual column widths
+      var measuredWidths = measureColumnWidths();
 
-      // while Resizing setting all column width to default DEFAULT_COLUMN_WIDTH 150px
-      var columnPropInlcudingWidths = columnWidthUtilityFunctions.addMissingColumnWidths({
-        ordering: ordering,
-        columns: modifiedColumns,
-        currentColumnWidths: {}
+      // Convert measured widths directly to column format with pixel values
+      // This preserves the actual rendered widths instead of using defaults
+      var columnsWithMeasuredWidths = columns.map(function (col) {
+        var measured = measuredWidths.find(function (m) {
+          return m.id === col.id;
+        });
+        return _objectSpread(_objectSpread({}, col), {}, {
+          width: measured ? "".concat(measured.width, "px") : col.width
+        });
       });
-      var newColumnWidths = columnWidthUtilityFunctions.createNewWidthsMap(ordering, columnPropInlcudingWidths);
-      setCurrentColumnWidths(newColumnWidths);
+
+      // Create width map from columns with measured values, then apply user's resize
+      var newColumnWidths = columnWidthUtilityFunctions.createNewWidthsMap(ordering, columnsWithMeasuredWidths, modifiedColumnWidths);
+
+      // Update both state and notify parent component
+      // This ensures horizontal scrollbar appears if total width exceeds container
+      updateColumnWidths(newColumnWidths);
       setPercentageMode(false);
     } else {
       var _newColumnWidths = columnWidthUtilityFunctions.createNewWidthsMap(ordering, currentColumnWidths, modifiedColumnWidths);

package/package.json

@@ -353,7 +353,7 @@
     "whatwg-fetch": "^3.0.0"
   },
   "sideEffects": false,
-  "version": "5.15.1",
+  "version": "5.15.2",
   "resolutions": {
     "chokidar": "3.3.1",
     "react-grid-layout": "1.2.2",

package/umd/carbon-addons-iot-react.js

@@ -234295,21 +234295,27 @@ ${formatRule(Codicon.menuSubmenu)}
     };
     var onManualColumnResize = function onManualColumnResize(modifiedColumnWidths) {
       if (percentageMode) {
-        var modifiedColumns = _toConsumableArray$2(columns);
-        Object.keys(modifiedColumns).forEach(function (key) {
-          if (modifiedColumns[key].hasOwnProperty('width')) {
-            delete modifiedColumns[key].width;
-          }
-        });
+        // Measure current rendered widths BEFORE switching to pixel mode
+        // This prevents unused space by preserving actual column widths
+        var measuredWidths = measureColumnWidths();
 
-        // while Resizing setting all column width to default DEFAULT_COLUMN_WIDTH 150px
-        var columnPropInlcudingWidths = addMissingColumnWidths({
-          ordering: ordering,
-          columns: modifiedColumns,
-          currentColumnWidths: {}
+        // Convert measured widths directly to column format with pixel values
+        // This preserves the actual rendered widths instead of using defaults
+        var columnsWithMeasuredWidths = columns.map(function (col) {
+          var measured = measuredWidths.find(function (m) {
+            return m.id === col.id;
+          });
+          return _objectSpread$1R(_objectSpread$1R({}, col), {}, {
+            width: measured ? "".concat(measured.width, "px") : col.width
+          });
         });
-        var newColumnWidths = createNewWidthsMap(ordering, columnPropInlcudingWidths);
-        setCurrentColumnWidths(newColumnWidths);
+
+        // Create width map from columns with measured values, then apply user's resize
+        var newColumnWidths = createNewWidthsMap(ordering, columnsWithMeasuredWidths, modifiedColumnWidths);
+
+        // Update both state and notify parent component
+        // This ensures horizontal scrollbar appears if total width exceeds container
+        updateColumnWidths(newColumnWidths);
         setPercentageMode(false);
       } else {
         var _newColumnWidths = createNewWidthsMap(ordering, currentColumnWidths, modifiedColumnWidths);