@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
37 lines • 2.51 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.PreviewBadge = exports.PreviewBadgePosition = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_core_1 = require("@patternfly/react-core");
const info_circle_icon_1 = require("@patternfly/react-icons/dist/js/icons/info-circle-icon");
const ExternalLink_1 = tslib_1.__importDefault(require("./ExternalLink"));
const use_translation_wrapper_1 = require("../../hooks/use-translation-wrapper");
var PreviewBadgePosition;
(function (PreviewBadgePosition) {
PreviewBadgePosition[PreviewBadgePosition["default"] = 0] = "default";
PreviewBadgePosition[PreviewBadgePosition["inline"] = 1] = "inline";
PreviewBadgePosition[PreviewBadgePosition["inlineRight"] = 2] = "inlineRight";
})(PreviewBadgePosition = exports.PreviewBadgePosition || (exports.PreviewBadgePosition = {}));
const PreviewBadge = ({ position = PreviewBadgePosition.inline, className = 'pf-v5-u-ml-md', text, popoverContent, externalLink, testId, }) => {
let clsName = className;
const { t } = (0, use_translation_wrapper_1.useTranslation)();
switch (position) {
case PreviewBadgePosition.inlineRight:
clsName += ' pf-v5-u-float-right';
break;
case PreviewBadgePosition.inline:
clsName += ' pf-v5-u-display-inline';
break;
}
const bodyContent = (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { style: { marginBottom: 'var(--pf-v5-global--spacer--sm)' } }, popoverContent),
externalLink && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(ExternalLink_1.default, { href: externalLink }, t('ai:Learn more'))))));
return (react_1.default.createElement("span", { onClick: (e) => e.preventDefault() },
react_1.default.createElement(react_core_1.Popover, { bodyContent: bodyContent, position: "top", withFocusTrap: false },
react_1.default.createElement(react_core_1.Label, Object.assign({ style: { cursor: 'pointer' }, color: "orange", icon: react_1.default.createElement(info_circle_icon_1.InfoCircleIcon, { color: "var(--pf-v5-c-label__content--Color)" }), className: clsName }, (testId ? { 'data-testid': testId } : {})), text))));
};
exports.PreviewBadge = PreviewBadge;
exports.PreviewBadge.displayName = 'PreviewBadge';
//# sourceMappingURL=PreviewBadge.js.map