diff --git a/src/components/Popover/Popover.jsx b/src/components/Popover/Popover.jsx index 5a594041..8a892216 100644 --- a/src/components/Popover/Popover.jsx +++ b/src/components/Popover/Popover.jsx @@ -16,9 +16,16 @@ export const Popover = React.forwardRef((props, ref) => { placementStyle, popoverTargetId, portalId, + zIndex, ...restProps } = props; + const placementStyleObject = placementStyle ? cleanPlacementStyle(placementStyle) : {}; + const style = zIndex !== undefined ? { + ...placementStyleObject, + zIndex, + } : placementStyleObject; + const PopoverEl = ( <> {/** @@ -43,7 +50,7 @@ export const Popover = React.forwardRef((props, ref) => { getRootAlignmentClassName(placement, styles), )} ref={ref} - style={placementStyle ? cleanPlacementStyle(placementStyle) : undefined} + style={style} > {children} @@ -63,6 +70,7 @@ Popover.defaultProps = { placementStyle: undefined, popoverTargetId: undefined, portalId: undefined, + zIndex: undefined, }; Popover.propTypes = { @@ -116,6 +124,10 @@ Popover.propTypes = { * If set, popover is rendered in the React Portal with that ID. */ portalId: PropTypes.string, + /** + * Z-Index of the popover. + */ + zIndex: PropTypes.number, }; export const PopoverWithGlobalProps = withGlobalProps(Popover, 'Popover');