@rh-support/components 2.0.4 → 2.0.7-beta.1

package/lib/cjs/SupportFeedbackForm/SupportFeedbackModal.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -38,92 +27,48 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            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;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SupportFeedbackModal = void 0;
-var hydrajs_1 = require("@cee-eng/hydrajs");
-var react_core_1 = require("@patternfly/react-core");
-var outlined_frown_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-frown-icon"));
-var outlined_frown_open_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-frown-open-icon"));
-var outlined_grin_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-grin-icon"));
-var outlined_meh_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-meh-icon"));
-var outlined_smile_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-smile-icon"));
-var utils_1 = require("@rh-support/utils");
-var isEmpty_1 = __importDefault(require("lodash/isEmpty"));
-var react_1 = __importStar(require("react"));
-var react_i18next_1 = require("react-i18next");
-var react_router_dom_1 = require("react-router-dom");
-var useFetch_1 = require("../hooks/useFetch");
-var TextAreaAutosize_1 = require("../TextAreaAutosize");
-var ToastNotification_1 = require("../ToastNotification");
-var required = {
+const hydrajs_1 = require("@cee-eng/hydrajs");
+const react_core_1 = require("@patternfly/react-core");
+const outlined_frown_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-frown-icon"));
+const outlined_frown_open_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-frown-open-icon"));
+const outlined_grin_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-grin-icon"));
+const outlined_meh_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-meh-icon"));
+const outlined_smile_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/outlined-smile-icon"));
+const utils_1 = require("@rh-support/utils");
+const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const react_router_dom_1 = require("react-router-dom");
+const useFetch_1 = require("../hooks/useFetch");
+const TextAreaAutosize_1 = require("../TextAreaAutosize");
+const ToastNotification_1 = require("../ToastNotification");
+const required = {
     levelOfSatisfied: true,
     moreInfo: false,
 };
-var defaultProps = {
+const defaultProps = {
     isModalOpen: false,
 };
 function SupportFeedbackModal(props) {
-    var _this = this;
     var _a, _b;
-    var t = react_i18next_1.useTranslation().t;
-    var seSessionId = (_b = (_a = utils_1.getUrlParsedParams(react_router_dom_1.useLocation().search)) === null || _a === void 0 ? void 0 : _a.seSessionId) !== null && _b !== void 0 ? _b : '';
-    var formInitState = {
+    const { t } = react_i18next_1.useTranslation();
+    const seSessionId = (_b = (_a = utils_1.getUrlParsedParams(react_router_dom_1.useLocation().search)) === null || _a === void 0 ? void 0 : _a.seSessionId) !== null && _b !== void 0 ? _b : '';
+    const formInitState = {
         levelOfSatisfied: null,
         moreInfo: '',
     };
-    var _c = __read(react_1.useState(formInitState), 2), values = _c[0], setValues = _c[1];
-    var _d = useFetch_1.useFetch(hydrajs_1.pcm.sendFeedbackForm, { propgateErrors: true }), request = _d.request, isFetching = _d.isFetching;
-    var _e = __read(react_1.useState(false), 2), isSubmitDisabled = _e[0], setIsSubmitDisabled = _e[1];
-    var _f = __read(react_1.useState(true), 2), isSubmitButtonValid = _f[0], setSubmitButtonValid = _f[1];
-    react_1.useEffect(function () {
-        var valid = true;
-        Object.keys(values).forEach(function (key) {
+    const [values, setValues] = react_1.useState(formInitState);
+    const { request, isFetching } = useFetch_1.useFetch(hydrajs_1.pcm.sendFeedbackForm, { propgateErrors: true });
+    const [isSubmitDisabled, setIsSubmitDisabled] = react_1.useState(false);
+    const [isSubmitButtonValid, setSubmitButtonValid] = react_1.useState(true);
+    react_1.useEffect(() => {
+        let valid = true;
+        Object.keys(values).forEach((key) => {
             if (required[key]) {
                 valid = valid && !isEmpty_1.default(values[key]);
             }
@@ -131,47 +76,32 @@ function SupportFeedbackModal(props) {
         setSubmitButtonValid(!valid);
     }, [values]);
     // To Handle the Feedback Satisfaction values
-    var handleSentimentChange = function (event) {
-        var _a;
+    const handleSentimentChange = (event) => {
         setIsSubmitDisabled(false);
-        setValues(__assign(__assign({}, values), (_a = {}, _a[event.target.name] = event.target.value, _a)));
+        setValues(Object.assign(Object.assign({}, values), { [event.target.name]: event.target.value }));
     };
     // To Handle the Text Area Input (Feedback Description)
-    var handleFeedbackTextChange = function (event) {
-        var _a;
-        setValues(__assign(__assign({}, values), (_a = {}, _a[event.target.name] = event.target.value, _a)));
+    const handleFeedbackTextChange = (event) => {
+        setValues(Object.assign(Object.assign({}, values), { [event.target.name]: event.target.value }));
     };
-    var handleSubmit = function (event) { return __awaiter(_this, void 0, void 0, function () {
-        var error_1;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    event.preventDefault();
-                    if (!!isSubmitButtonValid) return [3 /*break*/, 5];
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, 3, , 4]);
-                    return [4 /*yield*/, request(values, window.sessionjs, window.location.href, seSessionId)];
-                case 2:
-                    _a.sent();
-                    setValues(formInitState);
-                    ToastNotification_1.ToastNotification.addSuccessMessage(t("Thank you. We've received your feedback."), t('Have a great day!'));
-                    handleModalToggle();
-                    return [3 /*break*/, 4];
-                case 3:
-                    error_1 = _a.sent();
-                    ToastNotification_1.ToastNotification.addDangerMessage(t('Failed to submit feedback.'));
-                    return [3 /*break*/, 4];
-                case 4: return [3 /*break*/, 6];
-                case 5:
-                    setIsSubmitDisabled(true);
-                    _a.label = 6;
-                case 6: return [2 /*return*/];
+    const handleSubmit = (event) => __awaiter(this, void 0, void 0, function* () {
+        event.preventDefault();
+        if (!isSubmitButtonValid) {
+            try {
+                yield request(values, window.sessionjs, window.location.href, seSessionId);
+                setValues(formInitState);
+                ToastNotification_1.ToastNotification.addSuccessMessage(t(`Thank you. We've received your feedback.`), t('Have a great day!'));
+                handleModalToggle();
             }
-        });
-    }); };
+            catch (error) {
+                ToastNotification_1.ToastNotification.addDangerMessage(t('Failed to submit feedback.'));
+            }
+        }
+        else
+            setIsSubmitDisabled(true);
+    });
     // Function for Toggling the Modal when Provide feedback button is clicked
-    var handleModalToggle = function () {
+    const handleModalToggle = () => {
         if (isFetching)
             return;
         props.onClose();
@@ -179,7 +109,7 @@ function SupportFeedbackModal(props) {
         setValues({ levelOfSatisfied: null, moreInfo: '' });
     };
     // Feedback Satisfaction Values
-    var sentiments = [
+    const sentiments = [
         {
             id: 'very_unsatisfied',
             icon: react_1.default.createElement(outlined_frown_open_icon_1.default, { size: "lg" }),
@@ -214,8 +144,8 @@ function SupportFeedbackModal(props) {
                         react_1.default.createElement(react_i18next_1.Trans, null, "How satisfied are you with customer support\u2019s web experience?"),
                         react_1.default.createElement("span", { className: "form-required", "aria-hidden": "true" }, "*"),
                         ' '),
-                    react_1.default.createElement("div", { className: "satisfaction-values-wrapper" }, sentiments.map(function (sentiment) {
-                        return (react_1.default.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 },
+                    react_1.default.createElement("div", { className: "satisfaction-values-wrapper" }, sentiments.map((sentiment) => {
+                        return (react_1.default.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 },
                             react_1.default.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 }),
                             ' ',
                             sentiment.icon,

package/lib/cjs/Table/PFTable.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -40,39 +29,18 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PFTable = exports.defaultTableSortMethod = void 0;
-var react_core_1 = require("@patternfly/react-core");
-var search_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/search-icon"));
-var react_table_1 = require("@patternfly/react-table");
-var react_1 = __importStar(require("react"));
-var TableProvider_1 = require("./TableProvider");
-var noop = function () { };
-var emptyStateRowDefault = [
+const react_core_1 = require("@patternfly/react-core");
+const search_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/search-icon"));
+const react_table_1 = require("@patternfly/react-table");
+const react_1 = __importStar(require("react"));
+const TableProvider_1 = require("./TableProvider");
+const noop = () => { };
+const emptyStateRowDefault = [
     {
         heightAuto: true,
         cells: [
@@ -86,7 +54,7 @@ var emptyStateRowDefault = [
         ],
     },
 ];
-var loadingRowDefault = [
+const loadingRowDefault = [
     {
         heightAuto: true,
         cells: [
@@ -99,56 +67,55 @@ var loadingRowDefault = [
         ],
     },
 ];
-var defaultSortMethod = function (a, b) { return (a < b ? -1 : a > b ? 1 : 0); };
+const defaultSortMethod = (a, b) => (a < b ? -1 : a > b ? 1 : 0);
 exports.defaultTableSortMethod = defaultSortMethod;
 function PFTable(props) {
-    var className = props.className, pagination = props.pagination, onRowClick = props.onRowClick, onSortChange = props.onSortChange, onSelect = props.onSelect, _a = props.emptyStateRow, emptyStateRow = _a === void 0 ? emptyStateRowDefault : _a, _b = props.loadingRow, loadingRow = _b === void 0 ? loadingRowDefault : _b, isLoading = props.isLoading, keepPageNumberOnDataChange = props.keepPageNumberOnDataChange, sortInfo = props.sortInfo, restProps = __rest(props, ["className", "pagination", "onRowClick", "onSortChange", "onSelect", "emptyStateRow", "loadingRow", "isLoading", "keepPageNumberOnDataChange", "sortInfo"]);
-    var _c = TableProvider_1.useTableContext(), columns = _c.columns, data = _c.data, currentPage = _c.currentPage, perPage = _c.perPage, setSelectedPage = _c.setSelectedPage;
-    var _d = __read(react_1.useState(), 2), sortBy = _d[0], setSortBy = _d[1];
-    var _e = __read(react_1.useState([]), 2), pfColumns = _e[0], setPFColumns = _e[1];
-    var _f = __read(react_1.useState([]), 2), pfRows = _f[0], setPFRows = _f[1];
-    var isSelectColumnVisible = onSelect && (data || []).length > 0;
-    var onSort = function (event, index, direction) {
+    const { className, pagination, onRowClick, onSortChange, onSelect, emptyStateRow = emptyStateRowDefault, loadingRow = loadingRowDefault, isLoading, keepPageNumberOnDataChange, sortInfo } = props, restProps = __rest(props, ["className", "pagination", "onRowClick", "onSortChange", "onSelect", "emptyStateRow", "loadingRow", "isLoading", "keepPageNumberOnDataChange", "sortInfo"]);
+    const { columns, data, currentPage, perPage, setSelectedPage } = TableProvider_1.useTableContext();
+    const [sortBy, setSortBy] = react_1.useState();
+    const [pfColumns, setPFColumns] = react_1.useState([]);
+    const [pfRows, setPFRows] = react_1.useState([]);
+    const isSelectColumnVisible = onSelect && (data || []).length > 0;
+    const onSort = (event, index, direction) => {
         // if onselect option is passed we need to decrease index by 1 to account for the checkbox column
-        var actualIndex = isSelectColumnVisible ? index - 1 : index;
+        const actualIndex = isSelectColumnVisible ? index - 1 : index;
         if (sortBy && sortBy.index === index && sortBy.direction === direction)
             return;
         setSortBy({
-            index: index,
-            direction: direction,
+            index,
+            direction,
         });
         onSortChange ? onSortChange(columns[actualIndex], direction) : setSortedRows(actualIndex, direction);
     };
-    react_1.useEffect(function () {
+    react_1.useEffect(() => {
         if (!sortInfo)
             return;
-        var column = sortInfo.column, direction = sortInfo.direction;
-        var columnIndex = columns.findIndex(function (item) { return item.id === column; });
-        var actualIndex = onSelect ? columnIndex + 1 : columnIndex;
+        const { column, direction } = sortInfo;
+        const columnIndex = columns.findIndex((item) => item.id === column);
+        const actualIndex = onSelect ? columnIndex + 1 : columnIndex;
         if (sortBy && sortBy.index === actualIndex && sortBy.direction === direction)
             return;
         setSortBy({
             index: actualIndex,
-            direction: direction,
+            direction,
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [sortInfo]);
-    var setSortedRows = react_1.useCallback(function (index, direction, rows) {
-        if (rows === void 0) { rows = null; }
+    const setSortedRows = react_1.useCallback((index, direction, rows = null) => {
         if (onSortChange)
             return;
-        var sortMethod = columns[index].sortMethod || defaultSortMethod;
-        var sortedRows = (rows || pfRows).sort(function (a, b) { return sortMethod(a.cells[index], b.cells[index], direction); });
-        var sortedData = direction === react_table_1.SortByDirection.asc ? sortedRows : sortedRows.reverse();
+        const sortMethod = columns[index].sortMethod || defaultSortMethod;
+        const sortedRows = (rows || pfRows).sort((a, b) => sortMethod(a.cells[index], b.cells[index], direction));
+        const sortedData = direction === react_table_1.SortByDirection.asc ? sortedRows : sortedRows.reverse();
         setPFRows(sortedData);
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [pfRows, columns]);
-    react_1.useEffect(function () {
-        var mappedPFColumns = columns.map(function (item) {
-            var title = item.title, isSortable = item.sortable, show = item.show, width = item.cellWidth;
+    react_1.useEffect(() => {
+        const mappedPFColumns = columns.map((item) => {
+            const { title, sortable: isSortable, show, cellWidth: width } = item;
             // tslint:disable-next-line:no-object-literal-type-assertion
-            var mappedColumn = {};
+            const mappedColumn = {};
             mappedColumn['title'] = title || '';
             if (isSortable) {
                 mappedColumn['transforms'] = [];
@@ -165,16 +132,16 @@ function PFTable(props) {
         });
         setPFColumns(mappedPFColumns);
     }, [columns]);
-    react_1.useEffect(function () {
-        var rows = data.map(function (row, index) {
-            var a = [];
-            columns.forEach(function (item) {
-                var accessor = item.accessor, cell = item.cell, _a = item.rowProps, rowProps = _a === void 0 ? noop : _a;
+    react_1.useEffect(() => {
+        const rows = data.map((row, index) => {
+            const a = [];
+            columns.forEach((item) => {
+                const { accessor, cell, rowProps = noop } = item;
                 if (cell) {
-                    a.push({ title: cell(row, index), props: __assign({}, rowProps(row)) });
+                    a.push({ title: cell(row, index), props: Object.assign({}, rowProps(row)) });
                 }
                 else if (accessor) {
-                    var rowData = accessor(row);
+                    const rowData = accessor(row);
                     a.push(rowData);
                 }
             });
@@ -183,36 +150,32 @@ function PFTable(props) {
         setPFRows(rows);
         pagination && !keepPageNumberOnDataChange && setSelectedPage(1);
         if (sortBy && sortBy.direction && sortBy.index !== undefined && (data || []).length > 0) {
-            var actualIndex = isSelectColumnVisible ? sortBy.index - 1 : sortBy.index;
+            const actualIndex = isSelectColumnVisible ? sortBy.index - 1 : sortBy.index;
             setSortedRows(actualIndex, sortBy.direction, rows);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [data]);
-    var getVisibleRows = function () {
-        return pagination ? pfRows.slice((currentPage - 1) * perPage, currentPage * perPage) : pfRows;
-    };
-    var onRowSelect = function (ev, isSelected, rowindex, rowdata, extradata) {
+    const getVisibleRows = () => pagination ? pfRows.slice((currentPage - 1) * perPage, currentPage * perPage) : pfRows;
+    const onRowSelect = (ev, isSelected, rowindex, rowdata, extradata) => {
         // currently there seems to be a bug in PFTable if the data is not changed
         // then this function is called with the previous state
         // so we call all the setState functions with the function syntax.
         if (rowindex === -1) {
-            setPFRows(function (currentRows) {
-                return currentRows.map(function (row) {
-                    row.selected = isSelected;
-                    return row;
-                });
-            });
+            setPFRows((currentRows) => currentRows.map((row) => {
+                row.selected = isSelected;
+                return row;
+            }));
         }
         else {
-            setPFRows(function (currentRows) {
-                var updatedRows = __spreadArray([], __read(currentRows));
+            setPFRows((currentRows) => {
+                const updatedRows = [...currentRows];
                 updatedRows[rowindex].selected = isSelected;
                 return updatedRows;
             });
         }
         onSelect && onSelect(ev, isSelected, rowindex, rowdata, extradata);
     };
-    var getTableRows = function () {
+    const getTableRows = () => {
         if (!isLoading && emptyStateRow && (data || []).length < 1) {
             return emptyStateRow;
         }
@@ -223,8 +186,8 @@ function PFTable(props) {
             return getVisibleRows();
         }
     };
-    var conditionalProps = __assign({}, (isSelectColumnVisible ? { onSelect: onRowSelect } : undefined));
-    var getSortBy = function () {
+    const conditionalProps = Object.assign({}, (isSelectColumnVisible ? { onSelect: onRowSelect } : undefined));
+    const getSortBy = () => {
         var _a;
         if (sortBy) {
             return {
@@ -234,7 +197,7 @@ function PFTable(props) {
         }
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(react_table_1.Table, __assign({}, restProps, conditionalProps, { variant: react_table_1.TableVariant.compact, cells: pfColumns, sortBy: getSortBy(), onSort: onSort, rows: getTableRows(), className: props.className ? props.className : '', actionResolver: props.actionResolver, actions: props.actions || null, areActionsDisabled: props.areActionsDisabled || null }),
+        react_1.default.createElement(react_table_1.Table, Object.assign({}, restProps, conditionalProps, { variant: react_table_1.TableVariant.compact, cells: pfColumns, sortBy: getSortBy(), onSort: onSort, rows: getTableRows(), className: props.className ? props.className : '', actionResolver: props.actionResolver, actions: props.actions || null, areActionsDisabled: props.areActionsDisabled || null }),
             react_1.default.createElement(react_table_1.TableHeader, null),
             react_1.default.createElement(react_table_1.TableBody, { onRowClick: onRowClick ? onRowClick : noop }))));
 }

package/lib/cjs/Table/Table.js

@@ -18,38 +18,21 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Table = void 0;
-var react_1 = __importStar(require("react"));
-var TableProvider_1 = require("./TableProvider");
-function Table(_a) {
-    var children = _a.children, columns = _a.columns, data = _a.data, selectedColumns = _a.selectedColumns;
-    var _b = __read(react_1.useState(1), 2), currentPage = _b[0], setSelectedPage = _b[1];
-    var _c = __read(react_1.useState(10), 2), perPage = _c[0], setPerPage = _c[1];
+const react_1 = __importStar(require("react"));
+const TableProvider_1 = require("./TableProvider");
+function Table({ children, columns, data, selectedColumns }) {
+    const [currentPage, setSelectedPage] = react_1.useState(1);
+    const [perPage, setPerPage] = react_1.useState(10);
     return (react_1.default.createElement(TableProvider_1.TableContext.Provider, { value: {
-            columns: columns,
-            data: data,
-            perPage: perPage,
-            currentPage: currentPage,
-            setSelectedPage: setSelectedPage,
-            setPerPage: setPerPage,
-            selectedColumns: selectedColumns,
+            columns,
+            data,
+            perPage,
+            currentPage,
+            setSelectedPage,
+            setPerPage,
+            selectedColumns,
         } }, children));
 }
 exports.Table = Table;

package/lib/cjs/Table/TableColumnSelector.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './columnSelector.css';
 interface IProps {
     onColumnSelectorChange: (columns: string[]) => void;

package/lib/cjs/Table/TableColumnSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableColumnSelector.d.ts","sourceRoot":"","sources":["../../../src/Table/TableColumnSelector.tsx"],"names":[],"mappings":";AACA,OAAO,sBAAsB,CAAC;AAU9B,UAAU,MAAM;IACZ,sBAAsB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACvD;AAED,wBAAgB,mBAAmB,CAAC,EAAE,sBAAsB,EAAE,EAAE,MAAM,eAoCrE"}
+{"version":3,"file":"TableColumnSelector.d.ts","sourceRoot":"","sources":["../../../src/Table/TableColumnSelector.tsx"],"names":[],"mappings":"AACA,OAAO,sBAAsB,CAAC;AAU9B,UAAU,MAAM;IACZ,sBAAsB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACvD;AAED,wBAAgB,mBAAmB,CAAC,EAAE,sBAAsB,EAAE,EAAE,MAAM,eAoCrE"}

package/lib/cjs/Table/TableColumnSelector.js

@@ -6,30 +6,29 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TableColumnSelector = void 0;
 // import { Button } from '@patternfly/react-core';
 require("./columnSelector.css");
-var utils_1 = require("@rh-support/utils");
-var react_1 = __importDefault(require("react"));
-var react_i18next_1 = require("react-i18next");
-var DropDownList_1 = require("../DropDownList");
-var TableProvider_1 = require("./TableProvider");
-function TableColumnSelector(_a) {
-    var onColumnSelectorChange = _a.onColumnSelectorChange;
-    var _b = TableProvider_1.useTableContext(), selectedItems = _b.selectedColumns, columns = _b.columns;
-    var t = react_i18next_1.useTranslation().t;
-    var handleChange = function (selectedCols) {
-        selectedCols = selectedCols.map(function (i) { return i.value.value; });
+const utils_1 = require("@rh-support/utils");
+const react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
+const DropDownList_1 = require("../DropDownList");
+const TableProvider_1 = require("./TableProvider");
+function TableColumnSelector({ onColumnSelectorChange }) {
+    const { selectedColumns: selectedItems, columns } = TableProvider_1.useTableContext();
+    const { t } = react_i18next_1.useTranslation();
+    const handleChange = (selectedCols) => {
+        selectedCols = selectedCols.map((i) => i.value.value);
         onColumnSelectorChange(selectedCols);
     };
-    return (react_1.default.createElement(DropDownList_1.MultiSelectDropDownList, { id: "case-list-table-column-dropdown", "data-tracking-id": "case-list-table-column-dropdown", selectedItems: utils_1.toOptions((selectedItems || []).map(function (item) {
+    return (react_1.default.createElement(DropDownList_1.MultiSelectDropDownList, { id: "case-list-table-column-dropdown", "data-tracking-id": "case-list-table-column-dropdown", selectedItems: utils_1.toOptions((selectedItems || []).map((item) => {
             var _a;
             return ({
                 value: item,
-                label: (((_a = columns.find(function (col) { return item === col.id; })) === null || _a === void 0 ? void 0 : _a.title) || ''),
+                label: (((_a = columns.find((col) => item === col.id)) === null || _a === void 0 ? void 0 : _a.title) || ''),
                 isDisabled: false,
             });
-        }), { labelKey: 'label', disabledKey: 'isDisabled' }), list: utils_1.toOptions(columns.map(function (column) { return ({
+        }), { labelKey: 'label', disabledKey: 'isDisabled' }), list: utils_1.toOptions(columns.map((column) => ({
             value: column.id,
             label: column.title,
             isDisabled: column.show === undefined,
-        }); }), { labelKey: 'label', disabledKey: 'isDisabled' }), title: 'column selector menu', placeholder: t('Columns'), onChange: handleChange, className: "column-selector", hasTwoColumns: true }));
+        })), { labelKey: 'label', disabledKey: 'isDisabled' }), title: 'column selector menu', placeholder: t('Columns'), onChange: handleChange, className: "column-selector", hasTwoColumns: true }));
 }
 exports.TableColumnSelector = TableColumnSelector;

package/lib/cjs/Table/TablePagination.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PaginationVariant } from '@patternfly/react-core';
 interface IProps {
     itemCount?: number;

package/lib/cjs/Table/TablePagination.d.ts.map

@@ -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,eA6B5C"}
+{"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"}

package/lib/cjs/Table/TablePagination.js

@@ -20,21 +20,21 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TablePagination = void 0;
-var react_core_1 = require("@patternfly/react-core");
-var react_1 = __importStar(require("react"));
-var TableProvider_1 = require("./TableProvider");
+const react_core_1 = require("@patternfly/react-core");
+const react_1 = __importStar(require("react"));
+const TableProvider_1 = require("./TableProvider");
 function TablePagination(props) {
-    var _a = TableProvider_1.useTableContext(), data = _a.data, setSelectedPage = _a.setSelectedPage, setPerPage = _a.setPerPage, perPage = _a.perPage, currentPage = _a.currentPage;
-    var onSetPage = function (event, pageNumber) {
+    const { data, setSelectedPage, setPerPage, perPage, currentPage } = TableProvider_1.useTableContext();
+    const onSetPage = (event, pageNumber) => {
         setSelectedPage(pageNumber);
         props.onSetPage && props.onSetPage({ pageSize: perPage, currentPage: pageNumber });
     };
-    var onPerPageSelect = function (event, pageSize) {
+    const onPerPageSelect = (event, pageSize) => {
         setSelectedPage(1);
         setPerPage(pageSize);
-        props.onPerPageSelect && props.onPerPageSelect({ pageSize: pageSize, currentPage: 1 });
+        props.onPerPageSelect && props.onPerPageSelect({ pageSize, currentPage: 1 });
     };
-    react_1.useEffect(function () {
+    react_1.useEffect(() => {
         props.perPage && props.perPage !== perPage && setPerPage(props.perPage);
         props.currentPage && props.currentPage !== currentPage && setSelectedPage(props.currentPage);
         // eslint-disable-next-line react-hooks/exhaustive-deps