carbon-react 117.2.1 → 117.3.0

package/esm/__internal__/fieldset/fieldset.component.js

@@ -25,9 +25,8 @@ const Fieldset = ({
   return /*#__PURE__*/React.createElement(InputGroupBehaviour, {
     blockGroupBehaviour: blockGroupBehaviour
   }, /*#__PURE__*/React.createElement(StyledFieldset, _extends({
-    "data-component": "fieldset",
-    m: 0
-  }, marginProps, rest), legend && /*#__PURE__*/React.createElement(InputGroupContext.Consumer, null, ({
+    "data-component": "fieldset"
+  }, rest, marginProps), legend && /*#__PURE__*/React.createElement(InputGroupContext.Consumer, null, ({
     onMouseEnter,
     onMouseLeave
   }) => /*#__PURE__*/React.createElement(StyledLegend, {

package/esm/__internal__/fieldset/fieldset.style.js

@@ -2,6 +2,7 @@ import styled, { css } from "styled-components";
 import { margin } from "styled-system";
 import BaseTheme from "../../style/themes/base";
 const StyledFieldset = styled.fieldset`
+  margin: 0;
   ${margin}
   border: none;
   padding: 0;

package/esm/components/fieldset/fieldset.component.js

@@ -29,9 +29,7 @@ const Fieldset = ({
     value: {
       validationRedesignOptIn: false
     }
-  }, /*#__PURE__*/React.createElement(FieldsetStyle, _extends({}, tagComponent("fieldset", rest), rest, {
-    m: 0
-  }, marginProps), /*#__PURE__*/React.createElement(FieldsetContentStyle, {
+  }, /*#__PURE__*/React.createElement(FieldsetStyle, _extends({}, tagComponent("fieldset", rest), rest, marginProps), /*#__PURE__*/React.createElement(FieldsetContentStyle, {
     "data-component": "fieldset-style",
     inline: inline
   }, getLegend(), /*#__PURE__*/React.createElement(FormSpacingProvider, {

package/esm/components/fieldset/fieldset.style.js

@@ -6,6 +6,7 @@ import StyledIcon from "../icon/icon.style";
 import baseTheme from "../../style/themes/base";
 import CheckboxStyle from "../checkbox/checkbox.style";
 const FieldsetStyle = styled.fieldset`
+  margin: 0;
   ${margin}
   border: none;
   padding: 0;

package/esm/components/pager/__internal__/pager-navigation.component.d.ts

@@ -23,8 +23,10 @@ export interface PagerNavigationProps {
     showPreviousAndNextButtons?: boolean;
     /** Should the page count input be shown */
     showPageCount?: boolean;
+    /** If true, page number navigation will be changed to a non-interactive label */
+    interactivePageNumber?: boolean;
     /** If true, sets css property visibility: hidden on all disabled elements  */
     hideDisabledElements?: boolean;
 }
-declare const PagerNavigation: ({ pageSize, currentPage, setCurrentPage, onNext, onPrevious, onFirst, onLast, onPagination, pageCount, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, hideDisabledElements, }: PagerNavigationProps) => JSX.Element;
+declare const PagerNavigation: ({ pageSize, currentPage, setCurrentPage, onNext, onPrevious, onFirst, onLast, onPagination, pageCount, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, interactivePageNumber, hideDisabledElements, }: PagerNavigationProps) => JSX.Element;
 export default PagerNavigation;

package/esm/components/pager/__internal__/pager-navigation.component.js

@@ -2,7 +2,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import React, { useRef } from "react";
 import PropTypes from "prop-types";
-import { StyledPagerNavigation, StyledPagerNavInner, StyledPagerNoSelect } from "../pager.style";
+import { StyledPagerNavigation, StyledPagerNavInner, StyledPagerNoSelect, StyledPagerNavLabel } from "../pager.style";
 import NumberInput from "../../number";
 import Events from "../../../__internal__/utils/helpers/events";
 import createGuid from "../../../__internal__/utils/helpers/guid";
@@ -22,11 +22,13 @@ const PagerNavigation = ({
   showFirstAndLastButtons = true,
   showPreviousAndNextButtons = true,
   showPageCount = true,
+  interactivePageNumber = true,
   hideDisabledElements = false
 }) => {
   const l = useLocale();
   const guid = useRef(createGuid());
   const currentPageId = `Pager_${guid.current}`;
+  const navLabelString = `${l.pager.pageX()} ${currentPage.toString()} ${l.pager.ofY(pageCount)}`;
   const hasOnePage = pageCount <= 1;
   const hasTwoPages = pageCount === 2;
   const pagerNavigationProps = {
@@ -86,7 +88,7 @@ const PagerNavigation = ({
     onClick: onLast
   }, pagerNavigationProps)));
 
-  return /*#__PURE__*/React.createElement(StyledPagerNavigation, null, !hasOnePage && renderButtonsBeforeCount(), showPageCount && /*#__PURE__*/React.createElement(StyledPagerNavInner, null, /*#__PURE__*/React.createElement("label", {
+  return /*#__PURE__*/React.createElement(StyledPagerNavigation, null, !hasOnePage && renderButtonsBeforeCount(), showPageCount && (interactivePageNumber ? /*#__PURE__*/React.createElement(StyledPagerNavInner, null, /*#__PURE__*/React.createElement("label", {
     htmlFor: currentPageId
   }, /*#__PURE__*/React.createElement(StyledPagerNoSelect, null, l.pager.pageX())), /*#__PURE__*/React.createElement(NumberInput, {
     value: currentPage.toString(),
@@ -95,12 +97,17 @@ const PagerNavigation = ({
     onBlur: handlePageInputChange,
     id: currentPageId,
     onKeyUp: ev => Events.isEnterKey(ev) ? handlePageInputChange(ev) : false
-  }), /*#__PURE__*/React.createElement(StyledPagerNoSelect, null, l.pager.ofY(pageCount))), !hasOnePage && renderButtonsAfterCount());
+  }), /*#__PURE__*/React.createElement(StyledPagerNoSelect, null, l.pager.ofY(pageCount))) : /*#__PURE__*/React.createElement(StyledPagerNavLabel, {
+    "data-element": "current-page-label",
+    id: currentPageId,
+    "aria-live": "polite"
+  }, navLabelString)), !hasOnePage && renderButtonsAfterCount());
 };
 
 PagerNavigation.propTypes = {
   "currentPage": PropTypes.number.isRequired,
   "hideDisabledElements": PropTypes.bool,
+  "interactivePageNumber": PropTypes.bool,
   "onFirst": PropTypes.func,
   "onLast": PropTypes.func,
   "onNext": PropTypes.func,

package/esm/components/pager/pager.component.d.ts

@@ -16,6 +16,8 @@ export interface PagerProps {
     onLast?: (ev: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => void;
     /** Current visible page */
     currentPage?: number | string;
+    /** If true, page number navigation will be changed to a non-interactive label */
+    interactivePageNumber?: boolean;
     /** If true, sets css property visibility: hidden on all disabled elements  */
     hideDisabledElements?: boolean;
     /** Total number of records */
@@ -41,5 +43,5 @@ export interface PagerProps {
     /** What variant the Pager background should be */
     variant?: "default" | "alternate";
 }
-export declare const Pager: ({ currentPage, hideDisabledElements, pageSizeSelectionOptions, pageSize, showPageSizeSelection, totalRecords, onPagination, onNext, onFirst, onPrevious, onLast, showPageSizeLabelBefore, showPageSizeLabelAfter, showTotalRecords, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, variant, ...rest }: PagerProps) => JSX.Element;
+export declare const Pager: ({ currentPage, hideDisabledElements, interactivePageNumber, pageSizeSelectionOptions, pageSize, showPageSizeSelection, totalRecords, onPagination, onNext, onFirst, onPrevious, onLast, showPageSizeLabelBefore, showPageSizeLabelAfter, showTotalRecords, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, variant, ...rest }: PagerProps) => JSX.Element;
 export default Pager;

package/esm/components/pager/pager.component.js

@@ -12,6 +12,7 @@ import Events from "../../__internal__/utils/helpers/events";
 const Pager = ({
   currentPage = 1,
   hideDisabledElements = false,
+  interactivePageNumber = true,
   pageSizeSelectionOptions = [{
     id: "10",
     name: 10
@@ -137,6 +138,7 @@ const Pager = ({
   }, rest), /*#__PURE__*/React.createElement(StyledPagerSizeOptions, null, renderPageSizeOptions()), /*#__PURE__*/React.createElement(PagerNavigation, {
     pageSize: currentPageSize,
     currentPage: page,
+    interactivePageNumber: interactivePageNumber,
     hideDisabledElements: hideDisabledElements,
     setCurrentPage: setPage,
     onNext: handleOnNext,
@@ -154,6 +156,7 @@ const Pager = ({
 Pager.propTypes = {
   "currentPage": PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   "hideDisabledElements": PropTypes.bool,
+  "interactivePageNumber": PropTypes.bool,
   "onFirst": PropTypes.func,
   "onLast": PropTypes.func,
   "onNext": PropTypes.func,

package/esm/components/pager/pager.style.d.ts

@@ -9,7 +9,8 @@ declare const StyledPagerSizeOptions: import("styled-components").StyledComponen
 declare const StyledPagerSizeOptionsInner: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerNavigation: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerNavInner: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const StyledPagerNavLabel: import("styled-components").StyledComponent<"label", any, {}, never>;
 declare const StyledPagerLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../link").LinkProps & import("react").RefAttributes<HTMLButtonElement | HTMLLinkElement>>, any, Pick<StyledPagerProps, "hideDisabledButtons">, never>;
 declare const StyledPagerNoSelect: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerSummary: import("styled-components").StyledComponent<"div", any, {}, never>;
-export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer, };
+export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerNavLabel, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer, };

package/esm/components/pager/pager.style.js

@@ -95,6 +95,11 @@ const StyledPagerNavInner = styled.div`
     margin-bottom: 0;
   }
 `;
+const StyledPagerNavLabel = styled.label`
+  white-space: nowrap;
+  padding: 9px 12px;
+  margin: 4px 0;
+`;
 const StyledPagerLink = styled(Link)`
   padding: 0 10px;
   margin-left: 7px;
@@ -118,4 +123,4 @@ const StyledPagerSummary = styled.div`
   flex: 1 1 30%;
   justify-content: flex-end;
 `;
-export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer };
+export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerNavLabel, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer };

package/lib/__internal__/fieldset/fieldset.component.js

@@ -39,9 +39,8 @@ const Fieldset = ({
   return /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupBehaviour, {
     blockGroupBehaviour: blockGroupBehaviour
   }, /*#__PURE__*/_react.default.createElement(_fieldset.StyledFieldset, _extends({
-    "data-component": "fieldset",
-    m: 0
-  }, marginProps, rest), legend && /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupContext.Consumer, null, ({
+    "data-component": "fieldset"
+  }, rest, marginProps), legend && /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupContext.Consumer, null, ({
     onMouseEnter,
     onMouseLeave
   }) => /*#__PURE__*/_react.default.createElement(_fieldset.StyledLegend, {

package/lib/__internal__/fieldset/fieldset.style.js

@@ -18,6 +18,7 @@ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 const StyledFieldset = _styledComponents.default.fieldset`
+  margin: 0;
   ${_styledSystem.margin}
   border: none;
   padding: 0;

package/lib/components/fieldset/fieldset.component.js

@@ -44,9 +44,7 @@ const Fieldset = ({
     value: {
       validationRedesignOptIn: false
     }
-  }, /*#__PURE__*/_react.default.createElement(_fieldset.FieldsetStyle, _extends({}, (0, _tags.default)("fieldset", rest), rest, {
-    m: 0
-  }, marginProps), /*#__PURE__*/_react.default.createElement(_fieldset.FieldsetContentStyle, {
+  }, /*#__PURE__*/_react.default.createElement(_fieldset.FieldsetStyle, _extends({}, (0, _tags.default)("fieldset", rest), rest, marginProps), /*#__PURE__*/_react.default.createElement(_fieldset.FieldsetContentStyle, {
     "data-component": "fieldset-style",
     inline: inline
   }, getLegend(), /*#__PURE__*/_react.default.createElement(_formSpacingProvider.default, {

package/lib/components/fieldset/fieldset.style.js

@@ -22,6 +22,7 @@ var _checkbox = _interopRequireDefault(require("../checkbox/checkbox.style"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const FieldsetStyle = _styledComponents.default.fieldset`
+  margin: 0;
   ${_styledSystem.margin}
   border: none;
   padding: 0;

package/lib/components/pager/__internal__/pager-navigation.component.d.ts

@@ -23,8 +23,10 @@ export interface PagerNavigationProps {
     showPreviousAndNextButtons?: boolean;
     /** Should the page count input be shown */
     showPageCount?: boolean;
+    /** If true, page number navigation will be changed to a non-interactive label */
+    interactivePageNumber?: boolean;
     /** If true, sets css property visibility: hidden on all disabled elements  */
     hideDisabledElements?: boolean;
 }
-declare const PagerNavigation: ({ pageSize, currentPage, setCurrentPage, onNext, onPrevious, onFirst, onLast, onPagination, pageCount, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, hideDisabledElements, }: PagerNavigationProps) => JSX.Element;
+declare const PagerNavigation: ({ pageSize, currentPage, setCurrentPage, onNext, onPrevious, onFirst, onLast, onPagination, pageCount, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, interactivePageNumber, hideDisabledElements, }: PagerNavigationProps) => JSX.Element;
 export default PagerNavigation;

package/lib/components/pager/__internal__/pager-navigation.component.js

@@ -42,11 +42,13 @@ const PagerNavigation = ({
   showFirstAndLastButtons = true,
   showPreviousAndNextButtons = true,
   showPageCount = true,
+  interactivePageNumber = true,
   hideDisabledElements = false
 }) => {
   const l = (0, _useLocale.default)();
   const guid = (0, _react.useRef)((0, _guid.default)());
   const currentPageId = `Pager_${guid.current}`;
+  const navLabelString = `${l.pager.pageX()} ${currentPage.toString()} ${l.pager.ofY(pageCount)}`;
   const hasOnePage = pageCount <= 1;
   const hasTwoPages = pageCount === 2;
   const pagerNavigationProps = {
@@ -106,7 +108,7 @@ const PagerNavigation = ({
     onClick: onLast
   }, pagerNavigationProps)));
 
-  return /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNavigation, null, !hasOnePage && renderButtonsBeforeCount(), showPageCount && /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNavInner, null, /*#__PURE__*/_react.default.createElement("label", {
+  return /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNavigation, null, !hasOnePage && renderButtonsBeforeCount(), showPageCount && (interactivePageNumber ? /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNavInner, null, /*#__PURE__*/_react.default.createElement("label", {
     htmlFor: currentPageId
   }, /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNoSelect, null, l.pager.pageX())), /*#__PURE__*/_react.default.createElement(_number.default, {
     value: currentPage.toString(),
@@ -115,12 +117,17 @@ const PagerNavigation = ({
     onBlur: handlePageInputChange,
     id: currentPageId,
     onKeyUp: ev => _events.default.isEnterKey(ev) ? handlePageInputChange(ev) : false
-  }), /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNoSelect, null, l.pager.ofY(pageCount))), !hasOnePage && renderButtonsAfterCount());
+  }), /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNoSelect, null, l.pager.ofY(pageCount))) : /*#__PURE__*/_react.default.createElement(_pager.StyledPagerNavLabel, {
+    "data-element": "current-page-label",
+    id: currentPageId,
+    "aria-live": "polite"
+  }, navLabelString)), !hasOnePage && renderButtonsAfterCount());
 };
 
 PagerNavigation.propTypes = {
   "currentPage": _propTypes.default.number.isRequired,
   "hideDisabledElements": _propTypes.default.bool,
+  "interactivePageNumber": _propTypes.default.bool,
   "onFirst": _propTypes.default.func,
   "onLast": _propTypes.default.func,
   "onNext": _propTypes.default.func,

package/lib/components/pager/pager.component.d.ts

@@ -16,6 +16,8 @@ export interface PagerProps {
     onLast?: (ev: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => void;
     /** Current visible page */
     currentPage?: number | string;
+    /** If true, page number navigation will be changed to a non-interactive label */
+    interactivePageNumber?: boolean;
     /** If true, sets css property visibility: hidden on all disabled elements  */
     hideDisabledElements?: boolean;
     /** Total number of records */
@@ -41,5 +43,5 @@ export interface PagerProps {
     /** What variant the Pager background should be */
     variant?: "default" | "alternate";
 }
-export declare const Pager: ({ currentPage, hideDisabledElements, pageSizeSelectionOptions, pageSize, showPageSizeSelection, totalRecords, onPagination, onNext, onFirst, onPrevious, onLast, showPageSizeLabelBefore, showPageSizeLabelAfter, showTotalRecords, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, variant, ...rest }: PagerProps) => JSX.Element;
+export declare const Pager: ({ currentPage, hideDisabledElements, interactivePageNumber, pageSizeSelectionOptions, pageSize, showPageSizeSelection, totalRecords, onPagination, onNext, onFirst, onPrevious, onLast, showPageSizeLabelBefore, showPageSizeLabelAfter, showTotalRecords, showFirstAndLastButtons, showPreviousAndNextButtons, showPageCount, variant, ...rest }: PagerProps) => JSX.Element;
 export default Pager;

package/lib/components/pager/pager.component.js

@@ -32,6 +32,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 const Pager = ({
   currentPage = 1,
   hideDisabledElements = false,
+  interactivePageNumber = true,
   pageSizeSelectionOptions = [{
     id: "10",
     name: 10
@@ -157,6 +158,7 @@ const Pager = ({
   }, rest), /*#__PURE__*/_react.default.createElement(_pager.StyledPagerSizeOptions, null, renderPageSizeOptions()), /*#__PURE__*/_react.default.createElement(_pagerNavigation.default, {
     pageSize: currentPageSize,
     currentPage: page,
+    interactivePageNumber: interactivePageNumber,
     hideDisabledElements: hideDisabledElements,
     setCurrentPage: setPage,
     onNext: handleOnNext,
@@ -175,6 +177,7 @@ exports.Pager = Pager;
 Pager.propTypes = {
   "currentPage": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
   "hideDisabledElements": _propTypes.default.bool,
+  "interactivePageNumber": _propTypes.default.bool,
   "onFirst": _propTypes.default.func,
   "onLast": _propTypes.default.func,
   "onNext": _propTypes.default.func,

package/lib/components/pager/pager.style.d.ts

@@ -9,7 +9,8 @@ declare const StyledPagerSizeOptions: import("styled-components").StyledComponen
 declare const StyledPagerSizeOptionsInner: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerNavigation: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerNavInner: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const StyledPagerNavLabel: import("styled-components").StyledComponent<"label", any, {}, never>;
 declare const StyledPagerLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../link").LinkProps & import("react").RefAttributes<HTMLButtonElement | HTMLLinkElement>>, any, Pick<StyledPagerProps, "hideDisabledButtons">, never>;
 declare const StyledPagerNoSelect: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const StyledPagerSummary: import("styled-components").StyledComponent<"div", any, {}, never>;
-export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer, };
+export { StyledPagerContainer, StyledPagerSizeOptions, StyledPagerSizeOptionsInner, StyledPagerNavigation, StyledPagerNavInner, StyledPagerNavLabel, StyledPagerLink, StyledPagerNoSelect, StyledPagerSummary, StyledSelectContainer, };

package/lib/components/pager/pager.style.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledSelectContainer = exports.StyledPagerSummary = exports.StyledPagerNoSelect = exports.StyledPagerLink = exports.StyledPagerNavInner = exports.StyledPagerNavigation = exports.StyledPagerSizeOptionsInner = exports.StyledPagerSizeOptions = exports.StyledPagerContainer = void 0;
+exports.StyledSelectContainer = exports.StyledPagerSummary = exports.StyledPagerNoSelect = exports.StyledPagerLink = exports.StyledPagerNavLabel = exports.StyledPagerNavInner = exports.StyledPagerNavigation = exports.StyledPagerSizeOptionsInner = exports.StyledPagerSizeOptions = exports.StyledPagerContainer = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
@@ -121,6 +121,12 @@ const StyledPagerNavInner = _styledComponents.default.div`
   }
 `;
 exports.StyledPagerNavInner = StyledPagerNavInner;
+const StyledPagerNavLabel = _styledComponents.default.label`
+  white-space: nowrap;
+  padding: 9px 12px;
+  margin: 4px 0;
+`;
+exports.StyledPagerNavLabel = StyledPagerNavLabel;
 const StyledPagerLink = (0, _styledComponents.default)(_link.default)`
   padding: 0 10px;
   margin-left: 7px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "117.2.1",
+  "version": "117.3.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",