@royaloperahouse/harmonic 0.7.1 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/dist/components/Typography/Typography.d.ts +1 -1
  2. package/dist/components/atoms/Icons/SvgIcons/Arrows/ArrowPagination.svg.d.ts +4 -0
  3. package/dist/components/atoms/Icons/SvgIcons/Arrows/LastPageArrow.svg.d.ts +4 -0
  4. package/dist/components/atoms/Icons/SvgIcons/index.d.ts +2 -0
  5. package/dist/components/molecules/ContentSummary/ContentSummary.d.ts +1 -1
  6. package/dist/components/molecules/ContentSummary/ContentSummary.style.d.ts +1 -2
  7. package/dist/components/molecules/Pagination/Pagination.d.ts +2 -1
  8. package/dist/components/molecules/Pagination/Pagination.style.d.ts +6 -5
  9. package/dist/components/molecules/SearchBar/SearchBar.d.ts +1 -1
  10. package/dist/components/organisms/Carousels/HighlightsCarousel/helper.d.ts +1 -1
  11. package/dist/harmonic.cjs.development.js +159 -105
  12. package/dist/harmonic.cjs.development.js.map +1 -1
  13. package/dist/harmonic.cjs.production.min.js +1 -1
  14. package/dist/harmonic.cjs.production.min.js.map +1 -1
  15. package/dist/harmonic.esm.js +159 -105
  16. package/dist/harmonic.esm.js.map +1 -1
  17. package/dist/helpers/accessibility.d.ts +1 -1
  18. package/dist/types/editorial.d.ts +7 -3
  19. package/dist/types/navigation.d.ts +5 -0
  20. package/package.json +1 -1
package/dist/harmonic.cjs.development.js CHANGED
@@ -366,7 +366,7 @@ var createClassNames = function createClassNames(baseClass, options, styles) {
366
366
 
367
367
  var styles = {"display":"typography-module_display__ZHsz9","header":"typography-module_header__FVsLI","subtitle":"typography-module_subtitle__x3sSn","bodycopy":"typography-module_bodycopy__-BY2U","overline":"typography-module_overline__y1yCC","buttontext":"typography-module_buttontext__Gp0W-","captiontext":"typography-module_captiontext__zyA--","navigationtext":"typography-module_navigationtext__Qj6Zw","display--large":"typography-module_display--large__RwPQD","display--small":"typography-module_display--small__XWUSJ","header--large":"typography-module_header--large__2vP3p","header--medium":"typography-module_header--medium__OgzlB","header--small":"typography-module_header--small__zLuFf","subtitle--large":"typography-module_subtitle--large__1Ep9J","subtitle--small":"typography-module_subtitle--small__Vt9bZ","bodycopy--large":"typography-module_bodycopy--large__BNzf2","bodycopy--medium":"typography-module_bodycopy--medium__cwJEu","bodycopy--small":"typography-module_bodycopy--small__fTLSM","overline--large":"typography-module_overline--large__79WUM","overline--small":"typography-module_overline--small__MGEG6","display--primary":"typography-module_display--primary__9sTwU","header--primary":"typography-module_header--primary__KF0PJ","subtitle--primary":"typography-module_subtitle--primary__yL-hS","bodycopy--primary":"typography-module_bodycopy--primary__5Uo2D","overline--primary":"typography-module_overline--primary__a2NSa","buttontext--primary":"typography-module_buttontext--primary__HnmE3","captiontext--primary":"typography-module_captiontext--primary__mmafI","navigationtext--primary":"typography-module_navigationtext--primary__vIsUl","display--black":"typography-module_display--black__8hmsx","header--black":"typography-module_header--black__M3I14","subtitle--black":"typography-module_subtitle--black__IQRSo","bodycopy--black":"typography-module_bodycopy--black__J8BNP","overline--black":"typography-module_overline--black__RUDoj","buttontext--black":"typography-module_buttontext--black__irjmz","captiontext--black":"typography-module_captiontext--black__7axhP","navigationtext--black":"typography-module_navigationtext--black__wDz-G","display--white":"typography-module_display--white__3QA6W","header--white":"typography-module_header--white__mm-ex","subtitle--white":"typography-module_subtitle--white__VzQ3K","bodycopy--white":"typography-module_bodycopy--white__NJ8J8","overline--white":"typography-module_overline--white__cV5QV","buttontext--white":"typography-module_buttontext--white__rrr8U","captiontext--white":"typography-module_captiontext--white__OMFwW","navigationtext--white":"typography-module_navigationtext--white__5YDdY","display--red":"typography-module_display--red__khdLJ","header--red":"typography-module_header--red__hxuj9","subtitle--red":"typography-module_subtitle--red__gSK7d","bodycopy--red":"typography-module_bodycopy--red__P5Mau","overline--red":"typography-module_overline--red__OW5dE","buttontext--red":"typography-module_buttontext--red__mlRi2","captiontext--red":"typography-module_captiontext--red__jMQIK","navigationtext--red":"typography-module_navigationtext--red__-QADV","display--grey":"typography-module_display--grey__RsgTf","header--grey":"typography-module_header--grey__rC0vN","subtitle--grey":"typography-module_subtitle--grey__1nkEx","bodycopy--grey":"typography-module_bodycopy--grey__SNnaU","overline--grey":"typography-module_overline--grey__lGOsK","buttontext--grey":"typography-module_buttontext--grey__1Y4oX","captiontext--grey":"typography-module_captiontext--grey__V0MLc","navigationtext--grey":"typography-module_navigationtext--grey__xi3sz","display--inherit":"typography-module_display--inherit__ZNOHM","header--inherit":"typography-module_header--inherit__qmHQE","subtitle--inherit":"typography-module_subtitle--inherit__mly-X","bodycopy--inherit":"typography-module_bodycopy--inherit__CoC-f","overline--inherit":"typography-module_overline--inherit__Cq4ni","buttontext--inherit":"typography-module_buttontext--inherit__vguWx","captiontext--inherit":"typography-module_captiontext--inherit__ya6gm","navigationtext--inherit":"typography-module_navigationtext--inherit__cJLWf","display--serif":"typography-module_display--serif__C0-Ve","header--serif":"typography-module_header--serif__uTGCc","display--em":"typography-module_display--em__h2bPV","header--em":"typography-module_header--em__UFQIA","display--bold":"typography-module_display--bold__PG-8g","header--bold":"typography-module_header--bold__InvJk","subtitle--bold":"typography-module_subtitle--bold__Subov","bodycopy--bold":"typography-module_bodycopy--bold__nZX3C","overline--bold":"typography-module_overline--bold__3mUXy","buttontext--bold":"typography-module_buttontext--bold__rBKIJ","captiontext--bold":"typography-module_captiontext--bold__ebTyV","navigationtext--bold":"typography-module_navigationtext--bold__SRlV2"};
368
368
 
369
- var _excluded = ["children", "size", "color", "className"],
369
+ var _excluded = ["children", "size", "color", "className", "bold"],
370
370
  _excluded2 = ["children", "size", "color", "className"];
371
371
  /* ~~~ Headers - size and hierarchy set separately ~~~ */
372
372
  var HarmonicHeader = function HarmonicHeader(_ref2) {
@@ -413,10 +413,12 @@ var BodyCopyHarmonic = function BodyCopyHarmonic(_ref4) {
413
413
  _ref4$color = _ref4.color,
414
414
  color = _ref4$color === void 0 ? 'inherit' : _ref4$color,
415
415
  className = _ref4.className,
416
+ bold = _ref4.bold,
416
417
  props = _objectWithoutPropertiesLoose(_ref4, _excluded);
417
418
  var classNames = createClassNames('bodycopy', {
418
419
  size: size,
419
420
  color: color,
421
+ bold: bold,
420
422
  className: className
421
423
  }, styles);
422
424
  return /*#__PURE__*/React__default.createElement("p", Object.assign({
@@ -2545,10 +2547,45 @@ var Volume = (function (_ref) {
2545
2547
  }));
2546
2548
  });
2547
2549
 
2550
+ var LastPageArrow = (function (_ref) {
2551
+ var _ref$color = _ref.color,
2552
+ color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
2553
+ ariaLabel = _ref.ariaLabel;
2554
+ return /*#__PURE__*/React.createElement("svg", {
2555
+ width: "100%",
2556
+ height: "100%",
2557
+ viewBox: "0 0 24 24",
2558
+ fill: "none",
2559
+ xmlns: "http://www.w3.org/2000/svg",
2560
+ "aria-label": ariaLabel
2561
+ }, /*#__PURE__*/React.createElement("path", {
2562
+ d: "M9.14746 11.9961L9.1377 12.0039L17.165 20.8428L18.4121 19.71L11.415 12.0059L18.4219 4.29004L17.1748 3.15723L9.14746 11.9961ZM5.57031 20.8428H7.14062V3.15723H5.57031V20.8428Z",
2563
+ fill: color
2564
+ }));
2565
+ });
2566
+
2567
+ var ArrowPagination = (function (_ref) {
2568
+ var _ref$color = _ref.color,
2569
+ color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
2570
+ ariaLabel = _ref.ariaLabel;
2571
+ return /*#__PURE__*/React.createElement("svg", {
2572
+ width: "100%",
2573
+ height: "100%",
2574
+ viewBox: "0 0 24 24",
2575
+ fill: "none",
2576
+ xmlns: "http://www.w3.org/2000/svg",
2577
+ "aria-label": ariaLabel
2578
+ }, /*#__PURE__*/React.createElement("path", {
2579
+ d: "M15.3955 3.1582L7.36816 11.9971L7.3584 12.0049L15.3857 20.8438L16.6328 19.7109L9.63574 12.0068L16.6426 4.29102L15.3955 3.1582Z",
2580
+ fill: color
2581
+ }));
2582
+ });
2583
+
2548
2584
  /* 12px */
2549
2585
  var IconLibrary = {
2550
2586
  AddToMyList: AddToMyList,
2551
2587
  Arrow: Arrow,
2588
+ ArrowPagination: ArrowPagination,
2552
2589
  AudioDescription: AudioDescription,
2553
2590
  Back10: Back10,
2554
2591
  BalletAndDance: BalletAndDance,
@@ -2584,6 +2621,7 @@ var IconLibrary = {
2584
2621
  Home: Home,
2585
2622
  Info: Info,
2586
2623
  Instagram: Instagram,
2624
+ LastPageArrow: LastPageArrow,
2587
2625
  List: List,
2588
2626
  ListView: ListView,
2589
2627
  LiveStream: LiveStream,
@@ -5722,8 +5760,12 @@ var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$a || (_te
5722
5760
  var TextLinkWrapper$1 = /*#__PURE__*/styled__default(TextLink)(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-primary-red);\n"])));
5723
5761
  var SearchArrowContainer = /*#__PURE__*/styled__default.a(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-right: 8px;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
5724
5762
 
5725
- function useFocusTrap(containerRef, onEscape) {
5763
+ function useFocusTrap(containerRef, onEscape, enabled) {
5764
+ if (enabled === void 0) {
5765
+ enabled = true;
5766
+ }
5726
5767
  React.useEffect(function () {
5768
+ if (!enabled) return undefined;
5727
5769
  var container = containerRef.current;
5728
5770
  if (!container) return undefined;
5729
5771
  var focusableSelectors = 'input, button, select, textarea, a[href], [tabindex]:not([tabindex="-1"])';
@@ -5756,7 +5798,9 @@ var SearchBar = function SearchBar(_ref) {
5756
5798
  var onClick = _ref.onClick,
5757
5799
  onClose = _ref.onClose,
5758
5800
  className = _ref.className,
5759
- inputRef = _ref.inputRef;
5801
+ inputRef = _ref.inputRef,
5802
+ _ref$trapFocus = _ref.trapFocus,
5803
+ trapFocus = _ref$trapFocus === void 0 ? true : _ref$trapFocus;
5760
5804
  var _useState = React.useState(false),
5761
5805
  showSearchLink = _useState[0],
5762
5806
  setShowSearchLink = _useState[1];
@@ -5766,7 +5810,7 @@ var SearchBar = function SearchBar(_ref) {
5766
5810
  var internalRef = React.useRef(null);
5767
5811
  var finalInputRef = inputRef != null ? inputRef : internalRef;
5768
5812
  var containerRef = React.useRef(null);
5769
- useFocusTrap(containerRef, onClose);
5813
+ useFocusTrap(containerRef, onClose, trapFocus);
5770
5814
  var onSearchHandler = function onSearchHandler(value) {
5771
5815
  onClick(value);
5772
5816
  setSearchValue('');
@@ -5846,7 +5890,7 @@ var SearchBar = function SearchBar(_ref) {
5846
5890
  onClick: onCloseHandler,
5847
5891
  onKeyDown: onKeyboardCloseHandler,
5848
5892
  "data-testid": "close-icon",
5849
- "aria-label": "Close search bar"
5893
+ "aria-label": "Clear the search bar"
5850
5894
  }, /*#__PURE__*/React__default.createElement(Icon, {
5851
5895
  iconName: "Close"
5852
5896
  })));
@@ -8592,22 +8636,20 @@ var ContactCard = function ContactCard(_ref) {
8592
8636
  }, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString))))))));
8593
8637
  };
8594
8638
 
8595
- var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$g, _templateObject7$b;
8596
- var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
8597
- 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: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
8639
+ var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$g;
8640
+ var BodyTextRelative = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
8641
+ 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) {
8598
8642
  return props.clickable ? 'pointer' : 'default';
8599
8643
  }, devices.mobile);
8600
8644
  var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 0 0 33.3%;\n"])));
8601
- var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 22px;\n\n & > * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n gap: 12px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
8645
+ var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 20px;\n\n & * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
8602
8646
  return props.showImage ? 2 : '1 / span 4';
8603
8647
  }, devices.mobile);
8604
- var ContentSummaryTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
8605
- var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
8606
- var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__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) {
8648
+ var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
8649
+ var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__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) {
8607
8650
  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 ";
8608
8651
  });
8609
8652
 
8610
- var MAX_HEADER_LEVEL = 6;
8611
8653
  var clickHandler = function clickHandler(link) {
8612
8654
  if (link != null && link.href && document) {
8613
8655
  document.location.href = link.href;
@@ -8627,9 +8669,11 @@ var ContentSummary = function ContentSummary(_ref) {
8627
8669
  truncate = _ref$truncate === void 0 ? 0 : _ref$truncate,
8628
8670
  _ref$fullyClickable = _ref.fullyClickable,
8629
8671
  fullyClickable = _ref$fullyClickable === void 0 ? true : _ref$fullyClickable,
8630
- _ref$baseSemanticLeve = _ref.baseSemanticLevel,
8631
- baseSemanticLevel = _ref$baseSemanticLeve === void 0 ? 3 : _ref$baseSemanticLeve;
8672
+ _ref$headerSemanticLe = _ref.headerSemanticLevel,
8673
+ headerSemanticLevel = _ref$headerSemanticLe === void 0 ? 'h3' : _ref$headerSemanticLe,
8674
+ className = _ref.className;
8632
8675
  return /*#__PURE__*/React__default.createElement(ContentSummaryWrapper, {
8676
+ className: className,
8633
8677
  onClick: function onClick() {
8634
8678
  if (fullyClickable) {
8635
8679
  clickHandler(link);
@@ -8639,31 +8683,32 @@ var ContentSummary = function ContentSummary(_ref) {
8639
8683
  "data-roh": "content-summary-item"
8640
8684
  }, showImage && image && (/*#__PURE__*/React__default.createElement(ContentSummaryImageWrapper, {
8641
8685
  "data-testid": "image-wrapper"
8642
- }, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
8643
- aspectRatio: exports.AspectRatio['4:3']
8644
8686
  }, link != null && link.href ? (/*#__PURE__*/React__default.createElement("a", {
8645
8687
  href: link.href
8688
+ }, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
8689
+ aspectRatio: exports.AspectRatio['4:3']
8646
8690
  }, /*#__PURE__*/React__default.createElement("img", {
8647
8691
  src: image.src,
8648
8692
  alt: image.alt
8649
- }))) : (/*#__PURE__*/React__default.createElement("img", {
8693
+ })))) : (/*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
8694
+ aspectRatio: exports.AspectRatio['4:3']
8695
+ }, /*#__PURE__*/React__default.createElement("img", {
8650
8696
  src: image.src,
8651
8697
  alt: image.alt
8652
8698
  }))))), /*#__PURE__*/React__default.createElement(ContentSummaryTextWrapper, {
8653
8699
  showImage: showImage
8654
- }, title && (/*#__PURE__*/React__default.createElement(ContentSummaryTitleWrapper, {
8700
+ }, title && (/*#__PURE__*/React__default.createElement("div", {
8655
8701
  "data-testid": largeTitle ? 'large-title' : 'default-title'
8656
- }, largeTitle ? (/*#__PURE__*/React__default.createElement(Header, {
8657
- level: 5,
8658
- semanticLevel: baseSemanticLevel
8659
- }, title)) : (/*#__PURE__*/React__default.createElement(Subtitle, {
8660
- level: 1,
8661
- semanticLevel: baseSemanticLevel
8662
- }, title)))), subtitle && (/*#__PURE__*/React__default.createElement(Subtitle, {
8663
- level: 2,
8664
- semanticLevel: title ? Math.min(MAX_HEADER_LEVEL, baseSemanticLevel + 1) : baseSemanticLevel
8665
- }, subtitle)), bodyText && (/*#__PURE__*/React__default.createElement(BodyTextRelative, {
8666
- level: 1
8702
+ }, largeTitle ? (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
8703
+ size: "large",
8704
+ hierarchy: headerSemanticLevel
8705
+ }, title)) : (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
8706
+ size: "medium",
8707
+ hierarchy: headerSemanticLevel
8708
+ }, title)))), subtitle && /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
8709
+ size: "large"
8710
+ }, subtitle), bodyText && (/*#__PURE__*/React__default.createElement(BodyTextRelative, {
8711
+ size: "large"
8667
8712
  }, /*#__PURE__*/React__default.createElement(BodyTextLimit, null, /*#__PURE__*/React__default.createElement(ContentSummaryBodyTextWrapper, {
8668
8713
  truncate: truncate,
8669
8714
  dangerouslySetInnerHTML: {
@@ -8960,7 +9005,7 @@ var Information = function Information(_ref) {
8960
9005
  })))));
8961
9006
  };
8962
9007
 
8963
- var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$c, _templateObject8$8;
9008
+ var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$8;
8964
9009
  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) {
8965
9010
  var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
8966
9011
  return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
@@ -8979,7 +9024,7 @@ var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_t
8979
9024
  return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
8980
9025
  }, devices.mobile);
8981
9026
  var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$h || (_templateObject6$h = /*#__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"])));
8982
- 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) {
9027
+ var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__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) {
8983
9028
  var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
8984
9029
  return isPageHeadingWithoutTitle && "\n margin-top: 40px;\n ";
8985
9030
  }, devices.mobile, function (_ref6) {
@@ -9061,14 +9106,14 @@ var PageHeading = function PageHeading(_ref) {
9061
9106
  }, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
9062
9107
  };
9063
9108
 
9064
- var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$d, _templateObject8$9;
9109
+ var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9;
9065
9110
  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);
9066
9111
  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);
9067
9112
  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);
9068
9113
  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);
9069
9114
  var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
9070
9115
  var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$i || (_templateObject6$i = /*#__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);
9071
- 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);
9116
+ var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__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);
9072
9117
  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);
9073
9118
 
9074
9119
  var _excluded$l = ["text"];
@@ -9176,7 +9221,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
9176
9221
  })))));
9177
9222
  };
9178
9223
 
9179
- var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$e, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
9224
+ var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
9180
9225
  var Wrapper$5 = /*#__PURE__*/styled__default.section(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
9181
9226
  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"])));
9182
9227
  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);
@@ -9189,7 +9234,7 @@ var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$p || (_te
9189
9234
  return showBlock ? 'block' : 'none';
9190
9235
  }, devices.mobile);
9191
9236
  var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n height: 32px;\n }\n\n @media ", " {\n margin-bottom: 12px;\n }\n"])), devices.mobile);
9192
- 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) {
9237
+ var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__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) {
9193
9238
  var isBadgePresent = _ref3.isBadgePresent;
9194
9239
  return isBadgePresent ? '1' : '4';
9195
9240
  });
@@ -9390,7 +9435,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
9390
9435
  })))))))))));
9391
9436
  };
9392
9437
 
9393
- var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject0$6;
9438
+ var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject0$6;
9394
9439
  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);
9395
9440
  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"])));
9396
9441
  var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
@@ -9411,7 +9456,7 @@ var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObjec
9411
9456
  var theme = _ref4.theme;
9412
9457
  return theme.colors.primary === theme.colors.stream && "\n color: " + theme.colors.stream + ";\n background-color: " + theme.colors.white + ";\n ";
9413
9458
  }, devices.tablet, devices.mobile);
9414
- 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);
9459
+ var CompactHeaderLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__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);
9415
9460
  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);
9416
9461
  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);
9417
9462
  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) {
@@ -9644,15 +9689,21 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
9644
9689
  }), linkText))))));
9645
9690
  };
9646
9691
 
9647
- var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject4$x;
9692
+ var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject4$x, _templateObject5$r, _templateObject6$l, _templateObject7$f;
9693
+ // Keep MorePages for Table component until restyle
9648
9694
  var MorePages = /*#__PURE__*/styled__default.span(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
9649
- var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\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 font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(0, 0, 0, 0);\n }\n"])));
9650
- // PageNumber extends bodyText but uses subtitle-1 font size
9651
- var PageNumber = /*#__PURE__*/styled__default.a(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: inherit;\n margin: 0;\n border-bottom: 1px solid transparent;\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n :hover {\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n /* active state - string used because react returns error for bool */\n ", "\n"])), function (_ref) {
9695
+ var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n color: inherit;\n"])));
9696
+ var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject3$E || (_templateObject3$E = /*#__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"])));
9697
+ var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
9698
+ var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
9699
+ var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$l || (_templateObject6$l = /*#__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) {
9652
9700
  var active = _ref.active;
9653
- return active === 'true' && " \n color: var(--base-color-core);\n ";
9701
+ return active ? "var(--color-primary-red)" : 'inherit';
9702
+ }, function (_ref2) {
9703
+ var active = _ref2.active;
9704
+ return "1px solid " + (active ? 'var(--color-primary-red)' : 'transparent');
9654
9705
  });
9655
- var NextPage = /*#__PURE__*/styled__default(PageNumber)(_templateObject4$x || (_templateObject4$x = /*#__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"])));
9706
+ var PageNav = /*#__PURE__*/styled__default.a(_templateObject7$f || (_templateObject7$f = /*#__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(--color-base-black);\n }\n }\n"])));
9656
9707
 
9657
9708
  var reducePages = function reducePages(pages, currentPage) {
9658
9709
  // If there are less than 6 pages, return all pages
@@ -9673,58 +9724,61 @@ var reducePages = function reducePages(pages, currentPage) {
9673
9724
  var Pagination = function Pagination(_ref) {
9674
9725
  var pageCount = _ref.pageCount,
9675
9726
  currentPage = _ref.currentPage,
9676
- baseUrl = _ref.baseUrl;
9727
+ baseUrl = _ref.baseUrl,
9728
+ className = _ref.className;
9677
9729
  // Array of page numbers starting at 1
9678
9730
  var pageNumbers = Array.from(Array(pageCount + 1).keys()).slice(1);
9679
9731
  var reducedPageNumbers = reducePages(pageNumbers, currentPage);
9680
- return /*#__PURE__*/React__default.createElement(PageNumberWrapper, null,
9732
+ return /*#__PURE__*/React__default.createElement(PageNumberWrapper, {
9733
+ className: className
9734
+ },
9681
9735
  // {/* Left arrow only appears after page 1 */
9682
- currentPage > 1 && (/*#__PURE__*/React__default.createElement("li", {
9736
+ currentPage > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNav, {
9737
+ href: baseUrl + "1"
9738
+ }, /*#__PURE__*/React__default.createElement(Icon, {
9739
+ iconName: "LastPageArrow",
9740
+ direction: "right"
9741
+ }))), /*#__PURE__*/React__default.createElement(PreviousPageItem, {
9683
9742
  key: "previous-page",
9684
9743
  "data-testid": "left-arrow"
9685
- }, /*#__PURE__*/React__default.createElement(NextPage, {
9744
+ }, /*#__PURE__*/React__default.createElement(PageNav, {
9686
9745
  href: "" + baseUrl + (currentPage - 1)
9687
9746
  }, /*#__PURE__*/React__default.createElement(Icon, {
9688
- iconName: "DropdownArrow",
9689
- direction: "down"
9690
- })))), currentPage > 3 && (/*#__PURE__*/React__default.createElement("li", {
9691
- key: "more-before",
9692
- "data-testid": "elipsis"
9693
- }, /*#__PURE__*/React__default.createElement(MorePages, {
9694
- theme: "core"
9695
- }, "..."))), reducedPageNumbers.map(function (page) {
9747
+ iconName: "ArrowPagination",
9748
+ direction: "right"
9749
+ }))))), reducedPageNumbers.map(function (page) {
9696
9750
  return /*#__PURE__*/React__default.createElement("li", {
9697
9751
  key: page
9698
- }, /*#__PURE__*/React__default.createElement(PageNumber, {
9699
- theme: "core",
9700
- key: page,
9701
- active: "" + (page === currentPage),
9752
+ }, /*#__PURE__*/React__default.createElement(PaginationLink, {
9702
9753
  href: "" + baseUrl + page,
9703
9754
  "data-testid": "page-number"
9704
- }, page));
9705
- }), currentPage + 4 < pageCount && (/*#__PURE__*/React__default.createElement("li", {
9706
- key: "more-after",
9707
- "data-testid": "elipsis"
9708
- }, /*#__PURE__*/React__default.createElement(MorePages, {
9709
- theme: "core"
9710
- }, "..."))), currentPage < pageCount && (/*#__PURE__*/React__default.createElement("li", {
9755
+ }, /*#__PURE__*/React__default.createElement(TextLinkPagination, {
9756
+ size: "large",
9757
+ active: page === currentPage
9758
+ }, page.toString())));
9759
+ }), currentPage < pageCount && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", {
9711
9760
  key: "next-page",
9712
9761
  "data-testid": "right-arrow"
9713
- }, /*#__PURE__*/React__default.createElement(NextPage, {
9762
+ }, /*#__PURE__*/React__default.createElement(PageNav, {
9714
9763
  href: "" + baseUrl + (currentPage + 1)
9715
9764
  }, /*#__PURE__*/React__default.createElement(Icon, {
9716
- iconName: "DropdownArrow",
9717
- direction: "up"
9718
- })))));
9765
+ iconName: "ArrowPagination",
9766
+ direction: "left"
9767
+ }))), /*#__PURE__*/React__default.createElement(LastPageItem, null, /*#__PURE__*/React__default.createElement(PageNav, {
9768
+ href: "" + baseUrl + pageCount
9769
+ }, /*#__PURE__*/React__default.createElement(Icon, {
9770
+ iconName: "LastPageArrow",
9771
+ direction: "left"
9772
+ }))))));
9719
9773
  };
9720
9774
 
9721
- var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$y, _templateObject5$r, _templateObject6$l, _templateObject7$g;
9775
+ var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$y, _templateObject5$s, _templateObject6$m, _templateObject7$g;
9722
9776
  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);
9723
9777
  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"])));
9724
9778
  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"])));
9725
9779
  var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
9726
- var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
9727
- var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$l || (_templateObject6$l = /*#__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"])));
9780
+ var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
9781
+ var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$m || (_templateObject6$m = /*#__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"])));
9728
9782
  var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
9729
9783
 
9730
9784
  var Person = function Person(_ref) {
@@ -9907,7 +9961,7 @@ var CreditListing = function CreditListing(_ref) {
9907
9961
  }, creditEntries);
9908
9962
  };
9909
9963
 
9910
- var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$A, _templateObject5$s, _templateObject6$m, _templateObject7$h, _templateObject8$c, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
9964
+ var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$A, _templateObject5$t, _templateObject6$n, _templateObject7$h, _templateObject8$c, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
9911
9965
  var LENGTH_TEXT = 28;
9912
9966
  var LENGTH_TEXT_TABLET$1 = 12;
9913
9967
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
@@ -9950,11 +10004,11 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$A ||
9950
10004
  }
9951
10005
  return '';
9952
10006
  });
9953
- var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref7) {
10007
+ var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref7) {
9954
10008
  var marginBottom = _ref7.marginBottom;
9955
10009
  return marginBottom + "px";
9956
10010
  });
9957
- var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
10011
+ var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
9958
10012
  var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
9959
10013
  var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
9960
10014
  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);
@@ -10159,7 +10213,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
10159
10213
  }))));
10160
10214
  };
10161
10215
 
10162
- var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$B, _templateObject5$t, _templateObject6$n, _templateObject7$i;
10216
+ var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$B, _templateObject5$u, _templateObject6$o, _templateObject7$i;
10163
10217
  var LENGTH_TEXT$2 = 28;
10164
10218
  var LENGTH_TEXT_TABLET$2 = 10;
10165
10219
  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) {
@@ -10178,8 +10232,8 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObj
10178
10232
  return imageToLeft ? 'right' : 'left';
10179
10233
  }, devices.mobile);
10180
10234
  var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
10181
- var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10182
- var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$n || (_templateObject6$n = /*#__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);
10235
+ var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10236
+ var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__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);
10183
10237
  var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$i || (_templateObject7$i = /*#__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) {
10184
10238
  var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
10185
10239
  primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
@@ -10613,7 +10667,7 @@ var SectionTitle = function SectionTitle(_ref) {
10613
10667
  }, description)))));
10614
10668
  };
10615
10669
 
10616
- var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$C, _templateObject5$u, _templateObject6$o, _templateObject7$j, _templateObject8$d, _templateObject9$8, _templateObject0$8, _templateObject1$5;
10670
+ var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$C, _templateObject5$v, _templateObject6$p, _templateObject7$j, _templateObject8$d, _templateObject9$8, _templateObject0$8, _templateObject1$5;
10617
10671
  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) {
10618
10672
  var theme = _ref.theme;
10619
10673
  return "3px solid " + theme.colors.lapisLazuli;
@@ -10637,8 +10691,8 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
10637
10691
  color: theme.colors.black,
10638
10692
  title: 'Select Arrow'
10639
10693
  };
10640
- })(_templateObject5$u || (_templateObject5$u = /*#__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"])));
10641
- var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
10694
+ })(_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"])));
10695
+ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
10642
10696
  var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
10643
10697
  var Options = /*#__PURE__*/styled__default.div(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
10644
10698
  var Option = /*#__PURE__*/styled__default.li(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
@@ -11208,13 +11262,13 @@ var Quote = function Quote(_ref) {
11208
11262
  }, attribution))));
11209
11263
  };
11210
11264
 
11211
- var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$E, _templateObject5$v, _templateObject6$p;
11265
+ var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$E, _templateObject5$w, _templateObject6$q;
11212
11266
  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"])));
11213
11267
  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"])));
11214
11268
  var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
11215
11269
  var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
11216
- var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$v || (_templateObject5$v = /*#__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);
11217
- var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__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);
11270
+ 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);
11271
+ var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__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);
11218
11272
 
11219
11273
  var MiniCard = function MiniCard(_ref) {
11220
11274
  var _ref$title = _ref.title,
@@ -11252,7 +11306,7 @@ var MiniCard = function MiniCard(_ref) {
11252
11306
  }, title)))));
11253
11307
  };
11254
11308
 
11255
- var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$F, _templateObject5$w;
11309
+ var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$F, _templateObject5$x;
11256
11310
  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"])));
11257
11311
  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"])));
11258
11312
  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) {
@@ -11263,7 +11317,7 @@ var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$F ||
11263
11317
  var isVisible = _ref2.isVisible;
11264
11318
  return isVisible ? 'visible' : 'hidden';
11265
11319
  });
11266
- var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11320
+ var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11267
11321
 
11268
11322
  var keyDown = function keyDown(e, toggleFunction) {
11269
11323
  if (e.key === 'Enter' || e.key === 'Space') {
@@ -11344,7 +11398,7 @@ var ReadMore = function ReadMore(_ref) {
11344
11398
  }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
11345
11399
  };
11346
11400
 
11347
- var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$G, _templateObject5$x;
11401
+ var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$G, _templateObject5$y;
11348
11402
  var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
11349
11403
  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);
11350
11404
  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);
@@ -11352,7 +11406,7 @@ var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$G || (_template
11352
11406
  var isActive = _ref.isActive;
11353
11407
  return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
11354
11408
  }, exports.Colors.MidGrey);
11355
- var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11409
+ var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11356
11410
  var isOpen = _ref2.isOpen;
11357
11411
  return isOpen ? 'block' : 'none';
11358
11412
  }, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
@@ -11508,7 +11562,7 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
11508
11562
  });
11509
11563
  };
11510
11564
 
11511
- var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$H, _templateObject5$y, _templateObject6$q;
11565
+ var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$H, _templateObject5$z, _templateObject6$r;
11512
11566
  var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
11513
11567
  var Sections = /*#__PURE__*/styled__default.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
11514
11568
  var Section = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
@@ -11516,11 +11570,11 @@ var Section = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateO
11516
11570
  return "var(--base-color-" + color + ")";
11517
11571
  });
11518
11572
  var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
11519
- var Text = /*#__PURE__*/styled__default.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
11573
+ var Text = /*#__PURE__*/styled__default.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
11520
11574
  var color = _ref2.color;
11521
11575
  return "var(--base-color-" + color + ")";
11522
11576
  });
11523
- var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
11577
+ var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
11524
11578
  var color = _ref3.color;
11525
11579
  return "var(--base-color-" + color + ")";
11526
11580
  });
@@ -11602,7 +11656,7 @@ var PasswordStrength = function PasswordStrength(_ref) {
11602
11656
  }, strengthLabel))));
11603
11657
  };
11604
11658
 
11605
- var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$I, _templateObject5$z, _templateObject6$r, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$9;
11659
+ var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$I, _templateObject5$A, _templateObject6$s, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$9;
11606
11660
  var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
11607
11661
  var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
11608
11662
  var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
@@ -11611,13 +11665,13 @@ var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$I || (_templa
11611
11665
  }, function (props) {
11612
11666
  return "calc(100% / " + (props.columns - 1) + ")";
11613
11667
  }, devices.tablet, devices.mobile);
11614
- var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
11668
+ var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
11615
11669
  return "var(--base-color-" + props.lineColor + ")";
11616
11670
  }, function (props) {
11617
11671
  return "calc(100% / " + (props.columns - 1) + ")";
11618
11672
  }, devices.mobile);
11619
- var Pagination$1 = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
11620
- var PageNumber$1 = /*#__PURE__*/styled__default.button(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
11673
+ var Pagination$1 = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
11674
+ var PageNumber = /*#__PURE__*/styled__default.button(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
11621
11675
  var active = _ref.active;
11622
11676
  return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";
11623
11677
  });
@@ -11768,7 +11822,7 @@ var Table = function Table(_ref) {
11768
11822
  });
11769
11823
  }))), pagination && totalPages > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription$2, {
11770
11824
  id: "pagination-description"
11771
- }, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(Pagination$1, null, currentPage > 0 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
11825
+ }, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(Pagination$1, null, currentPage > 0 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
11772
11826
  key: "previous-page",
11773
11827
  onClick: function onClick() {
11774
11828
  return setCurrentPage(currentPage - 1);
@@ -11778,12 +11832,12 @@ var Table = function Table(_ref) {
11778
11832
  }, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
11779
11833
  iconName: "DropdownArrow",
11780
11834
  direction: "down"
11781
- }))))), currentPage > 2 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
11835
+ }))))), currentPage > 2 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
11782
11836
  key: "more-before"
11783
11837
  }, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), reducedPageNumbers.map(function (number) {
11784
11838
  return /*#__PURE__*/React__default.createElement("li", {
11785
11839
  key: number
11786
- }, /*#__PURE__*/React__default.createElement(PageNumber$1, {
11840
+ }, /*#__PURE__*/React__default.createElement(PageNumber, {
11787
11841
  key: number,
11788
11842
  onClick: function onClick() {
11789
11843
  return setCurrentPage(number);
@@ -11791,9 +11845,9 @@ var Table = function Table(_ref) {
11791
11845
  tabIndex: 0,
11792
11846
  active: "" + (number === currentPage)
11793
11847
  }, number + 1));
11794
- }), currentPage + 4 < totalPages && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
11848
+ }), currentPage + 4 < totalPages && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
11795
11849
  key: "more-after"
11796
- }, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), currentPage < totalPages - 1 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
11850
+ }, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), currentPage < totalPages - 1 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
11797
11851
  key: "next-page",
11798
11852
  onClick: function onClick() {
11799
11853
  return setCurrentPage(currentPage + 1);
@@ -11806,7 +11860,7 @@ var Table = function Table(_ref) {
11806
11860
  }))))))))));
11807
11861
  };
11808
11862
 
11809
- var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$J, _templateObject5$A, _templateObject6$s, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
11863
+ var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$J, _templateObject5$B, _templateObject6$t, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
11810
11864
  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) {
11811
11865
  var theme = _ref.theme;
11812
11866
  return "var(--color-" + theme + ")";
@@ -11817,8 +11871,8 @@ var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_temp
11817
11871
  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);
11818
11872
  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);
11819
11873
  var Error$1 = /*#__PURE__*/styled__default.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
11820
- var Form = /*#__PURE__*/styled__default.form(_templateObject5$A || (_templateObject5$A = /*#__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);
11821
- var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__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);
11874
+ 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);
11875
+ var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$t || (_templateObject6$t = /*#__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);
11822
11876
  var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
11823
11877
  var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
11824
11878
  var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$a || (_templateObject9$a = /*#__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);