@canonical/react-components 0.41.0 → 0.43.0

package/dist/components/MainTable/MainTable.js

@@ -1,68 +1,40 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _Pagination = _interopRequireDefault(require("../Pagination"));
-
 var _Table = _interopRequireDefault(require("../Table"));
-
 var _TableRow = _interopRequireDefault(require("../TableRow"));
-
 var _TableHeader = _interopRequireDefault(require("../TableHeader"));
-
 var _TableCell = _interopRequireDefault(require("../TableCell"));
-
 var _hooks = require("../../hooks");
-
 var _excluded = ["content", "sortKey"],
-    _excluded2 = ["columns", "expanded", "expandedContent", "key", "sortData"],
-    _excluded3 = ["content"],
-    _excluded4 = ["defaultSort", "defaultSortDirection", "emptyStateMsg", "expanding", "headers", "onUpdateSort", "paginate", "rows", "responsive", "sortable", "sortFunction", "hiddenCaption"];
-
+  _excluded2 = ["columns", "expanded", "expandedContent", "key", "sortData"],
+  _excluded3 = ["content"],
+  _excluded4 = ["defaultSort", "defaultSortDirection", "emptyStateMsg", "expanding", "headers", "onUpdateSort", "paginate", "rows", "responsive", "sortable", "sortFunction", "hiddenCaption"];
 var _this = void 0;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-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; }
-
+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; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 var updateSort = function updateSort(setSortKey, setSortDirection, sortKey, sortDirection) {
   var newDirection = null;
-
   if (sortDirection === "none") {
     newDirection = "ascending";
   } else if (sortDirection === "ascending") {
@@ -70,19 +42,15 @@ var updateSort = function updateSort(setSortKey, setSortDirection, sortKey, sort
   } else {
     sortKey = null;
   }
-
   setSortKey(sortKey);
   setSortDirection(newDirection);
 };
-
 var generateHeaders = function generateHeaders(currentSortKey, currentSortDirection, expanding, headers, sortable, setSortKey, setSortDirection) {
   var headerItems = headers.map(function (_ref, index) {
     var content = _ref.content,
-        sortKey = _ref.sortKey,
-        props = _objectWithoutProperties(_ref, _excluded);
-
+      sortKey = _ref.sortKey,
+      props = _objectWithoutProperties(_ref, _excluded);
     var sortDirection;
-
     if (sortable && sortKey) {
       if (currentSortKey === sortKey) {
         sortDirection = currentSortDirection;
@@ -90,55 +58,49 @@ var generateHeaders = function generateHeaders(currentSortKey, currentSortDirect
         sortDirection = "none";
       }
     }
-
     return /*#__PURE__*/_react.default.createElement(_TableHeader.default, _extends({
       key: index,
       sort: sortDirection,
       onClick: sortable && sortKey ? updateSort.bind(_this, setSortKey, setSortDirection, sortKey, sortDirection) : undefined
     }, props), content);
-  }); // When there is expanding content then provide an extra hidden header to
+  });
+  // When there is expanding content then provide an extra hidden header to
   // account for the extra cell in the body rows.
-
   return /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement(_TableRow.default, null, headerItems, expanding && /*#__PURE__*/_react.default.createElement(_TableHeader.default, {
     "aria-hidden": "true"
   })));
 };
-
 var generateRows = function generateRows(_ref2) {
   var rows = _ref2.rows,
-      headers = _ref2.headers,
-      responsive = _ref2.responsive,
-      expanding = _ref2.expanding;
+    headers = _ref2.headers,
+    responsive = _ref2.responsive,
+    expanding = _ref2.expanding;
   return rows.map(function (_ref3, index) {
     var columns = _ref3.columns,
-        expanded = _ref3.expanded,
-        expandedContent = _ref3.expandedContent,
-        key = _ref3.key,
-        sortData = _ref3.sortData,
-        rowProps = _objectWithoutProperties(_ref3, _excluded2);
-
+      expanded = _ref3.expanded,
+      expandedContent = _ref3.expandedContent,
+      key = _ref3.key,
+      sortData = _ref3.sortData,
+      rowProps = _objectWithoutProperties(_ref3, _excluded2);
     var cellItems = columns === null || columns === void 0 ? void 0 : columns.map(function (_ref4, index) {
       var content = _ref4.content,
-          cellProps = _objectWithoutProperties(_ref4, _excluded3);
-
+        cellProps = _objectWithoutProperties(_ref4, _excluded3);
       var headerContent = headers && headers[index]["content"];
       var headerReplacement = headers && headers[index]["heading"];
-
       if (responsive) {
         cellProps["data-heading"] = typeof headerContent === "string" ? headerContent : headerReplacement;
       }
-
       return /*#__PURE__*/_react.default.createElement(_TableCell.default, _extends({
         key: index
       }, cellProps), content);
-    }); // if key was not provided as a prop, use row's index instead
-
+    });
+    // if key was not provided as a prop, use row's index instead
     if (key === null || typeof key === "undefined") {
       key = index;
-    } // The expanding cell is alway created to match the correct number of
-    // table cells in rows that do have expanding content.
-
+    }
 
+    // The expanding cell is alway created to match the correct number of
+    // table cells in rows that do have expanding content.
     return /*#__PURE__*/_react.default.createElement(_TableRow.default, _extends({
       key: key
     }, rowProps), cellItems, expanding && /*#__PURE__*/_react.default.createElement(_TableCell.default, {
@@ -147,86 +109,74 @@ var generateRows = function generateRows(_ref2) {
     }, expandedContent));
   });
 };
-
 var sortRows = function sortRows(_ref5) {
   var currentSortDirection = _ref5.currentSortDirection,
-      currentSortKey = _ref5.currentSortKey,
-      rows = _ref5.rows,
-      sortable = _ref5.sortable,
-      sortFunction = _ref5.sortFunction;
-
+    currentSortKey = _ref5.currentSortKey,
+    rows = _ref5.rows,
+    sortable = _ref5.sortable,
+    sortFunction = _ref5.sortFunction;
   if (!rows) {
     return [];
-  } // Clone the rows so we can restore the original order.
-
-
+  }
+  // Clone the rows so we can restore the original order.
   var sortedRows = _toConsumableArray(rows);
-
   if (sortable && currentSortKey) {
     if (!sortFunction) {
       sortFunction = function sortFunction(a, b) {
         if (!a.sortData || !b.sortData) {
           return 0;
         }
-
         if (a.sortData[currentSortKey] > b.sortData[currentSortKey]) {
           return currentSortDirection === "ascending" ? 1 : -1;
         } else if (a.sortData[currentSortKey] < b.sortData[currentSortKey]) {
           return currentSortDirection === "ascending" ? -1 : 1;
         }
-
         return 0;
       };
     }
-
     sortedRows.sort(function (a, b) {
       return sortFunction(a, b, currentSortDirection, currentSortKey);
     });
   }
-
   return sortedRows;
 };
-
 var MainTable = function MainTable(_ref6) {
   var defaultSort = _ref6.defaultSort,
-      defaultSortDirection = _ref6.defaultSortDirection,
-      _ref6$emptyStateMsg = _ref6.emptyStateMsg,
-      emptyStateMsg = _ref6$emptyStateMsg === void 0 ? "" : _ref6$emptyStateMsg,
-      expanding = _ref6.expanding,
-      headers = _ref6.headers,
-      onUpdateSort = _ref6.onUpdateSort,
-      paginate = _ref6.paginate,
-      rows = _ref6.rows,
-      responsive = _ref6.responsive,
-      sortable = _ref6.sortable,
-      sortFunction = _ref6.sortFunction,
-      hiddenCaption = _ref6.hiddenCaption,
-      props = _objectWithoutProperties(_ref6, _excluded4);
-
+    defaultSortDirection = _ref6.defaultSortDirection,
+    _ref6$emptyStateMsg = _ref6.emptyStateMsg,
+    emptyStateMsg = _ref6$emptyStateMsg === void 0 ? "" : _ref6$emptyStateMsg,
+    expanding = _ref6.expanding,
+    headers = _ref6.headers,
+    onUpdateSort = _ref6.onUpdateSort,
+    paginate = _ref6.paginate,
+    rows = _ref6.rows,
+    responsive = _ref6.responsive,
+    sortable = _ref6.sortable,
+    sortFunction = _ref6.sortFunction,
+    hiddenCaption = _ref6.hiddenCaption,
+    props = _objectWithoutProperties(_ref6, _excluded4);
   var _useState = (0, _react.useState)(defaultSort),
-      _useState2 = _slicedToArray(_useState, 2),
-      currentSortKey = _useState2[0],
-      setSortKey = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    currentSortKey = _useState2[0],
+    setSortKey = _useState2[1];
   var _useState3 = (0, _react.useState)(defaultSortDirection),
-      _useState4 = _slicedToArray(_useState3, 2),
-      currentSortDirection = _useState4[0],
-      setSortDirection = _useState4[1]; // Update the current sort state if the prop changes.
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentSortDirection = _useState4[0],
+    setSortDirection = _useState4[1];
 
+  // Update the current sort state if the prop changes.
   (0, _react.useEffect)(function () {
     setSortKey(defaultSort);
-  }, [defaultSort]); // Update the current sort direction state if the prop changes.
+  }, [defaultSort]);
 
+  // Update the current sort direction state if the prop changes.
   (0, _react.useEffect)(function () {
     setSortDirection(defaultSortDirection);
   }, [defaultSortDirection]);
-
   var updateSort = function updateSort(newSort) {
     setSortKey(newSort);
     onUpdateSort && onUpdateSort(newSort);
   };
-
   var sortedRows = (0, _react.useMemo)(function () {
     return sortRows({
       currentSortDirection: currentSortDirection,
@@ -236,15 +186,13 @@ var MainTable = function MainTable(_ref6) {
       sortFunction: sortFunction
     });
   }, [currentSortDirection, currentSortKey, rows, sortable, sortFunction]);
-
   var _usePagination = (0, _hooks.usePagination)(sortedRows, {
-    itemsPerPage: paginate,
-    autoResetPage: true
-  }),
-      finalRows = _usePagination.pageData,
-      currentPage = _usePagination.currentPage,
-      setCurrentPage = _usePagination.paginate;
-
+      itemsPerPage: paginate,
+      autoResetPage: true
+    }),
+    finalRows = _usePagination.pageData,
+    currentPage = _usePagination.currentPage,
+    setCurrentPage = _usePagination.paginate;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Table.default, _extends({
     expanding: expanding,
     responsive: responsive
@@ -258,7 +206,8 @@ var MainTable = function MainTable(_ref6) {
       top: "auto",
       width: "1px"
     }
-  }, hiddenCaption), !!headers && generateHeaders(currentSortKey, currentSortDirection, expanding, headers, sortable, updateSort, setSortDirection), // If the table has no rows, return empty state message
+  }, hiddenCaption), !!headers && generateHeaders(currentSortKey, currentSortDirection, expanding, headers, sortable, updateSort, setSortDirection),
+  // If the table has no rows, return empty state message
   Object.entries(finalRows).length === 0 && emptyStateMsg ? /*#__PURE__*/_react.default.createElement("caption", null, emptyStateMsg) : /*#__PURE__*/_react.default.createElement("tbody", null, generateRows({
     rows: finalRows,
     headers: headers,
@@ -274,6 +223,5 @@ var MainTable = function MainTable(_ref6) {
     totalItems: rows.length
   }));
 };
-
 var _default = MainTable;
 exports.default = _default;

package/dist/components/MainTable/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
     return _MainTable.default;
   }
 });
-
 var _MainTable = _interopRequireDefault(require("./MainTable"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/Modal/Modal.js

@@ -1,40 +1,27 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Modal = void 0;
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _useId = require("../../hooks/useId");
-
 var _excluded = ["buttonRow", "children", "className", "close", "title"];
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 var Modal = function Modal(_ref) {
   var buttonRow = _ref.buttonRow,
-      children = _ref.children,
-      className = _ref.className,
-      close = _ref.close,
-      title = _ref.title,
-      wrapperProps = _objectWithoutProperties(_ref, _excluded);
-
+    children = _ref.children,
+    className = _ref.className,
+    close = _ref.close,
+    title = _ref.title,
+    wrapperProps = _objectWithoutProperties(_ref, _excluded);
   // list of focusable selectors is based on this Stack Overflow answer:
   // https://stackoverflow.com/a/30753870/3732840
   var focusableElementSelectors = 'a[href]:not([tabindex="-1"]), button:not([disabled]), textarea:not([disabled]):not([tabindex="-1"]), input:not([disabled]):not([tabindex="-1"]), select:not([disabled]):not([tabindex="-1"]), area[href]:not([tabindex="-1"]), iframe:not([tabindex="-1"]), [tabindex]:not([tabindex="-1"]), [contentEditable=true]:not([tabindex="-1"])';
@@ -43,43 +30,36 @@ var Modal = function Modal(_ref) {
   var shouldClose = (0, _react.useRef)(false);
   var modalRef = (0, _react.useRef)(null);
   var focusableModalElements = (0, _react.useRef)(null);
-
   var handleTabKey = function handleTabKey(e) {
     if (focusableModalElements.current.length > 0) {
       var firstElement = focusableModalElements.current[0];
       var lastElement = focusableModalElements.current[focusableModalElements.current.length - 1];
-
       if (!e.shiftKey && document.activeElement === lastElement) {
         firstElement.focus();
         e.preventDefault();
       }
-
       if (e.shiftKey && document.activeElement === firstElement) {
         lastElement.focus();
         return e.preventDefault();
       }
     }
   };
-
   var handleEscKey = function handleEscKey(e) {
     e.nativeEvent.stopImmediatePropagation();
     close();
   };
-
   var keyListenersMap = new Map([["Escape", handleEscKey], ["Tab", handleTabKey]]);
   (0, _react.useEffect)(function () {
     modalRef.current.focus();
   }, [modalRef]);
   (0, _react.useEffect)(function () {
     var _focusableModalElemen;
-
     focusableModalElements.current = modalRef.current.querySelectorAll(focusableElementSelectors);
-    var focusIndex = 0; // when the close button is rendered, focus on the 2nd content element and not the close btn.
-
+    var focusIndex = 0;
+    // when the close button is rendered, focus on the 2nd content element and not the close btn.
     if (close && focusableModalElements.current.length > 1) {
       focusIndex = 1;
     }
-
     (_focusableModalElemen = focusableModalElements.current[focusIndex]) === null || _focusableModalElemen === void 0 ? void 0 : _focusableModalElemen.focus();
   }, []);
   (0, _react.useEffect)(function () {
@@ -87,33 +67,27 @@ var Modal = function Modal(_ref) {
       var listener = keyListenersMap.get(e.code);
       return listener && listener(e);
     };
-
     document.addEventListener("keydown", keyDown);
     return function () {
       document.removeEventListener("keydown", keyDown);
     };
   });
-
   var handleContentOnMouseDown = function handleContentOnMouseDown() {
     shouldClose.current = false;
   };
-
   var handleContentOnMouseUp = function handleContentOnMouseUp() {
     shouldClose.current = false;
   };
-
   var handleOverlayOnMouseDown = function handleOverlayOnMouseDown(event) {
     if (event.target === modalRef.current) {
       shouldClose.current = true;
     }
   };
-
   var handleOverlayOnClick = function handleOverlayOnClick() {
     if (shouldClose.current) {
       close();
     }
   };
-
   return /*#__PURE__*/_react.default.createElement("div", _extends({
     className: (0, _classnames.default)("p-modal", className),
     onClick: handleOverlayOnClick,
@@ -143,7 +117,6 @@ var Modal = function Modal(_ref) {
     className: "p-modal__footer"
   }, buttonRow)));
 };
-
 exports.Modal = Modal;
 var _default = Modal;
 exports.default = _default;

package/dist/components/Modal/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
     return _Modal.default;
   }
 });
-
 var _Modal = _interopRequireDefault(require("./Modal"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/ModularTable/ModularTable.d.ts

@@ -36,6 +36,14 @@ export type Props<D extends Record<string, unknown>> = PropsWithSpread<{
      */
     getCellProps?: (cell: Cell<D>) => Partial<TableCellProps & HTMLProps<HTMLTableCellElement>>;
     getRowId?: UseTableOptions<D>["getRowId"];
+    /**
+     * The column that the table will be sorted by (this should match a cell selector).
+     */
+    initialSortColumn?: string;
+    /**
+     * The direction of the initial sort.
+     */
+    initialSortDirection?: "ascending" | "descending";
 }, HTMLProps<HTMLTableElement>>;
-declare function ModularTable<D extends Record<string, unknown>>({ data, columns, emptyMsg, footer, sortable, getHeaderProps, getRowProps, getCellProps, getRowId, ...props }: Props<D>): JSX.Element;
+declare function ModularTable<D extends Record<string, unknown>>({ data, columns, emptyMsg, footer, sortable, getHeaderProps, getRowProps, getCellProps, getRowId, initialSortColumn, initialSortDirection, ...props }: Props<D>): JSX.Element;
 export default ModularTable;

package/dist/components/ModularTable/ModularTable.js

@@ -4,40 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
+var _react = _interopRequireWildcard(require("react"));
 var _reactTable = require("react-table");
-
 var _Table = _interopRequireDefault(require("../Table"));
-
 var _TableRow = _interopRequireDefault(require("../TableRow"));
-
 var _TableHeader = _interopRequireDefault(require("../TableHeader"));
-
 var _TableCell = _interopRequireDefault(require("../TableCell"));
-
 var _Icon = _interopRequireDefault(require("../Icon"));
-
-var _excluded = ["data", "columns", "emptyMsg", "footer", "sortable", "getHeaderProps", "getRowProps", "getCellProps", "getRowId"];
-
+var _excluded = ["data", "columns", "emptyMsg", "footer", "sortable", "getHeaderProps", "getRowProps", "getCellProps", "getRowId", "initialSortColumn", "initialSortDirection"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var generateCell = function generateCell(cell, getCellProps) {
   var _cell$column$getCellI, _cell$column;
-
   var hasColumnIcon = cell.column.getCellIcon;
   var iconName = hasColumnIcon && ((_cell$column$getCellI = (_cell$column = cell.column).getCellIcon) === null || _cell$column$getCellI === void 0 ? void 0 : _cell$column$getCellI.call(_cell$column, cell));
   return /*#__PURE__*/_react.default.createElement(_TableCell.default, cell.getCellProps([{
@@ -48,12 +36,10 @@ var generateCell = function generateCell(cell, getCellProps) {
     name: iconName
   }), cell.render("Cell"));
 };
-
 var generateRows = function generateRows(rows, prepareRow, getRowProps, getCellProps) {
   var tableRows = [];
   rows.forEach(function (row) {
     var _row$subRows;
-
     // This function is responsible for lazily preparing a row for rendering.
     // Any row that you intend to render in your table needs to be passed to this function before every render.
     // see: https://react-table.tanstack.com/docs/api/useTable#instance-properties
@@ -61,37 +47,44 @@ var generateRows = function generateRows(rows, prepareRow, getRowProps, getCellP
     tableRows.push( /*#__PURE__*/_react.default.createElement(_TableRow.default, row.getRowProps(getRowProps === null || getRowProps === void 0 ? void 0 : getRowProps(row)), row.cells.map(function (cell) {
       return generateCell(cell, getCellProps);
     })));
-
     if ((_row$subRows = row.subRows) !== null && _row$subRows !== void 0 && _row$subRows.length) {
       tableRows = tableRows.concat(generateRows(row.subRows, prepareRow, getRowProps, getCellProps));
     }
   });
   return tableRows;
 };
-
 function ModularTable(_ref) {
   var data = _ref.data,
-      columns = _ref.columns,
-      emptyMsg = _ref.emptyMsg,
-      footer = _ref.footer,
-      sortable = _ref.sortable,
-      getHeaderProps = _ref.getHeaderProps,
-      getRowProps = _ref.getRowProps,
-      getCellProps = _ref.getCellProps,
-      getRowId = _ref.getRowId,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    columns = _ref.columns,
+    emptyMsg = _ref.emptyMsg,
+    footer = _ref.footer,
+    sortable = _ref.sortable,
+    getHeaderProps = _ref.getHeaderProps,
+    getRowProps = _ref.getRowProps,
+    getCellProps = _ref.getCellProps,
+    getRowId = _ref.getRowId,
+    initialSortColumn = _ref.initialSortColumn,
+    initialSortDirection = _ref.initialSortDirection,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var sortBy = (0, _react.useMemo)(function () {
+    return initialSortColumn ? [{
+      id: initialSortColumn,
+      desc: initialSortDirection === "descending"
+    }] : [];
+  }, [initialSortColumn, initialSortDirection]);
   var _useTable = (0, _reactTable.useTable)({
-    columns: columns,
-    data: data,
-    getRowId: getRowId || undefined
-  }, sortable ? _reactTable.useSortBy : undefined),
-      getTableProps = _useTable.getTableProps,
-      getTableBodyProps = _useTable.getTableBodyProps,
-      headerGroups = _useTable.headerGroups,
-      rows = _useTable.rows,
-      prepareRow = _useTable.prepareRow;
-
+      columns: columns,
+      data: data,
+      getRowId: getRowId || undefined,
+      initialState: {
+        sortBy: sortBy
+      }
+    }, sortable ? _reactTable.useSortBy : undefined),
+    getTableProps = _useTable.getTableProps,
+    getTableBodyProps = _useTable.getTableBodyProps,
+    headerGroups = _useTable.headerGroups,
+    rows = _useTable.rows,
+    prepareRow = _useTable.prepareRow;
   var showEmpty = !!emptyMsg && (!rows || rows.length === 0);
   return /*#__PURE__*/_react.default.createElement(_Table.default, _extends({}, getTableProps(), props), /*#__PURE__*/_react.default.createElement("thead", null, headerGroups.map(function (headerGroup) {
     return /*#__PURE__*/_react.default.createElement(_TableRow.default, headerGroup.getHeaderGroupProps(), headerGroup.headers.map(function (column) {
@@ -101,7 +94,8 @@ function ModularTable(_ref) {
         className: column.className
       }, {
         className: column.getCellIcon ? "p-table__cell--icon-placeholder" : ""
-      }, _objectSpread({}, getHeaderProps === null || getHeaderProps === void 0 ? void 0 : getHeaderProps(column)), // Only call this if we want it to be sortable too.
+      }, _objectSpread({}, getHeaderProps === null || getHeaderProps === void 0 ? void 0 : getHeaderProps(column)),
+      // Only call this if we want it to be sortable too.
       sortable ? column.getSortByToggleProps({
         title: undefined
       }) : {}])), column.render("Header"));
@@ -112,6 +106,5 @@ function ModularTable(_ref) {
     colSpan: columns.length
   }, footer))));
 }
-
 var _default = ModularTable;
 exports.default = _default;

package/dist/components/ModularTable/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
     return _ModularTable.default;
   }
 });
-
 var _ModularTable = _interopRequireDefault(require("./ModularTable"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }