carbon-react 107.2.1 → 108.0.0

package/esm/components/popover-container/index.d.ts

@@ -1 +1,2 @@
-export { default } from "./popover-container";
+export { default } from "./popover-container.component";
+export type { PopoverContainerProps, RenderCloseProps, RenderOpenProps, } from "./popover-container.component";

package/esm/components/popover-container/popover-container.component.d.ts

@@ -0,0 +1,56 @@
+import React from "react";
+import { PaddingProps } from "styled-system";
+export interface RenderOpenProps {
+    tabIndex: number;
+    isOpen?: boolean;
+    "data-element": string;
+    onClick: (ev: React.MouseEvent<HTMLElement>) => void;
+    ref: React.RefObject<HTMLButtonElement>;
+    "aria-label"?: string;
+    id?: string;
+}
+export interface RenderCloseProps {
+    "data-element": string;
+    tabIndex: number;
+    onClick: (ev: React.MouseEvent<HTMLElement>) => void;
+    ref: React.RefObject<HTMLButtonElement>;
+    "aria-label": string;
+}
+export interface PopoverContainerProps extends PaddingProps {
+    /** A function that will render the open component
+     *
+     * `({tabIndex, isOpen, data-element, onClick, ref, aria-label}) => ()`
+     *
+     */
+    renderOpenComponent?: (args: RenderOpenProps) => JSX.Element;
+    /** A function that will render the close component
+     *
+     * `({data-element, tabIndex, onClick, ref, aria-label}) => ()`
+     *
+     */
+    renderCloseComponent?: (args: RenderCloseProps) => JSX.Element;
+    /** The content of the popover-container */
+    children?: React.ReactNode;
+    /** Sets rendering position of dialog */
+    position?: "left" | "right";
+    /** Sets the popover container dialog header name */
+    title?: string;
+    /** Callback fires when close icon clicked */
+    onClose?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** if `true` the popover-container is open */
+    open?: boolean;
+    /** Callback fires when open component is clicked */
+    onOpen?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** if `true` the popover-container will cover open button */
+    shouldCoverButton?: boolean;
+    /** The id of the element that describe the dialog. */
+    ariaDescribedBy?: string;
+    /** Open button aria label */
+    openButtonAriaLabel?: string;
+    /** Close button aria label */
+    closeButtonAriaLabel?: string;
+    /** Container aria label */
+    containerAriaLabel?: string;
+}
+export declare const PopoverContainer: ({ children, title, position, open, onOpen, onClose, renderOpenComponent, renderCloseComponent, shouldCoverButton, ariaDescribedBy, openButtonAriaLabel, closeButtonAriaLabel, containerAriaLabel, ...rest }: PopoverContainerProps) => JSX.Element;
+export default PopoverContainer;

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

@@ -2,25 +2,74 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import React, { useEffect, useRef, useState } from "react";
 import PropTypes from "prop-types";
-import styledSystemPropTypes from "@styled-system/prop-types";
 import { Transition } from "react-transition-group";
 import { PopoverContainerWrapperStyle, PopoverContainerHeaderStyle, PopoverContainerContentStyle, PopoverContainerCloseIcon, PopoverContainerTitleStyle, PopoverContainerOpenIcon } from "./popover-container.style";
 import Icon from "../icon";
 import createGuid from "../../__internal__/utils/helpers/guid";
 import { filterStyledSystemPaddingProps } from "../../style/utils";
 import ClickAwayWrapper from "../../__internal__/click-away-wrapper";
-const paddingPropTypes = filterStyledSystemPaddingProps(styledSystemPropTypes.space);
+
+const renderOpen = ({
+  tabIndex,
+  onClick,
+  "data-element": dataElement,
+  ref,
+  "aria-label": ariaLabel,
+  id
+}) => /*#__PURE__*/React.createElement(PopoverContainerOpenIcon, {
+  tabIndex: tabIndex,
+  onAction: onClick,
+  "data-element": dataElement,
+  ref: ref,
+  "aria-label": ariaLabel,
+  "aria-haspopup": true,
+  id: id
+}, /*#__PURE__*/React.createElement(Icon, {
+  type: "settings"
+}));
+
+renderOpen.propTypes = {
+  "aria-label": PropTypes.string,
+  "data-element": PropTypes.string.isRequired,
+  "id": PropTypes.string,
+  "isOpen": PropTypes.bool,
+  "onClick": PropTypes.func.isRequired,
+  "tabIndex": PropTypes.number.isRequired
+};
+
+const renderClose = ({
+  "data-element": dataElement,
+  tabIndex,
+  onClick,
+  ref,
+  "aria-label": ariaLabel
+}) => /*#__PURE__*/React.createElement(PopoverContainerCloseIcon, {
+  "data-element": dataElement,
+  tabIndex: tabIndex,
+  onAction: onClick,
+  ref: ref,
+  "aria-label": ariaLabel
+}, /*#__PURE__*/React.createElement(Icon, {
+  type: "close"
+}));
+
+renderClose.propTypes = {
+  "aria-label": PropTypes.string.isRequired,
+  "data-element": PropTypes.string.isRequired,
+  "onClick": PropTypes.func.isRequired,
+  "tabIndex": PropTypes.number.isRequired
+};
 
 const PopoverContainer = ({
   children,
   title,
-  position,
+  position = "right",
   open,
   onOpen,
   onClose,
-  renderOpenComponent,
-  renderCloseComponent,
-  shouldCoverButton,
+  renderOpenComponent = renderOpen,
+  renderCloseComponent = renderClose,
+  shouldCoverButton = false,
   ariaDescribedBy,
   openButtonAriaLabel,
   closeButtonAriaLabel = "close",
@@ -29,11 +78,11 @@ const PopoverContainer = ({
 }) => {
   const isControlled = open !== undefined;
   const [isOpenInternal, setIsOpenInternal] = useState(false);
-  const ref = useRef();
-  const closeButtonRef = useRef();
-  const openButtonRef = useRef();
+  const ref = useRef(null);
+  const closeButtonRef = useRef(null);
+  const openButtonRef = useRef(null);
   const guid = useRef(createGuid());
-  const popoverContentNodeRef = useRef();
+  const popoverContentNodeRef = useRef(null);
   const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
   const isOpen = isControlled ? open : isOpenInternal;
   useEffect(() => {
@@ -57,19 +106,20 @@ const PopoverContainer = ({
   const renderOpenComponentProps = {
     tabIndex: isOpen ? -1 : 0,
     isOpen,
-    dataElement: "popover-container-open-component",
+    "data-element": "popover-container-open-component",
     onClick: handleOpenButtonClick,
     ref: openButtonRef,
-    ariaLabel: openButtonAriaLabel || title,
+    "aria-label": openButtonAriaLabel || title,
     id: isOpen ? undefined : popoverContainerId
   };
   const renderCloseComponentProps = {
-    dataElement: "popover-container-close-component",
+    "data-element": "popover-container-close-component",
     tabIndex: 0,
     onClick: handleCloseButtonClick,
     ref: closeButtonRef,
-    ariaLabel: closeButtonAriaLabel
-  };
+    "aria-label": closeButtonAriaLabel
+  }; // TODO: Assign proper type after ClickAwayWrapper has been refactored
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
   const handleClickAway = e => {
     if (!isControlled) setIsOpenInternal(false);
@@ -111,96 +161,174 @@ const PopoverContainer = ({
   }, title), renderCloseComponent(renderCloseComponentProps)), children))));
 };
 
-PopoverContainer.propTypes = { ...paddingPropTypes,
-
-  /** A function that will render the open component
-   *
-   * `({dataElement, tabIndex, onClick, ref, ariaLabel, isOpen}) => ()`
-   *
-   */
-  renderOpenComponent: PropTypes.func,
-
-  /** A function that will render the close component
-   *
-   * `({dataElement, tabIndex, onClick, ref, ariaLabel, isOpen}) => ()`
-   *
-   */
-  renderCloseComponent: PropTypes.func,
-
-  /** If `true` the popover-container will open */
-  open: PropTypes.bool,
-
-  /** Sets the popover-container title displayed in the dialog */
-  title: PropTypes.string,
-
-  /** If `true` the popover-container will cover open button */
-  shouldCoverButton: PropTypes.bool,
-
-  /** Callback fires when open component is clicked */
-  onOpen: PropTypes.func,
-
-  /** Callback fires when close component is clicked */
-  onClose: PropTypes.func,
-
-  /** Sets rendering position of the popover-container */
-  position: PropTypes.oneOf(["left", "right"]),
-
-  /** The content of the popover-container */
-  children: PropTypes.node,
-
-  /** The id of the element that describes the dialog */
-  ariaDescribedBy: PropTypes.string,
-
-  /** Open button aria label */
-  openButtonAriaLabel: PropTypes.string,
-
-  /** Close button aria label */
-  closeButtonAriaLabel: PropTypes.string,
-
-  /** Container aria label */
-  containerAriaLabel: PropTypes.string
-};
-PopoverContainer.defaultProps = {
-  position: "right",
-  shouldCoverButton: false,
-  renderOpenComponent: ({
-    /* eslint-disable react/prop-types */
-    tabIndex,
-    onClick,
-    dataElement,
-    ref,
-    ariaLabel,
-    id
-    /* eslint-enable react/prop-types */
-
-  }) => /*#__PURE__*/React.createElement(PopoverContainerOpenIcon, {
-    tabIndex: tabIndex,
-    onAction: onClick,
-    "data-element": dataElement,
-    ref: ref,
-    "aria-label": ariaLabel,
-    "aria-haspopup": true,
-    id: id
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "settings"
-  })),
-  renderCloseComponent: ({
-    /* eslint-disable react/prop-types */
-    dataElement,
-    tabIndex,
-    onClick,
-    ref,
-    ariaLabel
-    /* eslint-enable react/prop-types */
-
-  }) => /*#__PURE__*/React.createElement(PopoverContainerCloseIcon, {
-    "data-element": dataElement,
-    tabIndex: tabIndex,
-    onAction: onClick,
-    ref: ref,
-    "aria-label": ariaLabel
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "close"
-  }))
+PopoverContainer.propTypes = {
+  "ariaDescribedBy": PropTypes.string,
+  "children": PropTypes.node,
+  "closeButtonAriaLabel": PropTypes.string,
+  "containerAriaLabel": PropTypes.string,
+  "onClose": PropTypes.func,
+  "onOpen": PropTypes.func,
+  "open": PropTypes.bool,
+  "openButtonAriaLabel": PropTypes.string,
+  "p": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "padding": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "paddingY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "pb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "pl": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "position": PropTypes.oneOf(["left", "right"]),
+  "pr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "pt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "px": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "py": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "renderCloseComponent": PropTypes.func,
+  "renderOpenComponent": PropTypes.func,
+  "shouldCoverButton": PropTypes.bool,
+  "title": PropTypes.string
 };
+export { PopoverContainer };
 export default PopoverContainer;

package/esm/components/popover-container/popover-container.style.d.ts

@@ -0,0 +1,18 @@
+import { TransitionStatus } from "react-transition-group";
+import IconButton from "../icon-button";
+declare const PopoverContainerWrapperStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const PopoverContainerHeaderStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare type PopoverContainerContentStyleProps = {
+    shouldCoverButton?: boolean;
+    position?: "left" | "right";
+    animationState?: TransitionStatus;
+};
+declare const PopoverContainerContentStyle: import("styled-components").StyledComponent<"div", any, PopoverContainerContentStyleProps, never>;
+declare type AdditionalIconButtonProps = {
+    tabIndex?: number;
+    id?: string;
+};
+declare const PopoverContainerOpenIcon: import("styled-components").StyledComponent<typeof IconButton, any, AdditionalIconButtonProps, never>;
+declare const PopoverContainerCloseIcon: import("styled-components").StyledComponent<typeof IconButton, any, AdditionalIconButtonProps, never>;
+declare const PopoverContainerTitleStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export { PopoverContainerWrapperStyle, PopoverContainerHeaderStyle, PopoverContainerContentStyle, PopoverContainerCloseIcon, PopoverContainerTitleStyle, PopoverContainerOpenIcon, };

package/esm/style/utils/filter-styled-system-padding-props.d.ts

@@ -1,3 +1,3 @@
 import { PaddingProps } from "styled-system";
 export declare const paddingPropertyNames: string[];
-export default function filterStyledSystemPaddingProps(originalObject: Record<string, unknown>): PaddingProps;
+export default function filterStyledSystemPaddingProps(props: Record<string, any>): PaddingProps;

package/esm/style/utils/filter-styled-system-padding-props.js

@@ -1,5 +1,7 @@
 import filterObjectProperties from "../../__internal__/filter-object-properties";
 export const paddingPropertyNames = ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"];
-export default function filterStyledSystemPaddingProps(originalObject) {
-  return filterObjectProperties(originalObject, paddingPropertyNames);
+export default function filterStyledSystemPaddingProps( // method should accept any react prop
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+props) {
+  return filterObjectProperties(props, paddingPropertyNames);
 }

package/lib/components/popover-container/index.d.ts

@@ -1 +1,2 @@
-export { default } from "./popover-container";
+export { default } from "./popover-container.component";
+export type { PopoverContainerProps, RenderCloseProps, RenderOpenProps, } from "./popover-container.component";

package/lib/components/popover-container/popover-container.component.d.ts

@@ -0,0 +1,56 @@
+import React from "react";
+import { PaddingProps } from "styled-system";
+export interface RenderOpenProps {
+    tabIndex: number;
+    isOpen?: boolean;
+    "data-element": string;
+    onClick: (ev: React.MouseEvent<HTMLElement>) => void;
+    ref: React.RefObject<HTMLButtonElement>;
+    "aria-label"?: string;
+    id?: string;
+}
+export interface RenderCloseProps {
+    "data-element": string;
+    tabIndex: number;
+    onClick: (ev: React.MouseEvent<HTMLElement>) => void;
+    ref: React.RefObject<HTMLButtonElement>;
+    "aria-label": string;
+}
+export interface PopoverContainerProps extends PaddingProps {
+    /** A function that will render the open component
+     *
+     * `({tabIndex, isOpen, data-element, onClick, ref, aria-label}) => ()`
+     *
+     */
+    renderOpenComponent?: (args: RenderOpenProps) => JSX.Element;
+    /** A function that will render the close component
+     *
+     * `({data-element, tabIndex, onClick, ref, aria-label}) => ()`
+     *
+     */
+    renderCloseComponent?: (args: RenderCloseProps) => JSX.Element;
+    /** The content of the popover-container */
+    children?: React.ReactNode;
+    /** Sets rendering position of dialog */
+    position?: "left" | "right";
+    /** Sets the popover container dialog header name */
+    title?: string;
+    /** Callback fires when close icon clicked */
+    onClose?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** if `true` the popover-container is open */
+    open?: boolean;
+    /** Callback fires when open component is clicked */
+    onOpen?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** if `true` the popover-container will cover open button */
+    shouldCoverButton?: boolean;
+    /** The id of the element that describe the dialog. */
+    ariaDescribedBy?: string;
+    /** Open button aria label */
+    openButtonAriaLabel?: string;
+    /** Close button aria label */
+    closeButtonAriaLabel?: string;
+    /** Container aria label */
+    containerAriaLabel?: string;
+}
+export declare const PopoverContainer: ({ children, title, position, open, onOpen, onClose, renderOpenComponent, renderCloseComponent, shouldCoverButton, ariaDescribedBy, openButtonAriaLabel, closeButtonAriaLabel, containerAriaLabel, ...rest }: PopoverContainerProps) => JSX.Element;
+export default PopoverContainer;

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

@@ -3,14 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.PopoverContainer = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _propTypes2 = _interopRequireDefault(require("@styled-system/prop-types"));
-
 var _reactTransitionGroup = require("react-transition-group");
 
 var _popoverContainer = require("./popover-container.style");
@@ -31,18 +29,67 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 
 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); }
 
-const paddingPropTypes = (0, _utils.filterStyledSystemPaddingProps)(_propTypes2.default.space);
+const renderOpen = ({
+  tabIndex,
+  onClick,
+  "data-element": dataElement,
+  ref,
+  "aria-label": ariaLabel,
+  id
+}) => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerOpenIcon, {
+  tabIndex: tabIndex,
+  onAction: onClick,
+  "data-element": dataElement,
+  ref: ref,
+  "aria-label": ariaLabel,
+  "aria-haspopup": true,
+  id: id
+}, /*#__PURE__*/_react.default.createElement(_icon.default, {
+  type: "settings"
+}));
+
+renderOpen.propTypes = {
+  "aria-label": _propTypes.default.string,
+  "data-element": _propTypes.default.string.isRequired,
+  "id": _propTypes.default.string,
+  "isOpen": _propTypes.default.bool,
+  "onClick": _propTypes.default.func.isRequired,
+  "tabIndex": _propTypes.default.number.isRequired
+};
+
+const renderClose = ({
+  "data-element": dataElement,
+  tabIndex,
+  onClick,
+  ref,
+  "aria-label": ariaLabel
+}) => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerCloseIcon, {
+  "data-element": dataElement,
+  tabIndex: tabIndex,
+  onAction: onClick,
+  ref: ref,
+  "aria-label": ariaLabel
+}, /*#__PURE__*/_react.default.createElement(_icon.default, {
+  type: "close"
+}));
+
+renderClose.propTypes = {
+  "aria-label": _propTypes.default.string.isRequired,
+  "data-element": _propTypes.default.string.isRequired,
+  "onClick": _propTypes.default.func.isRequired,
+  "tabIndex": _propTypes.default.number.isRequired
+};
 
 const PopoverContainer = ({
   children,
   title,
-  position,
+  position = "right",
   open,
   onOpen,
   onClose,
-  renderOpenComponent,
-  renderCloseComponent,
-  shouldCoverButton,
+  renderOpenComponent = renderOpen,
+  renderCloseComponent = renderClose,
+  shouldCoverButton = false,
   ariaDescribedBy,
   openButtonAriaLabel,
   closeButtonAriaLabel = "close",
@@ -51,11 +98,11 @@ const PopoverContainer = ({
 }) => {
   const isControlled = open !== undefined;
   const [isOpenInternal, setIsOpenInternal] = (0, _react.useState)(false);
-  const ref = (0, _react.useRef)();
-  const closeButtonRef = (0, _react.useRef)();
-  const openButtonRef = (0, _react.useRef)();
+  const ref = (0, _react.useRef)(null);
+  const closeButtonRef = (0, _react.useRef)(null);
+  const openButtonRef = (0, _react.useRef)(null);
   const guid = (0, _react.useRef)((0, _guid.default)());
-  const popoverContentNodeRef = (0, _react.useRef)();
+  const popoverContentNodeRef = (0, _react.useRef)(null);
   const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
   const isOpen = isControlled ? open : isOpenInternal;
   (0, _react.useEffect)(() => {
@@ -79,19 +126,20 @@ const PopoverContainer = ({
   const renderOpenComponentProps = {
     tabIndex: isOpen ? -1 : 0,
     isOpen,
-    dataElement: "popover-container-open-component",
+    "data-element": "popover-container-open-component",
     onClick: handleOpenButtonClick,
     ref: openButtonRef,
-    ariaLabel: openButtonAriaLabel || title,
+    "aria-label": openButtonAriaLabel || title,
     id: isOpen ? undefined : popoverContainerId
   };
   const renderCloseComponentProps = {
-    dataElement: "popover-container-close-component",
+    "data-element": "popover-container-close-component",
     tabIndex: 0,
     onClick: handleCloseButtonClick,
     ref: closeButtonRef,
-    ariaLabel: closeButtonAriaLabel
-  };
+    "aria-label": closeButtonAriaLabel
+  }; // TODO: Assign proper type after ClickAwayWrapper has been refactored
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
   const handleClickAway = e => {
     if (!isControlled) setIsOpenInternal(false);
@@ -133,97 +181,175 @@ const PopoverContainer = ({
   }, title), renderCloseComponent(renderCloseComponentProps)), children))));
 };
 
-PopoverContainer.propTypes = { ...paddingPropTypes,
-
-  /** A function that will render the open component
-   *
-   * `({dataElement, tabIndex, onClick, ref, ariaLabel, isOpen}) => ()`
-   *
-   */
-  renderOpenComponent: _propTypes.default.func,
-
-  /** A function that will render the close component
-   *
-   * `({dataElement, tabIndex, onClick, ref, ariaLabel, isOpen}) => ()`
-   *
-   */
-  renderCloseComponent: _propTypes.default.func,
-
-  /** If `true` the popover-container will open */
-  open: _propTypes.default.bool,
-
-  /** Sets the popover-container title displayed in the dialog */
-  title: _propTypes.default.string,
-
-  /** If `true` the popover-container will cover open button */
-  shouldCoverButton: _propTypes.default.bool,
-
-  /** Callback fires when open component is clicked */
-  onOpen: _propTypes.default.func,
-
-  /** Callback fires when close component is clicked */
-  onClose: _propTypes.default.func,
-
-  /** Sets rendering position of the popover-container */
-  position: _propTypes.default.oneOf(["left", "right"]),
-
-  /** The content of the popover-container */
-  children: _propTypes.default.node,
-
-  /** The id of the element that describes the dialog */
-  ariaDescribedBy: _propTypes.default.string,
-
-  /** Open button aria label */
-  openButtonAriaLabel: _propTypes.default.string,
-
-  /** Close button aria label */
-  closeButtonAriaLabel: _propTypes.default.string,
-
-  /** Container aria label */
-  containerAriaLabel: _propTypes.default.string
-};
-PopoverContainer.defaultProps = {
-  position: "right",
-  shouldCoverButton: false,
-  renderOpenComponent: ({
-    /* eslint-disable react/prop-types */
-    tabIndex,
-    onClick,
-    dataElement,
-    ref,
-    ariaLabel,
-    id
-    /* eslint-enable react/prop-types */
-
-  }) => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerOpenIcon, {
-    tabIndex: tabIndex,
-    onAction: onClick,
-    "data-element": dataElement,
-    ref: ref,
-    "aria-label": ariaLabel,
-    "aria-haspopup": true,
-    id: id
-  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-    type: "settings"
-  })),
-  renderCloseComponent: ({
-    /* eslint-disable react/prop-types */
-    dataElement,
-    tabIndex,
-    onClick,
-    ref,
-    ariaLabel
-    /* eslint-enable react/prop-types */
-
-  }) => /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerCloseIcon, {
-    "data-element": dataElement,
-    tabIndex: tabIndex,
-    onAction: onClick,
-    ref: ref,
-    "aria-label": ariaLabel
-  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-    type: "close"
-  }))
+exports.PopoverContainer = PopoverContainer;
+PopoverContainer.propTypes = {
+  "ariaDescribedBy": _propTypes.default.string,
+  "children": _propTypes.default.node,
+  "closeButtonAriaLabel": _propTypes.default.string,
+  "containerAriaLabel": _propTypes.default.string,
+  "onClose": _propTypes.default.func,
+  "onOpen": _propTypes.default.func,
+  "open": _propTypes.default.bool,
+  "openButtonAriaLabel": _propTypes.default.string,
+  "p": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "padding": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingBottom": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingLeft": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingRight": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingTop": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingX": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "paddingY": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "pb": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "pl": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "position": _propTypes.default.oneOf(["left", "right"]),
+  "pr": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "pt": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "px": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "py": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "renderCloseComponent": _propTypes.default.func,
+  "renderOpenComponent": _propTypes.default.func,
+  "shouldCoverButton": _propTypes.default.bool,
+  "title": _propTypes.default.string
 };
 var _default = PopoverContainer;
 exports.default = _default;

package/lib/components/popover-container/popover-container.style.d.ts

@@ -0,0 +1,18 @@
+import { TransitionStatus } from "react-transition-group";
+import IconButton from "../icon-button";
+declare const PopoverContainerWrapperStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const PopoverContainerHeaderStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare type PopoverContainerContentStyleProps = {
+    shouldCoverButton?: boolean;
+    position?: "left" | "right";
+    animationState?: TransitionStatus;
+};
+declare const PopoverContainerContentStyle: import("styled-components").StyledComponent<"div", any, PopoverContainerContentStyleProps, never>;
+declare type AdditionalIconButtonProps = {
+    tabIndex?: number;
+    id?: string;
+};
+declare const PopoverContainerOpenIcon: import("styled-components").StyledComponent<typeof IconButton, any, AdditionalIconButtonProps, never>;
+declare const PopoverContainerCloseIcon: import("styled-components").StyledComponent<typeof IconButton, any, AdditionalIconButtonProps, never>;
+declare const PopoverContainerTitleStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export { PopoverContainerWrapperStyle, PopoverContainerHeaderStyle, PopoverContainerContentStyle, PopoverContainerCloseIcon, PopoverContainerTitleStyle, PopoverContainerOpenIcon, };

package/lib/style/utils/filter-styled-system-padding-props.d.ts

@@ -1,3 +1,3 @@
 import { PaddingProps } from "styled-system";
 export declare const paddingPropertyNames: string[];
-export default function filterStyledSystemPaddingProps(originalObject: Record<string, unknown>): PaddingProps;
+export default function filterStyledSystemPaddingProps(props: Record<string, any>): PaddingProps;

package/lib/style/utils/filter-styled-system-padding-props.js

@@ -13,6 +13,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const paddingPropertyNames = ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"];
 exports.paddingPropertyNames = paddingPropertyNames;
 
-function filterStyledSystemPaddingProps(originalObject) {
-  return (0, _filterObjectProperties.default)(originalObject, paddingPropertyNames);
+function filterStyledSystemPaddingProps( // method should accept any react prop
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+props) {
+  return (0, _filterObjectProperties.default)(props, paddingPropertyNames);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "107.2.1",
+  "version": "108.0.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {
@@ -99,6 +99,7 @@
     "@types/react-dom": "16.9.8",
     "@types/react-is": "^17.0.3",
     "@types/react-test-renderer": "^17.0.1",
+    "@types/react-transition-group": "^4.4.4",
     "@types/sprintf-js": "^1.1.2",
     "@types/styled-components": "^5.1.9",
     "@types/uuid": "^8.3.3",

package/esm/components/popover-container/popover-container.d.ts

@@ -1,35 +0,0 @@
-import * as React from "react";
-import { PaddingProps } from "styled-system";
-
-export interface PopoverContainerProps extends PaddingProps {
-  /** The element that will open popover-container */
-  renderOpenComponent?: React.ReactNode | Node;
-  /** The element that will close popover-container */
-  renderCloseComponent?: React.ReactNode | Node;
-  /** The content of the popover-container */
-  children?: React.ReactNode;
-  /** Sets rendering position of dialog */
-  position?: "left" | "right";
-  /** Sets the popover container dialog header name */
-  title?: string;
-  /** Callback fires when close icon clicked */
-  onClose?: () => void;
-  /** if `true` the popover-container is open */
-  open?: boolean;
-  /** Callback fires when open component is clicked */
-  onOpen?: (ev: React.MouseEvent<HTMLElement>) => void;
-  /** if `true` the popover-container will cover open button */
-  shouldCoverButton?: boolean;
-  /** The id of the element that describe the dialog. */
-  ariaDescribedBy?: string;
-  /** Open button aria label */
-  openButtonAriaLabel?: string;
-  /** Close button aria label */
-  closeButtonAriaLabel?: string;
-  /** Container aria label */
-  containerAriaLabel?: string;
-}
-
-declare function PopoverContainer(props: PopoverContainerProps): JSX.Element;
-
-export default PopoverContainer;

package/lib/components/popover-container/popover-container.d.ts

@@ -1,35 +0,0 @@
-import * as React from "react";
-import { PaddingProps } from "styled-system";
-
-export interface PopoverContainerProps extends PaddingProps {
-  /** The element that will open popover-container */
-  renderOpenComponent?: React.ReactNode | Node;
-  /** The element that will close popover-container */
-  renderCloseComponent?: React.ReactNode | Node;
-  /** The content of the popover-container */
-  children?: React.ReactNode;
-  /** Sets rendering position of dialog */
-  position?: "left" | "right";
-  /** Sets the popover container dialog header name */
-  title?: string;
-  /** Callback fires when close icon clicked */
-  onClose?: () => void;
-  /** if `true` the popover-container is open */
-  open?: boolean;
-  /** Callback fires when open component is clicked */
-  onOpen?: (ev: React.MouseEvent<HTMLElement>) => void;
-  /** if `true` the popover-container will cover open button */
-  shouldCoverButton?: boolean;
-  /** The id of the element that describe the dialog. */
-  ariaDescribedBy?: string;
-  /** Open button aria label */
-  openButtonAriaLabel?: string;
-  /** Close button aria label */
-  closeButtonAriaLabel?: string;
-  /** Container aria label */
-  containerAriaLabel?: string;
-}
-
-declare function PopoverContainer(props: PopoverContainerProps): JSX.Element;
-
-export default PopoverContainer;