@royaloperahouse/harmonic 0.9.2 → 0.9.3-a
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/README.md +252 -43
- package/dist/components/atoms/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/atoms/Tab/Tab.d.ts +1 -1
- package/dist/components/atoms/TextField/TextField.style.d.ts +1 -1
- package/dist/components/molecules/ContactCard/ContactCard.style.d.ts +5 -4
- package/dist/components/molecules/Information/Information.style.d.ts +1 -1
- package/dist/components/molecules/Pagination/Pagination.d.ts +10 -3
- package/dist/components/molecules/Pagination/Pagination.style.d.ts +3 -3
- package/dist/components/molecules/Pagination/components/NavButtonOrLink.d.ts +4 -0
- package/dist/components/molecules/Pagination/components/PageLinkOrButton.d.ts +4 -0
- package/dist/components/molecules/Pagination/components/index.d.ts +2 -0
- package/dist/components/molecules/PromoWithTitle/PromoWithTitle.style.d.ts +1 -1
- package/dist/components/molecules/Table/Table.style.d.ts +1 -8
- package/dist/components/molecules/Table/components/DataCells.d.ts +7 -0
- package/dist/components/molecules/Table/components/HeaderCells.d.ts +7 -0
- package/dist/harmonic.cjs.development.css +319 -0
- package/dist/harmonic.cjs.development.js +265 -219
- package/dist/harmonic.cjs.development.js.map +1 -1
- package/dist/harmonic.cjs.production.min.js +1 -1
- package/dist/harmonic.cjs.production.min.js.map +1 -1
- package/dist/harmonic.esm.js +276 -227
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts +1 -0
- package/dist/types/contactCard.d.ts +8 -22
- package/dist/types/pagination.d.ts +9 -0
- package/dist/types/tableTypes.d.ts +8 -25
- package/dist/types/types.d.ts +9 -1
- package/package.json +1 -1
- package/README.GIT +0 -278
|
@@ -3833,6 +3833,7 @@ var Tab = function Tab(_ref) {
|
|
|
3833
3833
|
className = _ref.className,
|
|
3834
3834
|
role = _ref.role,
|
|
3835
3835
|
ariaLabel = _ref.ariaLabel,
|
|
3836
|
+
tabLinkId = _ref.tabLinkId,
|
|
3836
3837
|
color = _ref.color;
|
|
3837
3838
|
var clickHandler = function clickHandler() {
|
|
3838
3839
|
if (onClick) {
|
|
@@ -3863,8 +3864,9 @@ var Tab = function Tab(_ref) {
|
|
|
3863
3864
|
tabIndex: 0,
|
|
3864
3865
|
className: className
|
|
3865
3866
|
}, /*#__PURE__*/React__default.createElement(TabText, {
|
|
3866
|
-
|
|
3867
|
+
id: tabLinkId,
|
|
3867
3868
|
trimText: trimText,
|
|
3869
|
+
color: color,
|
|
3868
3870
|
withTextInMobile: withTextInMobile,
|
|
3869
3871
|
"aria-hidden": "true"
|
|
3870
3872
|
}, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -5422,6 +5424,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5422
5424
|
className = _ref.className,
|
|
5423
5425
|
role = _ref.role,
|
|
5424
5426
|
ariaLabel = _ref.ariaLabel,
|
|
5427
|
+
tabLinkId = _ref.tabLinkId,
|
|
5425
5428
|
trimTabText = _ref.trimTabText;
|
|
5426
5429
|
var node = React.useRef();
|
|
5427
5430
|
var _useState = React.useState(false),
|
|
@@ -5518,6 +5521,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5518
5521
|
};
|
|
5519
5522
|
var renderTab = function renderTab() {
|
|
5520
5523
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
|
|
5524
|
+
tabLinkId: tabLinkId,
|
|
5521
5525
|
trimText: trimTabText,
|
|
5522
5526
|
title: title,
|
|
5523
5527
|
titleLink: titleLink,
|
|
@@ -5597,7 +5601,8 @@ var Account = function Account(_ref) {
|
|
|
5597
5601
|
iconName: iconName,
|
|
5598
5602
|
withOptionsInMobile: false,
|
|
5599
5603
|
withIcon: "left",
|
|
5600
|
-
className: className
|
|
5604
|
+
className: className,
|
|
5605
|
+
tabLinkId: "account-link"
|
|
5601
5606
|
});
|
|
5602
5607
|
};
|
|
5603
5608
|
|
|
@@ -8442,8 +8447,7 @@ var Card = function Card(_ref) {
|
|
|
8442
8447
|
labelParams = _ref.labelParams,
|
|
8443
8448
|
_ref$isGridCard = _ref.isGridCard,
|
|
8444
8449
|
isGridCard = _ref$isGridCard === void 0 ? false : _ref$isGridCard,
|
|
8445
|
-
auxiliaryCTA = _ref.auxiliaryCTA
|
|
8446
|
-
onClick = _ref.onClick;
|
|
8450
|
+
auxiliaryCTA = _ref.auxiliaryCTA;
|
|
8447
8451
|
var truncate = function truncate(str, n) {
|
|
8448
8452
|
return str.length >= n ? str.substr(0, n) : str;
|
|
8449
8453
|
};
|
|
@@ -8494,7 +8498,7 @@ var Card = function Card(_ref) {
|
|
|
8494
8498
|
}, /*#__PURE__*/React__default.createElement("a", {
|
|
8495
8499
|
href: firstButton == null ? void 0 : firstButton.href,
|
|
8496
8500
|
target: firstButton == null ? void 0 : firstButton.target,
|
|
8497
|
-
onClick: onClick,
|
|
8501
|
+
onClick: firstButton == null ? void 0 : firstButton.onClick,
|
|
8498
8502
|
className: "targetLink",
|
|
8499
8503
|
style: {
|
|
8500
8504
|
flexGrow: onlyShowButtonsOnHover ? 'unset' : 1
|
|
@@ -8611,54 +8615,44 @@ var Cards = function Cards(_ref) {
|
|
|
8611
8615
|
}));
|
|
8612
8616
|
};
|
|
8613
8617
|
|
|
8614
|
-
var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j;
|
|
8615
|
-
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n
|
|
8616
|
-
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n
|
|
8617
|
-
|
|
8618
|
-
|
|
8619
|
-
|
|
8620
|
-
|
|
8621
|
-
|
|
8622
|
-
}, devices.mobileAndTablet);
|
|
8623
|
-
var AddressWrapperDesktop = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8624
|
-
var AddressWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n & > div {\n margin-bottom: 2px;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8625
|
-
var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n\n @media ", " {\n flex-direction: column;\n margin: 4px 0;\n }\n\n a {\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 color: var(--base-color-black);\n text-decoration: underline;\n\n &:before {\n display: inline-block;\n content: '';\n background-color: var(--base-color-black);\n width: 1px;\n height: 18px;\n margin: 0 8px -4px;\n\n @media ", " {\n display: none;\n }\n }\n\n &:first-child:before {\n display: none;\n }\n }\n"])), devices.mobile, devices.mobile);
|
|
8618
|
+
var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j, _templateObject6$g, _templateObject7$b;
|
|
8619
|
+
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobileAndTablet);
|
|
8620
|
+
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), devices.mobileAndTablet);
|
|
8621
|
+
var AddressWrapper = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 4px;\n"])));
|
|
8622
|
+
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: baseline;\n gap: 3px;\n"])));
|
|
8623
|
+
var MobileSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8624
|
+
var DesktopSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8625
|
+
var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n a {\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n color: var(--color-base-black);\n text-decoration: underline;\n text-underline-offset: 4px;\n margin-right: 13px;\n display: inline-block;\n\n &:last-child {\n margin-right: 0;\n }\n\n @media ", " {\n font-size: 17px;\n line-height: 24px;\n }\n }\n"])), devices.mobile);
|
|
8626
8626
|
|
|
8627
|
-
var divideAddressString = function divideAddressString(address) {
|
|
8628
|
-
return address.split(',').map(function (chunk, i) {
|
|
8629
|
-
return /*#__PURE__*/React__default.createElement(BodyText, {
|
|
8630
|
-
level: 1,
|
|
8631
|
-
key: i
|
|
8632
|
-
}, chunk.trim());
|
|
8633
|
-
});
|
|
8634
|
-
};
|
|
8635
8627
|
var ContactCard = function ContactCard(_ref) {
|
|
8636
|
-
var
|
|
8628
|
+
var title = _ref.title,
|
|
8629
|
+
titleSuffix = _ref.titleSuffix,
|
|
8637
8630
|
description = _ref.description,
|
|
8638
8631
|
email = _ref.email,
|
|
8639
8632
|
phone = _ref.phone,
|
|
8640
8633
|
website = _ref.website,
|
|
8641
8634
|
address = _ref.address,
|
|
8642
|
-
|
|
8643
|
-
hideBottomBorder = _ref$hideBottomBorder === void 0 ? false : _ref$hideBottomBorder,
|
|
8644
|
-
_ref$hideTopBorder = _ref.hideTopBorder,
|
|
8645
|
-
hideTopBorder = _ref$hideTopBorder === void 0 ? false : _ref$hideTopBorder;
|
|
8635
|
+
className = _ref.className;
|
|
8646
8636
|
var hasDetails = email || phone || website;
|
|
8647
8637
|
var addressString = address == null ? void 0 : address.substring(0, 110);
|
|
8648
8638
|
var descriptionText = description == null ? void 0 : description.substring(0, 110);
|
|
8649
|
-
return /*#__PURE__*/React__default.createElement(
|
|
8639
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
8640
|
+
className: className
|
|
8641
|
+
}, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
8650
8642
|
columnStartDesktop: 3,
|
|
8651
|
-
columnSpanDesktop:
|
|
8643
|
+
columnSpanDesktop: 12,
|
|
8652
8644
|
columnStartDevice: 1,
|
|
8653
8645
|
columnSpanDevice: 14
|
|
8654
8646
|
}, /*#__PURE__*/React__default.createElement(Wrapper$4, {
|
|
8655
|
-
"data-testid": "contact-card-wrapper"
|
|
8656
|
-
|
|
8657
|
-
|
|
8658
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
8659
|
-
|
|
8660
|
-
},
|
|
8661
|
-
|
|
8647
|
+
"data-testid": "contact-card-wrapper"
|
|
8648
|
+
}, /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, /*#__PURE__*/React__default.createElement(TitleWrapper$2, null, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
8649
|
+
size: "large"
|
|
8650
|
+
}, title), /*#__PURE__*/React__default.createElement(MobileSuffixWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
8651
|
+
size: "small"
|
|
8652
|
+
}, titleSuffix)), /*#__PURE__*/React__default.createElement(DesktopSuffixWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
8653
|
+
size: "small"
|
|
8654
|
+
}, titleSuffix))), descriptionText && /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
8655
|
+
size: "large"
|
|
8662
8656
|
}, descriptionText), hasDetails && (/*#__PURE__*/React__default.createElement(DetailsWrapper, {
|
|
8663
8657
|
"data-testid": "contact-card-details-block"
|
|
8664
8658
|
}, email && (/*#__PURE__*/React__default.createElement("a", {
|
|
@@ -8674,12 +8668,12 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
8674
8668
|
rel: "noreferrer"
|
|
8675
8669
|
}, website)))), addressString && (/*#__PURE__*/React__default.createElement("div", {
|
|
8676
8670
|
"data-testid": "contact-card-address-block"
|
|
8677
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
8678
|
-
|
|
8679
|
-
}, addressString))
|
|
8671
|
+
}, /*#__PURE__*/React__default.createElement(AddressWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
8672
|
+
size: "large"
|
|
8673
|
+
}, addressString)))))))));
|
|
8680
8674
|
};
|
|
8681
8675
|
|
|
8682
|
-
var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$
|
|
8676
|
+
var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$h;
|
|
8683
8677
|
var BodyTextRelative = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
8684
8678
|
var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 36px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
|
|
8685
8679
|
return props.clickable ? 'pointer' : 'default';
|
|
@@ -8689,7 +8683,7 @@ var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject
|
|
|
8689
8683
|
return props.showImage ? 2 : '1 / span 4';
|
|
8690
8684
|
}, devices.mobile);
|
|
8691
8685
|
var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
8692
|
-
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8686
|
+
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$h || (_templateObject6$h = /*#__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) {
|
|
8693
8687
|
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 ";
|
|
8694
8688
|
});
|
|
8695
8689
|
|
|
@@ -9048,7 +9042,7 @@ var Information = function Information(_ref) {
|
|
|
9048
9042
|
})))));
|
|
9049
9043
|
};
|
|
9050
9044
|
|
|
9051
|
-
var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$
|
|
9045
|
+
var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$i, _templateObject7$c, _templateObject8$8;
|
|
9052
9046
|
var PageHeadingWrapper = /*#__PURE__*/styled__default('div')(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: var(--page-header-bg-color);\n color: var(--color-base-white);\n\n ", ";\n\n h1,\n h2,\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
9053
9047
|
var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
|
|
9054
9048
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
@@ -9058,7 +9052,7 @@ var BadgeWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$z || (_te
|
|
|
9058
9052
|
var isPageHeadingWithoutTitle = _ref2.isPageHeadingWithoutTitle;
|
|
9059
9053
|
return isPageHeadingWithoutTitle && "\n height: 50px;\n padding-bottom: 0;\n margin: 10px 0;\n ";
|
|
9060
9054
|
});
|
|
9061
|
-
var TitleWrapper$
|
|
9055
|
+
var TitleWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n ", ";\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), function (_ref3) {
|
|
9062
9056
|
var isPageHeadingWithoutTitle = _ref3.isPageHeadingWithoutTitle;
|
|
9063
9057
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
9064
9058
|
}, devices.mobile);
|
|
@@ -9066,8 +9060,8 @@ var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_t
|
|
|
9066
9060
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
9067
9061
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
9068
9062
|
}, devices.mobile);
|
|
9069
|
-
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
9070
|
-
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
9063
|
+
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-base-white);\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
9064
|
+
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__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 ", ";\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n\n ", ";\n }\n }\n"])), function (_ref5) {
|
|
9071
9065
|
var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
|
|
9072
9066
|
return isPageHeadingWithoutTitle && "\n margin-top: 40px;\n ";
|
|
9073
9067
|
}, devices.mobile, function (_ref6) {
|
|
@@ -9124,7 +9118,7 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
9124
9118
|
className: className,
|
|
9125
9119
|
"data-testid": "page-heading-wrapper",
|
|
9126
9120
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
9127
|
-
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9121
|
+
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$3, {
|
|
9128
9122
|
"data-testid": "page-heading-title",
|
|
9129
9123
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
9130
9124
|
}, renderBadge(theme), children ? (/*#__PURE__*/React__default.createElement(ChildrenWrapper, {
|
|
@@ -9149,14 +9143,14 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
9149
9143
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
|
|
9150
9144
|
};
|
|
9151
9145
|
|
|
9152
|
-
var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$
|
|
9146
|
+
var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$j, _templateObject7$d, _templateObject8$9;
|
|
9153
9147
|
var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$10 || (_templateObject$10 = /*#__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);
|
|
9154
9148
|
var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__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);
|
|
9155
9149
|
var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$A || (_templateObject3$A = /*#__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);
|
|
9156
9150
|
var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__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);
|
|
9157
9151
|
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
9158
|
-
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
9159
|
-
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
9152
|
+
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__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);
|
|
9153
|
+
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__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);
|
|
9160
9154
|
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$9 || (_templateObject8$9 = /*#__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);
|
|
9161
9155
|
|
|
9162
9156
|
var _excluded$l = ["text"];
|
|
@@ -9264,7 +9258,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
9264
9258
|
})))));
|
|
9265
9259
|
};
|
|
9266
9260
|
|
|
9267
|
-
var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$
|
|
9261
|
+
var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$k, _templateObject7$e, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
|
|
9268
9262
|
var Wrapper$5 = /*#__PURE__*/styled__default.section(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
9269
9263
|
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
9270
9264
|
var SponsorWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__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);
|
|
@@ -9276,8 +9270,8 @@ var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$p || (_te
|
|
|
9276
9270
|
var showBlock = _ref2.showBlock;
|
|
9277
9271
|
return showBlock ? 'block' : 'none';
|
|
9278
9272
|
}, devices.mobile);
|
|
9279
|
-
var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
9280
|
-
var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
9273
|
+
var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n height: 32px;\n }\n\n @media ", " {\n margin-bottom: 12px;\n }\n"])), devices.mobile);
|
|
9274
|
+
var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: start;\n align-items: center;\n width: 200px;\n\n @media ", " {\n order: ", ";\n width: 100%;\n justify-content: center;\n }\n"])), devices.mobile, function (_ref3) {
|
|
9281
9275
|
var isBadgePresent = _ref3.isBadgePresent;
|
|
9282
9276
|
return isBadgePresent ? '1' : '4';
|
|
9283
9277
|
});
|
|
@@ -9286,7 +9280,7 @@ var MainButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject8$a || (
|
|
|
9286
9280
|
return isAdditionalButtonPresent ? '20px' : '0';
|
|
9287
9281
|
});
|
|
9288
9282
|
var AdditionalButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n width: 100%;\n display: flex;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9289
|
-
var TitleWrapper$
|
|
9283
|
+
var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject0$5 || (_templateObject0$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 10px 0;\n\n h1,\n h2,\n h3 {\n color: ", ";\n }\n\n @media ", " {\n padding: 0;\n order: 2;\n margin-bottom: ", ";\n }\n"])), function (_ref5) {
|
|
9290
9284
|
var theme = _ref5.theme;
|
|
9291
9285
|
return theme == exports.ThemeType.Cinema ? 'var(--color-base-black)' : 'var(--color-base-white)';
|
|
9292
9286
|
}, devices.mobile, function (_ref6) {
|
|
@@ -9440,7 +9434,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9440
9434
|
}), !badge && (/*#__PURE__*/React__default.createElement(AdditionalButtonWrapper, null, /*#__PURE__*/React__default.createElement(Button$1, {
|
|
9441
9435
|
theme: theme,
|
|
9442
9436
|
link: additionalLink
|
|
9443
|
-
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9437
|
+
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
|
|
9444
9438
|
theme: theme,
|
|
9445
9439
|
isButtonPresent: !!mainLink || !!additionalLink
|
|
9446
9440
|
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
@@ -9458,7 +9452,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9458
9452
|
theme: theme,
|
|
9459
9453
|
badge: badge,
|
|
9460
9454
|
isMobile: isMobile
|
|
9461
|
-
}))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9455
|
+
}))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
|
|
9462
9456
|
theme: theme,
|
|
9463
9457
|
isButtonPresent: !!mainLink || !!additionalLink
|
|
9464
9458
|
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
@@ -9478,12 +9472,12 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9478
9472
|
})))))))))));
|
|
9479
9473
|
};
|
|
9480
9474
|
|
|
9481
|
-
var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$
|
|
9475
|
+
var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$l, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject0$6;
|
|
9482
9476
|
var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$13 || (_templateObject$13 = /*#__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);
|
|
9483
9477
|
var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__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"])));
|
|
9484
9478
|
var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
9485
9479
|
var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__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);
|
|
9486
|
-
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$
|
|
9480
|
+
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$l || (_templateObject6$l = /*#__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) {
|
|
9487
9481
|
var invert = _ref.invert,
|
|
9488
9482
|
theme = _ref.theme;
|
|
9489
9483
|
return invert ? theme.colors.white : theme.colors.primary;
|
|
@@ -9499,7 +9493,7 @@ var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObjec
|
|
|
9499
9493
|
var theme = _ref4.theme;
|
|
9500
9494
|
return theme.colors.primary === theme.colors.stream && "\n color: " + theme.colors.stream + ";\n background-color: " + theme.colors.white + ";\n ";
|
|
9501
9495
|
}, devices.tablet, devices.mobile);
|
|
9502
|
-
var CompactHeaderLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
9496
|
+
var CompactHeaderLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: logo;\n padding-left: 50px;\n justify-content: left;\n align-items: center;\n width: 100%;\n @media ", " {\n padding-left: 0px;\n justify-content: center;\n }\n @media ", " {\n width: fit-content;\n }\n"])), devices.mobile, devices.tablet);
|
|
9503
9497
|
var CompactHeaderTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: title;\n align-items: center;\n justify-content: center;\n font-family: var(--font-family-header);\n text-transform: uppercase;\n text-align: center;\n padding: 0 2em;\n @media ", " {\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9504
9498
|
var CompactHeaderCTAWrapper = /*#__PURE__*/styled__default.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: cta;\n justify-content: right;\n align-items: center;\n padding-right: 50px;\n @media ", " {\n padding-right: 0px;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9505
9499
|
var PrimaryButtonWithInversion = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject0$6 || (_templateObject0$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n color: ", ";\n svg {\n fill: ", ";\n path {\n fill: ", ";\n }\n }\n min-width: 145px;\n"])), function (_ref5) {
|
|
@@ -9732,21 +9726,76 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
9732
9726
|
}), linkText))))));
|
|
9733
9727
|
};
|
|
9734
9728
|
|
|
9735
|
-
var _templateObject$14, _templateObject2$R, _templateObject3$E,
|
|
9736
|
-
|
|
9737
|
-
var
|
|
9738
|
-
var PaginationLink = /*#__PURE__*/styled__default.a(
|
|
9739
|
-
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(
|
|
9740
|
-
var LastPageItem = /*#__PURE__*/styled__default.li(
|
|
9741
|
-
var PreviousPageItem = /*#__PURE__*/styled__default.li(
|
|
9742
|
-
var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(
|
|
9729
|
+
var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$m, _templateObject7$g, _templateObject8$c;
|
|
9730
|
+
var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover,\n &:focus {\n outline: none;\n }\n"])));
|
|
9731
|
+
var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9732
|
+
var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9733
|
+
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n align-items: center;\n }\n li:first-child {\n margin-left: 0px;\n }\n"])));
|
|
9734
|
+
var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
9735
|
+
var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
9736
|
+
var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
|
|
9743
9737
|
var active = _ref.active;
|
|
9744
9738
|
return active ? "var(--color-primary-red)" : 'inherit';
|
|
9745
9739
|
}, function (_ref2) {
|
|
9746
9740
|
var active = _ref2.active;
|
|
9747
9741
|
return "1px solid " + (active ? 'var(--color-primary-red)' : 'transparent');
|
|
9748
9742
|
});
|
|
9749
|
-
|
|
9743
|
+
|
|
9744
|
+
var NavButtonOrLink = function NavButtonOrLink(_ref) {
|
|
9745
|
+
var page = _ref.page,
|
|
9746
|
+
children = _ref.children,
|
|
9747
|
+
onPageChange = _ref.onPageChange,
|
|
9748
|
+
baseUrl = _ref.baseUrl,
|
|
9749
|
+
keyProp = _ref.keyProp,
|
|
9750
|
+
testId = _ref.testId,
|
|
9751
|
+
ariaLabel = _ref.ariaLabel;
|
|
9752
|
+
if (onPageChange) {
|
|
9753
|
+
return /*#__PURE__*/React__default.createElement(PageNav, {
|
|
9754
|
+
"aria-label": ariaLabel,
|
|
9755
|
+
as: "button",
|
|
9756
|
+
type: "button",
|
|
9757
|
+
onClick: function onClick() {
|
|
9758
|
+
return onPageChange(page);
|
|
9759
|
+
},
|
|
9760
|
+
key: keyProp,
|
|
9761
|
+
"data-testid": testId
|
|
9762
|
+
}, children);
|
|
9763
|
+
}
|
|
9764
|
+
return /*#__PURE__*/React__default.createElement(PageNav, {
|
|
9765
|
+
"aria-label": ariaLabel,
|
|
9766
|
+
href: "" + (baseUrl != null ? baseUrl : '') + page,
|
|
9767
|
+
key: keyProp,
|
|
9768
|
+
"data-testid": testId
|
|
9769
|
+
}, children);
|
|
9770
|
+
};
|
|
9771
|
+
|
|
9772
|
+
var PageLinkOrButton = function PageLinkOrButton(_ref) {
|
|
9773
|
+
var page = _ref.page,
|
|
9774
|
+
children = _ref.children,
|
|
9775
|
+
onPageChange = _ref.onPageChange,
|
|
9776
|
+
baseUrl = _ref.baseUrl,
|
|
9777
|
+
keyProp = _ref.keyProp,
|
|
9778
|
+
testId = _ref.testId,
|
|
9779
|
+
ariaLabel = _ref.ariaLabel;
|
|
9780
|
+
if (onPageChange) {
|
|
9781
|
+
return /*#__PURE__*/React__default.createElement(PaginationLink, {
|
|
9782
|
+
"aria-label": ariaLabel,
|
|
9783
|
+
as: "button",
|
|
9784
|
+
type: "button",
|
|
9785
|
+
onClick: function onClick() {
|
|
9786
|
+
return onPageChange(page);
|
|
9787
|
+
},
|
|
9788
|
+
key: keyProp,
|
|
9789
|
+
"data-testid": testId
|
|
9790
|
+
}, children);
|
|
9791
|
+
}
|
|
9792
|
+
return /*#__PURE__*/React__default.createElement(PaginationLink, {
|
|
9793
|
+
"aria-label": ariaLabel,
|
|
9794
|
+
href: "" + (baseUrl != null ? baseUrl : '') + page,
|
|
9795
|
+
key: keyProp,
|
|
9796
|
+
"data-testid": testId
|
|
9797
|
+
}, children);
|
|
9798
|
+
};
|
|
9750
9799
|
|
|
9751
9800
|
var reducePages = function reducePages(pages, currentPage) {
|
|
9752
9801
|
// If there are less than 6 pages, return all pages
|
|
@@ -9768,33 +9817,42 @@ var Pagination = function Pagination(_ref) {
|
|
|
9768
9817
|
var pageCount = _ref.pageCount,
|
|
9769
9818
|
currentPage = _ref.currentPage,
|
|
9770
9819
|
baseUrl = _ref.baseUrl,
|
|
9771
|
-
className = _ref.className
|
|
9772
|
-
|
|
9820
|
+
className = _ref.className,
|
|
9821
|
+
onPageChange = _ref.onPageChange;
|
|
9773
9822
|
var pageNumbers = Array.from(Array(pageCount + 1).keys()).slice(1);
|
|
9774
9823
|
var reducedPageNumbers = reducePages(pageNumbers, currentPage);
|
|
9775
9824
|
return /*#__PURE__*/React__default.createElement(PageNumberWrapper, {
|
|
9776
9825
|
className: className
|
|
9777
|
-
},
|
|
9778
|
-
|
|
9779
|
-
|
|
9780
|
-
|
|
9826
|
+
}, currentPage > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
|
|
9827
|
+
ariaLabel: "Backward arrow, skip to first page",
|
|
9828
|
+
page: 1,
|
|
9829
|
+
onPageChange: onPageChange,
|
|
9830
|
+
baseUrl: baseUrl
|
|
9781
9831
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
9832
|
+
"aria-hidden": "true",
|
|
9782
9833
|
iconName: "LastPageArrow",
|
|
9783
9834
|
direction: "right"
|
|
9784
9835
|
}))), /*#__PURE__*/React__default.createElement(PreviousPageItem, {
|
|
9785
9836
|
key: "previous-page",
|
|
9786
9837
|
"data-testid": "left-arrow"
|
|
9787
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
9788
|
-
|
|
9838
|
+
}, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
|
|
9839
|
+
ariaLabel: "Backward arrow, skip one page back",
|
|
9840
|
+
page: currentPage - 1,
|
|
9841
|
+
onPageChange: onPageChange,
|
|
9842
|
+
baseUrl: baseUrl
|
|
9789
9843
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
9844
|
+
"aria-hidden": "true",
|
|
9790
9845
|
iconName: "ArrowPagination",
|
|
9791
9846
|
direction: "right"
|
|
9792
9847
|
}))))), reducedPageNumbers.map(function (page) {
|
|
9793
9848
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
9794
9849
|
key: page
|
|
9795
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
9796
|
-
|
|
9797
|
-
|
|
9850
|
+
}, /*#__PURE__*/React__default.createElement(PageLinkOrButton, {
|
|
9851
|
+
ariaLabel: "Page " + page + ", " + (page === currentPage ? 'it is a current page' : "skip to page " + page),
|
|
9852
|
+
page: page,
|
|
9853
|
+
onPageChange: onPageChange,
|
|
9854
|
+
baseUrl: baseUrl,
|
|
9855
|
+
testId: "page-number"
|
|
9798
9856
|
}, /*#__PURE__*/React__default.createElement(TextLinkPagination, {
|
|
9799
9857
|
size: "large",
|
|
9800
9858
|
active: page === currentPage
|
|
@@ -9802,27 +9860,35 @@ var Pagination = function Pagination(_ref) {
|
|
|
9802
9860
|
}), currentPage < pageCount && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", {
|
|
9803
9861
|
key: "next-page",
|
|
9804
9862
|
"data-testid": "right-arrow"
|
|
9805
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
9806
|
-
|
|
9863
|
+
}, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
|
|
9864
|
+
ariaLabel: "Forward arrow, skip one page forward",
|
|
9865
|
+
page: currentPage + 1,
|
|
9866
|
+
onPageChange: onPageChange,
|
|
9867
|
+
baseUrl: baseUrl
|
|
9807
9868
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
9869
|
+
"aria-hidden": "true",
|
|
9808
9870
|
iconName: "ArrowPagination",
|
|
9809
9871
|
direction: "left"
|
|
9810
|
-
}))), /*#__PURE__*/React__default.createElement(LastPageItem, null, /*#__PURE__*/React__default.createElement(
|
|
9811
|
-
|
|
9872
|
+
}))), /*#__PURE__*/React__default.createElement(LastPageItem, null, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
|
|
9873
|
+
ariaLabel: "Forward arrow, skip to last page",
|
|
9874
|
+
page: pageCount,
|
|
9875
|
+
onPageChange: onPageChange,
|
|
9876
|
+
baseUrl: baseUrl
|
|
9812
9877
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
9878
|
+
"aria-hidden": "true",
|
|
9813
9879
|
iconName: "LastPageArrow",
|
|
9814
9880
|
direction: "left"
|
|
9815
9881
|
}))))));
|
|
9816
9882
|
};
|
|
9817
9883
|
|
|
9818
|
-
var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$
|
|
9884
|
+
var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$n, _templateObject7$h;
|
|
9819
9885
|
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$15 || (_templateObject$15 = /*#__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);
|
|
9820
9886
|
var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
9821
9887
|
var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
9822
|
-
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
9888
|
+
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
9823
9889
|
var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
9824
|
-
var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$
|
|
9825
|
-
var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$
|
|
9890
|
+
var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$n || (_templateObject6$n = /*#__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"])));
|
|
9891
|
+
var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
|
|
9826
9892
|
|
|
9827
9893
|
var Person = function Person(_ref) {
|
|
9828
9894
|
var person = _ref.person,
|
|
@@ -9879,14 +9945,14 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
9879
9945
|
}));
|
|
9880
9946
|
};
|
|
9881
9947
|
|
|
9882
|
-
var _templateObject$16, _templateObject2$T, _templateObject3$G, _templateObject4$
|
|
9948
|
+
var _templateObject$16, _templateObject2$T, _templateObject3$G, _templateObject4$y;
|
|
9883
9949
|
var ReplacementWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
9884
9950
|
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n\n grid-template-columns: ", ";\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: repeat(2, 1fr);\n }\n"])), function (_ref) {
|
|
9885
9951
|
var columnCount = _ref.columnCount;
|
|
9886
9952
|
return "repeat(" + columnCount + ", 1fr)";
|
|
9887
9953
|
}, devices.mobile, devices.tablet);
|
|
9888
9954
|
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
|
|
9889
|
-
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
9955
|
+
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
9890
9956
|
|
|
9891
9957
|
// Get the total character length of a property in an array of objects
|
|
9892
9958
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
@@ -10004,7 +10070,7 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
10004
10070
|
}, creditEntries);
|
|
10005
10071
|
};
|
|
10006
10072
|
|
|
10007
|
-
var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$
|
|
10073
|
+
var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$o, _templateObject7$i, _templateObject8$d, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
|
|
10008
10074
|
var LENGTH_TEXT = 28;
|
|
10009
10075
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
10010
10076
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
@@ -10023,7 +10089,7 @@ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$17 ||
|
|
|
10023
10089
|
});
|
|
10024
10090
|
var PromoWithTagsSubtitle = /*#__PURE__*/styled__default.span(_templateObject2$U || (_templateObject2$U = /*#__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"])));
|
|
10025
10091
|
var PromoWithTagsText = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__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: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n"])));
|
|
10026
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10092
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
|
|
10027
10093
|
var hasTextLinks = _ref4.hasTextLinks;
|
|
10028
10094
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
10029
10095
|
}, function (_ref5) {
|
|
@@ -10051,9 +10117,9 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
|
10051
10117
|
var marginBottom = _ref7.marginBottom;
|
|
10052
10118
|
return marginBottom + "px";
|
|
10053
10119
|
});
|
|
10054
|
-
var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$
|
|
10055
|
-
var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
10056
|
-
var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject8$
|
|
10120
|
+
var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
10121
|
+
var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
10122
|
+
var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
10057
10123
|
var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject9$7 || (_templateObject9$7 = /*#__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);
|
|
10058
10124
|
var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject0$7 || (_templateObject0$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
|
|
10059
10125
|
var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject1$4 || (_templateObject1$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
@@ -10256,7 +10322,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10256
10322
|
}))));
|
|
10257
10323
|
};
|
|
10258
10324
|
|
|
10259
|
-
var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$
|
|
10325
|
+
var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$A, _templateObject5$u, _templateObject6$p, _templateObject7$j;
|
|
10260
10326
|
var LENGTH_TEXT$2 = 28;
|
|
10261
10327
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
10262
10328
|
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$18 || (_templateObject$18 = /*#__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) {
|
|
@@ -10274,10 +10340,10 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObj
|
|
|
10274
10340
|
var imageToLeft = _ref4.imageToLeft;
|
|
10275
10341
|
return imageToLeft ? 'right' : 'left';
|
|
10276
10342
|
}, devices.mobile);
|
|
10277
|
-
var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$
|
|
10343
|
+
var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
|
|
10278
10344
|
var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
10279
|
-
var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$
|
|
10280
|
-
var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
10345
|
+
var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
|
|
10346
|
+
var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
|
|
10281
10347
|
var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
|
|
10282
10348
|
primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
|
|
10283
10349
|
_ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
|
|
@@ -10710,7 +10776,7 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
10710
10776
|
}, description)))));
|
|
10711
10777
|
};
|
|
10712
10778
|
|
|
10713
|
-
var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$
|
|
10779
|
+
var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$B, _templateObject5$v, _templateObject6$q, _templateObject7$k, _templateObject8$e, _templateObject9$8, _templateObject0$8, _templateObject1$5;
|
|
10714
10780
|
var stateStyles = /*#__PURE__*/styled.css(_templateObject$1e || (_templateObject$1e = /*#__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) {
|
|
10715
10781
|
var theme = _ref.theme;
|
|
10716
10782
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
@@ -10726,7 +10792,7 @@ var borderStyles = /*#__PURE__*/styled.css(_templateObject2$Y || (_templateObjec
|
|
|
10726
10792
|
return theme.colors.darkgrey;
|
|
10727
10793
|
});
|
|
10728
10794
|
var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
10729
|
-
var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$
|
|
10795
|
+
var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
|
|
10730
10796
|
var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
|
|
10731
10797
|
var theme = _ref5.theme;
|
|
10732
10798
|
return {
|
|
@@ -10735,9 +10801,9 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
|
|
|
10735
10801
|
title: 'Select Arrow'
|
|
10736
10802
|
};
|
|
10737
10803
|
})(_templateObject5$v || (_templateObject5$v = /*#__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"])));
|
|
10738
|
-
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
10739
|
-
var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
10740
|
-
var Options = /*#__PURE__*/styled__default.div(_templateObject8$
|
|
10804
|
+
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
10805
|
+
var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
10806
|
+
var Options = /*#__PURE__*/styled__default.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
10741
10807
|
var Option = /*#__PURE__*/styled__default.li(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
|
|
10742
10808
|
var theme = _ref6.theme,
|
|
10743
10809
|
hover = _ref6.hover;
|
|
@@ -11091,7 +11157,7 @@ function Select(_ref3) {
|
|
|
11091
11157
|
})))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
11092
11158
|
}
|
|
11093
11159
|
|
|
11094
|
-
var _templateObject$1f, _templateObject2$Z, _templateObject3$M, _templateObject4$
|
|
11160
|
+
var _templateObject$1f, _templateObject2$Z, _templateObject3$M, _templateObject4$C;
|
|
11095
11161
|
var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
11096
11162
|
var SelectWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .harmonic-select__control--is-focused {\n border-color: var(--base-color-dark-grey);\n box-shadow: ", ";\n }\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\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 text-transform: var(--text-transform-altHeader);\n }\n .harmonic-select__placeholder {\n color: var(--base-color-dark-grey);\n }\n .harmonic-select__single-value {\n color: var(--base-color-black);\n }\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--base-color-light-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--base-color-dark-grey);\n }\n }\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-dark-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\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 text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--base-color-mid-grey);\n }\n }\n .harmonic-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\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 text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .harmonic-select__menu-notice {\n padding: 20px 20px;\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 letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-align: left;\n }\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
11097
11163
|
var width = _ref.width;
|
|
@@ -11115,7 +11181,7 @@ var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templ
|
|
|
11115
11181
|
if (darkMode) return "var(--base-color-white)";
|
|
11116
11182
|
return "var(--base-color-black)";
|
|
11117
11183
|
});
|
|
11118
|
-
var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11184
|
+
var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
11119
11185
|
var darkMode = _ref6.darkMode;
|
|
11120
11186
|
if (darkMode) return "var(--base-color-white)";
|
|
11121
11187
|
return "var(--base-color-errorstate)";
|
|
@@ -11305,13 +11371,13 @@ var Quote = function Quote(_ref) {
|
|
|
11305
11371
|
}, attribution))));
|
|
11306
11372
|
};
|
|
11307
11373
|
|
|
11308
|
-
var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$
|
|
11374
|
+
var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$D, _templateObject5$w, _templateObject6$r;
|
|
11309
11375
|
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1i || (_templateObject$1i = /*#__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"])));
|
|
11310
11376
|
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
11311
11377
|
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
11312
|
-
var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11378
|
+
var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
11313
11379
|
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$w || (_templateObject5$w = /*#__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);
|
|
11314
|
-
var TitleWrapper$
|
|
11380
|
+
var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__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);
|
|
11315
11381
|
|
|
11316
11382
|
var MiniCard = function MiniCard(_ref) {
|
|
11317
11383
|
var _ref$title = _ref.title,
|
|
@@ -11344,19 +11410,19 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
11344
11410
|
columnSpanDesktop: 4
|
|
11345
11411
|
}, /*#__PURE__*/React__default.createElement(ContentContainer$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
11346
11412
|
level: 4
|
|
11347
|
-
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
11413
|
+
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$5, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
11348
11414
|
level: 2
|
|
11349
11415
|
}, title)))));
|
|
11350
11416
|
};
|
|
11351
11417
|
|
|
11352
|
-
var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$
|
|
11418
|
+
var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$E, _templateObject5$x;
|
|
11353
11419
|
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__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"])));
|
|
11354
11420
|
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$11 || (_templateObject2$11 = /*#__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"])));
|
|
11355
11421
|
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
11356
11422
|
var isVisible = _ref.isVisible;
|
|
11357
11423
|
return isVisible ? 'visible' : 'hidden';
|
|
11358
11424
|
});
|
|
11359
|
-
var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11425
|
+
var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
|
|
11360
11426
|
var isVisible = _ref2.isVisible;
|
|
11361
11427
|
return isVisible ? 'visible' : 'hidden';
|
|
11362
11428
|
});
|
|
@@ -11441,11 +11507,11 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
11441
11507
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
11442
11508
|
};
|
|
11443
11509
|
|
|
11444
|
-
var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$
|
|
11510
|
+
var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$F, _templateObject5$y;
|
|
11445
11511
|
var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
11446
11512
|
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$12 || (_templateObject2$12 = /*#__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);
|
|
11447
11513
|
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$Q || (_templateObject3$Q = /*#__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);
|
|
11448
|
-
var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$
|
|
11514
|
+
var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$F || (_templateObject4$F = /*#__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 text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), exports.Colors.Black, function (_ref) {
|
|
11449
11515
|
var isActive = _ref.isActive;
|
|
11450
11516
|
return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
11451
11517
|
}, exports.Colors.MidGrey);
|
|
@@ -11605,19 +11671,19 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
11605
11671
|
});
|
|
11606
11672
|
};
|
|
11607
11673
|
|
|
11608
|
-
var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$
|
|
11674
|
+
var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$G, _templateObject5$z, _templateObject6$s;
|
|
11609
11675
|
var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
11610
11676
|
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
11611
11677
|
var Section = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
11612
11678
|
var color = _ref.color;
|
|
11613
11679
|
return "var(--base-color-" + color + ")";
|
|
11614
11680
|
});
|
|
11615
|
-
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11681
|
+
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
11616
11682
|
var Text = /*#__PURE__*/styled__default.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
11617
11683
|
var color = _ref2.color;
|
|
11618
11684
|
return "var(--base-color-" + color + ")";
|
|
11619
11685
|
});
|
|
11620
|
-
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
11686
|
+
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
11621
11687
|
var color = _ref3.color;
|
|
11622
11688
|
return "var(--base-color-" + color + ")";
|
|
11623
11689
|
});
|
|
@@ -11699,28 +11765,19 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
11699
11765
|
}, strengthLabel))));
|
|
11700
11766
|
};
|
|
11701
11767
|
|
|
11702
|
-
var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$
|
|
11768
|
+
var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$H, _templateObject5$A, _templateObject6$t, _templateObject7$l, _templateObject8$f;
|
|
11703
11769
|
var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
11704
11770
|
var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
11705
11771
|
var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
11706
|
-
var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$
|
|
11707
|
-
return "var(--base-color-" + props.lineColor + ")";
|
|
11708
|
-
}, function (props) {
|
|
11772
|
+
var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: uppercase;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n min-width: 150px;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
11709
11773
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11710
11774
|
}, devices.tablet, devices.mobile);
|
|
11711
|
-
var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n
|
|
11712
|
-
return "var(--base-color-" + props.lineColor + ")";
|
|
11713
|
-
}, function (props) {
|
|
11775
|
+
var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\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 min-width: 150px;\n }\n"])), function (props) {
|
|
11714
11776
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11715
11777
|
}, devices.mobile);
|
|
11716
|
-
var
|
|
11717
|
-
var
|
|
11718
|
-
|
|
11719
|
-
return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";
|
|
11720
|
-
});
|
|
11721
|
-
var Next = /*#__PURE__*/styled__default.span(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
|
|
11722
|
-
var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 0 0 24px 0;\n\n div:hover {\n background-color: var(--base-color-light-grey);\n }\n\n > div > div {\n background-color: var(--base-color-light-grey);\n }\n\n svg path {\n fill: var(--base-color-black) !important;\n }\n"])));
|
|
11723
|
-
var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
11778
|
+
var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
|
|
11779
|
+
var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
|
|
11780
|
+
var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
11724
11781
|
|
|
11725
11782
|
/* eslint-disable react/no-danger */
|
|
11726
11783
|
var Content = function Content(_ref) {
|
|
@@ -11745,23 +11802,25 @@ var scrollTable = function scrollTable(tableRef, direction) {
|
|
|
11745
11802
|
var Cell = function Cell(_ref) {
|
|
11746
11803
|
var cell = _ref.cell,
|
|
11747
11804
|
cellIndex = _ref.cellIndex,
|
|
11748
|
-
columns = _ref.columns
|
|
11749
|
-
|
|
11805
|
+
columns = _ref.columns;
|
|
11806
|
+
var isText = typeof cell === 'string' || typeof cell === 'number';
|
|
11750
11807
|
return /*#__PURE__*/React__default.createElement(TableCell, {
|
|
11751
11808
|
key: cellIndex,
|
|
11752
11809
|
columns: columns,
|
|
11753
|
-
role: "gridcell"
|
|
11754
|
-
|
|
11810
|
+
role: "gridcell"
|
|
11811
|
+
}, isText ? (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
11812
|
+
size: "large"
|
|
11755
11813
|
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
11756
11814
|
content: cell
|
|
11757
|
-
}))
|
|
11815
|
+
}))) : (/*#__PURE__*/React__default.createElement(Content, {
|
|
11816
|
+
content: cell
|
|
11817
|
+
})));
|
|
11758
11818
|
};
|
|
11759
11819
|
|
|
11760
11820
|
var Row = function Row(_ref) {
|
|
11761
11821
|
var row = _ref.row,
|
|
11762
11822
|
rowIndex = _ref.rowIndex,
|
|
11763
|
-
columns = _ref.columns
|
|
11764
|
-
lineColor = _ref.lineColor;
|
|
11823
|
+
columns = _ref.columns;
|
|
11765
11824
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
|
|
11766
11825
|
key: rowIndex
|
|
11767
11826
|
}, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
|
|
@@ -11769,28 +11828,61 @@ var Row = function Row(_ref) {
|
|
|
11769
11828
|
key: index,
|
|
11770
11829
|
cell: cell,
|
|
11771
11830
|
cellIndex: index,
|
|
11772
|
-
columns: columns
|
|
11773
|
-
lineColor: lineColor
|
|
11831
|
+
columns: columns
|
|
11774
11832
|
});
|
|
11775
11833
|
})));
|
|
11776
11834
|
};
|
|
11777
11835
|
|
|
11836
|
+
var DataCells = function DataCells(_ref) {
|
|
11837
|
+
var currentRows = _ref.currentRows,
|
|
11838
|
+
columns = _ref.columns;
|
|
11839
|
+
return /*#__PURE__*/React__default.createElement("tbody", null, Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
|
|
11840
|
+
return /*#__PURE__*/React__default.createElement(Row, {
|
|
11841
|
+
key: rowIndex,
|
|
11842
|
+
row: row,
|
|
11843
|
+
rowIndex: rowIndex,
|
|
11844
|
+
columns: columns
|
|
11845
|
+
});
|
|
11846
|
+
}));
|
|
11847
|
+
};
|
|
11848
|
+
|
|
11849
|
+
var HeaderCells = function HeaderCells(_ref) {
|
|
11850
|
+
var headings = _ref.headings,
|
|
11851
|
+
columns = _ref.columns;
|
|
11852
|
+
return /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", {
|
|
11853
|
+
role: "row"
|
|
11854
|
+
}, headings == null ? void 0 : headings.map(function (heading, index) {
|
|
11855
|
+
return /*#__PURE__*/React__default.createElement(TableHeader, {
|
|
11856
|
+
key: index,
|
|
11857
|
+
role: "columnheader",
|
|
11858
|
+
scope: "col",
|
|
11859
|
+
columns: columns
|
|
11860
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
11861
|
+
size: "small"
|
|
11862
|
+
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
11863
|
+
content: heading
|
|
11864
|
+
})));
|
|
11865
|
+
})));
|
|
11866
|
+
};
|
|
11867
|
+
|
|
11778
11868
|
/* eslint-disable react/jsx-one-expression-per-line */
|
|
11779
11869
|
var Table = function Table(_ref) {
|
|
11780
11870
|
var columns = _ref.columns,
|
|
11781
11871
|
headings = _ref.headings,
|
|
11782
11872
|
children = _ref.children,
|
|
11783
|
-
lineColors = _ref.lineColors,
|
|
11784
11873
|
rowsPerPage = _ref.rowsPerPage,
|
|
11785
11874
|
pagination = _ref.pagination,
|
|
11786
|
-
description = _ref.description
|
|
11875
|
+
description = _ref.description,
|
|
11876
|
+
className = _ref.className;
|
|
11787
11877
|
var _useState = React.useState(0),
|
|
11788
11878
|
currentPage = _useState[0],
|
|
11789
11879
|
setCurrentPage = _useState[1];
|
|
11790
11880
|
var _useState2 = React.useState(false),
|
|
11791
11881
|
showScrollButtons = _useState2[0],
|
|
11792
11882
|
setShowScrollButtons = _useState2[1];
|
|
11793
|
-
var
|
|
11883
|
+
var handlePageChange = function handlePageChange(page) {
|
|
11884
|
+
setCurrentPage(page - 1);
|
|
11885
|
+
};
|
|
11794
11886
|
var tableRef = React.useRef(null);
|
|
11795
11887
|
React.useLayoutEffect(function () {
|
|
11796
11888
|
var horizontalScroll = function horizontalScroll() {
|
|
@@ -11804,14 +11896,8 @@ var Table = function Table(_ref) {
|
|
|
11804
11896
|
return window.removeEventListener('resize', horizontalScroll);
|
|
11805
11897
|
};
|
|
11806
11898
|
}, []);
|
|
11807
|
-
var totalRows = Array.isArray(children) ? children.length
|
|
11899
|
+
var totalRows = Array.isArray(children) ? children.length : 1;
|
|
11808
11900
|
var totalPages = pagination ? Math.ceil(totalRows / rowsPerPage) : 1;
|
|
11809
|
-
var pageNumbers = Array.from({
|
|
11810
|
-
length: totalPages
|
|
11811
|
-
}, function (_, i) {
|
|
11812
|
-
return i;
|
|
11813
|
-
});
|
|
11814
|
-
var reducedPageNumbers = reducePages(pageNumbers, currentPage);
|
|
11815
11901
|
var currentRows;
|
|
11816
11902
|
if (pagination) {
|
|
11817
11903
|
if (Array.isArray(children)) {
|
|
@@ -11820,15 +11906,20 @@ var Table = function Table(_ref) {
|
|
|
11820
11906
|
currentRows = [];
|
|
11821
11907
|
}
|
|
11822
11908
|
} else {
|
|
11823
|
-
currentRows = children;
|
|
11909
|
+
currentRows = Array.isArray(children) ? children : [];
|
|
11824
11910
|
}
|
|
11911
|
+
var headingsContent = Array.isArray(headings) ? headings.map(function (h) {
|
|
11912
|
+
return h;
|
|
11913
|
+
}) : [];
|
|
11825
11914
|
var visibleRows;
|
|
11826
11915
|
if (pagination) {
|
|
11827
11916
|
visibleRows = Array.isArray(currentRows) ? currentRows.length + 1 : 0;
|
|
11828
11917
|
} else {
|
|
11829
11918
|
visibleRows = totalRows;
|
|
11830
11919
|
}
|
|
11831
|
-
return /*#__PURE__*/React__default.createElement(Wrapper$8,
|
|
11920
|
+
return /*#__PURE__*/React__default.createElement(Wrapper$8, {
|
|
11921
|
+
className: className
|
|
11922
|
+
}, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
11832
11923
|
onClickPrev: function onClickPrev() {
|
|
11833
11924
|
return scrollTable(tableRef, 'left');
|
|
11834
11925
|
},
|
|
@@ -11843,67 +11934,22 @@ var Table = function Table(_ref) {
|
|
|
11843
11934
|
"aria-colcount": columns
|
|
11844
11935
|
}, /*#__PURE__*/React__default.createElement(AriaDescription$2, {
|
|
11845
11936
|
id: "table-description"
|
|
11846
|
-
}, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement(
|
|
11847
|
-
|
|
11848
|
-
|
|
11849
|
-
|
|
11850
|
-
|
|
11851
|
-
|
|
11852
|
-
scope: "col",
|
|
11853
|
-
columns: columns,
|
|
11854
|
-
lineColor: lineColor
|
|
11855
|
-
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
11856
|
-
content: heading
|
|
11857
|
-
}));
|
|
11858
|
-
}))), /*#__PURE__*/React__default.createElement("tbody", null, ' ', Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
|
|
11859
|
-
return /*#__PURE__*/React__default.createElement(Row, {
|
|
11860
|
-
key: rowIndex,
|
|
11861
|
-
row: row,
|
|
11862
|
-
rowIndex: rowIndex,
|
|
11863
|
-
columns: columns,
|
|
11864
|
-
lineColor: lineColor
|
|
11865
|
-
});
|
|
11937
|
+
}, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement(HeaderCells, {
|
|
11938
|
+
headings: headingsContent,
|
|
11939
|
+
columns: columns
|
|
11940
|
+
}), /*#__PURE__*/React__default.createElement(DataCells, {
|
|
11941
|
+
currentRows: currentRows,
|
|
11942
|
+
columns: columns
|
|
11866
11943
|
}))), pagination && totalPages > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription$2, {
|
|
11867
11944
|
id: "pagination-description"
|
|
11868
|
-
}, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(
|
|
11869
|
-
|
|
11870
|
-
|
|
11871
|
-
|
|
11872
|
-
|
|
11873
|
-
tabIndex: 0,
|
|
11874
|
-
"aria-label": "Previous page"
|
|
11875
|
-
}, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
11876
|
-
iconName: "DropdownArrow",
|
|
11877
|
-
direction: "down"
|
|
11878
|
-
}))))), currentPage > 2 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
|
|
11879
|
-
key: "more-before"
|
|
11880
|
-
}, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), reducedPageNumbers.map(function (number) {
|
|
11881
|
-
return /*#__PURE__*/React__default.createElement("li", {
|
|
11882
|
-
key: number
|
|
11883
|
-
}, /*#__PURE__*/React__default.createElement(PageNumber, {
|
|
11884
|
-
key: number,
|
|
11885
|
-
onClick: function onClick() {
|
|
11886
|
-
return setCurrentPage(number);
|
|
11887
|
-
},
|
|
11888
|
-
tabIndex: 0,
|
|
11889
|
-
active: "" + (number === currentPage)
|
|
11890
|
-
}, number + 1));
|
|
11891
|
-
}), currentPage + 4 < totalPages && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
|
|
11892
|
-
key: "more-after"
|
|
11893
|
-
}, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), currentPage < totalPages - 1 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
|
|
11894
|
-
key: "next-page",
|
|
11895
|
-
onClick: function onClick() {
|
|
11896
|
-
return setCurrentPage(currentPage + 1);
|
|
11897
|
-
},
|
|
11898
|
-
tabIndex: 0,
|
|
11899
|
-
"aria-label": "Next page"
|
|
11900
|
-
}, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
11901
|
-
iconName: "DropdownArrow",
|
|
11902
|
-
direction: "up"
|
|
11903
|
-
}))))))))));
|
|
11945
|
+
}, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(PaginationWrapper, {
|
|
11946
|
+
currentPage: currentPage + 1,
|
|
11947
|
+
pageCount: totalPages,
|
|
11948
|
+
onPageChange: handlePageChange
|
|
11949
|
+
}))));
|
|
11904
11950
|
};
|
|
11905
11951
|
|
|
11906
|
-
var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$
|
|
11952
|
+
var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$I, _templateObject5$B, _templateObject6$u, _templateObject7$m, _templateObject8$g, _templateObject9$9, _templateObject0$9, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
|
|
11907
11953
|
var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11908
11954
|
var theme = _ref.theme;
|
|
11909
11955
|
return "var(--color-" + theme + ")";
|
|
@@ -11913,13 +11959,13 @@ var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_temp
|
|
|
11913
11959
|
});
|
|
11914
11960
|
var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
|
|
11915
11961
|
var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--color-base-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
|
|
11916
|
-
var Error$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11962
|
+
var Error$1 = /*#__PURE__*/styled__default.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
11917
11963
|
var Form = /*#__PURE__*/styled__default.form(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error$1);
|
|
11918
|
-
var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
11919
|
-
var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
11920
|
-
var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$
|
|
11921
|
-
var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$
|
|
11922
|
-
var FieldsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$
|
|
11964
|
+
var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$u || (_templateObject6$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
|
|
11965
|
+
var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
|
|
11966
|
+
var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
|
|
11967
|
+
var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n color: var(--base-color-white);\n text-decoration: none;\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
11968
|
+
var FieldsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 36px;\n\n @media ", " {\n grid-template-columns: 1fr;\n gap: 20px;\n }\n"])), devices.mobile);
|
|
11923
11969
|
var MessageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject1$6 || (_templateObject1$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n div > p {\n margin: 0;\n }\n"])));
|
|
11924
11970
|
var DropdownAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n gap: var(--grid-column-gap);\n cursor: pointer;\n"])));
|
|
11925
11971
|
var DropdownWrapper = /*#__PURE__*/styled__default.div(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: fit-content;\n transform: rotate(", ");\n .dropdown-icon > div {\n border-bottom: none;\n color: var(--color-base-black);\n margin: 0;\n }\n"])), function (_ref3) {
|
|
@@ -12327,10 +12373,10 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
|
|
|
12327
12373
|
}))))));
|
|
12328
12374
|
};
|
|
12329
12375
|
|
|
12330
|
-
var _templateObject$1o, _templateObject3$U, _templateObject4$
|
|
12376
|
+
var _templateObject$1o, _templateObject3$U, _templateObject4$J;
|
|
12331
12377
|
var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, devices.mobile);
|
|
12332
12378
|
var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
|
|
12333
|
-
var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject4$
|
|
12379
|
+
var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
12334
12380
|
|
|
12335
12381
|
var AnchorBar = function AnchorBar(_ref) {
|
|
12336
12382
|
var cta = _ref.cta,
|