@thecb/components 12.1.0-beta.4 → 12.1.0-beta.7

package/dist/index.cjs.js

@@ -22156,7 +22156,7 @@ var ENTER = 13;
 var ESCAPE = 27;
 var SPACEBAR = 32;
 
-var _excluded$x = ["title", "name", "checked", "onChange", "disabled", "themeValues", "hidden", "error", "isRequired", "checkboxMargin", "extraStyles", "textExtraStyles", "labelledById", "dataQa", "checkboxExtraStyles", "hasIconOverride", "icon"];
+var _excluded$x = ["title", "name", "checked", "onChange", "disabled", "themeValues", "hidden", "error", "isRequired", "checkboxMargin", "extraStyles", "textExtraStyles", "labelledById", "dataQa", "checkboxExtraStyles", "hasIconOverride", "customAriaLabel", "icon"];
 var CheckboxContainer = styled__default.span.withConfig({
   displayName: "Checkbox__CheckboxContainer",
   componentId: "sc-36kqbv-0"
@@ -22227,6 +22227,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
     checkboxExtraStyles = _ref5.checkboxExtraStyles,
     _ref5$hasIconOverride = _ref5.hasIconOverride,
     hasIconOverride = _ref5$hasIconOverride === void 0 ? false : _ref5$hasIconOverride,
+    customAriaLabel = _ref5.customAriaLabel,
     Icon = _ref5.icon,
     rest = _objectWithoutProperties(_ref5, _excluded$x);
   var _useState = React.useState(false),
@@ -22263,7 +22264,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
     tabIndex: "0",
     required: isRequired,
     "aria-invalid": error,
-    "aria-label": ariaLabel,
+    "aria-label": customAriaLabel || ariaLabel,
     "aria-labelledby": labelledById,
     "aria-describedby": error ? "".concat(name, "-error-message") : undefined,
     onKeyDown: function onKeyDown(e) {
@@ -48109,7 +48110,9 @@ var TermsAndConditionsModal = function TermsAndConditionsModal(_ref) {
     linkVariant = _ref$linkVariant === void 0 ? "p" : _ref$linkVariant,
     themeValues = _ref.themeValues,
     _ref$initialFocusSele = _ref.initialFocusSelector,
-    initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele;
+    initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele,
+    _ref$linkExtraStyles = _ref.linkExtraStyles,
+    linkExtraStyles = _ref$linkExtraStyles === void 0 ? "" : _ref$linkExtraStyles;
   return /*#__PURE__*/React__default.createElement(Modal$3, {
     modalOpen: isOpen,
     hideModal: function hideModal() {
@@ -48150,7 +48153,7 @@ var TermsAndConditionsModal = function TermsAndConditionsModal(_ref) {
     weight: themeValues.fontWeight,
     hoverStyles: themeValues.modalLinkHoverFocus,
     textDecoration: themeValues.modalLinkTextDecoration,
-    extraStyles: "display: inline-block; width: fit-content; cursor: pointer; min-height: 24px; line-height: 24px;",
+    extraStyles: "display: inline-block; width: fit-content; cursor: pointer; min-height: 24px; line-height: 24px; ".concat(linkExtraStyles),
     role: "button" // This should always be a "button" since it opens a modal
     ,
     className: "modal-trigger"
@@ -48461,6 +48464,7 @@ var PaymentFormACH = function PaymentFormACH(_ref) {
   }), showWalletCheckbox && /*#__PURE__*/React__default.createElement(Checkbox$1, {
     name: "bank checkbox",
     dataQa: "Save checking account to wallet",
+    customAriaLabel: "Save checking account to wallet (optional).",
     title: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "Save checking account to wallet (optional).", " ", showTerms && /*#__PURE__*/React__default.createElement("span", {
       onClick: function onClick(e) {
         return e.stopPropagation();
@@ -48470,7 +48474,8 @@ var PaymentFormACH = function PaymentFormACH(_ref) {
       terms: termsContent,
       isOpen: showTermsModal,
       toggleOpen: toggleTermsModal,
-      initialFocusSelector: ".modal-close-button"
+      initialFocusSelector: ".modal-close-button",
+      linkExtraStyles: "display: inline-block;"
     }))),
     checked: walletCheckboxMarked,
     onChange: saveToWallet
@@ -48665,6 +48670,7 @@ var PaymentFormCard = function PaymentFormCard(_ref) {
   })), showWalletCheckbox && /*#__PURE__*/React__default.createElement(Checkbox$1, {
     name: "credit card checkbox",
     dataQa: "Save credit card to wallet",
+    customAriaLabel: "Save credit card to wallet (optional).",
     title: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "Save credit card to wallet (optional).", " ", showTerms && /*#__PURE__*/React__default.createElement("span", {
       onClick: function onClick(e) {
         return e.stopPropagation();
@@ -48674,7 +48680,8 @@ var PaymentFormCard = function PaymentFormCard(_ref) {
       terms: termsContent,
       isOpen: showTermsModal,
       toggleOpen: toggleTermsModal,
-      initialFocusSelector: ".modal-close-button"
+      initialFocusSelector: ".modal-close-button",
+      linkExtraStyles: "display: inline-block;"
     }))),
     checked: walletCheckboxMarked,
     onChange: saveToWallet