@openshift-console/dynamic-plugin-sdk
Version:
Provides core APIs, types and utilities used by dynamic plugins at runtime.
26 lines (25 loc) • 1.58 kB
JavaScript
import * as React from 'react';
import { Button, Popover, PopoverPosition } from '@patternfly/react-core';
import './PopoverStatus.scss';
/**
* Component for creating a status popover item
* @param {ReactNode} statusBody - content displayed within the popover.
* @param {function} [onHide] - (optional) function invoked when popover begins to transition out
* @param {function} [onShow] - (optional) function invoked when popover begins to appear
* @param {string} [title] - (optional) title for the popover
* @param {boolean} [hideHeader] - (optional) when true, header text is hidden
* @param {boolean} [isVisible] - (optional) when true, the popover is displayed
* @param {function} [shouldClose] - (optional) callback function invoked when the popover is closed only if isVisible is also controlled
* @param {ReactNode} [children] - (optional) children for the component
* @example
* ```tsx
* <PopoverStatus title={title} statusBody={statusBody}>
* {children}
* </PopoverStatus>
* ```
*/
const PopoverStatus = ({ hideHeader, children, isVisible = null, shouldClose = null, shouldOpen = null, statusBody, title, onHide, onShow, }) => {
return (React.createElement(Popover, { position: PopoverPosition.right, headerContent: hideHeader ? null : title, bodyContent: children, "aria-label": title, onHide: onHide, onShow: onShow, isVisible: isVisible, shouldClose: shouldClose, shouldOpen: shouldOpen },
React.createElement(Button, { variant: "link", isInline: true, className: "co-popover-status-button" }, statusBody)));
};
export default PopoverStatus;