@thecb/components 10.5.1-beta.1 → 10.5.1-beta.2

package/dist/index.esm.js

@@ -46495,6 +46495,8 @@ var CancelButton = function CancelButton(_ref) {
     cancelAction = _ref$cancelAction === void 0 ? noop : _ref$cancelAction,
     _ref$cancelButtonText = _ref.cancelButtonText,
     cancelButtonText = _ref$cancelButtonText === void 0 ? "" : _ref$cancelButtonText,
+    _ref$cancelButtonVari = _ref.cancelButtonVariant,
+    cancelButtonVariant = _ref$cancelButtonVari === void 0 ? "secondary" : _ref$cancelButtonVari,
     _ref$hideModal = _ref.hideModal,
     hideModal = _ref$hideModal === void 0 ? noop : _ref$hideModal,
     _ref$isMobile = _ref.isMobile,
@@ -46511,7 +46513,7 @@ var CancelButton = function CancelButton(_ref) {
     role: "button",
     text: cancelButtonText,
     textExtraStyles: "".concat(fontSize),
-    variant: "secondary"
+    variant: cancelButtonVariant
   });
 };
 
@@ -46549,6 +46551,8 @@ var ContinueButton = function ContinueButton(_ref) {
     continueButtonText = _ref$continueButtonTe === void 0 ? "" : _ref$continueButtonTe,
     _ref$continueURL = _ref.continueURL,
     continueURL = _ref$continueURL === void 0 ? "" : _ref$continueURL,
+    _ref$continueButtonVa = _ref.continueButtonVariant,
+    continueButtonVariant = _ref$continueButtonVa === void 0 ? "primary" : _ref$continueButtonVa,
     _ref$isContinueAction = _ref.isContinueActionDisabled,
     isContinueActionDisabled = _ref$isContinueAction === void 0 ? false : _ref$isContinueAction,
     _ref$isLoading = _ref.isLoading,
@@ -46574,7 +46578,7 @@ var ContinueButton = function ContinueButton(_ref) {
     text: continueButtonText,
     textExtraStyles: "".concat(fontSize),
     url: continueURL,
-    variant: useDangerButton ? "danger" : "primary"
+    variant: useDangerButton ? "danger" : continueButtonVariant
   });
 };
 
@@ -62818,13 +62822,13 @@ var CloseIconButton = function CloseIconButton(_ref) {
     _ref$iconHeight = _ref.iconHeight,
     iconHeight = _ref$iconHeight === void 0 ? "24" : _ref$iconHeight,
     _ref$ariaLabel = _ref.ariaLabel,
-    ariaLabel = _ref$ariaLabel === void 0 ? "" : _ref$ariaLabel;
+    ariaLabel = _ref$ariaLabel === void 0 ? "Close Modal" : _ref$ariaLabel;
   return /*#__PURE__*/React.createElement(ButtonWithAction, {
     variant: "smallGhost",
     action: hideModal,
     contentOverride: true,
     extraStyles: buttonExtraStyles,
-    "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : "Close Modal"
+    "aria-label": ariaLabel
   }, /*#__PURE__*/React.createElement(CloseIcon, {
     role: "img",
     "aria-hidden": "true",
@@ -62855,6 +62859,8 @@ var Modal$2 = function Modal(_ref) {
     cancelAction = _ref$cancelAction === void 0 ? noop : _ref$cancelAction,
     _ref$cancelButtonText = _ref.cancelButtonText,
     cancelButtonText = _ref$cancelButtonText === void 0 ? "Cancel" : _ref$cancelButtonText,
+    _ref$cancelButtonVari = _ref.cancelButtonVariant,
+    cancelButtonVariant = _ref$cancelButtonVari === void 0 ? "secondary" : _ref$cancelButtonVari,
     _ref$children = _ref.children,
     children = _ref$children === void 0 ? [] : _ref$children,
     _ref$closeButtonText = _ref.closeButtonText,
@@ -62865,6 +62871,8 @@ var Modal$2 = function Modal(_ref) {
     continueButtonText = _ref$continueButtonTe === void 0 ? "Continue" : _ref$continueButtonTe,
     _ref$continueURL = _ref.continueURL,
     continueURL = _ref$continueURL === void 0 ? "" : _ref$continueURL,
+    _ref$continueButtonVa = _ref.continueButtonVariant,
+    continueButtonVariant = _ref$continueButtonVa === void 0 ? "primary" : _ref$continueButtonVa,
     _ref$customWidth = _ref.customWidth,
     customWidth = _ref$customWidth === void 0 ? "" : _ref$customWidth,
     _ref$dataQa = _ref.dataQa,
@@ -62965,7 +62973,7 @@ var Modal$2 = function Modal(_ref) {
     padding: "".concat(SPACING.XS, " ").concat(SPACING.MD)
   }, /*#__PURE__*/React.createElement(Cluster, {
     justify: showCloseIconButton ? "space-between" : "flex-start",
-    align: "center",
+    align: showCloseIconButton && isMobile ? "flex-start" : "center",
     nowrap: true
   }, /*#__PURE__*/React.createElement(Title$1, {
     as: "h2",
@@ -62973,9 +62981,7 @@ var Modal$2 = function Modal(_ref) {
     fontSize: isMobile ? FONT_SIZE.MD : FONT_SIZE.LG
   }, modalHeaderText), showCloseIconButton && /*#__PURE__*/React.createElement(CloseIconButton, {
     hideModal: hideModal,
-    iconWidth: isMobile ? "20" : "24",
-    iconHeight: isMobile ? "20" : "24",
-    buttonExtraStyles: "\n                      min-height: auto;\n                      min-width: auto;\n                      height: 1.5rem;\n                      margin: 0;\n                      &:focus {\n                        outline-offset: -3px;\n                      }\n                  "
+    buttonExtraStyles: "\n                      min-height: auto;\n                      min-width: auto;\n                      height: 1.5rem;\n                      margin: 0 0 0 0.5rem;\n                      &:focus {\n                        outline-offset: -3px;\n                      }\n                  "
   }))), /*#__PURE__*/React.createElement(Box, {
     background: modalBodyBg || ATHENS_GREY,
     padding: "0"
@@ -62994,6 +63000,7 @@ var Modal$2 = function Modal(_ref) {
     buttonExtraStyles: buttonExtraStyles,
     cancelAction: cancelAction,
     cancelButtonText: cancelButtonText,
+    cancelButtonVariant: cancelButtonVariant,
     hideModal: hideModal,
     isMobile: isMobile,
     key: "cancel"
@@ -63002,6 +63009,7 @@ var Modal$2 = function Modal(_ref) {
     continueAction: continueAction,
     continueButtonText: continueButtonText,
     continueURL: continueURL,
+    continueButtonVariant: continueButtonVariant,
     isContinueActionDisabled: isContinueActionDisabled,
     isLoading: isLoading,
     isMobile: isMobile,