@thecb/components 7.8.2-beta.5 → 7.8.2-beta.6

package/dist/index.esm.js

@@ -46659,7 +46659,7 @@ var Pagination = function Pagination(_ref3) {
       isMobile = _useContext.isMobile;
 
   var extraStyles = "\n    min-width: ".concat(buttonWidth, "; min-height: 100%; padding: 0;\n    border-radius: ").concat(borderRadius, ";\n    &:hover, &:focus {\n      text-decoration: none;\n      > * > span {\n        text-decoration: none;\n      }\n    }\n    > * > span {\n      color: ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor, "\n    }\n    margin: 0;\n    &:hover {\n        background-color: ").concat(themeValues.hoverBackgroundColor, "\n    }\n  ");
-  var extraDisabledStyles = "\n    border: ".concat(activeBorderWidth, " solid ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor, ";\n    color: ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.activeColor, ";\n    background-color: ").concat(themeValues.activeBackgroundColor, ";\n    &:focus {\n      box-shadow: none;\n    }\n    &:hover {\n      background-color: initial;\n    }\n  ");
+  var currentPageStyles = "\n    border: ".concat(activeBorderWidth, " solid ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor, ";\n    color: ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.activeColor, ";\n    background-color: ").concat(themeValues.activeBackgroundColor, ";\n    &:focus {\n      box-shadow: none;\n    }\n    &:hover {\n      background-color: initial;\n      border: ").concat(activeBorderWidth, " solid ").concat(numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor, ";\n      background-color: ").concat(themeValues.activeBackgroundColor, ";\n    }\n  ");
   return /*#__PURE__*/React.createElement(Cluster, {
     justify: "center",
     childGap: childGap,
@@ -46671,7 +46671,7 @@ var Pagination = function Pagination(_ref3) {
     extraStyles: "> ul { padding: 0px; > li { list-style-type: none; } };"
   }, currentPage > 1 ? /*#__PURE__*/React.createElement(PrevNextButton, {
     action: pagePrevious,
-    ariaLabel: "Previous Page Button",
+    ariaLabel: "Previous Page",
     arrowColor: arrowColor !== null && arrowColor !== void 0 ? arrowColor : themeValues.arrowColor,
     borderRadius: borderRadius,
     buttonHeight: buttonHeight,
@@ -46699,17 +46699,15 @@ var Pagination = function Pagination(_ref3) {
     }, /*#__PURE__*/React.createElement(ButtonWithAction, {
       variant: "ghost",
       text: item.index,
-      disabled: item.active,
-      extraDisabledStyles: extraDisabledStyles,
       "aria-current": item.active ? "page" : undefined,
-      "aria-label": "".concat(item.active ? "Current " : "", "Page ").concat(item.index, " Button"),
+      "aria-label": "".concat(item.index == pageCount ? "Last Page, " : "", "page ").concat(item.index),
       action: !item.active ? function () {
         return setCurrentPage({
           pageNumber: item.index
         });
       } : noop,
       textExtraStyles: "font-size: ".concat(fontSize, "; font-weight: ").concat(fontWeight, ";"),
-      extraStyles: extraStyles,
+      extraStyles: "".concat(extraStyles).concat(item.active ? currentPageStyles : ""),
       dataQa: index
     }, item.index)) : /*#__PURE__*/React.createElement(Box, {
       padding: "0 10px",
@@ -46720,11 +46718,12 @@ var Pagination = function Pagination(_ref3) {
     }, /*#__PURE__*/React.createElement(Text$1, {
       variant: "pXL",
       weight: fontWeight,
-      color: numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor
+      color: numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor,
+      "aria-label": "ellipsis"
     }, "...")));
   }), currentPage < pageCount ? /*#__PURE__*/React.createElement(PrevNextButton, {
     action: pageNext,
-    ariaLabel: "Next Page Button",
+    ariaLabel: "Next Page",
     arrowColor: arrowColor !== null && arrowColor !== void 0 ? arrowColor : themeValues.arrowColor,
     borderRadius: borderRadius,
     buttonHeight: buttonHeight,