@elliemae/ds-page-number 1.55.0-next.7 → 2.0.0-alpha.10

package/cjs/DSPageNumber.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _extends = require('@babel/runtime/helpers/extends');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var React = require('react');
+var react = require('react');
 var reactDesc = require('react-desc');
 var dsClassnames = require('@elliemae/ds-classnames');
 var ChevronSmallDown = require('@elliemae/ds-icons/ChevronSmallDown');
@@ -13,124 +13,125 @@ var ChevronSmallUp = require('@elliemae/ds-icons/ChevronSmallUp');
 var DSButton = require('@elliemae/ds-button');
 var DSInputGroup = require('@elliemae/ds-form/InputGroup');
 var DSInput = require('@elliemae/ds-form/Input');
-var components_utils = require('./components/utils.js');
+var utils = require('./components/utils.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var ChevronSmallDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallDown);
 var ChevronSmallUp__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallUp);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
 var DSInputGroup__default = /*#__PURE__*/_interopDefaultLegacy(DSInputGroup);
 var DSInput__default = /*#__PURE__*/_interopDefaultLegacy(DSInput);
 
-var _excluded = ["className", "disabled", "value", "onChange", "containerProps", "currentPage", "totalPages", "separator"];
-var blockName = 'page-number-block';
-var PageNumberInputContainer = dsClassnames.aggregatedClasses(DSInputGroup__default['default'])(blockName);
-
-var DSPageNumber = function DSPageNumber(_ref) {
-  var className = _ref.className,
-      disabled = _ref.disabled;
-      _ref.value;
-      var onChange = _ref.onChange,
-      containerProps = _ref.containerProps,
-      currentPage = _ref.currentPage,
-      totalPages = _ref.totalPages,
-      separator = _ref.separator,
-      otherProps = _objectWithoutProperties__default['default'](_ref, _excluded);
-
-  var safeTotal = components_utils.cleanPage(totalPages);
-  var ref = React.useRef(null);
-
-  var _convertPropToCssClas = dsClassnames.convertPropToCssClassName('page-number', className, {
-    disabled: disabled
-  }),
-      cssClassName = _convertPropToCssClas.cssClassName,
-      classNameElement = _convertPropToCssClas.classNameElement;
-
-  var _useState = React.useState(components_utils.cleanPage(currentPage) || 1),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      page = _useState2[0],
-      setPage = _useState2[1];
-
-  var _useState3 = React.useState(null),
-      _useState4 = _slicedToArray__default['default'](_useState3, 2),
-      size = _useState4[0],
-      setSize = _useState4[1];
-
-  React.useEffect(function () {
-    var _ref$current$getBound = ref.current.getBoundingClientRect(),
-        width = _ref$current$getBound.width;
-
-    var calculatedWidth = components_utils.lengthToSize(width, page);
+var _ChevronSmallUp, _ChevronSmallDown;
+
+const _excluded = ["className", "disabled", "value", "onChange", "containerProps", "currentPage", "totalPages", "separator"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const blockName = 'page-number-block';
+const PageNumberInputContainer = dsClassnames.aggregatedClasses(DSInputGroup__default["default"])(blockName);
+
+const DSPageNumber = _ref => {
+  let {
+    className,
+    disabled,
+    value,
+    onChange,
+    containerProps,
+    currentPage,
+    totalPages,
+    separator
+  } = _ref,
+      otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+  const safeTotal = utils.cleanPage(totalPages);
+  const ref = react.useRef(null);
+  const {
+    cssClassName,
+    classNameElement
+  } = dsClassnames.convertPropToCssClassName('page-number', className, {
+    disabled
+  });
+  const [page, setPage] = react.useState(utils.cleanPage(currentPage) || 1);
+  const [size, setSize] = react.useState(null);
+  react.useEffect(() => {
+    const {
+      width
+    } = ref.current.getBoundingClientRect();
+    const calculatedWidth = utils.lengthToSize(width, page);
     setSize(calculatedWidth);
   }, [page, safeTotal]);
 
   function handleUpdateInput(e) {
-    var newValue = components_utils.cleanPage(e.target.value);
+    const newValue = utils.cleanPage(e.target.value);
     if (newValue > safeTotal || newValue === 0) return;
     setPage(newValue);
     onChange(newValue);
   }
 
   function handleIncrease() {
-    var newValue = page ? parseInt(page, 10) + 1 : 1;
+    const newValue = page ? parseInt(page, 10) + 1 : 1;
     if (newValue > safeTotal) return;
     setPage(newValue);
     onChange(newValue);
   }
 
   function handleDecrease() {
-    var newValue = page ? parseInt(page, 10) - 1 : 1;
+    const newValue = page ? parseInt(page, 10) - 1 : 1;
     if (newValue < 1) return;
     setPage(newValue);
     onChange(newValue);
   }
 
-  return /*#__PURE__*/React__default['default'].createElement("div", _extends__default['default']({
+  return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread(_objectSpread({
     "data-testid": "ds-page-number",
-    className: "".concat(cssClassName)
-  }, containerProps, otherProps), /*#__PURE__*/React__default['default'].createElement(PageNumberInputContainer, null, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(classNameElement('pages'))
-  }, /*#__PURE__*/React__default['default'].createElement(DSInput__default['default'], {
-    className: "".concat(classNameElement('input')),
-    "data-testid": "page-number__current-page",
-    onChange: handleUpdateInput,
-    style: {
-      width: "".concat(size, "px")
-    },
-    value: page
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(classNameElement('separator'))
-  }, separator), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(classNameElement('total')),
-    "data-testid": "page-number__total-pages"
-  }, totalPages), /*#__PURE__*/React__default['default'].createElement("div", {
-    ref: ref,
-    className: "".concat(classNameElement('ref'))
-  })), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(classNameElement('limiter'))
-  }), /*#__PURE__*/React__default['default'].createElement(DSButton__default['default'], {
-    "aria-label": "dropdown-indicator",
-    buttonType: "text",
-    className: "dropdown-indicator",
-    "data-testid": "page-number__increase",
-    icon: /*#__PURE__*/React__default['default'].createElement(ChevronSmallUp__default['default'], null),
-    onClick: handleIncrease
-  }), /*#__PURE__*/React__default['default'].createElement(DSButton__default['default'], {
-    "aria-label": "dropdown-indicator",
-    buttonType: "text",
-    className: "dropdown-indicator",
-    "data-testid": "page-number__decrease",
-    icon: /*#__PURE__*/React__default['default'].createElement(ChevronSmallDown__default['default'], null),
-    onClick: handleDecrease
-  })));
+    className: `${cssClassName}`
+  }, containerProps), otherProps), {}, {
+    children: /*#__PURE__*/_jsx__default["default"](PageNumberInputContainer, {}, void 0, /*#__PURE__*/_jsx__default["default"]("div", {
+      className: `${classNameElement('pages')}`
+    }, void 0, /*#__PURE__*/_jsx__default["default"](DSInput__default["default"], {
+      className: `${classNameElement('input')}`,
+      "data-testid": "page-number__current-page",
+      onChange: handleUpdateInput,
+      style: {
+        width: `${size}px`
+      },
+      value: page
+    }), /*#__PURE__*/_jsx__default["default"]("div", {
+      className: `${classNameElement('separator')}`
+    }, void 0, separator), /*#__PURE__*/_jsx__default["default"]("div", {
+      className: `${classNameElement('total')}`,
+      "data-testid": "page-number__total-pages"
+    }, void 0, totalPages), /*#__PURE__*/jsxRuntime.jsx("div", {
+      ref: ref,
+      className: `${classNameElement('ref')}`
+    })), /*#__PURE__*/_jsx__default["default"]("div", {
+      className: `${classNameElement('limiter')}`
+    }), /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+      "aria-label": "dropdown-indicator",
+      buttonType: "text",
+      className: "dropdown-indicator",
+      "data-testid": "page-number__increase",
+      icon: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](ChevronSmallUp__default["default"], {})),
+      onClick: handleIncrease
+    }), /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+      "aria-label": "dropdown-indicator",
+      buttonType: "text",
+      className: "dropdown-indicator",
+      "data-testid": "page-number__decrease",
+      icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](ChevronSmallDown__default["default"], {})),
+      onClick: handleDecrease
+    }))
+  }));
 };
 
-var pageNumberProps = {
+const pageNumberProps = {
   className: reactDesc.PropTypes.string.description('html class attribute'),
   containerProps: reactDesc.PropTypes.object.description('Set of Properties attached to the main container'),
   disabled: reactDesc.PropTypes.bool.description('Whether the component is disabled or not').defaultValue(false),
@@ -140,15 +141,12 @@ var pageNumberProps = {
   totalPages: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.number]).description('Amount of pages').defaultValue(1),
   separator: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.number]).description('Separator between current page and total pages').defaultValue('/')
 };
-DSPageNumber.propTypes = pageNumberProps;
-var PageNumberWithSchema = reactDesc.describe(DSPageNumber);
+const PageNumberWithSchema = reactDesc.describe(DSPageNumber);
 PageNumberWithSchema.propTypes = pageNumberProps;
 DSPageNumber.defaultProps = {
   className: '',
   disabled: false,
-  onChange: function onChange() {
-    return null;
-  },
+  onChange: () => null,
   containerProps: {},
   value: undefined,
   currentPage: undefined,
@@ -158,5 +156,4 @@ DSPageNumber.defaultProps = {
 
 exports.DSPageNumber = DSPageNumber;
 exports.PageNumberWithSchema = PageNumberWithSchema;
-exports['default'] = DSPageNumber;
-//# sourceMappingURL=DSPageNumber.js.map
+exports["default"] = DSPageNumber;

package/cjs/DSPageNumber.test.js

@@ -0,0 +1,48 @@
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+require('@testing-library/jest-dom/extend-expect');
+var react = require('@testing-library/react');
+var DSPageNumber = require('./DSPageNumber.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+var _PageNumber, _PageNumber2, _PageNumber3;
+test('Increases page number ', async () => {
+  const {
+    queryByTestId
+  } = react.render(_PageNumber || (_PageNumber = /*#__PURE__*/_jsx__default["default"](DSPageNumber.DSPageNumber, {
+    totalPages: 3
+  })));
+  const increaseButton = queryByTestId('page-number__increase');
+  const currentPage = queryByTestId('page-number__current-page');
+  react.fireEvent.click(increaseButton);
+  expect(currentPage).toHaveValue('2');
+});
+test('Decreases page number ', async () => {
+  const {
+    queryByTestId
+  } = react.render(_PageNumber2 || (_PageNumber2 = /*#__PURE__*/_jsx__default["default"](DSPageNumber.DSPageNumber, {
+    currentPage: 2,
+    totalPages: 3
+  })));
+  const decreaseButton = queryByTestId('page-number__decrease');
+  const currentPage = queryByTestId('page-number__current-page');
+  react.fireEvent.click(decreaseButton);
+  expect(currentPage).toHaveValue('1');
+});
+test('Increases page number until last page number', async () => {
+  const {
+    queryByTestId
+  } = react.render(_PageNumber3 || (_PageNumber3 = /*#__PURE__*/_jsx__default["default"](DSPageNumber.DSPageNumber, {
+    currentPage: 2,
+    totalPages: 3
+  })));
+  const increaseButton = queryByTestId('page-number__increase');
+  const currentPage = queryByTestId('page-number__current-page');
+  react.fireEvent.click(increaseButton);
+  expect(currentPage).toHaveValue('3');
+});

package/cjs/components/utils.js

@@ -2,14 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var lengthToSize = function lengthToSize(referenceWidth, value) {
-  return referenceWidth + referenceWidth / 7 * String(value).length;
-};
-var cleanPage = function cleanPage(value) {
+require('core-js/modules/es.string.replace.js');
+
+const lengthToSize = (referenceWidth, value) => referenceWidth + referenceWidth / 7 * String(value).length;
+const cleanPage = value => {
   if (!value || value === '' || isNaN(parseInt(value))) return '';
   return parseInt(String(value || 1).replace(/\D/g, ''), 10);
 };
 
 exports.cleanPage = cleanPage;
 exports.lengthToSize = lengthToSize;
-//# sourceMappingURL=utils.js.map

package/cjs/index.js

@@ -3,22 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var DSPageNumber = require('./DSPageNumber.js');
-require('@babel/runtime/helpers/extends');
-require('@babel/runtime/helpers/slicedToArray');
-require('@babel/runtime/helpers/objectWithoutProperties');
-require('react');
-require('react-desc');
-require('@elliemae/ds-classnames');
-require('@elliemae/ds-icons/ChevronSmallDown');
-require('@elliemae/ds-icons/ChevronSmallUp');
-require('@elliemae/ds-button');
-require('@elliemae/ds-form/InputGroup');
-require('@elliemae/ds-form/Input');
-require('./components/utils.js');
 
 
 
 exports.DSPageNumber = DSPageNumber.DSPageNumber;
 exports.PageNumberWithSchema = DSPageNumber.PageNumberWithSchema;
-exports.default = DSPageNumber.DSPageNumber;
-//# sourceMappingURL=index.js.map
+exports["default"] = DSPageNumber.DSPageNumber;

package/cjs/package.json

@@ -0,0 +1,7 @@
+{
+  "type": "commonjs",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ]
+}

package/esm/DSPageNumber.js

@@ -1,7 +1,7 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import React, { useRef, useState, useEffect } from 'react';
+import { useRef, useState, useEffect } from 'react';
 import { PropTypes, describe } from 'react-desc';
 import { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';
 import ChevronSmallDown from '@elliemae/ds-icons/ChevronSmallDown';
@@ -10,111 +10,113 @@ import DSButton from '@elliemae/ds-button';
 import DSInputGroup from '@elliemae/ds-form/InputGroup';
 import DSInput from '@elliemae/ds-form/Input';
 import { cleanPage, lengthToSize } from './components/utils.js';
+import { jsx } from 'react/jsx-runtime';
 
-var _excluded = ["className", "disabled", "value", "onChange", "containerProps", "currentPage", "totalPages", "separator"];
-var blockName = 'page-number-block';
-var PageNumberInputContainer = aggregatedClasses(DSInputGroup)(blockName);
+var _ChevronSmallUp, _ChevronSmallDown;
 
-var DSPageNumber = function DSPageNumber(_ref) {
-  var className = _ref.className,
-      disabled = _ref.disabled;
-      _ref.value;
-      var onChange = _ref.onChange,
-      containerProps = _ref.containerProps,
-      currentPage = _ref.currentPage,
-      totalPages = _ref.totalPages,
-      separator = _ref.separator,
-      otherProps = _objectWithoutProperties(_ref, _excluded);
-
-  var safeTotal = cleanPage(totalPages);
-  var ref = useRef(null);
+const _excluded = ["className", "disabled", "value", "onChange", "containerProps", "currentPage", "totalPages", "separator"];
 
-  var _convertPropToCssClas = convertPropToCssClassName('page-number', className, {
-    disabled: disabled
-  }),
-      cssClassName = _convertPropToCssClas.cssClassName,
-      classNameElement = _convertPropToCssClas.classNameElement;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  var _useState = useState(cleanPage(currentPage) || 1),
-      _useState2 = _slicedToArray(_useState, 2),
-      page = _useState2[0],
-      setPage = _useState2[1];
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const blockName = 'page-number-block';
+const PageNumberInputContainer = aggregatedClasses(DSInputGroup)(blockName);
 
-  var _useState3 = useState(null),
-      _useState4 = _slicedToArray(_useState3, 2),
-      size = _useState4[0],
-      setSize = _useState4[1];
-
-  useEffect(function () {
-    var _ref$current$getBound = ref.current.getBoundingClientRect(),
-        width = _ref$current$getBound.width;
+const DSPageNumber = _ref => {
+  let {
+    className,
+    disabled,
+    value,
+    onChange,
+    containerProps,
+    currentPage,
+    totalPages,
+    separator
+  } = _ref,
+      otherProps = _objectWithoutProperties(_ref, _excluded);
 
-    var calculatedWidth = lengthToSize(width, page);
+  const safeTotal = cleanPage(totalPages);
+  const ref = useRef(null);
+  const {
+    cssClassName,
+    classNameElement
+  } = convertPropToCssClassName('page-number', className, {
+    disabled
+  });
+  const [page, setPage] = useState(cleanPage(currentPage) || 1);
+  const [size, setSize] = useState(null);
+  useEffect(() => {
+    const {
+      width
+    } = ref.current.getBoundingClientRect();
+    const calculatedWidth = lengthToSize(width, page);
     setSize(calculatedWidth);
   }, [page, safeTotal]);
 
   function handleUpdateInput(e) {
-    var newValue = cleanPage(e.target.value);
+    const newValue = cleanPage(e.target.value);
     if (newValue > safeTotal || newValue === 0) return;
     setPage(newValue);
     onChange(newValue);
   }
 
   function handleIncrease() {
-    var newValue = page ? parseInt(page, 10) + 1 : 1;
+    const newValue = page ? parseInt(page, 10) + 1 : 1;
     if (newValue > safeTotal) return;
     setPage(newValue);
     onChange(newValue);
   }
 
   function handleDecrease() {
-    var newValue = page ? parseInt(page, 10) - 1 : 1;
+    const newValue = page ? parseInt(page, 10) - 1 : 1;
     if (newValue < 1) return;
     setPage(newValue);
     onChange(newValue);
   }
 
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread(_objectSpread({
     "data-testid": "ds-page-number",
-    className: "".concat(cssClassName)
-  }, containerProps, otherProps), /*#__PURE__*/React.createElement(PageNumberInputContainer, null, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classNameElement('pages'))
-  }, /*#__PURE__*/React.createElement(DSInput, {
-    className: "".concat(classNameElement('input')),
-    "data-testid": "page-number__current-page",
-    onChange: handleUpdateInput,
-    style: {
-      width: "".concat(size, "px")
-    },
-    value: page
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classNameElement('separator'))
-  }, separator), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classNameElement('total')),
-    "data-testid": "page-number__total-pages"
-  }, totalPages), /*#__PURE__*/React.createElement("div", {
-    ref: ref,
-    className: "".concat(classNameElement('ref'))
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classNameElement('limiter'))
-  }), /*#__PURE__*/React.createElement(DSButton, {
-    "aria-label": "dropdown-indicator",
-    buttonType: "text",
-    className: "dropdown-indicator",
-    "data-testid": "page-number__increase",
-    icon: /*#__PURE__*/React.createElement(ChevronSmallUp, null),
-    onClick: handleIncrease
-  }), /*#__PURE__*/React.createElement(DSButton, {
-    "aria-label": "dropdown-indicator",
-    buttonType: "text",
-    className: "dropdown-indicator",
-    "data-testid": "page-number__decrease",
-    icon: /*#__PURE__*/React.createElement(ChevronSmallDown, null),
-    onClick: handleDecrease
-  })));
+    className: `${cssClassName}`
+  }, containerProps), otherProps), {}, {
+    children: /*#__PURE__*/_jsx(PageNumberInputContainer, {}, void 0, /*#__PURE__*/_jsx("div", {
+      className: `${classNameElement('pages')}`
+    }, void 0, /*#__PURE__*/_jsx(DSInput, {
+      className: `${classNameElement('input')}`,
+      "data-testid": "page-number__current-page",
+      onChange: handleUpdateInput,
+      style: {
+        width: `${size}px`
+      },
+      value: page
+    }), /*#__PURE__*/_jsx("div", {
+      className: `${classNameElement('separator')}`
+    }, void 0, separator), /*#__PURE__*/_jsx("div", {
+      className: `${classNameElement('total')}`,
+      "data-testid": "page-number__total-pages"
+    }, void 0, totalPages), /*#__PURE__*/jsx("div", {
+      ref: ref,
+      className: `${classNameElement('ref')}`
+    })), /*#__PURE__*/_jsx("div", {
+      className: `${classNameElement('limiter')}`
+    }), /*#__PURE__*/_jsx(DSButton, {
+      "aria-label": "dropdown-indicator",
+      buttonType: "text",
+      className: "dropdown-indicator",
+      "data-testid": "page-number__increase",
+      icon: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {})),
+      onClick: handleIncrease
+    }), /*#__PURE__*/_jsx(DSButton, {
+      "aria-label": "dropdown-indicator",
+      buttonType: "text",
+      className: "dropdown-indicator",
+      "data-testid": "page-number__decrease",
+      icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})),
+      onClick: handleDecrease
+    }))
+  }));
 };
 
-var pageNumberProps = {
+const pageNumberProps = {
   className: PropTypes.string.description('html class attribute'),
   containerProps: PropTypes.object.description('Set of Properties attached to the main container'),
   disabled: PropTypes.bool.description('Whether the component is disabled or not').defaultValue(false),
@@ -124,15 +126,12 @@ var pageNumberProps = {
   totalPages: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Amount of pages').defaultValue(1),
   separator: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Separator between current page and total pages').defaultValue('/')
 };
-DSPageNumber.propTypes = pageNumberProps;
-var PageNumberWithSchema = describe(DSPageNumber);
+const PageNumberWithSchema = describe(DSPageNumber);
 PageNumberWithSchema.propTypes = pageNumberProps;
 DSPageNumber.defaultProps = {
   className: '',
   disabled: false,
-  onChange: function onChange() {
-    return null;
-  },
+  onChange: () => null,
   containerProps: {},
   value: undefined,
   currentPage: undefined,
@@ -141,4 +140,3 @@ DSPageNumber.defaultProps = {
 };
 
 export { DSPageNumber, PageNumberWithSchema, DSPageNumber as default };
-//# sourceMappingURL=DSPageNumber.js.map

package/esm/DSPageNumber.test.js

@@ -0,0 +1,42 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
+import '@testing-library/jest-dom/extend-expect';
+import { render, fireEvent } from '@testing-library/react';
+import { DSPageNumber } from './DSPageNumber.js';
+
+var _PageNumber, _PageNumber2, _PageNumber3;
+test('Increases page number ', async () => {
+  const {
+    queryByTestId
+  } = render(_PageNumber || (_PageNumber = /*#__PURE__*/_jsx(DSPageNumber, {
+    totalPages: 3
+  })));
+  const increaseButton = queryByTestId('page-number__increase');
+  const currentPage = queryByTestId('page-number__current-page');
+  fireEvent.click(increaseButton);
+  expect(currentPage).toHaveValue('2');
+});
+test('Decreases page number ', async () => {
+  const {
+    queryByTestId
+  } = render(_PageNumber2 || (_PageNumber2 = /*#__PURE__*/_jsx(DSPageNumber, {
+    currentPage: 2,
+    totalPages: 3
+  })));
+  const decreaseButton = queryByTestId('page-number__decrease');
+  const currentPage = queryByTestId('page-number__current-page');
+  fireEvent.click(decreaseButton);
+  expect(currentPage).toHaveValue('1');
+});
+test('Increases page number until last page number', async () => {
+  const {
+    queryByTestId
+  } = render(_PageNumber3 || (_PageNumber3 = /*#__PURE__*/_jsx(DSPageNumber, {
+    currentPage: 2,
+    totalPages: 3
+  })));
+  const increaseButton = queryByTestId('page-number__increase');
+  const currentPage = queryByTestId('page-number__current-page');
+  fireEvent.click(increaseButton);
+  expect(currentPage).toHaveValue('3');
+});

package/esm/components/utils.js

@@ -1,10 +1,9 @@
-var lengthToSize = function lengthToSize(referenceWidth, value) {
-  return referenceWidth + referenceWidth / 7 * String(value).length;
-};
-var cleanPage = function cleanPage(value) {
+import 'core-js/modules/es.string.replace.js';
+
+const lengthToSize = (referenceWidth, value) => referenceWidth + referenceWidth / 7 * String(value).length;
+const cleanPage = value => {
   if (!value || value === '' || isNaN(parseInt(value))) return '';
   return parseInt(String(value || 1).replace(/\D/g, ''), 10);
 };
 
 export { cleanPage, lengthToSize };
-//# sourceMappingURL=utils.js.map

package/esm/index.js

@@ -1,14 +1 @@
 export { DSPageNumber, PageNumberWithSchema, DSPageNumber as default } from './DSPageNumber.js';
-import '@babel/runtime/helpers/esm/extends';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import '@babel/runtime/helpers/esm/objectWithoutProperties';
-import 'react';
-import 'react-desc';
-import '@elliemae/ds-classnames';
-import '@elliemae/ds-icons/ChevronSmallDown';
-import '@elliemae/ds-icons/ChevronSmallUp';
-import '@elliemae/ds-button';
-import '@elliemae/ds-form/InputGroup';
-import '@elliemae/ds-form/Input';
-import './components/utils.js';
-//# sourceMappingURL=index.js.map

package/esm/package.json

@@ -0,0 +1,7 @@
+{
+  "type": "module",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ]
+}

package/package.json

@@ -1,14 +1,38 @@
 {
   "name": "@elliemae/ds-page-number",
-  "version": "1.55.0-next.7",
+  "version": "2.0.0-alpha.10",
   "license": "MIT",
-  "description": "Ellie Mae - Dim Sum - Page Number",
-  "module": "esm/index.js",
-  "main": "cjs/index.js",
+  "description": "ICE MT - Dimsum - Page Number",
+  "module": "./esm/index.js",
+  "main": "./cjs/index.js",
+  "types": "./types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./esm/index.js",
+      "require": "./cjs/index.js"
+    },
+    "./DSPageNumber": {
+      "import": "./esm/DSPageNumber.js",
+      "require": "./cjs/DSPageNumber.js"
+    },
+    "./components/utils": {
+      "import": "./esm/components/utils.js",
+      "require": "./cjs/components/utils.js"
+    }
+  },
   "sideEffects": [
     "*.css",
     "*.scss"
   ],
+  "repository": {
+    "type": "git",
+    "url": "https://git.elliemae.io/platform-ui/dimsum.git"
+  },
+  "engines": {
+    "npm": ">=7",
+    "node": ">=14"
+  },
+  "author": "ICE MT",
   "scripts": {
     "dev": "cross-env NODE_ENV=development && node ../../scripts/build/build.js -w",
     "prebuild": "exit 0",
@@ -16,23 +40,24 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "1.55.0-next.7",
-    "@elliemae/ds-classnames": "1.55.0-next.7",
-    "@elliemae/ds-form": "1.55.0-next.7",
-    "@elliemae/ds-icons": "1.55.0-next.7",
-    "react-desc": "^4.1.2"
+    "@elliemae/ds-button": "2.0.0-alpha.10",
+    "@elliemae/ds-classnames": "2.0.0-alpha.10",
+    "@elliemae/ds-form": "2.0.0-alpha.10",
+    "@elliemae/ds-icons": "2.0.0-alpha.10",
+    "react-desc": "~4.1.3"
   },
   "devDependencies": {
-    "styled-components": "~5.3.0"
+    "styled-components": "~5.3.1"
   },
   "peerDependencies": {
-    "lodash": "^4.17.20",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
-    "styled-components": "^5.3.0"
+    "lodash": "^4.17.21",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "styled-components": "^5.3.1"
   },
   "publishConfig": {
     "access": "public",
-    "directory": "dist"
+    "directory": "dist",
+    "generateSubmodules": true
   }
 }

package/types/DSPageNumber.d.ts

@@ -0,0 +1,37 @@
+/// <reference types="react" />
+declare const DSPageNumber: {
+    ({ className, disabled, value, onChange, containerProps, currentPage, totalPages, separator, ...otherProps }: {
+        [x: string]: any;
+        className: any;
+        disabled: any;
+        value: any;
+        onChange: any;
+        containerProps: any;
+        currentPage: any;
+        totalPages: any;
+        separator: any;
+    }): JSX.Element;
+    propTypes: {
+        className: any;
+        containerProps: any;
+        disabled: any;
+        value: any;
+        onChange: any;
+        currentPage: any;
+        totalPages: any;
+        separator: any;
+    };
+    defaultProps: {
+        className: string;
+        disabled: boolean;
+        onChange: () => null;
+        containerProps: {};
+        value: undefined;
+        currentPage: undefined;
+        totalPages: number;
+        separator: string;
+    };
+};
+declare const PageNumberWithSchema: any;
+export { DSPageNumber, PageNumberWithSchema };
+export default DSPageNumber;

package/types/DSPageNumber.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/utils.d.ts

@@ -0,0 +1,2 @@
+export declare const lengthToSize: (referenceWidth: any, value: any) => any;
+export declare const cleanPage: (value: any) => number | "";

package/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DSPageNumber';
+export { default } from './DSPageNumber';

package/DSPageNumber/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@elliemae/ds-page-number/DSPageNumber",
-  "sideEffects": [
-    "*.css",
-    "*.scss"
-  ],
-  "private": true,
-  "main": "../cjs/DSPageNumber.js",
-  "module": "../esm/DSPageNumber.js"
-}

package/cjs/DSPageNumber.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DSPageNumber.js","sources":["../../src/DSPageNumber.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React, { useState, useRef, useEffect } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport {\n  aggregatedClasses,\n  convertPropToCssClassName,\n} from '@elliemae/ds-classnames';\nimport ChevronSmallDown from '@elliemae/ds-icons/ChevronSmallDown';\nimport ChevronSmallUp from '@elliemae/ds-icons/ChevronSmallUp';\nimport DSButton from '@elliemae/ds-button';\nimport DSInputGroup from '@elliemae/ds-form/InputGroup';\nimport DSInput from '@elliemae/ds-form/Input';\nimport { lengthToSize, cleanPage } from './components/utils';\n\nconst blockName = 'page-number-block';\nconst PageNumberInputContainer = aggregatedClasses(DSInputGroup)(blockName);\n\nconst DSPageNumber = ({\n  className,\n  disabled,\n  value,\n  onChange,\n  containerProps,\n  currentPage,\n  totalPages,\n  separator,\n  ...otherProps\n}) => {\n  const safeTotal = cleanPage(totalPages);\n  const ref = useRef(null);\n  const { cssClassName, classNameElement } = convertPropToCssClassName(\n    'page-number',\n    className,\n    {\n      disabled,\n    },\n  );\n  const [page, setPage] = useState(cleanPage(currentPage) || 1);\n  const [size, setSize] = useState(null);\n  useEffect(() => {\n    const { width } = ref.current.getBoundingClientRect();\n    const calculatedWidth = lengthToSize(width, page);\n    setSize(calculatedWidth);\n  }, [page, safeTotal]);\n\n  function handleUpdateInput(e) {\n    const newValue = cleanPage(e.target.value);\n    if (newValue > safeTotal || newValue === 0) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n  function handleIncrease() {\n    const newValue = page ? parseInt(page, 10) + 1 : 1;\n    if (newValue > safeTotal) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n  function handleDecrease() {\n    const newValue = page ? parseInt(page, 10) - 1 : 1;\n    if (newValue < 1) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <div\n      data-testid=\"ds-page-number\"\n      className={`${cssClassName}`}\n      {...containerProps}\n      {...otherProps}\n    >\n      <PageNumberInputContainer>\n        <div className={`${classNameElement('pages')}`}>\n          <DSInput\n            className={`${classNameElement('input')}`}\n            data-testid=\"page-number__current-page\"\n            onChange={handleUpdateInput}\n            style={{\n              width: `${size}px`,\n            }}\n            value={page}\n          />\n          <div className={`${classNameElement('separator')}`}>{separator}</div>\n          <div\n            className={`${classNameElement('total')}`}\n            data-testid=\"page-number__total-pages\"\n          >\n            {totalPages}\n          </div>\n          <div ref={ref} className={`${classNameElement('ref')}`} />\n        </div>\n        <div className={`${classNameElement('limiter')}`} />\n        <DSButton\n          aria-label=\"dropdown-indicator\"\n          buttonType=\"text\"\n          className=\"dropdown-indicator\"\n          data-testid=\"page-number__increase\"\n          icon={<ChevronSmallUp />}\n          onClick={handleIncrease}\n        />\n        <DSButton\n          aria-label=\"dropdown-indicator\"\n          buttonType=\"text\"\n          className=\"dropdown-indicator\"\n          data-testid=\"page-number__decrease\"\n          icon={<ChevronSmallDown />}\n          onClick={handleDecrease}\n        />\n      </PageNumberInputContainer>\n    </div>\n  );\n};\n\nconst pageNumberProps = {\n  className: PropTypes.string.description('html class attribute'),\n  containerProps: PropTypes.object.description(\n    'Set of Properties attached to the main container',\n  ),\n  disabled: PropTypes.bool\n    .description('Whether the component is disabled or not')\n    .defaultValue(false),\n  value: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n    PropTypes.object,\n  ]).description('page number value'),\n  onChange: PropTypes.func.description(\n    'function executed when the page number changes',\n  ),\n  currentPage: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n  ]).description('Value of the current page'),\n  totalPages: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n    .description('Amount of pages')\n    .defaultValue(1),\n  separator: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n    .description('Separator between current page and total pages')\n    .defaultValue('/'),\n};\n\nDSPageNumber.propTypes = pageNumberProps;\n\nconst PageNumberWithSchema = describe(DSPageNumber);\nPageNumberWithSchema.propTypes = pageNumberProps;\n\nDSPageNumber.defaultProps = {\n  className: '',\n  disabled: false,\n  onChange: () => null,\n  containerProps: {},\n  value: undefined,\n  currentPage: undefined,\n  totalPages: 1,\n  separator: '/',\n};\n\nexport { DSPageNumber, PageNumberWithSchema };\nexport default DSPageNumber;\n"],"names":["blockName","PageNumberInputContainer","aggregatedClasses","DSInputGroup","DSPageNumber","className","disabled","value","onChange","containerProps","currentPage","totalPages","separator","otherProps","safeTotal","cleanPage","ref","useRef","convertPropToCssClassName","cssClassName","classNameElement","useState","page","setPage","size","setSize","useEffect","current","getBoundingClientRect","width","calculatedWidth","lengthToSize","handleUpdateInput","e","newValue","target","handleIncrease","parseInt","handleDecrease","React","DSInput","DSButton","ChevronSmallUp","ChevronSmallDown","pageNumberProps","PropTypes","string","description","object","bool","defaultValue","oneOfType","number","func","propTypes","PageNumberWithSchema","describe","defaultProps","undefined"],"mappings":"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"}

package/cjs/components/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/utils.tsx"],"sourcesContent":["export const lengthToSize = (referenceWidth, value) =>\n  referenceWidth + (referenceWidth / 7) * String(value).length;\n\nexport const cleanPage = value => {\n  if (!value || value === '' || isNaN(parseInt(value))) return '';\n  return parseInt(String(value || 1).replace(/\\D/g, ''), 10);\n};\n"],"names":["lengthToSize","referenceWidth","value","String","length","cleanPage","isNaN","parseInt","replace"],"mappings":";;;;IAAaA,YAAY,GAAG,SAAfA,YAAe,CAACC,cAAD,EAAiBC,KAAjB;AAAA,SAC1BD,cAAc,GAAIA,cAAc,GAAG,CAAlB,GAAuBE,MAAM,CAACD,KAAD,CAAN,CAAcE,MAD5B;AAAA;IAGfC,SAAS,GAAG,SAAZA,SAAY,CAAAH,KAAK,EAAI;AAChC,MAAI,CAACA,KAAD,IAAUA,KAAK,KAAK,EAApB,IAA0BI,KAAK,CAACC,QAAQ,CAACL,KAAD,CAAT,CAAnC,EAAsD,OAAO,EAAP;AACtD,SAAOK,QAAQ,CAACJ,MAAM,CAACD,KAAK,IAAI,CAAV,CAAN,CAAmBM,OAAnB,CAA2B,KAA3B,EAAkC,EAAlC,CAAD,EAAwC,EAAxC,CAAf;AACD;;;;;"}

package/cjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/components/utils/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@elliemae/ds-page-number/components/utils",
-  "sideEffects": [
-    "*.css",
-    "*.scss"
-  ],
-  "private": true,
-  "main": "../../cjs/components/utils.js",
-  "module": "../../esm/components/utils.js"
-}

package/esm/DSPageNumber.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DSPageNumber.js","sources":["../../src/DSPageNumber.tsx"],"sourcesContent":["/* eslint-disable max-lines */\nimport React, { useState, useRef, useEffect } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport {\n  aggregatedClasses,\n  convertPropToCssClassName,\n} from '@elliemae/ds-classnames';\nimport ChevronSmallDown from '@elliemae/ds-icons/ChevronSmallDown';\nimport ChevronSmallUp from '@elliemae/ds-icons/ChevronSmallUp';\nimport DSButton from '@elliemae/ds-button';\nimport DSInputGroup from '@elliemae/ds-form/InputGroup';\nimport DSInput from '@elliemae/ds-form/Input';\nimport { lengthToSize, cleanPage } from './components/utils';\n\nconst blockName = 'page-number-block';\nconst PageNumberInputContainer = aggregatedClasses(DSInputGroup)(blockName);\n\nconst DSPageNumber = ({\n  className,\n  disabled,\n  value,\n  onChange,\n  containerProps,\n  currentPage,\n  totalPages,\n  separator,\n  ...otherProps\n}) => {\n  const safeTotal = cleanPage(totalPages);\n  const ref = useRef(null);\n  const { cssClassName, classNameElement } = convertPropToCssClassName(\n    'page-number',\n    className,\n    {\n      disabled,\n    },\n  );\n  const [page, setPage] = useState(cleanPage(currentPage) || 1);\n  const [size, setSize] = useState(null);\n  useEffect(() => {\n    const { width } = ref.current.getBoundingClientRect();\n    const calculatedWidth = lengthToSize(width, page);\n    setSize(calculatedWidth);\n  }, [page, safeTotal]);\n\n  function handleUpdateInput(e) {\n    const newValue = cleanPage(e.target.value);\n    if (newValue > safeTotal || newValue === 0) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n  function handleIncrease() {\n    const newValue = page ? parseInt(page, 10) + 1 : 1;\n    if (newValue > safeTotal) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n  function handleDecrease() {\n    const newValue = page ? parseInt(page, 10) - 1 : 1;\n    if (newValue < 1) return;\n    setPage(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <div\n      data-testid=\"ds-page-number\"\n      className={`${cssClassName}`}\n      {...containerProps}\n      {...otherProps}\n    >\n      <PageNumberInputContainer>\n        <div className={`${classNameElement('pages')}`}>\n          <DSInput\n            className={`${classNameElement('input')}`}\n            data-testid=\"page-number__current-page\"\n            onChange={handleUpdateInput}\n            style={{\n              width: `${size}px`,\n            }}\n            value={page}\n          />\n          <div className={`${classNameElement('separator')}`}>{separator}</div>\n          <div\n            className={`${classNameElement('total')}`}\n            data-testid=\"page-number__total-pages\"\n          >\n            {totalPages}\n          </div>\n          <div ref={ref} className={`${classNameElement('ref')}`} />\n        </div>\n        <div className={`${classNameElement('limiter')}`} />\n        <DSButton\n          aria-label=\"dropdown-indicator\"\n          buttonType=\"text\"\n          className=\"dropdown-indicator\"\n          data-testid=\"page-number__increase\"\n          icon={<ChevronSmallUp />}\n          onClick={handleIncrease}\n        />\n        <DSButton\n          aria-label=\"dropdown-indicator\"\n          buttonType=\"text\"\n          className=\"dropdown-indicator\"\n          data-testid=\"page-number__decrease\"\n          icon={<ChevronSmallDown />}\n          onClick={handleDecrease}\n        />\n      </PageNumberInputContainer>\n    </div>\n  );\n};\n\nconst pageNumberProps = {\n  className: PropTypes.string.description('html class attribute'),\n  containerProps: PropTypes.object.description(\n    'Set of Properties attached to the main container',\n  ),\n  disabled: PropTypes.bool\n    .description('Whether the component is disabled or not')\n    .defaultValue(false),\n  value: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n    PropTypes.object,\n  ]).description('page number value'),\n  onChange: PropTypes.func.description(\n    'function executed when the page number changes',\n  ),\n  currentPage: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n  ]).description('Value of the current page'),\n  totalPages: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n    .description('Amount of pages')\n    .defaultValue(1),\n  separator: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n    .description('Separator between current page and total pages')\n    .defaultValue('/'),\n};\n\nDSPageNumber.propTypes = pageNumberProps;\n\nconst PageNumberWithSchema = describe(DSPageNumber);\nPageNumberWithSchema.propTypes = pageNumberProps;\n\nDSPageNumber.defaultProps = {\n  className: '',\n  disabled: false,\n  onChange: () => null,\n  containerProps: {},\n  value: undefined,\n  currentPage: undefined,\n  totalPages: 1,\n  separator: '/',\n};\n\nexport { DSPageNumber, PageNumberWithSchema };\nexport default DSPageNumber;\n"],"names":["blockName","PageNumberInputContainer","aggregatedClasses","DSInputGroup","DSPageNumber","className","disabled","value","onChange","containerProps","currentPage","totalPages","separator","otherProps","safeTotal","cleanPage","ref","useRef","convertPropToCssClassName","cssClassName","classNameElement","useState","page","setPage","size","setSize","useEffect","current","getBoundingClientRect","width","calculatedWidth","lengthToSize","handleUpdateInput","e","newValue","target","handleIncrease","parseInt","handleDecrease","pageNumberProps","PropTypes","string","description","object","bool","defaultValue","oneOfType","number","func","propTypes","PageNumberWithSchema","describe","defaultProps","undefined"],"mappings":"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"}

package/esm/components/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/utils.tsx"],"sourcesContent":["export const lengthToSize = (referenceWidth, value) =>\n  referenceWidth + (referenceWidth / 7) * String(value).length;\n\nexport const cleanPage = value => {\n  if (!value || value === '' || isNaN(parseInt(value))) return '';\n  return parseInt(String(value || 1).replace(/\\D/g, ''), 10);\n};\n"],"names":["lengthToSize","referenceWidth","value","String","length","cleanPage","isNaN","parseInt","replace"],"mappings":"IAAaA,YAAY,GAAG,SAAfA,YAAe,CAACC,cAAD,EAAiBC,KAAjB;AAAA,SAC1BD,cAAc,GAAIA,cAAc,GAAG,CAAlB,GAAuBE,MAAM,CAACD,KAAD,CAAN,CAAcE,MAD5B;AAAA;IAGfC,SAAS,GAAG,SAAZA,SAAY,CAAAH,KAAK,EAAI;AAChC,MAAI,CAACA,KAAD,IAAUA,KAAK,KAAK,EAApB,IAA0BI,KAAK,CAACC,QAAQ,CAACL,KAAD,CAAT,CAAnC,EAAsD,OAAO,EAAP;AACtD,SAAOK,QAAQ,CAACJ,MAAM,CAACD,KAAK,IAAI,CAAV,CAAN,CAAmBM,OAAnB,CAA2B,KAA3B,EAAkC,EAAlC,CAAD,EAAwC,EAAxC,CAAf;AACD;;;;"}

package/esm/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}