@laerdal/life-react-components 1.3.2-dev.7 → 1.3.2-dev.8

package/dist/Table/Table.js

@@ -0,0 +1,527 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+/**
+ * Import React libraries.
+ */
+import * as React from 'react';
+/**
+ * Import custom components.
+ */
+
+import { MoreVertical, ChevronRight, ChevronLeft, ArrowLineDown, ArrowLineUp } from '../icons/systemicons/SystemIcons';
+import { SystemIcons as icons } from '../icons/index';
+import { DropdownFilter } from '../Dropdown/index';
+import { IconButton, Button } from '../Button/index';
+import { Size } from '../types';
+/**
+ * Import custom styles.
+ */
+
+import { COLORS } from '../styles';
+import { TableHeaderRowCol, TableColumnHeaderCol, TableContainer, TableDataCol, TableDataRow, TableFooterCol, TableWrapper, TableLoadingIndicator } from './TableStyles';
+/**
+ * Import custom types.
+ */
+
+import { LoadingIndicator } from '../LoadingIndicator';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+var Table = function Table(_ref) {
+  var rowClick = _ref.rowClick,
+      linkClick = _ref.linkClick,
+      iconClick = _ref.iconClick,
+      previousPageClick = _ref.previousPageClick,
+      nextPageClick = _ref.nextPageClick,
+      rowsPerPageChange = _ref.rowsPerPageChange,
+      triggerSortingChange = _ref.triggerSortingChange,
+      title = _ref.title,
+      columns = _ref.columns,
+      rows = _ref.rows,
+      remotePagination = _ref.remotePagination,
+      pagination = _ref.pagination,
+      showLoadingIndicator = _ref.showLoadingIndicator;
+
+  // States used within the component
+  var _React$useState = React.useState(10),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      rowsPerPage = _React$useState2[0],
+      setRowsPerPage = _React$useState2[1];
+
+  var _React$useState3 = React.useState([]),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      filteredRows = _React$useState4[0],
+      setFilteredRows = _React$useState4[1];
+
+  var _React$useState5 = React.useState([]),
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      currentPageRows = _React$useState6[0],
+      setCurrentPageRows = _React$useState6[1];
+
+  var _React$useState7 = React.useState(1),
+      _React$useState8 = _slicedToArray(_React$useState7, 2),
+      currentPage = _React$useState8[0],
+      setCurrentPage = _React$useState8[1];
+
+  var _React$useState9 = React.useState(''),
+      _React$useState10 = _slicedToArray(_React$useState9, 2),
+      sortedColumn = _React$useState10[0],
+      setSortedColumn = _React$useState10[1];
+
+  var _React$useState11 = React.useState('asc'),
+      _React$useState12 = _slicedToArray(_React$useState11, 2),
+      sortedDirection = _React$useState12[0],
+      setSortedDirection = _React$useState12[1];
+
+  var _React$useState13 = React.useState(),
+      _React$useState14 = _slicedToArray(_React$useState13, 2),
+      from = _React$useState14[0],
+      setFrom = _React$useState14[1];
+
+  var _React$useState15 = React.useState(),
+      _React$useState16 = _slicedToArray(_React$useState15, 2),
+      to = _React$useState16[0],
+      setTo = _React$useState16[1];
+
+  var _React$useState17 = React.useState(),
+      _React$useState18 = _slicedToArray(_React$useState17, 2),
+      total = _React$useState18[0],
+      setTotal = _React$useState18[1];
+  /**
+   * Takes care of local pagination.
+   * Works only in case remote pagination is not defined or is set to false.
+   */
+
+
+  React.useEffect(function () {
+    if (!remotePagination) {
+      // Let's retrieve temporary filtered rows and update globally filtered rows
+      var tmpFilteredRows = filterAndSortRows();
+      setFilteredRows(tmpFilteredRows);
+      setTotal(tmpFilteredRows.length); // Assign rows from and rows to
+
+      var rowsFrom = (currentPage - 1) * rowsPerPage;
+      var rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage; // Set from and to values
+
+      setFrom(rowsFrom + 1);
+      setTo(rowsTo); // Filter out the rows
+
+      setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));
+    }
+  }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remotePagination]);
+  /**
+   * Takes care of remote pagination.
+   * Works only in case remote pagination is set to true.
+   */
+
+  React.useEffect(function () {
+    if (remotePagination) {
+      setCurrentPageRows(rows); // Let's assign pagination values
+
+      setFrom(pagination === null || pagination === void 0 ? void 0 : pagination.from);
+      setTo(pagination === null || pagination === void 0 ? void 0 : pagination.to);
+      setTotal(pagination === null || pagination === void 0 ? void 0 : pagination.total);
+      setCurrentPage(pagination === null || pagination === void 0 ? void 0 : pagination.currentPage);
+      setRowsPerPage(pagination === null || pagination === void 0 ? void 0 : pagination.rowsPerPage);
+    }
+  }, [remotePagination, pagination, rows]);
+  /**
+   * Filters out a rows by specific column filters and sorts them if any sorting is set.
+   * @returns Filtered and sorted rows.
+   */
+
+  var filterAndSortRows = function filterAndSortRows() {
+    var tmpFilteredRows = rows.filter(function (row) {
+      // Let's start with matched filter criteria
+      var matchFilterCriteria = true; // Let's go through columns
+
+      var _iterator = _createForOfIteratorHelper(columns),
+          _step;
+
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var column = _step.value;
+
+          // Let's check if filter value is specified for the column
+          // And if it doesn't match the current row column value
+          // Then let's update match filter criteria to failed
+          if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {
+            matchFilterCriteria = false;
+          }
+        } // Let's return row only in case match filter criteria succeeds
+
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+
+      if (matchFilterCriteria) {
+        return row;
+      }
+    }); // Let's apply sorting if needed
+
+    if (columns.some(function (column) {
+      return column.sortingDirection;
+    })) {
+      // Let's find the sorting column
+      var sortingColumn = columns.find(function (column) {
+        return column.sortingDirection;
+      }); // Update sorted column data
+
+      setSortedDirection(sortingColumn.sortingDirection);
+      setSortedColumn(sortingColumn.key); // Let's sort the rows
+
+      tmpFilteredRows.sort(function (a, b) {
+        if (a[sortingColumn.key] > b[sortingColumn.key]) {
+          return sortingColumn.sortingDirection === 'asc' ? 1 : -1;
+        } else if (a[sortingColumn.key] < b[sortingColumn.key]) {
+          return sortingColumn.sortingDirection === 'asc' ? -1 : 1;
+        } else {
+          return 0;
+        }
+      });
+    } // Let's return filtered rows
+
+
+    return tmpFilteredRows;
+  };
+  /**
+   * Applies a specific sorting to a column.
+   * If no sorting exists, then applies ascending initially
+   * @param column - Column to which sorting should be applied.
+   */
+
+
+  var sortTableColumn = function sortTableColumn(column) {
+    // Let's remove any active sorting
+    columns = columns.map(function (tmpColumn) {
+      // Let's apply new sorting
+      // Let's check if it is the column for which we have to apply sorting
+      if (column.key === tmpColumn.key && tmpColumn.sortable) {
+        // Let's check if sorting is not defined
+        // If so, let's toggle the sorting direction
+        if (tmpColumn.sortingDirection !== undefined) {
+          if (tmpColumn.sortingDirection === 'asc') {
+            tmpColumn.sortingDirection = 'desc'; // Update sorted column and direction
+
+            setSortedColumn(column.key);
+            setSortedDirection('desc'); // Let's trigger remote sorting trigger function
+
+            if (remotePagination && triggerSortingChange) {
+              triggerSortingChange(column.key, 'desc');
+            }
+          } else {
+            tmpColumn.sortingDirection = 'asc'; // Update sorted column and direction
+
+            setSortedColumn(column.key);
+            setSortedDirection('asc'); // Let's trigger remote sorting trigger function
+
+            if (remotePagination && triggerSortingChange) {
+              triggerSortingChange(column.key, 'asc');
+            }
+          }
+        } else {
+          // Let's apply the initial sorting
+          tmpColumn.sortingDirection = 'asc'; // Update sorted column and direction
+
+          setSortedColumn(column.key);
+          setSortedDirection('asc'); // Let's trigger remote sorting trigger function
+
+          if (remotePagination && triggerSortingChange) {
+            triggerSortingChange(column.key, 'asc');
+          }
+        }
+      } else if (tmpColumn.sortingDirection !== undefined) {
+        // Let's remove sorting
+        tmpColumn.sortingDirection = undefined;
+      }
+
+      return tmpColumn;
+    });
+  };
+  /**
+   * Navigates user back to the previous page and updates the current table page.
+   */
+
+
+  var previousPage = function previousPage() {
+    if (remotePagination) {
+      // Let's inform parent component about page change
+      if (previousPageClick) {
+        previousPageClick();
+      }
+    } else {
+      // Let's change the page within the component
+      setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);
+    }
+  };
+  /**
+   * Navigates user to the next page and updates the current table page.
+   */
+
+
+  var nextPage = function nextPage() {
+    if (remotePagination) {
+      // Let's inform parent component about page change
+      if (nextPageClick) {
+        nextPageClick();
+      }
+    } else {
+      // Let's change the page within the component
+      setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);
+    }
+  };
+  /**
+   * Updates the rows per page value and refreshes the table content accordingly.
+   * @param value - Newly selected rows per page value.
+   */
+
+
+  var changeRowsPerPage = function changeRowsPerPage(value) {
+    // Let's check if we are using remote pagination
+    if (remotePagination) {
+      // Inform parent component about rows per page change
+      if (rowsPerPageChange) {
+        rowsPerPageChange(parseInt(value));
+      }
+    } else {
+      // Let's reset current page to 1
+      setCurrentPage(1);
+    } // Let's set rows per page
+
+
+    setRowsPerPage(parseInt(value));
+  };
+  /**
+   * Renders the table header.
+   */
+
+
+  var renderHeader = function renderHeader() {
+    return /*#__PURE__*/_jsxs("thead", {
+      children: [title && /*#__PURE__*/_jsx("tr", {
+        "data-testid": "TestTableHeaderRow",
+        children: /*#__PURE__*/_jsx(TableHeaderRowCol, {
+          colSpan: columns.length,
+          children: /*#__PURE__*/_jsxs("div", {
+            children: [title, /*#__PURE__*/_jsx(MoreVertical, {
+              size: "18px",
+              color: COLORS.neutral_600
+            })]
+          })
+        })
+      }), /*#__PURE__*/_jsx("tr", {
+        "data-testid": "TestTableColumnHeaderRow",
+        children: columns.map(function (column) {
+          return /*#__PURE__*/_jsxs(TableColumnHeaderCol, {
+            onClick: function onClick() {
+              return sortTableColumn(column);
+            },
+            style: {
+              width: column.width
+            },
+            className: "".concat(column.sortable ? 'sortable' : '', " ").concat(!title ? 'no-border' : '', " ").concat(column.justify ? "justify-".concat(column.justify) : ''),
+            children: [column.name, column.sortingDirection === 'asc' ? /*#__PURE__*/_jsx(ArrowLineUp, {
+              size: "20px"
+            }) : column.sortingDirection === 'desc' ? /*#__PURE__*/_jsx(ArrowLineDown, {
+              size: "20px"
+            }) : '']
+          }, column.key);
+        })
+      })]
+    });
+  };
+  /**
+   * Function which is called when a mouse click happens on a link to pass data to the parent component.
+   * @param row - Row in which the link is located.
+   * @param key - Key of the column for which the link is set.
+   * @param event - Click event handler.
+   */
+
+
+  var onLinkClick = function onLinkClick(row, key, event) {
+    if (linkClick) {
+      event.stopPropagation();
+      linkClick(row, key);
+    }
+  };
+  /**
+   * Function which is called when a mouse click happens on an icon to pass data to the parent component.
+   * @param row - Row in which the icon is located.
+   * @param key - Key of the column for which the icon is set.
+   * @param event - Click event handler.
+   */
+
+
+  var onIconClick = function onIconClick(row, key, event) {
+    if (iconClick) {
+      event.stopPropagation();
+      iconClick(row, key);
+    }
+  };
+  /**
+   * Function which is called when a mouse click happens on a row to pass data to the parent component.
+   * @param row - Row in which the link is located.
+   */
+
+
+  var onRowClick = function onRowClick(row) {
+    var _window, _window$getSelection;
+
+    var selectedText = (_window = window) === null || _window === void 0 ? void 0 : (_window$getSelection = _window.getSelection()) === null || _window$getSelection === void 0 ? void 0 : _window$getSelection.toString(); // Let's trigger row click only if we haven't selected any text and action exists
+
+    if ((selectedText === null || selectedText === void 0 ? void 0 : selectedText.length) === 0 && rowClick) {
+      rowClick(row);
+    }
+  };
+  /**
+   * Renders the table body.
+   */
+
+
+  var renderBody = function renderBody() {
+    return /*#__PURE__*/_jsx("tbody", {
+      children: currentPageRows.length > 0 ? currentPageRows.map(function (row, index) {
+        return /*#__PURE__*/_jsx(TableDataRow, {
+          onClick: function onClick() {
+            return onRowClick(row);
+          },
+          "data-testid": "TestTableDataRow",
+          children: columns.map(function (column) {
+            return /*#__PURE__*/_jsx(TableDataCol, {
+              style: column.colorFn ? {
+                color: column.colorFn(row, column.key),
+                maxWidth: column.width
+              } : {
+                maxWidth: column.width
+              },
+              className: "".concat(column.shortenText && "truncate-text", " ").concat(column.justify ? "justify-".concat(column.justify) : '', " "),
+              title: column.shortenText && row[column.key],
+              children: column.isLink && row[column.key] ? /*#__PURE__*/_jsx(Button, {
+                size: Size.Small,
+                variant: "tertiary",
+                onClick: function onClick(event) {
+                  return onLinkClick(row, column.key, event);
+                },
+                style: column.colorFn && {
+                  color: column.colorFn(row, column.key)
+                },
+                children: row[column.key]
+              }) : column.isIcon && column.icon ? /*#__PURE__*/_jsx(IconButton, {
+                variant: "secondary",
+                shape: "circular",
+                useTransparentBackground: true,
+                action: function action(event) {
+                  return onIconClick(row, column.key, event);
+                },
+                children: icons[column.icon]({
+                  size: '24',
+                  className: 'icon'
+                })
+              }) : column.customContent ? column.customContent(row, column.key) : row[column.key]
+            }, "row_".concat(index, "_").concat(column.key));
+          })
+        }, "row_".concat(index));
+      }) : /*#__PURE__*/_jsx(TableDataRow, {
+        className: "no-rows",
+        "data-testid": "TestTableNoDataRow",
+        children: /*#__PURE__*/_jsx(TableDataCol, {
+          colSpan: columns.length,
+          className: "center",
+          children: "There are no rows to display"
+        })
+      })
+    });
+  };
+  /**
+   * Renders the table footer.
+   */
+
+
+  var renderFooter = function renderFooter() {
+    // Define local values used within the footer
+    var rowsPerPageValues = ['10', '20', '50', '100'];
+    return /*#__PURE__*/_jsx("tfoot", {
+      children: /*#__PURE__*/_jsx("tr", {
+        children: /*#__PURE__*/_jsx(TableFooterCol, {
+          colSpan: columns.length,
+          "data-testid": "TestTableFooterRow",
+          children: /*#__PURE__*/_jsxs("div", {
+            children: [/*#__PURE__*/_jsx("span", {
+              children: "Rows per page: "
+            }), /*#__PURE__*/_jsx(DropdownFilter, {
+              id: "rows-per-page",
+              list: rowsPerPageValues.map(function (x) {
+                return {
+                  label: x
+                };
+              }),
+              disableSorting: true,
+              onSelect: function onSelect(value) {
+                return changeRowsPerPage(value);
+              },
+              initalValue: rowsPerPage.toString(),
+              isButton: true
+            }), /*#__PURE__*/_jsxs("span", {
+              className: "current-page-info",
+              children: [total === 0 ? 0 : from, "-", to, " of ", total]
+            }), /*#__PURE__*/_jsxs("div", {
+              className: "controls",
+              children: [/*#__PURE__*/_jsx(IconButton, {
+                variant: "secondary",
+                shape: "circular",
+                action: function action() {
+                  return previousPage();
+                },
+                disabled: from === 1,
+                children: /*#__PURE__*/_jsx(ChevronLeft, {
+                  size: "24",
+                  color: COLORS.neutral_600
+                })
+              }), /*#__PURE__*/_jsx(IconButton, {
+                variant: "secondary",
+                shape: "circular",
+                action: function action() {
+                  return nextPage();
+                },
+                disabled: to === total,
+                children: /*#__PURE__*/_jsx(ChevronRight, {
+                  size: "24",
+                  color: COLORS.neutral_600
+                })
+              })]
+            })]
+          })
+        })
+      })
+    });
+  };
+  /**
+   * Return Table component.
+   */
+
+
+  return /*#__PURE__*/_jsxs(TableWrapper, {
+    children: [/*#__PURE__*/_jsxs(TableContainer, {
+      cellPadding: "0",
+      cellSpacing: "0",
+      "data-testid": "TestTable",
+      children: [renderHeader(), renderBody(), renderFooter()]
+    }), showLoadingIndicator && /*#__PURE__*/_jsx(TableLoadingIndicator, {
+      children: /*#__PURE__*/_jsx(LoadingIndicator, {
+        size: Size.Medium,
+        color: "#ffffff"
+      })
+    })]
+  });
+};
+
+export default Table;
+//# sourceMappingURL=Table.js.map

package/dist/Table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Table/Table.tsx"],"names":["React","MoreVertical","ChevronRight","ChevronLeft","ArrowLineDown","ArrowLineUp","SystemIcons","icons","DropdownFilter","IconButton","Button","Size","COLORS","TableHeaderRowCol","TableColumnHeaderCol","TableContainer","TableDataCol","TableDataRow","TableFooterCol","TableWrapper","TableLoadingIndicator","LoadingIndicator","Table","rowClick","linkClick","iconClick","previousPageClick","nextPageClick","rowsPerPageChange","triggerSortingChange","title","columns","rows","remotePagination","pagination","showLoadingIndicator","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","useEffect","tmpFilteredRows","filterAndSortRows","length","rowsFrom","rowsTo","slice","filter","row","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","some","sortingDirection","sortingColumn","find","sort","a","b","sortTableColumn","map","tmpColumn","sortable","undefined","previousPage","nextPage","changeRowsPerPage","value","parseInt","renderHeader","neutral_600","width","justify","name","onLinkClick","event","stopPropagation","onIconClick","onRowClick","selectedText","window","getSelection","toString","renderBody","index","colorFn","color","maxWidth","shortenText","isLink","Small","isIcon","icon","size","className","customContent","renderFooter","rowsPerPageValues","x","label","Medium"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport { MoreVertical, ChevronRight, ChevronLeft, ArrowLineDown, ArrowLineUp } from '../icons/systemicons/SystemIcons';\nimport { SystemIcons as icons } from '../icons/index';\nimport { DropdownFilter } from '../Dropdown/index';\nimport { IconButton, Button } from '../Button/index';\nimport { Size } from '../types'\n\n/**\n * Import custom styles.\n */\nimport { COLORS } from '../styles';\nimport { TableHeaderRowCol, TableColumnHeaderCol, TableContainer, TableDataCol, TableDataRow, TableFooterCol, TableWrapper, TableLoadingIndicator } from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport { TableProps, TableColumn, TableSortingDirection } from './TableTypes';\nimport { LoadingIndicator } from '../LoadingIndicator';\n\nconst Table: React.FunctionComponent<TableProps> = ({\n  rowClick,\n  linkClick,\n  iconClick,\n  previousPageClick,\n  nextPageClick,\n  rowsPerPageChange,\n  triggerSortingChange,\n  title,\n  columns,\n  rows,\n  remotePagination,\n  pagination,\n  showLoadingIndicator,\n}: TableProps) => {\n  // States used within the component\n  const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n  const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n  const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n  const [currentPage, setCurrentPage] = React.useState<number>(1);\n  const [sortedColumn, setSortedColumn] = React.useState<string>('');\n  const [sortedDirection, setSortedDirection] = React.useState<TableSortingDirection>('asc');\n  const [from, setFrom] = React.useState<number>();\n  const [to, setTo] = React.useState<number>();\n  const [total, setTotal] = React.useState<number>();\n\n  /**\n   * Takes care of local pagination.\n   * Works only in case remote pagination is not defined or is set to false.\n   */\n  React.useEffect(() => {\n    if (!remotePagination) {\n      // Let's retrieve temporary filtered rows and update globally filtered rows\n      const tmpFilteredRows = filterAndSortRows();\n      setFilteredRows(tmpFilteredRows);\n      setTotal(tmpFilteredRows.length);\n\n      // Assign rows from and rows to\n      const rowsFrom = (currentPage - 1) * rowsPerPage;\n      const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n      // Set from and to values\n      setFrom(rowsFrom + 1);\n      setTo(rowsTo);\n\n      // Filter out the rows\n      setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n    }\n  }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remotePagination]);\n\n  /**\n   * Takes care of remote pagination.\n   * Works only in case remote pagination is set to true.\n   */\n  React.useEffect(() => {\n    if (remotePagination) {\n      setCurrentPageRows(rows);\n\n      // Let's assign pagination values\n      setFrom(pagination?.from);\n      setTo(pagination?.to);\n      setTotal(pagination?.total);\n      setCurrentPage(pagination?.currentPage!);\n      setRowsPerPage(pagination?.rowsPerPage!);\n    }\n  }, [remotePagination, pagination, rows]);\n\n  /**\n   * Filters out a rows by specific column filters and sorts them if any sorting is set.\n   * @returns Filtered and sorted rows.\n   */\n  const filterAndSortRows = (): any[] => {\n    let tmpFilteredRows = rows.filter((row) => {\n      // Let's start with matched filter criteria\n      let matchFilterCriteria = true;\n\n      // Let's go through columns\n      for (const column of columns) {\n        // Let's check if filter value is specified for the column\n        // And if it doesn't match the current row column value\n        // Then let's update match filter criteria to failed\n        if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n          matchFilterCriteria = false;\n        }\n      }\n\n      // Let's return row only in case match filter criteria succeeds\n      if (matchFilterCriteria) {\n        return row;\n      }\n    });\n\n    // Let's apply sorting if needed\n    if (columns.some((column) => column.sortingDirection)) {\n      // Let's find the sorting column\n      const sortingColumn = columns.find((column) => column.sortingDirection)!;\n\n      // Update sorted column data\n      setSortedDirection(sortingColumn.sortingDirection!);\n      setSortedColumn(sortingColumn.key!);\n\n      // Let's sort the rows\n      tmpFilteredRows.sort((a, b) => {\n        if (a[sortingColumn.key] > b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? 1 : -1;\n        } else if (a[sortingColumn.key] < b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? -1 : 1;\n        } else {\n          return 0;\n        }\n      });\n    }\n\n    // Let's return filtered rows\n    return tmpFilteredRows;\n  };\n\n  /**\n   * Applies a specific sorting to a column.\n   * If no sorting exists, then applies ascending initially\n   * @param column - Column to which sorting should be applied.\n   */\n  const sortTableColumn = (column: TableColumn): void => {\n    // Let's remove any active sorting\n    columns = columns.map((tmpColumn: TableColumn) => {\n      // Let's apply new sorting\n      // Let's check if it is the column for which we have to apply sorting\n      if (column.key === tmpColumn.key && tmpColumn.sortable) {\n        // Let's check if sorting is not defined\n        // If so, let's toggle the sorting direction\n        if (tmpColumn.sortingDirection !== undefined) {\n          if (tmpColumn.sortingDirection === 'asc') {\n            tmpColumn.sortingDirection = 'desc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('desc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'desc');\n            }\n          } else {\n            tmpColumn.sortingDirection = 'asc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('asc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'asc');\n            }\n          }\n        } else {\n          // Let's apply the initial sorting\n          tmpColumn.sortingDirection = 'asc';\n\n          // Update sorted column and direction\n          setSortedColumn(column.key);\n          setSortedDirection('asc');\n\n          // Let's trigger remote sorting trigger function\n          if (remotePagination && triggerSortingChange) {\n            triggerSortingChange(column.key, 'asc');\n          }\n        }\n      } else if (tmpColumn.sortingDirection !== undefined) {\n        // Let's remove sorting\n        tmpColumn.sortingDirection = undefined;\n      }\n\n      return tmpColumn;\n    });\n  };\n\n  /**\n   * Navigates user back to the previous page and updates the current table page.\n   */\n  const previousPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (previousPageClick) {\n        previousPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n    }\n  };\n\n  /**\n   * Navigates user to the next page and updates the current table page.\n   */\n  const nextPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (nextPageClick) {\n        nextPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n    }\n  };\n\n  /**\n   * Updates the rows per page value and refreshes the table content accordingly.\n   * @param value - Newly selected rows per page value.\n   */\n  const changeRowsPerPage = (value: string) => {\n    // Let's check if we are using remote pagination\n    if (remotePagination) {\n      // Inform parent component about rows per page change\n      if (rowsPerPageChange) {\n        rowsPerPageChange(parseInt(value));\n      }\n    } else {\n      // Let's reset current page to 1\n      setCurrentPage(1);\n    }\n\n    // Let's set rows per page\n    setRowsPerPage(parseInt(value));\n  };\n\n  /**\n   * Renders the table header.\n   */\n  const renderHeader = () => {\n    return (\n      <thead>\n        {title && (\n          <tr data-testid=\"TestTableHeaderRow\">\n            <TableHeaderRowCol colSpan={columns.length}>\n              <div>\n                {title}\n                <MoreVertical size=\"18px\" color={COLORS.neutral_600} />\n              </div>\n            </TableHeaderRowCol>\n          </tr>\n        )}\n        <tr data-testid=\"TestTableColumnHeaderRow\">\n          {columns.map((column: TableColumn) => (\n            <TableColumnHeaderCol\n              onClick={() => sortTableColumn(column)}\n              key={column.key}\n              style={{ width: column.width }}\n              className={`${column.sortable ? 'sortable' : ''} ${!title ? 'no-border' : ''} ${column.justify ? `justify-${column.justify}` : ''}`}>\n              {column.name}\n\n              {column.sortingDirection === 'asc' ? <ArrowLineUp size=\"20px\" /> : column.sortingDirection === 'desc' ? <ArrowLineDown size=\"20px\" /> : ''}\n            </TableColumnHeaderCol>\n          ))}\n        </tr>\n      </thead>\n    );\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a link to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   * @param key - Key of the column for which the link is set.\n   * @param event - Click event handler.\n   */\n  const onLinkClick = (row: any, key: string, event: React.MouseEvent) => {\n    if (linkClick) {\n      event.stopPropagation();\n\n      linkClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on an icon to pass data to the parent component.\n   * @param row - Row in which the icon is located.\n   * @param key - Key of the column for which the icon is set.\n   * @param event - Click event handler.\n   */\n  const onIconClick = (row: any, key: string, event: React.MouseEvent<HTMLButtonElement>) => {\n    if (iconClick) {\n      event.stopPropagation();\n\n      iconClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a row to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   */\n  const onRowClick = (row: any): void => {\n    const selectedText = window?.getSelection()?.toString();\n\n    // Let's trigger row click only if we haven't selected any text and action exists\n    if (selectedText?.length === 0 && rowClick) {\n      rowClick(row);\n    }\n  };\n\n  /**\n   * Renders the table body.\n   */\n  const renderBody = () => {\n    return (\n      <tbody>\n        {currentPageRows.length > 0 ? (\n          currentPageRows.map((row: any, index: number) => (\n            <TableDataRow key={`row_${index}`} onClick={() => onRowClick(row)} data-testid=\"TestTableDataRow\">\n              {columns.map((column: TableColumn) => (\n                <TableDataCol\n                  key={`row_${index}_${column.key}`}\n                  style={column.colorFn ? { color: column.colorFn(row, column.key), maxWidth: column.width } : { maxWidth: column.width }}\n                  className={`${column.shortenText && `truncate-text`} ${column.justify ? `justify-${column.justify}` : ''} `}\n                  title={column.shortenText && row[column.key]}>\n                  {column.isLink && row[column.key] ? (\n                    <Button\n                      size={Size.Small}\n                      variant=\"tertiary\"\n                      onClick={(event) => onLinkClick(row, column.key, event)}\n                      style={column.colorFn && { color: column.colorFn(row, column.key) }}>\n                      {row[column.key]}\n                    </Button>\n                  ) : column.isIcon && column.icon ? (\n                    <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground={true} action={(event) => onIconClick(row, column.key, event!)}>\n                      {icons[column.icon!]({ size: '24', className: 'icon' })}\n                    </IconButton>\n                  ) : column.customContent ? (\n                    column.customContent(row, column.key)\n                  ) : (\n                    row[column.key]\n                  )}\n                </TableDataCol>\n              ))}\n            </TableDataRow>\n          ))\n        ) : (\n          <TableDataRow className=\"no-rows\" data-testid=\"TestTableNoDataRow\">\n            <TableDataCol colSpan={columns.length} className=\"center\">\n              There are no rows to display\n            </TableDataCol>\n          </TableDataRow>\n        )}\n      </tbody>\n    );\n  };\n\n  /**\n   * Renders the table footer.\n   */\n  const renderFooter = () => {\n    // Define local values used within the footer\n    const rowsPerPageValues = ['10', '20', '50', '100'];\n\n    return (\n      <tfoot>\n        <tr>\n          <TableFooterCol colSpan={columns.length} data-testid=\"TestTableFooterRow\">\n            <div>\n              <span>Rows per page: </span>\n              <DropdownFilter\n                id=\"rows-per-page\"\n                list={rowsPerPageValues.map(x => ({ label: x }))}\n                disableSorting={true}\n                onSelect={(value) => changeRowsPerPage(value)}\n                initalValue={rowsPerPage.toString()}\n                isButton={true}\n              />\n              <span className=\"current-page-info\">\n                {total === 0 ? 0 : from}-{to} of {total}\n              </span>\n              <div className=\"controls\">\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => previousPage()} disabled={from === 1}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => nextPage()} disabled={to === total}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n              </div>\n            </div>\n          </TableFooterCol>\n        </tr>\n      </tfoot>\n    );\n  };\n\n  /**\n   * Return Table component.\n   */\n  return (\n    <TableWrapper>\n      <TableContainer cellPadding=\"0\" cellSpacing=\"0\" data-testid=\"TestTable\">\n        {renderHeader()}\n        {renderBody()}\n        {renderFooter()}\n      </TableContainer>\n      {showLoadingIndicator && (\n        <TableLoadingIndicator>\n          <LoadingIndicator size={Size.Medium} color=\"#ffffff\"></LoadingIndicator>\n        </TableLoadingIndicator>\n      )}\n    </TableWrapper>\n  );\n};\n\nexport default Table;\n"],"file":"Table.js"}

package/dist/Table/TableStyles.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Table styles
+ */
+export declare const TableWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TableLoadingIndicator: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TableContainer: import("styled-components").StyledComponent<"table", any, {}, never>;
+export declare const TableHeaderRowCol: import("styled-components").StyledComponent<"th", any, {}, never>;
+export declare const TableColumnHeaderCol: import("styled-components").StyledComponent<"th", any, {}, never>;
+export declare const TableDataRow: import("styled-components").StyledComponent<"tr", any, {}, never>;
+export declare const TableDataCol: import("styled-components").StyledComponent<"td", any, {}, never>;
+export declare const TableFooterCol: import("styled-components").StyledComponent<"td", any, {}, never>;

package/dist/Table/TableStyles.js

@@ -0,0 +1,27 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+
+/**
+ * Import third-party libraries.
+ */
+import styled from 'styled-components';
+/**
+ * Import custom style properties.
+ */
+
+import { COLORS } from '../styles';
+import { ComponentLStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling } from '../styles/typography';
+/**
+ * Table styles
+ */
+
+export var TableWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n"])));
+export var TableLoadingIndicator = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  background-color: rgba(0, 0, 0, 0.5);\n  top: 0;\n"])));
+export var TableContainer = styled.table(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  background: transparent;\n  width: 100%;\n  border-top: 2px solid ", ";\n  border-bottom: 2px solid ", ";\n"])), COLORS.neutral_200, COLORS.neutral_200);
+export var TableHeaderRowCol = styled.th(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-bottom: 1px solid ", ";\n\n  ", "\n  padding: 16px 19px 16px 16px;\n\n  div {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    svg {\n      cursor: pointer;\n    }\n  }\n"])), COLORS.neutral_20, COLORS.neutral_200, ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
+export var TableColumnHeaderCol = styled.th(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-top: 1px solid ", ";\n\n  ", "\n  padding: 18px 16px;\n  text-align: left;\n\n  &.justify-center {\n    text-align: center;\n  }\n\n  &.justify-left {\n    text-align: left;\n  }\n\n  &.justify-right {\n    text-align: right;\n  }\n\n  &.no-border {\n    border: none;\n  }\n\n  &.sortable {\n    cursor: pointer;\n\n    > svg {\n      float: right;\n    }\n\n    &:hover {\n      background: ", ";\n    }\n\n    &:focus {\n      background: ", ";\n    }\n  }\n"])), COLORS.white, COLORS.neutral_300, ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), COLORS.primary_20, COLORS.primary_100);
+export var TableDataRow = styled.tr(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  background-color: ", ";\n\n  &:nth-child(2n) {\n    background-color: ", ";\n  }\n\n  &:hover {\n    cursor: pointer;\n    background-color: ", ";\n  }\n\n  &.no-rows:hover {\n    cursor: default;\n    background-color: ", ";\n  }\n"])), COLORS.neutral_100, COLORS.neutral_20, COLORS.primary_200, COLORS.neutral_100);
+export var TableDataCol = styled.td(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  background: transparent;\n\n  ", "\n  padding: 15px 16px;\n  border: none;\n\n  &.truncate-text {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &.justify-center {\n    text-align: center;\n  }\n\n  &.justify-left {\n    text-align: left;\n  }\n\n  &.justify-right {\n    text-align: right;\n  }\n\n  button {\n    color: ", ";\n    text-decoration: none;\n\n    &:hover {\n      color: ", ";\n      text-decoration: underline;\n    }\n\n    &:focus {\n      text-decoration: underline;\n      outline: none;\n      box-shadow: 0px 4px 12px ", ", 0px 0px 8px ", " !important;\n      color: ", ";\n    }\n  }\n\n  &.center {\n    text-align: center;\n  }\n"])), ComponentSStyling(ComponentTextStyle.Regular, COLORS.black), COLORS.primary_600, COLORS.primary_700, COLORS.focus_25, COLORS.focus, COLORS.primary_700);
+export var TableFooterCol = styled.td(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  border-top: 1px solid ", ";\n  padding: 3.5px 20px 3.5px 16px;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n\n    > div > div:first-of-type {\n      ", "\n      display: block;\n      padding-top: 11px;\n      padding-left: 2px;\n      padding-right: 30px;\n    }\n\n    span {\n      ", "\n\n      &.current-page-info {\n        margin-right: 34px;\n        margin-left: 39px;\n      }\n    }\n\n    .controls {\n      display: flex;\n      justify-content: space-between;\n    }\n  }\n"])), COLORS.neutral_200, ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black), ComponentSStyling(ComponentTextStyle.Regular, COLORS.black));
+//# sourceMappingURL=TableStyles.js.map

package/dist/Table/TableStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Table/TableStyles.ts"],"names":["styled","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","TableWrapper","div","TableLoadingIndicator","TableContainer","table","neutral_200","TableHeaderRowCol","th","neutral_20","Bold","neutral_600","TableColumnHeaderCol","white","neutral_300","primary_20","primary_100","TableDataRow","tr","neutral_100","primary_200","TableDataCol","td","Regular","black","primary_600","primary_700","focus_25","focus","TableFooterCol"],"mappings":";;;;AAAA;AACA;AACA;AACA,OAAOA,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,iBAAT,EAA+CC,iBAA/C,EAAkEC,kBAAlE,EAAsFC,kBAAtF,QAAgH,sBAAhH;AAEA;AACA;AACA;;AAEA,OAAO,IAAMC,YAAY,GAAGN,MAAM,CAACO,GAAV,8FAAlB;AAIP,OAAO,IAAMC,qBAAqB,GAAGR,MAAM,CAACO,GAAV,qLAA3B;AAQP,OAAO,IAAME,cAAc,GAAGT,MAAM,CAACU,KAAV,uLAGDT,MAAM,CAACU,WAHN,EAIEV,MAAM,CAACU,WAJT,CAApB;AAOP,OAAO,IAAMC,iBAAiB,GAAGZ,MAAM,CAACa,EAAV,iUACRZ,MAAM,CAACa,UADC,EAEDb,MAAM,CAACU,WAFN,EAI1BT,iBAAiB,CAACE,kBAAkB,CAACW,IAApB,EAA0Bd,MAAM,CAACe,WAAjC,CAJS,CAAvB;AAkBP,OAAO,IAAMC,oBAAoB,GAAGjB,MAAM,CAACa,EAAV,2jBACXZ,MAAM,CAACiB,KADI,EAEPjB,MAAM,CAACkB,WAFA,EAI7BhB,iBAAiB,CAACC,kBAAkB,CAACW,IAApB,EAA0Bd,MAAM,CAACe,WAAjC,CAJY,EAgCbf,MAAM,CAACmB,UAhCM,EAoCbnB,MAAM,CAACoB,WApCM,CAA1B;AAyCP,OAAO,IAAMC,YAAY,GAAGtB,MAAM,CAACuB,EAAV,oTACHtB,MAAM,CAACuB,WADJ,EAIDvB,MAAM,CAACa,UAJN,EASDb,MAAM,CAACwB,WATN,EAcDxB,MAAM,CAACuB,WAdN,CAAlB;AAkBP,OAAO,IAAME,YAAY,GAAG1B,MAAM,CAAC2B,EAAV,qwBAGrBxB,iBAAiB,CAACC,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAHI,EA0BZ5B,MAAM,CAAC6B,WA1BK,EA8BV7B,MAAM,CAAC8B,WA9BG,EAqCQ9B,MAAM,CAAC+B,QArCf,EAqCwC/B,MAAM,CAACgC,KArC/C,EAsCVhC,MAAM,CAAC8B,WAtCG,CAAlB;AA+CP,OAAO,IAAMG,cAAc,GAAGlC,MAAM,CAAC2B,EAAV,kmBACD1B,MAAM,CAACU,WADN,EAUnBN,kBAAkB,CAACD,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAVC,EAkBnB1B,iBAAiB,CAACC,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAlBE,CAApB","sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport { COLORS } from '../styles';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling } from '../styles/typography';\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n  position: relative;\n`;\n\nexport const TableLoadingIndicator = styled.div`\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  background-color: rgba(0, 0, 0, 0.5);\n  top: 0;\n`;\n\nexport const TableContainer = styled.table`\n  background: transparent;\n  width: 100%;\n  border-top: 2px solid ${COLORS.neutral_200};\n  border-bottom: 2px solid ${COLORS.neutral_200};\n`;\n\nexport const TableHeaderRowCol = styled.th`\n  background-color: ${COLORS.neutral_20};\n  border-bottom: 1px solid ${COLORS.neutral_200};\n\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  padding: 16px 19px 16px 16px;\n\n  div {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    svg {\n      cursor: pointer;\n    }\n  }\n`;\n\nexport const TableColumnHeaderCol = styled.th`\n  background-color: ${COLORS.white};\n  border-top: 1px solid ${COLORS.neutral_300};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  padding: 18px 16px;\n  text-align: left;\n\n  &.justify-center {\n    text-align: center;\n  }\n\n  &.justify-left {\n    text-align: left;\n  }\n\n  &.justify-right {\n    text-align: right;\n  }\n\n  &.no-border {\n    border: none;\n  }\n\n  &.sortable {\n    cursor: pointer;\n\n    > svg {\n      float: right;\n    }\n\n    &:hover {\n      background: ${COLORS.primary_20};\n    }\n\n    &:focus {\n      background: ${COLORS.primary_100};\n    }\n  }\n`;\n\nexport const TableDataRow = styled.tr`\n  background-color: ${COLORS.neutral_100};\n\n  &:nth-child(2n) {\n    background-color: ${COLORS.neutral_20};\n  }\n\n  &:hover {\n    cursor: pointer;\n    background-color: ${COLORS.primary_200};\n  }\n\n  &.no-rows:hover {\n    cursor: default;\n    background-color: ${COLORS.neutral_100};\n  }\n`;\n\nexport const TableDataCol = styled.td`\n  background: transparent;\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n  padding: 15px 16px;\n  border: none;\n\n  &.truncate-text {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &.justify-center {\n    text-align: center;\n  }\n\n  &.justify-left {\n    text-align: left;\n  }\n\n  &.justify-right {\n    text-align: right;\n  }\n\n  button {\n    color: ${COLORS.primary_600};\n    text-decoration: none;\n\n    &:hover {\n      color: ${COLORS.primary_700};\n      text-decoration: underline;\n    }\n\n    &:focus {\n      text-decoration: underline;\n      outline: none;\n      box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n      color: ${COLORS.primary_700};\n    }\n  }\n\n  &.center {\n    text-align: center;\n  }\n`;\n\nexport const TableFooterCol = styled.td`\n  border-top: 1px solid ${COLORS.neutral_200};\n  padding: 3.5px 20px 3.5px 16px;\n\n  > div {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n\n    > div > div:first-of-type {\n      ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n      display: block;\n      padding-top: 11px;\n      padding-left: 2px;\n      padding-right: 30px;\n    }\n\n    span {\n      ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n      &.current-page-info {\n        margin-right: 34px;\n        margin-left: 39px;\n      }\n    }\n\n    .controls {\n      display: flex;\n      justify-content: space-between;\n    }\n  }\n`;\n"],"file":"TableStyles.js"}