@ansible/ansible-ui-framework 0.0.454 → 0.0.456
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -14,14 +14,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
14
14
|
exports.PageDetail = void 0;
|
|
15
15
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
16
16
|
var react_core_1 = require("@patternfly/react-core");
|
|
17
|
+
var StandardPopover_1 = require("../components/StandardPopover");
|
|
17
18
|
function PageDetail(props) {
|
|
18
|
-
var
|
|
19
|
-
if (
|
|
19
|
+
var label = props.label, children = props.children, helpText = props.helpText, isEmpty = props.isEmpty;
|
|
20
|
+
if (children === null || typeof children === 'undefined' || children === '') {
|
|
20
21
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
|
|
21
22
|
}
|
|
22
|
-
if (
|
|
23
|
+
if (isEmpty) {
|
|
23
24
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
|
|
24
25
|
}
|
|
25
|
-
return ((0, jsx_runtime_1.jsxs)(react_core_1.DescriptionListGroup, { children: [
|
|
26
|
+
return ((0, jsx_runtime_1.jsxs)(react_core_1.DescriptionListGroup, { children: [label && ((0, jsx_runtime_1.jsxs)(react_core_1.DescriptionListTerm, { children: [label, helpText ? (0, jsx_runtime_1.jsx)(StandardPopover_1.StandardPopover, { header: label, content: helpText }) : null] })), (0, jsx_runtime_1.jsx)(react_core_1.DescriptionListDescription, __assign({ id: label === null || label === void 0 ? void 0 : label.toLowerCase().split(' ').join('-') }, { children: children }))] }));
|
|
26
27
|
}
|
|
27
28
|
exports.PageDetail = PageDetail;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __assign = (this && this.__assign) || function () {
|
|
7
|
+
__assign = Object.assign || function(t) {
|
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
+
s = arguments[i];
|
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
+
t[p] = s[p];
|
|
12
|
+
}
|
|
13
|
+
return t;
|
|
14
|
+
};
|
|
15
|
+
return __assign.apply(this, arguments);
|
|
16
|
+
};
|
|
17
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
18
|
+
var t = {};
|
|
19
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
20
|
+
t[p] = s[p];
|
|
21
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
22
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
23
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
24
|
+
t[p[i]] = s[p[i]];
|
|
25
|
+
}
|
|
26
|
+
return t;
|
|
27
|
+
};
|
|
28
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
29
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
30
|
+
};
|
|
31
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
32
|
+
exports.StandardPopover = void 0;
|
|
33
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
34
|
+
var react_core_1 = require("@patternfly/react-core");
|
|
35
|
+
var react_icons_1 = require("@patternfly/react-icons");
|
|
36
|
+
var react_i18next_1 = require("react-i18next");
|
|
37
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
38
|
+
var PopoverButton = styled_components_1.default.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: var(--pf-global--spacer--xs);\n margin: -(var(--pf-global--spacer--xs));\n font-size: var(--pf-global--FontSize--sm);\n --pf-c-form__group-label-help--Color: var(--pf-global--Color--200);\n --pf-c-form__group-label-help--hover--Color: var(--pf-global--Color--100);\n"], ["\n padding: var(--pf-global--spacer--xs);\n margin: -(var(--pf-global--spacer--xs));\n font-size: var(--pf-global--FontSize--sm);\n --pf-c-form__group-label-help--Color: var(--pf-global--Color--200);\n --pf-c-form__group-label-help--hover--Color: var(--pf-global--Color--100);\n"])));
|
|
39
|
+
function StandardPopover(props) {
|
|
40
|
+
var _a = props.ariaLabel, ariaLabel = _a === void 0 ? '' : _a, content = props.content, header = props.header, _b = props.id, id = _b === void 0 ? '' : _b, _c = props.maxWidth, maxWidth = _c === void 0 ? '' : _c, rest = __rest(props, ["ariaLabel", "content", "header", "id", "maxWidth"]);
|
|
41
|
+
var t = (0, react_i18next_1.useTranslation)().t;
|
|
42
|
+
if (!content) {
|
|
43
|
+
return null;
|
|
44
|
+
}
|
|
45
|
+
return ((0, jsx_runtime_1.jsx)(react_core_1.Popover, __assign({ bodyContent: content, headerContent: header, hideOnOutsideClick: true, id: id, "data-cy": id, maxWidth: maxWidth }, rest, { children: (0, jsx_runtime_1.jsx)(PopoverButton, __assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : t('More information`'), "aria-haspopup": "true", className: "pf-c-form__group-label-help", onClick: function (e) { return e.preventDefault(); }, type: "button" }, { children: (0, jsx_runtime_1.jsx)(react_icons_1.HelpIcon, { noVerticalAlign: true }) })) })));
|
|
46
|
+
}
|
|
47
|
+
exports.StandardPopover = StandardPopover;
|
|
48
|
+
var templateObject_1;
|