@elliemae/ds-pagination 2.2.0-alpha.3 → 2.2.0-next.2

package/cjs/parts/Paginator.js

@@ -1,131 +1,143 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var Paginator_exports = {};
-__export(Paginator_exports, {
-  default: () => Paginator_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
-var import_ds_utilities = __toESM(require("@elliemae/ds-utilities"));
-var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
-var import_ds_dropdownmenu = __toESM(require("@elliemae/ds-dropdownmenu"));
-var import_styled = __toESM(require("../styled"));
-var import_usePaginationSearch = __toESM(require("../hooks/usePaginationSearch"));
-const Paginator = (props) => {
-  const { pageIndex, pageCount, onPageChange, pageDetails, pageDetailsTitle } = props;
-  const [isOpened, setIsOpened] = (0, import_react.useState)(false);
-  const btnRef = (0, import_react.useRef)(null);
-  const pageInfoRef = (0, import_react.useRef)(null);
-  const { width: btnWidth } = (0, import_ds_utilities.useOnElementResize)(btnRef);
-  const { width: txtWidth } = (0, import_ds_utilities.useOnElementResize)(pageInfoRef);
-  const options = (0, import_react.useMemo)(() => new Array(pageCount).fill(0).map((_, index) => {
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+var react = require('react');
+var dsIcons = require('@elliemae/ds-icons');
+var dsUtilities = require('@elliemae/ds-utilities');
+var Grid = require('@elliemae/ds-grid');
+var dsDropdownmenu = require('@elliemae/ds-dropdownmenu');
+var styled = require('../styled.js');
+var usePaginationSearch = require('../hooks/usePaginationSearch.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
+
+var _div, _PaginationSeparator, _PaginationSeparator2, _PaginationSeparator3, _PaginationSeparator4;
+
+const Paginator = props => {
+  var _span2;
+
+  const {
+    pageIndex,
+    pageCount,
+    onPageChange,
+    pageDetails,
+    pageDetailsTitle
+  } = props;
+  const [isOpened, setIsOpened] = react.useState(false);
+  const btnRef = react.useRef(null);
+  const pageInfoRef = react.useRef(null);
+  const {
+    width: btnWidth
+  } = dsUtilities.useOnElementResize(btnRef);
+  const {
+    width: txtWidth
+  } = dsUtilities.useOnElementResize(pageInfoRef);
+  const options = react.useMemo(() => new Array(pageCount).fill(0).map((_, index) => {
+    var _span;
+
     const option = {
       dsId: (index + 1).toString(),
       label: (index + 1).toString(),
       value: index + 1,
-      type: "single"
+      type: 'single'
     };
+
     if (pageDetails.length) {
-      option.render = () => /* @__PURE__ */ import_react.default.createElement(import_ds_grid.default, {
-        cols: ["16px", `${txtWidth + 16}px`, "auto"],
+      option.render = () => /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
+        cols: ['16px', "".concat(txtWidth + 16, "px"), 'auto'],
         gutter: "xxs",
         alignItems: "center"
-      }, pageIndex === index ? /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Checkmark, {
+      }, void 0, pageIndex === index ? /*#__PURE__*/_jsx__default["default"](dsIcons.Checkmark, {
         size: "s",
-        color: ["brand-primary", "600"]
-      }) : /* @__PURE__ */ import_react.default.createElement("div", null), /* @__PURE__ */ import_react.default.createElement("span", null, index + 1), /* @__PURE__ */ import_react.default.createElement("span", {
+        color: ['brand-primary', '600']
+      }) : _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {})), _span || (_span = /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, index + 1)), /*#__PURE__*/_jsx__default["default"]("span", {
         style: {
-          whiteSpace: "nowrap",
-          textOverflow: "ellipsis",
-          overflow: "hidden"
+          whiteSpace: 'nowrap',
+          textOverflow: 'ellipsis',
+          overflow: 'hidden'
         }
-      }, pageDetails[index]));
+      }, void 0, pageDetails[index]));
     }
+
     return option;
   }), [pageCount, pageDetails, pageIndex, txtWidth]);
-  const actionRef = (0, import_react.useRef)({});
-  (0, import_react.useEffect)(() => {
+  const actionRef = react.useRef({});
+  react.useEffect(() => {
     if (isOpened) {
       actionRef.current.setActiveDescendant((pageIndex + 1).toString());
       actionRef.current.scrollOptionIntoView((pageIndex + 1).toString());
-    }
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
   }, [isOpened]);
-  const onKeyDown = (0, import_usePaginationSearch.usePaginationSearch)(pageCount, actionRef);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationSeparator, null), /* @__PURE__ */ import_react.default.createElement(import_ds_dropdownmenu.DSDropdownMenuV2, {
-    isOpened,
-    options,
-    selectedOptions: { [(pageIndex + 1).toString()]: true },
-    onOptionClick: (_, clickedOption) => {
-      onPageChange(clickedOption.value);
-      setIsOpened(false);
-      btnRef.current.focus();
-    },
-    onClickOutside: () => {
-      setIsOpened(false);
-      btnRef.current.focus();
-    },
-    customOffset: [0, 2],
-    startPlacementPreference: "top-end",
-    actionRef,
-    onKeyDown,
-    minWidth: btnWidth + 23,
-    maxHeight: 300,
-    HeaderComp: () => pageDetailsTitle !== "" ? /* @__PURE__ */ import_react.default.createElement(import_ds_grid.default, {
-      cols: [`${txtWidth + 50}px`, "8px", "auto"]
-    }, /* @__PURE__ */ import_react.default.createElement("span", {
-      style: { marginLeft: "8px" }
-    }, "Page"), /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationSeparator, {
-      height: "100%"
-    }), /* @__PURE__ */ import_react.default.createElement("span", null, pageDetailsTitle)) : "Page"
-  }, /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationDropdownButton, {
-    buttonType: "raw",
-    onClick: () => setIsOpened(true),
-    innerRef: btnRef
-  }, /* @__PURE__ */ import_react.default.createElement("div", {
-    style: { display: "flex", gridGap: "8px", alignItems: "center" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.default, {
-    cols: ["auto", "auto", "auto"],
-    alignItems: "center",
-    gutter: "xxxs",
-    ref: pageInfoRef
-  }, /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationBoldText, {
-    fontSize: "18px"
-  }, pageIndex + 1), " / ", pageCount), pageDetails.length !== 0 && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationSeparator, {
-    height: "12px",
-    ml: "8px"
-  }), /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationBoldText, {
-    fontSize: "13px",
-    mr: "8px"
-  }, pageDetails[pageIndex])), /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronDown, {
-    color: ["brand-primary", "700"]
-  })))), /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationSeparator, null));
+  const onKeyDown = usePaginationSearch.usePaginationSearch(pageCount, actionRef);
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [_PaginationSeparator || (_PaginationSeparator = /*#__PURE__*/_jsx__default["default"](styled.PaginationSeparator, {})), /*#__PURE__*/_jsx__default["default"](dsDropdownmenu.DSDropdownMenuV2, {
+      isOpened: isOpened,
+      options: options,
+      selectedOptions: {
+        [(pageIndex + 1).toString()]: true
+      },
+      onOptionClick: (_, clickedOption) => {
+        onPageChange(clickedOption.value);
+        setIsOpened(false);
+        btnRef.current.focus();
+      },
+      onClickOutside: () => {
+        setIsOpened(false);
+        btnRef.current.focus();
+      },
+      customOffset: [0, 2],
+      startPlacementPreference: "top-end",
+      actionRef: actionRef,
+      onKeyDown: onKeyDown,
+      minWidth: btnWidth + 23,
+      maxHeight: 300,
+      HeaderComp: () => pageDetailsTitle !== '' ? /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
+        cols: ["".concat(txtWidth + 50, "px"), '8px', 'auto']
+      }, void 0, /*#__PURE__*/_jsx__default["default"]("span", {
+        style: {
+          marginLeft: '8px'
+        }
+      }, void 0, "Page"), _PaginationSeparator2 || (_PaginationSeparator2 = /*#__PURE__*/_jsx__default["default"](styled.PaginationSeparator, {
+        height: "100%"
+      })), _span2 || (_span2 = /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, pageDetailsTitle))) : 'Page'
+    }, void 0, /*#__PURE__*/_jsx__default["default"](styled.PaginationDropdownButton, {
+      buttonType: "raw",
+      onClick: () => setIsOpened(true),
+      innerRef: btnRef
+    }, void 0, /*#__PURE__*/_jsx__default["default"]("div", {
+      style: {
+        display: 'flex',
+        gridGap: '8px',
+        alignItems: 'center'
+      }
+    }, void 0, /*#__PURE__*/jsxRuntime.jsxs(Grid__default["default"], {
+      cols: ['auto', 'auto', 'auto'],
+      alignItems: "center",
+      gutter: "xxxs",
+      ref: pageInfoRef,
+      children: [/*#__PURE__*/_jsx__default["default"](styled.PaginationBoldText, {
+        fontSize: "18px"
+      }, void 0, pageIndex + 1), " / ", pageCount]
+    }), pageDetails.length !== 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [_PaginationSeparator3 || (_PaginationSeparator3 = /*#__PURE__*/_jsx__default["default"](styled.PaginationSeparator, {
+        height: "12px",
+        ml: "8px"
+      })), /*#__PURE__*/_jsx__default["default"](styled.PaginationBoldText, {
+        fontSize: "13px",
+        mr: "8px"
+      }, void 0, pageDetails[pageIndex])]
+    }), /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDown, {
+      color: ['brand-primary', '700']
+    })))), _PaginationSeparator4 || (_PaginationSeparator4 = /*#__PURE__*/_jsx__default["default"](styled.PaginationSeparator, {}))]
+  });
 };
-var Paginator_default = Paginator;
-module.exports = __toCommonJS(Paginator_exports);
-//# sourceMappingURL=Paginator.js.map
+
+module.exports = Paginator;

package/cjs/parts/PerPageSelector.js

@@ -1,77 +1,71 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var PerPageSelector_exports = {};
-__export(PerPageSelector_exports, {
-  default: () => PerPageSelector_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_memoize_one = __toESM(require("memoize-one"));
-var import_ds_utilities = __toESM(require("@elliemae/ds-utilities"));
-var import_ds_dropdownmenu = __toESM(require("@elliemae/ds-dropdownmenu"));
-var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
-var import_styled = __toESM(require("../styled"));
-const generateOption = (value) => {
-  if (typeof value === "object") {
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+var react = require('react');
+var memoize = require('memoize-one');
+var dsUtilities = require('@elliemae/ds-utilities');
+var dsDropdownmenu = require('@elliemae/ds-dropdownmenu');
+var dsIcons = require('@elliemae/ds-icons');
+var styled = require('../styled.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var memoize__default = /*#__PURE__*/_interopDefaultLegacy(memoize);
+
+const generateOption = value => {
+  if (typeof value === 'object') {
     return value;
   }
+
   return {
     dsId: value.toString(),
     value,
     label: value.toString(),
-    type: "single"
+    type: 'single'
   };
 };
-const getOptions = (0, import_memoize_one.default)((step, min, max) => {
-  const options = (0, import_ds_utilities.range)(min, max + step, step).map(generateOption);
+
+const getOptions = memoize__default["default"]((step, min, max) => {
+  const options = dsUtilities.range(min, max + step, step).map(generateOption);
   return min === 0 ? options.slice(1, options.length) : options;
 });
-const PerPageSelector = (props) => {
-  const [isOpened, setIsOpened] = (0, import_react.useState)(false);
-  const { pageSize, onPageSizeChange, perPageOptions, maxPerPage, perPageStep, minPerPage } = props;
-  const options = (0, import_react.useMemo)(() => {
-    if (perPageOptions)
-      return perPageOptions.map(generateOption);
+
+const PerPageSelector = props => {
+  const [isOpened, setIsOpened] = react.useState(false);
+  const {
+    pageSize,
+    onPageSizeChange,
+    perPageOptions,
+    maxPerPage,
+    perPageStep,
+    minPerPage
+  } = props;
+  const options = react.useMemo(() => {
+    if (perPageOptions) return perPageOptions.map(generateOption);
     return getOptions(perPageStep, minPerPage, maxPerPage);
   }, [maxPerPage, minPerPage, perPageOptions, perPageStep]);
-  const actionRef = (0, import_react.useRef)({});
-  const btnRef = (0, import_react.useRef)(null);
-  (0, import_react.useEffect)(() => {
+  const actionRef = react.useRef({});
+  const btnRef = react.useRef(null);
+  react.useEffect(() => {
     if (isOpened) {
       actionRef.current.setActiveDescendant(pageSize.toString());
       actionRef.current.scrollOptionIntoView(pageSize.toString());
-    }
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
   }, [isOpened]);
-  const { width } = (0, import_ds_utilities.useOnElementResize)(btnRef);
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_dropdownmenu.DSDropdownMenuV2, {
-    isOpened,
-    options,
-    selectedOptions: { [pageSize.toString()]: true },
+  const {
+    width
+  } = dsUtilities.useOnElementResize(btnRef);
+  return /*#__PURE__*/_jsx__default["default"](dsDropdownmenu.DSDropdownMenuV2, {
+    isOpened: isOpened,
+    options: options,
+    selectedOptions: {
+      [pageSize.toString()]: true
+    },
     onOptionClick: (_, clickedOption) => {
       onPageSizeChange(clickedOption.value);
       setIsOpened(false);
@@ -83,21 +77,22 @@ const PerPageSelector = (props) => {
     },
     customOffset: [0, 2],
     startPlacementPreference: "top-end",
-    actionRef,
+    actionRef: actionRef,
     minWidth: width + 25,
     maxHeight: 300,
-    HeaderComp: () => "Per Page"
-  }, /* @__PURE__ */ import_react.default.createElement("div", {
-    style: { marginLeft: "32px" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_styled.PaginationDropdownButton, {
+    HeaderComp: () => 'Per Page'
+  }, void 0, /*#__PURE__*/_jsx__default["default"]("div", {
+    style: {
+      marginLeft: '32px'
+    }
+  }, void 0, /*#__PURE__*/_jsx__default["default"](styled.PaginationDropdownButton, {
     buttonType: "raw",
     onClick: () => setIsOpened(true),
     "aria-pressed": isOpened,
     innerRef: btnRef
-  }, pageSize, " / page", /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronDown, {
-    color: ["brand-primary", "700"]
+  }, void 0, pageSize, " / page", /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDown, {
+    color: ['brand-primary', '700']
   }))));
 };
-var PerPageSelector_default = PerPageSelector;
-module.exports = __toCommonJS(PerPageSelector_exports);
-//# sourceMappingURL=PerPageSelector.js.map
+
+module.exports = PerPageSelector;

package/cjs/props.js

@@ -1,64 +1,34 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var props_exports = {};
-__export(props_exports, {
-  defaultProps: () => defaultProps,
-  propTypes: () => propTypes
-});
-var React = __toESM(require("react"));
-var import_react_desc = __toESM(require("react-desc"));
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var reactDesc = require('react-desc');
+
 const emptyFunc = () => null;
+
 const propTypes = {
-  pageCount: import_react_desc.PropTypes.number.description("How many pages are there"),
-  pageIndex: import_react_desc.PropTypes.number.description("Index of the current page, starting from 1").defaultValue(1),
-  canPreviousPage: import_react_desc.PropTypes.bool.description("Whether the previous button is disabled or not").defaultValue(true),
-  canNextPage: import_react_desc.PropTypes.bool.description("Whether the next button is disabled or not").defaultValue(true),
-  pageSize: import_react_desc.PropTypes.number.description("The current page size").defaultValue(10),
-  showPerPageSelector: import_react_desc.PropTypes.bool.description("Whether to show the page selector").defaultValue(true),
-  perPageOptions: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.oneOfType([
-    import_react_desc.PropTypes.number,
-    import_react_desc.PropTypes.shape({
-      dsId: import_react_desc.PropTypes.string,
-      value: import_react_desc.PropTypes.number,
-      label: import_react_desc.PropTypes.string,
-      type: import_react_desc.PropTypes.oneOf(["single"])
-    })
-  ])).description("The available options for page size").defaultValue([10]),
-  perPageStep: import_react_desc.PropTypes.number.description("Step for the per page options").defaultValue(5),
-  minPerPage: import_react_desc.PropTypes.number.description("Step for the per page options").defaultValue(0),
-  maxPerPage: import_react_desc.PropTypes.number.description("Step for the per page options").defaultValue(100),
-  onPageSizeChange: import_react_desc.PropTypes.func.description("Function invoked when the page size changes").defaultValue(() => null),
-  onPreviousPage: import_react_desc.PropTypes.func.description("Function invoked when the previous button is pressed").defaultValue(() => null),
-  onPageChange: import_react_desc.PropTypes.func.description("Function invoked when the page changes").defaultValue(() => null),
-  onNextPage: import_react_desc.PropTypes.func.description("Function invoked when next button is pressed").defaultValue(() => null),
-  pageDetails: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.string).description("Details to provide for each page").defaultValue([]),
-  pageDetailsTitle: import_react_desc.PropTypes.string.description("The title of the details (usually a column of your dataset)").defaultValue(""),
-  width: import_react_desc.PropTypes.any.description("Width for the container of the pagination").defaultValue("100%")
+  pageCount: reactDesc.PropTypes.number.description('How many pages are there'),
+  pageIndex: reactDesc.PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),
+  canPreviousPage: reactDesc.PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),
+  canNextPage: reactDesc.PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),
+  pageSize: reactDesc.PropTypes.number.description('The current page size').defaultValue(10),
+  showPerPageSelector: reactDesc.PropTypes.bool.description('Whether to show the page selector').defaultValue(true),
+  perPageOptions: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.number, reactDesc.PropTypes.shape({
+    dsId: reactDesc.PropTypes.string,
+    value: reactDesc.PropTypes.number,
+    label: reactDesc.PropTypes.string,
+    type: reactDesc.PropTypes.oneOf(['single'])
+  })])).description('The available options for page size').defaultValue([10]),
+  perPageStep: reactDesc.PropTypes.number.description('Step for the per page options').defaultValue(5),
+  minPerPage: reactDesc.PropTypes.number.description('Step for the per page options').defaultValue(0),
+  maxPerPage: reactDesc.PropTypes.number.description('Step for the per page options').defaultValue(100),
+  onPageSizeChange: reactDesc.PropTypes.func.description('Function invoked when the page size changes').defaultValue(() => null),
+  onPreviousPage: reactDesc.PropTypes.func.description('Function invoked when the previous button is pressed').defaultValue(() => null),
+  onPageChange: reactDesc.PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),
+  onNextPage: reactDesc.PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),
+  pageDetails: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.string).description('Details to provide for each page').defaultValue([]),
+  pageDetailsTitle: reactDesc.PropTypes.string.description('The title of the details (usually a column of your dataset)').defaultValue(''),
+  width: reactDesc.PropTypes.any.description('Width for the container of the pagination').defaultValue('100%')
 };
 const defaultProps = {
   pageIndex: 1,
@@ -75,8 +45,9 @@ const defaultProps = {
   onNextPage: emptyFunc,
   onPageChange: emptyFunc,
   pageDetails: [],
-  pageDetailsTitle: "",
-  width: "100%"
+  pageDetailsTitle: '',
+  width: '100%'
 };
-module.exports = __toCommonJS(props_exports);
-//# sourceMappingURL=props.js.map
+
+exports.defaultProps = defaultProps;
+exports.propTypes = propTypes;