@rh-support/components 2.1.28 → 2.4.10-beta.6

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.
Files changed (92) hide show
  1. package/README.md +0 -2
  2. package/lib/cjs/CustomTextInput/CustomTextInput.d.ts +0 -2
  3. package/lib/cjs/CustomTextInput/CustomTextInput.d.ts.map +1 -1
  4. package/lib/cjs/CustomTextInput/CustomTextInput.js +2 -4
  5. package/lib/cjs/DropDownList/DropDownList.js +10 -10
  6. package/lib/cjs/DropDownList/DropdownWrapper.js +2 -2
  7. package/lib/cjs/DropDownList/SearchableList.js +5 -5
  8. package/lib/cjs/DropDownList/SelectList.js +4 -4
  9. package/lib/cjs/DropDownList/dropdownList.css +5 -10
  10. package/lib/cjs/ErrorBoundary/ErrorBoundaryFallbackComponent.d.ts.map +1 -1
  11. package/lib/cjs/ErrorBoundary/ErrorBoundaryFallbackComponent.js +3 -2
  12. package/lib/cjs/InlineEdit/NewInlineEdit.js +1 -1
  13. package/lib/cjs/InlineEdit/newInlineEdit.css +3 -3
  14. package/lib/cjs/LoadingDots/LoadingDots.js +1 -1
  15. package/lib/cjs/MarkdownEditor/MarkdownEditor.d.ts.map +1 -1
  16. package/lib/cjs/MarkdownEditor/MarkdownEditor.js +10 -11
  17. package/lib/cjs/MarkdownEditor/markdownEditor.css +1 -3
  18. package/lib/cjs/PaginationCompact/PaginationCompact.js +4 -4
  19. package/lib/cjs/PaginationCompact/paginationCompact.css +1 -1
  20. package/lib/cjs/PhoneInput/PhoneInput.d.ts.map +1 -1
  21. package/lib/cjs/PhoneInput/PhoneInput.js +7 -10
  22. package/lib/cjs/PhoneInput/PhoneInput.scss +1 -1
  23. package/lib/cjs/SupportFeedbackForm/SupportFeedbackModal.js +12 -12
  24. package/lib/cjs/Table/PFTable.d.ts +1 -2
  25. package/lib/cjs/Table/PFTable.d.ts.map +1 -1
  26. package/lib/cjs/Table/PFTable.js +7 -7
  27. package/lib/cjs/Table/TablePagination.d.ts.map +1 -1
  28. package/lib/cjs/Table/TablePagination.js +1 -3
  29. package/lib/cjs/Table/columnSelector.css +1 -1
  30. package/lib/cjs/TermsAndConditions/AcceptTermsModal.d.ts.map +1 -1
  31. package/lib/cjs/TermsAndConditions/AcceptTermsModal.js +5 -6
  32. package/lib/cjs/TextAreaResizable/TextAreaResizable.d.ts.map +1 -1
  33. package/lib/cjs/TextAreaResizable/TextAreaResizable.js +1 -1
  34. package/lib/cjs/ToastNotification/toastNotification.css +1 -1
  35. package/lib/cjs/TopContentSearch/TopContentSearch.d.ts.map +1 -1
  36. package/lib/cjs/TopContentSearch/TopContentSearch.js +5 -6
  37. package/lib/cjs/helperFunctions/errorMessage.js +2 -2
  38. package/lib/cjs/helperFunctions/errorMessage.scss +1 -1
  39. package/lib/cjs/hooks/index.d.ts +0 -1
  40. package/lib/cjs/hooks/index.d.ts.map +1 -1
  41. package/lib/cjs/hooks/index.js +0 -1
  42. package/lib/cjs/hooks/useBreakpoint.d.ts.map +1 -1
  43. package/lib/cjs/hooks/useBreakpoint.js +0 -1
  44. package/lib/esm/CustomTextInput/CustomTextInput.d.ts +0 -2
  45. package/lib/esm/CustomTextInput/CustomTextInput.d.ts.map +1 -1
  46. package/lib/esm/CustomTextInput/CustomTextInput.js +2 -4
  47. package/lib/esm/DropDownList/DropDownList.js +10 -10
  48. package/lib/esm/DropDownList/DropdownWrapper.js +2 -2
  49. package/lib/esm/DropDownList/SearchableList.js +5 -5
  50. package/lib/esm/DropDownList/SelectList.js +4 -4
  51. package/lib/esm/DropDownList/dropdownList.css +5 -10
  52. package/lib/esm/ErrorBoundary/ErrorBoundaryFallbackComponent.d.ts.map +1 -1
  53. package/lib/esm/ErrorBoundary/ErrorBoundaryFallbackComponent.js +4 -3
  54. package/lib/esm/InlineEdit/NewInlineEdit.js +1 -1
  55. package/lib/esm/InlineEdit/newInlineEdit.css +3 -3
  56. package/lib/esm/LoadingDots/LoadingDots.js +1 -1
  57. package/lib/esm/MarkdownEditor/MarkdownEditor.d.ts.map +1 -1
  58. package/lib/esm/MarkdownEditor/MarkdownEditor.js +8 -9
  59. package/lib/esm/MarkdownEditor/markdownEditor.css +1 -3
  60. package/lib/esm/PaginationCompact/PaginationCompact.js +4 -4
  61. package/lib/esm/PaginationCompact/paginationCompact.css +1 -1
  62. package/lib/esm/PhoneInput/PhoneInput.d.ts.map +1 -1
  63. package/lib/esm/PhoneInput/PhoneInput.js +7 -10
  64. package/lib/esm/PhoneInput/PhoneInput.scss +1 -1
  65. package/lib/esm/SupportFeedbackForm/SupportFeedbackModal.js +13 -13
  66. package/lib/esm/Table/PFTable.d.ts +1 -2
  67. package/lib/esm/Table/PFTable.d.ts.map +1 -1
  68. package/lib/esm/Table/PFTable.js +6 -6
  69. package/lib/esm/Table/TablePagination.d.ts.map +1 -1
  70. package/lib/esm/Table/TablePagination.js +2 -4
  71. package/lib/esm/Table/columnSelector.css +1 -1
  72. package/lib/esm/TermsAndConditions/AcceptTermsModal.d.ts.map +1 -1
  73. package/lib/esm/TermsAndConditions/AcceptTermsModal.js +6 -7
  74. package/lib/esm/TextAreaResizable/TextAreaResizable.d.ts.map +1 -1
  75. package/lib/esm/TextAreaResizable/TextAreaResizable.js +1 -1
  76. package/lib/esm/ToastNotification/toastNotification.css +1 -1
  77. package/lib/esm/TopContentSearch/TopContentSearch.d.ts.map +1 -1
  78. package/lib/esm/TopContentSearch/TopContentSearch.js +5 -6
  79. package/lib/esm/helperFunctions/errorMessage.js +2 -2
  80. package/lib/esm/helperFunctions/errorMessage.scss +1 -1
  81. package/lib/esm/hooks/index.d.ts +0 -1
  82. package/lib/esm/hooks/index.d.ts.map +1 -1
  83. package/lib/esm/hooks/index.js +0 -1
  84. package/lib/esm/hooks/useBreakpoint.d.ts.map +1 -1
  85. package/lib/esm/hooks/useBreakpoint.js +0 -1
  86. package/package.json +14 -12
  87. package/lib/cjs/hooks/useSelectKeyboardNavigator.d.ts +0 -13
  88. package/lib/cjs/hooks/useSelectKeyboardNavigator.d.ts.map +0 -1
  89. package/lib/cjs/hooks/useSelectKeyboardNavigator.js +0 -55
  90. package/lib/esm/hooks/useSelectKeyboardNavigator.d.ts +0 -13
  91. package/lib/esm/hooks/useSelectKeyboardNavigator.d.ts.map +0 -1
  92. package/lib/esm/hooks/useSelectKeyboardNavigator.js +0 -51
@@ -25,7 +25,7 @@
25
25
  overflow: hidden;
26
26
  }
27
27
 
28
- .markdown-editor-container .pf-v5-c-toolbar {
28
+ .markdown-editor-container .pf-c-toolbar {
29
29
  padding: 0.5rem;
30
30
  }
31
31
 
@@ -35,7 +35,6 @@
35
35
  margin-left: 10px;
36
36
  margin-right: 5px;
37
37
  width: 1px;
38
- margin-top: 10px;
39
38
  }
40
39
 
41
40
  .markdown-content .markdown-text-area {
@@ -68,7 +67,6 @@
68
67
 
69
68
  .markdown-editor-container .markdown-guidance {
70
69
  padding-right: 12px;
71
- margin-top: 8px;
72
70
  }
73
71
 
74
72
  .markdown-editor-container .character-count-wrapper {
@@ -20,9 +20,9 @@ export function PaginationCompact({ maxPage, dataTrackingId, onPageChange }) {
20
20
  onPageChange(currentPage);
21
21
  // eslint-disable-next-line react-hooks/exhaustive-deps
22
22
  }, [currentPage]);
23
- return (React.createElement("div", { className: "pagination-compact pf-v5-c-pagination pf-m-compact pf-m-bottom pf-v5-u-ml-auto" },
24
- React.createElement("nav", { className: "pf-v5-c-pagination__nav" },
25
- React.createElement("div", { className: "pf-v5-c-pagination__nav-control pf-m-prev" },
23
+ return (React.createElement("div", { className: "pagination-compact pf-c-pagination pf-m-compact pf-m-bottom pf-u-ml-auto" },
24
+ React.createElement("nav", { className: "pf-c-pagination__nav" },
25
+ React.createElement("div", { className: "pf-c-pagination__nav-control pf-m-prev" },
26
26
  React.createElement(Button, { variant: ButtonVariant.plain, type: "button", "data-tracking-id": `${dataTrackingId}-previous`, onClick: onPreviousClick, isDisabled: currentPage === 1, "aria-label": "Go to previous page" },
27
27
  React.createElement(AngleLeftIcon, null))),
28
28
  React.createElement("div", { style: {
@@ -31,7 +31,7 @@ export function PaginationCompact({ maxPage, dataTrackingId, onPageChange }) {
31
31
  currentPage,
32
32
  " of ",
33
33
  maxPage),
34
- React.createElement("div", { className: "pf-v5-c-pagination__nav-control pf-m-next" },
34
+ React.createElement("div", { className: "pf-c-pagination__nav-control pf-m-next" },
35
35
  React.createElement(Button, { variant: ButtonVariant.plain, onClick: onNextClick, "data-tracking-id": `${dataTrackingId}-next`, isDisabled: currentPage === maxPage, type: "button", "aria-label": "Go to next page" },
36
36
  React.createElement(AngleRightIcon, null))))));
37
37
  }
@@ -1,4 +1,4 @@
1
- .pagination-compact.pf-v5-c-pagination.pf-m-bottom {
1
+ .pagination-compact.pf-c-pagination.pf-m-bottom {
2
2
  padding: 0px;
3
3
  background: none;
4
4
  box-shadow: none;
@@ -1 +1 @@
1
- {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAW3B,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACtE,mBAAmB,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AA4DD,eAAO,MAAM,WAAW,gBAAiB,MAAM;;;CAqB9C,CAAC;AAEF,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,eAqPvC"}
1
+ {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAU3B,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACtE,mBAAmB,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AA4DD,eAAO,MAAM,WAAW,gBAAiB,MAAM;;;CAqB9C,CAAC;AAEF,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,eAiPvC"}
@@ -1,6 +1,5 @@
1
1
  import './PhoneInput.scss';
2
- import { InputGroup, InputGroupItem, Spinner, TextInput } from '@patternfly/react-core';
3
- import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated';
2
+ import { InputGroup, Select, SelectOption, SelectVariant, Spinner, TextInput } from '@patternfly/react-core';
4
3
  import isEmpty from 'lodash/isEmpty';
5
4
  import isEqual from 'lodash/isEqual';
6
5
  import React, { useEffect, useState } from 'react';
@@ -178,7 +177,7 @@ export function PhoneInput(props) {
178
177
  };
179
178
  const getOptions = (options) => {
180
179
  return options.map((country) => (React.createElement(SelectOption, { key: country.iso2, value: country },
181
- React.createElement("div", { className: "pf-v5-u-display-inline-flex" },
180
+ React.createElement("div", { className: "pf-u-display-inline-flex" },
182
181
  React.createElement("div", { className: `flag ${country.iso2}`, style: { marginRight: '8px' } }),
183
182
  country.name,
184
183
  " (+",
@@ -195,7 +194,7 @@ export function PhoneInput(props) {
195
194
  return getOptions(newOptions);
196
195
  };
197
196
  const placeholder = (React.createElement("div", { className: "phone-number-select-placeholder" },
198
- React.createElement("div", { className: "pf-v5-u-display-inline-flex" },
197
+ React.createElement("div", { className: "pf-u-display-inline-flex" },
199
198
  React.createElement("div", { className: `flag ${iso2}`, style: { marginRight: '5px' } }),
200
199
  iso2.toUpperCase())));
201
200
  useEffect(() => {
@@ -253,10 +252,8 @@ export function PhoneInput(props) {
253
252
  // eslint-disable-next-line react-hooks/exhaustive-deps
254
253
  }, [phoneValue]);
255
254
  return (React.createElement(InputGroup, { className: "phone-number-input" },
256
- React.createElement(InputGroupItem, null,
257
- React.createElement("div", null,
258
- React.createElement(Select, { variant: SelectVariant.single, "data-tracking-id": "case-phone-number-country-code", className: "phone-number-select", onToggle: (_event, isOpen) => onToggle(isOpen), onSelect: onCountrySelect, isOpen: isOpen, placeholderText: iso2 && phoneValue !== '' ? placeholder : 'Country Code', onFilter: onFilter, hasInlineFilter: true, inlineFilterPlaceholderText: t('Search'), isDisabled: props.isDisabled }, getOptions(initializedCountries)))),
259
- React.createElement(InputGroupItem, { style: { width: '100%' } },
260
- React.createElement(TextInput, { id: "case-phone-number", "data-tracking-id": "case-phone-number", placeholder: "55-555-5555", value: formattedNumber ? formattedNumber : phoneValue, onChange: (_event, phone) => onPhoneChange(phone), validated: validations, isDisabled: props.isDisabled })),
261
- props.isLoading && React.createElement(Spinner, { size: "lg", className: "pf-v5-u-ml-2xl pf-v5-u-mr-xl phone-spinner" })));
255
+ React.createElement("div", null,
256
+ React.createElement(Select, { variant: SelectVariant.single, "data-tracking-id": "case-phone-number-country-code", className: "phone-number-select", onToggle: onToggle, onSelect: onCountrySelect, isOpen: isOpen, placeholderText: iso2 && phoneValue !== '' ? placeholder : 'Country Code', onFilter: onFilter, hasInlineFilter: true, inlineFilterPlaceholderText: t('Search'), isDisabled: props.isDisabled }, getOptions(initializedCountries))),
257
+ React.createElement(TextInput, { id: "case-phone-number", "data-tracking-id": "case-phone-number", placeholder: "55-555-5555", value: formattedNumber ? formattedNumber : phoneValue, onChange: onPhoneChange, validated: validations, isDisabled: props.isDisabled }),
258
+ props.isLoading && React.createElement(Spinner, { isSVG: true, size: "lg", className: "pf-u-ml-2xl pf-u-mr-xl phone-spinner" })));
262
259
  }
@@ -734,7 +734,7 @@
734
734
  }
735
735
 
736
736
  .phone-number-select {
737
- .pf-v5-c-select__menu {
737
+ .pf-c-select__menu {
738
738
  min-width: 370px !important;
739
739
  }
740
740
  }
@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
8
8
  });
9
9
  };
10
10
  import { pcm } from '@cee-eng/hydrajs';
11
- import { Button, Icon, Modal, ModalVariant } from '@patternfly/react-core';
11
+ import { Button, Modal, ModalVariant } from '@patternfly/react-core';
12
12
  import OutlinedFrownIcon from '@patternfly/react-icons/dist/js/icons/outlined-frown-icon';
13
13
  import OutlinedFrownOpenIcon from '@patternfly/react-icons/dist/js/icons/outlined-frown-open-icon';
14
14
  import OutlinedGrinIcon from '@patternfly/react-icons/dist/js/icons/outlined-grin-icon';
@@ -88,27 +88,27 @@ function SupportFeedbackModal(props) {
88
88
  const sentiments = [
89
89
  {
90
90
  id: 'very_unsatisfied',
91
- icon: React.createElement(OutlinedFrownOpenIcon, null),
91
+ icon: React.createElement(OutlinedFrownOpenIcon, { size: "lg" }),
92
92
  label: 'Very Unsatisfied',
93
93
  },
94
94
  {
95
95
  id: 'unsatisfied',
96
- icon: React.createElement(OutlinedFrownIcon, null),
96
+ icon: React.createElement(OutlinedFrownIcon, { size: "lg" }),
97
97
  label: 'Unsatisfied',
98
98
  },
99
99
  {
100
100
  id: 'neutral',
101
- icon: React.createElement(OutlinedMehIcon, null),
101
+ icon: React.createElement(OutlinedMehIcon, { size: "lg" }),
102
102
  label: 'Neutral',
103
103
  },
104
104
  {
105
105
  id: 'satisfied',
106
- icon: React.createElement(OutlinedSmileIcon, null),
106
+ icon: React.createElement(OutlinedSmileIcon, { size: "lg" }),
107
107
  label: 'Satisfied',
108
108
  },
109
109
  {
110
110
  id: 'very_satisfied',
111
- icon: React.createElement(OutlinedGrinIcon, null),
111
+ icon: React.createElement(OutlinedGrinIcon, { size: "lg" }),
112
112
  label: 'Very Satisfied',
113
113
  },
114
114
  ];
@@ -116,22 +116,22 @@ function SupportFeedbackModal(props) {
116
116
  function renderModalBody() {
117
117
  return (React.createElement(React.Fragment, null,
118
118
  React.createElement("form", { className: "support-feedback-form", action: "", onSubmit: handleSubmit },
119
- React.createElement("fieldset", { className: "form-group radios feedback-satisfaction pf-v5-u-mb-sm", role: "radiogroup", "aria-labelledby": "feedback-satisfaction-label" },
120
- React.createElement("legend", { id: "feedback-satisfaction-label", className: "pf-v5-u-mb-md" },
119
+ React.createElement("fieldset", { className: "form-group radios feedback-satisfaction pf-u-mb-sm", role: "radiogroup", "aria-labelledby": "feedback-satisfaction-label" },
120
+ React.createElement("legend", { id: "feedback-satisfaction-label", className: "pf-u-mb-md" },
121
121
  React.createElement(Trans, null, "How satisfied are you with customer support\u2019s web experience?"),
122
122
  React.createElement("span", { className: "form-required", "aria-hidden": "true" }, "*"),
123
123
  ' '),
124
124
  React.createElement("div", { className: "satisfaction-values-wrapper" }, sentiments.map((sentiment) => {
125
- return (React.createElement("label", { className: `${sentiment.id} sentiment-label pf-v5-u-ml-md pf-v5-u-mr-md ${values.levelOfSatisfied === sentiment.label ? 'sentiment-selected' : ''}`, htmlFor: sentiment.id, key: sentiment.id },
126
- React.createElement("input", { type: "radio", id: sentiment.id, "aria-label": t(sentiment.label), disabled: isFetching, name: "levelOfSatisfied", value: sentiment.label, checked: values.levelOfSatisfied === sentiment.label, "aria-checked": values.levelOfSatisfied === sentiment.label, required: true, className: "feedback_button_values pf-v5-u-mb-sm pf-screen-reader", onChange: handleSentimentChange }),
125
+ return (React.createElement("label", { className: `${sentiment.id} sentiment-label pf-u-ml-md pf-u-mr-md ${values.levelOfSatisfied === sentiment.label ? 'sentiment-selected' : ''}`, htmlFor: sentiment.id, key: sentiment.id },
126
+ React.createElement("input", { type: "radio", id: sentiment.id, "aria-label": t(sentiment.label), disabled: isFetching, name: "levelOfSatisfied", value: sentiment.label, checked: values.levelOfSatisfied === sentiment.label, "aria-checked": values.levelOfSatisfied === sentiment.label, required: true, className: "feedback_button_values pf-u-mb-sm pf-screen-reader", onChange: handleSentimentChange }),
127
127
  ' ',
128
- React.createElement(Icon, { size: "lg" }, sentiment.icon),
128
+ sentiment.icon,
129
129
  React.createElement(Trans, null, sentiment.label)));
130
130
  })),
131
131
  isSubmitDisabled && (React.createElement("div", null,
132
132
  React.createElement("p", { className: "form-instructions form-invalid" },
133
133
  React.createElement(Trans, null, "Please select a value"))))),
134
- React.createElement("div", { className: "form-group pf-v5-u-mb-md" },
134
+ React.createElement("div", { className: "form-group pf-u-mb-md" },
135
135
  React.createElement("label", { htmlFor: "moreFeedback" },
136
136
  React.createElement(Trans, null, "How can we improve?")),
137
137
  React.createElement(TextAreaAutosize, { name: "moreInfo", id: "moreFeedback", placeholder: t('i18nDescribeSuggestionDetail', 'Describe your suggestion in detail'), disabled: isFetching, value: values.moreInfo, className: "form-control", onChange: handleFeedbackTextChange, rowsMin: 3 })),
@@ -140,7 +140,7 @@ function SupportFeedbackModal(props) {
140
140
  }
141
141
  function returnModalAction() {
142
142
  return [
143
- React.createElement(Button, { key: "confirm", onClick: handleSubmit, variant: "primary", isDisabled: isSubmitDisabled || isFetching, className: "pf-v5-u-ml-xs", spinnerAriaValueText: isFetching ? 'Loading' : undefined, isLoading: isFetching, "data-tracking-id": "app-feedback-submit", "aria-label": t('Send feedback') },
143
+ React.createElement(Button, { key: "confirm", onClick: handleSubmit, variant: "primary", isDisabled: isSubmitDisabled || isFetching, className: "pf-u-ml-xs", spinnerAriaValueText: isFetching ? 'Loading' : undefined, isLoading: isFetching, "data-tracking-id": "app-feedback-submit", "aria-label": t('Send feedback') },
144
144
  React.createElement(Trans, null, isFetching ? 'Sending feedback' : 'Send feedback')),
145
145
  React.createElement("button", { key: "cancel", onClick: handleModalToggle, className: "btn btn-app btn-link", "data-tracking-id": "app-feedback-cancel", "aria-label": "Cancel", disabled: isFetching },
146
146
  React.createElement(Trans, null, "Cancel")),
@@ -1,5 +1,4 @@
1
- import { IExtraData, IRow, IRowData } from '@patternfly/react-table';
2
- import { TableProps } from '@patternfly/react-table/deprecated';
1
+ import { IExtraData, IRow, IRowData, TableProps } from '@patternfly/react-table';
3
2
  import { ReactNode } from 'react';
4
3
  interface IColumn {
5
4
  id: string;
@@ -1 +1 @@
1
- {"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AASA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAKX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAiC,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAC/F,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA8C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,eAyK7B;AAED,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC"}
1
+ {"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAMR,UAAU,EAGb,MAAM,yBAAyB,CAAC;AACjC,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA6C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,eAyK7B;AAED,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC"}
@@ -9,10 +9,9 @@ var __rest = (this && this.__rest) || function (s, e) {
9
9
  }
10
10
  return t;
11
11
  };
12
- import { Bullseye, EmptyState, EmptyStateHeader, EmptyStateIcon, EmptyStateVariant, Spinner, } from '@patternfly/react-core';
12
+ import { Bullseye, EmptyState, EmptyStateIcon, EmptyStateVariant, Spinner, Title } from '@patternfly/react-core';
13
13
  import SearchIcon from '@patternfly/react-icons/dist/js/icons/search-icon';
14
- import { cellWidth, classNames, sortable, SortByDirection, TableVariant, Visibility, } from '@patternfly/react-table';
15
- import { Table, TableBody, TableHeader } from '@patternfly/react-table/deprecated';
14
+ import { cellWidth, classNames, sortable, SortByDirection, Table, TableBody, TableHeader, TableVariant, Visibility, } from '@patternfly/react-table';
16
15
  import React, { useCallback, useEffect, useState } from 'react';
17
16
  import { useTableContext } from './TableProvider';
18
17
  const noop = () => { };
@@ -23,8 +22,9 @@ const emptyStateRowDefault = [
23
22
  {
24
23
  props: { colSpan: 8 },
25
24
  title: (React.createElement(Bullseye, null,
26
- React.createElement(EmptyState, { variant: EmptyStateVariant.sm },
27
- React.createElement(EmptyStateHeader, { titleText: "No results found", icon: React.createElement(EmptyStateIcon, { icon: SearchIcon }), headingLevel: "h2" })))),
25
+ React.createElement(EmptyState, { variant: EmptyStateVariant.small },
26
+ React.createElement(EmptyStateIcon, { icon: SearchIcon }),
27
+ React.createElement(Title, { headingLevel: "h2", size: "lg" }, "No results found")))),
28
28
  },
29
29
  ],
30
30
  },
@@ -36,7 +36,7 @@ const loadingRowDefault = [
36
36
  {
37
37
  props: { colSpan: 9 },
38
38
  title: (React.createElement(Bullseye, { style: { minHeight: '350px' } },
39
- React.createElement(EmptyState, { variant: EmptyStateVariant.sm },
39
+ React.createElement(EmptyState, { variant: EmptyStateVariant.small },
40
40
  React.createElement(Spinner, { size: "xl" })))),
41
41
  },
42
42
  ],
@@ -1 +1 @@
1
- {"version":3,"file":"TablePagination.d.ts","sourceRoot":"","sources":["../../../src/Table/TablePagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAKvE,UAAU,MAAM;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE;;;KAAA,KAAK,IAAI,CAAC;IAChD,eAAe,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE;;;KAAA,KAAK,IAAI,CAAC;IACtD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,iBAAiB,CAAC;CAC9B;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,eAgC5C"}
1
+ {"version":3,"file":"TablePagination.d.ts","sourceRoot":"","sources":["../../../src/Table/TablePagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAKvE,UAAU,MAAM;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE;;;KAAA,KAAK,IAAI,CAAC;IAChD,eAAe,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE;;;KAAA,KAAK,IAAI,CAAC;IACtD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,iBAAiB,CAAC;CAC9B;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,eA6B5C"}
@@ -1,4 +1,4 @@
1
- import { Pagination, PaginationVariant } from '@patternfly/react-core';
1
+ import { Pagination } from '@patternfly/react-core';
2
2
  import React, { useEffect } from 'react';
3
3
  import { useTableContext } from './TableProvider';
4
4
  export function TablePagination(props) {
@@ -17,7 +17,5 @@ export function TablePagination(props) {
17
17
  props.currentPage && props.currentPage !== currentPage && setSelectedPage(props.currentPage);
18
18
  // eslint-disable-next-line react-hooks/exhaustive-deps
19
19
  }, [props.perPage, props.currentPage]);
20
- return (React.createElement(Pagination, { itemCount: props.itemCount || (data || []).length, widgetId: "pagination-options-menu-top", perPage: perPage, page: currentPage, variant: props.variant, titles: {
21
- paginationAriaLabel: props.variant === PaginationVariant.top ? 'Upper pagination' : 'Lower pagination',
22
- }, onSetPage: onSetPage, onPerPageSelect: onPerPageSelect }));
20
+ return (React.createElement(Pagination, { itemCount: props.itemCount || (data || []).length, widgetId: "pagination-options-menu-top", perPage: perPage, page: currentPage, variant: props.variant, onSetPage: onSetPage, onPerPageSelect: onPerPageSelect }));
23
21
  }
@@ -28,7 +28,7 @@
28
28
  cursor: not-allowed;
29
29
  }
30
30
 
31
- button.pf-v5-c-button.column-selector-btn::after {
31
+ button.pf-c-button.column-selector-btn::after {
32
32
  border: none;
33
33
  }
34
34
 
@@ -1 +1 @@
1
- {"version":3,"file":"AcceptTermsModal.d.ts","sourceRoot":"","sources":["../../../src/TermsAndConditions/AcceptTermsModal.tsx"],"names":[],"mappings":"AAUA,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAiBD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,eAyI7C"}
1
+ {"version":3,"file":"AcceptTermsModal.d.ts","sourceRoot":"","sources":["../../../src/TermsAndConditions/AcceptTermsModal.tsx"],"names":[],"mappings":"AAmBA,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAiBD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,eAyI7C"}
@@ -8,8 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
8
8
  });
9
9
  };
10
10
  import { publicApi } from '@cee-eng/hydrajs';
11
- import { Button, ButtonVariant, Checkbox, Flex, FlexItem, Modal, ModalVariant } from '@patternfly/react-core';
12
- import { Select, SelectOption } from '@patternfly/react-core/deprecated';
11
+ import { Button, ButtonVariant, Checkbox, Flex, FlexItem, Modal, ModalVariant, Select, SelectOption, } from '@patternfly/react-core';
13
12
  import React, { useEffect, useState } from 'react';
14
13
  import { Trans, useTranslation } from 'react-i18next';
15
14
  import { useFetch } from '../hooks';
@@ -71,24 +70,24 @@ export function AcceptTermsModal(props) {
71
70
  props.onConfirm(selectedTranslation.termsPdfId);
72
71
  };
73
72
  const onDropdownToggle = (toggle) => setisLangSelectorDropdownOpen(toggle);
74
- return (React.createElement(Modal, { variant: ModalVariant.medium, className: "pf-v5-u-font-size-sm", title: isFetching || !selectedTranslation ? 'Remote Access Rider' : selectedTranslation.translatedTermsName, isOpen: props.isModalOpen, showClose: props.isSubmitting ? false : true, onClose: handleModalToggle, actions: [
73
+ return (React.createElement(Modal, { variant: 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: [
75
74
  React.createElement(Button, { key: "confirm", variant: ButtonVariant.primary, isDisabled: !termsAcked || props.isSubmitting || props.isDisabled, isLoading: props.isDisabled || props.isSubmitting, "data-tracking-id": `${props.dataTrackingId || props.eventCode}-terms-accept`, onClick: onSubmitClick },
76
75
  React.createElement(Trans, null, "Submit")),
77
76
  React.createElement(Button, { key: "cancel", isDisabled: props.isSubmitting || props.isDisabled, "data-tracking-id": `${props.dataTrackingId || props.eventCode}-terms-cancel`, variant: ButtonVariant.link, onClick: props.onModalClose },
78
77
  React.createElement(Trans, null, "Cancel")),
79
78
  ] }, isFetching || !selectedTranslation ? (React.createElement("div", { style: { height: '100px' } },
80
79
  React.createElement(LoadingIndicator, null))) : (React.createElement(React.Fragment, null,
81
- React.createElement("p", { className: "pf-v5-u-mb-md" }, selectedTranslation.translatedDescription),
80
+ React.createElement("p", { className: "pf-u-mb-md" }, selectedTranslation.translatedDescription),
82
81
  React.createElement("strong", null,
83
82
  React.createElement(Trans, null, "Download the agreement")),
84
- React.createElement("p", { className: "pf-v5-u-mb-md pf-v5-u-mt-sm" }, selectedTranslation.translatedInstructions),
83
+ React.createElement("p", { className: "pf-u-mb-md pf-u-mt-sm" }, selectedTranslation.translatedInstructions),
85
84
  React.createElement(Flex, null,
86
85
  React.createElement(FlexItem, null,
87
- React.createElement(Select, { "aria-label": t('Select language'), id: "terms-language-selector", className: "pf-v5-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: (_event, toggle) => onDropdownToggle(toggle) }, Object.keys(allTranslations).map((option, index) => (React.createElement(SelectOption, { key: index, value: option }, getLocaleNameFromLocalCode(option)))))),
86
+ React.createElement(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.createElement(SelectOption, { key: index, value: option }, getLocaleNameFromLocalCode(option)))))),
88
87
  React.createElement(FlexItem, null,
89
88
  React.createElement("a", { href: selectedTranslation.pdfDownloadUrl, "data-tracking-id": `${props.eventCode}-terms-download`, target: "_blank", rel: "noopener noreferrer" },
90
89
  React.createElement(Trans, null, "Download")))),
91
- React.createElement(Checkbox, { label: t('I have read and agree to the terms'), isChecked: termsAcked, onChange: (_event, checked) => {
90
+ React.createElement(Checkbox, { label: t('I have read and agree to the terms'), isChecked: termsAcked, onChange: (checked) => {
92
91
  setTermsAcked(checked);
93
92
  }, "aria-label": t('I have read and agree to the terms'), id: "agree-terms", name: "agree-terms" })))));
94
93
  }
@@ -1 +1 @@
1
- {"version":3,"file":"TextAreaResizable.d.ts","sourceRoot":"","sources":["../../../src/TextAreaResizable/TextAreaResizable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAEpE,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEnD,UAAU,MAAO,SAAQ,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACpG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAC;CACpF;AACD,eAAO,MAAM,iBAAiB,UAAW,MAAM,gBAqD9C,CAAC"}
1
+ {"version":3,"file":"TextAreaResizable.d.ts","sourceRoot":"","sources":["../../../src/TextAreaResizable/TextAreaResizable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAEpE,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEnD,UAAU,MAAO,SAAQ,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACpG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAC;CACpF;AACD,eAAO,MAAM,iBAAiB,UAAW,MAAM,gBAoD9C,CAAC"}
@@ -26,5 +26,5 @@ export const TextAreaResizable = (props) => {
26
26
  else
27
27
  return 'default';
28
28
  };
29
- return (React.createElement(TextArea, { id: id, rows: rows || rowsMin, className: className, "aria-required": props['aria-required'], isRequired: isRequired, maxLength: maxLength, name: name, value: value, autoResize: autoResize, validated: validatedCheck(), onChange: (event, value) => onTextAreaChange(value, event), disabled: isDisabled, resizeOrientation: "vertical" }));
29
+ return (React.createElement(TextArea, { id: id, rows: rows || rowsMin, className: className, "aria-required": props['aria-required'], isRequired: isRequired, maxLength: maxLength, name: name, value: value, autoResize: autoResize, validated: validatedCheck(), onChange: onTextAreaChange, disabled: isDisabled }));
30
30
  };
@@ -16,7 +16,7 @@
16
16
  margin: 0;
17
17
  }
18
18
 
19
- .Toastify__toast-body > .pf-v5-c-alert {
19
+ .Toastify__toast-body > .pf-c-alert {
20
20
  height: 100%;
21
21
  min-width: 500px;
22
22
  }
@@ -1 +1 @@
1
- {"version":3,"file":"TopContentSearch.d.ts","sourceRoot":"","sources":["../../../src/TopContentSearch/TopContentSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,2DAA2D,CAAC;AAQ5F,OAAO,KAA4D,MAAM,OAAO,CAAC;AAGjF,UAAU,MAAM;IACZ,cAAc,EAAE,MAAM,CAAC;IACvB,2BAA2B,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACzD,cAAc,EAAE,eAAe,EAAE,CAAC;IAClC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;CAC3E;AAED,eAAO,MAAM,gBAAgB,eAAgB,MAAM,WASlD,CAAC;AAOF,wBAAgB,gBAAgB,CAAC,EAC7B,cAAmB,EACnB,2BAA6C,EAC7C,QAAQ,EACR,cAAc,EACd,mBAA2B,GAC9B,EAAE,MAAM,eA8GR"}
1
+ {"version":3,"file":"TopContentSearch.d.ts","sourceRoot":"","sources":["../../../src/TopContentSearch/TopContentSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,2DAA2D,CAAC;AAQ5F,OAAO,KAA4D,MAAM,OAAO,CAAC;AAGjF,UAAU,MAAM;IACZ,cAAc,EAAE,MAAM,CAAC;IACvB,2BAA2B,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACzD,cAAc,EAAE,eAAe,EAAE,CAAC;IAClC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;CAC3E;AAED,eAAO,MAAM,gBAAgB,eAAgB,MAAM,WASlD,CAAC;AAOF,wBAAgB,gBAAgB,CAAC,EAC7B,cAAmB,EACnB,2BAA6C,EAC7C,QAAQ,EACR,cAAc,EACd,mBAA2B,GAC9B,EAAE,MAAM,eA2GR"}
@@ -56,9 +56,8 @@ export function TopContentSearch({ topContentData = [], topContentResultsWrapper
56
56
  dtmTrackEvent(searchWrapperRef, eventName, event);
57
57
  };
58
58
  const highlightSearchResults = useCallback((searchTerm) => {
59
- // highlight search term present in contents only. Contents are present within <dd> tag
60
- const contentElements = topContentResultsWrapperRef.current.querySelectorAll('dd.pf-v5-c-accordion__expandable-content');
61
- const markInstance = new Mark(contentElements);
59
+ const d = topContentResultsWrapperRef.current;
60
+ const markInstance = new Mark(d);
62
61
  markInstance.unmark({
63
62
  done: () => {
64
63
  if (isEmpty(searchTerm))
@@ -105,8 +104,8 @@ export function TopContentSearch({ topContentData = [], topContentResultsWrapper
105
104
  setSearchText(value);
106
105
  debounceSearch(value);
107
106
  };
108
- return (React.createElement("div", { className: "top-content-search-wrapper pf-v5-u-p-md", ref: searchWrapperRef },
109
- React.createElement("label", { htmlFor: "top-content-search-input", className: "pf-v5-u-mr-md top-content-search-label" },
107
+ return (React.createElement("div", { className: "top-content-search-wrapper pf-u-p-md", ref: searchWrapperRef },
108
+ React.createElement("label", { htmlFor: "top-content-search-input", className: "pf-u-mr-md top-content-search-label" },
110
109
  React.createElement(Trans, null, "Filter results:")),
111
- React.createElement(SearchInput, { id: "top-content-search-input", className: "top-content-search-input pf-v5-u-flex-grow-1", "aria-label": t('search top content'), placeholder: t('Enter relevant keywords'), value: searchText, "data-tracking-id": dataTrackingId, onChange: (e, val) => onSearchInputChange(val), onClear: onSearchInputClear })));
110
+ React.createElement(SearchInput, { id: "top-content-search-input", className: "top-content-search-input pf-u-flex-grow-1", "aria-label": t('search top content'), placeholder: t('Enter relevant keywords'), value: searchText, "data-tracking-id": dataTrackingId, onChange: onSearchInputChange, onClear: onSearchInputClear })));
112
111
  }
@@ -6,12 +6,12 @@ import React from 'react';
6
6
  import { SupportFeedbackForm } from '../SupportFeedbackForm';
7
7
  const defaultTitle = "Sorry, we're experiencing an error";
8
8
  const errorMessageButtonLabel = 'contact us';
9
- const defaultErrorMessage = (React.createElement("p", { className: "pf-v5-u-mb-0" },
9
+ const defaultErrorMessage = (React.createElement("p", { className: "pf-u-mb-0" },
10
10
  "Try refreshing the page. Please ",
11
11
  React.createElement(SupportFeedbackForm, { isInline: true, buttonLabel: errorMessageButtonLabel }),
12
12
  " if the problem persists.",
13
13
  React.createElement("br", null),
14
- React.createElement(Button, { variant: "link", component: "a", href: "https://status.redhat.com/", "data-tracking-id": "redirect-status-portal-button", target: "_blank", icon: React.createElement(ExternalLinkAltIcon, { className: "status-portal-button-icon" }), iconPosition: "right", className: "pf-v5-u-pl-0", isInline: true, "aria-label": "View status page" }, "View status page"),
14
+ React.createElement(Button, { variant: "link", component: "a", href: "https://status.redhat.com/", "data-tracking-id": "redirect-status-portal-button", target: "_blank", icon: React.createElement(ExternalLinkAltIcon, { className: "status-portal-button-icon" }), iconPosition: "right", className: "pf-u-pl-0", isInline: true, "aria-label": "View status page" }, "View status page"),
15
15
  ' '));
16
16
  const defaultErrorObj = {
17
17
  500: {
@@ -1,3 +1,3 @@
1
1
  .status-portal-button-icon {
2
- font-size: var(--pf-v5-global--icon--FontSize--sm);
2
+ font-size: var(--pf-global--icon--FontSize--sm);
3
3
  }
@@ -11,5 +11,4 @@ export * from './useForceUpdate';
11
11
  export * from './useLRUCache';
12
12
  export * from './useBreakpoint';
13
13
  export * from './useOnScreen';
14
- export * from './useSelectKeyboardNavigator';
15
14
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,8BAA8B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC"}
@@ -11,4 +11,3 @@ export * from './useForceUpdate';
11
11
  export * from './useLRUCache';
12
12
  export * from './useBreakpoint';
13
13
  export * from './useOnScreen';
14
- export * from './useSelectKeyboardNavigator';
@@ -1 +1 @@
1
- {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAO/D,oBAAY,MAAM,GAAG;IACjB,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CAClC,CAAC;AAaF,iBAAS,kBAAkB,CAAC,EAAE,QAAQ,EAAE,OAAwB,EAAE,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAAE,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,eA+ChH;AAED,iBAAS,aAAa;;EAMrB;AACD,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,CAAC"}
1
+ {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAO/D,oBAAY,MAAM,GAAG;IACjB,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CAClC,CAAC;AAYF,iBAAS,kBAAkB,CAAC,EAAE,QAAQ,EAAE,OAAwB,EAAE,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAAE,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,eA+ChH;AAED,iBAAS,aAAa;;EAMrB;AACD,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,CAAC"}
@@ -8,7 +8,6 @@ const defaultQueries = {
8
8
  md: `(min-width: 768px)`,
9
9
  lg: `(min-width: 992px)`,
10
10
  xl: `(min-width: 1300px)`,
11
- xxl: `(min-width: 1800px)`,
12
11
  };
13
12
  function BreakpointProvider({ children, queries = defaultQueries }) {
14
13
  const [queryMatch, setQueryMatch] = useState({});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rh-support/components",
3
- "version": "2.1.28",
3
+ "version": "2.4.10-beta.6",
4
4
  "description": "Contains all reusabel components for support app",
5
5
  "author": "Vikas Rathee <vrathee@redhat.com>",
6
6
  "license": "ISC",
@@ -55,11 +55,11 @@
55
55
  "copy:img:cjs": "../../node_modules/.bin/copyfiles -V -u 1 -a 'src/**/*.png' 'src/**/*.jpg' 'src/**/*.gif' lib/cjs"
56
56
  },
57
57
  "peerDependencies": {
58
- "@cee-eng/hydrajs": "4.16.39",
58
+ "@cee-eng/hydrajs": "4.16.43",
59
59
  "@cee-eng/ui-toolkit": "1.1.6",
60
- "@patternfly/patternfly": "5.1.0",
61
- "@patternfly/react-core": "5.1.1",
62
- "@patternfly/react-table": "5.1.1",
60
+ "@patternfly/patternfly": "4.196.7",
61
+ "@patternfly/react-core": "4.264.0",
62
+ "@patternfly/react-table": "4.111.33",
63
63
  "dompurify": "^2.2.6",
64
64
  "downshift": "^6.0.5",
65
65
  "js-worker-search": "^1.4.1",
@@ -68,19 +68,20 @@
68
68
  "mark.js": "^8.11.1",
69
69
  "react": "17.0.2",
70
70
  "react-bootstrap-typeahead": "^5.1.4",
71
+ "react-content-loader": "^5.1.0",
71
72
  "react-router-dom": "^5.1.2",
72
73
  "react-toastify": "^5.4.1",
73
74
  "use-deep-compare-effect": "^1.6.1"
74
75
  },
75
76
  "dependencies": {
76
- "@cee-eng/hydrajs": "4.16.39",
77
+ "@cee-eng/hydrajs": "4.16.43",
77
78
  "@cee-eng/ui-toolkit": "1.1.6",
78
- "@patternfly/patternfly": "5.1.0",
79
- "@patternfly/react-core": "5.1.1",
80
- "@patternfly/react-table": "5.1.1",
79
+ "@patternfly/patternfly": "4.196.7",
80
+ "@patternfly/react-core": "4.264.0",
81
+ "@patternfly/react-table": "4.111.33",
81
82
  "@rh-support/types": "2.0.2",
82
- "@rh-support/user-permissions": "2.1.20",
83
- "@rh-support/utils": "2.1.13",
83
+ "@rh-support/user-permissions": "2.4.10-beta.6",
84
+ "@rh-support/utils": "2.4.10-beta.6",
84
85
  "dompurify": "^2.2.6",
85
86
  "downshift": "^6.0.5",
86
87
  "js-worker-search": "^1.4.1",
@@ -89,6 +90,7 @@
89
90
  "mark.js": "^8.11.1",
90
91
  "react": "17.0.2",
91
92
  "react-bootstrap-typeahead": "^5.1.4",
93
+ "react-content-loader": "^5.1.0",
92
94
  "react-dom": "17.0.2",
93
95
  "react-router-dom": "^5.1.2",
94
96
  "react-toastify": "^5.4.1",
@@ -115,5 +117,5 @@
115
117
  "defaults and supports es6-module",
116
118
  "maintained node versions"
117
119
  ],
118
- "gitHead": "d17dacfd35aa08c446f37c8f0f92760346b8eb7a"
120
+ "gitHead": "f4caba45a2ffbc0cb441fdd30630769b447931d1"
119
121
  }
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- interface IProps {
3
- list: any[];
4
- isOpen: boolean;
5
- setIsOpen: (value: React.SetStateAction<boolean>) => void;
6
- onSelect: (value: any) => void;
7
- }
8
- export declare function useSelectKeyboardNavigator({ list, isOpen, setIsOpen, onSelect }: IProps): {
9
- onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
10
- focusedItemIndex: number;
11
- };
12
- export {};
13
- //# sourceMappingURL=useSelectKeyboardNavigator.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSelectKeyboardNavigator.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSelectKeyboardNavigator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,UAAU,MAAM;IACZ,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC1D,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CAClC;AAED,wBAAgB,0BAA0B,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,MAAM;4BA6BrD,mBAAmB,CAAC,gBAAgB,CAAC;;EAuBvE"}
@@ -1,55 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useSelectKeyboardNavigator = void 0;
4
- const react_1 = require("react");
5
- function useSelectKeyboardNavigator({ list, isOpen, setIsOpen, onSelect }) {
6
- const [focusedItemIndex, setFocusedItemIndex] = react_1.useState(null);
7
- const handleMenuArrowKeys = (key) => {
8
- let indexToFocus;
9
- if (isOpen) {
10
- if (key === 'ArrowUp') {
11
- // When no index is set or at the first index, focus to the last, otherwise decrement focus index
12
- if (focusedItemIndex === null || focusedItemIndex === 0) {
13
- indexToFocus = list.length - 1;
14
- }
15
- else {
16
- indexToFocus = focusedItemIndex - 1;
17
- }
18
- }
19
- if (key === 'ArrowDown') {
20
- // When no index is set or at the last index, focus to the first, otherwise increment focus index
21
- if (focusedItemIndex === null || focusedItemIndex === list.length - 1) {
22
- indexToFocus = 0;
23
- }
24
- else {
25
- indexToFocus = focusedItemIndex + 1;
26
- }
27
- }
28
- setFocusedItemIndex(indexToFocus);
29
- }
30
- };
31
- const onInputKeyDown = (event) => {
32
- const focusedItem = focusedItemIndex ? list[focusedItemIndex] : list[0];
33
- switch (event.key) {
34
- // Select the first available option
35
- case 'Enter':
36
- if (!isOpen) {
37
- setIsOpen((pre) => !pre);
38
- }
39
- else if (isOpen) {
40
- onSelect(focusedItem);
41
- }
42
- break;
43
- case 'Escape':
44
- setIsOpen(false);
45
- break;
46
- case 'ArrowUp':
47
- case 'ArrowDown':
48
- event.preventDefault();
49
- handleMenuArrowKeys(event.key);
50
- break;
51
- }
52
- };
53
- return { onInputKeyDown, focusedItemIndex };
54
- }
55
- exports.useSelectKeyboardNavigator = useSelectKeyboardNavigator;
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- interface IProps {
3
- list: any[];
4
- isOpen: boolean;
5
- setIsOpen: (value: React.SetStateAction<boolean>) => void;
6
- onSelect: (value: any) => void;
7
- }
8
- export declare function useSelectKeyboardNavigator({ list, isOpen, setIsOpen, onSelect }: IProps): {
9
- onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
10
- focusedItemIndex: number;
11
- };
12
- export {};
13
- //# sourceMappingURL=useSelectKeyboardNavigator.d.ts.map