@thecb/components 11.2.3-beta.4 → 11.2.4-beta.0

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 CHANGED
@@ -6256,38 +6256,6 @@ var adjustHexColor = function adjustHexColor(hex, percent, action) {
6256
6256
  return "#".concat(((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1).padStart(6, "0"));
6257
6257
  };
6258
6258
 
6259
- /**
6260
- * Converts a hex color code to an RGBA color string with the specified alpha value.
6261
- *
6262
- * @param {string} hex - The hex color code (e.g., "#3498db" or "3498db").
6263
- * @param {number} alpha - The alpha value (opacity) between 0 and 1.
6264
- * @returns {string} - The RGBA color string (e.g., "rgba(52, 152, 219, 0.5)").
6265
- * @throws {Error} - Throws an error if the hex code is not a valid 3 or 6-digit hex color.
6266
- */
6267
- var hexToRGBA = function hexToRGBA(hex, alpha) {
6268
- // Remove hash at the start if present
6269
- hex = hex.replace(/^\s*#/, "");
6270
-
6271
- // If hex is 3 characters, convert it to 6 characters.
6272
- if (hex.length === 3) {
6273
- hex = hex.split("").map(function (_char) {
6274
- return _char + _char;
6275
- }).join("");
6276
- }
6277
-
6278
- // Validate hex length
6279
- if (hex.length !== 6) {
6280
- throw new Error("Invalid hex color provided. Expected a 3 or 6-digit hex color.");
6281
- }
6282
-
6283
- // Parse the hex color components
6284
- var bigint = parseInt(hex, 16);
6285
- var r = bigint >> 16 & 255;
6286
- var g = bigint >> 8 & 255;
6287
- var b = bigint & 255;
6288
- return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(alpha, ")");
6289
- };
6290
-
6291
6259
  var general = /*#__PURE__*/Object.freeze({
6292
6260
  __proto__: null,
6293
6261
  noop: noop$1,
@@ -6309,8 +6277,7 @@ var general = /*#__PURE__*/Object.freeze({
6309
6277
  titleCaseString: titleCaseString,
6310
6278
  kebabCaseString: kebabCaseString,
6311
6279
  wrapIndex: wrapIndex,
6312
- adjustHexColor: adjustHexColor,
6313
- hexToRGBA: hexToRGBA
6280
+ adjustHexColor: adjustHexColor
6314
6281
  });
6315
6282
 
6316
6283
  var _excluded$1 = ["themeValues", "weight", "color", "textWrap", "extraStyles", "hoverStyles", "onClick", "onKeyPress", "as", "dataQa", "children", "variant"];
@@ -6825,7 +6792,7 @@ var Sidebar = function Sidebar(_ref) {
6825
6792
  var StackWrapper = styled__default.div.withConfig({
6826
6793
  displayName: "Stackstyled__StackWrapper",
6827
6794
  componentId: "sc-ejhezz-0"
6828
- })(["box-sizing:border-box;display:flex;flex-direction:", ";justify-content:", ";height:", ";> *{margin-top:0;margin-bottom:0;}> * + *{", "}", ";"], function (_ref) {
6795
+ })(["box-sizing:border-box;display:flex;flex-direction:", ";justify-content:", ";height:", ";> *{margin-top:0;margin-bottom:0;}> * + *{", "}", ";", ""], function (_ref) {
6829
6796
  var direction = _ref.direction;
6830
6797
  return direction;
6831
6798
  }, function (_ref2) {
@@ -6842,9 +6809,12 @@ var StackWrapper = styled__default.div.withConfig({
6842
6809
  var bottomItem = _ref5.bottomItem,
6843
6810
  direction = _ref5.direction;
6844
6811
  return bottomItem ? "\n > :nth-child(".concat(bottomItem, ") {\n ").concat(direction === "row" ? "margin-left: auto;" : "margin-top: auto;", "\n }\n ") : "";
6812
+ }, function (_ref6) {
6813
+ var extraStyles = _ref6.extraStyles;
6814
+ return extraStyles;
6845
6815
  });
6846
6816
 
6847
- var _excluded$a = ["childGap", "bottomItem", "fullHeight", "children", "direction", "justify"];
6817
+ var _excluded$a = ["childGap", "bottomItem", "fullHeight", "children", "direction", "justify", "extraStyles"];
6848
6818
 
6849
6819
  /*
6850
6820
  Component to impose margin-top between a list of child elements
@@ -6866,13 +6836,15 @@ var Stack = function Stack(_ref) {
6866
6836
  _ref$direction = _ref.direction,
6867
6837
  direction = _ref$direction === void 0 ? "column" : _ref$direction,
6868
6838
  justify = _ref.justify,
6839
+ extraStyles = _ref.extraStyles,
6869
6840
  rest = _objectWithoutProperties(_ref, _excluded$a);
6870
6841
  return /*#__PURE__*/React__default.createElement(StackWrapper, _extends({
6871
6842
  childGap: childGap,
6872
6843
  bottomItem: bottomItem,
6873
6844
  fullHeight: fullHeight,
6874
6845
  direction: direction,
6875
- justify: justify
6846
+ justify: justify,
6847
+ extraStyles: extraStyles
6876
6848
  }, rest), safeChildren(children, /*#__PURE__*/React__default.createElement(React.Fragment, null)));
6877
6849
  };
6878
6850
 
@@ -16170,13 +16142,16 @@ var ErroredIcon = function ErroredIcon() {
16170
16142
 
16171
16143
  var ExternalLinkIcon = function ExternalLinkIcon(_ref) {
16172
16144
  var linkColor = _ref.linkColor,
16173
- text = _ref.text;
16145
+ text = _ref.text,
16146
+ _ref$ariaLabel = _ref.ariaLabel,
16147
+ ariaLabel = _ref$ariaLabel === void 0 ? "External Link" : _ref$ariaLabel;
16174
16148
  return /*#__PURE__*/React__default.createElement("svg", {
16175
16149
  width: "14",
16176
16150
  height: "14",
16177
16151
  viewBox: "0 0 14 14",
16178
16152
  fill: "none",
16179
- xmlns: "http://www.w3.org/2000/svg"
16153
+ xmlns: "http://www.w3.org/2000/svg",
16154
+ "aria-label": ariaLabel
16180
16155
  }, /*#__PURE__*/React__default.createElement("path", {
16181
16156
  fillRule: "evenodd",
16182
16157
  clipRule: "evenodd",
@@ -49745,118 +49720,6 @@ var RadioSection = function RadioSection(_ref) {
49745
49720
  };
49746
49721
  var RadioSection$1 = themeComponent(RadioSection, "RadioSection", fallbackValues$T);
49747
49722
 
49748
- var fallbackValues$U = {
49749
- primaryColor: ROYAL_BLUE_VIVID,
49750
- secondaryColor: CHARADE_GREY,
49751
- background: CORNFLOWER_BLUE
49752
- };
49753
-
49754
- var BannerContainer = styled__default(Cluster).withConfig({
49755
- displayName: "RegistrationBannerstyled__BannerContainer",
49756
- componentId: "sc-1m1lm4y-0"
49757
- })(["background:", ";padding:", ";"], function (_ref) {
49758
- var themeValues = _ref.themeValues;
49759
- return hexToRGBA(themeValues.background, 0.9);
49760
- }, function (_ref2) {
49761
- var isMobile = _ref2.isMobile;
49762
- return isMobile ? "1rem 2rem" : " 2rem 8.25rem";
49763
- });
49764
- var ContentContainer = styled__default(Cluster).withConfig({
49765
- displayName: "RegistrationBannerstyled__ContentContainer",
49766
- componentId: "sc-1m1lm4y-1"
49767
- })(["padding:0;width:", ";> div{flex-direction:", ";}"], function (_ref3) {
49768
- var isMobile = _ref3.isMobile;
49769
- return isMobile ? "296px" : " 1176px";
49770
- }, function (_ref4) {
49771
- var isMobile = _ref4.isMobile;
49772
- return isMobile ? "column" : "row";
49773
- });
49774
- var ButtonContainer = styled__default(Stack).withConfig({
49775
- displayName: "RegistrationBannerstyled__ButtonContainer",
49776
- componentId: "sc-1m1lm4y-2"
49777
- })(["align-items:center;> a{width:", ";}"], function (_ref5) {
49778
- var isMobile = _ref5.isMobile;
49779
- return isMobile ? "296px" : "222px";
49780
- });
49781
- var RegisterLink = styled__default(ButtonWithLink).withConfig({
49782
- displayName: "RegistrationBannerstyled__RegisterLink",
49783
- componentId: "sc-1m1lm4y-3"
49784
- })(["border-radius:100px;margin:0;width:100%;"]);
49785
- var LoginLink = styled__default(ButtonWithLink).withConfig({
49786
- displayName: "RegistrationBannerstyled__LoginLink",
49787
- componentId: "sc-1m1lm4y-4"
49788
- })(["border-radius:100px;padding:0;margin:0;width:100%;min-height:2rem;margin-top:0px;border:none;&:hover{text-decoration:none;}"]);
49789
-
49790
- var RegistrationBanner = function RegistrationBanner(_ref) {
49791
- var clientName = _ref.clientName,
49792
- extraStyles = _ref.extraStyles,
49793
- _ref$loginLink = _ref.loginLink,
49794
- loginLink = _ref$loginLink === void 0 ? "/login" : _ref$loginLink,
49795
- _ref$registrationLink = _ref.registrationLink,
49796
- registrationLink = _ref$registrationLink === void 0 ? "/registration" : _ref$registrationLink,
49797
- themeValues = _ref.themeValues,
49798
- titleAs = _ref.titleAs,
49799
- titleVariant = _ref.titleVariant;
49800
- var themeContext = React.useContext(styled.ThemeContext);
49801
- var isMobile = themeContext.isMobile;
49802
- return /*#__PURE__*/React__default.createElement(BannerContainer, {
49803
- extraStyles: extraStyles,
49804
- themeValues: themeValues,
49805
- isMobile: isMobile,
49806
- role: "banner",
49807
- "aria-label": "Registration Banner",
49808
- justify: "center"
49809
- }, /*#__PURE__*/React__default.createElement(ContentContainer, {
49810
- role: "main",
49811
- align: "center",
49812
- justify: "space-between",
49813
- overflow: "visible",
49814
- isMobile: isMobile
49815
- }, /*#__PURE__*/React__default.createElement(Box, {
49816
- padding: "0",
49817
- textAlign: "left"
49818
- }, /*#__PURE__*/React__default.createElement(Heading$1, {
49819
- as: titleAs,
49820
- color: themeValues.primaryColor,
49821
- fontSize: isMobile ? FONT_SIZE.XL : "1.5rem",
49822
- variant: titleVariant,
49823
- weight: FONT_WEIGHT_SEMIBOLD
49824
- }, "Register for a ", clientName, " Wallet Account"), /*#__PURE__*/React__default.createElement(Text$1, {
49825
- extraStyles: "\n display: block;\n padding: ".concat(isMobile ? ".125rem 0 1rem" : "0", "\n "),
49826
- fontSize: isMobile ? FONT_SIZE.SM : FONT_SIZE.LG,
49827
- color: themeValues.secondaryColor
49828
- }, "Save payment methods and information for fast, easy, and safe payments with ", clientName)), /*#__PURE__*/React__default.createElement(ButtonContainer, {
49829
- justify: "space-between",
49830
- fullHeight: true,
49831
- childGap: "0.5rem",
49832
- isMobile: isMobile
49833
- }, /*#__PURE__*/React__default.createElement(RegisterLink, {
49834
- variant: "secondary",
49835
- color: themeValues.primaryColor,
49836
- contentOverride: true,
49837
- fontWeight: FONT_WEIGHT_SEMIBOLD,
49838
- url: registrationLink
49839
- }, /*#__PURE__*/React__default.createElement(Cluster, {
49840
- justify: "center",
49841
- align: "center"
49842
- }, /*#__PURE__*/React__default.createElement(Text$1, {
49843
- extraStyles: "margin-right: 0.5rem",
49844
- fontSize: isMobile ? FONT_SIZE.MD : FONT_SIZE.LG,
49845
- color: themeValues.primaryColor,
49846
- weight: FONT_WEIGHT_SEMIBOLD
49847
- }, "Register Now"), /*#__PURE__*/React__default.createElement(ArrowRightIcon, null))), /*#__PURE__*/React__default.createElement(LoginLink, {
49848
- text: "Log In",
49849
- variant: "secondary",
49850
- contentOverride: true,
49851
- url: loginLink
49852
- }, /*#__PURE__*/React__default.createElement(Text$1, {
49853
- fontSize: isMobile ? FONT_SIZE.SM : FONT_SIZE.MD,
49854
- color: themeValues.primaryColor,
49855
- weight: FONT_WEIGHT_SEMIBOLD
49856
- }, "or Log In")))));
49857
- };
49858
- var RegistrationBanner$1 = withWindowSize(themeComponent(RegistrationBanner, "RegistrationBanner", fallbackValues$U));
49859
-
49860
49723
  var RegistrationForm = function RegistrationForm(_ref) {
49861
49724
  var clearOnDismount = _ref.clearOnDismount,
49862
49725
  fields = _ref.fields,
@@ -49975,13 +49838,13 @@ RegistrationForm.mapDispatchToProps = mapDispatchToProps$9;
49975
49838
 
49976
49839
  var GRECIAN_GREY$1 = GRECIAN_GREY;
49977
49840
  var bannerBackgroundColor = GRECIAN_GREY$1;
49978
- var fallbackValues$V = {
49841
+ var fallbackValues$U = {
49979
49842
  bannerBackgroundColor: bannerBackgroundColor
49980
49843
  };
49981
49844
 
49982
49845
  var ResetConfirmationForm = function ResetConfirmationForm() {
49983
49846
  var themeContext = React.useContext(styled.ThemeContext);
49984
- var themeValues = createThemeValues(themeContext, fallbackValues$V, "ResetConfirmationForm");
49847
+ var themeValues = createThemeValues(themeContext, fallbackValues$U, "ResetConfirmationForm");
49985
49848
  var isMobile = themeContext.isMobile;
49986
49849
  return /*#__PURE__*/React__default.createElement(Box, {
49987
49850
  padding: "0",
@@ -50096,13 +49959,13 @@ ResetPasswordForm.mapDispatchToProps = mapDispatchToProps$a;
50096
49959
 
50097
49960
  var GRECIAN_GREY$2 = GRECIAN_GREY;
50098
49961
  var bannerBackgroundColor$1 = GRECIAN_GREY$2;
50099
- var fallbackValues$W = {
49962
+ var fallbackValues$V = {
50100
49963
  bannerBackgroundColor: bannerBackgroundColor$1
50101
49964
  };
50102
49965
 
50103
49966
  var ResetPasswordSuccess = function ResetPasswordSuccess() {
50104
49967
  var themeContext = React.useContext(styled.ThemeContext);
50105
- var themeValues = createThemeValues(themeContext, fallbackValues$W, "ResetPasswordSuccess");
49968
+ var themeValues = createThemeValues(themeContext, fallbackValues$V, "ResetPasswordSuccess");
50106
49969
  var isMobile = themeContext.isMobile;
50107
49970
  return /*#__PURE__*/React__default.createElement(Box, {
50108
49971
  padding: "0",
@@ -50151,7 +50014,7 @@ var ResetPasswordSuccess$1 = withWindowSize(ResetPasswordSuccess);
50151
50014
  var activeTabBackground = "#FFFFFF";
50152
50015
  var activeTabAccent = "#15749D";
50153
50016
  var activeTabHover = "#B8D5E1";
50154
- var fallbackValues$X = {
50017
+ var fallbackValues$W = {
50155
50018
  activeTabBackground: activeTabBackground,
50156
50019
  activeTabAccent: activeTabAccent,
50157
50020
  activeTabHover: activeTabHover
@@ -50219,12 +50082,12 @@ var Tabs = function Tabs(_ref) {
50219
50082
  }, tab.content);
50220
50083
  }))));
50221
50084
  };
50222
- var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$X);
50085
+ var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$W);
50223
50086
 
50224
50087
  var activeTabBackground$1 = "#FFFFFF";
50225
50088
  var activeTabAccent$1 = "#15749D";
50226
50089
  var activeTabHover$1 = "#B8D5E1";
50227
- var fallbackValues$Y = {
50090
+ var fallbackValues$X = {
50228
50091
  activeTabBackground: activeTabBackground$1,
50229
50092
  activeTabAccent: activeTabAccent$1,
50230
50093
  activeTabHover: activeTabHover$1
@@ -50281,7 +50144,7 @@ var TabSidebar = function TabSidebar(_ref) {
50281
50144
  }, text)))));
50282
50145
  })));
50283
50146
  };
50284
- var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$Y);
50147
+ var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$X);
50285
50148
 
50286
50149
  var Timeout = function Timeout(_ref) {
50287
50150
  var onLogout = _ref.onLogout;
@@ -50402,7 +50265,7 @@ var fontColor$1 = WHITE;
50402
50265
  var textAlign$1 = "left";
50403
50266
  var headerBackgroundColor$1 = BRIGHT_GREY;
50404
50267
  var imageBackgroundColor$1 = MATISSE_BLUE;
50405
- var fallbackValues$Z = {
50268
+ var fallbackValues$Y = {
50406
50269
  fontWeight: fontWeight$8,
50407
50270
  fontColor: fontColor$1,
50408
50271
  textAlign: textAlign$1,
@@ -50447,7 +50310,7 @@ var WelcomeModule = function WelcomeModule(_ref) {
50447
50310
  src: welcomeImage
50448
50311
  })))));
50449
50312
  };
50450
- var WelcomeModule$1 = /*#__PURE__*/React.memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$Z));
50313
+ var WelcomeModule$1 = /*#__PURE__*/React.memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$Y));
50451
50314
 
50452
50315
  var WorkflowTile = function WorkflowTile(_ref) {
50453
50316
  var _ref$workflowName = _ref.workflowName,
@@ -50507,7 +50370,7 @@ var menuItemColorDelete = RAZZMATAZZ_RED;
50507
50370
  var menuItemHoverBackgroundColor = CORNFLOWER_BLUE;
50508
50371
  var menuItemHoverBackgroundColorDelete = BLUSH_RED;
50509
50372
  var menuItemHoverColor = ROYAL_BLUE_VIVID;
50510
- var fallbackValues$_ = {
50373
+ var fallbackValues$Z = {
50511
50374
  menuItemBackgroundColor: menuItemBackgroundColor,
50512
50375
  menuItemColor: menuItemColor,
50513
50376
  menuItemColorDelete: menuItemColorDelete,
@@ -50574,13 +50437,13 @@ var PopupMenuItem = function PopupMenuItem(_ref) {
50574
50437
  extraStyles: textExtraStyles
50575
50438
  }, text)));
50576
50439
  };
50577
- var PopupMenuItem$1 = themeComponent(PopupMenuItem, "PopupMenuItem", fallbackValues$_);
50440
+ var PopupMenuItem$1 = themeComponent(PopupMenuItem, "PopupMenuItem", fallbackValues$Z);
50578
50441
 
50579
50442
  var hoverColor$5 = "#116285";
50580
50443
  var activeColor$a = "#0E506D";
50581
50444
  var menuTriggerColor = "#15749D";
50582
50445
  var backgroundColor$e = "white";
50583
- var fallbackValues$$ = {
50446
+ var fallbackValues$_ = {
50584
50447
  hoverColor: hoverColor$5,
50585
50448
  activeColor: activeColor$a,
50586
50449
  menuTriggerColor: menuTriggerColor,
@@ -50716,13 +50579,13 @@ var PopupMenu = function PopupMenu(_ref) {
50716
50579
  }, item));
50717
50580
  })));
50718
50581
  };
50719
- var PopupMenu$1 = themeComponent(PopupMenu, "PopupMenu", fallbackValues$$);
50582
+ var PopupMenu$1 = themeComponent(PopupMenu, "PopupMenu", fallbackValues$_);
50720
50583
 
50721
50584
  var primaryColor$1 = WHITE;
50722
50585
  var primaryHoverColor = INFO_BLUE;
50723
50586
  var secondaryColor = MATISSE_BLUE;
50724
50587
  var secondaryHoverColor = "#115D7E";
50725
- var fallbackValues$10 = {
50588
+ var fallbackValues$$ = {
50726
50589
  primaryColor: primaryColor$1,
50727
50590
  primaryHoverColor: primaryHoverColor,
50728
50591
  secondaryColor: secondaryColor,
@@ -51424,28 +51287,24 @@ var MultipleSelectFilter = function MultipleSelectFilter(_ref) {
51424
51287
  ariaLabel: "Apply all filters"
51425
51288
  }))));
51426
51289
  };
51427
- var MultipleSelectFilter$1 = themeComponent(MultipleSelectFilter, "MultipleSelectFilter", fallbackValues$10);
51290
+ var MultipleSelectFilter$1 = themeComponent(MultipleSelectFilter, "MultipleSelectFilter", fallbackValues$$);
51428
51291
 
51292
+ var TextWrapStyles = styled.css(["word-wrap:break-word;overflow-wrap:break-word;white-space:normal;max-width:100%;"]);
51429
51293
  var Container$1 = styled__default(Box).withConfig({
51430
51294
  displayName: "ContactCardstyled__Container",
51431
51295
  componentId: "sc-1v62a1n-0"
51432
- })(["height:fit-content;display:flex;padding:1rem;flex-direction:column;align-items:flex-start;gap:1.5rem;border-radius:8px;"]);
51296
+ })(["height:fit-content;display:flex;padding:1rem;flex-direction:column;align-items:flex-start;gap:1.5rem;border-radius:8px;", ""], function (_ref) {
51297
+ var extraStyles = _ref.extraStyles;
51298
+ return extraStyles;
51299
+ });
51433
51300
  var Title$3 = styled__default(Heading$1).withConfig({
51434
51301
  displayName: "ContactCardstyled__Title",
51435
51302
  componentId: "sc-1v62a1n-1"
51436
- })(["display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;overflow:hidden;text-overflow:ellipsis;background-color:transparent;font-weight:", ";"], FONT_WEIGHT_SEMIBOLD);
51303
+ })(["", ""], TextWrapStyles);
51437
51304
  var Content = styled__default(Box).withConfig({
51438
51305
  displayName: "ContactCardstyled__Content",
51439
51306
  componentId: "sc-1v62a1n-2"
51440
- })(["padding:0;font-size:", ";line-height:1.313rem;overflow-wrap:normal;letter-spacing:0.14px;"], FONT_SIZE.SM);
51441
- var Footer$1 = styled__default(Stack).withConfig({
51442
- displayName: "ContactCardstyled__Footer",
51443
- componentId: "sc-1v62a1n-3"
51444
- })(["width:100%;"]);
51445
- var Divider = styled__default(Box).withConfig({
51446
- displayName: "ContactCardstyled__Divider",
51447
- componentId: "sc-1v62a1n-4"
51448
- })(["padding:0;height:1px;width:100%;"]);
51307
+ })(["word-break:break-word;padding:0;font-size:", ";line-height:1.313rem;letter-spacing:0.14px;", " p{margin:0;}p,span{line-height:1.313rem;}"], FONT_SIZE.SM, TextWrapStyles);
51449
51308
 
51450
51309
  var ContactCard = function ContactCard(_ref) {
51451
51310
  var title = _ref.title,
@@ -51471,6 +51330,7 @@ var ContactCard = function ContactCard(_ref) {
51471
51330
  var linkThemeValues = createThemeValues(themeContext, linkFallbackValues, "Link", linkVariant);
51472
51331
  return /*#__PURE__*/React__default.createElement(Container$1, {
51473
51332
  borderRadius: "8px",
51333
+ background: WHITE,
51474
51334
  boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.25)",
51475
51335
  dataQa: createIdFromString(title, "contact-card"),
51476
51336
  maxWidth: isMobile ? "100%" : "208px",
@@ -51494,7 +51354,8 @@ var ContactCard = function ContactCard(_ref) {
51494
51354
  }, /*#__PURE__*/React__default.createElement(Title$3, {
51495
51355
  variant: titleVariant,
51496
51356
  margin: 0,
51497
- fontSize: FONT_SIZE.MD
51357
+ fontSize: FONT_SIZE.MD,
51358
+ weight: FONT_WEIGHT_SEMIBOLD
51498
51359
  }, title)), /*#__PURE__*/React__default.createElement(Box, {
51499
51360
  padding: "0",
51500
51361
  width: "100%"
@@ -51511,33 +51372,39 @@ var ContactCard = function ContactCard(_ref) {
51511
51372
  }, /*#__PURE__*/React__default.createElement(Title$3, {
51512
51373
  variant: titleVariant,
51513
51374
  margin: 0,
51514
- fontSize: FONT_SIZE.MD
51375
+ fontSize: FONT_SIZE.MD,
51376
+ weight: FONT_WEIGHT_SEMIBOLD
51515
51377
  }, secondTitle), /*#__PURE__*/React__default.createElement(Stack, {
51516
51378
  childGap: "4px",
51517
51379
  justify: "space-between",
51518
- style: {
51519
- width: "100%"
51520
- },
51380
+ extraStyles: "width: 100%;",
51521
51381
  fullHeight: true
51522
51382
  }, links.map(function (link) {
51523
51383
  var linkID = createIdFromString(link.text, "contact-card-link");
51524
- return /*#__PURE__*/React__default.createElement(ExternalLink, {
51384
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, test(URL_TEST, link.link) ? /*#__PURE__*/React__default.createElement(ExternalLink, {
51525
51385
  key: linkID,
51526
51386
  dataQa: linkID,
51527
51387
  href: link.link,
51528
51388
  newTab: true,
51529
- extraStyles: "\n flex-direction: row;\n align-items: center;\n align-content: flex-start;\n justify-content: space-between;\n ",
51389
+ 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 "),
51530
51390
  size: FONT_SIZE.SM,
51531
51391
  lineHeight: "1.313rem"
51532
51392
  }, link.text, /*#__PURE__*/React__default.createElement(ExternalLinkIcon, {
51533
51393
  linkColor: linkThemeValues.externalLinkColor,
51534
- text: link.text
51535
- }));
51394
+ text: link.text,
51395
+ ariaLabel: "(Opens in a new tab)"
51396
+ })) : /*#__PURE__*/React__default.createElement(InternalLink, {
51397
+ key: linkID,
51398
+ to: link.link,
51399
+ dataQa: linkID,
51400
+ fontSize: FONT_SIZE.SM,
51401
+ extraStyles: "\n word-break: break-word;\n ".concat(TextWrapStyles, "\n ")
51402
+ }, link.text));
51536
51403
  })))));
51537
51404
  };
51538
51405
 
51539
51406
  var pageBackground = "#FBFCFD";
51540
- var fallbackValues$11 = {
51407
+ var fallbackValues$10 = {
51541
51408
  pageBackground: pageBackground
51542
51409
  };
51543
51410
 
@@ -51585,7 +51452,7 @@ var CenterSingle = function CenterSingle(_ref) {
51585
51452
  padding: "0"
51586
51453
  })));
51587
51454
  };
51588
- var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$11));
51455
+ var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$10));
51589
51456
 
51590
51457
  var CenterStack = function CenterStack(_ref) {
51591
51458
  var header = _ref.header,
@@ -51628,7 +51495,7 @@ var CenterStack = function CenterStack(_ref) {
51628
51495
  padding: "0"
51629
51496
  })));
51630
51497
  };
51631
- var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$11));
51498
+ var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$10));
51632
51499
 
51633
51500
  var CenterSingle$2 = function CenterSingle(_ref) {
51634
51501
  var header = _ref.header,
@@ -51674,7 +51541,7 @@ var CenterSingle$2 = function CenterSingle(_ref) {
51674
51541
  padding: "0"
51675
51542
  })));
51676
51543
  };
51677
- var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$11));
51544
+ var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$10));
51678
51545
 
51679
51546
  var SidebarSingleContent = function SidebarSingleContent(_ref) {
51680
51547
  var header = _ref.header,
@@ -51727,7 +51594,7 @@ var SidebarSingleContent = function SidebarSingleContent(_ref) {
51727
51594
  padding: "0"
51728
51595
  })));
51729
51596
  };
51730
- var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$11));
51597
+ var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$10));
51731
51598
 
51732
51599
  var SidebarStackContent = function SidebarStackContent(_ref) {
51733
51600
  var header = _ref.header,
@@ -51797,7 +51664,7 @@ var SidebarStackContent = function SidebarStackContent(_ref) {
51797
51664
  key: "footer-box"
51798
51665
  })));
51799
51666
  };
51800
- var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$11));
51667
+ var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$10));
51801
51668
 
51802
51669
  var useFocusInvalidInput = function useFocusInvalidInput(hasErrors) {
51803
51670
  var resetHasErrors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
@@ -52036,7 +51903,6 @@ exports.Reel = Reel;
52036
51903
  exports.RefundIcon = RefundIcon;
52037
51904
  exports.RefundIconMedium = RefundIconMedium;
52038
51905
  exports.RefundIconSmall = RefundIconSmall;
52039
- exports.RegistrationBanner = RegistrationBanner$1;
52040
51906
  exports.RegistrationForm = RegistrationForm;
52041
51907
  exports.RejectedIcon = RejectedIcon;
52042
51908
  exports.RejectedVelocityIcon = RejectedVelocityIcon;