@carbon/ibm-products 2.61.0 → 2.62.0-rc.0

package/es/components/CoachmarkFixed/CoachmarkFixed.js

@@ -45,12 +45,12 @@ var CoachmarkFixed = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   var children = _ref.children,
     className = _ref.className,
     _ref$onClose = _ref.onClose,
-    onClose = _ref$onClose === undefined ? defaults.onClose : _ref$onClose,
+    onClose = _ref$onClose === void 0 ? defaults.onClose : _ref$onClose,
     portalTarget = _ref.portalTarget,
     _ref$tagline = _ref.tagline,
-    tagline = _ref$tagline === undefined ? defaults.tagline : _ref$tagline,
+    tagline = _ref$tagline === void 0 ? defaults.tagline : _ref$tagline,
     _ref$theme = _ref.theme,
-    theme = _ref$theme === undefined ? defaults.theme : _ref$theme,
+    theme = _ref$theme === void 0 ? defaults.theme : _ref$theme,
     rest = _objectWithoutProperties(_ref, _excluded);
   var overlayRef = useRef(null);
   var portalNode = useRef(null);
@@ -80,7 +80,7 @@ var CoachmarkFixed = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   var shouldReduceMotion = usePrefersReducedMotion();
   useIsomorphicEffect(function () {
     var _document$querySelect, _document, _document2, _document3;
-    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === undefined ? undefined : _document.querySelector(portalTarget)) !== null && _document$querySelect !== undefined ? _document$querySelect : (_document2 = document) === null || _document2 === undefined ? undefined : _document2.querySelector('body') : (_document3 = document) === null || _document3 === undefined ? undefined : _document3.querySelector('body');
+    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === void 0 ? void 0 : _document.querySelector(portalTarget)) !== null && _document$querySelect !== void 0 ? _document$querySelect : (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.querySelector('body') : (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.querySelector('body');
   }, [portalTarget]);
   var handleClose = useCallback(function () {
     if (shouldReduceMotion) {
@@ -168,7 +168,7 @@ var CoachmarkFixed = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement(CoachmarkTagline, {
     title: tagline,
     onClose: onClose
-  }), isOpen && (portalNode === null || portalNode === undefined ? undefined : portalNode.current) && /*#__PURE__*/createPortal(/*#__PURE__*/React__default.createElement(CoachmarkOverlay, {
+  }), isOpen && (portalNode === null || portalNode === void 0 ? void 0 : portalNode.current) && /*#__PURE__*/createPortal(/*#__PURE__*/React__default.createElement(CoachmarkOverlay, {
     ref: overlayRef,
     fixedIsVisible: fixedIsVisible,
     kind: COACHMARK_OVERLAY_KIND.FIXED,
@@ -177,7 +177,7 @@ var CoachmarkFixed = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     theme: theme,
     className: cx(fixedIsVisible && "".concat(overlayBlockClass, "--is-visible"), overlayBlockClass)
   }, children), // Default to `document.body` when `portalNode` is `null`
-  portalNode === null || portalNode === undefined ? undefined : portalNode.current)));
+  portalNode === null || portalNode === void 0 ? void 0 : portalNode.current)));
 });
 
 // Return a placeholder if not released and not enabled by feature flag

package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.d.ts

@@ -20,16 +20,6 @@ export interface CoachmarkOverlayElementsProps {
      * managed in the parent component.
      */
     isVisible?: boolean;
-    /**
-     * The object describing an image in one of two shapes.
-     * If a single media element is required, use `{render}`.
-     * If a stepped animation is required, use `{filePaths}`.
-     * * @deprecated please use the `renderMedia` prop
-     */
-    media?: {
-        render?: () => ReactNode;
-        filePaths?: string[];
-    };
     /**
      * Optional prop to render any media like images or any animated media.
      */

package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js

@@ -11,7 +11,6 @@ import React__default, { useRef, useState, Children, useMemo, useEffect } from '
 import { Carousel } from '../Carousel/Carousel.js';
 import '../Carousel/CarouselItem.js';
 import PropTypes from '../../_virtual/index.js';
-import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia/SteppedAnimatedMedia.js';
 import { clamp } from '../../global/js/utils/clamp.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -20,7 +19,7 @@ import { pkg } from '../../settings.js';
 import '../Coachmark/Coachmark.js';
 import { useCoachmark } from '../Coachmark/utils/context.js';
 
-var _excluded = ["className", "children", "isVisible", "media", "renderMedia", "currentStep", "nextButtonText", "previousButtonLabel", "closeButtonLabel", "onNext", "onBack"];
+var _excluded = ["className", "children", "isVisible", "renderMedia", "currentStep", "nextButtonText", "previousButtonLabel", "closeButtonLabel", "onNext", "onBack"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 var blockClass = "".concat(pkg.prefix, "--coachmark-overlay-elements");
@@ -54,21 +53,20 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
   var className = _ref.className,
     children = _ref.children,
     _ref$isVisible = _ref.isVisible,
-    isVisible = _ref$isVisible === undefined ? defaults.isVisible : _ref$isVisible,
-    media = _ref.media,
+    isVisible = _ref$isVisible === void 0 ? defaults.isVisible : _ref$isVisible,
     renderMedia = _ref.renderMedia,
     _ref$currentStep = _ref.currentStep,
-    currentStep = _ref$currentStep === undefined ? defaults.currentStep : _ref$currentStep,
+    currentStep = _ref$currentStep === void 0 ? defaults.currentStep : _ref$currentStep,
     _ref$nextButtonText = _ref.nextButtonText,
-    nextButtonText = _ref$nextButtonText === undefined ? defaults.nextButtonText : _ref$nextButtonText,
+    nextButtonText = _ref$nextButtonText === void 0 ? defaults.nextButtonText : _ref$nextButtonText,
     _ref$previousButtonLa = _ref.previousButtonLabel,
-    previousButtonLabel = _ref$previousButtonLa === undefined ? defaults.previousButtonLabel : _ref$previousButtonLa,
+    previousButtonLabel = _ref$previousButtonLa === void 0 ? defaults.previousButtonLabel : _ref$previousButtonLa,
     _ref$closeButtonLabel = _ref.closeButtonLabel,
-    closeButtonLabel = _ref$closeButtonLabel === undefined ? defaults.closeButtonLabel : _ref$closeButtonLabel,
+    closeButtonLabel = _ref$closeButtonLabel === void 0 ? defaults.closeButtonLabel : _ref$closeButtonLabel,
     _ref$onNext = _ref.onNext,
-    onNext = _ref$onNext === undefined ? defaults.onNext : _ref$onNext,
+    onNext = _ref$onNext === void 0 ? defaults.onNext : _ref$onNext,
     _ref$onBack = _ref.onBack,
-    onBack = _ref$onBack === undefined ? defaults.onBack : _ref$onBack,
+    onBack = _ref$onBack === void 0 ? defaults.onBack : _ref$onBack,
     rest = _objectWithoutProperties(_ref, _excluded);
   var buttonFocusRef = useRef(undefined);
   var scrollRef = useRef(undefined);
@@ -81,12 +79,11 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
     currentProgStep = _useState4[0],
     _setCurrentProgStep = _useState4[1];
   var coachmark = useCoachmark();
-  var hasMedia = media || renderMedia;
   var setCurrentProgStep = function setCurrentProgStep(value) {
     if (currentProgStep > 0 && value === 0 && buttonFocusRef.current) {
       setTimeout(function () {
         var _buttonFocusRef$curre;
-        (_buttonFocusRef$curre = buttonFocusRef.current) === null || _buttonFocusRef$curre === undefined || _buttonFocusRef$curre.focus();
+        (_buttonFocusRef$curre = buttonFocusRef.current) === null || _buttonFocusRef$curre === void 0 || _buttonFocusRef$curre.focus();
       }, 1000);
     }
     _setCurrentProgStep(value);
@@ -95,7 +92,7 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
   var progStepFloor = 0;
   var progStepCeil = numProgSteps - 1;
   var renderMediaContent = useMemo(function () {
-    return renderMedia === null || renderMedia === undefined ? undefined : renderMedia({
+    return renderMedia === null || renderMedia === void 0 ? void 0 : renderMedia({
       playStep: currentProgStep
     });
   }, [currentProgStep, renderMedia]);
@@ -104,7 +101,7 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
     // When current step is set by props
     // scroll to the appropriate view on the carrousel
     var targetStep = clamp(currentStep, progStepFloor, progStepCeil);
-    scrollRef === null || scrollRef === undefined || (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === undefined || (_scrollRef$current$sc = _scrollRef$current.scrollToView) === null || _scrollRef$current$sc === undefined || _scrollRef$current$sc.call(_scrollRef$current, targetStep);
+    scrollRef === null || scrollRef === void 0 || (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 || (_scrollRef$current$sc = _scrollRef$current.scrollToView) === null || _scrollRef$current$sc === void 0 || _scrollRef$current$sc.call(_scrollRef$current, targetStep);
     // Avoid circular call to this hook
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [currentStep]);
@@ -136,11 +133,7 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
       // example: [`${blockClass}__here-if-small`]: size === 'sm',
     }),
     ref: ref
-  }, getDevtoolsProps(componentName)), hasMedia && (media === null || media === undefined ? undefined : media.render) && media.render(), hasMedia && (media === null || media === undefined ? undefined : media.filePaths) && /*#__PURE__*/React__default.createElement(SteppedAnimatedMedia, {
-    className: "".concat(blockClass, "__element-stepped-media"),
-    filePaths: media.filePaths,
-    playStep: currentProgStep
-  }), hasMedia && renderMedia && /*#__PURE__*/React__default.createElement("div", {
+  }, getDevtoolsProps(componentName)), renderMedia && /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__element-stepped-media")
   }, renderMediaContent), numProgSteps === 1 ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, children, closeButtonLabel && /*#__PURE__*/React__default.createElement("div", {
     className: cx("".concat(blockClass, "__footer"), 'coachmark-carousel-controls')
@@ -165,9 +158,9 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
     onClick: function onClick() {
       var _scrollRef$current2, _scrollRef$current2$s;
       var targetStep = clamp(currentProgStep - 1, progStepFloor, progStepCeil);
-      scrollRef === null || scrollRef === undefined || (_scrollRef$current2 = scrollRef.current) === null || _scrollRef$current2 === undefined || (_scrollRef$current2$s = _scrollRef$current2.scrollToView) === null || _scrollRef$current2$s === undefined || _scrollRef$current2$s.call(_scrollRef$current2, targetStep);
+      scrollRef === null || scrollRef === void 0 || (_scrollRef$current2 = scrollRef.current) === null || _scrollRef$current2 === void 0 || (_scrollRef$current2$s = _scrollRef$current2.scrollToView) === null || _scrollRef$current2$s === void 0 || _scrollRef$current2$s.call(_scrollRef$current2, targetStep);
       setCurrentProgStep(targetStep);
-      onBack === null || onBack === undefined || onBack();
+      onBack === null || onBack === void 0 || onBack();
     }
   }, previousButtonLabel), currentProgStep < progStepCeil ? /*#__PURE__*/React__default.createElement(Button, {
     size: "sm",
@@ -177,9 +170,9 @@ var CoachmarkOverlayElements = /*#__PURE__*/React__default.forwardRef(function (
     onClick: function onClick() {
       var _scrollRef$current3, _scrollRef$current3$s;
       var targetStep = clamp(currentProgStep + 1, progStepFloor, progStepCeil);
-      scrollRef === null || scrollRef === undefined || (_scrollRef$current3 = scrollRef.current) === null || _scrollRef$current3 === undefined || (_scrollRef$current3$s = _scrollRef$current3.scrollToView) === null || _scrollRef$current3$s === undefined || _scrollRef$current3$s.call(_scrollRef$current3, targetStep);
+      scrollRef === null || scrollRef === void 0 || (_scrollRef$current3 = scrollRef.current) === null || _scrollRef$current3 === void 0 || (_scrollRef$current3$s = _scrollRef$current3.scrollToView) === null || _scrollRef$current3$s === void 0 || _scrollRef$current3$s.call(_scrollRef$current3, targetStep);
       setCurrentProgStep(targetStep);
-      onNext === null || onNext === undefined || onNext();
+      onNext === null || onNext === void 0 || onNext();
     }
   }, nextButtonText) : closeButtonLabel && /*#__PURE__*/React__default.createElement(Button, _extends({
     size: "sm",
@@ -222,18 +215,6 @@ CoachmarkOverlayElements.propTypes = {
    * managed in the parent component.
    */
   isVisible: PropTypes.bool,
-  /**
-   * The object describing an image in one of two shapes.
-   * If a single media element is required, use `{render}`.
-   * If a stepped animation is required, use `{filePaths}`.
-   * @deprecated please use the `renderMedia` prop
-   */
-  /**@ts-ignore*/
-  media: PropTypes.oneOfType([PropTypes.shape({
-    render: PropTypes.func
-  }), PropTypes.shape({
-    filePaths: PropTypes.arrayOf(PropTypes.string)
-  })]),
   /**
    * The label for the Next button.
    */

package/es/components/CoachmarkStack/CoachmarkStack.d.ts

@@ -5,11 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-type Media = {
-    render?: () => ReactNode;
-} | {
-    filePaths?: string[];
-};
 interface CoachmarkStackProps {
     /**
      * CoachmarkStack should use a single CoachmarkOverlayElements component as a child.
@@ -28,15 +23,9 @@ interface CoachmarkStackProps {
      */
     description: ReactNode;
     /**
-     * The object describing an image in one of two shapes.
-     *
-     * If a single media element is required, use `{render}`.
-     *
-     * If a stepped animation is required, use `{filePaths}`.
-     *
-     * @see {@link MEDIA_PROP_TYPE}.
+     * Optional prop to render any media like images or any animated media.
      */
-    media?: Media;
+    renderMedia?: (params: any) => ReactNode;
     /**
      * The labels used to link to the stackable Coachmarks.
      */

package/es/components/CoachmarkStack/CoachmarkStack.js

@@ -19,7 +19,7 @@ import { CoachmarkContext } from '../Coachmark/utils/context.js';
 import { COACHMARK_OVERLAY_KIND } from '../Coachmark/utils/enums.js';
 import { useIsomorphicEffect } from '../../global/js/hooks/useIsomorphicEffect.js';
 
-var _excluded = ["children", "className", "onClose", "description", "media", "navLinkLabels", "portalTarget", "closeButtonLabel", "tagline", "theme", "title"];
+var _excluded = ["children", "className", "onClose", "description", "renderMedia", "navLinkLabels", "portalTarget", "closeButtonLabel", "tagline", "theme", "title"];
 
 // Carbon and package components we use.
 /* TODO: @import(s) of carbon components and other package components. */
@@ -52,22 +52,22 @@ var CoachmarkStack = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   var children = _ref.children,
     className = _ref.className,
     _ref$onClose = _ref.onClose,
-    onClose = _ref$onClose === undefined ? defaults.onClose : _ref$onClose,
+    onClose = _ref$onClose === void 0 ? defaults.onClose : _ref$onClose,
     description = _ref.description,
-    media = _ref.media,
+    renderMedia = _ref.renderMedia,
     navLinkLabels = _ref.navLinkLabels,
     _ref$portalTarget = _ref.portalTarget,
-    portalTarget = _ref$portalTarget === undefined ? defaults.portalTarget : _ref$portalTarget,
+    portalTarget = _ref$portalTarget === void 0 ? defaults.portalTarget : _ref$portalTarget,
     closeButtonLabel = _ref.closeButtonLabel,
     tagline = _ref.tagline,
     _ref$theme = _ref.theme,
-    theme = _ref$theme === undefined ? defaults.theme : _ref$theme,
+    theme = _ref$theme === void 0 ? defaults.theme : _ref$theme,
     title = _ref.title,
     rest = _objectWithoutProperties(_ref, _excluded);
   var portalNode = useRef(null);
   useIsomorphicEffect(function () {
     var _document$querySelect, _document, _document2, _document3;
-    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === undefined ? undefined : _document.querySelector(portalTarget)) !== null && _document$querySelect !== undefined ? _document$querySelect : (_document2 = document) === null || _document2 === undefined ? undefined : _document2.querySelector('body') : (_document3 = document) === null || _document3 === undefined ? undefined : _document3.querySelector('body');
+    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === void 0 ? void 0 : _document.querySelector(portalTarget)) !== null && _document$querySelect !== void 0 ? _document$querySelect : (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.querySelector('body') : (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.querySelector('body');
   }, [portalTarget]);
   var stackHomeRef = useRef(null);
   var stackedCoachmarkRefs = useRef([]);
@@ -212,7 +212,7 @@ var CoachmarkStack = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     className: cx("".concat(pkg.prefix, "--coachmark-overlay"), "".concat(pkg.prefix, "--coachmark-overlay__").concat(theme), elementBlockClass, selectedItemNumber > 0 && "".concat(elementBlockClass, "--is-stacked"), selectedItemNumber > 0 && "".concat(elementBlockClass, "--is-stacked__").concat(theme), isOpen && "".concat(elementBlockClass, "--is-visible"), mountedRef.current && "".concat(elementBlockClass, "--is-mounted")),
     isOpen: isOpen && selectedItemNumber < 1,
     description: description,
-    media: media,
+    renderMedia: renderMedia,
     navLinkLabels: navLinkLabels,
     onClickNavItem: handleClickNavItem,
     onClose: function onClose() {
@@ -221,7 +221,7 @@ var CoachmarkStack = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     portalTarget: portalTarget,
     closeButtonLabel: closeButtonLabel,
     title: title
-  }), portalNode !== null && portalNode !== undefined && portalNode.current ? /*#__PURE__*/createPortal(wrappedChildren, portalNode === null || portalNode === undefined ? undefined : portalNode.current) : null));
+  }), portalNode !== null && portalNode !== void 0 && portalNode.current ? /*#__PURE__*/createPortal(wrappedChildren, portalNode === null || portalNode === void 0 ? void 0 : portalNode.current) : null));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -252,20 +252,6 @@ CoachmarkStack.propTypes = {
    * The description of the Coachmark.
    */
   description: PropTypes.node.isRequired,
-  /**
-   * The object describing an image in one of two shapes.
-   *
-   * If a single media element is required, use `{render}`.
-   *
-   * If a stepped animation is required, use `{filePaths}`.
-   *
-   * @see {@link MEDIA_PROP_TYPE}.
-   */
-  media: PropTypes.oneOfType([PropTypes.shape({
-    render: PropTypes.func
-  }), PropTypes.shape({
-    filePaths: PropTypes.arrayOf(PropTypes.string)
-  })]),
   /**
    * The labels used to link to the stackable Coachmarks.
    */
@@ -279,6 +265,10 @@ CoachmarkStack.propTypes = {
    * The default is `document.body`.
    */
   portalTarget: PropTypes.string,
+  /**
+   * Optional prop to render any media like images or animated media.
+   */
+  renderMedia: PropTypes.func,
   /**
    * The tagline title which will be fixed to the bottom right of the window and will serve as the display trigger.
    */

package/es/components/CoachmarkStack/CoachmarkStackHome.d.ts

@@ -5,13 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-type Media = {
-    render?: () => ReactNode;
-    filePaths?: never;
-} | {
-    render?: never;
-    filePaths?: string[];
-};
 interface CoachmarkStackHomeProps {
     /**
      * Optional class name for this component.
@@ -29,16 +22,6 @@ interface CoachmarkStackHomeProps {
      * If the stack home is open.
      */
     isOpen: boolean;
-    /**
-     * The object describing an image in one of two shapes.
-     *
-     * If a single media element is required, use `{render}`.
-     *
-     * If a stepped animation is required, use `{filePaths}`.
-     *
-     * @see {@link MEDIA_PROP_TYPE}.
-     */
-    media?: Media;
     /**
      * Optional prop to render any media like images or any animated media.
      */

package/es/components/CoachmarkStack/CoachmarkStackHome.js

@@ -16,11 +16,9 @@ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 import { createPortal } from 'react-dom';
 import { CoachmarkHeader } from '../Coachmark/CoachmarkHeader.js';
-import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia/SteppedAnimatedMedia.js';
-import { deprecateProp } from '../../global/js/utils/props-helper.js';
 import { useIsomorphicEffect } from '../../global/js/hooks/useIsomorphicEffect.js';
 
-var _excluded = ["className", "description", "isOpen", "media", "renderMedia", "navLinkLabels", "onClickNavItem", "onClose", "portalTarget", "closeButtonLabel", "title"];
+var _excluded = ["className", "description", "isOpen", "renderMedia", "navLinkLabels", "onClickNavItem", "onClose", "portalTarget", "closeButtonLabel", "title"];
 // Carbon and package components we use.
 /* TODO: @import(s) of carbon components and other package components. */
 
@@ -37,7 +35,6 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
     description = _ref.description,
     isOpen = _ref.isOpen,
-    media = _ref.media,
     renderMedia = _ref.renderMedia,
     navLinkLabels = _ref.navLinkLabels,
     onClickNavItem = _ref.onClickNavItem,
@@ -51,7 +48,6 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _useState2 = _slicedToArray(_useState, 2),
     linkFocusIndex = _useState2[0],
     setLinkFocusIndex = _useState2[1];
-  var hasMedia = media || renderMedia;
   useEffect(function () {
     setTimeout(function () {
       if (isOpen && buttonFocusRef.current) {
@@ -62,7 +58,7 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var portalNode = useRef(null);
   useIsomorphicEffect(function () {
     var _document$querySelect, _document, _document2, _document3;
-    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === undefined ? undefined : _document.querySelector(portalTarget)) !== null && _document$querySelect !== undefined ? _document$querySelect : (_document2 = document) === null || _document2 === undefined ? undefined : _document2.querySelector('body') : (_document3 = document) === null || _document3 === undefined ? undefined : _document3.querySelector('body');
+    portalNode.current = portalTarget ? (_document$querySelect = (_document = document) === null || _document === void 0 ? void 0 : _document.querySelector(portalTarget)) !== null && _document$querySelect !== void 0 ? _document$querySelect : (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.querySelector('body') : (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.querySelector('body');
   }, [portalTarget]);
   if (!navLinkLabels) {
     return pconsole.warn("".concat(componentName, " is an Onboarding internal component and is not intended for general use."));
@@ -81,7 +77,7 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
       ref: ref
     }, label));
   }
-  return portalNode !== null && portalNode !== undefined && portalNode.current ? /*#__PURE__*/createPortal(/*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return portalNode !== null && portalNode !== void 0 && portalNode.current ? /*#__PURE__*/createPortal(/*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
     className: cx(blockClass, className),
     ref: ref
   }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement(CoachmarkHeader, {
@@ -93,14 +89,10 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
     className: "".concat(overlayClass, "__body")
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(overlayClass, "-element")
-  }, !hasMedia && /*#__PURE__*/React__default.createElement(Idea, {
+  }, !renderMedia && /*#__PURE__*/React__default.createElement(Idea, {
     size: 20,
     className: "".concat(blockClass, "__icon-idea")
-  }), hasMedia && (media === null || media === undefined ? undefined : media.render) && media.render(), hasMedia && (media === null || media === undefined ? undefined : media.filePaths) && /*#__PURE__*/React__default.createElement(SteppedAnimatedMedia, {
-    className: "".concat(blockClass, "__element-stepped-media"),
-    filePaths: media.filePaths,
-    playStep: 0
-  }), hasMedia && renderMedia && /*#__PURE__*/React__default.createElement("div", {
+  }), renderMedia && /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__element-stepped-media")
   }, renderMedia({
     playStep: 0
@@ -125,7 +117,7 @@ var CoachmarkStackHome = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setLinkFocusIndex(0);
       _onClose();
     }
-  }, closeButtonLabel))))), portalNode === null || portalNode === undefined ? undefined : portalNode.current) : null;
+  }, closeButtonLabel))))), portalNode === null || portalNode === void 0 ? void 0 : portalNode.current) : null;
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -155,21 +147,6 @@ CoachmarkStackHome.propTypes = {
    * If the stack home is open.
    */
   isOpen: PropTypes.bool.isRequired,
-  /**
-   * The object describing an image in one of two shapes.
-   *
-   * If a single media element is required, use `{render}`.
-   *
-   * If a stepped animation is required, use `{filePaths}`.
-   *
-   * @see {@link MEDIA_PROP_TYPE}.
-   * @deprecated please use the `renderMedia` prop
-   */
-  media: deprecateProp(PropTypes.oneOfType([PropTypes.shape({
-    render: PropTypes.func
-  }), PropTypes.shape({
-    filePaths: PropTypes.arrayOf(PropTypes.string)
-  })]), ''),
   /**
    * The labels used to link to the stackable Coachmarks.
    */

package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js

@@ -33,7 +33,7 @@ var ConditionBlock = function ConditionBlock(props) {
   var onRemove = props.onRemove,
     onChange = props.onChange,
     _props$condition = props.condition,
-    condition = _props$condition === undefined ? {} : _props$condition,
+    condition = _props$condition === void 0 ? {} : _props$condition,
     conjunction = props.conjunction,
     onConnectorOperatorChange = props.onConnectorOperatorChange,
     isStatement = props.isStatement,
@@ -77,9 +77,9 @@ var ConditionBlock = function ConditionBlock(props) {
   //filtering the current property to access its properties and config options
   var getCurrentConfig = function getCurrentConfig(property) {
     var _inputConfig$properti, _inputConfig$properti2;
-    return (_inputConfig$properti = inputConfig === null || inputConfig === undefined || (_inputConfig$properti2 = inputConfig.properties) === null || _inputConfig$properti2 === undefined ? undefined : _inputConfig$properti2.find(function (eachProperty) {
+    return (_inputConfig$properti = inputConfig === null || inputConfig === void 0 || (_inputConfig$properti2 = inputConfig.properties) === null || _inputConfig$properti2 === void 0 ? void 0 : _inputConfig$properti2.find(function (eachProperty) {
       return eachProperty.id == property;
-    })) !== null && _inputConfig$properti !== undefined ? _inputConfig$properti : {};
+    })) !== null && _inputConfig$properti !== void 0 ? _inputConfig$properti : {};
   };
   var _ref = getCurrentConfig(property),
     icon = _ref.icon,
@@ -95,7 +95,7 @@ var ConditionBlock = function ConditionBlock(props) {
     date: ConditionBuilderItemDate,
     time: ConditionBuilderItemTime,
     option: ItemOptionForValueField,
-    custom: config === null || config === undefined ? undefined : config.component,
+    custom: config === null || config === void 0 ? void 0 : config.component,
     textarea: ConditionBuilderItemText
   };
   var ItemComponent = itemComponents[type];
@@ -107,7 +107,7 @@ var ConditionBlock = function ConditionBlock(props) {
   };
   var onStatementChangeHandler = function onStatementChangeHandler(v, evt) {
     focusThisField(evt, conditionBuilderRef);
-    onStatementChange === null || onStatementChange === undefined || onStatementChange(v);
+    onStatementChange === null || onStatementChange === void 0 || onStatementChange(v);
   };
   var onPropertyChangeHandler = function onPropertyChangeHandler(newProperty) {
     onChange(_objectSpread2(_objectSpread2({}, condition), {}, {
@@ -145,7 +145,7 @@ var ConditionBlock = function ConditionBlock(props) {
   };
   var getOperators = function getOperators() {
     // @ts-ignore
-    if (config !== null && config !== undefined && config.operators) {
+    if (config !== null && config !== void 0 && config.operators) {
       // @ts-ignore
       return config.operators;
     }
@@ -187,7 +187,7 @@ var ConditionBlock = function ConditionBlock(props) {
     className: "".concat(blockClass, "__gap"),
     operator: conjunction,
     onChange: function onChange(op) {
-      return onConnectorOperatorChange === null || onConnectorOperatorChange === undefined ? undefined : onConnectorOperatorChange(op);
+      return onConnectorOperatorChange === null || onConnectorOperatorChange === void 0 ? void 0 : onConnectorOperatorChange(op);
     }
   }) : '', isStatement && /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
     label: group.statement,
@@ -207,9 +207,9 @@ var ConditionBlock = function ConditionBlock(props) {
       isStatement: true
     }
   })), /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
-    label: label !== null && label !== undefined ? label : condition === null || condition === undefined ? undefined : condition.property,
+    label: label !== null && label !== void 0 ? label : condition === null || condition === void 0 ? void 0 : condition.property,
     title: propertyText,
-    renderIcon: icon !== null && icon !== undefined ? icon : undefined,
+    renderIcon: icon !== null && icon !== void 0 ? icon : undefined,
     className: "".concat(blockClass, "__property-field"),
     "data-name": "propertyField",
     condition: condition,
@@ -223,7 +223,7 @@ var ConditionBlock = function ConditionBlock(props) {
     },
     onChange: onPropertyChangeHandler,
     config: {
-      options: inputConfig === null || inputConfig === undefined ? undefined : inputConfig.properties
+      options: inputConfig === null || inputConfig === void 0 ? void 0 : inputConfig.properties
     }
   })), checkIsValid(property) && /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
     label: operator,
@@ -269,10 +269,10 @@ var ConditionBlock = function ConditionBlock(props) {
     wrapperClassName: "".concat(blockClass, "__close-condition-wrapper")
   })), manageActionButtons(conditionIndex, group.conditions) && /*#__PURE__*/React__default.createElement(ConditionBuilderAdd, {
     onClick: function onClick() {
-      addConditionHandler === null || addConditionHandler === undefined || addConditionHandler(conditionIndex);
+      addConditionHandler === null || addConditionHandler === void 0 || addConditionHandler(conditionIndex);
     },
     addConditionSubGroupHandler: function addConditionSubGroupHandler() {
-      _addConditionSubGroupHandler === null || _addConditionSubGroupHandler === undefined || _addConditionSubGroupHandler(conditionIndex);
+      _addConditionSubGroupHandler === null || _addConditionSubGroupHandler === void 0 || _addConditionSubGroupHandler(conditionIndex);
     },
     showConditionSubGroupPreviewHandler: showConditionSubGroupPreviewHandler,
     hideConditionSubGroupPreviewHandler: hideConditionSubGroupPreviewHandler,

package/es/components/ConditionBuilder/ConditionBuilder.js

@@ -48,14 +48,14 @@ var ConditionBuilder = /*#__PURE__*/React__default.forwardRef(function (_ref, re
   var className = _ref.className,
     inputConfig = _ref.inputConfig,
     _ref$startConditionLa = _ref.startConditionLabel,
-    startConditionLabel = _ref$startConditionLa === undefined ? 'Add Condition' : _ref$startConditionLa,
+    startConditionLabel = _ref$startConditionLa === void 0 ? 'Add Condition' : _ref$startConditionLa,
     popOverSearchThreshold = _ref.popOverSearchThreshold,
     getOptions = _ref.getOptions,
     initialState = _ref.initialState,
     getConditionState = _ref.getConditionState,
     getActionsState = _ref.getActionsState,
     _ref$variant = _ref.variant,
-    variant = _ref$variant === undefined ? NON_HIERARCHICAL_VARIANT : _ref$variant,
+    variant = _ref$variant === void 0 ? NON_HIERARCHICAL_VARIANT : _ref$variant,
     actions = _ref.actions,
     translateWithId = _ref.translateWithId,
     statementConfigCustom = _ref.statementConfigCustom,

package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js

@@ -25,7 +25,7 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
     className = _ref.className;
   var _useContext = useContext(ConditionBuilderContext),
     _useContext$actionSta = _useContext.actionState,
-    actionState = _useContext$actionSta === undefined ? [] : _useContext$actionSta,
+    actionState = _useContext$actionSta === void 0 ? [] : _useContext$actionSta,
     setActionState = _useContext.setActionState;
   var _useState = useState(-1),
     _useState2 = _slicedToArray(_useState, 2),
@@ -45,7 +45,7 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
       label: undefined,
       popoverToOpen: 'valueField'
     };
-    setActionState === null || setActionState === undefined || setActionState([].concat(_toConsumableArray(actionState), [action]));
+    setActionState === null || setActionState === void 0 || setActionState([].concat(_toConsumableArray(actionState), [action]));
   };
   var onchangeHandler = function onchangeHandler(selectedId, actionIndex) {
     var action = actions.find(function (action) {
@@ -56,10 +56,10 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
     var newAction = _objectSpread2(_objectSpread2({}, action), {}, {
       id: actionState[actionIndex].id
     });
-    setActionState === null || setActionState === undefined || setActionState([].concat(_toConsumableArray(actionState.slice(0, actionIndex)), [newAction], _toConsumableArray(actionState.slice(actionIndex + 1))));
+    setActionState === null || setActionState === void 0 || setActionState([].concat(_toConsumableArray(actionState.slice(0, actionIndex)), [newAction], _toConsumableArray(actionState.slice(actionIndex + 1))));
   };
   var onRemove = function onRemove(selectedId) {
-    setActionState === null || setActionState === undefined || setActionState(actionState.filter(function (action) {
+    setActionState === null || setActionState === void 0 || setActionState(actionState.filter(function (action) {
       return action.id !== selectedId;
     }));
   };
@@ -78,7 +78,7 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
     className: "".concat(blockClass, "__condition-wrapper"),
     role: "grid",
     "aria-label": actionSectionText
-  }, actionState === null || actionState === undefined ? undefined : actionState.map(function (action, index) {
+  }, actionState === null || actionState === void 0 ? void 0 : actionState.map(function (action, index) {
     return /*#__PURE__*/React__default.createElement("div", {
       key: action.id,
       role: "row",

package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js

@@ -31,7 +31,7 @@ var ConditionBuilderAdd = function ConditionBuilderAdd(_ref) {
     addConditionRowText = _useTranslations2[1],
     addSubgroupText = _useTranslations2[2];
   var onClickHandler = function onClickHandler() {
-    hideConditionPreviewHandler === null || hideConditionPreviewHandler === undefined || hideConditionPreviewHandler();
+    hideConditionPreviewHandler === null || hideConditionPreviewHandler === void 0 || hideConditionPreviewHandler();
     onClick();
   };
   var previewHandlers = function previewHandlers() {
@@ -68,7 +68,7 @@ var ConditionBuilderAdd = function ConditionBuilderAdd(_ref) {
     className: "".concat(blockClass, "__add-button"),
     hideLabel: true,
     "data-name": "addButton",
-    label: buttonLabel !== null && buttonLabel !== undefined ? buttonLabel : addConditionText,
+    label: buttonLabel !== null && buttonLabel !== void 0 ? buttonLabel : addConditionText,
     tabIndex: tabIndex,
     wrapperClassName: "".concat(blockClass, "__add-condition-wrapper")
   })), enableSubGroup && /*#__PURE__*/React__default.createElement(ConditionBuilderButton, _extends({

package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js

@@ -38,7 +38,7 @@ var ConditionBuilderButton = function ConditionBuilderButton(_ref) {
   var carbonPrefix = usePrefix();
   var Button = function Button() {
     var _rest$dataName;
-    var dataName = (_rest$dataName = rest['data-name']) !== null && _rest$dataName !== undefined ? _rest$dataName : '';
+    var dataName = (_rest$dataName = rest['data-name']) !== null && _rest$dataName !== void 0 ? _rest$dataName : '';
     return /*#__PURE__*/React__default.createElement("button", _extends({
       tabIndex: tabIndex !== undefined ? tabIndex : -1,
       className: cx([className, "".concat(blockClass, "__button"), _defineProperty({}, "".concat(blockClass, "__text-ellipsis"), showToolTip && !hideLabel && !isInvalid), _defineProperty({}, "".concat(blockClass, "__invalid-input"), isInvalid)]),

package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js

@@ -38,15 +38,15 @@ var ConditionConnector = function ConditionConnector(_ref) {
     }
   }, []);
   var activeConnectorHandler = function activeConnectorHandler(evt) {
-    var parentGroup = evt === null || evt === undefined ? undefined : evt.currentTarget.closest('.eachGroup');
+    var parentGroup = evt === null || evt === void 0 ? void 0 : evt.currentTarget.closest('.eachGroup');
     handleConnectorHover(parentGroup, true);
   };
   var inActiveConnectorHandler = function inActiveConnectorHandler(evt) {
-    var parentGroup = evt === null || evt === undefined ? undefined : evt.currentTarget.closest('.eachGroup');
+    var parentGroup = evt === null || evt === void 0 ? void 0 : evt.currentTarget.closest('.eachGroup');
     handleConnectorHover(parentGroup, false);
   };
   var onChangeHandler = function onChangeHandler(op, evt) {
-    onChange === null || onChange === undefined || onChange(op);
+    onChange === null || onChange === void 0 || onChange(op);
     focusThisField(evt, conditionBuilderRef);
   };
   return variant == HIERARCHICAL_VARIANT ? /*#__PURE__*/React__default.createElement("span", {