@carbon/ibm-products 2.32.0 → 2.33.0

package/lib/components/DataSpreadsheet/DataSpreadsheet.js

@@ -128,20 +128,24 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     _useState18 = _rollupPluginBabelHelpers.slicedToArray(_useState17, 2),
     headerCellHoldActive = _useState18[0],
     setHeaderCellHoldActive = _useState18[1];
-  var _useState19 = React.useState(false),
+  var _useState19 = React.useState(null),
     _useState20 = _rollupPluginBabelHelpers.slicedToArray(_useState19, 2),
-    activeCellInsideSelectionArea = _useState20[0],
-    setActiveCellInsideSelectionArea = _useState20[1];
+    isActiveHeaderCellChanged = _useState20[0],
+    setIsActiveHeaderCellChanged = _useState20[1];
+  var _useState21 = React.useState(false),
+    _useState22 = _rollupPluginBabelHelpers.slicedToArray(_useState21, 2),
+    activeCellInsideSelectionArea = _useState22[0],
+    setActiveCellInsideSelectionArea = _useState22[1];
   var previousState = usePreviousValue.usePreviousValue({
     activeCellCoordinates: activeCellCoordinates,
     isEditing: isEditing
   });
   var cellSizeValue = getCellSize.getCellSize(cellSize);
   var cellEditorRef = React.useRef();
-  var _useState21 = React.useState(),
-    _useState22 = _rollupPluginBabelHelpers.slicedToArray(_useState21, 2),
-    activeCellContent = _useState22[0],
-    setActiveCellContent = _useState22[1];
+  var _useState23 = React.useState(),
+    _useState24 = _rollupPluginBabelHelpers.slicedToArray(_useState23, 2),
+    activeCellContent = _useState24[0],
+    setActiveCellContent = _useState24[1];
   var activeCellRef = React.useRef();
   var cellEditorRulerRef = React.useRef();
   var defaultColumn = React.useMemo(function () {
@@ -215,6 +219,9 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
       }
       if (activeCellCoordinates && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
         setActiveCellContent(null);
+        setIsActiveHeaderCellChanged(function (prev) {
+          return !prev;
+        });
       }
     }
   }, [activeCellCoordinates, previousState === null || previousState === void 0 ? void 0 : previousState.activeCellCoordinates, updateData, rows, isEditing, removeCellEditor, activeCellContent]);
@@ -225,23 +232,19 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
       addToHeader = _ref2$addToHeader === void 0 ? false : _ref2$addToHeader;
     var activeCellFullData = typeof (coords === null || coords === void 0 ? void 0 : coords.column) === 'number' && typeof (coords === null || coords === void 0 ? void 0 : coords.row) === 'number' ? rows[coords === null || coords === void 0 ? void 0 : coords.row].cells[coords === null || coords === void 0 ? void 0 : coords.column] : null;
     var activeCellValue = activeCellFullData ? Object.values(activeCellFullData.row.values)[coords === null || coords === void 0 ? void 0 : coords.column] : null;
-    var prevCoords = previousState === null || previousState === void 0 ? void 0 : previousState.activeCellCoordinates;
-    // Only create an active cell if the activeCellCoordinates have changed
-    if ((prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.row) !== (coords === null || coords === void 0 ? void 0 : coords.row) || (prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.column) !== (coords === null || coords === void 0 ? void 0 : coords.column)) {
-      createActiveCellFn.createActiveCellFn({
-        placementElement: placementElement,
-        coords: coords,
-        addToHeader: addToHeader,
-        contextRef: spreadsheetRef,
-        blockClass: blockClass,
-        onActiveCellChange: onActiveCellChange,
-        activeCellValue: activeCellValue,
-        activeCellRef: activeCellRef,
-        cellEditorRef: cellEditorRef,
-        defaultColumn: defaultColumn
-      });
-    }
-  }, [spreadsheetRef, rows, onActiveCellChange, previousState === null || previousState === void 0 ? void 0 : previousState.activeCellCoordinates, defaultColumn]);
+    createActiveCellFn.createActiveCellFn({
+      placementElement: placementElement,
+      coords: coords,
+      addToHeader: addToHeader,
+      contextRef: spreadsheetRef,
+      blockClass: blockClass,
+      onActiveCellChange: onActiveCellChange,
+      activeCellValue: activeCellValue,
+      activeCellRef: activeCellRef,
+      cellEditorRef: cellEditorRef,
+      defaultColumn: defaultColumn
+    });
+  }, [spreadsheetRef, rows, onActiveCellChange, defaultColumn]);
   useResetSpreadsheetFocus.useResetSpreadsheetFocus({
     focusedElement: focusedElement,
     removeActiveCell: removeActiveCell,
@@ -260,7 +263,9 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     spreadsheetRef: spreadsheetRef,
     activeCellCoordinates: activeCellCoordinates,
     containerHasFocus: containerHasFocus,
-    createActiveCell: createActiveCell
+    createActiveCell: createActiveCell,
+    activeCellContent: activeCellContent,
+    isActiveHeaderCellChanged: isActiveHeaderCellChanged
   });
   var handleInitialArrowPress = React.useCallback(function () {
     // If activeCellCoordinates is null then we need to set an initial value
@@ -308,10 +313,10 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
       spreadsheetRef: spreadsheetRef
     });
   }, [activeCellCoordinates, updateActiveCellCoordinates, spreadsheetRef, columns.length]);
-  var checkforReturnConditon = React.useCallback(function (key) {
+  var checkForReturnCondition = React.useCallback(function (key) {
     return isEditing || key === 'Meta' || key === 'Control';
   }, [isEditing]);
-  var handleArrowkeyPress = React.useCallback(function (arrowKey) {
+  var handleArrowKeyPress = React.useCallback(function (arrowKey) {
     event.preventDefault();
     handleInitialArrowPress();
     var coordinatesClone = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
@@ -412,7 +417,7 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     var key = event.key;
     // Command keys need to be returned as there is default browser behavior with these keys
     // Needs to be returned in editing mode
-    if (checkforReturnConditon(key)) {
+    if (checkForReturnCondition(key)) {
       return;
     }
 
@@ -515,11 +520,11 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
         case 'ArrowRight':
         case 'ArrowDown':
           {
-            handleArrowkeyPress(key);
+            handleArrowKeyPress(key);
           }
       }
     }
-  }, [activeCellInsideSelectionArea, updateActiveCellCoordinates, activeCellCoordinates, removeActiveCell, columns, rows, spreadsheetRef, currentMatcher, removeCellEditor, selectionAreas, handleHomeEndKey, keysPressedList, usingMac, updateData, checkforReturnConditon, handleArrowkeyPress]);
+  }, [activeCellInsideSelectionArea, updateActiveCellCoordinates, activeCellCoordinates, removeActiveCell, columns, rows, spreadsheetRef, currentMatcher, removeCellEditor, selectionAreas, handleHomeEndKey, keysPressedList, usingMac, updateData, checkForReturnCondition, handleArrowKeyPress]);
   var startEditMode = function startEditMode() {
     setIsEditing(true);
     setClickAndHoldActive(false);
@@ -718,6 +723,7 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     visibleColumns: visibleColumns,
     selectAllAriaLabel: selectAllAriaLabel
   }), /*#__PURE__*/React__default["default"].createElement(DataSpreadsheetBody.DataSpreadsheetBody, {
+    activeCellRef: activeCellRef,
     activeCellCoordinates: activeCellCoordinates,
     ref: spreadsheetRef,
     clickAndHoldActive: clickAndHoldActive,

package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js

@@ -36,7 +36,8 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var _div;
 var blockClass = "".concat(settings.pkg.prefix, "--data-spreadsheet");
 var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var columns = _ref.columns,
+  var activeCellRef = _ref.activeCellRef,
+    columns = _ref.columns,
     activeCellCoordinates = _ref.activeCellCoordinates,
     defaultColumn = _ref.defaultColumn,
     defaultEmptyRowCount = _ref.defaultEmptyRowCount,
@@ -205,6 +206,47 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       }
     }
   }, [defaultColumn, ref, activeCellCoordinates, previousState === null || previousState === void 0 ? void 0 : previousState.rowHeight, selectionAreas, setActiveCellInsideSelectionArea, setSelectionAreas, visibleColumns]);
+  //selectionAreas will be set when ever a selection area is made.
+  React.useEffect(function () {
+    removeDuplicateSelections();
+  }, [selectionAreas, removeDuplicateSelections]);
+
+  //this method will check for any duplicate selection area and remove.
+  //same selections are those have the same height, width, top, left styles. These inline styles are being set in createCellSelection util.
+  var removeDuplicateSelections = React.useCallback(function () {
+    var uniqueAttrArray = [],
+      removedSelectionAreaMatcherArr = [];
+    ref.current.querySelectorAll(".".concat(blockClass, "__selection-area--element")).forEach(function (selectorEl) {
+      var _selectorEl$style = selectorEl.style,
+        top = _selectorEl$style.top,
+        left = _selectorEl$style.left,
+        height = _selectorEl$style.height,
+        width = _selectorEl$style.width;
+      var uniqueAttrStr = "".concat(top).concat(left).concat(height).concat(width); // eg: 20px30px70px90px
+      if (uniqueAttrArray.indexOf(uniqueAttrStr) == -1) {
+        uniqueAttrArray.push(uniqueAttrStr);
+      } else {
+        selectorEl.remove(); // this is identified as duplicate selection and hence removing.
+        removedSelectionAreaMatcherArr.push(selectorEl.getAttribute('data-matcher-id'));
+      }
+    });
+
+    //clean the duplicate selectionAreaData and selectionArea
+    if (removedSelectionAreaMatcherArr.length) {
+      setSelectionAreas(function (prev) {
+        var prevValues = deepCloneObject.deepCloneObject(prev);
+        return prevValues.filter(function (item) {
+          return !removedSelectionAreaMatcherArr.includes(item.matcher);
+        });
+      });
+      setSelectionAreaData(function (prev) {
+        var prevValues = deepCloneObject.deepCloneObject(prev);
+        return prevValues.filter(function (item) {
+          return !removedSelectionAreaMatcherArr.includes(item.selectionId);
+        });
+      });
+    }
+  }, [ref, setSelectionAreas, setSelectionAreaData]);
 
   // onClick fn for each cell in the data spreadsheet body,
   // adds the active cell highlight
@@ -259,6 +301,7 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           setSelectionAreas(selectionAreaClone);
         }
       } else {
+        activeCellRef.current.style.display = 'none';
         setActiveCellInsideSelectionArea(false);
         setActiveCellCoordinates(activeCoordinates);
         // remove all previous cell selections
@@ -273,7 +316,7 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         setSelectionAreaData([]);
       }
     };
-  }, [currentMatcher, activeCellCoordinates, selectionAreas, setActiveCellCoordinates, setSelectionAreas, setContainerHasFocus, setClickAndHoldActive, setCurrentMatcher, ref, setSelectionAreaData, setActiveCellInsideSelectionArea]);
+  }, [currentMatcher, activeCellCoordinates, selectionAreas, setActiveCellCoordinates, setSelectionAreas, setContainerHasFocus, setClickAndHoldActive, setCurrentMatcher, ref, setSelectionAreaData, setActiveCellInsideSelectionArea, activeCellRef]);
   var handleBodyScroll = function handleBodyScroll() {
     var headerRowElement = ref.current.querySelector("\n        .".concat(blockClass, "__header--container .").concat(blockClass, "__tr"));
     headerRowElement.scrollLeft = contentScrollRef.current.scrollLeft;
@@ -437,6 +480,10 @@ DataSpreadsheetBody.propTypes = {
     row: index["default"].oneOfType([index["default"].string, index["default"].number]),
     column: index["default"].oneOfType([index["default"].string, index["default"].number])
   }),
+  /**
+   *This is the ref of the button input, which is the active cell element
+   */
+  activeCellRef: index["default"].object,
   /**
    * Is the user clicking and holding in the data spreadsheet body
    */

package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.d.ts

@@ -1,6 +1,8 @@
-export function useMoveActiveCell({ spreadsheetRef, activeCellCoordinates, containerHasFocus, createActiveCell, }: {
+export function useMoveActiveCell({ spreadsheetRef, activeCellCoordinates, containerHasFocus, createActiveCell, activeCellContent, isActiveHeaderCellChanged, }: {
     spreadsheetRef: any;
     activeCellCoordinates: any;
     containerHasFocus: any;
     createActiveCell: any;
+    activeCellContent: any;
+    isActiveHeaderCellChanged: any;
 }): void;

package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js

@@ -16,8 +16,15 @@ var useMoveActiveCell = function useMoveActiveCell(_ref) {
   var spreadsheetRef = _ref.spreadsheetRef,
     activeCellCoordinates = _ref.activeCellCoordinates,
     containerHasFocus = _ref.containerHasFocus,
-    createActiveCell = _ref.createActiveCell;
+    createActiveCell = _ref.createActiveCell,
+    activeCellContent = _ref.activeCellContent,
+    isActiveHeaderCellChanged = _ref.isActiveHeaderCellChanged;
+  //new active cell is created when the activeCellContent changes or navigate through headers
+  // Otherwise new active cell will display the old value in a glance
   React.useEffect(function () {
+    performCreateActiveCell();
+  }, [activeCellContent, performCreateActiveCell, isActiveHeaderCellChanged]);
+  var performCreateActiveCell = React.useCallback(function () {
     var activeCellPlacementElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"".concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row, "\"][data-column-index=\"").concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column, "\"]"));
     var shouldPlaceActiveCellInHeader = (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' && true;
     var selectAllElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"header\"][data-column-index=\"header\"]");
@@ -28,7 +35,7 @@ var useMoveActiveCell = function useMoveActiveCell(_ref) {
         addToHeader: shouldPlaceActiveCellInHeader
       });
     }
-  }, [activeCellCoordinates, spreadsheetRef, createActiveCell, containerHasFocus]);
+  }, [spreadsheetRef, activeCellCoordinates, containerHasFocus, createActiveCell]);
 };
 
 exports.useMoveActiveCell = useMoveActiveCell;

package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js

@@ -24,7 +24,6 @@ var blockClass = "".concat(settings.pkg.prefix, "--datagrid__row-size");
 var RowSizeRadioGroup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var rowSizes = _ref.rowSizes,
     selectedOption = _ref.selectedOption,
-    datagridName = _ref.datagridName,
     onChange = _ref.onChange,
     legendText = _ref.legendText,
     _ref$rowSizeLabels = _ref.rowSizeLabels,
@@ -34,7 +33,8 @@ var RowSizeRadioGroup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       md: 'Medium',
       sm: 'Small',
       xs: 'Extra small'
-    } : _ref$rowSizeLabels;
+    } : _ref$rowSizeLabels,
+    tableId = _ref.tableId;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "-dropdown"),
     role: "presentation",
@@ -57,7 +57,7 @@ var RowSizeRadioGroup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       key: option.value,
       labelText: labelText,
       value: option.value,
-      id: "".concat(datagridName || 'datagrid', "--row-density--").concat(option.value)
+      id: "".concat(tableId || 'datagrid', "--row-density--").concat(option.value)
     });
   })));
 });
@@ -87,12 +87,12 @@ RowSizeRadioGroup.defaultProps = {
   selectedOption: 'lg'
 };
 RowSizeRadioGroup.propTypes = {
-  datagridName: index["default"].string,
   legendText: index["default"].string,
   onChange: index["default"].func.isRequired,
   rowSizeLabels: index["default"].object,
   rowSizes: index["default"].array.isRequired,
-  selectedOption: index["default"].string.isRequired
+  selectedOption: index["default"].string.isRequired,
+  tableId: index["default"].string.isRequired
 };
 var RowSizeRadioGroup$1 = RowSizeRadioGroup;
 

package/lib/components/Datagrid/useRowSize.js

@@ -22,7 +22,8 @@ var useRowSize = function useRowSize(hooks) {
     var rowSizeProps = instance.rowSizeProps,
       rowSizes = instance.rowSizes,
       rowSize = instance.rowSize,
-      onRowSizeChange = instance.onRowSizeChange;
+      onRowSizeChange = instance.onRowSizeChange,
+      tableId = instance.tableId;
     var _ref = rowSizeProps || {},
       labels = _ref.labels;
     Object.assign(instance, {
@@ -36,7 +37,8 @@ var useRowSize = function useRowSize(hooks) {
           if (typeof onRowSizeChange === 'function') {
             onRowSizeChange(value);
           }
-        }
+        },
+        tableId: tableId
       }),
       RowSizeDropdown: RowSizeDropdown["default"]
     });

package/lib/components/DescriptionList/DescriptionList.d.ts

@@ -2,41 +2,4 @@
  * Type layouts provide an orderly layout of terms and definitions.
  */
 export let DescriptionList: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-export function DescriptionListBody({ children, className, ...rest }: {
-    [x: string]: any;
-    children: any;
-    className: any;
-}): import("react/jsx-runtime").JSX.Element;
-export namespace DescriptionListBody {
-    export namespace propTypes {
-        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let className: PropTypes.Requireable<string>;
-    }
-    export { componentNameBody as displayName };
-}
-export function DescriptionListRow({ children, className, ...other }: {
-    [x: string]: any;
-    children: any;
-    className: any;
-}): import("react/jsx-runtime").JSX.Element;
-export namespace DescriptionListRow {
-    export namespace propTypes_1 { }
-    export { propTypes_1 as propTypes };
-    export { componentNameRow as displayName };
-}
-export function DescriptionListCell({ children, className, ...rest }: {
-    [x: string]: any;
-    children: any;
-    className: any;
-}): import("react/jsx-runtime").JSX.Element;
-export namespace DescriptionListCell {
-    export namespace propTypes_2 { }
-    export { propTypes_2 as propTypes };
-    export { componentNameCell as displayName };
-}
 import React from 'react';
-import PropTypes from 'prop-types';
-declare const componentNameBody: "DescriptionListBody";
-declare const componentNameRow: "DescriptionListRow";
-declare const componentNameCell: "DescriptionListCell";
-export {};

package/lib/components/DescriptionList/DescriptionList.js

@@ -74,22 +74,17 @@ exports.DescriptionList = settings.pkg.checkComponentEnabled(exports.Description
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 exports.DescriptionList.displayName = componentName;
-var propTypes = {
-  /** Provide the contents of the node */
-  children: index["default"].node,
-  /** Provide an optional class to be applied to the containing node */
-  className: index["default"].string
-};
 
 // The types and DocGen commentary for the component props,
 // in alphabetical order (for consistency).
 // See https://www.npmjs.com/package/prop-types#usage.
-exports.DescriptionList.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, propTypes), {}, {
+exports.DescriptionList.propTypes = {
   /** Specify if the type layout has a border */
   border: index["default"].bool,
+  /** Provide the contents of the node */
+  children: index["default"].node,
+  /** Provide an optional class to be applied to the containing node */
+  className: index["default"].string,
   /** Specify the size of the type layout, from a list of available sizes */
   size: index["default"].oneOf(Object.values(constants.DescriptionListSize))
-});
-_rollupPluginBabelHelpers.objectSpread2({}, propTypes);
-_rollupPluginBabelHelpers.objectSpread2({}, propTypes);
-_rollupPluginBabelHelpers.objectSpread2({}, propTypes);
+};

package/lib/components/DescriptionList/DescriptionListBody.d.ts

@@ -0,0 +1,2 @@
+export let DescriptionListBody: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';

package/lib/components/DescriptionList/DescriptionListBody.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+var react = require('@carbon/react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(settings.pkg.prefix, "--description-list__body");
+var componentName = 'DescriptionListBody';
+exports.DescriptionListBody = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default["default"].createElement(react.StructuredListBody, _rollupPluginBabelHelpers["extends"]({
+    className: cx__default["default"](blockClass, className),
+    ref: ref
+  }, devtools.getDevtoolsProps(componentName), rest), children);
+});
+exports.DescriptionListBody.propTypes = {
+  /** Provide the contents of the node */
+  children: index["default"].node,
+  /** Provide an optional class to be applied to the containing node */
+  className: index["default"].string
+};
+exports.DescriptionListBody = settings.pkg.checkComponentEnabled(exports.DescriptionListBody, componentName);
+exports.DescriptionListBody.displayName = componentName;

package/lib/components/DescriptionList/DescriptionListCell.d.ts

@@ -0,0 +1,2 @@
+export let DescriptionListCell: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';

package/lib/components/DescriptionList/DescriptionListCell.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+var react = require('@carbon/react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(settings.pkg.prefix, "--description-list__cell");
+var componentName = 'DescriptionListCell';
+exports.DescriptionListCell = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default["default"].createElement(react.StructuredListCell, _rollupPluginBabelHelpers["extends"]({
+    className: cx__default["default"](blockClass, className),
+    ref: ref
+  }, devtools.getDevtoolsProps(componentName), rest), children);
+});
+exports.DescriptionListCell.propTypes = {
+  /** Provide the contents of the node */
+  children: index["default"].node,
+  /** Provide an optional class to be applied to the containing node */
+  className: index["default"].string
+};
+exports.DescriptionListCell = settings.pkg.checkComponentEnabled(exports.DescriptionListCell, componentName);
+exports.DescriptionListCell.displayName = componentName;

package/lib/components/DescriptionList/DescriptionListRow.d.ts

@@ -0,0 +1,2 @@
+export let DescriptionListRow: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';

package/lib/components/DescriptionList/DescriptionListRow.js

@@ -0,0 +1,48 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+var react = require('@carbon/react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(settings.pkg.prefix, "--description-list__row");
+var componentName = 'DescriptionListRow';
+exports.DescriptionListRow = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default["default"].createElement(react.StructuredListRow, _rollupPluginBabelHelpers["extends"]({
+    className: cx__default["default"](blockClass, className)
+    // role="row"
+    ,
+    ref: ref
+  }, devtools.getDevtoolsProps(componentName), rest), children);
+});
+exports.DescriptionListRow.propTypes = {
+  /** Provide the contents of the node */
+  children: index["default"].node,
+  /** Provide an optional class to be applied to the containing node */
+  className: index["default"].string
+};
+exports.DescriptionListRow = settings.pkg.checkComponentEnabled(exports.DescriptionListRow, componentName);
+exports.DescriptionListRow.displayName = componentName;

package/lib/components/DescriptionList/index.d.ts

@@ -1 +1,4 @@
-export { DescriptionList, DescriptionListBody, DescriptionListRow, DescriptionListCell } from "./DescriptionList";
+export { DescriptionList } from "./DescriptionList";
+export { DescriptionListBody } from "./DescriptionListBody";
+export { DescriptionListCell } from "./DescriptionListCell";
+export { DescriptionListRow } from "./DescriptionListRow";

package/lib/components/FilterPanel/FilterPanel.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The container for filter panel subcomponents.
+ */
+export let FilterPanel: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';

package/lib/components/FilterPanel/FilterPanel.js

@@ -0,0 +1,62 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["children", "className", "title"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(settings.pkg.prefix, "--filter-panel");
+var componentName = 'FilterPanel';
+
+/**
+ * The container for filter panel subcomponents.
+ */
+exports.FilterPanel = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    title = _ref.title,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default["default"].createElement("section", _rollupPluginBabelHelpers["extends"]({}, rest, {
+    className: cx__default["default"](blockClass, className),
+    ref: ref
+  }, devtools.getDevtoolsProps(componentName)), title && /*#__PURE__*/React__default["default"].createElement("h1", {
+    className: "".concat(blockClass, "__title")
+  }, title), children);
+});
+
+// Return a placeholder if not released and not enabled by feature flag
+exports.FilterPanel = settings.pkg.checkComponentEnabled(exports.FilterPanel, componentName);
+exports.FilterPanel.displayName = componentName;
+exports.FilterPanel.propTypes = {
+  /**
+   * Provide the contents of the FilterPanel.
+   */
+  children: index["default"].node,
+  /**
+   * Provide an optional class to be applied to the containing node.
+   */
+  className: index["default"].string,
+  /**
+   * Title text for the filter panel.
+   */
+  title: index["default"].node
+};

package/lib/components/FilterPanel/FilterPanelCheckbox/FilterPanelCheckbox.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Provides a checkbox, label, and count.
+ */
+export let FilterPanelCheckbox: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';