@thecb/components 7.7.4-beta.5 → 7.7.4-beta.7

package/dist/index.cjs.js

@@ -45685,12 +45685,10 @@ var arrowColor = WHITE;
 var numberColor = MATISSE_BLUE;
 var hoverBackgroundColor$2 = ALABASTER_WHITE;
 var activeBackgroundColor$1 = WHITE;
-var activeBorderColor$1 = MATISSE_BLUE;
 var activeColor$8 = MATISSE_BLUE;
 var fallbackValues$J = {
   activeColor: activeColor$8,
   activeBackgroundColor: activeBackgroundColor$1,
-  activeBorderColor: activeBorderColor$1,
   arrowColor: arrowColor,
   hoverBackgroundColor: hoverBackgroundColor$2,
   numberColor: numberColor
@@ -45790,11 +45788,11 @@ var Pagination = function Pagination(_ref3) {
       _ref3$borderRadius = _ref3.borderRadius,
       borderRadius = _ref3$borderRadius === void 0 ? "3px" : _ref3$borderRadius,
       _ref3$buttonHeight = _ref3.buttonHeight,
-      buttonHeight = _ref3$buttonHeight === void 0 ? "40px" : _ref3$buttonHeight,
+      buttonHeight = _ref3$buttonHeight === void 0 ? "44px" : _ref3$buttonHeight,
       _ref3$buttonWidth = _ref3.buttonWidth,
-      buttonWidth = _ref3$buttonWidth === void 0 ? "40px" : _ref3$buttonWidth,
+      buttonWidth = _ref3$buttonWidth === void 0 ? "44px" : _ref3$buttonWidth,
       _ref3$childGap = _ref3.childGap,
-      childGap = _ref3$childGap === void 0 ? "10px" : _ref3$childGap,
+      childGap = _ref3$childGap === void 0 ? "24px" : _ref3$childGap,
       currentPage = _ref3.currentPage,
       _ref3$fontSize = _ref3.fontSize,
       fontSize = _ref3$fontSize === void 0 ? "17px" : _ref3$fontSize,
@@ -45824,10 +45822,10 @@ var Pagination = function Pagination(_ref3) {
   }) : isMobile && /*#__PURE__*/React__default.createElement(PrevNextPlaceholder, {
     buttonHeight: buttonHeight,
     buttonWidth: buttonWidth
-  }), isMobile ? /*#__PURE__*/React__default.createElement(Box, {
+  }), isMobile ? pageCount > 0 && /*#__PURE__*/React__default.createElement(Box, {
     padding: "0"
-  }, /*#__PURE__*/React__default.createElement(Cluster, {
-    justify: "flex-end"
+  }, /*#__PURE__*/React__default.createElement(Cover, {
+    singleChild: true
   }, /*#__PURE__*/React__default.createElement(Text$1, {
     variant: "pXL",
     weight: fontWeight,
@@ -45842,14 +45840,14 @@ var Pagination = function Pagination(_ref3) {
       key: item.index,
       text: item.index,
       disabled: item.active,
-      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            "),
+      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                  "),
       action: !item.active ? function () {
         return setCurrentPage({
           pageNumber: item.index
         });
       } : noop,
       textExtraStyles: "font-size: ".concat(fontSize, "; font-weight: ").concat(fontWeight, ";"),
-      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              &:focus {\n                outline: none\n              }\n            "),
+      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                    &:focus {\n                      outline: none\n                    }\n                  "),
       dataQa: index
     }, item.index)) : /*#__PURE__*/React__default.createElement(Box, {
       padding: "0 10px"
@@ -45859,8 +45857,7 @@ var Pagination = function Pagination(_ref3) {
       key: index,
       variant: "pXL",
       weight: fontWeight,
-      color: numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor,
-      extraStyles: "font-size: ".concat(fontSize)
+      color: numberColor !== null && numberColor !== void 0 ? numberColor : themeValues.numberColor
     }, "...")));
   }), currentPage < pageCount ? /*#__PURE__*/React__default.createElement(PrevNextButton, {
     action: pageNext,