@carbon/ibm-products 0.99.1 → 1.0.0

package/es/components/PageHeader/PageHeader.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["actionBarItems", "actionBarMenuOptionsClass", "actionBarOverflowAriaLabel", "actionBarOverflowLabel", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "allTagsModalTitle", "availableSpace", "background", "hasBackgroundAlways", "breadcrumbOverflowAriaLabel", "breadcrumbOverflowLabel", "breadcrumbItems", "breadcrumbs", "children", "className", "collapseHeader", "collapseHeaderIconDescription", "collapseHeaderLabel", "collapseHeaderToggleWanted", "collapseTitle", "disableBreadcrumbScroll", "expandHeaderIconDescription", "expandHeaderLabel", "fullWidthGrid", "hasCollapseHeaderToggle", "narrowGrid", "navigation", "pageActions", "pageActionsOverflowLabel", "pageActionsMenuOptionsClass", "pageHeaderOffset", "preCollapseTitleRow", "preventBreadcrumbScroll", "showAllTagsLabel", "subtitle", "tags", "title"];
+var _excluded = ["actionBarItems", "actionBarMenuOptionsClass", "actionBarOverflowAriaLabel", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "allTagsModalTitle", "hasBackgroundAlways", "breadcrumbOverflowAriaLabel", "breadcrumbs", "children", "className", "collapseHeader", "collapseHeaderIconDescription", "collapseTitle", "disableBreadcrumbScroll", "expandHeaderIconDescription", "fullWidthGrid", "hasCollapseHeaderToggle", "narrowGrid", "navigation", "pageActions", "pageActionsOverflowLabel", "pageActionsMenuOptionsClass", "showAllTagsLabel", "subtitle", "tags", "title"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -19,10 +19,10 @@ import PropTypes from 'prop-types';
 import { layout05, baseFontSize } from '@carbon/layout';
 import cx from 'classnames';
 import { useResizeDetector } from 'react-resize-detector';
-import { BreadcrumbItem, Grid, Column, Row, Button, Tag } from 'carbon-components-react';
+import { Grid, Column, Row, Button, Tag } from 'carbon-components-react';
 import { useWindowResize, useNearestScroll } from '../../global/js/hooks';
 import { getDevtoolsProps } from '../../global/js/utils/devtools';
-import { deprecateProp, deprecatePropUsage, extractShapesArray, prepareProps } from '../../global/js/utils/props-helper';
+import { prepareProps } from '../../global/js/utils/props-helper';
 import { pkg } from '../../settings';
 import { ActionBar } from '../ActionBar/';
 import { BreadcrumbWithOverflow } from '../BreadcrumbWithOverflow';
@@ -33,32 +33,24 @@ var componentName = 'PageHeader';
 import { blockClass, utilCheckUpdateVerticalSpace, utilGetBreadcrumbItemForTitle, utilSetCollapsed } from './PageHeaderUtils';
 import { PageHeaderTitle } from './PageHeaderTitle';
 export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var _actionBarOverflowAri, _breadcrumbOverflowAr, _children, _collapseHeaderIconDe, _expandHeaderIconDesc, _hasBackgroundAlways, _hasCollapseHeaderTog, _collapseTitle, _disableBreadcrumbScr, _ref5, _cx2, _ref6, _cx4, _cx7;
+  var _ref5, _cx2, _ref6, _cx4, _cx7;
 
   var actionBarItems = _ref.actionBarItems,
       actionBarMenuOptionsClass = _ref.actionBarMenuOptionsClass,
       actionBarOverflowAriaLabel = _ref.actionBarOverflowAriaLabel,
-      deprecated_actionBarOverflowLabel = _ref.actionBarOverflowLabel,
       allTagsModalSearchLabel = _ref.allTagsModalSearchLabel,
       allTagsModalSearchPlaceholderText = _ref.allTagsModalSearchPlaceholderText,
       allTagsModalTitle = _ref.allTagsModalTitle,
-      deprecated_availableSpace = _ref.availableSpace,
-      deprecated_background = _ref.background,
       hasBackgroundAlways = _ref.hasBackgroundAlways,
       breadcrumbOverflowAriaLabel = _ref.breadcrumbOverflowAriaLabel,
-      deprecated_breadcrumbOverflowLabel = _ref.breadcrumbOverflowLabel,
-      deprecated_breadcrumbItems = _ref.breadcrumbItems,
-      breadcrumbsIn = _ref.breadcrumbs,
+      breadcrumbs = _ref.breadcrumbs,
       children = _ref.children,
       className = _ref.className,
       collapseHeader = _ref.collapseHeader,
       collapseHeaderIconDescription = _ref.collapseHeaderIconDescription,
-      deprecated_collapseHeaderLabel = _ref.collapseHeaderLabel,
-      deprecated_collapseHeaderToggleWanted = _ref.collapseHeaderToggleWanted,
       collapseTitle = _ref.collapseTitle,
       disableBreadcrumbScroll = _ref.disableBreadcrumbScroll,
       expandHeaderIconDescription = _ref.expandHeaderIconDescription,
-      deprecated_expandHeaderLabel = _ref.expandHeaderLabel,
       fullWidthGrid = _ref.fullWidthGrid,
       hasCollapseHeaderToggle = _ref.hasCollapseHeaderToggle,
       narrowGrid = _ref.narrowGrid,
@@ -66,27 +58,12 @@ export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       pageActions = _ref.pageActions,
       pageActionsOverflowLabel = _ref.pageActionsOverflowLabel,
       pageActionsMenuOptionsClass = _ref.pageActionsMenuOptionsClass,
-      _deprecated_pageHeaderOffset = _ref.pageHeaderOffset,
-      deprecated_preCollapseTitleRow = _ref.preCollapseTitleRow,
-      deprecated_preventBreadcrumbScroll = _ref.preventBreadcrumbScroll,
       showAllTagsLabel = _ref.showAllTagsLabel,
       subtitle = _ref.subtitle,
       tags = _ref.tags,
       title = _ref.title,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  // handle deprecated props - START
-  (_actionBarOverflowAri = actionBarOverflowAriaLabel) !== null && _actionBarOverflowAri !== void 0 ? _actionBarOverflowAri : actionBarOverflowAriaLabel = deprecated_actionBarOverflowLabel;
-  (_breadcrumbOverflowAr = breadcrumbOverflowAriaLabel) !== null && _breadcrumbOverflowAr !== void 0 ? _breadcrumbOverflowAr : breadcrumbOverflowAriaLabel = deprecated_breadcrumbOverflowLabel;
-  (_children = children) !== null && _children !== void 0 ? _children : children = deprecated_availableSpace;
-  (_collapseHeaderIconDe = collapseHeaderIconDescription) !== null && _collapseHeaderIconDe !== void 0 ? _collapseHeaderIconDe : collapseHeaderIconDescription = deprecated_collapseHeaderLabel;
-  (_expandHeaderIconDesc = expandHeaderIconDescription) !== null && _expandHeaderIconDesc !== void 0 ? _expandHeaderIconDesc : expandHeaderIconDescription = deprecated_expandHeaderLabel;
-  (_hasBackgroundAlways = hasBackgroundAlways) !== null && _hasBackgroundAlways !== void 0 ? _hasBackgroundAlways : hasBackgroundAlways = deprecated_background;
-  (_hasCollapseHeaderTog = hasCollapseHeaderToggle) !== null && _hasCollapseHeaderTog !== void 0 ? _hasCollapseHeaderTog : hasCollapseHeaderToggle = deprecated_collapseHeaderToggleWanted;
-  (_collapseTitle = collapseTitle) !== null && _collapseTitle !== void 0 ? _collapseTitle : collapseTitle = deprecated_preCollapseTitleRow;
-  (_disableBreadcrumbScr = disableBreadcrumbScroll) !== null && _disableBreadcrumbScr !== void 0 ? _disableBreadcrumbScr : disableBreadcrumbScroll = deprecated_preventBreadcrumbScroll;
-  var breadcrumbs = breadcrumbsIn !== null && breadcrumbsIn !== void 0 ? breadcrumbsIn : deprecated_breadcrumbItems; // handle deprecated props - END
-
   var _useState = useState({}),
       _useState2 = _slicedToArray(_useState, 2),
       metrics = _useState2[0],
@@ -108,8 +85,7 @@ export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }; // state based on props only
 
 
-  var actionBarItemArray = extractShapesArray(actionBarItems);
-  var hasActionBar = actionBarItemArray && actionBarItemArray.length > 0;
+  var hasActionBar = actionBarItems && actionBarItems.length > 0;
   var hasBreadcrumbRow = breadcrumbs || actionBarItems; // NOTE: The buffer is used to add space between the bottom of the header and the last content
   // Not pre-collapsed and (subtitle or children)
 
@@ -382,8 +358,8 @@ export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className: "".concat(blockClass, "__breadcrumb"),
     noTrailingSlash: !!title,
     overflowAriaLabel: breadcrumbOverflowAriaLabel,
-    breadcrumbs: breadcrumbsIn ? breadcrumbItemForTitle ? breadcrumbsIn.concat(breadcrumbItemForTitle) : breadcrumbsIn : null
-  }, !breadcrumbsIn ? deprecated_breadcrumbItems : null, !breadcrumbsIn && breadcrumbItemForTitle ? /*#__PURE__*/React.createElement(BreadcrumbItem, prepareProps(breadcrumbItemForTitle, 'label'), breadcrumbItemForTitle.label) : null) : null), /*#__PURE__*/React.createElement(Column, {
+    breadcrumbs: breadcrumbs ? breadcrumbItemForTitle ? breadcrumbs.concat(breadcrumbItemForTitle) : breadcrumbs : null
+  }) : null), /*#__PURE__*/React.createElement(Column, {
     className: cx(["".concat(blockClass, "__action-bar-column ").concat(blockClass, "__action-bar-column--background"), (_ref6 = {}, _defineProperty(_ref6, "".concat(blockClass, "__action-bar-column--has-page-actions"), pageActions), _defineProperty(_ref6, "".concat(blockClass, "__action-bar-column--influenced-by-collapse-button"), spaceForCollapseButton), _ref6)])
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(blockClass, "__action-bar-column-content"),
@@ -394,7 +370,7 @@ export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   React.createElement(React.Fragment, null, thePageActions(true, pageActionsInBreadcrumbRow), /*#__PURE__*/React.createElement(ActionBar, {
     menuOptionsClass: cx(actionBarMenuOptionsClass, "".concat(blockClass, "__action-bar-menu-options")),
     overflowAriaLabel: actionBarOverflowAriaLabel,
-    actions: actionBarItemArray,
+    actions: actionBarItems,
     className: "".concat(blockClass, "__action-bar"),
     onWidthChange: handleActionBarWidthChange,
     rightAlign: true
@@ -500,74 +476,17 @@ var TYPES = {
   'high-contrast': 'High-Contrast'
 };
 var tagTypes = Object.keys(TYPES);
-export var deprecatedProps = {
-  /**
-   * **Deprecated** see property `actionBarOverflowAriaLabel`
-   */
-  actionBarOverflowLabel: deprecateProp(PropTypes.string, 'Property renamed to `actionBarOverflowAriaLabel`.'),
-
-  /**
-   * **Deprecated** see property `children`
-   */
-  availableSpace: deprecateProp(PropTypes.node, 'Make use of children instead.'),
-
-  /**
-   * **Deprecated** see property `hasBackgroundAlways`
-   */
-  background: deprecateProp(PropTypes.bool, 'Property renamed to `hasBackgroundAlways`'),
-
-  /**
-   * **Deprecated** see property `breadcrumbs`
-   */
-  breadcrumbItems: deprecateProp(PropTypes.element, 'Usage changed to expect breadcrumb item like shapes, see `breadcrumbs`.'),
-
-  /**
-   * **Deprecated** see property `breadcrumbOverflowAriaLabel`
-   */
-  breadcrumbOverflowLabel: deprecateProp(PropTypes.string, 'Property renamed to `breadcrumbOverflowAriaLabel`.'),
-
-  /**
-   * **Deprecated** see property `collapseHeaderIconDescription`
-   */
-  collapseHeaderLabel: deprecateProp(PropTypes.string, 'Property renamed to `collapseHeaderIconDescription`.'),
-
-  /**
-   * **Deprecated** see property `hasCollapseHeaderToggle`
-   */
-  collapseHeaderToggleWanted: deprecateProp(PropTypes.bool, 'Property renamed to `hasCollapseHeaderToggle`'),
-
-  /**
-   * **Deprecated** see property `expandHeaderIconDescription`
-   */
-  expandHeaderLabel: deprecateProp(PropTypes.string, 'Property renamed to `expandHeaderIconDescription`.'),
-
-  /**
-   * **Deprecated** no longer required
-   */
-  pageHeaderOffset: deprecateProp(PropTypes.number, 'Property removed as no longer required.'),
-
-  /**
-   * **Deprecated** see property `collapseTitle`
-   */
-  preCollapseTitleRow: deprecateProp(PropTypes.bool, 'Property renamed to `collapseTitle`.'),
-
-  /**
-   * **Deprecated** see property `disableBreadcrumbScroll`
-   */
-  preventBreadcrumbScroll: deprecateProp(PropTypes.bool, 'Prop renamed to `disableBreadcrumbScroll`.')
-};
-PageHeader.propTypes = _objectSpread({
+PageHeader.propTypes = {
   /**
    * Specifies the action bar items which are the final items in the row top of the PageHeader.
    * Each item is specified as an object with the properties of a Carbon Button in icon only form.
    * Button kind, size, tooltipPosition, tooltipAlignment and type are ignored.
    */
-  actionBarItems: deprecatePropUsage(PropTypes.arrayOf(PropTypes.shape(_objectSpread(_objectSpread({}, prepareProps(Button.propTypes, ['kind', 'size', 'tooltipPosition', 'tooltipAlignment'])), {}, {
+  actionBarItems: PropTypes.arrayOf(PropTypes.shape(_objectSpread(_objectSpread({}, prepareProps(Button.propTypes, ['kind', 'size', 'tooltipPosition', 'tooltipAlignment'])), {}, {
     iconDescription: PropTypes.string.isRequired,
     onClick: Button.propTypes.onClick,
     renderIcon: Button.propTypes.renderIcon.isRequired
-  }))), // expects action bar item as array or in fragment
-  PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element), PropTypes.element]), 'Expects an array of objects with the following properties: iconDescription, renderIcon and onClick.'),
+  }))),
 
   /**
    * class name applied to the action bar overflow options
@@ -581,9 +500,8 @@ PageHeader.propTypes = _objectSpread({
    * NOTE: This prop is required if actionBarItems are supplied
    */
   actionBarOverflowAriaLabel: PropTypes.string.isRequired.if(function (_ref8) {
-    var actionBarItems = _ref8.actionBarItems,
-        actionBarOverflowLabel = _ref8.actionBarOverflowLabel;
-    return actionBarItems && actionBarItems.length > 0 && !actionBarOverflowLabel;
+    var actionBarItems = _ref8.actionBarItems;
+    return actionBarItems && actionBarItems.length > 0;
   }),
 
   /**
@@ -618,9 +536,8 @@ PageHeader.propTypes = _objectSpread({
    * It is used in an overflow menu when there is insufficient space to display all breadcrumbs inline.
    */
   breadcrumbOverflowAriaLabel: PropTypes.string.isRequired.if(function (_ref9) {
-    var breadcrumbs = _ref9.breadcrumbs,
-        breadcrumbItems = _ref9.breadcrumbItems;
-    return breadcrumbs && breadcrumbs.length > 0 || breadcrumbItems && breadcrumbItems.length > 0;
+    var breadcrumbs = _ref9.breadcrumbs;
+    return breadcrumbs && breadcrumbs.length > 0;
   }),
 
   /**
@@ -853,7 +770,7 @@ PageHeader.propTypes = _objectSpread({
     breadcrumbContent: PropTypes.node,
     asText: PropTypes.string.isRequired
   })])
-}, deprecatedProps);
+};
 PageHeader.defaultProps = {
   fullWidthGrid: false,
   hasBackgroundAlways: true,

package/es/components/SidePanel/SidePanel.js

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["actionToolbarButtons", "actions", "animateTitle", "children", "className", "closeIconDescription", "condensedActions", "currentStep", "includeOverlay", "labelText", "navigationBackIconDescription", "onNavigationBack", "onRequestClose", "onUnmount", "open", "pageContentSelector", "placement", "preventCloseOnClickOutside", "selectorPageContent", "selectorPrimaryFocus", "size", "slideIn", "subtitle", "title"],
-    _excluded2 = ["label", "kind", "icon", "leading", "disabled", "className", "onClick", "onActionToolbarButtonClick"];
+var _excluded = ["actionToolbarButtons", "actions", "animateTitle", "children", "className", "closeIconDescription", "condensedActions", "currentStep", "includeOverlay", "labelText", "navigationBackIconDescription", "onNavigationBack", "onRequestClose", "onUnmount", "open", "placement", "preventCloseOnClickOutside", "selectorPageContent", "selectorPrimaryFocus", "size", "slideIn", "subtitle", "title"],
+    _excluded2 = ["label", "kind", "icon", "leading", "disabled", "className", "onClick"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -23,7 +23,7 @@ import cx from 'classnames';
 import { useResizeDetector } from 'react-resize-detector';
 import { moderate02 } from '@carbon/motion';
 import { getDevtoolsProps } from '../../global/js/utils/devtools';
-import { allPropTypes, deprecateProp } from '../../global/js/utils/props-helper';
+import { allPropTypes } from '../../global/js/utils/props-helper';
 import wrapFocus from '../../global/js/utils/wrapFocus';
 import { pkg } from '../../settings';
 import { SIDE_PANEL_SIZES } from './constants';
@@ -57,7 +57,6 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       onRequestClose = _ref.onRequestClose,
       onUnmount = _ref.onUnmount,
       open = _ref.open,
-      pageContentSelector = _ref.pageContentSelector,
       placement = _ref.placement,
       preventCloseOnClickOutside = _ref.preventCloseOnClickOutside,
       selectorPageContent = _ref.selectorPageContent,
@@ -318,7 +317,7 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 
   useEffect(function () {
     if (!open && slideIn) {
-      var pageContentElement = document.querySelector(selectorPageContent || pageContentSelector);
+      var pageContentElement = document.querySelector(selectorPageContent);
 
       if (placement && placement === 'right' && pageContentElement) {
         pageContentElement.style.marginRight = 0;
@@ -326,11 +325,11 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         pageContentElement.style.marginLeft = 0;
       }
     }
-  }, [open, placement, selectorPageContent, pageContentSelector, slideIn]); // used to set margins of content for slide in panel version
+  }, [open, placement, selectorPageContent, slideIn]); // used to set margins of content for slide in panel version
 
   useEffect(function () {
     if (shouldRender && slideIn) {
-      var pageContentElement = document.querySelector(selectorPageContent || pageContentSelector);
+      var pageContentElement = document.querySelector(selectorPageContent);
 
       if (placement && placement === 'right' && pageContentElement) {
         pageContentElement.style.marginRight = 0;
@@ -342,7 +341,7 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         pageContentElement.style.marginLeft = SIDE_PANEL_SIZES[size];
       }
     }
-  }, [slideIn, selectorPageContent, pageContentSelector, placement, shouldRender, size]); // adds focus trap functionality
+  }, [slideIn, selectorPageContent, placement, shouldRender, size]); // adds focus trap functionality
 
   /* istanbul ignore next */
 
@@ -403,8 +402,7 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           leading = _ref5.leading,
           disabled = _ref5.disabled,
           className = _ref5.className,
-          _onClick = _ref5.onClick,
-          onActionToolbarButtonClick = _ref5.onActionToolbarButtonClick,
+          onClick = _ref5.onClick,
           rest = _objectWithoutProperties(_ref5, _excluded2);
 
       return /*#__PURE__*/React.createElement(Button, _extends({}, rest, {
@@ -418,9 +416,7 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         hasIconOnly: !leading,
         disabled: disabled,
         className: cx(["".concat(blockClass, "__action-toolbar-button"), className, (_ref6 = {}, _defineProperty(_ref6, "".concat(blockClass, "__action-toolbar-icon-only-button"), icon && !leading), _defineProperty(_ref6, "".concat(blockClass, "__action-toolbar-leading-button"), leading), _ref6)]),
-        onClick: function onClick(event) {
-          return _onClick ? _onClick(event) : onActionToolbarButtonClick && onActionToolbarButtonClick(event);
-        }
+        onClick: onClick
       }), leading && label);
     })));
   };
@@ -486,16 +482,7 @@ export var SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 }); // Return a placeholder if not released and not enabled by feature flag
 
 SidePanel = pkg.checkComponentEnabled(SidePanel, componentName);
-export var deprecatedProps = {
-  /**
-   * **Deprecated**
-   *
-   * 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.
-   */
-  pageContentSelector: deprecateProp(PropTypes.string, 'This prop has been renamed to `selectorPageContent`.')
-};
-SidePanel.propTypes = _objectSpread({
+SidePanel.propTypes = {
   /**
    * Sets the action toolbar buttons
    */
@@ -503,7 +490,6 @@ SidePanel.propTypes = _objectSpread({
     label: PropTypes.string,
     leading: PropTypes.bool,
     icon: PropTypes.object,
-    onActionToolbarButtonClick: deprecateProp(PropTypes.func, 'This prop will be removed in the future. Please use `onClick` instead'),
     onClick: PropTypes.func,
     kind: PropTypes.oneOf(['ghost', 'tertiary', 'secondary', 'primary'])
   })),
@@ -611,9 +597,8 @@ SidePanel.propTypes = _objectSpread({
    * This prop is required when using the `slideIn` variant of the side panel.
    */
   selectorPageContent: PropTypes.string.isRequired.if(function (_ref7) {
-    var slideIn = _ref7.slideIn,
-        pageContentSelector = _ref7.pageContentSelector;
-    return slideIn && !pageContentSelector;
+    var slideIn = _ref7.slideIn;
+    return slideIn;
   }),
 
   /**
@@ -644,7 +629,7 @@ SidePanel.propTypes = _objectSpread({
     var labelText = _ref8.labelText;
     return labelText;
   })
-}, deprecatedProps);
+};
 SidePanel.defaultProps = {
   animateTitle: true,
   placement: 'right',

package/es/components/Tearsheet/Tearsheet.js

@@ -16,7 +16,7 @@ import React from 'react'; // Other standard imports.
 
 import PropTypes from 'prop-types';
 import { getDevtoolsProps } from '../../global/js/utils/devtools';
-import { allPropTypes, deprecateProp, prepareProps } from '../../global/js/utils/props-helper';
+import { allPropTypes, prepareProps } from '../../global/js/utils/props-helper';
 import { pkg } from '../../settings'; // Carbon and package components we use.
 
 import { Button } from 'carbon-components-react';
@@ -49,15 +49,6 @@ Tearsheet = pkg.checkComponentEnabled(Tearsheet, componentName); // The display
 
 Tearsheet.displayName = componentName;
 export var deprecatedProps = {
-  /**
-   * **Deprecated**
-   *
-   * Prevent the tearsheet from automatically closing (triggering onClose, if
-   * provided, which can be cancelled by returning 'false') if the user clicks
-   * outside it.
-   */
-  preventCloseOnClickOutside: deprecateProp(PropTypes.bool, 'The tearsheet will close automatically if the user clicks outside it if and only if the tearsheet is passive (no navigation actions)'),
-
   /**
    * **Deprecated**
    *

package/es/components/Tearsheet/TearsheetNarrow.js

@@ -16,7 +16,7 @@ import React from 'react'; // Other standard imports.
 
 import PropTypes from 'prop-types';
 import { getDevtoolsProps } from '../../global/js/utils/devtools';
-import { allPropTypes, deprecateProp, prepareProps } from '../../global/js/utils/props-helper';
+import { allPropTypes, prepareProps } from '../../global/js/utils/props-helper';
 import { pkg } from '../../settings'; // Carbon and package components we use.
 
 import { Button } from 'carbon-components-react';
@@ -45,15 +45,6 @@ TearsheetNarrow = pkg.checkComponentEnabled(TearsheetNarrow, componentName); //
 
 TearsheetNarrow.displayName = componentName;
 export var deprecatedProps = {
-  /**
-   * **Deprecated**
-   *
-   * Prevent the tearsheet from automatically closing (triggering onClose, if
-   * provided, which can be cancelled by returning 'false') if the user clicks
-   * outside it.
-   */
-  preventCloseOnClickOutside: deprecateProp(PropTypes.bool, 'The tearsheet will close automatically if the user clicks outside it if and only if the tearsheet is passive (no navigation actions)'),
-
   /**
    * **Deprecated**
    *

package/es/components/Tearsheet/TearsheetShell.js

@@ -21,7 +21,6 @@ import { useResizeDetector } from 'react-resize-detector'; // Other standard imp
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg, carbon } from '../../settings';
-import { deprecateProp } from '../../global/js/utils/props-helper';
 import pconsole from '../../global/js/utils/pconsole'; // Carbon and package components we use.
 
 import { Button, ComposedModal, ModalHeader, ModalBody } from 'carbon-components-react';
@@ -249,15 +248,6 @@ export var TearsheetShell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 
 TearsheetShell.displayName = componentName;
 export var deprecatedProps = {
-  /**
-   * **Deprecated**
-   *
-   * Prevent the tearsheet from automatically closing (triggering onClose, if
-   * provided, which can be cancelled by returning 'false') if the user clicks
-   * outside it.
-   */
-  preventCloseOnClickOutside: deprecateProp(PropTypes.bool, 'The tearsheet will close automatically if the user clicks outside it if and only if the tearsheet is passive (no navigation actions)'),
-
   /**
    * **Deprecated**
    *

package/es/components/UserProfileImage/UserProfileImage.js

@@ -20,7 +20,7 @@ import { pkg } from '../../settings'; // Carbon and package components we use.
 import { User20, User24, User32, Group20, Group24, Group32 } from '@carbon/icons-react';
 import { TooltipIcon } from 'carbon-components-react'; // The block part of our conventional BEM class names (blockClass__E--M).
 
-var blockClass = "".concat(pkg.prefix, "-user-profile-avatar");
+var blockClass = "".concat(pkg.prefix, "--user-profile-image");
 var componentName = 'UserProfileImage'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
 /**

package/es/components/index.js

@@ -8,7 +8,6 @@ export { AboutModal } from './AboutModal';
 export { APIKeyModal } from './APIKeyModal';
 export { Cascade } from './Cascade';
 export { ComboButton, ComboButtonItem } from './ComboButton';
-export { ContextHeader } from './ContextHeader';
 export { CreateFullPage, CreateFullPageStep } from './CreateFullPage';
 export { CreateModal } from './CreateModal';
 export { CreateSidePanel } from './CreateSidePanel';

package/es/global/js/package-settings.js

@@ -12,7 +12,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 //
 import { devtoolsAttribute, getDevtoolsId } from './utils/devtools';
 var defaults = {
-  prefix: 'exp',
+  prefix: 'c4p',
   // by default only released components are set to true
   component: {
     // reviewed and released components:
@@ -52,7 +52,6 @@ var defaults = {
     UnauthorizedEmptyState: true,
     UserProfileImage: true,
     // other public components not yet reviewed and released:
-    ContextHeader: false,
     ExampleComponent: false,
     LoadingBar: false,
     ModifiedTabs: false,

package/lib/components/ActionBar/ActionBar.js

@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.deprecatedProps = exports.ActionBar = void 0;
+exports.ActionBar = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
@@ -37,7 +37,7 @@ var _ActionBarItem = require("./ActionBarItem");
 
 var _ActionBarOverflowItems = require("./ActionBarOverflowItems");
 
-var _excluded = ["actions", "children", "className", "maxVisible", "menuOptionsClass", "onWidthChange", "overflowAriaLabel", "rightAlign"],
+var _excluded = ["actions", "className", "maxVisible", "menuOptionsClass", "onWidthChange", "overflowAriaLabel", "rightAlign"],
     _excluded2 = ["key"],
     _excluded3 = ["key"];
 
@@ -59,7 +59,6 @@ var componentName = 'ActionBar'; // NOTE: the component SCSS is not imported her
 
 var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var actions = _ref.actions,
-      children = _ref.children,
       className = _ref.className,
       maxVisible = _ref.maxVisible,
       menuOptionsClass = _ref.menuOptionsClass,
@@ -84,28 +83,12 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       setHiddenSizingItems = _useState6[1];
 
   var internalId = (0, _react.useRef)((0, _uuidv.default)());
-
-  var _useState7 = (0, _react.useState)([]),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      itemArray = _useState8[0],
-      setItemArray = _useState8[1];
-
   var refDisplayedItems = (0, _react.useRef)(null);
   var sizingRef = (0, _react.useRef)(null);
-  var sizes = (0, _react.useRef)({}); // create child array from children which may be a fragment and create hidden sizing items
+  var sizes = (0, _react.useRef)({}); // create hidden sizing items
 
   (0, _react.useEffect)(function () {
-    // NOTE: setting item Array inside useEffect prevents looping renders as a result of setting hiddenSizingItems
-    var newItemArray;
-
-    if (actions) {
-      newItemArray = actions;
-    } else {
-      newItemArray = (0, _propsHelper.extractShapesArray)(children);
-    }
-
-    setItemArray(newItemArray); // Hidden action bar and items used to calculate sizes
-
+    // Hidden action bar and items used to calculate sizes
     setHiddenSizingItems( /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(blockClass, "__hidden-sizing-items"),
       "aria-hidden": true,
@@ -115,7 +98,7 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       overflowAriaLabel: "hidden sizing overflow items",
       overflowItems: [],
       key: "hidden-overflow-menu"
-    }), newItemArray.map(function (_ref2) {
+    }), actions.map(function (_ref2) {
       var key = _ref2.key,
           rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
       return /*#__PURE__*/_react.default.createElement(_ActionBarItem.ActionBarItem, (0, _extends2.default)({}, rest, {
@@ -123,11 +106,11 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
         className: "".concat(blockClass, "__hidden-sizing-item")
       }));
     })));
-  }, [actions, children]); // creates displayed items based on itemArray, displayCount and alignment
+  }, [actions]); // creates displayed items based on actions, displayCount and alignment
 
   (0, _react.useEffect)(function () {
     // Calculate the displayed items
-    var newDisplayedItems = itemArray.map(function (_ref3) {
+    var newDisplayedItems = actions.map(function (_ref3) {
       var key = _ref3.key,
           rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded3);
       return /*#__PURE__*/_react.default.createElement(_ActionBarItem.ActionBarItem, (0, _extends2.default)({}, rest, {
@@ -147,7 +130,7 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     }
 
     setDisplayedItems(newDisplayedItems);
-  }, [itemArray, displayCount, overflowAriaLabel, menuOptionsClass]); // determine display count based on space available and width of pageActions
+  }, [actions, displayCount, overflowAriaLabel, menuOptionsClass]); // determine display count based on space available and width of pageActions
 
   var checkFullyVisibleItems = function checkFullyVisibleItems() {
     /* istanbul ignore if */
@@ -202,7 +185,7 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
   (0, _react.useEffect)(function () {
     checkFullyVisibleItems(); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [maxVisible, itemArray]);
+  }, [maxVisible, hiddenSizingItems]);
   /* istanbul ignore next */
   // not sure how to fake window resize
 
@@ -247,17 +230,8 @@ var ActionBar = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 });
 
 exports.ActionBar = ActionBar;
-var deprecatedProps = {
-  /**
-   * **Deprecated**
-   *
-   * children of the action bar (action bar items)
-   */
-  children: (0, _propsHelper.deprecateProp)(_propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.element), _propTypes.default.element]), 'See documentation on the `actions` prop.')
-};
-exports.deprecatedProps = deprecatedProps;
 ActionBar.displayName = componentName;
-ActionBar.propTypes = _objectSpread({
+ActionBar.propTypes = {
   /**
    * Specifies the action bar items. Each item is specified as an object
    * with required fields: key for array rendering, renderIcon and
@@ -314,7 +288,7 @@ ActionBar.propTypes = _objectSpread({
    * align tags to right of available space
    */
   rightAlign: _propTypes.default.bool
-}, deprecatedProps);
+};
 ActionBar.defaultProps = {
   rightAlign: false
 };