@decisiv/ui-components 2.0.1-alpha.21 → 2.0.1-alpha.210

package/lib/components/Notifications/Notifier.test.js

@@ -4,7 +4,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _react2 = require("@testing-library/react");
 
-var _ConfigProvider = require("../../providers/ConfigProvider");
+var _providers = require("../../providers");
 
 var _NotificationsPanel = _interopRequireDefault(require("./NotificationsPanel"));
 
@@ -12,6 +12,10 @@ var _Notifier = _interopRequireDefault(require("./Notifier"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+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 asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
@@ -22,12 +26,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 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; }
 
+var wrapper = function wrapper(_ref) {
+  var children = _ref.children;
+  return _react.default.createElement(_providers.ConfigProvider, null, _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_NotificationsPanel.default, null), children));
+};
+
 var render = function render(ui, options) {
   return (0, _react2.render)(ui, _objectSpread({}, options, {
-    wrapper: function wrapper(_ref) {
-      var children = _ref.children;
-      return _react.default.createElement(_ConfigProvider.ConfigProvider, null, _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_NotificationsPanel.default, null), children));
-    }
+    wrapper: wrapper
   }));
 };
 
@@ -70,7 +76,7 @@ describe('Notifier', function () {
 
               expect((0, _react2.queryAllByText)(baseElement, defaultProps.title)).toHaveLength(1);
 
-              _react2.fireEvent.click((0, _react2.queryByLabelText)(baseElement, /close/gi));
+              _react2.fireEvent.click((0, _react2.getByLabelText)(baseElement, /close/gi));
 
               _context.next = 7;
               return (0, _react2.wait)(function () {
@@ -96,18 +102,19 @@ describe('Notifier', function () {
   });
   describe('dispatching more than one notification', function () {
     it('renders a dismiss all button in the notifications panel', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
-      var buttonText, _render2, baseElement, getByText;
+      var buttonText, onClose, testProps, _render2, baseElement, getByText;
 
       return regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
               buttonText = 'notify';
+              onClose = defaultProps.onClose, testProps = _objectWithoutProperties(defaultProps, ["onClose"]);
               _render2 = render(_react.default.createElement(_Notifier.default, null, function (_ref5) {
                 var notify = _ref5.notify;
                 return _react.default.createElement("button", {
                   onClick: function onClick() {
-                    notify(defaultProps);
+                    notify(testProps);
                   },
                   type: "button"
                 }, buttonText);
@@ -125,7 +132,7 @@ describe('Notifier', function () {
 
               _react2.fireEvent.click((0, _react2.getByText)(baseElement, /dismiss all/gi));
 
-              _context2.next = 11;
+              _context2.next = 12;
               return (0, _react2.wait)(function () {
                 return expect((0, _react2.queryAllByText)(baseElement, defaultProps.title)).toHaveLength(0);
               },
@@ -139,12 +146,74 @@ describe('Notifier', function () {
                 timeout: 2750
               });
 
-            case 11:
+            case 12:
             case "end":
               return _context2.stop();
           }
         }
       }, _callee2);
     })));
+    it('fires onClose for each notification when clicking dismiss all', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+      var buttonText, onClose, _render3, baseElement, getByText, notifications;
+
+      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              buttonText = 'notify';
+              onClose = jest.fn();
+              jest.useFakeTimers();
+              _render3 = render(_react.default.createElement(_Notifier.default, null, function (_ref7) {
+                var notify = _ref7.notify;
+                return _react.default.createElement("button", {
+                  onClick: function onClick() {
+                    notify(_objectSpread({}, defaultProps, {
+                      onClose: onClose
+                    }));
+                  },
+                  type: "button"
+                }, buttonText);
+              })), baseElement = _render3.baseElement, getByText = _render3.getByText;
+              (0, _react2.act)(function () {
+                _react2.fireEvent.click(getByText(buttonText));
+
+                _react2.fireEvent.click(getByText(buttonText));
+
+                _react2.fireEvent.click(getByText(buttonText));
+
+                jest.runAllTimers();
+              });
+              notifications = (0, _react2.queryAllByText)(baseElement, defaultProps.title);
+              expect(notifications).toHaveLength(3);
+              (0, _react2.act)(function () {
+                _react2.fireEvent.click((0, _react2.getByText)(baseElement, /dismiss all/gi));
+              });
+              _context3.next = 10;
+              return (0, _react2.wait)(function () {
+                (0, _react2.act)(function () {
+                  return jest.runAllTimers();
+                });
+                expect((0, _react2.queryAllByText)(baseElement, defaultProps.title)).toHaveLength(0);
+              },
+              /**
+               * this timeout is important in checking that the notifications were dismissed via
+               * `dismissAll` instead of just timing out. If just timing out, the notifications would
+               * dismiss after 5.2 seconds. Selecting a timeout shorter than that verifies `dismissAll`
+               * was fired.
+               */
+              {
+                timeout: 2750
+              });
+
+            case 10:
+              expect(onClose).toHaveBeenCalledTimes(3);
+
+            case 11:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    })));
   });
 });

package/lib/components/Notifications/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const NOTIFICATION_CARD_WIDTH: string;
+//# sourceMappingURL=constants.d.ts.map

package/lib/components/Notifications/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/constants.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,uBAAuB,QAAyB,CAAC"}

package/lib/components/Notifications/constants.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NOTIFICATION_CARD_WIDTH = void 0;
+
+var _rem = _interopRequireDefault(require("polished/lib/helpers/rem"));
+
+var _spacing = _interopRequireDefault(require("@decisiv/design-tokens/lib/spacing"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// eslint-disable-next-line import/prefer-default-export
+var NOTIFICATION_CARD_WIDTH = (0, _rem.default)(_spacing.default.base * 34);
+exports.NOTIFICATION_CARD_WIDTH = NOTIFICATION_CARD_WIDTH;

package/lib/components/Notifications/schema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/schema.ts"],"names":[],"mappings":"AAKA,QAAA,MAAM,MAAM,KAA4C,CAAC;AAsDzD,eAAe,MAAM,CAAC"}
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/schema.ts"],"names":[],"mappings":"AAKA,QAAA,MAAM,MAAM,KAA4C,CAAC;AA0DzD,eAAe,MAAM,CAAC"}

package/lib/components/Notifications/schema.js

@@ -18,13 +18,14 @@ schema.propTypes = {
     onClick: _reactDesc.PropTypes.func.isRequired,
     text: _reactDesc.PropTypes.string.isRequired
   })).description('An array of objects containing a subset of props valid for the Button. Specifically excluded are `kind`, `size`, and `variant`.').isRequired,
+  duration: _reactDesc.PropTypes.number.description('An integer representing the amount of milliseconds to wait until dismissing the notification if no user interaction is captured. If omitted, notification will remain until manually closed.'),
   children: _reactDesc.PropTypes.func.description('The body of the notification containing additional UI elements').format('React Component'),
   closeHint: _reactDesc.PropTypes.string.description('The text to present in the tooltip when hovering over the close button.'),
   color: _reactDesc.PropTypes.oneOf(_commonUIColors.commonUIColorKeys).description('The icon/ border color. Will override the default color associated with any specified `intent`.').format('string'),
   icon: _reactDesc.PropTypes.element.description('The `iconix` icon to display. Will override the default icon associated with any specified `intent`.').format('Iconix Icon'),
   id: _reactDesc.PropTypes.string.description('A unique identifier for the notification.'),
   intent: _reactDesc.PropTypes.oneOf(['information', 'success', 'warning', 'danger']).description('Shortcuts to the most common combinations of icon and color.'),
-  onClose: _reactDesc.PropTypes.func.description('The event handler called to close the notification. WILL NOT be called if notification times out or is closed because an action button is clicked.'),
+  onClose: _reactDesc.PropTypes.func.description('The event handler called when the notification is manually closed. Will also be called with a blank event if "DISMISS ALL" is clicked. WILL NOT be called if notification times out or is closed because an action button is clicked. In IE, will be called with an empty object.'),
   title: _reactDesc.PropTypes.string.description('The text for rendering in the H2 at the top of the notification').isRequired
 };
 var _default = schema;

package/lib/components/Notifications/useNotifications.d.ts

@@ -1,6 +1,7 @@
 import { TNotificationsContext } from '../../providers/NotificationsProvider';
 export interface TUseNotifications {
     dismissAll: TNotificationsContext['dismissAll'];
+    isDismissingAll: TNotificationsContext['isDismissingAll'];
     notifications: TNotificationsContext['notifications'];
     notify: TNotificationsContext['notify'];
 }

package/lib/components/Notifications/useNotifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useNotifications.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/useNotifications.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,qBAAqB,EACtB,MAAM,uCAAuC,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAChC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAC;IAChD,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAC;IACtD,MAAM,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;CACzC;AAED,iBAAS,gBAAgB,IAAI,iBAAiB,CAI7C;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"useNotifications.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/useNotifications.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,qBAAqB,EACtB,MAAM,uCAAuC,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAChC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAC;IAChD,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAC;IACtD,MAAM,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;CACzC;AAED,iBAAS,gBAAgB,IAAI,iBAAiB,CAI7C;AAED,eAAe,gBAAgB,CAAC"}

package/lib/components/Notifications/useNotifications.test.js

@@ -19,11 +19,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 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; }
 
 jest.useFakeTimers();
+
+var wrapper = function wrapper(_ref) {
+  var children = _ref.children;
+  return _react.default.createElement(_NotificationsProvider.default, null, _react.default.createElement(_react.default.Fragment, null, children));
+};
+
 var defaultRenderHookOptions = {
-  wrapper: function wrapper(_ref) {
-    var children = _ref.children;
-    return _react.default.createElement(_NotificationsProvider.default, null, _react.default.createElement(_react.default.Fragment, null, children));
-  }
+  wrapper: wrapper
 };
 var defaultNotificationOptions = {
   id: 'test-0',

package/lib/components/Pagination/Pages.d.ts

@@ -1,10 +1,4 @@
 /// <reference types="react" />
-import { Page, PaginationVariant } from './types';
-export interface PagesProps {
-    variant?: PaginationVariant;
-    currentPage: number;
-    totalPages: number;
-    onPageChange: (page: Page) => void;
-}
+import { PagesProps } from './types';
 export default function Pages({ variant, currentPage, totalPages, onPageChange, }: PagesProps): JSX.Element;
 //# sourceMappingURL=Pages.d.ts.map

package/lib/components/Pagination/Pages.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pages.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pages.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAkBlD,MAAM,WAAW,UAAU;IACzB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,OAAO,EACP,WAAW,EACX,UAAU,EACV,YAAY,GACb,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAuB1B"}
+{"version":3,"file":"Pages.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pages.tsx"],"names":[],"mappings":";AAQA,OAAO,EAA2B,UAAU,EAAE,MAAM,SAAS,CAAC;AAoB9D,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,OAAO,EACP,WAAW,EACX,UAAU,EACV,YAAY,GACb,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAuC1B"}

package/lib/components/Pagination/Pages.js

@@ -17,6 +17,10 @@ var _PaginationItem = _interopRequireDefault(require("./PaginationItem"));
 
 var _paginate = _interopRequireDefault(require("./paginate"));
 
+var _Typography = require("../Typography");
+
+var _useTranslations = _interopRequireDefault(require("../../utils/useTranslations"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
@@ -37,6 +41,7 @@ function Pages(_ref2) {
       currentPage = _ref2.currentPage,
       totalPages = _ref2.totalPages,
       onPageChange = _ref2.onPageChange;
+  var translate = (0, _useTranslations.default)();
   var pages = (0, _react.useMemo)(function () {
     return (0, _paginate.default)(currentPage, totalPages);
   }, [currentPage, totalPages]); // for creating unique keys for the ellipses:
@@ -46,6 +51,18 @@ function Pages(_ref2) {
     variant: variant
   }, pages.map(function (page) {
     var key = page.ellipsis ? "ellipsis-".concat(ellipsisCount += 1) : "page-".concat(page.page);
+    var pageText = translate(undefined, 'pagination.page', {
+      page: "".concat(page.page)
+    }); // if its openEnded
+
+    if (!totalPages) {
+      return _react.default.createElement(_Typography.P, {
+        key: key,
+        shade: 1,
+        size: "small"
+      }, pageText);
+    }
+
     return _react.default.createElement(_PaginationItem.default, {
       page: page,
       key: key,

package/lib/components/Pagination/Pagination.d.ts

@@ -1,29 +1,28 @@
 /// <reference types="react" />
 import PropTypes from 'prop-types';
-import { PaginationVariant } from './types';
-interface DefaultPaginationProps {
-    variant: PaginationVariant;
-    defaultActivePage?: number;
-    activePage?: number;
-    onPageChange?: (newPage: number, oldPage: number) => void;
-    labelPrevious?: string;
-    labelNext?: string;
-}
-export interface PaginationProps extends DefaultPaginationProps {
-    totalPages: number;
-}
+import { PaginationProps } from './types';
 declare function Pagination(props: PaginationProps): JSX.Element | null;
 declare namespace Pagination {
     var propTypes: {
         variant: PropTypes.Requireable<string>;
+        openEnded: PropTypes.Requireable<boolean>;
         defaultActivePage: PropTypes.Requireable<number>;
         activePage: PropTypes.Requireable<number>;
-        totalPages: PropTypes.Validator<number>;
+        totalPages: PropTypes.Requireable<number>;
         onPageChange: PropTypes.Requireable<(...args: any[]) => any>;
         labelPrevious: PropTypes.Requireable<string>;
         labelNext: PropTypes.Requireable<string>;
     };
-    var defaultProps: DefaultPaginationProps;
+    var defaultProps: {
+        readonly variant: "comfortable";
+        readonly openEnded: false;
+        readonly hasNext: false;
+        readonly defaultActivePage: 1;
+        readonly activePage: undefined;
+        readonly onPageChange: undefined;
+        readonly labelPrevious: undefined;
+        readonly labelNext: undefined;
+    };
 }
 export default Pagination;
 //# sourceMappingURL=Pagination.d.ts.map

package/lib/components/Pagination/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,OAAO,EAAuB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGjE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,eAAgB,SAAQ,sBAAsB;IAC7D,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,iBAAwB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CA+E7E;kBA/EuB,UAAU;;;;;;;;;;;;eAAV,UAAU"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AAEA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,OAAO,EAA6B,eAAe,EAAE,MAAM,SAAS,CAAC;AAGrE,iBAAwB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAmG7E;kBAnGuB,UAAU;;;;;;;;;;;;;;;;;;;;;;eAAV,UAAU"}

package/lib/components/Pagination/Pagination.js

@@ -37,7 +37,6 @@ function Pagination(props) {
   var variant = props.variant,
       defaultActivePage = props.defaultActivePage,
       activePage = props.activePage,
-      totalPages = props.totalPages,
       onPageChange = props.onPageChange,
       labelPrevious = props.labelPrevious,
       labelNext = props.labelNext;
@@ -49,7 +48,16 @@ function Pagination(props) {
       currentPage = _useState2[0],
       setCurrentPage = _useState2[1];
 
-  if (totalPages <= 1) return null;
+  if (props.openEnded === false && !props.totalPages) {
+    // eslint-disable-next-line no-console
+    console.warn('totalPages prop must be defined when using a close-ended pagination');
+    return null;
+  }
+
+  if (props.openEnded === false && props.totalPages <= 1) {
+    return null;
+  }
+
   var activePageIsControlled = typeof activePage !== 'undefined';
 
   if (activePageIsControlled && activePage !== currentPage) {
@@ -59,9 +67,13 @@ function Pagination(props) {
   var prevPage = currentPage > 1 ? {
     page: currentPage - 1
   } : undefined;
-  var nextPage = currentPage < totalPages ? {
+  var openEndedNextPage = props.openEnded && props.hasNext ? {
+    page: currentPage + 1
+  } : undefined;
+  var fixedpaginationNextPage = props.openEnded === false && currentPage < props.totalPages ? {
     page: currentPage + 1
   } : undefined;
+  var nextPage = props.openEnded ? openEndedNextPage : fixedpaginationNextPage;
   var prevButtonAriaLabel = prevPage ? translate(labelPrevious, 'pagination.aria.previous', {
     page: "".concat(prevPage.page)
   }) : undefined;
@@ -94,7 +106,7 @@ function Pagination(props) {
   }), _react.default.createElement(_Pages.default, {
     variant: variant,
     currentPage: currentPage,
-    totalPages: totalPages,
+    totalPages: props.openEnded ? undefined : props.totalPages,
     onPageChange: pageChangeHandler
   }), _react.default.createElement(_NextPrevButton.default, {
     variant: variant,
@@ -109,15 +121,18 @@ function Pagination(props) {
 
 Pagination.propTypes = {
   variant: _propTypes.default.oneOf(['comfortable', 'compact']),
+  openEnded: _propTypes.default.bool,
   defaultActivePage: _propTypes.default.number,
   activePage: _propTypes.default.number,
-  totalPages: _propTypes.default.number.isRequired,
+  totalPages: _propTypes.default.number,
   onPageChange: _propTypes.default.func,
   labelPrevious: _propTypes.default.string,
   labelNext: _propTypes.default.string
 };
 var defaultProps = {
   variant: 'comfortable',
+  openEnded: false,
+  hasNext: false,
   defaultActivePage: 1,
   activePage: undefined,
   onPageChange: undefined,

package/lib/components/Pagination/Pagination.test.js

@@ -254,4 +254,18 @@ describe('Pagination', function () {
 
     expect(container).toBeEmpty();
   });
+  it('shows warning when totalPages is not defined and its not openEnded', function () {
+    jest.spyOn(console, 'warn').mockImplementation(function () {});
+
+    var _renderPagination18 = renderPagination(_objectSpread({}, defaultProps, {
+      openEnded: false,
+      totalPages: undefined
+    })),
+        container = _renderPagination18.container;
+
+    expect(container).toBeEmpty();
+    expect(console.warn).toHaveBeenCalled(); // @ts-ignore
+
+    console.warn.mockRestore();
+  });
 });

package/lib/components/Pagination/paginate.d.ts

@@ -1,3 +1,3 @@
 import { Page } from './types';
-export default function paginate(currentPage: number, totalPages: number): Page[];
+export default function paginate(currentPage: number, totalPages?: number): Page[];
 //# sourceMappingURL=paginate.d.ts.map

package/lib/components/Pagination/paginate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"paginate.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/paginate.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AA4C/B,MAAM,CAAC,OAAO,UAAU,QAAQ,CAC9B,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,GACjB,IAAI,EAAE,CA4CR"}
+{"version":3,"file":"paginate.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/paginate.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AA4C/B,MAAM,CAAC,OAAO,UAAU,QAAQ,CAC9B,WAAW,EAAE,MAAM,EACnB,UAAU,CAAC,EAAE,MAAM,GAClB,IAAI,EAAE,CAgDR"}

package/lib/components/Pagination/paginate.js

@@ -74,6 +74,10 @@ function paginate(currentPage, totalPages) {
     };
   };
 
+  if (!totalPages) {
+    return [currentPage].map(pageMaker);
+  }
+
   if (totalPages <= PAGE_SLOTS) {
     // no ellipses needed
     return (0, _range.default)(1, totalPages + 1).map(pageMaker);

package/lib/components/Pagination/paginate.test.js

@@ -42,10 +42,11 @@ var countEllipses = function countEllipses(pages) {
 };
 
 describe('paginate', function () {
-  describe('with 7 or less pages', function () {
+  // open ended pagination case
+  describe('with no total pages', function () {
     it('does not include any ellipses', function () {
       testAllPages({
-        maxTotal: 7
+        maxTotal: 1
       }, function (_ref2) {
         var pages = _ref2.pages;
         pages.forEach(function (page) {
@@ -53,20 +54,40 @@ describe('paginate', function () {
         });
       });
     });
-    it('renders only as many items as there are pages', function () {
+    it('only renders the current page', function () {
+      var result = (0, _paginate.default)(1, undefined);
+      expect(result).toEqual([{
+        active: true,
+        page: 1,
+        ellipsis: false
+      }]);
+    });
+  });
+  describe('with 7 or less pages', function () {
+    it('does not include any ellipses', function () {
       testAllPages({
         maxTotal: 7
       }, function (_ref3) {
-        var totalPages = _ref3.totalPages,
-            pages = _ref3.pages;
+        var pages = _ref3.pages;
+        pages.forEach(function (page) {
+          expect(page.ellipsis).toEqual(false);
+        });
+      });
+    });
+    it('renders only as many items as there are pages', function () {
+      testAllPages({
+        maxTotal: 7
+      }, function (_ref4) {
+        var totalPages = _ref4.totalPages,
+            pages = _ref4.pages;
         expect(pages.length).toEqual(totalPages);
       });
     });
   });
   describe('with 8 or more pages', function () {
-    function sharedTests(_ref4) {
-      var pages = _ref4.pages,
-          currentPage = _ref4.currentPage;
+    function sharedTests(_ref5) {
+      var pages = _ref5.pages,
+          currentPage = _ref5.currentPage;
       it('renders 7 items', function () {
         expect(pages).toHaveLength(7);
       });
@@ -88,9 +109,9 @@ describe('paginate', function () {
             lastCurrent: 4,
             minTotal: totalPages,
             maxTotal: totalPages
-          }, function (_ref5) {
-            var currentPage = _ref5.currentPage,
-                pages = _ref5.pages;
+          }, function (_ref6) {
+            var currentPage = _ref6.currentPage,
+                pages = _ref6.pages;
             describe("when on page ".concat(currentPage), function () {
               it("has one ellipsis at the end", function () {
                 expect(countEllipses(pages)).toEqual(1);
@@ -112,9 +133,9 @@ describe('paginate', function () {
               lastCurrent: rightBound - 1,
               minTotal: totalPages,
               maxTotal: totalPages
-            }, function (_ref6) {
-              var currentPage = _ref6.currentPage,
-                  pages = _ref6.pages;
+            }, function (_ref7) {
+              var currentPage = _ref7.currentPage,
+                  pages = _ref7.pages;
               describe("when on page ".concat(currentPage), function () {
                 it("has two ellipses", function () {
                   expect(countEllipses(pages)).toEqual(2);
@@ -136,9 +157,9 @@ describe('paginate', function () {
             firstCurrent: rightBound,
             minTotal: totalPages,
             maxTotal: totalPages
-          }, function (_ref7) {
-            var currentPage = _ref7.currentPage,
-                pages = _ref7.pages;
+          }, function (_ref8) {
+            var currentPage = _ref8.currentPage,
+                pages = _ref8.pages;
             describe("when on page ".concat(currentPage), function () {
               it("has one ellipsis at the start", function () {
                 expect(countEllipses(pages)).toEqual(1);

package/lib/components/Pagination/schema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/schema.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,MAAM,KAA0C,CAAC;AA0BvD,eAAe,MAAM,CAAC"}
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/schema.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,MAAM,KAA0C,CAAC;AAoCvD,eAAe,MAAM,CAAC"}

package/lib/components/Pagination/schema.js

@@ -15,7 +15,9 @@ schema.propTypes = {
   variant: _reactDesc.PropTypes.oneOf(['comfortable', 'compact']).description('Controls the padding size of the component').defaultValue('comfortable'),
   defaultActivePage: _reactDesc.PropTypes.number.description('When uncontrolled, specifies the default initially-active page').defaultValue('1'),
   activePage: _reactDesc.PropTypes.number.description('Sets the currently-active page. If specified, the component is "controlled".'),
-  totalPages: _reactDesc.PropTypes.number.isRequired.description('Sets the total number of pages'),
+  openEnded: _reactDesc.PropTypes.bool.description('Define if this is an open-ended pagination. Use hasNext to enable the next button').defaultValue('false'),
+  hasNext: _reactDesc.PropTypes.bool.description('Use with `openEnded` prop to define if the Next button is enabled').defaultValue('false'),
+  totalPages: _reactDesc.PropTypes.number.description('Sets the total number of pages. This is required when using a fixed pagination'),
   onPageChange: _reactDesc.PropTypes.func.description('A function called with two arguments (the newly-active page and the previously-active page) whenever the active page changes'),
   labelPrevious: _reactDesc.PropTypes.string.description('Override the "Previous" button label'),
   labelNext: _reactDesc.PropTypes.string.description('Override the "Next" button label')

package/lib/components/Pagination/types.d.ts

@@ -1,8 +1,31 @@
 export declare type PaginationVariant = 'comfortable' | 'compact';
 export interface Page {
-    active?: boolean;
     page?: number;
+    active?: boolean;
     ellipsis?: boolean;
 }
+export interface DefaultPaginationProps {
+    variant: PaginationVariant;
+    defaultActivePage?: number;
+    activePage?: number;
+    onPageChange?: (newPage: number, oldPage: number) => void;
+    labelPrevious?: string;
+    labelNext?: string;
+}
+declare type OpenEndedPaginationProps = {
+    openEnded: true;
+    hasNext: boolean;
+} & DefaultPaginationProps;
+declare type CloseEndedPaginationProps = {
+    openEnded: false;
+    totalPages: number;
+} & DefaultPaginationProps;
+export declare type PaginationProps = CloseEndedPaginationProps | OpenEndedPaginationProps;
+export declare type PagesProps = {
+    currentPage: number;
+    totalPages?: CloseEndedPaginationProps['totalPages'];
+    onPageChange: (page: Page) => void;
+} & Pick<PaginationProps, 'variant' | 'activePage'>;
 export declare type PageChangeHandlerFn = (page: Page) => void;
+export {};
 //# sourceMappingURL=types.d.ts.map

package/lib/components/Pagination/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/types.ts"],"names":[],"mappings":"AAAA,oBAAY,iBAAiB,GAAG,aAAa,GAAG,SAAS,CAAC;AAE1D,MAAM,WAAW,IAAI;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,oBAAY,mBAAmB,GAAG,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/types.ts"],"names":[],"mappings":"AAAA,oBAAY,iBAAiB,GAAG,aAAa,GAAG,SAAS,CAAC;AAE1D,MAAM,WAAW,IAAI;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,iBAAiB,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,aAAK,wBAAwB,GAAG;IAC9B,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;CAClB,GAAG,sBAAsB,CAAC;AAE3B,aAAK,yBAAyB,GAAG;IAC/B,SAAS,EAAE,KAAK,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB,GAAG,sBAAsB,CAAC;AAE3B,oBAAY,eAAe,GACvB,yBAAyB,GACzB,wBAAwB,CAAC;AAE7B,oBAAY,UAAU,GAAG;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,yBAAyB,CAAC,YAAY,CAAC,CAAC;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;AAEpD,oBAAY,mBAAmB,GAAG,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC"}

package/lib/components/Pagination/types.js

@@ -1 +1,5 @@
-"use strict";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});