@thecb/components 11.2.4-beta.0 → 11.2.4-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +35 -18
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +35 -18
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/link/ExternalLink.js +2 -0
- package/src/components/atoms/link/ExternalLink.styled.js +4 -1
- package/src/components/atoms/link/InternalLink.js +3 -1
- package/src/components/atoms/link/InternalLink.styled.js +4 -1
- package/src/components/molecules/contact-card/ContactCard.js +16 -11
- package/src/components/molecules/contact-card/ContactCard.stories.js +4 -0
package/dist/index.esm.js
CHANGED
|
@@ -22258,7 +22258,7 @@ var StyledExternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22258
22258
|
})).withConfig({
|
|
22259
22259
|
displayName: "ExternalLinkstyled__StyledExternalLink",
|
|
22260
22260
|
componentId: "sc-m1q2m2-0"
|
|
22261
|
-
})(["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) {
|
|
22261
|
+
})(["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) {
|
|
22262
22262
|
var size = _ref2.size;
|
|
22263
22263
|
return size;
|
|
22264
22264
|
}, function (_ref3) {
|
|
@@ -22273,14 +22273,17 @@ var StyledExternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22273
22273
|
}, function (_ref6) {
|
|
22274
22274
|
var lineheight = _ref6.lineheight;
|
|
22275
22275
|
return lineheight;
|
|
22276
|
-
},
|
|
22277
|
-
var
|
|
22276
|
+
}, function (_ref7) {
|
|
22277
|
+
var isUnderlined = _ref7.isUnderlined;
|
|
22278
|
+
return isUnderlined ? LINK_TEXT_DECORATION$3 : "none";
|
|
22279
|
+
}, function (_ref8) {
|
|
22280
|
+
var hoverColor = _ref8.hoverColor;
|
|
22278
22281
|
return hoverColor;
|
|
22279
|
-
}, ROYAL_BLUE$1, function (
|
|
22280
|
-
var activeColor =
|
|
22282
|
+
}, LINK_TEXT_DECORATION$3, ROYAL_BLUE$1, LINK_TEXT_DECORATION$3, function (_ref9) {
|
|
22283
|
+
var activeColor = _ref9.activeColor;
|
|
22281
22284
|
return activeColor;
|
|
22282
|
-
}, function (
|
|
22283
|
-
var extrastyles =
|
|
22285
|
+
}, function (_ref10) {
|
|
22286
|
+
var extrastyles = _ref10.extrastyles;
|
|
22284
22287
|
return extrastyles;
|
|
22285
22288
|
});
|
|
22286
22289
|
/* eslint-enable no-unused-vars */
|
|
@@ -22306,6 +22309,8 @@ var ExternalLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22306
22309
|
tabIndex = _ref$tabIndex === void 0 ? "0" : _ref$tabIndex,
|
|
22307
22310
|
dataQa = _ref.dataQa,
|
|
22308
22311
|
ariaLabel = _ref.ariaLabel,
|
|
22312
|
+
_ref$isUnderlined = _ref.isUnderlined,
|
|
22313
|
+
isUnderlined = _ref$isUnderlined === void 0 ? true : _ref$isUnderlined,
|
|
22309
22314
|
children = _ref.children;
|
|
22310
22315
|
var themeContext = useContext(ThemeContext);
|
|
22311
22316
|
var themeValues = createThemeValues(themeContext, fallbackValues$a, "Link", variant);
|
|
@@ -22338,6 +22343,7 @@ var ExternalLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22338
22343
|
rel: newTab ? "noopener" : "",
|
|
22339
22344
|
"data-qa": dataQa,
|
|
22340
22345
|
"aria-label": ariaLabel,
|
|
22346
|
+
isUnderlined: isUnderlined,
|
|
22341
22347
|
ref: ref
|
|
22342
22348
|
}, safeChildren(children, /*#__PURE__*/React.createElement("span", null))));
|
|
22343
22349
|
});
|
|
@@ -22365,7 +22371,7 @@ var StyledInternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22365
22371
|
})).withConfig({
|
|
22366
22372
|
displayName: "InternalLinkstyled__StyledInternalLink",
|
|
22367
22373
|
componentId: "sc-cuqxud-0"
|
|
22368
|
-
})(["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) {
|
|
22374
|
+
})(["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) {
|
|
22369
22375
|
var color = _ref2.color,
|
|
22370
22376
|
active = _ref2.active,
|
|
22371
22377
|
activeColor = _ref2.activeColor;
|
|
@@ -22385,14 +22391,17 @@ var StyledInternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22385
22391
|
}, function (_ref7) {
|
|
22386
22392
|
var margin = _ref7.margin;
|
|
22387
22393
|
return margin;
|
|
22388
|
-
},
|
|
22389
|
-
var
|
|
22394
|
+
}, function (_ref8) {
|
|
22395
|
+
var isUnderlined = _ref8.isUnderlined;
|
|
22396
|
+
return isUnderlined ? LINK_TEXT_DECORATION$4 : "none";
|
|
22397
|
+
}, function (_ref9) {
|
|
22398
|
+
var hoverColor = _ref9.hoverColor;
|
|
22390
22399
|
return hoverColor;
|
|
22391
|
-
}, ROYAL_BLUE$2, function (
|
|
22392
|
-
var activeColor =
|
|
22400
|
+
}, LINK_TEXT_DECORATION$4, ROYAL_BLUE$2, LINK_TEXT_DECORATION$4, function (_ref10) {
|
|
22401
|
+
var activeColor = _ref10.activeColor;
|
|
22393
22402
|
return activeColor;
|
|
22394
|
-
}, function (
|
|
22395
|
-
var extrastyles =
|
|
22403
|
+
}, function (_ref11) {
|
|
22404
|
+
var extrastyles = _ref11.extrastyles;
|
|
22396
22405
|
return extrastyles;
|
|
22397
22406
|
});
|
|
22398
22407
|
/* eslint-enable no-unused-vars */
|
|
@@ -22413,7 +22422,9 @@ var InternalLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22413
22422
|
tabIndex = _ref$tabIndex === void 0 ? "0" : _ref$tabIndex,
|
|
22414
22423
|
dataQa = _ref.dataQa,
|
|
22415
22424
|
_ref$extraStyles = _ref.extraStyles,
|
|
22416
|
-
extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles
|
|
22425
|
+
extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
|
|
22426
|
+
_ref$isUnderlined = _ref.isUnderlined,
|
|
22427
|
+
isUnderlined = _ref$isUnderlined === void 0 ? true : _ref$isUnderlined;
|
|
22417
22428
|
var themeContext = useContext(ThemeContext);
|
|
22418
22429
|
var themeValues = createThemeValues(themeContext, fallbackValues$a, "Link", variant);
|
|
22419
22430
|
return /*#__PURE__*/React.createElement(StyledInternalLink, {
|
|
@@ -22430,6 +22441,7 @@ var InternalLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
22430
22441
|
tabIndex: tabIndex,
|
|
22431
22442
|
extrastyles: extraStyles,
|
|
22432
22443
|
"data-qa": dataQa,
|
|
22444
|
+
isUnderlined: isUnderlined,
|
|
22433
22445
|
ref: ref
|
|
22434
22446
|
}, safeChildren(children, /*#__PURE__*/React.createElement("span", null)));
|
|
22435
22447
|
});
|
|
@@ -51325,7 +51337,7 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
51325
51337
|
background: WHITE,
|
|
51326
51338
|
boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.25)",
|
|
51327
51339
|
dataQa: createIdFromString(title, "contact-card"),
|
|
51328
|
-
maxWidth:
|
|
51340
|
+
maxWidth: "100%",
|
|
51329
51341
|
minWidth: isMobile ? "240px" : "208px",
|
|
51330
51342
|
minHeight: "141px",
|
|
51331
51343
|
padding: "1.5rem",
|
|
@@ -51378,7 +51390,8 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
51378
51390
|
dataQa: linkID,
|
|
51379
51391
|
href: link.link,
|
|
51380
51392
|
newTab: true,
|
|
51381
|
-
|
|
51393
|
+
isUnderlined: false,
|
|
51394
|
+
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 "),
|
|
51382
51395
|
size: FONT_SIZE.SM,
|
|
51383
51396
|
lineHeight: "1.313rem"
|
|
51384
51397
|
}, link.text, /*#__PURE__*/React.createElement(ExternalLinkIcon, {
|
|
@@ -51390,7 +51403,11 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
51390
51403
|
to: link.link,
|
|
51391
51404
|
dataQa: linkID,
|
|
51392
51405
|
fontSize: FONT_SIZE.SM,
|
|
51393
|
-
|
|
51406
|
+
color: linkThemeValues.externalLinkColor,
|
|
51407
|
+
isUnderlined: false,
|
|
51408
|
+
active: false,
|
|
51409
|
+
lineheight: "1.313rem",
|
|
51410
|
+
extraStyles: "\n word-break: break-word;\n ".concat(TextWrapStyles, "\n ")
|
|
51394
51411
|
}, link.text));
|
|
51395
51412
|
})))));
|
|
51396
51413
|
};
|