@thecb/components 11.2.4-beta.0 → 11.2.4-beta.1

package/dist/index.cjs.js

@@ -22266,7 +22266,7 @@ var StyledExternalLink = styled__default( /*#__PURE__*/React.forwardRef(function
 })).withConfig({
   displayName: "ExternalLinkstyled__StyledExternalLink",
   componentId: "sc-m1q2m2-0"
-})(["display:flex;font-size:", ";color:", ";font-weight:", ";font-family:", ";line-height:", ";text-decoration:", ";&:hover{color:", ";}&:focus{outline:3px solid ", ";outline-offset:2px;}&:active{color:", ";}", ""], function (_ref2) {
+})(["display:flex;font-size:", ";color:", ";font-weight:", ";font-family:", ";line-height:", ";text-decoration:", ";&:hover{color:", ";text-decoration:", ";}&:focus{outline:3px solid ", ";outline-offset:2px;text-decoration:", ";}&:active{color:", ";}", ""], function (_ref2) {
   var size = _ref2.size;
   return size;
 }, function (_ref3) {
@@ -22281,14 +22281,17 @@ var StyledExternalLink = styled__default( /*#__PURE__*/React.forwardRef(function
 }, function (_ref6) {
   var lineheight = _ref6.lineheight;
   return lineheight;
-}, LINK_TEXT_DECORATION$3, function (_ref7) {
-  var hoverColor = _ref7.hoverColor;
+}, function (_ref7) {
+  var isUnderlined = _ref7.isUnderlined;
+  return isUnderlined ? LINK_TEXT_DECORATION$3 : "none";
+}, function (_ref8) {
+  var hoverColor = _ref8.hoverColor;
   return hoverColor;
-}, ROYAL_BLUE$1, function (_ref8) {
-  var activeColor = _ref8.activeColor;
+}, LINK_TEXT_DECORATION$3, ROYAL_BLUE$1, LINK_TEXT_DECORATION$3, function (_ref9) {
+  var activeColor = _ref9.activeColor;
   return activeColor;
-}, function (_ref9) {
-  var extrastyles = _ref9.extrastyles;
+}, function (_ref10) {
+  var extrastyles = _ref10.extrastyles;
   return extrastyles;
 });
 /* eslint-enable no-unused-vars */
@@ -22314,6 +22317,8 @@ var ExternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     tabIndex = _ref$tabIndex === void 0 ? "0" : _ref$tabIndex,
     dataQa = _ref.dataQa,
     ariaLabel = _ref.ariaLabel,
+    _ref$isUnderlined = _ref.isUnderlined,
+    isUnderlined = _ref$isUnderlined === void 0 ? true : _ref$isUnderlined,
     children = _ref.children;
   var themeContext = React.useContext(styled.ThemeContext);
   var themeValues = createThemeValues(themeContext, fallbackValues$a, "Link", variant);
@@ -22346,6 +22351,7 @@ var ExternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     rel: newTab ? "noopener" : "",
     "data-qa": dataQa,
     "aria-label": ariaLabel,
+    isUnderlined: isUnderlined,
     ref: ref
   }, safeChildren(children, /*#__PURE__*/React__default.createElement("span", null))));
 });
@@ -22373,7 +22379,7 @@ var StyledInternalLink = styled__default( /*#__PURE__*/React.forwardRef(function
 })).withConfig({
   displayName: "InternalLinkstyled__StyledInternalLink",
   componentId: "sc-cuqxud-0"
-})(["display:flex;color:", ";font-weight:", ";line-height:", ";font-size:", ";font-family:", ";margin:", ";text-decoration:", ";&:hover{color:", ";}&:focus{outline:3px solid ", ";outline-offset:2px;}&:active{color:", ";}", ""], function (_ref2) {
+})(["display:flex;color:", ";font-weight:", ";line-height:", ";font-size:", ";font-family:", ";margin:", ";text-decoration:", ";&:hover{color:", ";text-decoration:", ";}&:focus{outline:3px solid ", ";outline-offset:2px;text-decoration:", ";}&:active{color:", ";}", ""], function (_ref2) {
   var color = _ref2.color,
     active = _ref2.active,
     activeColor = _ref2.activeColor;
@@ -22393,14 +22399,17 @@ var StyledInternalLink = styled__default( /*#__PURE__*/React.forwardRef(function
 }, function (_ref7) {
   var margin = _ref7.margin;
   return margin;
-}, LINK_TEXT_DECORATION$4, function (_ref8) {
-  var hoverColor = _ref8.hoverColor;
+}, function (_ref8) {
+  var isUnderlined = _ref8.isUnderlined;
+  return isUnderlined ? LINK_TEXT_DECORATION$4 : "none";
+}, function (_ref9) {
+  var hoverColor = _ref9.hoverColor;
   return hoverColor;
-}, ROYAL_BLUE$2, function (_ref9) {
-  var activeColor = _ref9.activeColor;
+}, LINK_TEXT_DECORATION$4, ROYAL_BLUE$2, LINK_TEXT_DECORATION$4, function (_ref10) {
+  var activeColor = _ref10.activeColor;
   return activeColor;
-}, function (_ref10) {
-  var extrastyles = _ref10.extrastyles;
+}, function (_ref11) {
+  var extrastyles = _ref11.extrastyles;
   return extrastyles;
 });
 /* eslint-enable no-unused-vars */
@@ -22421,7 +22430,9 @@ var InternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     tabIndex = _ref$tabIndex === void 0 ? "0" : _ref$tabIndex,
     dataQa = _ref.dataQa,
     _ref$extraStyles = _ref.extraStyles,
-    extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles;
+    extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
+    _ref$isUnderlined = _ref.isUnderlined,
+    isUnderlined = _ref$isUnderlined === void 0 ? true : _ref$isUnderlined;
   var themeContext = React.useContext(styled.ThemeContext);
   var themeValues = createThemeValues(themeContext, fallbackValues$a, "Link", variant);
   return /*#__PURE__*/React__default.createElement(StyledInternalLink, {
@@ -22438,6 +22449,7 @@ var InternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     tabIndex: tabIndex,
     extrastyles: extraStyles,
     "data-qa": dataQa,
+    isUnderlined: isUnderlined,
     ref: ref
   }, safeChildren(children, /*#__PURE__*/React__default.createElement("span", null)));
 });
@@ -51333,7 +51345,7 @@ var ContactCard = function ContactCard(_ref) {
     background: WHITE,
     boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.25)",
     dataQa: createIdFromString(title, "contact-card"),
-    maxWidth: isMobile ? "100%" : "208px",
+    maxWidth: "100%",
     minWidth: isMobile ? "240px" : "208px",
     minHeight: "141px",
     padding: "1.5rem",
@@ -51386,7 +51398,8 @@ var ContactCard = function ContactCard(_ref) {
       dataQa: linkID,
       href: link.link,
       newTab: true,
-      extraStyles: "\n                        flex-direction: row;\n                        align-items: center;\n                        align-content: flex-start;\n                        justify-content: space-between;\n                        word-break: break-word;\n                        ".concat(TextWrapStyles, "\n                      "),
+      isUnderlined: false,
+      extraStyles: "\n                          flex-direction: row;\n                          align-items: center;\n                          align-content: flex-start;\n                          justify-content: space-between;\n                          word-break: break-word;\n                          ".concat(TextWrapStyles, "\n                        "),
       size: FONT_SIZE.SM,
       lineHeight: "1.313rem"
     }, link.text, /*#__PURE__*/React__default.createElement(ExternalLinkIcon, {
@@ -51398,7 +51411,11 @@ var ContactCard = function ContactCard(_ref) {
       to: link.link,
       dataQa: linkID,
       fontSize: FONT_SIZE.SM,
-      extraStyles: "\n                        word-break: break-word;\n                        ".concat(TextWrapStyles, "\n                      ")
+      color: linkThemeValues.externalLinkColor,
+      isUnderlined: false,
+      active: false,
+      lineheight: "1.313rem",
+      extraStyles: "\n                          word-break: break-word;\n                          ".concat(TextWrapStyles, "\n                        ")
     }, link.text));
   })))));
 };