@royaloperahouse/chord 2.4.5 → 2.4.7

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/CHANGELOG.md CHANGED
@@ -1,3 +1,9 @@
1
+ ## [2.4.7]
2
+ - Compact Header bug fixes for Default Pages roll out
3
+
4
+ ## [2.4.6]
5
+ - Print behaviour: Accordion and ReadMore now open to display content when printing, PeopleListing avoids content breaking between pages
6
+
1
7
  ## [2.4.5]
2
8
  - Primary Button: Disabled state
3
9
 
@@ -127,9 +127,12 @@ var StreamBadge = function StreamBadge(_ref) {
127
127
  var _ref$fillColor = _ref.fillColor,
128
128
  fillColor = _ref$fillColor === void 0 ? exports.Colors.White : _ref$fillColor,
129
129
  _ref$align = _ref.align,
130
- align = _ref$align === void 0 ? 'center' : _ref$align;
130
+ align = _ref$align === void 0 ? 'center' : _ref$align,
131
+ _ref$invert = _ref.invert,
132
+ invert = _ref$invert === void 0 ? false : _ref$invert;
133
+ var colour = invert ? exports.Colors.Black : fillColor;
131
134
  return /*#__PURE__*/React__default.createElement(BadgeWrapper, {
132
- fillColor: fillColor,
135
+ fillColor: colour,
133
136
  width: "100%",
134
137
  height: "100%",
135
138
  viewBox: "110 450 865 200",
@@ -227,9 +230,12 @@ var CinemaBadge = function CinemaBadge(_ref) {
227
230
  var _ref$fillColor = _ref.fillColor,
228
231
  fillColor = _ref$fillColor === void 0 ? exports.Colors.White : _ref$fillColor,
229
232
  _ref$align = _ref.align,
230
- align = _ref$align === void 0 ? 'center' : _ref$align;
233
+ align = _ref$align === void 0 ? 'center' : _ref$align,
234
+ _ref$invert = _ref.invert,
235
+ invert = _ref$invert === void 0 ? false : _ref$invert;
236
+ var colour = invert ? exports.Colors.Black : fillColor;
231
237
  return /*#__PURE__*/React__default.createElement(BadgeWrapper, {
232
- fillColor: fillColor,
238
+ fillColor: colour,
233
239
  width: "100%",
234
240
  height: "100%",
235
241
  viewBox: "110 450 865 200",
@@ -7037,12 +7043,19 @@ var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$L || (_te
7037
7043
  var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n }\n"])), devices.mobile);
7038
7044
  var TextContainer = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 2.5em;\n div > :first-child {\n margin-top: 1.5em;\n }\n\n @media ", " {\n margin-top: 0;\n div > :first-child {\n margin-top: 0.5em;\n }\n }\n\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n & {\n div > :first-child {\n margin-top: 1em;\n }\n }\n }\n"])), devices.tablet, devices.mobile);
7039
7045
 
7040
- var _templateObject$M, _templateObject2$x, _templateObject3$p, _templateObject4$j, _templateObject5$e;
7046
+ var _templateObject$M, _templateObject2$x, _templateObject3$p, _templateObject4$j, _templateObject5$e, _templateObject6$c;
7041
7047
  var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
7042
7048
  var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
7043
- var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])), devices.mobile);
7049
+ var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n visibility: ", ";\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref) {
7050
+ var isVisible = _ref.isVisible;
7051
+ return isVisible ? 'visible' : 'hidden';
7052
+ }, devices.mobile);
7044
7053
  var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
7045
- var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), devices.mobile);
7054
+ var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n max-height: ", ";\n\n @media print {\n max-height: max-content;\n }\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref2) {
7055
+ var textHeight = _ref2.textHeight;
7056
+ return textHeight;
7057
+ }, devices.mobile);
7058
+ var PrintHideWrapper = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
7046
7059
 
7047
7060
  var Accordion = function Accordion(_ref) {
7048
7061
  var _ref$title = _ref.title,
@@ -7073,11 +7086,7 @@ var Accordion = function Accordion(_ref) {
7073
7086
  setIconName = _useState3[1]; // Contents children visibility is set to prevent it from being keyboard tabbable when the accordion is closed
7074
7087
 
7075
7088
 
7076
- var _useState4 = React.useState(initOpen ? {
7077
- visibility: 'visible'
7078
- } : {
7079
- visibility: 'hidden'
7080
- }),
7089
+ var _useState4 = React.useState(initOpen),
7081
7090
  childrenVisibility = _useState4[0],
7082
7091
  setChildrenVisibility = _useState4[1];
7083
7092
 
@@ -7093,11 +7102,7 @@ var Accordion = function Accordion(_ref) {
7093
7102
  setOpenAccordion(!openAccordion);
7094
7103
  setTextHeight(openAccordion ? '0px' : content.current.scrollHeight + "px");
7095
7104
  setIconName(openAccordion ? 'Expand' : 'Detract');
7096
- setChildrenVisibility(openAccordion ? {
7097
- visibility: 'hidden'
7098
- } : {
7099
- visibility: 'visible'
7100
- });
7105
+ setChildrenVisibility(!openAccordion);
7101
7106
  };
7102
7107
 
7103
7108
  var keyDown = function keyDown(e) {
@@ -7107,7 +7112,9 @@ var Accordion = function Accordion(_ref) {
7107
7112
  };
7108
7113
 
7109
7114
  var Standfirst = function Standfirst() {
7110
- return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, null, visibleStandfirst)) : null;
7115
+ return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
7116
+ isVisible: childrenVisibility
7117
+ }, visibleStandfirst)) : null;
7111
7118
  };
7112
7119
 
7113
7120
  var contentContainerId = title + "-accordion-content";
@@ -7152,18 +7159,16 @@ var Accordion = function Accordion(_ref) {
7152
7159
  }, /*#__PURE__*/React__default.createElement(AccordionTitle, {
7153
7160
  level: displayLevel,
7154
7161
  semanticLevel: semanticLevel
7155
- }, title), children && /*#__PURE__*/React__default.createElement(Icon, {
7162
+ }, title), children && /*#__PURE__*/React__default.createElement(PrintHideWrapper, null, /*#__PURE__*/React__default.createElement(Icon, {
7156
7163
  iconName: iconName
7157
- })), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
7164
+ }))), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
7158
7165
  "data-testid": "richcontainer",
7159
7166
  ref: content,
7160
- style: {
7161
- maxHeight: "" + textHeight
7162
- },
7167
+ textHeight: textHeight,
7163
7168
  id: contentContainerId,
7164
7169
  "aria-live": "polite"
7165
7170
  }, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
7166
- style: childrenVisibility
7171
+ isVisible: childrenVisibility
7167
7172
  }, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
7168
7173
  };
7169
7174
 
@@ -7265,7 +7270,7 @@ var AuxiliaryButton = function AuxiliaryButton(_ref) {
7265
7270
  }), children);
7266
7271
  };
7267
7272
 
7268
- var _templateObject$Q, _templateObject2$z, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$c, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
7273
+ var _templateObject$Q, _templateObject2$z, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$d, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
7269
7274
  var LENGTH_LARGE_TEXT = 28;
7270
7275
  var LENGTH_SMALL_TEXT$1 = 19;
7271
7276
  var LENGTH_TEXT_TABLET = 10;
@@ -7291,7 +7296,7 @@ var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$k ||
7291
7296
  return fullWidth ? '0' : '20px';
7292
7297
  });
7293
7298
  var TitleContainer$4 = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
7294
- var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobileAndTablet);
7299
+ var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobileAndTablet);
7295
7300
  var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin-top: var(--editorial-spacing-hover);\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
7296
7301
  var HighlightTextContainer = /*#__PURE__*/styled__default(TextContainer$1)(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-primary);\n margin-top: 4px;\n"])));
7297
7302
  var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n display: block;\n overflow-wrap: break-word;\n"])));
@@ -7355,59 +7360,61 @@ var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject14 || (
7355
7360
  return '';
7356
7361
  });
7357
7362
 
7358
- var TEXT_STYLE_HTML_TAGS_REGEXP = '<em>|</em>|<b>|</b>';
7359
7363
  var stripAllHtmlTags = function stripAllHtmlTags(htmlString) {
7360
7364
  return htmlString.replace(/<[^>]*>/g, '');
7361
7365
  };
7366
+ var truncateHtmlString = function truncateHtmlString(htmlString, resultLength, addDots) {
7367
+ if (addDots === void 0) {
7368
+ addDots = false;
7369
+ }
7362
7370
 
7363
- var getAllMatches = function getAllMatches(str, regExp) {
7364
- var allMatches = [];
7365
- var match;
7371
+ var textContent = stripAllHtmlTags(htmlString);
7366
7372
 
7367
- while (match = regExp.exec(str)) {
7368
- allMatches.push({
7369
- value: match[0],
7370
- index: match.index
7371
- });
7373
+ if (textContent.length <= resultLength) {
7374
+ return htmlString;
7372
7375
  }
7373
7376
 
7374
- return allMatches;
7375
- };
7376
-
7377
- var insertString = function insertString(mainString, str, position) {
7378
- return "" + mainString.substring(0, position) + str + mainString.substring(position);
7379
- };
7377
+ var accumulatedText = '';
7378
+ var tagStack = [];
7379
+ var charCount = 0;
7380
7380
 
7381
- var insertHtmlTags = function insertHtmlTags(strWithTags, strWithoutTags, resultLength) {
7382
- var htmlTagPositions = getAllMatches(strWithTags, new RegExp(TEXT_STYLE_HTML_TAGS_REGEXP, 'g'));
7383
- var tagsLength = 0;
7384
- var resultString = strWithoutTags;
7385
- htmlTagPositions.forEach(function (tag) {
7386
- resultString = insertString(resultString, tag.value, tag.index);
7387
- if (tag.index - tagsLength <= resultLength) tagsLength += tag.value.length;
7388
- });
7389
- return {
7390
- stringWithInsertedTags: resultString,
7391
- tagsLength: tagsLength
7381
+ var closeTags = function closeTags() {
7382
+ while (tagStack.length > 0) {
7383
+ accumulatedText += '</' + tagStack.pop() + '>';
7384
+ }
7392
7385
  };
7393
- };
7394
7386
 
7395
- var truncateHtmlString = function truncateHtmlString(str, resultLength, addDots) {
7396
- if (addDots === void 0) {
7397
- addDots = false;
7398
- }
7387
+ for (var i = 0; i < htmlString.length; i++) {
7388
+ var _char = htmlString[i];
7399
7389
 
7400
- var strWithoutTags = stripAllHtmlTags(str);
7401
- if (strWithoutTags.length <= resultLength) return str;
7390
+ if (_char === '<') {
7391
+ accumulatedText += _char;
7402
7392
 
7403
- var _insertHtmlTags = insertHtmlTags(str, strWithoutTags, resultLength),
7404
- stringWithInsertedTags = _insertHtmlTags.stringWithInsertedTags,
7405
- tagsLength = _insertHtmlTags.tagsLength;
7393
+ if (htmlString[i + 1] !== '/') {
7394
+ var tagNameEnd = htmlString.indexOf('>', i);
7395
+ var tagName = htmlString.slice(i + 1, tagNameEnd).split(' ')[0];
7396
+ tagStack.push(tagName);
7397
+ accumulatedText += tagName + ">";
7398
+ i = tagNameEnd;
7399
+ }
7400
+ } else if (_char === '>') {
7401
+ accumulatedText += _char;
7402
+ } else if (charCount < resultLength) {
7403
+ accumulatedText += _char;
7404
+ charCount++;
7405
+ }
7406
7406
 
7407
- var truncatedString = stringWithInsertedTags.substring(0, resultLength + tagsLength);
7408
- var isSpaceNext = strWithoutTags[resultLength] === ' ';
7409
- if (!isSpaceNext) truncatedString = truncatedString.substring(0, truncatedString.lastIndexOf(' '));
7410
- return addDots ? truncatedString + "..." : truncatedString;
7407
+ if (charCount >= resultLength) {
7408
+ if (addDots) {
7409
+ accumulatedText += '...';
7410
+ }
7411
+
7412
+ break;
7413
+ }
7414
+ }
7415
+
7416
+ closeTags();
7417
+ return accumulatedText;
7411
7418
  };
7412
7419
  var truncate = function truncate(str, n) {
7413
7420
  return str.length >= n ? str.substring(0, n) : str;
@@ -7683,7 +7690,7 @@ var ContactCard = function ContactCard(_ref) {
7683
7690
  }, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString)))))));
7684
7691
  };
7685
7692
 
7686
- var _templateObject$T, _templateObject2$C, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$d, _templateObject7$8;
7693
+ var _templateObject$T, _templateObject2$C, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$e, _templateObject7$8;
7687
7694
  var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
7688
7695
  var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
7689
7696
  return props.clickable ? 'pointer' : 'default';
@@ -7693,7 +7700,7 @@ var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject
7693
7700
  return props.showImage ? 2 : '1 / span 4';
7694
7701
  }, devices.mobile);
7695
7702
  var ContentSummaryTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
7696
- var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
7703
+ var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
7697
7704
  var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
7698
7705
  return !!props.truncate && "\n overflow: hidden;\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: " + props.truncate + ";\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n min-height: 1em;\n max-height: 3em;\n ";
7699
7706
  });
@@ -7971,7 +7978,7 @@ var Information = function Information(_ref) {
7971
7978
  }))));
7972
7979
  };
7973
7980
 
7974
- var _templateObject$W, _templateObject2$F, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$e, _templateObject7$9, _templateObject8$7;
7981
+ var _templateObject$W, _templateObject2$F, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$f, _templateObject7$9, _templateObject8$7;
7975
7982
  var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n // remove spacing above/below for all semantic levels of the title\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
7976
7983
  var theme = _ref.theme;
7977
7984
  return theme.colors.primary;
@@ -7989,7 +7996,7 @@ var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject4$p || (_t
7989
7996
  return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
7990
7997
  }, devices.mobile);
7991
7998
  var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
7992
- var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
7999
+ var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
7993
8000
  var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
7994
8001
  var PageHeadingText = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
7995
8002
 
@@ -8072,13 +8079,13 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
8072
8079
  })));
8073
8080
  };
8074
8081
 
8075
- var _templateObject$X, _templateObject2$G, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$f, _templateObject7$a, _templateObject8$8;
8082
+ var _templateObject$X, _templateObject2$G, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$g, _templateObject7$a, _templateObject8$8;
8076
8083
  var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
8077
8084
  var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
8078
8085
  var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
8079
8086
  var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
8080
8087
  var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
8081
- var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
8088
+ var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
8082
8089
  var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
8083
8090
  var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
8084
8091
 
@@ -8212,12 +8219,12 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
8212
8219
  }))));
8213
8220
  };
8214
8221
 
8215
- var _templateObject$_, _templateObject2$I, _templateObject3$z, _templateObject5$m, _templateObject6$g, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
8216
- var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
8217
- var BrandingTextBody = /*#__PURE__*/styled__default.p(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
8222
+ var _templateObject$_, _templateObject2$I, _templateObject3$z, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
8223
+ var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
8224
+ var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
8218
8225
  var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
8219
8226
  var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
8220
- var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
8227
+ var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
8221
8228
  var invert = _ref.invert,
8222
8229
  theme = _ref.theme;
8223
8230
  return invert ? theme.colors.white : theme.colors.primary;
@@ -8317,10 +8324,14 @@ var renderBranding = function renderBranding(brandingStyle, invert, brandingText
8317
8324
  }, truncate(stripAllHtmlTags(brandingText), 25));
8318
8325
 
8319
8326
  case 'StreamLogo':
8320
- return /*#__PURE__*/React__default.createElement(StreamBadge, null);
8327
+ return /*#__PURE__*/React__default.createElement(StreamBadge, {
8328
+ invert: invert
8329
+ });
8321
8330
 
8322
8331
  case 'CinemaLogo':
8323
- return /*#__PURE__*/React__default.createElement(CinemaBadge, null);
8332
+ return /*#__PURE__*/React__default.createElement(CinemaBadge, {
8333
+ invert: invert
8334
+ });
8324
8335
 
8325
8336
  default:
8326
8337
  return null;
@@ -8618,13 +8629,13 @@ var Pagination = function Pagination(_ref) {
8618
8629
  }))));
8619
8630
  };
8620
8631
 
8621
- var _templateObject$10, _templateObject2$K, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$h;
8632
+ var _templateObject$10, _templateObject2$K, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$i;
8622
8633
  var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
8623
8634
  var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
8624
8635
  var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
8625
8636
  var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
8626
- var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n"])));
8627
- var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
8637
+ var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
8638
+ var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
8628
8639
 
8629
8640
  var Person = function Person(_ref) {
8630
8641
  var person = _ref.person,
@@ -8747,7 +8758,7 @@ var CreditListing = function CreditListing(_ref) {
8747
8758
  }));
8748
8759
  };
8749
8760
 
8750
- var _templateObject$12, _templateObject2$M, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$i, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
8761
+ var _templateObject$12, _templateObject2$M, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$j, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
8751
8762
  var LENGTH_TEXT = 28;
8752
8763
  var LENGTH_TEXT_TABLET$1 = 12;
8753
8764
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
@@ -8807,7 +8818,7 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
8807
8818
  var marginBottom = _ref10.marginBottom;
8808
8819
  return marginBottom + "px";
8809
8820
  });
8810
- var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
8821
+ var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
8811
8822
  var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
8812
8823
  var TextLinkWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
8813
8824
  var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
@@ -9025,7 +9036,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
9025
9036
  }))));
9026
9037
  };
9027
9038
 
9028
- var _templateObject$13, _templateObject2$N, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d;
9039
+ var _templateObject$13, _templateObject2$N, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$k, _templateObject7$d;
9029
9040
  var LENGTH_TEXT$2 = 28;
9030
9041
  var LENGTH_TEXT_TABLET$2 = 10;
9031
9042
  var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n"])), function (_ref) {
@@ -9045,7 +9056,7 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObj
9045
9056
  }, devices.mobile);
9046
9057
  var PromoWithTitleContainer = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 32px;\n\n @media ", " {\n & {\n margin: 0 0 24px;\n }\n }\n }\n"])), devices.mobile);
9047
9058
  var PromoWithTitleSubtitle = /*#__PURE__*/styled__default.span(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
9048
- var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
9059
+ var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
9049
9060
  var theme = _ref5.theme;
9050
9061
  return theme.colors.black;
9051
9062
  }, function (_ref6) {
@@ -9529,7 +9540,7 @@ var SectionTitle = function SectionTitle(_ref) {
9529
9540
  }, description))));
9530
9541
  };
9531
9542
 
9532
- var _templateObject$19, _templateObject2$Q, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
9543
+ var _templateObject$19, _templateObject2$Q, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$l, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
9533
9544
  var stateStyles = /*#__PURE__*/styled.css(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
9534
9545
  var theme = _ref.theme;
9535
9546
  return "3px solid " + theme.colors.lapisLazuli;
@@ -9554,7 +9565,7 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
9554
9565
  title: 'Select Arrow'
9555
9566
  };
9556
9567
  })(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
9557
- var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
9568
+ var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
9558
9569
  var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
9559
9570
  var Options = /*#__PURE__*/styled__default.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
9560
9571
  var Option = /*#__PURE__*/styled__default.li(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
@@ -10200,13 +10211,13 @@ var Quote = function Quote(_ref) {
10200
10211
  }, attribution))));
10201
10212
  };
10202
10213
 
10203
- var _templateObject$1e, _templateObject2$U, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$l;
10214
+ var _templateObject$1e, _templateObject2$U, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$m;
10204
10215
  var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
10205
10216
  var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
10206
10217
  var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
10207
10218
  var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
10208
10219
  var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
10209
- var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
10220
+ var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
10210
10221
 
10211
10222
  var MiniCard = function MiniCard(_ref) {
10212
10223
  var _ref$title = _ref.title,
@@ -10244,11 +10255,18 @@ var MiniCard = function MiniCard(_ref) {
10244
10255
  }, title)))));
10245
10256
  };
10246
10257
 
10247
- var _templateObject$1f, _templateObject2$V, _templateObject3$L, _templateObject4$A;
10258
+ var _templateObject$1f, _templateObject2$V, _templateObject3$L, _templateObject4$A, _templateObject5$s;
10248
10259
  var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
10249
- var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
10250
- var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
10251
- var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n"])));
10260
+ var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
10261
+ var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
10262
+ var isVisible = _ref.isVisible;
10263
+ return isVisible ? 'visible' : 'hidden';
10264
+ });
10265
+ var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
10266
+ var isVisible = _ref2.isVisible;
10267
+ return isVisible ? 'visible' : 'hidden';
10268
+ });
10269
+ var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
10252
10270
 
10253
10271
  var keyDown = function keyDown(e, toggleFunction) {
10254
10272
  if (e.key === 'Enter' || e.key === 'Space') {
@@ -10276,14 +10294,6 @@ var ReadMore = function ReadMore(_ref) {
10276
10294
  textHeight = _useState2[0],
10277
10295
  setTextHeight = _useState2[1];
10278
10296
 
10279
- var _useState3 = React.useState(initOpen ? {
10280
- visibility: 'visible'
10281
- } : {
10282
- visibility: 'hidden'
10283
- }),
10284
- textVisibility = _useState3[0],
10285
- setTextVisibility = _useState3[1];
10286
-
10287
10297
  var readMoreContent = React.useRef(null);
10288
10298
  React.useEffect(function () {
10289
10299
  if (readMoreContent != null && readMoreContent.current && initOpen) {
@@ -10296,11 +10306,6 @@ var ReadMore = function ReadMore(_ref) {
10296
10306
  if (typeof fullText === 'string' && fullText.length === 0) return;
10297
10307
  setIsFullTextOpen(!isFullTextOpen);
10298
10308
  setTextHeight(isFullTextOpen ? '0px' : readMoreContent.current.scrollHeight + "px");
10299
- setTextVisibility(isFullTextOpen ? {
10300
- visibility: 'hidden'
10301
- } : {
10302
- visibility: 'visible'
10303
- });
10304
10309
  };
10305
10310
 
10306
10311
  var handleKeyDown = function handleKeyDown(e) {
@@ -10311,7 +10316,9 @@ var ReadMore = function ReadMore(_ref) {
10311
10316
  var truncatedText = truncate ? truncateReactNodeString(introText != null ? introText : '', INTRO_CHAR_LIMIT, true) : introText;
10312
10317
 
10313
10318
  var IntroText = function IntroText() {
10314
- return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$5, null, /*#__PURE__*/React__default.createElement(FullTextContainer, null, truncate ? /*#__PURE__*/React__default.createElement("div", {
10319
+ return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$5, null, /*#__PURE__*/React__default.createElement(IntroTextContainer, {
10320
+ isVisible: !isFullTextOpen
10321
+ }, truncate ? /*#__PURE__*/React__default.createElement("div", {
10315
10322
  dangerouslySetInnerHTML: {
10316
10323
  __html: "" + truncatedText
10317
10324
  }
@@ -10338,7 +10345,7 @@ var ReadMore = function ReadMore(_ref) {
10338
10345
  maxHeight: "" + textHeight
10339
10346
  }
10340
10347
  }, /*#__PURE__*/React__default.createElement(FullTextContainer, {
10341
- style: textVisibility
10348
+ isVisible: isFullTextOpen
10342
10349
  }, fullText)), /*#__PURE__*/React__default.createElement(LinkContainer, null, (fullText || isFullTextOpen) && /*#__PURE__*/React__default.createElement(TextLink, {
10343
10350
  tabIndex: 0,
10344
10351
  role: "button",
@@ -10346,7 +10353,7 @@ var ReadMore = function ReadMore(_ref) {
10346
10353
  }, isFullTextOpen ? "" + hideText : "" + showMoreText)));
10347
10354
  };
10348
10355
 
10349
- var _templateObject$1g, _templateObject2$W, _templateObject3$M, _templateObject4$B, _templateObject5$s;
10356
+ var _templateObject$1g, _templateObject2$W, _templateObject3$M, _templateObject4$B, _templateObject5$t;
10350
10357
  var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
10351
10358
  var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), exports.Colors.LightGrey);
10352
10359
  var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
@@ -10354,7 +10361,7 @@ var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$B || (_template
10354
10361
  var isActive = _ref.isActive;
10355
10362
  return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
10356
10363
  }, exports.Colors.MidGrey);
10357
- var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
10364
+ var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
10358
10365
  var isOpen = _ref2.isOpen;
10359
10366
  return isOpen ? 'block' : 'none';
10360
10367
  }, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
@@ -10524,7 +10531,7 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
10524
10531
  });
10525
10532
  };
10526
10533
 
10527
- var _templateObject$1h, _templateObject2$X, _templateObject3$N, _templateObject4$C, _templateObject5$t, _templateObject6$m;
10534
+ var _templateObject$1h, _templateObject2$X, _templateObject3$N, _templateObject4$C, _templateObject5$u, _templateObject6$n;
10528
10535
  var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10529
10536
  var Sections = /*#__PURE__*/styled__default.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10530
10537
  var Section = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
@@ -10532,11 +10539,11 @@ var Section = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateO
10532
10539
  return "var(--base-color-" + color + ")";
10533
10540
  });
10534
10541
  var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
10535
- var Text = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
10542
+ var Text = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
10536
10543
  var color = _ref2.color;
10537
10544
  return "var(--base-color-" + color + ")";
10538
10545
  });
10539
- var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
10546
+ var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
10540
10547
  var color = _ref3.color;
10541
10548
  return "var(--base-color-" + color + ")";
10542
10549
  });
@@ -10622,7 +10629,7 @@ var PasswordStrength = function PasswordStrength(_ref) {
10622
10629
  }, strengthLabel))));
10623
10630
  };
10624
10631
 
10625
- var _templateObject$1i, _templateObject2$Y, _templateObject3$O, _templateObject4$D, _templateObject5$u, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
10632
+ var _templateObject$1i, _templateObject2$Y, _templateObject3$O, _templateObject4$D, _templateObject5$v, _templateObject6$o, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
10626
10633
  var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
10627
10634
  var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
10628
10635
  var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
@@ -10631,12 +10638,12 @@ var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$D || (_templa
10631
10638
  }, function (props) {
10632
10639
  return "calc(100% / " + (props.columns - 1) + ")";
10633
10640
  }, devices.tablet, devices.mobile);
10634
- var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
10641
+ var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
10635
10642
  return "var(--base-color-" + props.lineColor + ")";
10636
10643
  }, function (props) {
10637
10644
  return "calc(100% / " + (props.columns - 1) + ")";
10638
10645
  }, devices.mobile);
10639
- var Pagination$1 = /*#__PURE__*/styled__default.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
10646
+ var Pagination$1 = /*#__PURE__*/styled__default.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
10640
10647
  var PageNumber$1 = /*#__PURE__*/styled__default.button(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
10641
10648
  var active = _ref.active;
10642
10649
  return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";