carbon-react 111.12.3 → 111.12.4

package/esm/components/pager/pager.component.js

@@ -1,4 +1,5 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useState, useCallback, useEffect } from "react";
 import PropTypes from "prop-types";
 import { Select } from "../select";
@@ -7,6 +8,7 @@ import Option from "../select/option/option.component";
 import useLocale from "../../hooks/__internal__/useLocale";
 import { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSummary, StyledPagerSizeOptionsInner, StyledSelectContainer } from "./pager.style";
 import Events from "../../__internal__/utils/helpers/events";
+
 const Pager = ({
   currentPage = 1,
   pageSizeSelectionOptions = [{
@@ -47,6 +49,7 @@ const Pager = ({
     if (Number(totalRecords) < 0 || Number.isNaN(Number(totalRecords))) {
       return 1;
     }
+
     return Math.ceil(totalRecords / currentPageSize);
   }, [totalRecords, currentPageSize]);
   const [pageCount, setPageCount] = useState(getPageCount());
@@ -57,6 +60,7 @@ const Pager = ({
   useEffect(() => {
     const maxPage = getPageCount();
     setPageCount(maxPage);
+
     if (Number(currentPage) > maxPage) {
       setPage(maxPage);
     } else {
@@ -65,12 +69,14 @@ const Pager = ({
   }, [currentPageSize, pageCount, currentPage, totalRecords, getPageCount]);
   const handleOnFirst = useCallback(e => {
     setPage(1);
+
     if (onFirst) {
       onFirst(e);
     }
   }, [onFirst]);
   const handleOnLast = useCallback(e => {
     setPage(pageCount);
+
     if (onLast) {
       onLast(e);
     }
@@ -78,6 +84,7 @@ const Pager = ({
   const handleOnNext = useCallback(e => {
     const nextPage = page + 1;
     setPage(nextPage);
+
     if (onNext) {
       onNext(e);
     }
@@ -85,6 +92,7 @@ const Pager = ({
   const handleOnPrevious = useCallback(e => {
     const previousPage = page - 1;
     setPage(previousPage);
+
     if (onPrevious) {
       onPrevious(e);
     }
@@ -95,6 +103,7 @@ const Pager = ({
     onPagination(1, Number(e.target.value), "page-select");
   }, [onPagination]);
   const handleKeyDown = useCallback(e => Events.isEnterKey(e) && handleOnPagination(e), [handleOnPagination]);
+
   const sizeSelector = () => {
     return /*#__PURE__*/React.createElement(StyledSelectContainer, null, /*#__PURE__*/React.createElement(Select, {
       value: String(value),
@@ -109,10 +118,13 @@ const Pager = ({
       onClick: handleOnPagination
     }))));
   };
+
   const renderPageSizeOptions = () => {
     return showPageSizeSelection && /*#__PURE__*/React.createElement(StyledPagerSizeOptionsInner, null, showPageSizeLabelBefore && /*#__PURE__*/React.createElement("span", null, l.pager.show()), sizeSelector(), showPageSizeLabelAfter && /*#__PURE__*/React.createElement("div", null, l.pager.records(currentPageSize, false)));
   };
+
   const renderTotalRecords = () => showTotalRecords && l.pager.records(totalRecords);
+
   return /*#__PURE__*/React.createElement(StyledPagerContainer, _extends({
     "data-component": "pager",
     variant: variant
@@ -131,42 +143,59 @@ const Pager = ({
     showPageCount: showPageCount
   }), /*#__PURE__*/React.createElement(StyledPagerSummary, null, renderTotalRecords()));
 };
+
 Pager.propTypes = {
   /** Function called when pager changes (PageSize, Current Page) */
   onPagination: PropTypes.func.isRequired,
+
   /** Callback function for next link */
   onNext: PropTypes.func,
+
   /** Callback function for first link */
   onFirst: PropTypes.func,
+
   /** Callback function for previous link */
   onPrevious: PropTypes.func,
+
   /** Callback function for last link */
   onLast: PropTypes.func,
+
   /** Current visible page */
   currentPage: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+
   /** Total number of records */
   totalRecords: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+
   /** Pagination page size */
   pageSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+
   /** Set of page size options */
   pageSizeSelectionOptions: PropTypes.arrayOf(PropTypes.shape({
     id: PropTypes.string,
     name: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
   })),
+
   /** Should the page size selection dropdown be shown */
   showPageSizeSelection: PropTypes.bool,
+
   /** Should the label before the page size selection dropdown be shown */
   showPageSizeLabelBefore: PropTypes.bool,
+
   /** Should the label after the page size selection dropdown be shown */
   showPageSizeLabelAfter: PropTypes.bool,
+
   /** Should the total records label be shown */
   showTotalRecords: PropTypes.bool,
+
   /** Should the `First` and `Last` navigation button be shown */
   showFirstAndLastButtons: PropTypes.bool,
+
   /** Should the `Previous` and `Next` navigation button be shown */
   showPreviousAndNextButtons: PropTypes.bool,
+
   /** Should the page count input be shown */
   showPageCount: PropTypes.bool,
+
   /** What variant the Pager background should be */
   variant: PropTypes.oneOf(["default", "alternate"])
 };

package/esm/components/pages/page/page.component.js

@@ -1,4 +1,5 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useRef } from "react";
 import PropTypes from "prop-types";
 import { CSSTransition } from "react-transition-group";
@@ -7,6 +8,7 @@ import FullScreenHeading from "../../../__internal__/full-screen-heading";
 import Box from "../../box";
 import { StyledPage, StyledPageContent } from "./page.style";
 import { filterStyledSystemPaddingProps } from "../../../style/utils";
+
 const Page = ({
   title,
   children,
@@ -42,6 +44,7 @@ const Page = ({
     padding: "4px 0px"
   }, children))));
 };
+
 Page.propTypes = {
   "children": PropTypes.node,
   "p": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({

package/esm/components/pages/pages.component.js

@@ -7,6 +7,7 @@ import { PagesWrapperStyle, PagesContent } from "./pages.style";
 const NEXT = "next";
 const PREVIOUS = "previous";
 const TRANSITION_TIME = 500;
+
 const Pages = ({
   pageIndex: incomingPageIndex,
   initialpageIndex = 0,
@@ -16,17 +17,20 @@ const Pages = ({
 }) => {
   const [pageIndex, setPageIndex] = useState(Number(incomingPageIndex) || Number(initialpageIndex));
   const transitionDirection = useRef(NEXT);
+
   const transitionName = () => {
     if (transition === "slide") {
       return `slide-${transitionDirection.current}`;
     }
+
     return `carousel-transition-${transition}`;
   };
+
   const handleVisiblePage = () => {
     let index = pageIndex;
     const visiblePage = React.Children.toArray(children)[index];
-
     /* istanbul ignore if */
+
     if (! /*#__PURE__*/React.isValidElement(visiblePage)) return visiblePage;
     index = visiblePage.props.id || index;
     const additionalProps = {
@@ -36,11 +40,11 @@ const Pages = ({
       key: `carbon-page-${visiblePage.props.id || pageIndex}`,
       className: visiblePage.props.className
     };
-    return /*#__PURE__*/React.cloneElement(visiblePage, {
-      ...visiblePage.props,
+    return /*#__PURE__*/React.cloneElement(visiblePage, { ...visiblePage.props,
       ...additionalProps
     });
   };
+
   const numOfPages = useCallback(() => {
     return Array.isArray(children) ? children.length : 1;
   }, [children]);
@@ -49,31 +53,37 @@ const Pages = ({
       // If the new index is negative, select the last page
       return numOfPages() - 1;
     }
+
     if (newIndex > numOfPages() - 1) {
       // If the new index is bigger than the number of slides, select the first page
       return 0;
     }
+
     return newIndex;
   }, [numOfPages]);
   useEffect(() => {
     if (typeof incomingPageIndex === "undefined") return;
     const newIndex = verifyNewIndex(incomingPageIndex); // 2
+
     const currentIndex = pageIndex; // 1
 
     if (newIndex === currentIndex) return;
+
     if (newIndex > currentIndex) {
       transitionDirection.current = NEXT;
     } else {
       transitionDirection.current = PREVIOUS;
     }
+
     setPageIndex(newIndex);
   }, [incomingPageIndex, pageIndex, verifyNewIndex]);
-
   /** Renders the Slide Component */
+
   return /*#__PURE__*/React.createElement(PagesWrapperStyle, tagComponent("carousel", props), /*#__PURE__*/React.createElement(PagesContent, {
     className: "carbon-carousel__content"
   }, /*#__PURE__*/React.createElement(TransitionGroup, null, handleVisiblePage())));
 };
+
 Pages.propTypes = {
   "children": PropTypes.node,
   "className": PropTypes.string,

package/esm/components/pill/pill.component.js

@@ -1,10 +1,12 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import StyledPill from "./pill.style";
 import Icon from "../icon";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
 import IconButton from "../icon-button";
+
 const Pill = ({
   wrapText,
   borderColor,
@@ -35,6 +37,7 @@ const Pill = ({
 }, /*#__PURE__*/React.createElement(Icon, {
   type: "cross"
 })));
+
 Pill.propTypes = {
   "borderColor": PropTypes.string,
   "children": PropTypes.string.isRequired,

package/esm/components/pill/pill.style.js

@@ -6,6 +6,7 @@ import { baseTheme } from "../../style/themes";
 import StyledIcon from "../icon/icon.style";
 import { toColor } from "../../style/utils/color";
 import getColorValue from "../../style/utils/get-color-value";
+
 function addStyleToPillIcon(fontSize) {
   return `
     ${StyledIcon} {
@@ -15,6 +16,7 @@ function addStyleToPillIcon(fontSize) {
     }
   `;
 }
+
 const StyledPill = styled.span`
   ${margin}
   ${({
@@ -32,6 +34,7 @@ const StyledPill = styled.span`
   let pillColor;
   let buttonFocusColor;
   let contentColor;
+
   try {
     if (borderColor) {
       pillColor = toColor(theme, borderColor);
@@ -55,6 +58,7 @@ const StyledPill = styled.span`
     // eslint-disable-next-line no-console
     console.error(e);
   }
+
   return css`
       border-radius: 12px;
       font-size: 10px;

package/esm/components/pod/pod.component.js

@@ -1,4 +1,5 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useState, useCallback, forwardRef } from "react";
 import PropTypes from "prop-types";
 import styledSystemPropTypes from "@styled-system/prop-types";
@@ -37,20 +38,24 @@ const Pod = /*#__PURE__*/forwardRef(({
   const [isUndoFocused, setUndoFocused] = useState(false);
   const [isUndoHovered, setUndoHovered] = useState(false);
   let podHeight;
+
   if (height && typeof height === "number") {
     podHeight = `${height}px`;
   } else if (height) {
     podHeight = height;
   }
+
   const shouldContentHaveEditEvents = useCallback(() => {
     return (triggerEditOnContent || displayEditButtonOnHover) && onEdit;
   }, [displayEditButtonOnHover, onEdit, triggerEditOnContent]);
+
   const processPodAction = action => ev => {
     if (Event.isEnterKey(ev) || !Event.isEventType(ev, "keydown")) {
       ev.preventDefault();
       action(ev);
     }
   };
+
   function editEvents() {
     const editProps = {
       onMouseEnter: () => setEditHovered(true),
@@ -58,16 +63,20 @@ const Pod = /*#__PURE__*/forwardRef(({
       onFocus: () => setEditFocused(true),
       onBlur: () => setEditFocused(false)
     };
+
     if (typeof onEdit === "function") {
       editProps.onClick = processPodAction(onEdit);
       editProps.onKeyDown = processPodAction(onEdit);
     }
+
     return editProps;
   }
+
   function podHeader() {
     if (!title) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement(StyledHeader, {
       alignTitle: alignTitle,
       internalEditButton: internalEditButton,
@@ -78,10 +87,12 @@ const Pod = /*#__PURE__*/forwardRef(({
       "data-element": "subtitle"
     }, subtitle));
   }
+
   function renderFooter() {
     if (!footer) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement(StyledFooter, {
       "data-element": "footer",
       size: size,
@@ -89,19 +100,23 @@ const Pod = /*#__PURE__*/forwardRef(({
       softDelete: softDelete
     }, footer);
   }
+
   function actionButtons() {
     if (softDelete && onUndo) {
       return /*#__PURE__*/React.createElement(StyledActionsContainer, {
         internalEditButton: internalEditButton
       }, undo());
     }
+
     if (!softDelete && (onDelete || onEdit)) {
       return /*#__PURE__*/React.createElement(StyledActionsContainer, {
         internalEditButton: internalEditButton
       }, onEdit && edit(), onDelete && renderDelete());
     }
+
     return null;
   }
+
   function renderDelete() {
     return /*#__PURE__*/React.createElement(StyledDeleteButton, {
       onMouseEnter: () => setDeleteHovered(true),
@@ -122,6 +137,7 @@ const Pod = /*#__PURE__*/forwardRef(({
       type: "delete"
     }));
   }
+
   function edit() {
     return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, l => /*#__PURE__*/React.createElement("div", _extends({}, editEvents(), {
       "data-element": "edit-container"
@@ -138,6 +154,7 @@ const Pod = /*#__PURE__*/forwardRef(({
       variant: variant
     }, linkProps()), l.actions.edit())));
   }
+
   function undo() {
     return /*#__PURE__*/React.createElement(StyledUndoButton, {
       onMouseEnter: () => setUndoHovered(true),
@@ -157,14 +174,17 @@ const Pod = /*#__PURE__*/forwardRef(({
       type: "undo"
     }));
   }
+
   function linkProps() {
     if (typeof onEdit === "string") {
       return {
         to: onEdit
       };
     }
+
     return onEdit;
   }
+
   return /*#__PURE__*/React.createElement(StyledPod, _extends({}, rest, {
     className: className,
     internalEditButton: internalEditButton
@@ -182,86 +202,102 @@ const Pod = /*#__PURE__*/forwardRef(({
     noBorder: !border,
     variant: variant,
     softDelete: softDelete
-  }, shouldContentHaveEditEvents() ? {
-    ...editEvents(),
+  }, shouldContentHaveEditEvents() ? { ...editEvents(),
     tabIndex: "0"
   } : {}), /*#__PURE__*/React.createElement(StyledContent, {
     "data-element": "content",
     size: size
   }, podHeader(), /*#__PURE__*/React.createElement("div", null, children)), renderFooter()), actionButtons());
 });
-Pod.propTypes = {
-  ...marginPropTypes,
+Pod.propTypes = { ...marginPropTypes,
+
   /**
    * Enables/disables the border around the pod.
    */
   border: PropTypes.bool,
+
   /**
    * Children elements
    */
   children: PropTypes.node,
+
   /**
    * Custom className
    */
   className: PropTypes.string,
+
   /**
    * Determines the size of the pod.
    */
   size: PropTypes.oneOf(["none", "extra-small", "small", "medium", "large", "extra-large"]),
+
   /**
    * Prop to apply a theme to the Pod.
    */
   variant: PropTypes.oneOf(["primary", "secondary", "tertiary", "tile", "transparent"]),
+
   /**
    * Title for the pod h4 element
    * always shown
    */
   title: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+
   /**
    * Optional subtitle for the pod
    */
   subtitle: PropTypes.string,
+
   /**
    * Aligns the title to left, right or center
    */
   alignTitle: PropTypes.oneOf(["left", "center", "right"]),
+
   /**
    * A component to render as a Pod footer.
    */
   footer: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+
   /**
    * Supplies an edit action to the pod.
    */
   onEdit: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.object]),
+
   /**
    * Supplies a delete action to the pod.
    */
   onDelete: PropTypes.func,
+
   /**
    * Supplies an undo action to the pod in soft delete state.
    */
   onUndo: PropTypes.func,
+
   /**
    * Sets soft delete state.
    */
   softDelete: PropTypes.bool,
+
   /**
    * Determines if the editable pod content should be full width.
    */
   editContentFullWidth: PropTypes.bool,
+
   /**
    * Determines if the edit button should be hidden until the user
    * hovers over the content.
    */
   displayEditButtonOnHover: PropTypes.bool,
+
   /**
    * Determines if clicking the pod content calls the onEdit action
    */
   triggerEditOnContent: PropTypes.bool,
+
   /**
    * Resets edit button styles to an older version
    */
   internalEditButton: PropTypes.bool,
+
   /**
    * Sets Pod height, number is changed to pixels and string is passed as raw css value
    */

package/esm/components/pod/pod.style.js

@@ -24,6 +24,7 @@ const StyledPod = styled.div`
     outline: none;
   }
 `;
+
 const blockBackgrounds = variant => ({
   primary: "var(--colorsUtilityYang100)",
   secondary: "var(--colorsUtilityMajor025)",
@@ -31,6 +32,7 @@ const blockBackgrounds = variant => ({
   transparent: "var(--colorsUtilityMajorTransparent)",
   tile: "var(--colorsUtilityYang100)"
 })[variant];
+
 const StyledBlock = styled.div`
   ${({
   variant,
@@ -152,6 +154,7 @@ const actionButtonPaddings = {
   large: 16,
   "extra-large": 16
 };
+
 const actionButtonBackgrounds = variant => ({
   primary: "var(--colorsActionMajorYang100)",
   secondary: "var(--colorsActionMinor050)",
@@ -159,6 +162,7 @@ const actionButtonBackgrounds = variant => ({
   transparent: "var(--colorsActionMajorTransparent)",
   tile: "var(--colorsActionMajorYang100)"
 })[variant];
+
 const getButtonStyles = ({
   size,
   variant,
@@ -208,6 +212,7 @@ const getButtonStyles = ({
     padding: ${actionButtonPaddings[size] + (noBorder || internalEditButton ? 0 : 1)}px;
   `};
 `;
+
 const StyledEditAction = styled(Link)`
   && > a,
   && button {
@@ -217,8 +222,7 @@ const StyledEditAction = styled(Link)`
   isFocused
 }) => displayOnlyOnHover && !(isHovered || isFocused) && "display: none;"}
 
-    ${props => getButtonStyles({
-  ...props,
+    ${props => getButtonStyles({ ...props,
   iconColor: "var(--colorsActionMajor500)",
   hoverBackgroundColor: "var(--colorsActionMajor600)"
 })}
@@ -234,8 +238,7 @@ const StyledDeleteButton = styled(IconButton)`
     ${({
   displayOnlyOnHover
 }) => displayOnlyOnHover && "display: none;"}
-    ${props => getButtonStyles({
-  ...props,
+    ${props => getButtonStyles({ ...props,
   iconColor: "var(--colorsSemanticNegative500)",
   hoverBackgroundColor: "var(--colorsSemanticNegative600)"
 })}
@@ -248,8 +251,7 @@ const StyledUndoButton = styled(IconButton)`
   isHovered,
   isFocused
 }) => displayOnlyOnHover && !(isHovered || isFocused) && "display: none;"}
-    ${props => getButtonStyles({
-  ...props,
+    ${props => getButtonStyles({ ...props,
   iconColor: "var(--colorsActionMajor500)",
   hoverBackgroundColor: "var(--colorsActionMajor600)"
 })}

package/esm/components/popover-container/popover-container.component.js

@@ -1,4 +1,5 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useEffect, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import { Transition } from "react-transition-group";
@@ -9,6 +10,7 @@ import Popover from "../../__internal__/popover";
 import createGuid from "../../__internal__/utils/helpers/guid";
 import { filterStyledSystemPaddingProps } from "../../style/utils";
 import useClickAwayListener from "../../hooks/__internal__/useClickAwayListener";
+
 const renderOpen = ({
   tabIndex,
   onClick,
@@ -30,6 +32,7 @@ const renderOpen = ({
 }, /*#__PURE__*/React.createElement(Icon, {
   type: "settings"
 }));
+
 renderOpen.propTypes = {
   "aria-expanded": PropTypes.bool.isRequired,
   "aria-haspopup": PropTypes.oneOf(["dialog"]).isRequired,
@@ -41,6 +44,7 @@ renderOpen.propTypes = {
   "tabIndex": PropTypes.number.isRequired
 };
 export { renderOpen };
+
 const renderClose = ({
   "data-element": dataElement,
   tabIndex,
@@ -56,6 +60,7 @@ const renderClose = ({
 }, /*#__PURE__*/React.createElement(Icon, {
   type: "close"
 }));
+
 renderClose.propTypes = {
   "aria-label": PropTypes.string.isRequired,
   "data-element": PropTypes.string,
@@ -70,6 +75,7 @@ const popoverMiddleware = [offset(({
 })), flip({
   fallbackStrategy: "initialPlacement"
 })];
+
 const PopoverContainer = ({
   children,
   title,
@@ -98,22 +104,25 @@ const PopoverContainer = ({
   useEffect(() => {
     if (isOpen && closeButtonRef.current) setTimeout(() => {
       var _closeButtonRef$curre;
+
       return (_closeButtonRef$curre = closeButtonRef.current) === null || _closeButtonRef$curre === void 0 ? void 0 : _closeButtonRef$curre.focus();
     }, 0);
   }, [isOpen]);
+
   const handleOpenButtonClick = e => {
-    if (!isControlled) setIsOpenInternal(!isOpen);
+    if (!isControlled) setIsOpenInternal(!isOpen); // We want the open button to close the popover if it is already open
 
-    // We want the open button to close the popover if it is already open
     if (!isOpen) {
       if (onOpen) onOpen(e);
     } else if (onClose) onClose(e);
   };
+
   const handleCloseButtonClick = e => {
     if (!isControlled) setIsOpenInternal(!isOpen);
     if (onClose) onClose(e);
     if (isOpen && openButtonRef.current) openButtonRef.current.focus();
   };
+
   const renderOpenComponentProps = {
     tabIndex: isOpen ? -1 : 0,
     "aria-expanded": isOpen,
@@ -132,10 +141,12 @@ const PopoverContainer = ({
     ref: closeButtonRef,
     "aria-label": closeButtonAriaLabel
   };
+
   const handleClickAway = e => {
     if (!isControlled) setIsOpenInternal(false);
     if (onClose) onClose(e);
   };
+
   const handleClick = useClickAwayListener(handleClickAway, "mousedown");
   return /*#__PURE__*/React.createElement(PopoverContainerWrapperStyle, {
     "data-component": "popover-container",
@@ -170,6 +181,7 @@ const PopoverContainer = ({
     "data-element": "popover-container-title"
   }, title), renderCloseComponent(renderCloseComponentProps)), children))));
 };
+
 PopoverContainer.propTypes = {
   "ariaDescribedBy": PropTypes.string,
   "children": PropTypes.node,