@carbon/ibm-products 1.5.0 → 1.8.0

package/lib/components/RemoveModal/RemoveModal.js

@@ -206,7 +206,4 @@ RemoveModal.propTypes = {
    */
   title: _propTypes.default.string.isRequired
 };
-RemoveModal.defaultProps = {
-  textConfirmation: false
-};
 RemoveModal.displayName = componentName;

package/lib/components/SidePanel/SidePanel.js

@@ -58,7 +58,16 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var blockClass = "".concat(_settings.pkg.prefix, "--side-panel");
 var componentName = 'SidePanel'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
+// Default values for props
 
+var defaults = {
+  animateTitle: true,
+  closeIconDescription: 'Close',
+  currentStep: 0,
+  navigationBackIconDescription: 'Back',
+  placement: 'right',
+  size: 'md'
+};
 /**
  * Side panels keep users in-context of a page while performing tasks like navigating, editing, viewing details, or configuring something new.
  */
@@ -68,24 +77,30 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
   var actionToolbarButtons = _ref.actionToolbarButtons,
       actions = _ref.actions,
-      animateTitle = _ref.animateTitle,
+      _ref$animateTitle = _ref.animateTitle,
+      animateTitle = _ref$animateTitle === void 0 ? defaults.animateTitle : _ref$animateTitle,
       children = _ref.children,
       className = _ref.className,
-      closeIconDescription = _ref.closeIconDescription,
+      _ref$closeIconDescrip = _ref.closeIconDescription,
+      closeIconDescription = _ref$closeIconDescrip === void 0 ? defaults.closeIconDescription : _ref$closeIconDescrip,
       condensedActions = _ref.condensedActions,
-      currentStep = _ref.currentStep,
+      _ref$currentStep = _ref.currentStep,
+      currentStep = _ref$currentStep === void 0 ? defaults.currentStep : _ref$currentStep,
       includeOverlay = _ref.includeOverlay,
       labelText = _ref.labelText,
-      navigationBackIconDescription = _ref.navigationBackIconDescription,
+      _ref$navigationBackIc = _ref.navigationBackIconDescription,
+      navigationBackIconDescription = _ref$navigationBackIc === void 0 ? defaults.navigationBackIconDescription : _ref$navigationBackIc,
       onNavigationBack = _ref.onNavigationBack,
       onRequestClose = _ref.onRequestClose,
       onUnmount = _ref.onUnmount,
       open = _ref.open,
-      placement = _ref.placement,
+      _ref$placement = _ref.placement,
+      placement = _ref$placement === void 0 ? defaults.placement : _ref$placement,
       preventCloseOnClickOutside = _ref.preventCloseOnClickOutside,
       selectorPageContent = _ref.selectorPageContent,
       selectorPrimaryFocus = _ref.selectorPrimaryFocus,
-      size = _ref.size,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? defaults.size : _ref$size,
       slideIn = _ref.slideIn,
       subtitle = _ref.subtitle,
       title = _ref.title,
@@ -113,8 +128,12 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var sidePanelInnerRef = (0, _react.useRef)();
   var sidePanelCloseRef = (0, _react.useRef)();
   var previousState = (0, _hooks.usePreviousValue)({
-    size: size
-  }); // scroll panel to top going between steps
+    size: size,
+    open: open
+  });
+  var reducedMotion = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
+    matches: true
+  }; // scroll panel to top going between steps
 
   (0, _react.useEffect)(function () {
     var panelRef = ref || sidePanelRef;
@@ -193,7 +212,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
 
   (0, _react.useEffect)(function () {
-    if (open && animateTitle && animationComplete && title && title.length) {
+    if (open && animateTitle && animationComplete && title && title.length && !reducedMotion.matches) {
       var _document$querySelect2, _document$querySelect3, _document$querySelect4;
 
       var sidePanelOuter = document.querySelector("#".concat(blockClass, "-outer"));
@@ -285,7 +304,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       _sidePanelOuter === null || _sidePanelOuter === void 0 ? void 0 : _sidePanelOuter.style.setProperty("--".concat(blockClass, "--subtitle-container-height"), "".concat(_sidePanelSubtitleElementHeight, "px"));
       _sidePanelOuter === null || _sidePanelOuter === void 0 ? void 0 : _sidePanelOuter.style.setProperty("--".concat(blockClass, "--action-bar-container-height"), "".concat(sidePanelActionBarElementHeight, "px"));
     }
-  }, [open, animateTitle, animationComplete, shouldRender, panelHeight, title, size]); // click outside functionality if `includeOverlay` prop is set
+  }, [open, animateTitle, animationComplete, shouldRender, panelHeight, title, size, reducedMotion.matches]); // click outside functionality if `includeOverlay` prop is set
 
   (0, _react.useEffect)(function () {
     var handleOutsideClick = function handleOutsideClick(event) {
@@ -311,7 +330,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     return function () {
       document.removeEventListener('click', handleOutsideClick);
     };
-  }, [includeOverlay, onRequestClose, open, preventCloseOnClickOutside, ref]); // initialize the side panel to open
+  }, [includeOverlay, onRequestClose, open, preventCloseOnClickOutside, ref, onUnmount]); // initialize the side panel to open
 
   (0, _react.useEffect)(function () {
     if (open) {
@@ -321,14 +340,21 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
   var onAnimationEnd = function onAnimationEnd() {
     if (!open) {
-      onUnmount && onUnmount();
+      onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
       setRender(false);
     }
 
     setAnimationComplete(true);
-  }; // initializes the side panel to open
+  }; // Set the internal state `animationComplete` to true if
+  // prefers reduced motion is true
 
 
+  (0, _react.useEffect)(function () {
+    if (reducedMotion.matches) {
+      setAnimationComplete(true);
+    }
+  }, [reducedMotion.matches]); // initializes the side panel to open
+
   var _onAnimationStart = function onAnimationStart(event) {
     event.persist();
     var isPanelTarget = event.target.id === "".concat(blockClass, "-outer");
@@ -349,7 +375,13 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
         pageContentElement.style.marginLeft = 0;
       }
     }
-  }, [open, placement, selectorPageContent, slideIn]); // used to set margins of content for slide in panel version
+  }, [open, placement, selectorPageContent, slideIn]);
+  (0, _react.useEffect)(function () {
+    if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion.matches) {
+      setRender(false);
+      onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
+    }
+  }, [open, onUnmount, reducedMotion.matches, previousState === null || previousState === void 0 ? void 0 : previousState.open]); // used to set margins of content for slide in panel version
 
   (0, _react.useEffect)(function () {
     if (shouldRender && slideIn) {
@@ -357,15 +389,15 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
       if (placement && placement === 'right' && pageContentElement) {
         pageContentElement.style.marginRight = 0;
-        pageContentElement.style.transition = "margin-right ".concat(_motion.moderate02);
+        pageContentElement.style.transition = !reducedMotion.matches ? "margin-right ".concat(_motion.moderate02) : null;
         pageContentElement.style.marginRight = _constants.SIDE_PANEL_SIZES[size];
       } else if (pageContentElement) {
         pageContentElement.style.marginLeft = 0;
-        pageContentElement.style.transition = "margin-left ".concat(_motion.moderate02);
+        pageContentElement.style.transition = !reducedMotion.matches ? "margin-left ".concat(_motion.moderate02) : null;
         pageContentElement.style.marginLeft = _constants.SIDE_PANEL_SIZES[size];
       }
     }
-  }, [slideIn, selectorPageContent, placement, shouldRender, size]); // adds focus trap functionality
+  }, [slideIn, selectorPageContent, placement, shouldRender, size, reducedMotion.matches]); // adds focus trap functionality
 
   /* istanbul ignore next */
 
@@ -392,7 +424,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     var _cx, _cx2;
 
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)("".concat(blockClass, "__title-container"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step"), currentStep > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step-without-title"), currentStep > 0 && !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--no-title-animation"), !animateTitle), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-is-animating"), !animationComplete || !open), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-without-title"), !title), _cx))
+      className: (0, _classnames.default)("".concat(blockClass, "__title-container"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step"), currentStep > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step-without-title"), currentStep > 0 && !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--no-title-animation"), !animateTitle), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-is-animating"), !animationComplete || !open), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-without-title"), !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--reduced-motion"), reducedMotion.matches), _cx))
     }, currentStep > 0 && /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
       "aria-label": navigationBackIconDescription,
       kind: "ghost",
@@ -449,7 +481,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       className: "".concat(blockClass, "__title-text"),
       title: title,
       "aria-hidden": false
-    }, title), animateTitle && title && title.length && /*#__PURE__*/_react.default.createElement("h2", {
+    }, title), animateTitle && title && title.length && !reducedMotion.matches && /*#__PURE__*/_react.default.createElement("h2", {
       className: "".concat(blockClass, "__collapsed-title-text"),
       title: title,
       "aria-hidden": true
@@ -466,7 +498,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     id: "".concat(blockClass, "-outer"),
     className: mainPanelClassNames,
     style: {
-      animation: "".concat(open ? placement === 'right' ? "sidePanelEntranceRight ".concat(_motion.moderate02) : "sidePanelEntranceLeft ".concat(_motion.moderate02) : placement === 'right' ? "sidePanelExitRight ".concat(_motion.moderate02) : "sidePanelExitLeft ".concat(_motion.moderate02))
+      animation: !reducedMotion.matches ? "".concat(open ? placement === 'right' ? "side-panel-entrance-right ".concat(_motion.moderate02) : "side-panel-entrance-left ".concat(_motion.moderate02) : placement === 'right' ? "side-panel-exit-right ".concat(_motion.moderate02) : "side-panel-exit-left ".concat(_motion.moderate02)) : null
     },
     onAnimationEnd: onAnimationEnd,
     onAnimationStart: function onAnimationStart(event) {
@@ -499,7 +531,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     ref: sidePanelOverlayRef,
     className: "".concat(blockClass, "__overlay"),
     style: {
-      animation: "".concat(open ? "sidePanelOverlayEntrance ".concat(_motion.moderate02) : "sidePanelOverlayExit ".concat(_motion.moderate02))
+      animation: !reducedMotion.matches ? "".concat(open ? "side-panel-overlay-entrance ".concat(_motion.moderate02) : "side-panel-overlay-exit ".concat(_motion.moderate02)) : null
     }
   }));
 }); // Return a placeholder if not released and not enabled by feature flag
@@ -558,7 +590,7 @@ SidePanel.propTypes = {
   /**
    * Sets the close button icon description
    */
-  closeIconDescription: _propTypes.default.string.isRequired,
+  closeIconDescription: _propTypes.default.string,
 
   /**
    * Determines whether the side panel should render the condensed version (affects action buttons primarily)
@@ -655,14 +687,4 @@ SidePanel.propTypes = {
     return labelText;
   })
 };
-SidePanel.defaultProps = {
-  animateTitle: true,
-  placement: 'right',
-  size: 'md',
-  slideIn: false,
-  currentStep: 0,
-  navigationBackIconDescription: 'Back',
-  closeIconDescription: 'Close',
-  preventCloseOnClickOutside: false
-};
 SidePanel.displayName = componentName;

package/lib/components/TagSet/TagSet.js

@@ -51,15 +51,24 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var componentName = 'TagSet';
 var blockClass = "".concat(_settings.pkg.prefix, "--tag-set");
-var allTagsModalSearchThreshold = 10;
+var allTagsModalSearchThreshold = 10; // Default values for props
+
+var defaults = {
+  align: 'start',
+  overflowAlign: 'center',
+  overflowDirection: 'bottom'
+};
 
 var TagSet = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
-  var align = _ref.align,
+  var _ref$align = _ref.align,
+      align = _ref$align === void 0 ? defaults.align : _ref$align,
       className = _ref.className,
       maxVisible = _ref.maxVisible,
-      overflowAlign = _ref.overflowAlign,
+      _ref$overflowAlign = _ref.overflowAlign,
+      overflowAlign = _ref$overflowAlign === void 0 ? defaults.overflowAlign : _ref$overflowAlign,
       overflowClassName = _ref.overflowClassName,
-      overflowDirection = _ref.overflowDirection,
+      _ref$overflowDirectio = _ref.overflowDirection,
+      overflowDirection = _ref$overflowDirectio === void 0 ? defaults.overflowDirection : _ref$overflowDirectio,
       allTagsModalTitle = _ref.allTagsModalTitle,
       allTagsModalSearchLabel = _ref.allTagsModalSearchLabel,
       allTagsModalSearchPlaceholderText = _ref.allTagsModalSearchPlaceholderText,
@@ -345,11 +354,6 @@ TagSet.propTypes = {
     type: _propTypes.default.oneOf(tagTypes)
   })))
 };
-TagSet.defaultProps = {
-  align: 'start',
-  overflowAlign: 'center',
-  overflowDirection: 'bottom'
-};
 TagSet.displayName = componentName;
 var _default = TagSet;
 exports.default = _default;

package/lib/components/TagSet/TagSetModal.js

@@ -13,10 +13,10 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -29,7 +29,8 @@ var _settings = require("../../settings");
 
 var _propsHelper = require("../../global/js/utils/props-helper");
 
-var _excluded = ["label"];
+var _excluded = ["allTags", "className", "title", "onClose", "open", "searchLabel", "searchPlaceholder"],
+    _excluded2 = ["label"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -40,7 +41,12 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var componentName = 'TagSetModal';
-var blockClass = "".concat(_settings.pkg.prefix, "--tag-set-modal");
+var blockClass = "".concat(_settings.pkg.prefix, "--tag-set-modal"); // Default values for props
+
+var defaults = {
+  // marked as required by TagSet if needed, default used to satisfy <Search /> component
+  searchLabel: ''
+};
 
 var TagSetModal = function TagSetModal(_ref) {
   var allTags = _ref.allTags,
@@ -48,8 +54,10 @@ var TagSetModal = function TagSetModal(_ref) {
       title = _ref.title,
       onClose = _ref.onClose,
       open = _ref.open,
-      searchLabel = _ref.searchLabel,
-      searchPlaceholder = _ref.searchPlaceholder;
+      _ref$searchLabel = _ref.searchLabel,
+      searchLabel = _ref$searchLabel === void 0 ? defaults.searchLabel : _ref$searchLabel,
+      searchPlaceholder = _ref.searchPlaceholder,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   var _useState = (0, _react.useState)([]),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -89,13 +97,13 @@ var TagSetModal = function TagSetModal(_ref) {
     setSearch(ev.target.value || '');
   };
 
-  return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ComposedModal, {
+  return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ComposedModal, (0, _extends2.default)({}, rest, {
     containerClassName: "".concat(blockClass, "__container"),
     className: (0, _classnames.default)(className, "".concat(blockClass)),
     size: "sm",
     open: open,
     onClose: onClose
-  }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ModalHeader, {
+  }), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ModalHeader, {
     title: title,
     className: "".concat(blockClass, "__header")
   }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Search, {
@@ -110,7 +118,7 @@ var TagSetModal = function TagSetModal(_ref) {
     hasForm: true
   }, filteredModalTags.map(function (_ref2, index) {
     var label = _ref2.label,
-        other = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+        other = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
     return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Tag, (0, _extends2.default)({}, other, {
       filter: false,
       key: "all-tags-".concat(index)
@@ -132,8 +140,4 @@ TagSetModal.propTypes = {
   searchPlaceholder: _propTypes.default.string,
   title: _propTypes.default.string
 };
-TagSetModal.defaultProps = {
-  // marked as required by TagSet if needed, default used to satisfy <Search /> component
-  searchLabel: ''
-};
 TagSetModal.displayName = componentName;

package/lib/components/TagSet/TagSetOverflow.js

@@ -9,10 +9,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TagSetOverflow = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -25,27 +29,33 @@ var _settings = require("../../settings");
 
 var _pconsole = require("../../global/js/utils/pconsole");
 
+var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "overflowAlign", "overflowDirection", "overflowTags", "showAllTagsLabel"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-//
-// 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.
-//
 var componentName = 'TagSetOverflow';
-var blockClass = "".concat(_settings.pkg.prefix, "--tag-set-overflow");
+var blockClass = "".concat(_settings.pkg.prefix, "--tag-set-overflow"); // Default values for props
+
+var defaults = {
+  allTagsModalSearchThreshold: 10,
+  overflowAlign: 'center',
+  overflowDirection: 'bottom'
+};
 
 var TagSetOverflow = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-      overflowTags = _ref.overflowTags,
+  var _ref$allTagsModalSear = _ref.allTagsModalSearchThreshold,
+      allTagsModalSearchThreshold = _ref$allTagsModalSear === void 0 ? defaults.allTagsModalSearchThreshold : _ref$allTagsModalSear,
+      className = _ref.className,
       onShowAllClick = _ref.onShowAllClick,
-      overflowAlign = _ref.overflowAlign,
-      overflowDirection = _ref.overflowDirection,
+      _ref$overflowAlign = _ref.overflowAlign,
+      overflowAlign = _ref$overflowAlign === void 0 ? defaults.overflowAlign : _ref$overflowAlign,
+      _ref$overflowDirectio = _ref.overflowDirection,
+      overflowDirection = _ref$overflowDirectio === void 0 ? defaults.overflowDirection : _ref$overflowDirectio,
+      overflowTags = _ref.overflowTags,
       showAllTagsLabel = _ref.showAllTagsLabel,
-      allTagsModalSearchThreshold = _ref.allTagsModalSearchThreshold;
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -66,11 +76,11 @@ var TagSetOverflow = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
     onShowAllClick();
   };
 
-  return /*#__PURE__*/_react.default.createElement("span", {
+  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, rest, {
     "aria-hidden": overflowTags.length === 0,
     className: (0, _classnames.default)("".concat(blockClass), (0, _defineProperty2.default)({}, "".concat(blockClass, "--hidden"), overflowTags.length === 0)),
     ref: ref
-  }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Tooltip, {
+  }), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Tooltip, {
     align: overflowAlign,
     className: (0, _classnames.default)(className, "".concat(blockClass, "__tooltip")),
     direction: overflowDirection,
@@ -139,9 +149,4 @@ TagSetOverflow.propTypes = {
    * label for the overflow show all tags link
    */
   showAllTagsLabel: _propTypes.default.string
-};
-TagSetOverflow.defaultProps = {
-  allTagsModalSearchThreshold: 10,
-  overflowAlign: 'center',
-  overflowDirection: 'bottom'
 };

package/lib/components/Tearsheet/Tearsheet.js

@@ -9,7 +9,7 @@ exports.deprecatedProps = exports.Tearsheet = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -27,12 +27,20 @@ var _ActionSet = require("../ActionSet");
 
 var _TearsheetShell = require("./TearsheetShell");
 
+var _excluded = ["influencerPosition", "influencerWidth", "verticalPosition"];
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var componentName = 'Tearsheet'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
+// Default values for props
 
+var defaults = {
+  influencerPosition: 'left',
+  influencerWidth: 'narrow',
+  verticalPosition: 'lower'
+};
 /**
  * A tearsheet is a mostly full-screen type of dialog that keeps users
  * in-context and focused by bringing actionable content front and center while
@@ -46,11 +54,21 @@ var componentName = 'Tearsheet'; // NOTE: the component SCSS is not imported her
  * action buttons.
  */
 
-var Tearsheet = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  return /*#__PURE__*/_react.default.createElement(_TearsheetShell.TearsheetShell, (0, _extends2.default)({}, (0, _devtools.getDevtoolsProps)(componentName), (0, _propsHelper.prepareProps)(props, [], {
+var Tearsheet = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
+  var _ref$influencerPositi = _ref.influencerPosition,
+      influencerPosition = _ref$influencerPositi === void 0 ? defaults.influencerPosition : _ref$influencerPositi,
+      _ref$influencerWidth = _ref.influencerWidth,
+      influencerWidth = _ref$influencerWidth === void 0 ? defaults.influencerWidth : _ref$influencerWidth,
+      _ref$verticalPosition = _ref.verticalPosition,
+      verticalPosition = _ref$verticalPosition === void 0 ? defaults.verticalPosition : _ref$verticalPosition,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_TearsheetShell.TearsheetShell, _objectSpread(_objectSpread(_objectSpread({}, (0, _devtools.getDevtoolsProps)(componentName)), rest), {}, {
+    influencerPosition: influencerPosition,
+    influencerWidth: influencerWidth,
+    verticalPosition: verticalPosition,
     ref: ref,
     size: 'wide'
-  })));
+  }));
 }); // Return a placeholder if not released and not enabled by feature flag
 
 
@@ -112,9 +130,9 @@ Tearsheet.propTypes = _objectSpread({
    * **Note:** This prop is only required if a close icon is shown, i.e. if
    * there are a no navigation actions and/or hasCloseIcon is true.
    */
-  closeIconDescription: _propTypes.default.string.isRequired.if(function (_ref) {
-    var actions = _ref.actions,
-        hasCloseIcon = _ref.hasCloseIcon;
+  closeIconDescription: _propTypes.default.string.isRequired.if(function (_ref2) {
+    var actions = _ref2.actions,
+        hasCloseIcon = _ref2.hasCloseIcon;
     return (0, _TearsheetShell.tearsheetHasCloseIcon)(actions, hasCloseIcon);
   }),
 
@@ -180,13 +198,4 @@ Tearsheet.propTypes = _objectSpread({
    * The main title of the tearsheet, displayed in the header area.
    */
   title: _propTypes.default.node
-}, deprecatedProps); // Default values for component props. Default values are not required for
-// props that are required, nor for props where the component can apply
-// 'undefined' values reasonably. Default values should be provided when the
-// component needs to make a choice or assumption when a prop is not supplied.
-
-Tearsheet.defaultProps = {
-  influencerPosition: 'left',
-  influencerWidth: 'narrow',
-  verticalPosition: 'lower'
-};
+}, deprecatedProps);

package/lib/components/Tearsheet/TearsheetNarrow.js

@@ -9,7 +9,7 @@ exports.deprecatedProps = exports.TearsheetNarrow = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -27,12 +27,18 @@ var _ActionSet = require("../ActionSet");
 
 var _TearsheetShell = require("./TearsheetShell");
 
+var _excluded = ["verticalPosition"];
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var componentName = 'TearsheetNarrow'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
+// Default values for props
 
+var defaults = {
+  verticalPosition: 'lower'
+};
 /**
  * A narrow tearsheet is a slimmer variant of the tearsheet, providing a dialog
  * that keeps users in-context and focused by bringing actionable content front
@@ -42,11 +48,15 @@ var componentName = 'TearsheetNarrow'; // NOTE: the component SCSS is not import
  * main content area, and a set of action buttons.
  */
 
-var TearsheetNarrow = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  return /*#__PURE__*/_react.default.createElement(_TearsheetShell.TearsheetShell, (0, _extends2.default)({}, (0, _devtools.getDevtoolsProps)(componentName), (0, _propsHelper.prepareProps)(props, _TearsheetShell.tearsheetShellWideProps, {
+var TearsheetNarrow = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
+  var _ref$verticalPosition = _ref.verticalPosition,
+      verticalPosition = _ref$verticalPosition === void 0 ? defaults.verticalPosition : _ref$verticalPosition,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_TearsheetShell.TearsheetShell, _objectSpread(_objectSpread(_objectSpread({}, (0, _devtools.getDevtoolsProps)(componentName)), (0, _propsHelper.prepareProps)(rest, _TearsheetShell.tearsheetShellWideProps)), {}, {
+    verticalPosition: verticalPosition,
     ref: ref,
     size: 'narrow'
-  })));
+  }));
 }); // Return a placeholder if not released and not enabled by feature flag
 
 
@@ -108,9 +118,9 @@ TearsheetNarrow.propTypes = _objectSpread({
    * **Note:** This prop is only required if a close icon is shown, i.e. if
    * there are a no navigation actions and/or hasCloseIcon is true.
    */
-  closeIconDescription: _propTypes.default.string.isRequired.if(function (_ref) {
-    var actions = _ref.actions,
-        hasCloseIcon = _ref.hasCloseIcon;
+  closeIconDescription: _propTypes.default.string.isRequired.if(function (_ref2) {
+    var actions = _ref2.actions,
+        hasCloseIcon = _ref2.hasCloseIcon;
     return (0, _TearsheetShell.tearsheetHasCloseIcon)(actions, hasCloseIcon);
   }),
 
@@ -150,11 +160,4 @@ TearsheetNarrow.propTypes = _objectSpread({
    * The main title of the tearsheet, displayed in the header area.
    */
   title: _propTypes.default.node
-}, deprecatedProps); // Default values for component props. Default values are not required for
-// props that are required, nor for props where the component can apply
-// 'undefined' values reasonably. Default values should be provided when the
-// component needs to make a choice or assumption when a prop is not supplied.
-
-TearsheetNarrow.defaultProps = {
-  verticalPosition: 'lower'
-};
+}, deprecatedProps);

package/lib/components/Tearsheet/TearsheetShell.js

@@ -146,10 +146,9 @@ var TearsheetShell = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
     setTimeout(function () {
       return element.focus();
     }, 1);
-  }; // Hook called whenever the tearsheet mounts, unmounts, or 'open' changes.
+  };
 
-
-  (0, _react.useLayoutEffect)(function () {
+  (0, _react.useEffect)(function () {
     var notify = function notify() {
       return stack.all.forEach(function (handler) {
         handler(Math.min(stack.open.length, maxDepth), stack.open.indexOf(handler) + 1);

package/lib/components/Toolbar/ToolbarButton.js

@@ -69,7 +69,4 @@ ToolbarButton.propTypes = {
   /** Provide an optional class to be applied to the containing node */
   className: _propTypes.string
 };
-ToolbarButton.defaultProps = {
-  caret: false
-};
 exports.ToolbarButton = ToolbarButton = _settings.pkg.checkComponentEnabled(ToolbarButton, componentName);