@royaloperahouse/harmonic 0.15.0-c → 0.15.0-e

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.
@@ -3069,13 +3069,16 @@ var StyledImageAspectRatioWrapper = /*#__PURE__*/styled__default.div(_templateOb
3069
3069
  return aspectRatio;
3070
3070
  });
3071
3071
 
3072
- var ImageAspectRatioWrapper = function ImageAspectRatioWrapper(_ref) {
3072
+ var _excluded$6 = ["aspectRatio", "children", "alt"];
3073
+ var ImageAspectRatioWrapper = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
3073
3074
  var aspectRatio = _ref.aspectRatio,
3074
3075
  children = _ref.children,
3075
- alt = _ref.alt;
3076
- return /*#__PURE__*/React__default.createElement(StyledImageAspectRatioWrapper, {
3076
+ alt = _ref.alt,
3077
+ restProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
3078
+ return /*#__PURE__*/React__default.createElement(StyledImageAspectRatioWrapper, Object.assign({
3079
+ ref: ref,
3077
3080
  aspectRatio: aspectRatio
3078
- }, React__default.Children.map(children, function (child) {
3081
+ }, restProps), React__default.Children.map(children, function (child) {
3079
3082
  if (/*#__PURE__*/React__default.isValidElement(child)) {
3080
3083
  return /*#__PURE__*/React__default.cloneElement(child, {
3081
3084
  alt: alt || child.props.alt || '',
@@ -3085,7 +3088,8 @@ var ImageAspectRatioWrapper = function ImageAspectRatioWrapper(_ref) {
3085
3088
  }
3086
3089
  return child;
3087
3090
  }));
3088
- };
3091
+ });
3092
+ ImageAspectRatioWrapper.displayName = 'ImageAspectRatioWrapper';
3089
3093
 
3090
3094
  var _templateObject$b, _templateObject2$6, _templateObject3$2, _templateObject4$1, _templateObject5;
3091
3095
  var ProgressView = /*#__PURE__*/styled__default.div(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: ", ";\n box-shadow: ", ";\n width: 100%;\n display: flex;\n flex-direction: row;\n"])), function (_ref) {
@@ -3383,7 +3387,7 @@ var ErrorLabel = /*#__PURE__*/styled__default.div(_templateObject6 || (_template
3383
3387
  return 'var(--base-color-errorstate)';
3384
3388
  });
3385
3389
 
3386
- var _excluded$6 = ["children", "disabled", "error", "darkMode", "blackBox"];
3390
+ var _excluded$7 = ["children", "disabled", "error", "darkMode", "blackBox"];
3387
3391
  /**
3388
3392
  * A Radio component, that wraps around the native `<input type="radio"/>` element
3389
3393
  * and adds some extra styling, states and information around it (i.e. an error label,
@@ -3412,7 +3416,7 @@ var Radio2Component = function Radio2Component(_ref, ref) {
3412
3416
  darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
3413
3417
  _ref$blackBox = _ref.blackBox,
3414
3418
  blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
3415
- inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
3419
+ inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$7);
3416
3420
  return /*#__PURE__*/React__default.createElement(Container, null, /*#__PURE__*/React__default.createElement(TickboxLabel, {
3417
3421
  darkMode: darkMode,
3418
3422
  blackBox: blackBox
@@ -3446,7 +3450,87 @@ var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$f || (_t
3446
3450
  var BaseIconWrapper = /*#__PURE__*/styled__default.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n display: flex;\n align-items: center;\n width: var(--rotator-button-width);\n height: var(--rotator-button-width);\n\n svg {\n width: var(--rotator-button-icon-width);\n height: var(--rotator-button-icon-width);\n }\n"])));
3447
3451
  var IconWrapper$1 = /*#__PURE__*/styled__default(BaseIconWrapper)(_templateObject3$5 || (_templateObject3$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--rotator-button-bg-color);\n color: var(--rotator-button-color);\n\n svg path {\n fill: var(--rotator-button-color);\n }\n\n :hover {\n cursor: pointer;\n background-color: var(--rotator-button-hover-bg-color);\n\n && svg path {\n fill: var(--rotator-button-hover-color);\n }\n }\n"])));
3448
3452
  var IconUnavailableWrapper = /*#__PURE__*/styled__default(BaseIconWrapper)(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-state-disabled);\n color: var(--color-primary-black);\n opacity: 0.2;\n\n svg path {\n fill: var(--color-primary-black);\n }\n\n @media ", " {\n pointer-events: none;\n }\n"])), devices.mobile);
3449
- var FullscreenIconWrapper = /*#__PURE__*/styled__default(IconWrapper$1)(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-left: 20px;\n\n @media ", " {\n display: none;\n pointer-events: none;\n }\n"])), devices.mobileAndTablet);
3453
+ var FullscreenIconWrapper = /*#__PURE__*/styled__default(IconWrapper$1)(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-left: 20px;\n"])));
3454
+
3455
+ // WARNING: Do not use this on server side rendering, it may throw an error.
3456
+ var isIOS = function isIOS() {
3457
+ try {
3458
+ console.warn('Do not use this on server side rendering, it may throw an error.');
3459
+ if (typeof navigator === undefined) return false;
3460
+ return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) ||
3461
+ // iPad on iOS 13 detection
3462
+ navigator.userAgent.includes('Mac') && 'ontouchend' in document;
3463
+ } catch (e) {
3464
+ console.warn('Error checking if device is iOS.', e);
3465
+ return false;
3466
+ }
3467
+ };
3468
+ // React hook version of isIOS (for server side rendering)
3469
+ var useIOS = function useIOS() {
3470
+ var _useState = React.useState(false),
3471
+ IOS = _useState[0],
3472
+ setIOS = _useState[1];
3473
+ React.useEffect(function () {
3474
+ if (typeof navigator === undefined) return;
3475
+ setIOS(isIOS());
3476
+ }, []);
3477
+ return IOS;
3478
+ };
3479
+ // Checks device size based on window width
3480
+ var isMobile = function isMobile() {
3481
+ try {
3482
+ console.warn('Do not use this on server side rendering, it may throw an error.');
3483
+ if (typeof window === undefined) return false;
3484
+ return window.innerWidth < breakpoints.sm;
3485
+ } catch (e) {
3486
+ console.warn('Error checking if device is mobile.', e);
3487
+ return false;
3488
+ }
3489
+ };
3490
+ // React hook version of isMobile (for server side rendering)
3491
+ var useMobile = function useMobile() {
3492
+ var _useState2 = React.useState(false),
3493
+ mobile = _useState2[0],
3494
+ setMobile = _useState2[1];
3495
+ React.useEffect(function () {
3496
+ if (typeof window === undefined) return;
3497
+ setMobile(isMobile());
3498
+ }, []);
3499
+ return mobile;
3500
+ };
3501
+ var useViewport = function useViewport() {
3502
+ var _useState3 = React.useState(false),
3503
+ hydrated = _useState3[0],
3504
+ setHydrated = _useState3[1];
3505
+ var _useState4 = React.useState({
3506
+ width: 0,
3507
+ isMobile: false,
3508
+ isTablet: false,
3509
+ isDesktop: false
3510
+ }),
3511
+ viewport = _useState4[0],
3512
+ setViewport = _useState4[1];
3513
+ React.useEffect(function () {
3514
+ if (typeof window === 'undefined') return undefined;
3515
+ var handleResize = function handleResize() {
3516
+ setViewport({
3517
+ width: window.innerWidth,
3518
+ isMobile: window.innerWidth < breakpoints.sm,
3519
+ isTablet: window.innerWidth >= breakpoints.sm && window.innerWidth < breakpoints.md,
3520
+ isDesktop: window.innerWidth >= breakpoints.md
3521
+ });
3522
+ };
3523
+ handleResize();
3524
+ setHydrated(true);
3525
+ window.addEventListener('resize', handleResize);
3526
+ return function () {
3527
+ return window.removeEventListener('resize', handleResize);
3528
+ };
3529
+ }, []);
3530
+ return _extends({}, viewport, {
3531
+ hydrated: hydrated
3532
+ });
3533
+ };
3450
3534
 
3451
3535
  var RotatorButtons = function RotatorButtons(_ref) {
3452
3536
  var onClickPrev = _ref.onClickPrev,
@@ -3461,6 +3545,11 @@ var RotatorButtons = function RotatorButtons(_ref) {
3461
3545
  _ref$isFullscreen = _ref.isFullscreen,
3462
3546
  isFullscreen = _ref$isFullscreen === void 0 ? false : _ref$isFullscreen,
3463
3547
  className = _ref.className;
3548
+ var _useViewport = useViewport(),
3549
+ isMobile = _useViewport.isMobile,
3550
+ isTablet = _useViewport.isTablet,
3551
+ hydrated = _useViewport.hydrated;
3552
+ if (!hydrated) return null;
3464
3553
  var onClickLeftHandler = function onClickLeftHandler() {
3465
3554
  if (onClickPrev) {
3466
3555
  onClickPrev();
@@ -3531,7 +3620,7 @@ var RotatorButtons = function RotatorButtons(_ref) {
3531
3620
  role: "button"
3532
3621
  }, renderNextIcon())) : (/*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
3533
3622
  "data-testid": "iconnextnoavailable"
3534
- }, renderNextIcon())), showFullscreen && (/*#__PURE__*/React__default.createElement(FullscreenIconWrapper, {
3623
+ }, renderNextIcon())), showFullscreen && !isMobile && !isTablet && (/*#__PURE__*/React__default.createElement(FullscreenIconWrapper, {
3535
3624
  onClick: onClickFullscreenHandler,
3536
3625
  onKeyDown: onFullscreenKeyDownHandler,
3537
3626
  tabIndex: 0,
@@ -3629,7 +3718,7 @@ var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v4/rolex.html?
3629
3718
  var DEFAULT_SPONSORSHIP_TITLE = 'rolex';
3630
3719
  var DEFAULT_DATA_ROH = 'ImgAdvert';
3631
3720
 
3632
- var _excluded$7 = ["src", "dataRoh", "title"];
3721
+ var _excluded$8 = ["src", "dataRoh", "title"];
3633
3722
  var Sponsorship = function Sponsorship(_ref) {
3634
3723
  var _ref$src = _ref.src,
3635
3724
  src = _ref$src === void 0 ? DEFAULT_SPONSORSHIP_IFRAME : _ref$src,
@@ -3637,7 +3726,7 @@ var Sponsorship = function Sponsorship(_ref) {
3637
3726
  dataRoh = _ref$dataRoh === void 0 ? DEFAULT_DATA_ROH : _ref$dataRoh,
3638
3727
  _ref$title = _ref.title,
3639
3728
  title = _ref$title === void 0 ? DEFAULT_SPONSORSHIP_TITLE : _ref$title,
3640
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
3729
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
3641
3730
  var linkText = title + " sponsorship";
3642
3731
  var linkDescription = linkText + " - visit " + title + "'s website (opens in new tab)";
3643
3732
  return /*#__PURE__*/React__default.createElement(SponsorshipWrapper, Object.assign({}, rest), /*#__PURE__*/React__default.createElement(SponsorshipLink, {
@@ -3786,7 +3875,7 @@ var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$l || (_templ
3786
3875
  });
3787
3876
  var TabLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-right: var(--button-icon-margin);\n"])));
3788
3877
 
3789
- var _excluded$8 = ["children", "iconName", "iconDirection", "color", "hoverColor", "className"];
3878
+ var _excluded$9 = ["children", "iconName", "iconDirection", "color", "hoverColor", "className"];
3790
3879
  var TabLink = function TabLink(_ref) {
3791
3880
  var children = _ref.children,
3792
3881
  iconName = _ref.iconName,
@@ -3796,7 +3885,7 @@ var TabLink = function TabLink(_ref) {
3796
3885
  _ref$hoverColor = _ref.hoverColor,
3797
3886
  hoverColor = _ref$hoverColor === void 0 ? ThemeColor['primary-red'] : _ref$hoverColor,
3798
3887
  className = _ref.className,
3799
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
3888
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
3800
3889
  return /*#__PURE__*/React__default.createElement(TabLinkWrapper, Object.assign({
3801
3890
  color: color,
3802
3891
  iconName: iconName,
@@ -3847,7 +3936,7 @@ var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$5 || (_tem
3847
3936
  return darkMode ? 'var(--base-color-white)' : 'var(--base-color-errorstate)';
3848
3937
  });
3849
3938
 
3850
- var _excluded$9 = ["label", "error", "width", "darkMode", "height", "columnStartDesktop", "columnStartDevice", "columnSpanDesktop", "columnSpanDevice", "maxLength", "tabIndex"];
3939
+ var _excluded$a = ["label", "error", "width", "darkMode", "height", "columnStartDesktop", "columnStartDevice", "columnSpanDesktop", "columnSpanDevice", "maxLength", "tabIndex"];
3851
3940
  /**
3852
3941
  * An HTML textarea component for Harmonic.
3853
3942
  *
@@ -3908,7 +3997,7 @@ var TextArea = function TextArea(_ref) {
3908
3997
  maxLength = _ref$maxLength === void 0 ? 950 : _ref$maxLength,
3909
3998
  _ref$tabIndex = _ref.tabIndex,
3910
3999
  tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
3911
- textareaProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
4000
+ textareaProps = _objectWithoutPropertiesLoose(_ref, _excluded$a);
3912
4001
  return /*#__PURE__*/React__default.createElement(GridItem, {
3913
4002
  columnStartDesktop: columnStartDesktop,
3914
4003
  columnSpanDesktop: columnSpanDesktop,
@@ -3968,7 +4057,7 @@ var ErrorLabel$1 = /*#__PURE__*/styled__default.div(_templateObject6$1 || (_temp
3968
4057
  });
3969
4058
  var BodyCopyHarmonicWithWrapper = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-state-error);\n"])));
3970
4059
 
3971
- var _excluded$a = ["label", "type", "error", "darkMode", "width"];
4060
+ var _excluded$b = ["label", "type", "error", "darkMode", "width"];
3972
4061
  /**
3973
4062
  * A text field component, that wraps around the native `<input />` element
3974
4063
  * and adds some extra states and information around it (i.e. a text and an error labels,
@@ -4015,7 +4104,7 @@ var TextFieldComponent = function TextFieldComponent(_ref, ref) {
4015
4104
  _ref$darkMode = _ref.darkMode,
4016
4105
  darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
4017
4106
  width = _ref.width,
4018
- inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$a);
4107
+ inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$b);
4019
4108
  var _useState = React.useState(false),
4020
4109
  showPassword = _useState[0],
4021
4110
  setShowPassword = _useState[1];
@@ -4113,7 +4202,7 @@ var ErrorLabel$2 = /*#__PURE__*/styled__default.p(_templateObject5$4 || (_templa
4113
4202
  return darkMode ? theme.colors.white : theme.colors.error;
4114
4203
  });
4115
4204
 
4116
- var _excluded$b = ["label", "error", "darkMode", "width"];
4205
+ var _excluded$c = ["label", "error", "darkMode", "width"];
4117
4206
  /**
4118
4207
  * @deprecated
4119
4208
  *
@@ -4127,7 +4216,7 @@ var TextFieldLegacy = function TextFieldLegacy(_ref) {
4127
4216
  _ref$darkMode = _ref.darkMode,
4128
4217
  darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
4129
4218
  width = _ref.width,
4130
- inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$b);
4219
+ inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$c);
4131
4220
  return /*#__PURE__*/React__default.createElement(TextFieldContainer, null, /*#__PURE__*/React__default.createElement("label", {
4132
4221
  htmlFor: "text-field-input"
4133
4222
  }, /*#__PURE__*/React__default.createElement(TextLabel$2, {
@@ -4156,13 +4245,13 @@ var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$p || (_temp
4156
4245
  }, devices.mobile);
4157
4246
  var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$h || (_templateObject2$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
4158
4247
 
4159
- var _excluded$c = ["children", "iconName", "iconDirection", "textColor"];
4248
+ var _excluded$d = ["children", "iconName", "iconDirection", "textColor"];
4160
4249
  var TextLink = function TextLink(_ref) {
4161
4250
  var children = _ref.children,
4162
4251
  iconName = _ref.iconName,
4163
4252
  iconDirection = _ref.iconDirection,
4164
4253
  textColor = _ref.textColor,
4165
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
4254
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
4166
4255
  var truncatedString = children.substring(0, 30);
4167
4256
  return /*#__PURE__*/React__default.createElement(TextLinkWrapper, Object.assign({
4168
4257
  color: textColor,
@@ -4355,7 +4444,7 @@ var ErrorLabel$3 = /*#__PURE__*/styled__default.div(_templateObject6$2 || (_temp
4355
4444
  return 'var(--base-color-errorstate)';
4356
4445
  });
4357
4446
 
4358
- var _excluded$d = ["children", "disabled", "error", "darkMode", "blackBox"];
4447
+ var _excluded$e = ["children", "disabled", "error", "darkMode", "blackBox"];
4359
4448
  /**
4360
4449
  * A Tickbox component, that wraps around the native `<input type="checkbox"/>` element
4361
4450
  * and adds some extra styling, states and information around it (i.e. an error label,
@@ -4384,7 +4473,7 @@ var Tickbox2Component = function Tickbox2Component(_ref, ref) {
4384
4473
  darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
4385
4474
  _ref$blackBox = _ref.blackBox,
4386
4475
  blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
4387
- inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$d);
4476
+ inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$e);
4388
4477
  return /*#__PURE__*/React__default.createElement(Container$2, null, /*#__PURE__*/React__default.createElement(TickboxLabel$2, {
4389
4478
  darkMode: darkMode,
4390
4479
  blackBox: blackBox
@@ -4943,86 +5032,6 @@ var _templateObject$w, _templateObject2$n;
4943
5032
  var MediaLinksWrapper = /*#__PURE__*/styled__default.div(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: var(--footer-media-gap);\n"])));
4944
5033
  var MediaIconWrapper = /*#__PURE__*/styled__default.a(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-media-icon-height);\n width: var(--footer-media-icon-width);\n\n &:focus {\n outline: 2px solid var(--color-base-white);\n }\n"])));
4945
5034
 
4946
- // WARNING: Do not use this on server side rendering, it may throw an error.
4947
- var isIOS = function isIOS() {
4948
- try {
4949
- console.warn('Do not use this on server side rendering, it may throw an error.');
4950
- if (typeof navigator === undefined) return false;
4951
- return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) ||
4952
- // iPad on iOS 13 detection
4953
- navigator.userAgent.includes('Mac') && 'ontouchend' in document;
4954
- } catch (e) {
4955
- console.warn('Error checking if device is iOS.', e);
4956
- return false;
4957
- }
4958
- };
4959
- // React hook version of isIOS (for server side rendering)
4960
- var useIOS = function useIOS() {
4961
- var _useState = React.useState(false),
4962
- IOS = _useState[0],
4963
- setIOS = _useState[1];
4964
- React.useEffect(function () {
4965
- if (typeof navigator === undefined) return;
4966
- setIOS(isIOS());
4967
- }, []);
4968
- return IOS;
4969
- };
4970
- // Checks device size based on window width
4971
- var isMobile = function isMobile() {
4972
- try {
4973
- console.warn('Do not use this on server side rendering, it may throw an error.');
4974
- if (typeof window === undefined) return false;
4975
- return window.innerWidth < breakpoints.sm;
4976
- } catch (e) {
4977
- console.warn('Error checking if device is mobile.', e);
4978
- return false;
4979
- }
4980
- };
4981
- // React hook version of isMobile (for server side rendering)
4982
- var useMobile = function useMobile() {
4983
- var _useState2 = React.useState(false),
4984
- mobile = _useState2[0],
4985
- setMobile = _useState2[1];
4986
- React.useEffect(function () {
4987
- if (typeof window === undefined) return;
4988
- setMobile(isMobile());
4989
- }, []);
4990
- return mobile;
4991
- };
4992
- var useViewport = function useViewport() {
4993
- var _useState3 = React.useState(false),
4994
- hydrated = _useState3[0],
4995
- setHydrated = _useState3[1];
4996
- var _useState4 = React.useState({
4997
- width: 0,
4998
- isMobile: false,
4999
- isTablet: false,
5000
- isDesktop: false
5001
- }),
5002
- viewport = _useState4[0],
5003
- setViewport = _useState4[1];
5004
- React.useEffect(function () {
5005
- if (typeof window === 'undefined') return undefined;
5006
- var handleResize = function handleResize() {
5007
- setViewport({
5008
- width: window.innerWidth,
5009
- isMobile: window.innerWidth < breakpoints.sm,
5010
- isTablet: window.innerWidth >= breakpoints.sm && window.innerWidth < breakpoints.md,
5011
- isDesktop: window.innerWidth >= breakpoints.md
5012
- });
5013
- };
5014
- handleResize();
5015
- setHydrated(true);
5016
- window.addEventListener('resize', handleResize);
5017
- return function () {
5018
- return window.removeEventListener('resize', handleResize);
5019
- };
5020
- }, []);
5021
- return _extends({}, viewport, {
5022
- hydrated: hydrated
5023
- });
5024
- };
5025
-
5026
5035
  var SocialLinks = function SocialLinks(_ref) {
5027
5036
  var items = _ref.items;
5028
5037
  var _useViewport = useViewport(),
@@ -6050,11 +6059,11 @@ var getBackgroundColor$1 = function getBackgroundColor(_ref2) {
6050
6059
  var _templateObject$G;
6051
6060
  var AuxiliaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n cursor: pointer;\n text-decoration: none;\n box-sizing: border-box;\n\n && span svg * {\n fill: ", ";\n }\n\n .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), getBackgroundColor$1, getTextColor$3, getTextColor$3);
6052
6061
 
6053
- var _excluded$e = ["children", "className"];
6062
+ var _excluded$f = ["children", "className"];
6054
6063
  var AuxiliaryButton = function AuxiliaryButton(_ref) {
6055
6064
  var children = _ref.children,
6056
6065
  className = _ref.className,
6057
- props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
6066
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$f);
6058
6067
  return /*#__PURE__*/React__default.createElement(AuxiliaryButtonWrapper, Object.assign({}, props, {
6059
6068
  iconClassName: "auxiliaryButtonIcon",
6060
6069
  className: className
@@ -6198,7 +6207,7 @@ var truncateReactNodeString = function truncateReactNodeString(node, resultLengt
6198
6207
  return truncateHtmlString(nodeString, resultLength, addDots);
6199
6208
  };
6200
6209
 
6201
- var _excluded$f = ["text"],
6210
+ var _excluded$g = ["text"],
6202
6211
  _excluded2$1 = ["text"];
6203
6212
  var _buttonTypeToButton;
6204
6213
  var LENGTH_LARGE_TEXT$1 = 28;
@@ -6248,7 +6257,7 @@ var Card = function Card(_ref) {
6248
6257
  var _ref2 = firstButton || {},
6249
6258
  _ref2$text = _ref2.text,
6250
6259
  firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
6251
- restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
6260
+ restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$g);
6252
6261
  var primaryButtonTextTruncate = size === 'small' ? truncate(firstButtonText, LENGTH_SMALL_TEXT$1) : truncate(firstButtonText, LENGTH_LARGE_TEXT$1);
6253
6262
  var secondButton = links == null ? void 0 : links[1];
6254
6263
  var _ref3 = secondButton || {},
@@ -6608,7 +6617,7 @@ var HotFiltersWrapper = /*#__PURE__*/styled__default.div(_templateObject$M || (_
6608
6617
  var HotFilterOptionsWrapper = /*#__PURE__*/styled__default.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n width: fit-content;\n min-width: 400px;\n justify-content: space-between;\n gap: 16px;\n font-family: var(--font-family-sans);\n\n @media ", " {\n gap: 10px;\n }\n"])), devices.mobile);
6609
6618
  var StyledHotFiltersButton = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-base-black);\n min-width: fit-content;\n\n :hover {\n color: var(--color-base-white);\n }\n"])));
6610
6619
 
6611
- var _excluded$g = ["text", "onClick"];
6620
+ var _excluded$h = ["text", "onClick"];
6612
6621
  var HotFilters = function HotFilters(_ref) {
6613
6622
  var items = _ref.items,
6614
6623
  className = _ref.className,
@@ -6624,7 +6633,7 @@ var HotFilters = function HotFilters(_ref) {
6624
6633
  }, /*#__PURE__*/React__default.createElement(HotFilterOptionsWrapper, null, items.map(function (item, index) {
6625
6634
  var text = item.text,
6626
6635
  _onClick = item.onClick,
6627
- rest = _objectWithoutPropertiesLoose(item, _excluded$g);
6636
+ rest = _objectWithoutPropertiesLoose(item, _excluded$h);
6628
6637
  var isSelected = index === selectedIndex;
6629
6638
  return /*#__PURE__*/React__default.createElement(StyledHotFiltersButton, Object.assign({
6630
6639
  key: index,
@@ -7002,7 +7011,7 @@ var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$d || (_tem
7002
7011
  var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__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);
7003
7012
  var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$5 || (_templateObject8$5 = /*#__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);
7004
7013
 
7005
- var _excluded$h = ["text"];
7014
+ var _excluded$i = ["text"];
7006
7015
  var PageHeadingImpact = function PageHeadingImpact(_ref) {
7007
7016
  var children = _ref.children,
7008
7017
  text = _ref.text,
@@ -7020,7 +7029,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
7020
7029
  var truncatedText = text == null ? void 0 : text.substring(0, 75);
7021
7030
  var _ref2 = link || {},
7022
7031
  linkText = _ref2.text,
7023
- restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$h);
7032
+ restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$i);
7024
7033
  return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
7025
7034
  bgUrlDesktop: bgUrlDesktop,
7026
7035
  bgUrlDevice: bgUrlDevice,
@@ -7482,7 +7491,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
7482
7491
  return /*#__PURE__*/React__default.createElement(CompactHeaderLogoWrapper, null, renderBranding(brandingStyle, invert, brandingText, brandingLink));
7483
7492
  };
7484
7493
 
7485
- var _excluded$i = ["text"];
7494
+ var _excluded$j = ["text"];
7486
7495
  var useResponsiveVideo = function useResponsiveVideo(video, poster) {
7487
7496
  var mobileVideo = video.mobile || video.desktop;
7488
7497
  var desktopVideo = video.desktop || video.mobile;
@@ -7587,7 +7596,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
7587
7596
  showCopy = _ref4$showCopy === void 0 ? true : _ref4$showCopy;
7588
7597
  var _ref5 = link || {},
7589
7598
  linkText = _ref5.text,
7590
- restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$i);
7599
+ restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$j);
7591
7600
  // const titleSize = title && title.length > 20 ? 4 : 3;
7592
7601
  var video = {
7593
7602
  elementId: 'compact-header-video',
@@ -7687,7 +7696,7 @@ var getMovedSlides = function getMovedSlides(delta, slideWidths) {
7687
7696
  return movedSlides;
7688
7697
  };
7689
7698
 
7690
- var _excluded$j = ["children", "infinite", "onIndexChange", "slidesOffsetBefore", "slidesAriaHidden", "onActiveChange"];
7699
+ var _excluded$k = ["children", "infinite", "onIndexChange", "slidesOffsetBefore", "slidesAriaHidden", "onActiveChange"];
7691
7700
  var MAX_CLONES_NUMBER = 6;
7692
7701
  var CLICK_DRAG_THRESHOLD = 10;
7693
7702
  var getClonesCount = function getClonesCount(infinite, childrenLength) {
@@ -7712,7 +7721,7 @@ var Swipe = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
7712
7721
  _ref$slidesAriaHidden = _ref.slidesAriaHidden,
7713
7722
  slidesAriaHidden = _ref$slidesAriaHidden === void 0 ? false : _ref$slidesAriaHidden,
7714
7723
  onActiveChange = _ref.onActiveChange,
7715
- props = _objectWithoutPropertiesLoose(_ref, _excluded$j);
7724
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$k);
7716
7725
  var containerRef = React.useRef(null);
7717
7726
  var childRefs = React.useRef([]);
7718
7727
  var startX = React.useRef(0);
@@ -8475,7 +8484,7 @@ var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_te
8475
8484
  var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject15 || (_templateObject15 = /*#__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);
8476
8485
  var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
8477
8486
 
8478
- var _excluded$k = ["text"],
8487
+ var _excluded$l = ["text"],
8479
8488
  _excluded2$2 = ["text"],
8480
8489
  _excluded3$1 = ["text"];
8481
8490
  var _buttonTypeToButton$1;
@@ -8536,7 +8545,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
8536
8545
  var _ref2 = firstButton || {},
8537
8546
  _ref2$text = _ref2.text,
8538
8547
  firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
8539
- restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$k);
8548
+ restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$l);
8540
8549
  var primaryButtonTextTruncate = truncate(firstButtonText, LENGTH_TEXT$1);
8541
8550
  var secondButton = links == null ? void 0 : links[1];
8542
8551
  var _ref3 = secondButton || {},
@@ -8811,7 +8820,7 @@ var PromoChild = function PromoChild(_ref) {
8811
8820
  }));
8812
8821
  };
8813
8822
 
8814
- var _excluded$l = ["text"],
8823
+ var _excluded$m = ["text"],
8815
8824
  _excluded2$3 = ["text"];
8816
8825
  var LENGTH_TEXT$3 = 28;
8817
8826
  var PromoWithTitle = function PromoWithTitle(_ref) {
@@ -8838,7 +8847,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
8838
8847
  var _ref2 = primaryButton || {},
8839
8848
  _ref2$text = _ref2.text,
8840
8849
  primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
8841
- restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$l);
8850
+ restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$m);
8842
8851
  var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$3);
8843
8852
  var tertiaryButton = links == null ? void 0 : links[1];
8844
8853
  var _ref3 = tertiaryButton || {},
@@ -9537,7 +9546,7 @@ var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$y || (_temp
9537
9546
  return "var(--base-color-errorstate)";
9538
9547
  });
9539
9548
 
9540
- var _excluded$m = ["label", "error", "width", "darkMode", "isSearchable", "components"];
9549
+ var _excluded$n = ["label", "error", "width", "darkMode", "isSearchable", "components"];
9541
9550
  var DropdownIndicator = function DropdownIndicator(props) {
9542
9551
  return /*#__PURE__*/React__default.createElement(Select$1.components.DropdownIndicator, Object.assign({}, props), /*#__PURE__*/React__default.createElement(Icon, {
9543
9552
  iconName: "DropdownArrow"
@@ -9588,7 +9597,7 @@ var SelectComponent = function SelectComponent(_ref2) {
9588
9597
  _ref2$isSearchable = _ref2.isSearchable,
9589
9598
  isSearchable = _ref2$isSearchable === void 0 ? false : _ref2$isSearchable,
9590
9599
  components = _ref2.components,
9591
- selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$m);
9600
+ selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$n);
9592
9601
  return /*#__PURE__*/React__default.createElement(WrapperComponent, {
9593
9602
  label: label,
9594
9603
  error: error,
@@ -9606,7 +9615,7 @@ var SelectComponent = function SelectComponent(_ref2) {
9606
9615
  })));
9607
9616
  };
9608
9617
 
9609
- var _excluded$n = ["label", "error", "width", "darkMode", "components"];
9618
+ var _excluded$o = ["label", "error", "width", "darkMode", "components"];
9610
9619
  /**
9611
9620
  * The Select2Async component is similar to Select 2, but uses react-select async
9612
9621
  * component for select instead of regular react-select component. This can be used
@@ -9628,7 +9637,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
9628
9637
  _ref$darkMode = _ref.darkMode,
9629
9638
  darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
9630
9639
  components = _ref.components,
9631
- selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$n);
9640
+ selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$o);
9632
9641
  return /*#__PURE__*/React__default.createElement(WrapperComponent, {
9633
9642
  label: label,
9634
9643
  error: error,
@@ -9749,8 +9758,8 @@ var UpsellCard = function UpsellCard(_ref) {
9749
9758
  }, /*#__PURE__*/React__default.createElement(SecondaryButton, Object.assign({}, secondaryLink), truncate(secondaryLink.text, LENGTH_SMALL_TEXT$2))))))));
9750
9759
  };
9751
9760
 
9752
- var _templateObject$18, _templateObject2$S;
9753
- var Wrapper$7 = /*#__PURE__*/styled__default.figure(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n\n @media ", " {\n height: calc(100% - 30px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
9761
+ var _templateObject$18, _templateObject2$S, _templateObject3$I;
9762
+ var Wrapper$7 = /*#__PURE__*/styled__default.figure(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table;\n width: auto;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n width: 100%;\n\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
9754
9763
  var _ref$aspectRatio = _ref.aspectRatio,
9755
9764
  aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
9756
9765
  return aspectRatio;
@@ -9759,100 +9768,45 @@ var Wrapper$7 = /*#__PURE__*/styled__default.figure(_templateObject$18 || (_temp
9759
9768
  aspectRatio = _ref2$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref2$aspectRatio,
9760
9769
  height = _ref2.height;
9761
9770
  return "calc(calc(" + height + "px - 34px) * " + AspectRatioWidth[aspectRatio] + ")";
9762
- }, devices.mobile, function (_ref3) {
9763
- var _ref3$aspectRatio = _ref3.aspectRatio,
9764
- aspectRatio = _ref3$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref3$aspectRatio;
9765
- return aspectRatio;
9766
- }, function (_ref4) {
9767
- var _ref4$aspectRatio = _ref4.aspectRatio,
9768
- aspectRatio = _ref4$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref4$aspectRatio,
9769
- height = _ref4.height;
9770
- return "calc(calc(" + height + "px - 30px) * " + AspectRatioWidth[aspectRatio] + ")";
9771
9771
  });
9772
- var CaptionWrapper = /*#__PURE__*/styled__default(Caption)(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-top: 12px;\n max-width: var(--caption-max-width, 100%);\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: normal;\n }\n height: 22px;\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n word-break: var(--word-break-body);\n\n @media ", " {\n height: 18px;\n }\n"])), devices.mobile);
9772
+ var CaptionWrapper = /*#__PURE__*/styled__default.figcaption(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table-caption;\n caption-side: bottom;\n margin-top: 12px;\n"])));
9773
+ var CaptionContext = /*#__PURE__*/styled__default(Caption)(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n line-clamp: 2;\n max-height: 46px;\n white-space: normal;\n word-break: break-word;\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n"])));
9773
9774
 
9775
+ var _excluded$p = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
9774
9776
  var ImageWithCaption = function ImageWithCaption(_ref) {
9775
9777
  var caption = _ref.caption,
9776
9778
  altText = _ref.altText,
9777
- children = _ref.children,
9778
- aspectRatio = _ref.aspectRatio;
9779
- var wrapperRef = React.useRef(null);
9780
- var imgRef = React.useRef(null);
9781
- var _useState = React.useState(0),
9782
- height = _useState[0],
9783
- setHeight = _useState[1];
9784
- var updateWrapperHeight = React__default.useCallback(function () {
9785
- var _wrapperRef$current;
9786
- setHeight((wrapperRef == null || (_wrapperRef$current = wrapperRef.current) == null ? void 0 : _wrapperRef$current.offsetHeight) || 0);
9787
- }, []);
9788
- var updateCaptionWidth = React__default.useCallback(function () {
9789
- var img = imgRef.current;
9790
- var wrapper = wrapperRef.current;
9791
- if (img && wrapper) {
9792
- var w = img.getBoundingClientRect().width;
9793
- wrapper.style.setProperty('--caption-max-width', Math.round(w) + "px");
9794
- }
9795
- }, []);
9796
- React.useEffect(function () {
9797
- updateWrapperHeight();
9798
- updateCaptionWidth();
9799
- window.addEventListener('resize', updateWrapperHeight);
9800
- window.addEventListener('resize', updateCaptionWidth);
9801
- var imageResizeObserver = null;
9802
- if (typeof ResizeObserver !== 'undefined' && imgRef.current) {
9803
- imageResizeObserver = new ResizeObserver(updateCaptionWidth);
9804
- imageResizeObserver.observe(imgRef.current);
9805
- }
9806
- return function () {
9807
- window.removeEventListener('resize', updateWrapperHeight);
9808
- window.removeEventListener('resize', updateCaptionWidth);
9809
- if (imageResizeObserver && imgRef.current) imageResizeObserver.unobserve(imgRef.current);
9810
- };
9811
- }, [updateWrapperHeight, updateCaptionWidth]);
9812
- var clonedChildren = React__default.Children.map(children, function (child) {
9813
- if (! /*#__PURE__*/React__default.isValidElement(child)) return child;
9814
- var childElement = child;
9815
- var originalRef = child.ref;
9816
- var newProps = {
9817
- alt: altText,
9818
- tabIndex: 0,
9819
- onKeyDown: function onKeyDown(e) {
9820
- if (e.key === 'Enter' || e.key === ' ') {
9821
- var _imgRef$current;
9822
- e.preventDefault();
9823
- (_imgRef$current = imgRef.current) == null || _imgRef$current.click();
9824
- }
9825
- var originalOnKeyDownHandler = childElement.props.onKeyDown;
9826
- if (originalOnKeyDownHandler) originalOnKeyDownHandler(e);
9827
- },
9828
- ref: function ref(node) {
9829
- imgRef.current = node;
9830
- if (node) updateCaptionWidth();
9831
- if (!originalRef) return;
9832
- if (typeof originalRef === 'function') {
9833
- originalRef(node);
9834
- } else {
9835
- originalRef.current = node;
9836
- }
9837
- }
9838
- };
9839
- return /*#__PURE__*/React__default.cloneElement(childElement, newProps);
9840
- });
9841
- return /*#__PURE__*/React__default.createElement(Wrapper$7, {
9779
+ src = _ref.src,
9780
+ srcSet = _ref.srcSet,
9781
+ sizes = _ref.sizes,
9782
+ loading = _ref.loading,
9783
+ aspectRatio = _ref.aspectRatio,
9784
+ className = _ref.className,
9785
+ restProps = _objectWithoutPropertiesLoose(_ref, _excluded$p);
9786
+ return /*#__PURE__*/React__default.createElement(Wrapper$7, Object.assign({
9842
9787
  aspectRatio: aspectRatio,
9843
- ref: wrapperRef,
9844
- height: height
9845
- }, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
9846
- aspectRatio: aspectRatio
9847
- }, clonedChildren), caption && /*#__PURE__*/React__default.createElement(CaptionWrapper, {
9848
- tag: "figcaption"
9849
- }, caption));
9788
+ className: className
9789
+ }, restProps), /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
9790
+ aspectRatio: aspectRatio,
9791
+ tabIndex: 0,
9792
+ role: "img",
9793
+ "aria-label": altText
9794
+ }, /*#__PURE__*/React__default.createElement("img", {
9795
+ src: src,
9796
+ srcSet: srcSet,
9797
+ sizes: sizes,
9798
+ loading: loading,
9799
+ alt: altText,
9800
+ "aria-hidden": "true"
9801
+ })), caption && (/*#__PURE__*/React__default.createElement(CaptionWrapper, null, /*#__PURE__*/React__default.createElement(CaptionContext, {
9802
+ tag: "span"
9803
+ }, caption))));
9850
9804
  };
9851
9805
 
9852
- var _templateObject$19, _templateObject2$T, _templateObject3$I, _templateObject4$A, _templateObject5$u, _templateObject6$n;
9806
+ var _templateObject$19, _templateObject2$T, _templateObject3$J, _templateObject4$A, _templateObject5$u, _templateObject6$n;
9853
9807
  var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__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"])));
9854
9808
  var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
9855
- var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
9809
+ var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
9856
9810
  var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
9857
9811
  var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__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);
9858
9812
  var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$n || (_templateObject6$n = /*#__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);
@@ -9893,10 +9847,10 @@ var MiniCard = function MiniCard(_ref) {
9893
9847
  }, title)))));
9894
9848
  };
9895
9849
 
9896
- var _templateObject$1a, _templateObject2$U, _templateObject3$J, _templateObject4$B, _templateObject5$v;
9850
+ var _templateObject$1a, _templateObject2$U, _templateObject3$K, _templateObject4$B, _templateObject5$v;
9897
9851
  var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__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"])));
9898
9852
  var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__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"])));
9899
- var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
9853
+ var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
9900
9854
  var isVisible = _ref.isVisible;
9901
9855
  return isVisible ? 'visible' : 'hidden';
9902
9856
  });
@@ -9985,10 +9939,10 @@ var ReadMore = function ReadMore(_ref) {
9985
9939
  }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
9986
9940
  };
9987
9941
 
9988
- var _templateObject$1b, _templateObject2$V, _templateObject3$K, _templateObject4$C, _templateObject5$w;
9942
+ var _templateObject$1b, _templateObject2$V, _templateObject3$L, _templateObject4$C, _templateObject5$w;
9989
9943
  var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
9990
9944
  var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$V || (_templateObject2$V = /*#__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);
9991
- var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$K || (_templateObject3$K = /*#__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);
9945
+ var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$L || (_templateObject3$L = /*#__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);
9992
9946
  var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$C || (_templateObject4$C = /*#__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) {
9993
9947
  var isActive = _ref.isActive;
9994
9948
  return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
@@ -10149,10 +10103,10 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
10149
10103
  });
10150
10104
  };
10151
10105
 
10152
- var _templateObject$1c, _templateObject2$W, _templateObject3$L, _templateObject4$D, _templateObject5$x, _templateObject6$o;
10106
+ var _templateObject$1c, _templateObject2$W, _templateObject3$M, _templateObject4$D, _templateObject5$x, _templateObject6$o;
10153
10107
  var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10154
10108
  var Sections = /*#__PURE__*/styled__default.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10155
- var Section = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10109
+ var Section = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10156
10110
  var color = _ref.color;
10157
10111
  return "var(--base-color-" + color + ")";
10158
10112
  });
@@ -10243,10 +10197,10 @@ var PasswordStrength = function PasswordStrength(_ref) {
10243
10197
  }, strengthLabel))));
10244
10198
  };
10245
10199
 
10246
- var _templateObject$1d, _templateObject2$X, _templateObject3$M, _templateObject4$E, _templateObject5$y, _templateObject6$p, _templateObject7$j, _templateObject8$c;
10200
+ var _templateObject$1d, _templateObject2$X, _templateObject3$N, _templateObject4$E, _templateObject5$y, _templateObject6$p, _templateObject7$j, _templateObject8$c;
10247
10201
  var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
10248
10202
  var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
10249
- var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
10203
+ var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
10250
10204
  var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: capitalize;\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) {
10251
10205
  return "calc(100% / " + (props.columns - 1) + ")";
10252
10206
  }, devices.tablet, devices.mobile);
@@ -10458,7 +10412,7 @@ var Table = function Table(_ref) {
10458
10412
  }))));
10459
10413
  };
10460
10414
 
10461
- var _templateObject$1e, _templateObject2$Y, _templateObject3$N, _templateObject4$F, _templateObject5$z, _templateObject6$q, _templateObject7$k, _templateObject8$d, _templateObject9$7, _templateObject0$7, _templateObject1$5, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2;
10415
+ var _templateObject$1e, _templateObject2$Y, _templateObject3$O, _templateObject4$F, _templateObject5$z, _templateObject6$q, _templateObject7$k, _templateObject8$d, _templateObject9$7, _templateObject0$7, _templateObject1$5, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2;
10462
10416
  var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
10463
10417
  var theme = _ref.theme;
10464
10418
  return "var(--color-" + theme + ")";
@@ -10467,7 +10421,7 @@ var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1e || (_temp
10467
10421
  return "var(--color-" + theme + ")";
10468
10422
  });
10469
10423
  var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
10470
- var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$N || (_templateObject3$N = /*#__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);
10424
+ var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$O || (_templateObject3$O = /*#__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);
10471
10425
  var Error = /*#__PURE__*/styled__default.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
10472
10426
  var Form = /*#__PURE__*/styled__default.form(_templateObject5$z || (_templateObject5$z = /*#__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);
10473
10427
  var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__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);
@@ -11100,7 +11054,7 @@ var BodyContent = function BodyContent(_ref2) {
11100
11054
  }, gridItemOrContent);
11101
11055
  };
11102
11056
 
11103
- var _templateObject$1i, _templateObject2$$, _templateObject3$O, _templateObject4$H, _templateObject5$B, _templateObject6$r, _templateObject7$l;
11057
+ var _templateObject$1i, _templateObject2$$, _templateObject3$P, _templateObject4$H, _templateObject5$B, _templateObject6$r, _templateObject7$l;
11104
11058
  var color = 'primary-black';
11105
11059
  var Button$2 = /*#__PURE__*/styled__default(SecondaryButton).attrs({
11106
11060
  borderColor: color,
@@ -11109,7 +11063,7 @@ var Button$2 = /*#__PURE__*/styled__default(SecondaryButton).attrs({
11109
11063
  textColor: color
11110
11064
  })(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 35px;\n margin-top: 33px;\n width: fit-content;\n\n @media ", " {\n margin-bottom: 33px;\n margin-top: 31px;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
11111
11065
  var Container$7 = /*#__PURE__*/styled__default.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-", ");\n padding: 60px 59px 59px;\n\n @media ", " {\n padding: 35px 20px 34px;\n }\n"])), color, devices.mobile);
11112
- var Description = /*#__PURE__*/styled__default(BodyContentTextContainer)(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
11066
+ var Description = /*#__PURE__*/styled__default(BodyContentTextContainer)(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
11113
11067
  var Heading = /*#__PURE__*/styled__default(HarmonicHeader).attrs({
11114
11068
  serif: true,
11115
11069
  size: 'medium'
@@ -11309,10 +11263,10 @@ var Navigation = function Navigation(_ref) {
11309
11263
  })))))));
11310
11264
  };
11311
11265
 
11312
- var _templateObject$1j, _templateObject2$10, _templateObject3$P, _templateObject4$I, _templateObject5$C, _templateObject6$s, _templateObject7$m;
11266
+ var _templateObject$1j, _templateObject2$10, _templateObject3$Q, _templateObject4$I, _templateObject5$C, _templateObject6$s, _templateObject7$m;
11313
11267
  var FooterSection = /*#__PURE__*/styled__default(Grid)(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n padding: 44px 0px;\n grid-template-areas: '. . policy policy policy policy social social social social logo logo logo logo . .';\n\n @media ", " {\n padding: 40px 0px;\n gap: 24px;\n }\n\n @media ", " {\n padding: 20px 0px;\n row-gap: 40px;\n grid-template-areas:\n '. social social social social social social social social social social social social .'\n '. policy policy policy policy policy policy policy policy policy policy policy policy .'\n '. logo logo logo logo logo logo logo logo logo logo logo logo .';\n }\n"])), devices.tablet, devices.mobile);
11314
11268
  var PolicyLinksSection = /*#__PURE__*/styled__default(GridItem)(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: policy;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media ", " {\n gap: 20px;\n }\n\n @media ", " {\n gap: 12px;\n }\n"])), devices.tablet, devices.mobile);
11315
- var SocialAndNewsletterSection = /*#__PURE__*/styled__default(GridItem)(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: social;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 20px;\n\n @media ", " {\n gap: 40px;\n }\n"])), devices.mobile);
11269
+ var SocialAndNewsletterSection = /*#__PURE__*/styled__default(GridItem)(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: social;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 20px;\n\n @media ", " {\n gap: 40px;\n }\n"])), devices.mobile);
11316
11270
  var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
11317
11271
  var LogoAndDescriptionSection = /*#__PURE__*/styled__default(GridItem)(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
11318
11272
  var SponsorLogoContainer = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 290px;\n\n @media ", " {\n max-width: unset;\n }\n"])), devices.mobile);
@@ -11374,7 +11328,7 @@ var Footer = function Footer(_ref) {
11374
11328
  }, additionalInfo))));
11375
11329
  };
11376
11330
 
11377
- var _templateObject$1k, _templateObject2$11, _templateObject3$Q, _templateObject4$J, _templateObject5$D, _templateObject8$e, _templateObject9$8, _templateObject0$8;
11331
+ var _templateObject$1k, _templateObject2$11, _templateObject3$R, _templateObject4$J, _templateObject5$D, _templateObject8$e, _templateObject9$8, _templateObject0$8;
11378
11332
  var LIST_ITEM_GAP = 32;
11379
11333
  var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--color-base-white);\n z-index: ", ";\n\n ", "\n"])), function (_ref) {
11380
11334
  var bottomBorder = _ref.bottomBorder;
@@ -11383,7 +11337,7 @@ var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1k ||
11383
11337
  var withShadow = _ref2.withShadow;
11384
11338
  return withShadow && styled.css(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
11385
11339
  });
11386
- var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
11340
+ var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
11387
11341
  var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
11388
11342
  var TabsList = /*#__PURE__*/styled__default.ul(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: ", "px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref3) {
11389
11343
  var tabsOverflow = _ref3.tabsOverflow;
@@ -11411,7 +11365,7 @@ var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject0$8 || (_temp
11411
11365
  return disabled ? 'var(--color-state-disabled)' : 'var(--button-anchor-tab-color)';
11412
11366
  });
11413
11367
 
11414
- var _excluded$o = ["id", "text"];
11368
+ var _excluded$q = ["id", "text"];
11415
11369
  var AnchorTabBar = function AnchorTabBar(_ref) {
11416
11370
  var tabs = _ref.tabs,
11417
11371
  onTabClick = _ref.onTabClick,
@@ -11622,7 +11576,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
11622
11576
  }, tabs.map(function (_ref4) {
11623
11577
  var id = _ref4.id,
11624
11578
  text = _ref4.text,
11625
- rest = _objectWithoutPropertiesLoose(_ref4, _excluded$o);
11579
+ rest = _objectWithoutPropertiesLoose(_ref4, _excluded$q);
11626
11580
  return /*#__PURE__*/React__default.createElement("li", {
11627
11581
  key: id
11628
11582
  }, /*#__PURE__*/React__default.createElement(TabLink, Object.assign({
@@ -11655,13 +11609,13 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
11655
11609
  })))) : null))));
11656
11610
  };
11657
11611
 
11658
- var _templateObject$1l, _templateObject2$12, _templateObject3$R, _templateObject4$K, _templateObject6$t, _templateObject7$n, _templateObject8$f, _templateObject9$9, _templateObject0$9;
11612
+ var _templateObject$1l, _templateObject2$12, _templateObject3$S, _templateObject4$K, _templateObject6$t, _templateObject7$n, _templateObject8$f, _templateObject9$9, _templateObject0$9;
11659
11613
  var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
11660
11614
  var sticky = _ref.sticky;
11661
11615
  return sticky ? 'sticky' : 'initial';
11662
11616
  }, zIndexes.anchor);
11663
11617
  var TitleCTAGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
11664
- var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2 / span 15;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n gap: 40px;\n justify-content: space-between;\n\n @media ", " {\n & {\n grid-column: 2 / span 13;\n gap: 20px;\n }\n }\n\n @media ", " {\n & {\n grid-column: 2 / span 12;\n }\n }\n"])), function (_ref2) {
11618
+ var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2 / span 15;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n gap: 40px;\n justify-content: space-between;\n\n @media ", " {\n & {\n grid-column: 2 / span 13;\n gap: 20px;\n }\n }\n\n @media ", " {\n & {\n grid-column: 2 / span 12;\n }\n }\n"])), function (_ref2) {
11665
11619
  var title = _ref2.title;
11666
11620
  return title ? 'row' : 'row-reverse';
11667
11621
  }, devices.tablet, devices.mobile);
@@ -11684,7 +11638,7 @@ var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_template
11684
11638
  var MessageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: var(--grid-outer-margin);\n height: var(--button-height);\n\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n margin-right: var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.tablet, devices.mobile);
11685
11639
  var MessageWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h6 {\n margin: 0;\n padding: 0;\n }\n display: none;\n\n @media ", " {\n & {\n display: flex;\n align-items: center;\n margin-left: var(--grid-margin);\n padding: 12px 0;\n }\n }\n"])), devices.mobile);
11686
11640
 
11687
- var _excluded$p = ["text"],
11641
+ var _excluded$r = ["text"],
11688
11642
  _excluded2$4 = ["text"];
11689
11643
  var TitleWithCTA = function TitleWithCTA(_ref) {
11690
11644
  var title = _ref.title,
@@ -11694,7 +11648,7 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
11694
11648
  message = _ref.message;
11695
11649
  var _ref2 = (links == null ? void 0 : links[0]) || {},
11696
11650
  primaryButtonText = _ref2.text,
11697
- primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$p);
11651
+ primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$r);
11698
11652
  var _ref3 = (links == null ? void 0 : links[1]) || {},
11699
11653
  secondaryButtonText = _ref3.text,
11700
11654
  secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3, _excluded2$4);
@@ -11715,10 +11669,10 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
11715
11669
  }, message))));
11716
11670
  };
11717
11671
 
11718
- var _templateObject$1m, _templateObject2$13, _templateObject3$S, _templateObject4$L;
11672
+ var _templateObject$1m, _templateObject2$13, _templateObject3$T, _templateObject4$L;
11719
11673
  var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: var(--upsell-border-color);\n padding: 66px 74px 70px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding: 40px 0px;\n }\n }\n"])), devices.mobile);
11720
11674
  var TitleContent = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n\n @media ", " {\n margin-left: 20px;\n margin-right: 20px;\n }\n }\n"])), devices.mobile);
11721
- var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 60px;\n\n @media ", " {\n margin-bottom: 40px;\n margin-left: 20px;\n margin-right: 20px;\n }\n"])), devices.mobile);
11675
+ var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 60px;\n\n @media ", " {\n margin-bottom: 40px;\n margin-left: 20px;\n margin-right: 20px;\n }\n"])), devices.mobile);
11722
11676
  var TextContent = /*#__PURE__*/styled__default(BodyContent)(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):first-child {\n margin: 35px 0 10px;\n\n @media ", " {\n margin-top: 24px;\n }\n }\n\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
11723
11677
 
11724
11678
  var _templateObject$1n;
@@ -11817,13 +11771,13 @@ var StickyBar = function StickyBar(_ref) {
11817
11771
  }, children)));
11818
11772
  };
11819
11773
 
11820
- var _templateObject$1p, _templateObject2$15, _templateObject3$T, _templateObject4$M;
11774
+ var _templateObject$1p, _templateObject2$15, _templateObject3$U, _templateObject4$M;
11821
11775
  var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
11822
11776
  var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
11823
- var ContentWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
11777
+ var ContentWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
11824
11778
  var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$M || (_templateObject4$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
11825
11779
 
11826
- var _excluded$q = ["isOpen", "setIsOpen", "children", "appElementId"];
11780
+ var _excluded$s = ["isOpen", "setIsOpen", "children", "appElementId"];
11827
11781
  var MAX_Z_INDEX = 9999999999;
11828
11782
  if (Modal.defaultStyles.content) {
11829
11783
  Modal.defaultStyles.content.position = 'static';
@@ -11897,7 +11851,7 @@ var ModalWindow = function ModalWindow(_ref) {
11897
11851
  setIsOpen = _ref.setIsOpen,
11898
11852
  children = _ref.children,
11899
11853
  appElementId = _ref.appElementId,
11900
- modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$q);
11854
+ modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$s);
11901
11855
  var isMobile = useMobile();
11902
11856
  var customStyles = {
11903
11857
  overlay: {
@@ -11998,20 +11952,20 @@ var getImageSlideStyles = function getImageSlideStyles(imageHeight) {
11998
11952
  return "height: calc(" + imageHeight + "px + var(--carousel-image-caption-height) + 12px);";
11999
11953
  };
12000
11954
 
12001
- var _templateObject$1q, _templateObject2$16, _templateObject3$U, _templateObject4$N, _templateObject5$E, _templateObject6$u, _templateObject7$o, _templateObject8$g, _templateObject9$a;
12002
- var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n \n &:fullscreen {\n background: var(--color-base-white);\n padding-top: 44px;\n padding-bottom: 84px;\n\n .swipe-slide > figure {\n height: var(--fullscreen-figure-height);\n }\n }\n"])), function (_ref) {
11955
+ var _templateObject$1q, _templateObject2$16, _templateObject3$V, _templateObject4$N, _templateObject5$E, _templateObject6$u, _templateObject7$o, _templateObject8$g, _templateObject9$a;
11956
+ var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n \n &:fullscreen {\n background: var(--color-base-white);\n padding-top: 44px;\n padding-bottom: 84px;\n\n .swipe-slide > figure {\n height: var(--fullscreen-figure-height);\n\n > div {\n height: var(--fullscreen-figure-height);\n }\n }\n }\n"])), function (_ref) {
12003
11957
  var imagesHeightDesktop = _ref.imagesHeightDesktop;
12004
- return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n " + getImageSlideStyles(imagesHeightDesktop) + "\n }\n }\n }";
11958
+ return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n " + getImageSlideStyles(imagesHeightDesktop) + "\n\n > div {\n " + getImageSlideStyles(imagesHeightDesktop) + "\n }\n }\n }\n }";
12005
11959
  }, devices.mobile, function (_ref2) {
12006
11960
  var imagesHeightDevice = _ref2.imagesHeightDevice;
12007
- return "&&& {\n .swipe-slide > figure {\n " + getImageSlideStyles(imagesHeightDevice) + "\n }\n }";
11961
+ return "&&& {\n .swipe-slide > figure {\n " + getImageSlideStyles(imagesHeightDevice) + "\n\n > div {\n " + getImageSlideStyles(imagesHeightDevice) + "\n }\n }\n }";
12008
11962
  });
12009
11963
  var CardsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject2$16 || (_templateObject2$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n && {\n .swipe-slide {\n ", "\n }\n }\n }\n}"])), function (_ref3) {
12010
11964
  var type = _ref3.type,
12011
11965
  isActive = _ref3.isActive;
12012
11966
  return "\n & {\n .swipe-slide {\n " + getCardSlideDesktopStyles(type, isActive) + "\n }\n }\n\n @media " + devices.tablet + " {\n & {\n .swipe-slide {\n width: " + (type === exports.CarouselType.SmallCard ? '30%' : '40%') + ";\n }\n }\n }\n ";
12013
11967
  }, devices.mobile, /*#__PURE__*/getCardSlideMobileStyles());
12014
- var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
11968
+ var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
12015
11969
  var CarouselInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
12016
11970
  var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
12017
11971
  var isDescriptionPresent = _ref4.isDescriptionPresent;
@@ -12183,10 +12137,10 @@ var Carousel = function Carousel(_ref) {
12183
12137
  }, children))));
12184
12138
  };
12185
12139
 
12186
- var _templateObject$1r, _templateObject2$17, _templateObject3$V, _templateObject4$O, _templateObject5$F, _templateObject6$v, _templateObject7$p, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1;
12140
+ var _templateObject$1r, _templateObject2$17, _templateObject3$W, _templateObject4$O, _templateObject5$F, _templateObject6$v, _templateObject7$p, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1;
12187
12141
  var HighlightsGrid$1 = /*#__PURE__*/styled__default(Grid)(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n user-select: none;\n\n .highlight-carousel-text {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
12188
12142
  var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
12189
- var HeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
12143
+ var HeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
12190
12144
  var InfoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$O || (_templateObject4$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
12191
12145
  var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject5$F || (_templateObject5$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
12192
12146
  var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject6$v || (_templateObject6$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
@@ -12205,7 +12159,7 @@ var VideoWithControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject1
12205
12159
  return isCurrentSlide ? 'block' : 'none';
12206
12160
  }, devices.mobile);
12207
12161
 
12208
- var _excluded$r = ["text"],
12162
+ var _excluded$t = ["text"],
12209
12163
  _excluded2$5 = ["text"];
12210
12164
  var _buttonTypeToButton$2;
12211
12165
  var buttonTypeToButton$2 = (_buttonTypeToButton$2 = {}, _buttonTypeToButton$2[exports.ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$2[exports.ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$2[exports.ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$2);
@@ -12216,7 +12170,7 @@ var Buttons = function Buttons(_ref) {
12216
12170
  var _ref2 = firstButton || {},
12217
12171
  _ref2$text = _ref2.text,
12218
12172
  firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
12219
- restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$r);
12173
+ restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$t);
12220
12174
  var secondButton = links == null ? void 0 : links[1];
12221
12175
  var _ref3 = secondButton || {},
12222
12176
  _ref3$text = _ref3.text,
@@ -12437,11 +12391,11 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
12437
12391
  })));
12438
12392
  };
12439
12393
 
12440
- var _excluded$s = ["logo", "slides"];
12394
+ var _excluded$u = ["logo", "slides"];
12441
12395
  var HighlightsCinema = function HighlightsCinema(_ref) {
12442
12396
  var logo = _ref.logo,
12443
12397
  slides = _ref.slides,
12444
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$s);
12398
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$u);
12445
12399
  var slidesWithLinks = slides.map(function (slide) {
12446
12400
  var links = processSlideLinks(slide.links);
12447
12401
  return _extends({}, slide, {
@@ -12458,10 +12412,10 @@ var HighlightsCinema = function HighlightsCinema(_ref) {
12458
12412
  })));
12459
12413
  };
12460
12414
 
12461
- var _excluded$t = ["slides"];
12415
+ var _excluded$v = ["slides"];
12462
12416
  var HighlightsCore = function HighlightsCore(_ref) {
12463
12417
  var slides = _ref.slides,
12464
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$t);
12418
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$v);
12465
12419
  var slidesWithLinks = slides.map(function (slide) {
12466
12420
  var links = processSlideLinks(slide.links);
12467
12421
  return _extends({}, slide, {
@@ -12475,11 +12429,11 @@ var HighlightsCore = function HighlightsCore(_ref) {
12475
12429
  })));
12476
12430
  };
12477
12431
 
12478
- var _excluded$u = ["logo", "slides"];
12432
+ var _excluded$w = ["logo", "slides"];
12479
12433
  var HighlightsStream = function HighlightsStream(_ref) {
12480
12434
  var logo = _ref.logo,
12481
12435
  slides = _ref.slides,
12482
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$u);
12436
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
12483
12437
  var slidesWithLinks = slides.map(function (slide) {
12484
12438
  var links = processSlideLinks(slide.links);
12485
12439
  return _extends({}, slide, {
@@ -12496,9 +12450,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
12496
12450
  })));
12497
12451
  };
12498
12452
 
12499
- var _templateObject$1s, _templateObject3$W;
12453
+ var _templateObject$1s, _templateObject3$X;
12500
12454
  var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
12501
- var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
12455
+ var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
12502
12456
 
12503
12457
  var MinimalCarousel = function MinimalCarousel(_ref) {
12504
12458
  var children = _ref.children;
@@ -14041,10 +13995,10 @@ var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1t || (
14041
13995
  return theme.footer.tablet.paddingBottom;
14042
13996
  }, devices.desktop, devices.largeDesktop);
14043
13997
 
14044
- var _templateObject$1u, _templateObject2$18, _templateObject3$X;
13998
+ var _templateObject$1u, _templateObject2$18, _templateObject3$Y;
14045
13999
  var FigureBlock = /*#__PURE__*/styled__default.figure(_templateObject$1u || (_templateObject$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14046
14000
  var BlockquoteBlock = /*#__PURE__*/styled__default.blockquote(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14047
- var AttributionBlock = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 32px 0;\n\n & cite {\n font-style: normal;\n }\n\n @media ", " {\n padding: 24px 0;\n }\n"])), devices.mobile);
14001
+ var AttributionBlock = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject3$Y || (_templateObject3$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 32px 0;\n\n & cite {\n font-style: normal;\n }\n\n @media ", " {\n padding: 24px 0;\n }\n"])), devices.mobile);
14048
14002
 
14049
14003
  /* eslint-disable react/no-danger */
14050
14004
  var Quote = function Quote(_ref) {