@carbon/react 1.15.0 → 1.16.0

package/es/components/Pagination/Pagination.js

@@ -5,288 +5,311 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, typeof as _typeof, createClass as _createClass, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import PropTypes from 'prop-types';
-import React__default, { Component } from 'react';
-import cx from 'classnames';
+import { objectWithoutProperties as _objectWithoutProperties, typeof as _typeof, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { CaretLeft, CaretRight } from '@carbon/icons-react';
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React__default, { useRef, useState } from 'react';
 import Select from '../Select/Select.js';
 import SelectItem from '../SelectItem/SelectItem.js';
 import { equals } from '../../tools/array.js';
-import Button from '../Button/Button.js';
-import { PrefixContext } from '../../internal/usePrefix.js';
+import { useFallbackId } from '../../internal/useId.js';
+import { usePrefix } from '../../internal/usePrefix.js';
+import { IconButton } from '../IconButton/index.js';
+
+var _CaretLeft, _CaretRight;
 
-var _excluded = ["backwardText", "className", "forwardText", "id", "itemsPerPageText", "itemRangeText", "pageRangeText", "pageSize", "pageSizes", "itemText", "pageText", "pageNumberText", "pagesUnknown", "isLastPage", "disabled", "pageInputDisabled", "pageSizeInputDisabled", "totalItems", "onChange", "page", "size", "forwardedRef"];
-var instanceId = 0;
+var _excluded = ["backwardText", "className", "disabled", "forwardText", "id", "isLastPage", "itemText", "itemRangeText", "itemsPerPageText", "onChange", "pageNumberText", "pageRangeText", "page", "pageInputDisabled", "pageSize", "pageSizeInputDisabled", "pageSizes", "pageText", "pagesUnknown", "size", "totalItems"];
 
-var mapPageSizesToObject = function mapPageSizesToObject(sizes) {
+function mapPageSizesToObject(sizes) {
   return _typeof(sizes[0]) === 'object' && sizes[0] !== null ? sizes : sizes.map(function (size) {
     return {
       text: size,
       value: size
     };
   });
-};
-
-var Pagination = /*#__PURE__*/function (_Component) {
-  _inherits(Pagination, _Component);
-
-  var _super = _createSuper(Pagination);
-
-  function Pagination(props) {
-    var _this;
-
-    _classCallCheck(this, Pagination);
+}
+
+function renderSelectItems(total) {
+  var counter = 1;
+  var itemArr = [];
+
+  while (counter <= total) {
+    itemArr.push( /*#__PURE__*/React__default.createElement(SelectItem, {
+      key: counter,
+      value: counter,
+      text: String(counter)
+    }));
+    counter++;
+  }
 
-    _this = _super.call(this, props);
+  return itemArr;
+}
 
-    _defineProperty(_assertThisInitialized(_this), "handleSizeChange", function (evt) {
-      var pageSize = Number(evt.target.value);
+function getPageSize(pageSizes, pageSize) {
+  if (pageSize) {
+    var hasSize = pageSizes.find(function (size) {
+      return pageSize === size.value;
+    });
 
-      _this.setState({
-        pageSize: pageSize,
-        page: 1
-      });
+    if (hasSize) {
+      return pageSize;
+    }
+  }
 
-      _this.props.onChange({
-        page: 1,
-        pageSize: pageSize
-      });
-    });
+  return pageSizes[0].value;
+}
+
+var Pagination = /*#__PURE__*/React__default.forwardRef(function Pagination(_ref, ref) {
+  var _cx, _cx2, _cx3;
+
+  var _ref$backwardText = _ref.backwardText,
+      backwardText = _ref$backwardText === void 0 ? 'Previous page' : _ref$backwardText,
+      customClassName = _ref.className,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$forwardText = _ref.forwardText,
+      forwardText = _ref$forwardText === void 0 ? 'Next page' : _ref$forwardText,
+      id = _ref.id,
+      _ref$isLastPage = _ref.isLastPage,
+      isLastPage = _ref$isLastPage === void 0 ? false : _ref$isLastPage,
+      _ref$itemText = _ref.itemText,
+      itemText = _ref$itemText === void 0 ? function (min, max) {
+    return "".concat(min, "\u2013").concat(max, " items");
+  } : _ref$itemText,
+      _ref$itemRangeText = _ref.itemRangeText,
+      itemRangeText = _ref$itemRangeText === void 0 ? function (min, max, total) {
+    return "".concat(min, "\u2013").concat(max, " of ").concat(total, " items");
+  } : _ref$itemRangeText,
+      _ref$itemsPerPageText = _ref.itemsPerPageText,
+      itemsPerPageText = _ref$itemsPerPageText === void 0 ? 'Items per page:' : _ref$itemsPerPageText,
+      onChange = _ref.onChange;
+      _ref.pageNumberText;
+      var _ref$pageRangeText = _ref.pageRangeText,
+      pageRangeText = _ref$pageRangeText === void 0 ? function (_current, total) {
+    return "of ".concat(total, " ").concat(total === 1 ? 'page' : 'pages');
+  } : _ref$pageRangeText,
+      _ref$page = _ref.page,
+      controlledPage = _ref$page === void 0 ? 1 : _ref$page,
+      pageInputDisabled = _ref.pageInputDisabled,
+      controlledPageSize = _ref.pageSize,
+      pageSizeInputDisabled = _ref.pageSizeInputDisabled,
+      controlledPageSizes = _ref.pageSizes,
+      _ref$pageText = _ref.pageText,
+      pageText = _ref$pageText === void 0 ? function (page) {
+    return "page ".concat(page);
+  } : _ref$pageText,
+      _ref$pagesUnknown = _ref.pagesUnknown,
+      pagesUnknown = _ref$pagesUnknown === void 0 ? false : _ref$pagesUnknown,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'md' : _ref$size,
+      totalItems = _ref.totalItems,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+  var inputId = useFallbackId(id);
+  var backBtnRef = useRef(null);
+  var forwardBtnRef = useRef(null);
+
+  var _useState = useState(function () {
+    return mapPageSizesToObject(controlledPageSizes);
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      pageSizes = _useState2[0],
+      setPageSizes = _useState2[1];
+
+  var _useState3 = useState(controlledPageSizes),
+      _useState4 = _slicedToArray(_useState3, 2),
+      prevPageSizes = _useState4[0],
+      setPrevPageSizes = _useState4[1];
+
+  var _useState5 = useState(controlledPage),
+      _useState6 = _slicedToArray(_useState5, 2),
+      page = _useState6[0],
+      setPage = _useState6[1];
+
+  var _useState7 = useState(controlledPage),
+      _useState8 = _slicedToArray(_useState7, 2),
+      prevControlledPage = _useState8[0],
+      setPrevControlledPage = _useState8[1];
+
+  var _useState9 = useState(function () {
+    return getPageSize(pageSizes, controlledPageSize);
+  }),
+      _useState10 = _slicedToArray(_useState9, 2),
+      pageSize = _useState10[0],
+      setPageSize = _useState10[1];
+
+  var _useState11 = useState(controlledPageSize),
+      _useState12 = _slicedToArray(_useState11, 2),
+      prevControlledPageSize = _useState12[0],
+      setPrevControlledPageSize = _useState12[1];
+
+  var className = cx((_cx = {}, _defineProperty(_cx, "".concat(prefix, "--pagination"), true), _defineProperty(_cx, "".concat(prefix, "--pagination--").concat(size), size), _defineProperty(_cx, customClassName, !!customClassName), _cx));
+  var totalPages = Math.max(Math.ceil(totalItems / pageSize), 1);
+  var backButtonDisabled = disabled || page === 1;
+  var backButtonClasses = cx((_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--pagination__button"), true), _defineProperty(_cx2, "".concat(prefix, "--pagination__button--backward"), true), _defineProperty(_cx2, "".concat(prefix, "--pagination__button--no-index"), backButtonDisabled), _cx2));
+  var forwardButtonDisabled = disabled || page === totalPages;
+  var forwardButtonClasses = cx((_cx3 = {}, _defineProperty(_cx3, "".concat(prefix, "--pagination__button"), true), _defineProperty(_cx3, "".concat(prefix, "--pagination__button--forward"), true), _defineProperty(_cx3, "".concat(prefix, "--pagination__button--no-index"), forwardButtonDisabled), _cx3));
+  var selectItems = renderSelectItems(totalPages); // Sync state with props
+
+  if (controlledPage !== prevControlledPage) {
+    setPage(controlledPage);
+    setPrevControlledPage(controlledPage);
+  }
 
-    _defineProperty(_assertThisInitialized(_this), "handlePageChange", function (evt) {
-      _this.setState({
-        page: evt.target.value
-      });
-    });
+  if (controlledPageSize !== prevControlledPageSize) {
+    setPageSize(getPageSize(pageSizes, controlledPageSize));
+    setPrevControlledPageSize(controlledPageSize);
+  }
 
-    _defineProperty(_assertThisInitialized(_this), "handlePageInputChange", function (evt) {
-      var page = Number(evt.target.value);
+  if (!equals(controlledPageSizes, prevPageSizes)) {
+    var _pageSizes = mapPageSizesToObject(controlledPageSizes);
 
-      if (page > 0 && page <= Math.max(Math.ceil(_this.props.totalItems / _this.state.pageSize), 1)) {
-        _this.setState({
-          page: page
-        });
+    var hasPageSize = _pageSizes.find(function (size) {
+      return size.value === pageSize;
+    }); // Reset page to 1 if the current pageSize is not included in the new page
+    // sizes
 
-        _this.props.onChange({
-          page: page,
-          pageSize: _this.state.pageSize
-        });
-      }
-    });
 
-    _defineProperty(_assertThisInitialized(_this), "incrementPage", function () {
-      var page = _this.state.page + 1;
+    if (!hasPageSize) {
+      setPage(1);
+    }
 
-      _this.setState({
-        page: page
-      });
+    setPageSizes(_pageSizes);
+    setPrevPageSizes(controlledPageSizes);
+  }
 
-      _this.props.onChange({
-        page: page,
-        pageSize: _this.state.pageSize
-      });
-    });
+  function handleSizeChange(event) {
+    var pageSize = Number(event.target.value);
+    var changes = {
+      pageSize: pageSize,
+      page: 1
+    };
+    setPage(changes.page);
+    setPageSize(changes.pageSize);
 
-    _defineProperty(_assertThisInitialized(_this), "decrementPage", function () {
-      var page = _this.state.page - 1;
+    if (onChange) {
+      onChange(changes);
+    }
+  }
 
-      _this.setState({
-        page: page
-      });
+  function handlePageInputChange(event) {
+    var page = Number(event.target.value);
 
-      _this.props.onChange({
-        page: page,
-        pageSize: _this.state.pageSize
-      });
-    });
+    if (page > 0 && page <= Math.max(Math.ceil(totalItems / pageSize), 1)) {
+      setPage(page);
 
-    _defineProperty(_assertThisInitialized(_this), "renderSelectItems", function (total) {
-      var counter = 1;
-      var itemArr = [];
-
-      while (counter <= total) {
-        itemArr.push( /*#__PURE__*/React__default.createElement(SelectItem, {
-          key: counter,
-          value: counter,
-          text: String(counter)
-        }));
-        counter++;
+      if (onChange) {
+        onChange({
+          page: page,
+          pageSize: pageSize
+        });
       }
+    }
+  }
 
-      return itemArr;
-    });
+  function incrementPage() {
+    var nextPage = page + 1;
+    setPage(nextPage); // when the increment button reaches the last page,
+    // the icon button becomes disabled and the focus shifts to `main`
+    // this presents an a11y problem for keyboard & screen reader users
+    // instead, we want the focus to shift to the other pagination btn
 
-    var _this$props = _this.props,
-        _pageSizes = _this$props.pageSizes,
-        _page = _this$props.page,
-        _pageSize = _this$props.pageSize;
-    var pageSizes = mapPageSizesToObject(_pageSizes);
-    _this.state = {
-      page: _page,
-      pageSize: _pageSize && pageSizes.some(function (sizeObj) {
-        return _pageSize === sizeObj.value;
-      }) ? _pageSize : pageSizes[0].value,
-      prevPageSizes: pageSizes,
-      prevPage: _page,
-      prevPageSize: _pageSize
-    };
-    _this.uniqueId = ++instanceId;
-    return _this;
-  }
+    if (nextPage === totalPages) {
+      backBtnRef.current.focus();
+    }
 
-  _createClass(Pagination, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      var _this$props2 = this.props,
-          backwardText = _this$props2.backwardText,
-          className = _this$props2.className,
-          forwardText = _this$props2.forwardText,
-          id = _this$props2.id,
-          itemsPerPageText = _this$props2.itemsPerPageText,
-          itemRangeText = _this$props2.itemRangeText,
-          pageRangeText = _this$props2.pageRangeText;
-          _this$props2.pageSize;
-          var _pageSizes = _this$props2.pageSizes,
-          itemText = _this$props2.itemText,
-          pageText = _this$props2.pageText;
-          _this$props2.pageNumberText;
-          var pagesUnknown = _this$props2.pagesUnknown,
-          isLastPage = _this$props2.isLastPage,
-          disabled = _this$props2.disabled,
-          pageInputDisabled = _this$props2.pageInputDisabled,
-          pageSizeInputDisabled = _this$props2.pageSizeInputDisabled,
-          totalItems = _this$props2.totalItems;
-          _this$props2.onChange;
-          _this$props2.page;
-          var size = _this$props2.size,
-          forwardedRef = _this$props2.forwardedRef,
-          other = _objectWithoutProperties(_this$props2, _excluded);
-
-      return /*#__PURE__*/React__default.createElement(PrefixContext.Consumer, null, function (prefix) {
-        var classNames = cx("".concat(prefix, "--pagination"), className, _defineProperty({}, "".concat(prefix, "--pagination--").concat(size), size));
-        var inputId = id || _this2.uniqueId;
-        var _this2$state = _this2.state,
-            statePage = _this2$state.page,
-            statePageSize = _this2$state.pageSize;
-        var totalPages = Math.max(Math.ceil(totalItems / statePageSize), 1);
-        var backButtonDisabled = disabled || statePage === 1;
-        var backButtonClasses = cx("".concat(prefix, "--pagination__button"), "".concat(prefix, "--pagination__button--backward"), _defineProperty({}, "".concat(prefix, "--pagination__button--no-index"), backButtonDisabled));
-        var forwardButtonDisabled = disabled || statePage === totalPages;
-        var forwardButtonClasses = cx("".concat(prefix, "--pagination__button"), "".concat(prefix, "--pagination__button--forward"), _defineProperty({}, "".concat(prefix, "--pagination__button--no-index"), forwardButtonDisabled));
-
-        var selectItems = _this2.renderSelectItems(totalPages);
-
-        var pageSizes = mapPageSizesToObject(_pageSizes);
-        return /*#__PURE__*/React__default.createElement("div", _extends({
-          className: classNames,
-          ref: forwardedRef
-        }, other), /*#__PURE__*/React__default.createElement("div", {
-          className: "".concat(prefix, "--pagination__left")
-        }, /*#__PURE__*/React__default.createElement("label", {
-          id: "".concat(prefix, "-pagination-select-").concat(inputId, "-count-label"),
-          className: "".concat(prefix, "--pagination__text"),
-          htmlFor: "".concat(prefix, "-pagination-select-").concat(inputId)
-        }, itemsPerPageText), /*#__PURE__*/React__default.createElement(Select, {
-          id: "".concat(prefix, "-pagination-select-").concat(inputId),
-          className: "".concat(prefix, "--select__item-count"),
-          labelText: "",
-          hideLabel: true,
-          noLabel: true,
-          inline: true,
-          onChange: _this2.handleSizeChange,
-          disabled: pageSizeInputDisabled || disabled,
-          value: statePageSize
-        }, pageSizes.map(function (sizeObj) {
-          return /*#__PURE__*/React__default.createElement(SelectItem, {
-            key: sizeObj.value,
-            value: sizeObj.value,
-            text: String(sizeObj.text)
-          });
-        })), /*#__PURE__*/React__default.createElement("span", {
-          className: "".concat(prefix, "--pagination__text ").concat(prefix, "--pagination__items-count")
-        }, pagesUnknown ? itemText(statePageSize * (statePage - 1) + 1, statePage * statePageSize) : itemRangeText(Math.min(statePageSize * (statePage - 1) + 1, totalItems), Math.min(statePage * statePageSize, totalItems), totalItems))), /*#__PURE__*/React__default.createElement("div", {
-          className: "".concat(prefix, "--pagination__right")
-        }, /*#__PURE__*/React__default.createElement(Select, {
-          id: "".concat(prefix, "-pagination-select-").concat(inputId, "-right"),
-          className: "".concat(prefix, "--select__page-number"),
-          labelText: "Page number, of ".concat(totalPages, " pages"),
-          inline: true,
-          hideLabel: true,
-          onChange: _this2.handlePageInputChange,
-          value: statePage,
-          disabled: pageInputDisabled || disabled
-        }, selectItems), /*#__PURE__*/React__default.createElement("span", {
-          className: "".concat(prefix, "--pagination__text")
-        }, pagesUnknown ? pageText(statePage) : pageRangeText(statePage, totalPages)), /*#__PURE__*/React__default.createElement("div", {
-          className: "".concat(prefix, "--pagination__control-buttons")
-        }, /*#__PURE__*/React__default.createElement(Button, {
-          kind: "ghost",
-          className: backButtonClasses,
-          hasIconOnly: true,
-          renderIcon: CaretLeft,
-          iconDescription: backwardText,
-          tooltipAlignment: "center",
-          tooltipPosition: "top",
-          onClick: _this2.decrementPage,
-          disabled: backButtonDisabled
-        }), /*#__PURE__*/React__default.createElement(Button, {
-          kind: "ghost",
-          className: forwardButtonClasses,
-          hasIconOnly: true,
-          renderIcon: CaretRight,
-          iconDescription: forwardText,
-          tooltipAlignment: "end",
-          tooltipPosition: "top",
-          onClick: _this2.incrementPage,
-          disabled: forwardButtonDisabled || isLastPage
-        }))));
+    if (onChange) {
+      onChange({
+        page: nextPage,
+        pageSize: pageSize,
+        backBtnRef: backBtnRef
       });
     }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(_ref, state) {
-      var _pageSizes = _ref.pageSizes,
-          page = _ref.page,
-          pageSize = _ref.pageSize;
-      var prevPageSizes = state.prevPageSizes,
-          prevPage = state.prevPage,
-          prevPageSize = state.prevPageSize,
-          currentPage = state.page,
-          currentPageSize = state.pageSize;
-      var pageSizes = mapPageSizesToObject(_pageSizes);
-      var pageSizesValues = pageSizes.map(function (sizeObj) {
-        return sizeObj.value;
-      });
-      var prevPageSizesValues = prevPageSizes.map(function (sizeObj) {
-        return sizeObj.value;
-      });
-      var pageSizesChanged = !equals(pageSizesValues, prevPageSizesValues);
+  }
 
-      if (pageSizesChanged && !pageSizes.some(function (sizeObj) {
-        return pageSize === sizeObj.value;
-      })) {
-        pageSize = pageSizes[0].value;
-      }
+  function decrementPage() {
+    var nextPage = page - 1;
+    setPage(nextPage); // when the decrement button reaches the first page,
+    // the icon button becomes disabled and the focus shifts to `main`
+    // this presents an a11y problem for keyboard & screen reader users
+    // instead, we want the focus to shift to the other pagination btn
 
-      var pageChanged = page !== prevPage;
-      var pageSizeChanged = pageSize !== prevPageSize;
-      return !pageSizesChanged && !pageChanged && !pageSizeChanged ? null : {
-        page: pageSizeChanged && 1 || pageChanged && page || currentPage,
-        pageSize: pageSizeChanged ? pageSize : currentPageSize,
-        prevPageSizes: pageSizes,
-        prevPage: page,
-        prevPageSize: pageSize
-      };
+    if (nextPage === 1) {
+      forwardBtnRef.current.focus();
     }
-  }]);
 
-  return Pagination;
-}(Component);
+    if (onChange) {
+      onChange({
+        page: nextPage,
+        pageSize: pageSize,
+        forwardBtnRef: forwardBtnRef
+      });
+    }
+  }
 
-_defineProperty(Pagination, "propTypes", {
+  return /*#__PURE__*/React__default.createElement("div", _extends({
+    className: className,
+    ref: ref
+  }, rest), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--pagination__left")
+  }, /*#__PURE__*/React__default.createElement("label", {
+    id: "".concat(prefix, "-pagination-select-").concat(inputId, "-count-label"),
+    className: "".concat(prefix, "--pagination__text"),
+    htmlFor: "".concat(prefix, "-pagination-select-").concat(inputId)
+  }, itemsPerPageText), /*#__PURE__*/React__default.createElement(Select, {
+    id: "".concat(prefix, "-pagination-select-").concat(inputId),
+    className: "".concat(prefix, "--select__item-count"),
+    labelText: "",
+    hideLabel: true,
+    noLabel: true,
+    inline: true,
+    onChange: handleSizeChange,
+    disabled: pageSizeInputDisabled || disabled,
+    value: pageSize
+  }, pageSizes.map(function (sizeObj) {
+    return /*#__PURE__*/React__default.createElement(SelectItem, {
+      key: sizeObj.value,
+      value: sizeObj.value,
+      text: String(sizeObj.text)
+    });
+  })), /*#__PURE__*/React__default.createElement("span", {
+    className: "".concat(prefix, "--pagination__text ").concat(prefix, "--pagination__items-count")
+  }, pagesUnknown ? itemText(pageSize * (page - 1) + 1, page * pageSize) : itemRangeText(Math.min(pageSize * (page - 1) + 1, totalItems), Math.min(page * pageSize, totalItems), totalItems))), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--pagination__right")
+  }, /*#__PURE__*/React__default.createElement(Select, {
+    id: "".concat(prefix, "-pagination-select-").concat(inputId, "-right"),
+    className: "".concat(prefix, "--select__page-number"),
+    labelText: "Page number, of ".concat(totalPages, " pages"),
+    inline: true,
+    hideLabel: true,
+    onChange: handlePageInputChange,
+    value: page,
+    disabled: pageInputDisabled || disabled
+  }, selectItems), /*#__PURE__*/React__default.createElement("span", {
+    className: "".concat(prefix, "--pagination__text")
+  }, pagesUnknown ? pageText(page) : pageRangeText(page, totalPages)), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--pagination__control-buttons")
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
+    align: "top",
+    disabled: backButtonDisabled,
+    kind: "ghost",
+    className: backButtonClasses,
+    label: backwardText,
+    onClick: decrementPage,
+    ref: backBtnRef
+  }, _CaretLeft || (_CaretLeft = /*#__PURE__*/React__default.createElement(CaretLeft, null))), /*#__PURE__*/React__default.createElement(IconButton, {
+    align: "top-right",
+    disabled: forwardButtonDisabled || isLastPage,
+    kind: "ghost",
+    className: forwardButtonClasses,
+    label: forwardText,
+    onClick: incrementPage,
+    ref: forwardBtnRef
+  }, _CaretRight || (_CaretRight = /*#__PURE__*/React__default.createElement(CaretRight, null))))));
+});
+Pagination.propTypes = {
   /**
    * The description for the backward icon.
    */
@@ -384,7 +407,7 @@ _defineProperty(Pagination, "propTypes", {
   pagesUnknown: PropTypes.bool,
 
   /**
-   * Specify the size of the Pagination. Currently supports either `sm`, 'md' (default) or 'lg` as an option.
+   * Specify the size of the Pagination.
    */
   size: PropTypes.oneOf(['sm', 'md', 'lg']),
 
@@ -392,29 +415,7 @@ _defineProperty(Pagination, "propTypes", {
    * The total number of items.
    */
   totalItems: PropTypes.number
-});
-
-_defineProperty(Pagination, "defaultProps", {
-  backwardText: 'Previous page',
-  itemRangeText: function itemRangeText(min, max, total) {
-    return "".concat(min, "\u2013").concat(max, " of ").concat(total, " items");
-  },
-  forwardText: 'Next page',
-  itemsPerPageText: 'Items per page:',
-  pageNumberText: 'Page Number',
-  pageRangeText: function pageRangeText(current, total) {
-    return "of ".concat(total, " ").concat(total === 1 ? 'page' : 'pages');
-  },
-  disabled: false,
-  page: 1,
-  pagesUnknown: false,
-  isLastPage: false,
-  itemText: function itemText(min, max) {
-    return "".concat(min, "\u2013").concat(max, " items");
-  },
-  pageText: function pageText(page) {
-    return "page ".concat(page);
-  }
-});
+};
+var Pagination$1 = Pagination;
 
-export { Pagination as default };
+export { Pagination$1 as default };

package/es/components/Pagination/index.js

@@ -5,10 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import * as FeatureFlags from '@carbon/feature-flags';
 import Pagination from './Pagination.js';
-import PaginationNext from './next/Pagination.js';
-
-var index = FeatureFlags.enabled('enable-v11-release') ? PaginationNext : Pagination;
-
-export { index as default };
+export { default } from './Pagination.js';

package/es/components/ProgressIndicator/ProgressIndicator.Skeleton.js

@@ -5,14 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { CircleDash } from '@carbon/icons-react';
 
-var _excluded = ["className"];
+var _excluded = ["className", "vertical"];
 
 var _CircleDash, _Step, _Step2, _Step3, _Step4;
 
@@ -31,11 +31,12 @@ function Step() {
 
 function ProgressIndicatorSkeleton(_ref) {
   var className = _ref.className,
+      vertical = _ref.vertical,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix();
   return /*#__PURE__*/React__default.createElement("ul", _extends({
-    className: cx("".concat(prefix, "--progress"), "".concat(prefix, "--skeleton"), className)
+    className: cx("".concat(prefix, "--progress"), "".concat(prefix, "--skeleton"), _defineProperty({}, "".concat(prefix, "--progress--vertical"), vertical), className)
   }, rest), _Step || (_Step = /*#__PURE__*/React__default.createElement(Step, null)), _Step2 || (_Step2 = /*#__PURE__*/React__default.createElement(Step, null)), _Step3 || (_Step3 = /*#__PURE__*/React__default.createElement(Step, null)), _Step4 || (_Step4 = /*#__PURE__*/React__default.createElement(Step, null)));
 }
 
@@ -43,7 +44,12 @@ ProgressIndicatorSkeleton.propTypes = {
   /**
    * Specify an optional className to add.
    */
-  className: PropTypes.string
+  className: PropTypes.string,
+
+  /**
+   * Determines whether or not the ProgressIndicator should be rendered vertically.
+   */
+  vertical: PropTypes.bool
 };
 
 export { ProgressIndicatorSkeleton as default };