@carbon/react 1.29.1 → 1.30.0-rc.0

package/lib/components/Pagination/Pagination.js

@@ -29,18 +29,15 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _CaretLeft, _CaretRight;
-
 function mapPageSizesToObject(sizes) {
   return typeof sizes[0] === 'object' && sizes[0] !== null ? sizes : sizes.map(size => ({
     text: size,
     value: size
   }));
 }
-
 function renderSelectItems(total) {
   let counter = 1;
   let itemArr = [];
-
   while (counter <= total) {
     itemArr.push( /*#__PURE__*/React__default["default"].createElement(SelectItem["default"], {
       key: counter,
@@ -49,24 +46,19 @@ function renderSelectItems(total) {
     }));
     counter++;
   }
-
   return itemArr;
 }
-
 function getPageSize(pageSizes, pageSize) {
   if (pageSize) {
     const hasSize = pageSizes.find(size => {
       return pageSize === size.value;
     });
-
     if (hasSize) {
       return pageSize;
     }
   }
-
   return pageSizes[0].value;
 }
-
 const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pagination(_ref, ref) {
   let {
     backwardText = 'Previous page',
@@ -124,33 +116,31 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     [`${prefix}--pagination__button--forward`]: true,
     [`${prefix}--pagination__button--no-index`]: forwardButtonDisabled
   });
-  const selectItems = renderSelectItems(totalPages); // Sync state with props
+  const selectItems = renderSelectItems(totalPages);
 
+  // Sync state with props
   if (controlledPage !== prevControlledPage) {
     setPage(controlledPage);
     setPrevControlledPage(controlledPage);
   }
-
   if (controlledPageSize !== prevControlledPageSize) {
     setPageSize(getPageSize(pageSizes, controlledPageSize));
     setPrevControlledPageSize(controlledPageSize);
   }
-
   if (!array.equals(controlledPageSizes, prevPageSizes)) {
     const pageSizes = mapPageSizesToObject(controlledPageSizes);
     const hasPageSize = pageSizes.find(size => {
       return size.value === pageSize;
-    }); // Reset page to 1 if the current pageSize is not included in the new page
-    // sizes
+    });
 
+    // Reset page to 1 if the current pageSize is not included in the new page
+    // sizes
     if (!hasPageSize) {
       setPage(1);
     }
-
     setPageSizes(pageSizes);
     setPrevPageSizes(controlledPageSizes);
   }
-
   function handleSizeChange(event) {
     const pageSize = Number(event.target.value);
     const changes = {
@@ -159,18 +149,14 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     };
     setPage(changes.page);
     setPageSize(changes.pageSize);
-
     if (onChange) {
       onChange(changes);
     }
   }
-
   function handlePageInputChange(event) {
     const page = Number(event.target.value);
-
     if (page > 0 && page <= Math.max(Math.ceil(totalItems / pageSize), 1)) {
       setPage(page);
-
       if (onChange) {
         onChange({
           page,
@@ -179,18 +165,17 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
       }
     }
   }
-
   function incrementPage() {
     const nextPage = page + 1;
-    setPage(nextPage); // when the increment button reaches the last page,
+    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
-
     if (nextPage === totalPages) {
       backBtnRef.current.focus();
     }
-
     if (onChange) {
       onChange({
         page: nextPage,
@@ -199,18 +184,17 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
       });
     }
   }
-
   function decrementPage() {
     const nextPage = page - 1;
-    setPage(nextPage); // when the decrement button reaches the first page,
+    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
-
     if (nextPage === 1) {
       forwardBtnRef.current.focus();
     }
-
     if (onChange) {
       onChange({
         page: nextPage,
@@ -219,7 +203,6 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
       });
     }
   }
-
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: className,
     ref: ref
@@ -285,80 +268,65 @@ Pagination.propTypes = {
    * The description for the backward icon.
    */
   backwardText: PropTypes__default["default"].string,
-
   /**
    * The CSS class names.
    */
   className: PropTypes__default["default"].string,
-
   /**
    * `true` if the backward/forward buttons, as well as the page select elements,  should be disabled.
    */
   disabled: PropTypes__default["default"].bool,
-
   /**
    * The description for the forward icon.
    */
   forwardText: PropTypes__default["default"].string,
-
   /**
    * The unique ID of this component instance.
    */
   id: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
   // TODO: remove when v9 is deprecated
-
   /**
    * `true` if the current page should be the last page.
    */
   isLastPage: PropTypes__default["default"].bool,
-
   /**
    * The function returning a translatable text showing where the current page is,
    * in a manner of the range of items.
    */
   itemRangeText: PropTypes__default["default"].func,
-
   /**
    * A variant of `itemRangeText`, used if the total number of items is unknown.
    */
   itemText: PropTypes__default["default"].func,
-
   /**
    * The translatable text indicating the number of items per page.
    */
   itemsPerPageText: PropTypes__default["default"].string,
-
   /**
    * The callback function called when the current page changes.
    */
   onChange: PropTypes__default["default"].func,
-
   /**
    * The current page.
    */
   page: PropTypes__default["default"].number,
-
   /**
    * `true` if the select box to change the page should be disabled.
    */
   pageInputDisabled: PropTypes__default["default"].bool,
   pageNumberText: PropTypes__default["default"].string,
-
   /**
    * A function returning PII showing where the current page is.
    */
   pageRangeText: PropTypes__default["default"].func,
-
   /**
    * The number dictating how many items a page contains.
    */
   pageSize: PropTypes__default["default"].number,
-
   /**
    * `true` if the select box to change the items per page should be disabled.
    */
   pageSizeInputDisabled: PropTypes__default["default"].bool,
-
   /**
    * The choices for `pageSize`.
    */
@@ -366,22 +334,18 @@ Pagination.propTypes = {
     text: PropTypes__default["default"].text,
     value: PropTypes__default["default"].number
   }))]).isRequired,
-
   /**
    * The translatable text showing the current page.
    */
   pageText: PropTypes__default["default"].func,
-
   /**
    * `true` if the total number of items is unknown.
    */
   pagesUnknown: PropTypes__default["default"].bool,
-
   /**
    * Specify the size of the Pagination.
    */
   size: PropTypes__default["default"].oneOf(['sm', 'md', 'lg']),
-
   /**
    * The total number of items.
    */

package/lib/components/Pagination/experimental/PageSelector.js

@@ -26,7 +26,6 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 const getInstanceId = setupGetInstanceId["default"]();
-
 function PageSelector(_ref) {
   let {
     className,
@@ -39,10 +38,8 @@ function PageSelector(_ref) {
   const prefix = usePrefix.usePrefix();
   const namespace = `${prefix}--unstable-pagination__page-selector`;
   const instanceId = `${namespace}__select-${getInstanceId()}`;
-
   const renderPages = total => {
     const pages = [];
-
     for (let counter = 1; counter <= total; counter += 1) {
       pages.push( /*#__PURE__*/React__default["default"].createElement(SelectItem["default"], {
         key: counter,
@@ -50,10 +47,8 @@ function PageSelector(_ref) {
         text: String(counter)
       }));
     }
-
     return pages;
   };
-
   return /*#__PURE__*/React__default["default"].createElement(Select["default"], _rollupPluginBabelHelpers["extends"]({
     className: cx__default["default"](namespace, className),
     hideLabel: true,
@@ -63,20 +58,15 @@ function PageSelector(_ref) {
     value: currentPage
   }, other), renderPages(totalPages));
 }
-
 PageSelector.propTypes = {
   /** Extra class names to add. */
   className: PropTypes__default["default"].string,
-
   /** The current page. */
   currentPage: PropTypes__default["default"].number.isRequired,
-
   /** The unique ID of this component instance. */
   id: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
-
   /** Translatable string to label the page selector element. */
   labelText: PropTypes__default["default"].string,
-
   /**
    * Total number of pages.
    * This value is calculated using a valid `totalItems` prop passed to the parent `Unstable_Pagination`.

package/lib/components/Pagination/experimental/Pagination.js

@@ -14,41 +14,19 @@ var React = require('react');
 var PropTypes = require('prop-types');
 var cx = require('classnames');
 var iconsReact = require('@carbon/icons-react');
-var Button = require('../../Button/Button.js');
 var Select = require('../../Select/Select.js');
 require('../../Select/Select.Skeleton.js');
 var SelectItem = require('../../SelectItem/SelectItem.js');
 var index = require('../../IconButton/index.js');
-var FeatureFlags = require('@carbon/feature-flags');
 var usePrefix = require('../../../internal/usePrefix.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n["default"] = e;
-  return Object.freeze(n);
-}
-
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
-var FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags);
 
 var _CaretLeft, _CaretRight;
-
 function Pagination(_ref) {
   let {
     backwardText,
@@ -76,11 +54,9 @@ function Pagination(_ref) {
   const totalPages = totalItems ? Math.max(Math.ceil(totalItems / currentPageSize), 1) : undefined;
   const backButtonDisabled = disabled || currentPage === 1;
   const forwardButtonDisabled = disabled || currentPage === totalPages;
-
   function onSetPage(newPage) {
     setCurrentPage(Number(newPage));
   }
-
   function incrementPage() {
     const page = currentPage + 1;
     setCurrentPage(page);
@@ -89,7 +65,6 @@ function Pagination(_ref) {
       pageSize: currentPageSize
     });
   }
-
   function decrementPage() {
     const page = currentPage - 1;
     setCurrentPage(page);
@@ -98,7 +73,6 @@ function Pagination(_ref) {
       pageSize: currentPageSize
     });
   }
-
   const namespace = `${prefix}--unstable-pagination`;
   return /*#__PURE__*/React__default["default"].createElement("section", _rollupPluginBabelHelpers["extends"]({
     className: cx__default["default"](namespace, className)
@@ -136,7 +110,7 @@ function Pagination(_ref) {
     className: `${namespace}__text`
   }, pageText(currentPage)), !children && /*#__PURE__*/React__default["default"].createElement("span", {
     className: `${namespace}__text`
-  }, !totalItems ? pageText(currentPage) : pageRangeText(currentPage, totalPages)), FeatureFlags__namespace.enabled('enable-v11-release') ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
+  }, !totalItems ? pageText(currentPage) : pageRangeText(currentPage, totalPages)), /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
     align: "top",
     disabled: backButtonDisabled,
     kind: "ghost",
@@ -154,112 +128,73 @@ function Pagination(_ref) {
     }),
     label: forwardText,
     onClick: () => incrementPage()
-  }, _CaretRight || (_CaretRight = /*#__PURE__*/React__default["default"].createElement(iconsReact.CaretRight, null)))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Button["default"], {
-    className: cx__default["default"](`${namespace}__button`, `${namespace}__button--backward`, {
-      [`${namespace}__button--no-index`]: backButtonDisabled
-    }),
-    onClick: () => decrementPage(),
-    disabled: backButtonDisabled,
-    hasIconOnly: true,
-    renderIcon: iconsReact.CaretLeft,
-    tooltipAlignment: "center",
-    tooltipPosition: "top",
-    iconDescription: backwardText
-  }), /*#__PURE__*/React__default["default"].createElement(Button["default"], {
-    className: cx__default["default"](`${namespace}__button`, `${namespace}__button--forward`, {
-      [`${namespace}__button--no-index`]: forwardButtonDisabled
-    }),
-    onClick: () => incrementPage(),
-    disabled: forwardButtonDisabled,
-    hasIconOnly: true,
-    renderIcon: iconsReact.CaretRight,
-    tooltipAlignment: "center",
-    tooltipPosition: "top",
-    iconDescription: forwardText
-  }))));
+  }, _CaretRight || (_CaretRight = /*#__PURE__*/React__default["default"].createElement(iconsReact.CaretRight, null))))));
 }
-
 Pagination.propTypes = {
   /**
    * The description for the backward icon.
    */
   backwardText: PropTypes__default["default"].string,
-
   /**
    * The children of the pagination component.
    */
   children: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].func]),
-
   /**
    * Extra classes to add.
    */
   className: PropTypes__default["default"].string,
-
   /**
    * `true` if the backward/forward buttons should be disabled.
    */
   disabled: PropTypes__default["default"].bool,
-
   /**
    * The description for the forward icon.
    */
   forwardText: PropTypes__default["default"].string,
-
   /** The unique ID of this component instance. */
   id: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
-
   /**
    * The initial active page when the component is first mounted.
    */
   initialPage: PropTypes__default["default"].number,
-
   /**
    * The function returning a translatable text showing where the current page is,
    * in a manner of the range of items.
    */
   itemRangeText: PropTypes__default["default"].func,
-
   /**
    * A variant of `itemRangeText`, used if the total number of items is unknown.
    */
   itemText: PropTypes__default["default"].func,
-
   /**
    * The translatable text indicating the number of items per page.
    */
   itemsPerPageText: PropTypes__default["default"].string,
-
   /**
    * The callback function called when the current page changes.
    */
   onChange: PropTypes__default["default"].func,
-
   /**
    * The function returning a translatable text showing where the current page is,
    * in a manner of the total number of pages.
    */
   pageRangeText: PropTypes__default["default"].func,
-
   /**
    * The number dictating how many items a page contains.
    */
   pageSize: PropTypes__default["default"].number,
-
   /**
    * The choices for `pageSize`.
    */
   pageSizes: PropTypes__default["default"].arrayOf(PropTypes__default["default"].number),
-
   /**
    * The translatable text showing the current page.
    */
   pageText: PropTypes__default["default"].func,
-
   /**
    * `true` if total number of pages is unknown.
    */
   pagesUnknown: PropTypes__default["default"].bool,
-
   /**
    * The total number of items.
    * You need to provide total items to calculate total page,