@thecb/components 11.11.2 → 11.11.4

package/dist/index.cjs.js

@@ -15099,7 +15099,8 @@ var AutopayOnIcon = function AutopayOnIcon(_ref) {
     xmlns: "http://www.w3.org/2000/svg",
     width: "12",
     height: "13",
-    viewBox: "0 0 12 13"
+    viewBox: "0 0 12 13",
+    "aria-hidden": "true"
   }, /*#__PURE__*/React__default.createElement("g", {
     fill: "none",
     fillRule: "evenodd",
@@ -46144,7 +46145,8 @@ var IconsModule = function IconsModule(_ref) {
     Icon = iconsMap[icon];
   }
   return /*#__PURE__*/React__default.createElement(Box, {
-    padding: "0 1rem 0 0"
+    padding: "0 1rem 0 0",
+    "aria-hidden": "true"
   }, /*#__PURE__*/React__default.createElement(Cluster, {
     justify: "center",
     align: "center"
@@ -46228,7 +46230,6 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
     } : navigateToSettings,
     isLoading: deactivatingSchedule
   };
-  var modalLinkHoverFocus = "\n    outline: none;\n    cursor: pointer;\n    text-decoration: underline;\n    text-decoration-color: #317D4F;\n  ";
   var hoverStyles = "text-decoration: underline;";
   var activeStyles = "text-decoration: underline;";
   var renderAutoPayControl = function renderAutoPayControl() {
@@ -46263,28 +46264,25 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
         {
           return /*#__PURE__*/React__default.createElement(Box, {
             padding: "0",
+            role: "button",
+            tabIndex: "0",
             onClick: onClick || function () {
               toggleModal(true);
             },
+            onKeyDown: onKeyPress || function (e) {
+              e.key === "Enter" && toggleModal(true);
+            },
             hoverStyles: hoverStyles,
             activeStyles: activeStyles,
-            extraStyles: "cursor: pointer;"
+            extraStyles: "cursor: pointer; margin-bottom: 5px;",
+            dataQa: "".concat(shortPlan, " On")
           }, /*#__PURE__*/React__default.createElement(Cluster, {
             justify: isMobile ? "flex-start" : "flex-end",
             align: "center"
           }, /*#__PURE__*/React__default.createElement(AutopayOnIcon, null), /*#__PURE__*/React__default.createElement(Text$1, {
             variant: "pS",
-            onClick: onClick || function () {
-              return toggleModal(true);
-            },
-            onKeyPress: onKeyPress || function (e) {
-              e.key === "Enter" && toggleModal(true);
-            },
-            tabIndex: "0",
-            dataQa: "".concat(shortPlan, " On"),
             color: SEA_GREEN,
             weight: FONT_WEIGHT_REGULAR,
-            hoverStyles: modalLinkHoverFocus,
             extraStyles: "padding-left: 0.25rem;",
             disabled: disableActions
           }, "".concat(shortPlan, " ").concat(nextAutopayDate))));