@rh-support/components 2.0.5 → 2.0.8
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.
- package/lib/cjs/AlertMessage/AlertMessage.js +5 -5
- package/lib/cjs/ConfirmationModal/ConfirmationContext.js +13 -41
- package/lib/cjs/ConfirmationModal/ConfirmationDialog.js +5 -5
- package/lib/cjs/CoverSpinner/CoverSpinner.js +1 -1
- package/lib/cjs/CustomContentLoader/CustomContentLoader.js +4 -4
- package/lib/cjs/CustomTextInput/CustomTextInput.js +8 -19
- package/lib/cjs/DropDownList/AsyncDropDownList.js +5 -5
- package/lib/cjs/DropDownList/DropDownList.js +45 -75
- package/lib/cjs/DropDownList/DropdownWrapper.js +7 -18
- package/lib/cjs/DropDownList/MultiSelectDropdownList.js +3 -3
- package/lib/cjs/DropDownList/SearchableList.js +41 -55
- package/lib/cjs/DropDownList/SelectList.js +15 -26
- package/lib/cjs/DropDownList/async.js +28 -38
- package/lib/cjs/DropDownList/dropdownUtils.js +9 -20
- package/lib/cjs/DropDownList/withMulti.js +15 -26
- package/lib/cjs/ErrorBoundary/ErrorBoundary.js +18 -47
- package/lib/cjs/ErrorBoundary/ErrorBoundaryFallbackComponent.js +10 -10
- package/lib/cjs/ErrorPages/Generic403.js +2 -2
- package/lib/cjs/FeedbackForm/FeedbackForm.js +24 -52
- package/lib/cjs/Functional/CaseContactsSelectorExternal.js +81 -154
- package/lib/cjs/InlineEdit/InlineEdit.js +56 -142
- package/lib/cjs/InlineEdit/NewInlineEdit.js +60 -145
- package/lib/cjs/LanguageSelector/LanguageSelector.js +10 -26
- package/lib/cjs/LoadingDots/LoadingDots.js +3 -3
- package/lib/cjs/LoadingIndicator/LoadingIndicator.js +3 -3
- package/lib/cjs/LoginModal/LoginModal.js +3 -3
- package/lib/cjs/MarkdownEditor/MarkdownEditor.js +113 -165
- package/lib/cjs/MoreOrLess/MoreOrLess.js +20 -40
- package/lib/cjs/PaginatedList/PaginatedList.js +15 -31
- package/lib/cjs/PaginationCompact/PaginationCompact.js +14 -31
- package/lib/cjs/ProgressBar/CircularProgressBar/CircularProgressBar.js +14 -14
- package/lib/cjs/ProgressBar/CircularProgressBar/Path.js +20 -18
- package/lib/cjs/ProgressBar/ProgressBar.js +8 -19
- package/lib/cjs/PromisifyModal/PromisifyModal.js +19 -36
- package/lib/cjs/SubscriptionAbuse/SubscriptionAbuseModal.js +5 -5
- package/lib/cjs/SubscriptionAbuse/const.js +3 -3
- package/lib/cjs/SupportFeedbackForm/SupportFeedbackForm.js +8 -24
- package/lib/cjs/SupportFeedbackForm/SupportFeedbackModal.js +50 -120
- package/lib/cjs/Table/PFTable.js +52 -89
- package/lib/cjs/Table/Table.js +12 -29
- package/lib/cjs/Table/TableColumnSelector.js +14 -15
- package/lib/cjs/Table/TablePagination.js +8 -8
- package/lib/cjs/Table/TableProvider.js +6 -6
- package/lib/cjs/TermsAndConditions/AcceptTermsModal.js +46 -100
- package/lib/cjs/TextAreaAutosize/TextAreaAutosize.js +35 -62
- package/lib/cjs/TextAreaResizable/TextAreaResizable.js +9 -25
- package/lib/cjs/ToastNotification/ToastNotification.js +35 -70
- package/lib/cjs/TopContentSearch/TopContentSearch.js +48 -113
- package/lib/cjs/ValueChangedIcon/ValueChangedIcon.js +13 -29
- package/lib/cjs/helperFunctions/errorMessage.js +13 -13
- package/lib/cjs/hooks/useBreakpoint.js +26 -43
- package/lib/cjs/hooks/useCopyToClipboard.js +8 -24
- package/lib/cjs/hooks/useDebounce.js +13 -38
- package/lib/cjs/hooks/useFetch.js +47 -123
- package/lib/cjs/hooks/useForceUpdate.js +2 -18
- package/lib/cjs/hooks/useForkRef.js +3 -3
- package/lib/cjs/hooks/useIsMounted.js +4 -4
- package/lib/cjs/hooks/useLRUCache.js +11 -11
- package/lib/cjs/hooks/useLocalStorage.js +7 -23
- package/lib/cjs/hooks/useOnScreen.js +5 -24
- package/lib/cjs/hooks/usePolling.js +8 -30
- package/lib/cjs/hooks/usePrevious.js +3 -3
- package/lib/cjs/hooks/useTitle.js +4 -4
- package/lib/cjs/hooks/useUndo.js +49 -72
- package/lib/esm/AlertMessage/AlertMessage.js +2 -2
- package/package.json +9 -10
|
@@ -27,65 +27,22 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
27
27
|
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
28
28
|
});
|
|
29
29
|
};
|
|
30
|
-
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
31
|
-
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
32
|
-
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
33
|
-
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
34
|
-
function step(op) {
|
|
35
|
-
if (f) throw new TypeError("Generator is already executing.");
|
|
36
|
-
while (_) try {
|
|
37
|
-
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
38
|
-
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
39
|
-
switch (op[0]) {
|
|
40
|
-
case 0: case 1: t = op; break;
|
|
41
|
-
case 4: _.label++; return { value: op[1], done: false };
|
|
42
|
-
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
43
|
-
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
44
|
-
default:
|
|
45
|
-
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
46
|
-
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
47
|
-
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
48
|
-
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
49
|
-
if (t[2]) _.ops.pop();
|
|
50
|
-
_.trys.pop(); continue;
|
|
51
|
-
}
|
|
52
|
-
op = body.call(thisArg, _);
|
|
53
|
-
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
54
|
-
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
58
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
59
|
-
if (!m) return o;
|
|
60
|
-
var i = m.call(o), r, ar = [], e;
|
|
61
|
-
try {
|
|
62
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
63
|
-
}
|
|
64
|
-
catch (error) { e = { error: error }; }
|
|
65
|
-
finally {
|
|
66
|
-
try {
|
|
67
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
68
|
-
}
|
|
69
|
-
finally { if (e) throw e.error; }
|
|
70
|
-
}
|
|
71
|
-
return ar;
|
|
72
|
-
};
|
|
73
30
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
74
31
|
exports.AcceptTermsModal = void 0;
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
32
|
+
const hydrajs_1 = require("@cee-eng/hydrajs");
|
|
33
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
34
|
+
const react_1 = __importStar(require("react"));
|
|
35
|
+
const react_i18next_1 = require("react-i18next");
|
|
36
|
+
const hooks_1 = require("../hooks");
|
|
37
|
+
const LoadingIndicator_1 = require("../LoadingIndicator");
|
|
38
|
+
const getLocaleNameFromLocalCode = (localeCode) => {
|
|
82
39
|
if ('Intl' in window && 'DisplayNames' in Intl) {
|
|
83
40
|
try {
|
|
84
|
-
|
|
41
|
+
const [lang, locale] = localeCode.includes('_') ? localeCode.split('_') : localeCode.split('-');
|
|
85
42
|
// https://github.com/microsoft/TypeScript/issues/41338
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
return regionNamesInLang.of(locale)
|
|
43
|
+
const langName = new Intl.DisplayNames([lang], { type: 'language' });
|
|
44
|
+
const regionNamesInLang = new Intl.DisplayNames([lang], { type: 'region' });
|
|
45
|
+
return `${regionNamesInLang.of(locale)} (${langName.of(lang)})`;
|
|
89
46
|
}
|
|
90
47
|
catch (e) {
|
|
91
48
|
return localeCode;
|
|
@@ -94,62 +51,51 @@ var getLocaleNameFromLocalCode = function (localeCode) {
|
|
|
94
51
|
return localeCode;
|
|
95
52
|
};
|
|
96
53
|
function AcceptTermsModal(props) {
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
var fetchTerms = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
106
|
-
var siteCode, eventCode, loggedInUser, response, defaultTranslation_1, translationLangInfoMap, e_1;
|
|
54
|
+
const { request, isFetching } = hooks_1.useFetch(hydrajs_1.publicApi.terms.getRequiredTerms);
|
|
55
|
+
const [termsAcked, setTermsAcked] = react_1.useState(false);
|
|
56
|
+
const [allTranslations, setAllTranslations] = react_1.useState({});
|
|
57
|
+
const [isLangSelectorDropdownOpen, setisLangSelectorDropdownOpen] = react_1.useState(false);
|
|
58
|
+
const [selectedTranslation, setSelectedTranslation] = react_1.useState(null);
|
|
59
|
+
const { t } = react_i18next_1.useTranslation();
|
|
60
|
+
react_1.useEffect(() => {
|
|
61
|
+
const fetchTerms = () => __awaiter(this, void 0, void 0, function* () {
|
|
107
62
|
var _a, _b, _c, _d;
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
return [3 /*break*/, 3];
|
|
127
|
-
case 2:
|
|
128
|
-
e_1 = _e.sent();
|
|
129
|
-
console.log(e_1);
|
|
130
|
-
return [3 /*break*/, 3];
|
|
131
|
-
case 3: return [2 /*return*/];
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
}); };
|
|
63
|
+
try {
|
|
64
|
+
const { siteCode, eventCode, loggedInUser } = props;
|
|
65
|
+
const response = yield request(siteCode, eventCode, loggedInUser);
|
|
66
|
+
let defaultTranslation = (_b = (_a = response === null || response === void 0 ? void 0 : response[0]) === null || _a === void 0 ? void 0 : _a.translations) === null || _b === void 0 ? void 0 : _b[0];
|
|
67
|
+
const translationLangInfoMap = (_d = (_c = response === null || response === void 0 ? void 0 : response[0]) === null || _c === void 0 ? void 0 : _c.translations) === null || _d === void 0 ? void 0 : _d.reduce((allTranslationsmap, translation) => {
|
|
68
|
+
if (translation.isDefault) {
|
|
69
|
+
defaultTranslation = translation;
|
|
70
|
+
}
|
|
71
|
+
allTranslationsmap[translation['localeCode']] = translation;
|
|
72
|
+
return allTranslationsmap;
|
|
73
|
+
}, {});
|
|
74
|
+
setSelectedTranslation(defaultTranslation);
|
|
75
|
+
setAllTranslations(translationLangInfoMap);
|
|
76
|
+
}
|
|
77
|
+
catch (e) {
|
|
78
|
+
console.log(e);
|
|
79
|
+
}
|
|
80
|
+
});
|
|
135
81
|
fetchTerms();
|
|
136
82
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
137
83
|
}, []);
|
|
138
|
-
|
|
84
|
+
const onLangChange = (event, lang) => {
|
|
139
85
|
setSelectedTranslation(allTranslations[lang]);
|
|
140
86
|
setisLangSelectorDropdownOpen(false);
|
|
141
87
|
};
|
|
142
|
-
|
|
88
|
+
const handleModalToggle = () => {
|
|
143
89
|
props.onModalClose();
|
|
144
90
|
};
|
|
145
|
-
|
|
91
|
+
const onSubmitClick = () => {
|
|
146
92
|
props.onConfirm(selectedTranslation.termsPdfId);
|
|
147
93
|
};
|
|
148
|
-
|
|
94
|
+
const onDropdownToggle = (toggle) => setisLangSelectorDropdownOpen(toggle);
|
|
149
95
|
return (react_1.default.createElement(react_core_1.Modal, { variant: react_core_1.ModalVariant.medium, className: "pf-u-font-size-sm", title: isFetching || !selectedTranslation ? 'Remote Access Rider' : selectedTranslation.translatedTermsName, isOpen: props.isModalOpen, showClose: props.isSubmitting ? false : true, onClose: handleModalToggle, actions: [
|
|
150
|
-
react_1.default.createElement(react_core_1.Button, { key: "confirm", variant: react_core_1.ButtonVariant.primary, isDisabled: !termsAcked || props.isSubmitting, isLoading: props.isSubmitting, "data-tracking-id":
|
|
96
|
+
react_1.default.createElement(react_core_1.Button, { key: "confirm", variant: react_core_1.ButtonVariant.primary, isDisabled: !termsAcked || props.isSubmitting, isLoading: props.isSubmitting, "data-tracking-id": `${props.dataTrackingId || props.eventCode}-terms-accept`, onClick: onSubmitClick },
|
|
151
97
|
react_1.default.createElement(react_i18next_1.Trans, null, "Submit")),
|
|
152
|
-
react_1.default.createElement(react_core_1.Button, { key: "cancel", isDisabled: props.isSubmitting, "data-tracking-id":
|
|
98
|
+
react_1.default.createElement(react_core_1.Button, { key: "cancel", isDisabled: props.isSubmitting, "data-tracking-id": `${props.dataTrackingId || props.eventCode}-terms-cancel`, variant: react_core_1.ButtonVariant.link, onClick: props.onModalClose },
|
|
153
99
|
react_1.default.createElement(react_i18next_1.Trans, null, "Cancel")),
|
|
154
100
|
] }, isFetching || !selectedTranslation ? (react_1.default.createElement("div", { style: { height: '100px' } },
|
|
155
101
|
react_1.default.createElement(LoadingIndicator_1.LoadingIndicator, null))) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
@@ -159,11 +105,11 @@ function AcceptTermsModal(props) {
|
|
|
159
105
|
react_1.default.createElement("p", { className: "pf-u-mb-md pf-u-mt-sm" }, selectedTranslation.translatedInstructions),
|
|
160
106
|
react_1.default.createElement(react_core_1.Flex, null,
|
|
161
107
|
react_1.default.createElement(react_core_1.FlexItem, null,
|
|
162
|
-
react_1.default.createElement(react_core_1.Select, { "aria-label": t('Select language'), id: "terms-language-selector", className: "pf-u-mb-md", selections: selectedTranslation.localeCode, onSelect: onLangChange, isOpen: isLangSelectorDropdownOpen, isDisabled: props.isSubmitting, menuAppendTo: document.body, placeholderText: t('Select an option that best fits'), onToggle: onDropdownToggle }, Object.keys(allTranslations).map(
|
|
108
|
+
react_1.default.createElement(react_core_1.Select, { "aria-label": t('Select language'), id: "terms-language-selector", className: "pf-u-mb-md", selections: selectedTranslation.localeCode, onSelect: onLangChange, isOpen: isLangSelectorDropdownOpen, isDisabled: props.isSubmitting, menuAppendTo: document.body, placeholderText: t('Select an option that best fits'), onToggle: onDropdownToggle }, Object.keys(allTranslations).map((option, index) => (react_1.default.createElement(react_core_1.SelectOption, { key: index, value: option }, getLocaleNameFromLocalCode(option)))))),
|
|
163
109
|
react_1.default.createElement(react_core_1.FlexItem, null,
|
|
164
|
-
react_1.default.createElement("a", { href: selectedTranslation.pdfDownloadUrl, "data-tracking-id": props.eventCode
|
|
110
|
+
react_1.default.createElement("a", { href: selectedTranslation.pdfDownloadUrl, "data-tracking-id": `${props.eventCode}-terms-download`, target: "_blank", rel: "noopener noreferrer" },
|
|
165
111
|
react_1.default.createElement(react_i18next_1.Trans, null, "Download")))),
|
|
166
|
-
react_1.default.createElement(react_core_1.Checkbox, { label: t('I have read and agree to the terms'), isChecked: termsAcked, onChange:
|
|
112
|
+
react_1.default.createElement(react_core_1.Checkbox, { label: t('I have read and agree to the terms'), isChecked: termsAcked, onChange: (checked) => {
|
|
167
113
|
setTermsAcked(checked);
|
|
168
114
|
}, "aria-label": t('I have read and agree to the terms'), id: "agree-terms", name: "agree-terms" })))));
|
|
169
115
|
}
|
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
@@ -40,52 +29,36 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
40
29
|
}
|
|
41
30
|
return t;
|
|
42
31
|
};
|
|
43
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
44
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
45
|
-
if (!m) return o;
|
|
46
|
-
var i = m.call(o), r, ar = [], e;
|
|
47
|
-
try {
|
|
48
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
49
|
-
}
|
|
50
|
-
catch (error) { e = { error: error }; }
|
|
51
|
-
finally {
|
|
52
|
-
try {
|
|
53
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
54
|
-
}
|
|
55
|
-
finally { if (e) throw e.error; }
|
|
56
|
-
}
|
|
57
|
-
return ar;
|
|
58
|
-
};
|
|
59
32
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
60
33
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
61
34
|
};
|
|
62
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
63
36
|
exports.TextAreaAutosize = void 0;
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
37
|
+
const debounce_1 = __importDefault(require("lodash/debounce"));
|
|
38
|
+
const react_1 = __importStar(require("react"));
|
|
39
|
+
const useForkRef_1 = require("../hooks/useForkRef");
|
|
40
|
+
const defaultProps = {
|
|
68
41
|
rowsMax: 20,
|
|
69
42
|
rowsMin: 2,
|
|
70
43
|
};
|
|
71
44
|
function getStyleValue(computedStyle, property) {
|
|
72
45
|
return parseInt(computedStyle[property], 10) || 0;
|
|
73
46
|
}
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
47
|
+
const TextAreaAutosize = react_1.forwardRef((props, ref) => {
|
|
48
|
+
const { rowsMax, rowsMin } = props, rest = __rest(props, ["rowsMax", "rowsMin"]);
|
|
49
|
+
const { current: isControlled } = react_1.default.useRef(props.value != null);
|
|
50
|
+
const inputRef = react_1.useRef(null);
|
|
51
|
+
const handleRef = useForkRef_1.useForkRef(ref, inputRef);
|
|
52
|
+
const shadowRef = react_1.default.useRef(null);
|
|
53
|
+
const renders = react_1.default.useRef(0);
|
|
54
|
+
const [state, setState] = react_1.useState({
|
|
82
55
|
overflow: null,
|
|
83
56
|
outerHeightStyle: null,
|
|
84
|
-
})
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
57
|
+
});
|
|
58
|
+
const syncHeight = react_1.useCallback(() => {
|
|
59
|
+
const input = inputRef.current;
|
|
60
|
+
const computedStyle = window.getComputedStyle(input);
|
|
61
|
+
const inputShallow = shadowRef.current;
|
|
89
62
|
inputShallow.style.width = computedStyle.width;
|
|
90
63
|
inputShallow.value = input.value || 'x';
|
|
91
64
|
if (inputShallow.value.slice(-1) === '\n') {
|
|
@@ -94,25 +67,25 @@ var TextAreaAutosize = react_1.forwardRef(function (props, ref) {
|
|
|
94
67
|
// is empty. Make it non-empty to avoid this issue.
|
|
95
68
|
inputShallow.value += ' ';
|
|
96
69
|
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
70
|
+
const boxSizing = computedStyle['box-sizing'];
|
|
71
|
+
const padding = getStyleValue(computedStyle, 'padding-bottom') + getStyleValue(computedStyle, 'padding-top');
|
|
72
|
+
const border = getStyleValue(computedStyle, 'border-bottom-width') + getStyleValue(computedStyle, 'border-top-width');
|
|
100
73
|
// The height of the inner content
|
|
101
|
-
|
|
74
|
+
const innerHeight = inputShallow.scrollHeight - padding;
|
|
102
75
|
// Measure height of a textarea with a single row
|
|
103
76
|
inputShallow.value = 'x';
|
|
104
|
-
|
|
77
|
+
const singleRowHeight = inputShallow.scrollHeight - padding;
|
|
105
78
|
// The height of the outer content
|
|
106
|
-
|
|
79
|
+
let outerHeight = innerHeight;
|
|
107
80
|
if (props.rowsMin)
|
|
108
81
|
outerHeight = Math.max(Number(props.rowsMin) * singleRowHeight, outerHeight);
|
|
109
82
|
if (props.rowsMax)
|
|
110
83
|
outerHeight = Math.min(Number(props.rowsMax) * singleRowHeight, outerHeight);
|
|
111
84
|
outerHeight = Math.max(outerHeight, singleRowHeight);
|
|
112
85
|
// Take the box sizing into account for applying this value as a style.
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
setState(
|
|
86
|
+
const outerHeightStyle = outerHeight + (boxSizing === 'border-box' ? padding + border : 0);
|
|
87
|
+
const overflow = Math.abs(outerHeight - innerHeight) <= 1;
|
|
88
|
+
setState((prevState) => {
|
|
116
89
|
// Need a large enough difference to update the height.
|
|
117
90
|
// This prevents infinite rendering loop.
|
|
118
91
|
if (renders.current < 20 &&
|
|
@@ -120,30 +93,30 @@ var TextAreaAutosize = react_1.forwardRef(function (props, ref) {
|
|
|
120
93
|
prevState.overflow !== overflow)) {
|
|
121
94
|
renders.current += 1;
|
|
122
95
|
return {
|
|
123
|
-
overflow
|
|
124
|
-
outerHeightStyle
|
|
96
|
+
overflow,
|
|
97
|
+
outerHeightStyle,
|
|
125
98
|
};
|
|
126
99
|
}
|
|
127
100
|
return prevState;
|
|
128
101
|
});
|
|
129
102
|
}, [props.rowsMax, props.rowsMin]);
|
|
130
|
-
react_1.useEffect(
|
|
131
|
-
|
|
103
|
+
react_1.useEffect(() => {
|
|
104
|
+
const debouncedHandleResize = debounce_1.default(() => {
|
|
132
105
|
renders.current = 0;
|
|
133
106
|
syncHeight();
|
|
134
107
|
}, 1000);
|
|
135
108
|
window.addEventListener('resize', debouncedHandleResize);
|
|
136
|
-
return
|
|
109
|
+
return () => {
|
|
137
110
|
window.removeEventListener('resize', debouncedHandleResize);
|
|
138
111
|
};
|
|
139
112
|
}, [syncHeight]);
|
|
140
|
-
react_1.useLayoutEffect(
|
|
113
|
+
react_1.useLayoutEffect(() => {
|
|
141
114
|
syncHeight();
|
|
142
115
|
});
|
|
143
|
-
react_1.useEffect(
|
|
116
|
+
react_1.useEffect(() => {
|
|
144
117
|
renders.current = 0;
|
|
145
118
|
}, [props.value]);
|
|
146
|
-
|
|
119
|
+
const handleChange = (event) => {
|
|
147
120
|
renders.current = 0;
|
|
148
121
|
if (!isControlled)
|
|
149
122
|
syncHeight();
|
|
@@ -151,7 +124,7 @@ var TextAreaAutosize = react_1.forwardRef(function (props, ref) {
|
|
|
151
124
|
props.onChange(event);
|
|
152
125
|
};
|
|
153
126
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
154
|
-
react_1.default.createElement("textarea",
|
|
127
|
+
react_1.default.createElement("textarea", Object.assign({}, rest, { value: props.value, onChange: handleChange, ref: handleRef, rows: props.rows || props.rowsMin, style: {
|
|
155
128
|
height: state.outerHeightStyle,
|
|
156
129
|
// Need a large enough difference to allow scrolling.
|
|
157
130
|
// This prevents infinite rendering loop.
|
|
@@ -18,44 +18,28 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
18
18
|
__setModuleDefault(result, mod);
|
|
19
19
|
return result;
|
|
20
20
|
};
|
|
21
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
22
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
23
|
-
if (!m) return o;
|
|
24
|
-
var i = m.call(o), r, ar = [], e;
|
|
25
|
-
try {
|
|
26
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
27
|
-
}
|
|
28
|
-
catch (error) { e = { error: error }; }
|
|
29
|
-
finally {
|
|
30
|
-
try {
|
|
31
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
32
|
-
}
|
|
33
|
-
finally { if (e) throw e.error; }
|
|
34
|
-
}
|
|
35
|
-
return ar;
|
|
36
|
-
};
|
|
37
21
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
38
22
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
39
23
|
};
|
|
40
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
41
25
|
exports.TextAreaResizable = void 0;
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
26
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
27
|
+
const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
|
|
28
|
+
const react_1 = __importStar(require("react"));
|
|
29
|
+
const TextAreaResizable = (props) => {
|
|
46
30
|
// To set defaultProps
|
|
47
|
-
|
|
48
|
-
|
|
31
|
+
const { rowsMin = 2, autoResize = false, onChange, rows, id, className, isRequired, maxLength, name, value, isDisabled, isSpaceAllowed = true, } = props;
|
|
32
|
+
const [isTextAreaEmpty, setIsTextAreaEmpty] = react_1.useState(false);
|
|
49
33
|
// Function to handle onChange event
|
|
50
|
-
|
|
34
|
+
const onTextAreaChange = (value, event) => {
|
|
51
35
|
onChange(value, event);
|
|
52
36
|
setIsTextAreaEmpty(isEmpty_1.default(value === null || value === void 0 ? void 0 : value.trim()));
|
|
53
37
|
event.preventDefault();
|
|
54
38
|
return [];
|
|
55
39
|
};
|
|
56
40
|
// Function to check for validity
|
|
57
|
-
|
|
58
|
-
|
|
41
|
+
const validatedCheck = () => {
|
|
42
|
+
let isValidated = 'default';
|
|
59
43
|
if (isRequired) {
|
|
60
44
|
if (isSpaceAllowed) {
|
|
61
45
|
return isValidated;
|
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
4
|
};
|
|
@@ -17,12 +6,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
17
6
|
exports.ToastNotification = exports.ToastContainer = exports.ToastType = void 0;
|
|
18
7
|
require("react-toastify/dist/ReactToastify.min.css");
|
|
19
8
|
require("./toastNotification.css");
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
9
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
10
|
+
const debounce_1 = __importDefault(require("lodash/debounce"));
|
|
11
|
+
const react_1 = __importDefault(require("react"));
|
|
12
|
+
const react_toastify_1 = require("react-toastify");
|
|
24
13
|
Object.defineProperty(exports, "ToastContainer", { enumerable: true, get: function () { return react_toastify_1.ToastContainer; } });
|
|
25
|
-
|
|
14
|
+
const errorMessage_1 = require("../helperFunctions/errorMessage");
|
|
26
15
|
var ToastType;
|
|
27
16
|
(function (ToastType) {
|
|
28
17
|
ToastType["DANGER"] = "danger";
|
|
@@ -30,69 +19,45 @@ var ToastType;
|
|
|
30
19
|
ToastType["SUCCESS"] = "success";
|
|
31
20
|
ToastType["WARNING"] = "warning";
|
|
32
21
|
})(ToastType = exports.ToastType || (exports.ToastType = {}));
|
|
33
|
-
|
|
34
|
-
var variant = _a.variant, message = _a.message, _b = _a.alertActions, alertActions = _b === void 0 ? {} : _b, closeToast = _a.closeToast, children = _a.children;
|
|
22
|
+
const AlertComponent = ({ variant, message, alertActions = {}, closeToast, children }) => {
|
|
35
23
|
return (react_1.default.createElement(react_core_1.Alert, { variant: variant, title: message, actionClose: react_1.default.createElement(react_core_1.AlertActionCloseButton, { onClose: closeToast }) }, children));
|
|
36
24
|
};
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
25
|
+
const defaultCloseMs = 8000;
|
|
26
|
+
const defaultToastOptions = { autoClose: defaultCloseMs };
|
|
27
|
+
class ToastNotification {
|
|
28
|
+
static addDangerMessage(message, alertBody, options = {}) {
|
|
29
|
+
return react_toastify_1.toast(({ closeToast }) => (react_1.default.createElement(AlertComponent, { variant: ToastType.DANGER, message: message, closeToast: closeToast }, alertBody)), Object.assign({}, options));
|
|
41
30
|
}
|
|
42
|
-
ToastNotification.addDangerMessage = function (message, alertBody, options) {
|
|
43
|
-
if (options === void 0) { options = {}; }
|
|
44
|
-
return react_toastify_1.toast(function (_a) {
|
|
45
|
-
var closeToast = _a.closeToast;
|
|
46
|
-
return (react_1.default.createElement(AlertComponent, { variant: ToastType.DANGER, message: message, closeToast: closeToast }, alertBody));
|
|
47
|
-
}, __assign({}, options));
|
|
48
|
-
};
|
|
49
31
|
// removed options: ToastOptions = defaultToastOptions to fix auto-dismissing of success alerts.
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
}, __assign({}, options));
|
|
63
|
-
};
|
|
64
|
-
ToastNotification.addInfoMessage = function (message, options) {
|
|
65
|
-
if (options === void 0) { options = defaultToastOptions; }
|
|
66
|
-
return react_toastify_1.toast(function (_a) {
|
|
67
|
-
var closeToast = _a.closeToast;
|
|
68
|
-
return react_1.default.createElement(AlertComponent, { variant: ToastType.INFO, message: message, closeToast: closeToast });
|
|
69
|
-
}, __assign({}, options));
|
|
70
|
-
};
|
|
71
|
-
ToastNotification.addXHRErrorMessage = function (error, errorMessageObj) {
|
|
72
|
-
var messageBody = errorMessage_1.formattedApiErrorMessage(error, errorMessageObj);
|
|
73
|
-
var messageHeader = errorMessage_1.errorMessageTitle(error, errorMessageObj);
|
|
32
|
+
static addSuccessMessage(message, alertBody, options = defaultToastOptions) {
|
|
33
|
+
return react_toastify_1.toast(({ closeToast }) => (react_1.default.createElement(AlertComponent, { variant: ToastType.SUCCESS, message: message, closeToast: closeToast }, alertBody)), Object.assign({}, options));
|
|
34
|
+
}
|
|
35
|
+
static addWarningMessage(message, options = {}) {
|
|
36
|
+
return react_toastify_1.toast(({ closeToast }) => (react_1.default.createElement(AlertComponent, { variant: ToastType.WARNING, message: message, closeToast: closeToast })), Object.assign({}, options));
|
|
37
|
+
}
|
|
38
|
+
static addInfoMessage(message, options = defaultToastOptions) {
|
|
39
|
+
return react_toastify_1.toast(({ closeToast }) => react_1.default.createElement(AlertComponent, { variant: ToastType.INFO, message: message, closeToast: closeToast }), Object.assign({}, options));
|
|
40
|
+
}
|
|
41
|
+
static addXHRErrorMessage(error, errorMessageObj) {
|
|
42
|
+
const messageBody = errorMessage_1.formattedApiErrorMessage(error, errorMessageObj);
|
|
43
|
+
const messageHeader = errorMessage_1.errorMessageTitle(error, errorMessageObj);
|
|
74
44
|
ToastNotification.addDangerMessage(messageHeader, messageBody, { closeOnClick: false });
|
|
75
|
-
}
|
|
76
|
-
|
|
45
|
+
}
|
|
46
|
+
static clearAll() {
|
|
77
47
|
react_toastify_1.toast.dismiss();
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
debounce_1.default(
|
|
81
|
-
}
|
|
82
|
-
|
|
48
|
+
}
|
|
49
|
+
static clearAllDebounce(timeToDebounce) {
|
|
50
|
+
debounce_1.default(() => react_toastify_1.toast.dismiss, timeToDebounce)();
|
|
51
|
+
}
|
|
52
|
+
static clearToast(toastId) {
|
|
83
53
|
react_toastify_1.toast.dismiss(toastId);
|
|
84
|
-
}
|
|
54
|
+
}
|
|
85
55
|
/**
|
|
86
56
|
* DEPRECATED: Call an add message function with { autoClose: timeToDelat } in the ToastOptions object to clear toast
|
|
87
57
|
* after a certain amount of time.
|
|
88
58
|
*/
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
}
|
|
94
|
-
debounce_1.default(function () { return toastIds.forEach(function (id) { return ToastNotification.clearToast(id); }); }, timeToDebounce)();
|
|
95
|
-
};
|
|
96
|
-
return ToastNotification;
|
|
97
|
-
}());
|
|
59
|
+
static clearToastDebounce(timeToDebounce, ...toastIds) {
|
|
60
|
+
debounce_1.default(() => toastIds.forEach((id) => ToastNotification.clearToast(id)), timeToDebounce)();
|
|
61
|
+
}
|
|
62
|
+
}
|
|
98
63
|
exports.ToastNotification = ToastNotification;
|