@carbon/ibm-products 2.32.0 → 2.34.0

package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends, objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useEffect, useRef } from 'react';
 import { VariableSizeList } from 'react-window';
 import { TableBody } from '@carbon/react';
@@ -77,7 +77,11 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
       width: (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : _gridRef$current.clientWidth,
       overflow: 'hidden'
     }
-  }, /*#__PURE__*/React__default.createElement(DatagridHead, datagridState)), /*#__PURE__*/React__default.createElement(TableBody, getTableBodyProps(), /*#__PURE__*/React__default.createElement(VariableSizeList, {
+  }, /*#__PURE__*/React__default.createElement(DatagridHead, datagridState)), /*#__PURE__*/React__default.createElement(TableBody, _extends({}, getTableBodyProps({
+    role: undefined
+  }), {
+    "aria-live": null
+  }), /*#__PURE__*/React__default.createElement(VariableSizeList, {
     height: virtualHeight || tableHeight,
     itemCount: visibleRows.length,
     itemSize: function itemSize(index) {

package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.d.ts

@@ -1,5 +1,5 @@
 export default Columns;
-declare function Columns({ getVisibleColumnsCount, filterString, columns, setColumnsObject, onSelectColumn, assistiveTextInstructionsLabel, assistiveTextDisabledInstructionsLabel, selectAllLabel, customizeTearsheetHeadingLabel }: {
+declare function Columns({ getVisibleColumnsCount, filterString, columns, setColumnsObject, onSelectColumn, assistiveTextInstructionsLabel, assistiveTextDisabledInstructionsLabel, selectAllLabel, customizeTearsheetHeadingLabel, }: {
     getVisibleColumnsCount: any;
     filterString: any;
     columns: any;

package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js

@@ -153,6 +153,10 @@ var InlineEditCell = function InlineEditCell(_ref) {
       if (type === 'number') {
         numberInputRef.current.focus();
       }
+      if (type === 'selection') {
+        var _dropdownRef$current;
+        dropdownRef === null || dropdownRef === void 0 || (_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 || _dropdownRef$current.focus();
+      }
     }
   }, [inEditMode, type]);
 

package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.d.ts

@@ -1,8 +1,9 @@
-export function handleGridKeyPress({ event, dispatch, state, instance, keysPressedList, usingMac, }: {
+export function handleGridKeyPress({ event, dispatch, state, instance, keysPressedList, usingMac, ref, }: {
     event: any;
     dispatch: any;
     state: any;
     instance: any;
     keysPressedList: any;
     usingMac: any;
+    ref: any;
 }): void;

package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js

@@ -17,7 +17,8 @@ var handleGridKeyPress = function handleGridKeyPress(_ref) {
     state = _ref.state,
     instance = _ref.instance,
     keysPressedList = _ref.keysPressedList,
-    usingMac = _ref.usingMac;
+    usingMac = _ref.usingMac,
+    ref = _ref.ref;
   var key = event.key;
   var gridActive = state.gridActive,
     activeCellId = state.activeCellId,
@@ -54,8 +55,8 @@ var handleGridKeyPress = function handleGridKeyPress(_ref) {
 
   // Checks if the dropdown menu is open
   var dropdownIsActive = function dropdownIsActive() {
-    var focusedElementRole = document.activeElement.getAttribute('role');
-    if (focusedElementRole === 'listbox' && document.activeElement.classList.contains("".concat(carbon.prefix, "--list-box__menu"))) {
+    var selectedDropdown = ref === null || ref === void 0 ? void 0 : ref.current.querySelector("\n      #".concat(instance.tableId, " .").concat(blockClass, "__table-with-inline-edit [data-cell-id=\"").concat(activeCellId, "\"] button[role='combobox']\n    "));
+    if (selectedDropdown) {
       // Prevents arrow keys from scrolling any other content when dropdown menu is open
       event.preventDefault();
       return true;

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

@@ -15,7 +15,6 @@ var blockClass = "".concat(pkg.prefix, "--datagrid__row-size");
 var RowSizeRadioGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var rowSizes = _ref.rowSizes,
     selectedOption = _ref.selectedOption,
-    datagridName = _ref.datagridName,
     onChange = _ref.onChange,
     legendText = _ref.legendText,
     _ref$rowSizeLabels = _ref.rowSizeLabels,
@@ -25,7 +24,8 @@ var RowSizeRadioGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
       md: 'Medium',
       sm: 'Small',
       xs: 'Extra small'
-    } : _ref$rowSizeLabels;
+    } : _ref$rowSizeLabels,
+    tableId = _ref.tableId;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "-dropdown"),
     role: "presentation",
@@ -48,7 +48,7 @@ var RowSizeRadioGroup = /*#__PURE__*/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)
     });
   })));
 });
@@ -78,12 +78,12 @@ RowSizeRadioGroup.defaultProps = {
   selectedOption: 'lg'
 };
 RowSizeRadioGroup.propTypes = {
-  datagridName: PropTypes.string,
   legendText: PropTypes.string,
   onChange: PropTypes.func.isRequired,
   rowSizeLabels: PropTypes.object,
   rowSizes: PropTypes.array.isRequired,
-  selectedOption: PropTypes.string.isRequired
+  selectedOption: PropTypes.string.isRequired,
+  tableId: PropTypes.string.isRequired
 };
 var RowSizeRadioGroup$1 = RowSizeRadioGroup;
 

package/es/components/Datagrid/useRowSize.js

@@ -18,7 +18,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, {
@@ -32,7 +33,8 @@ var useRowSize = function useRowSize(hooks) {
           if (typeof onRowSizeChange === 'function') {
             onRowSizeChange(value);
           }
-        }
+        },
+        tableId: tableId
       }),
       RowSizeDropdown: RowSizeDropdown
     });

package/es/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/es/components/DescriptionList/DescriptionList.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
@@ -65,24 +65,19 @@ DescriptionList = pkg.checkComponentEnabled(DescriptionList, componentName);
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 DescriptionList.displayName = componentName;
-var propTypes = {
-  /** Provide the contents of the node */
-  children: PropTypes.node,
-  /** Provide an optional class to be applied to the containing node */
-  className: PropTypes.string
-};
 
 // The types and DocGen commentary for the component props,
 // in alphabetical order (for consistency).
 // See https://www.npmjs.com/package/prop-types#usage.
-DescriptionList.propTypes = _objectSpread2(_objectSpread2({}, propTypes), {}, {
+DescriptionList.propTypes = {
   /** Specify if the type layout has a border */
   border: PropTypes.bool,
+  /** Provide the contents of the node */
+  children: PropTypes.node,
+  /** Provide an optional class to be applied to the containing node */
+  className: PropTypes.string,
   /** Specify the size of the type layout, from a list of available sizes */
   size: PropTypes.oneOf(Object.values(DescriptionListSize))
-});
-_objectSpread2({}, propTypes);
-_objectSpread2({}, propTypes);
-_objectSpread2({}, propTypes);
+};
 
 export { DescriptionList };

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

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

package/es/components/DescriptionList/DescriptionListBody.js

@@ -0,0 +1,39 @@
+/**
+ * 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.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from '../../node_modules/prop-types/index.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { pkg } from '../../settings.js';
+import { StructuredListBody } from '@carbon/react';
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(pkg.prefix, "--description-list__body");
+var componentName = 'DescriptionListBody';
+var DescriptionListBody = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement(StructuredListBody, _extends({
+    className: cx(blockClass, className),
+    ref: ref
+  }, getDevtoolsProps(componentName), rest), children);
+});
+DescriptionListBody.propTypes = {
+  /** Provide the contents of the node */
+  children: PropTypes.node,
+  /** Provide an optional class to be applied to the containing node */
+  className: PropTypes.string
+};
+DescriptionListBody = pkg.checkComponentEnabled(DescriptionListBody, componentName);
+DescriptionListBody.displayName = componentName;
+
+export { DescriptionListBody };

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

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

package/es/components/DescriptionList/DescriptionListCell.js

@@ -0,0 +1,39 @@
+/**
+ * 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.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from '../../node_modules/prop-types/index.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { pkg } from '../../settings.js';
+import { StructuredListCell } from '@carbon/react';
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(pkg.prefix, "--description-list__cell");
+var componentName = 'DescriptionListCell';
+var DescriptionListCell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement(StructuredListCell, _extends({
+    className: cx(blockClass, className),
+    ref: ref
+  }, getDevtoolsProps(componentName), rest), children);
+});
+DescriptionListCell.propTypes = {
+  /** Provide the contents of the node */
+  children: PropTypes.node,
+  /** Provide an optional class to be applied to the containing node */
+  className: PropTypes.string
+};
+DescriptionListCell = pkg.checkComponentEnabled(DescriptionListCell, componentName);
+DescriptionListCell.displayName = componentName;
+
+export { DescriptionListCell };

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

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

package/es/components/DescriptionList/DescriptionListRow.js

@@ -0,0 +1,41 @@
+/**
+ * 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.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from '../../node_modules/prop-types/index.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { pkg } from '../../settings.js';
+import { StructuredListRow } from '@carbon/react';
+
+var _excluded = ["children", "className"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(pkg.prefix, "--description-list__row");
+var componentName = 'DescriptionListRow';
+var DescriptionListRow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement(StructuredListRow, _extends({
+    className: cx(blockClass, className)
+    // role="row"
+    ,
+    ref: ref
+  }, getDevtoolsProps(componentName), rest), children);
+});
+DescriptionListRow.propTypes = {
+  /** Provide the contents of the node */
+  children: PropTypes.node,
+  /** Provide an optional class to be applied to the containing node */
+  className: PropTypes.string
+};
+DescriptionListRow = pkg.checkComponentEnabled(DescriptionListRow, componentName);
+DescriptionListRow.displayName = componentName;
+
+export { DescriptionListRow };

package/es/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/es/components/EditSidePanel/EditSidePanel.d.ts

@@ -1,5 +1,95 @@
+/**
+ * Copyright IBM Corp. 2021, 2021
+ *
+ * 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 React, { ReactNode } from 'react';
+import '../../global/js/utils/props-helper';
+interface EditSidePanelProps {
+    /**
+     * Sets the body content of the create side panel
+     */
+    children: ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * Specifies a boolean for disabling or enabling the primary button. This is important for form validation
+     * Returning `true` prevents the primary button from being clicked until required fields are completed.
+     */
+    disableSubmit?: boolean;
+    /**
+     * Specifies an optional field that provides a additional context for a form
+     */
+    formDescription?: ReactNode;
+    /**
+     * Specifies a required field that provides a title for a form
+     */
+    formTitle: ReactNode;
+    /**
+     * Unique identifier
+     */
+    id?: string;
+    /**
+     * Specifies an optional handler which is called when the CreateSidePanel
+     * is closed.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Specifies an optional handler which is called when the CreateSidePanel
+     * primary button is pressed.
+     */
+    onRequestSubmit?: () => void;
+    /**
+     * Specifies whether the CreateSidePanel is open or not.
+     */
+    open: boolean;
+    /**
+     * Determines if the side panel is on the right or left
+     */
+    placement?: 'left' | 'right';
+    /**
+     * Specifies the primary button's text in the modal.
+     */
+    primaryButtonText: string;
+    /**
+     * Specifies the secondary button's text in the modal.
+     */
+    secondaryButtonText: string;
+    /**
+     * This is the selector to the element that contains all of the page content that will shrink if the panel is a slide in.
+     * This prop is required when using the `slideIn` variant of the side panel.
+     */
+    selectorPageContent?: string;
+    /**
+     * Specifies which DOM element in the form should be focused.
+     */
+    selectorPrimaryFocus?: string;
+    /**
+     * Sets the size of the side panel
+     */
+    size?: 'xs' | 'sm' | 'md' | 'lg' | '2xl';
+    /**
+     * Specifies which DOM element in the form should be focused.
+     */
+    slideIn?: boolean;
+    /**
+     *  **Experimental:** Provide a `Slug` component to be rendered inside the `SidePanel` component
+     */
+    slug?: ReactNode;
+    /**
+     * The subtitle of the CreateSidePanel is optional and serves to provide more information about the modal.
+     */
+    subtitle?: ReactNode;
+    /**
+     * The title of the CreateSidePanel is usually the product or service name.
+     */
+    title: string;
+}
 /**
  * Use with medium complexity edits if the user needs page context.
  */
-export let EditSidePanel: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let EditSidePanel: React.ForwardRefExoticComponent<EditSidePanelProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/es/components/EditSidePanel/EditSidePanel.js

@@ -24,12 +24,6 @@ var componentName = 'EditSidePanel';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
-// Default values for props
-var defaults = {
-  placement: 'right',
-  size: 'md'
-};
-
 /**
  * Use with medium complexity edits if the user needs page context.
  */
@@ -44,13 +38,13 @@ var EditSidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     onRequestSubmit = _ref.onRequestSubmit,
     open = _ref.open,
     _ref$placement = _ref.placement,
-    placement = _ref$placement === void 0 ? defaults.placement : _ref$placement,
+    placement = _ref$placement === void 0 ? 'right' : _ref$placement,
     primaryButtonText = _ref.primaryButtonText,
     secondaryButtonText = _ref.secondaryButtonText,
     selectorPrimaryFocus = _ref.selectorPrimaryFocus,
     selectorPageContent = _ref.selectorPageContent,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? defaults.size : _ref$size,
+    size = _ref$size === void 0 ? 'md' : _ref$size,
     slideIn = _ref.slideIn,
     subtitle = _ref.subtitle,
     title = _ref.title,
@@ -59,7 +53,7 @@ var EditSidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     label: primaryButtonText,
     onClick: function onClick(event) {
       event.preventDefault();
-      onRequestSubmit();
+      onRequestSubmit && onRequestSubmit();
     },
     kind: 'primary',
     disabled: disableSubmit,
@@ -112,6 +106,7 @@ EditSidePanel.propTypes = {
   /**
    * Sets the body content of the create side panel
    */
+  /**@ts-ignore*/
   children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
   /**
    * Provide an optional class to be applied to the containing node.
@@ -147,7 +142,7 @@ EditSidePanel.propTypes = {
   /**
    * Specifies whether the CreateSidePanel is open or not.
    */
-  open: PropTypes.bool,
+  open: PropTypes.bool.isRequired,
   /**
    * Determines if the side panel is on the right or left
    */
@@ -164,6 +159,7 @@ EditSidePanel.propTypes = {
    * This is the selector to the element that contains all of the page content that will shrink if the panel is a slide in.
    * This prop is required when using the `slideIn` variant of the side panel.
    */
+  /**@ts-ignore*/
   selectorPageContent: PropTypes.string.isRequired.if(function (_ref2) {
     var slideIn = _ref2.slideIn;
     return slideIn;
@@ -171,6 +167,7 @@ EditSidePanel.propTypes = {
   /**
    * Specifies which DOM element in the form should be focused.
    */
+  /**@ts-ignore*/
   selectorPrimaryFocus: PropTypes.node.isRequired,
   /**
    * Sets the size of the side panel
@@ -191,6 +188,7 @@ EditSidePanel.propTypes = {
   /**
    * The title of the CreateSidePanel is usually the product or service name.
    */
+  /**@ts-ignore*/
   title: PropTypes.node.isRequired
 };
 

package/es/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/es/components/FilterPanel/FilterPanel.js

@@ -0,0 +1,55 @@
+/**
+ * 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.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from '../../node_modules/prop-types/index.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { pkg } from '../../settings.js';
+
+var _excluded = ["children", "className", "title"];
+
+// The block part of our conventional BEM class names (blockClass__E--M).
+var blockClass = "".concat(pkg.prefix, "--filter-panel");
+var componentName = 'FilterPanel';
+
+/**
+ * The container for filter panel subcomponents.
+ */
+var FilterPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    title = _ref.title,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement("section", _extends({}, rest, {
+    className: cx(blockClass, className),
+    ref: ref
+  }, getDevtoolsProps(componentName)), title && /*#__PURE__*/React__default.createElement("h1", {
+    className: "".concat(blockClass, "__title")
+  }, title), children);
+});
+
+// Return a placeholder if not released and not enabled by feature flag
+FilterPanel = pkg.checkComponentEnabled(FilterPanel, componentName);
+FilterPanel.displayName = componentName;
+FilterPanel.propTypes = {
+  /**
+   * Provide the contents of the FilterPanel.
+   */
+  children: PropTypes.node,
+  /**
+   * Provide an optional class to be applied to the containing node.
+   */
+  className: PropTypes.string,
+  /**
+   * Title text for the filter panel.
+   */
+  title: PropTypes.node
+};
+
+export { FilterPanel };

package/es/components/FilterPanel/FilterPanelAccordion/FilterPanelAccordion.d.ts

@@ -0,0 +1,5 @@
+/**
+ * A container with a label and optional count.
+ */
+export let FilterPanelAccordion: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';