@royaloperahouse/chord 2.4.3 → 2.4.4-a-chord-development
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +213 -7
- package/README.md +250 -40
- package/dist/chord.cjs.development.js +465 -413
- package/dist/chord.cjs.development.js.map +1 -1
- package/dist/chord.cjs.production.min.js +1 -1
- package/dist/chord.cjs.production.min.js.map +1 -1
- package/dist/chord.esm.js +466 -415
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/atoms/Grid/GridItemLegacy.d.ts +8 -0
- package/dist/components/atoms/Grid/index.d.ts +2 -1
- package/dist/components/atoms/Icons/Icons.d.ts +1 -1
- package/dist/components/atoms/Icons/SvgIcons/Descriptors/Wheelchair.svg.d.ts +1 -1
- package/dist/components/atoms/Icons/SvgIcons/index.d.ts +1 -1
- package/dist/components/atoms/index.d.ts +2 -2
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/Accordion/Accordion.style.d.ts +7 -2
- package/dist/components/molecules/PageHeading/index.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts +1 -0
- package/dist/components/molecules/ReadMore/ReadMore.style.d.ts +6 -1
- package/dist/components/molecules/Select/Select.style.d.ts +1 -1
- package/dist/components/molecules/Table/Table.style.d.ts +2 -2
- package/dist/components/molecules/Table/components/TableCell.d.ts +3 -0
- package/dist/components/molecules/Table/components/TableHelpers.d.ts +4 -0
- package/dist/components/molecules/Table/components/TableRow.d.ts +3 -0
- package/dist/components/molecules/index.d.ts +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/types/buttonTypes.d.ts +4 -0
- package/dist/types/formTypes.d.ts +12 -9
- package/dist/types/iconTypes.d.ts +5 -0
- package/dist/types/tableTypes.d.ts +5 -0
- package/package.json +2 -2
- package/README.GIT +0 -277
package/dist/chord.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React__default, { createElement, memo, useRef, useCallback, useEffect, useState, forwardRef, useMemo, cloneElement } from 'react';
|
|
1
|
+
import React__default, { createElement, memo, useRef, useCallback, useEffect, useState, forwardRef, useMemo, cloneElement, useLayoutEffect } from 'react';
|
|
2
2
|
import styled, { css, ThemeProvider, createGlobalStyle } from 'styled-components';
|
|
3
3
|
import moment from 'moment';
|
|
4
4
|
import { renderToString } from 'react-dom/server';
|
|
@@ -1544,13 +1544,15 @@ var Tickets = (function (_ref) {
|
|
|
1544
1544
|
|
|
1545
1545
|
var Wheelchair = (function (_ref) {
|
|
1546
1546
|
var _ref$color = _ref.color,
|
|
1547
|
-
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color
|
|
1547
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
1548
|
+
ariaLabel = _ref.ariaLabel;
|
|
1548
1549
|
return /*#__PURE__*/createElement("svg", {
|
|
1549
1550
|
width: "100%",
|
|
1550
1551
|
height: "100%",
|
|
1551
1552
|
viewBox: "0 0 24 24",
|
|
1552
1553
|
fill: "none",
|
|
1553
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
1554
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1555
|
+
"aria-label": ariaLabel
|
|
1554
1556
|
}, /*#__PURE__*/createElement("path", {
|
|
1555
1557
|
d: "M8.4 18.8c-1.1 0-2.2-.4-3-1.1-.8-.8-1.3-1.8-1.3-2.9-.1-1.6.9-3.2 2.3-3.9l-.4-1c-1.9.9-3 2.8-3 4.9.1 2.8 2.4 5.1 5.3 5.1h.2c2.6-.1 4.7-2.1 5.1-4.6l-1.1-.1c-.3 2-2 3.6-4.1 3.6ZM9.8 4.5c1.2 0 2.2-1 2.2-2.2C12 1.1 11 .1 9.8.1c-1.2 0-2.2 1-2.2 2.2 0 1.2.9 2.2 2.2 2.2Zm0-3.3c.6 0 1.1.5 1.1 1.1 0 .6-.5 1.1-1.1 1.1-.6 0-1.1-.5-1.1-1.1 0-.6.5-1.1 1.1-1.1Zm4.9 12c-.3-.5-.9-.8-1.6-.8h-2.6V6.3c0-.6-.5-1.2-1.1-1.2H6.2c-.5.1-.9.5-.9 1v3.2h1.1V6.2l2.9.1v7.2h3.8c.3 0 .5.1.6.3l3.4 5.4.9-.6-3.3-5.4Z",
|
|
1556
1558
|
fill: color
|
|
@@ -2431,7 +2433,8 @@ var Icon = /*#__PURE__*/memo(function (_ref) {
|
|
|
2431
2433
|
color = _ref.color,
|
|
2432
2434
|
iconName = _ref.iconName,
|
|
2433
2435
|
title = _ref.title,
|
|
2434
|
-
direction = _ref.direction
|
|
2436
|
+
direction = _ref.direction,
|
|
2437
|
+
ariaLabel = _ref.ariaLabel;
|
|
2435
2438
|
var IconComponent = IconLibrary[iconName];
|
|
2436
2439
|
return /*#__PURE__*/createElement(Wrapper, {
|
|
2437
2440
|
className: className,
|
|
@@ -2439,7 +2442,8 @@ var Icon = /*#__PURE__*/memo(function (_ref) {
|
|
|
2439
2442
|
title: title,
|
|
2440
2443
|
direction: direction
|
|
2441
2444
|
}, /*#__PURE__*/createElement(IconComponent, {
|
|
2442
|
-
color: color
|
|
2445
|
+
color: color,
|
|
2446
|
+
ariaLabel: ariaLabel
|
|
2443
2447
|
}));
|
|
2444
2448
|
});
|
|
2445
2449
|
Icon.displayName = 'Icon';
|
|
@@ -2467,14 +2471,21 @@ var Button = function Button(_ref) {
|
|
|
2467
2471
|
};
|
|
2468
2472
|
|
|
2469
2473
|
var _templateObject$4;
|
|
2470
|
-
var PrimaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n border-color: ", ";\n"])), function (_ref) {
|
|
2474
|
+
var PrimaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n border-color: ", ";\n pointer-events: ", ";\n"])), function (_ref) {
|
|
2475
|
+
var _theme$colors;
|
|
2476
|
+
|
|
2471
2477
|
var bgColor = _ref.bgColor,
|
|
2472
2478
|
theme = _ref.theme;
|
|
2473
|
-
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
|
|
2479
|
+
return bgColor ? "var(--base-color-" + bgColor + ")" : theme == null ? void 0 : (_theme$colors = theme.colors) == null ? void 0 : _theme$colors.primary;
|
|
2474
2480
|
}, function (_ref2) {
|
|
2481
|
+
var _theme$colors2;
|
|
2482
|
+
|
|
2475
2483
|
var bgColor = _ref2.bgColor,
|
|
2476
2484
|
theme = _ref2.theme;
|
|
2477
|
-
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
|
|
2485
|
+
return bgColor ? "var(--base-color-" + bgColor + ")" : theme == null ? void 0 : (_theme$colors2 = theme.colors) == null ? void 0 : _theme$colors2.primary;
|
|
2486
|
+
}, function (_ref3) {
|
|
2487
|
+
var disabled = _ref3.disabled;
|
|
2488
|
+
return disabled ? 'none' : 'auto';
|
|
2478
2489
|
});
|
|
2479
2490
|
|
|
2480
2491
|
var CarouselType;
|
|
@@ -2532,9 +2543,16 @@ var ButtonType;
|
|
|
2532
2543
|
|
|
2533
2544
|
var PrimaryButton = function PrimaryButton(_ref) {
|
|
2534
2545
|
var children = _ref.children,
|
|
2535
|
-
|
|
2546
|
+
disabled = _ref.disabled,
|
|
2547
|
+
props = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "color", "bgColor"]);
|
|
2536
2548
|
|
|
2537
|
-
return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
|
|
2549
|
+
return disabled ? /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
|
|
2550
|
+
color: Colors.Black,
|
|
2551
|
+
bgColor: Colors.MidGrey,
|
|
2552
|
+
disabled: true,
|
|
2553
|
+
"aria-disabled": "true",
|
|
2554
|
+
role: "button"
|
|
2555
|
+
}, props), children) : /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
|
|
2538
2556
|
color: Colors.White
|
|
2539
2557
|
}, props), children);
|
|
2540
2558
|
};
|
|
@@ -2776,7 +2794,39 @@ var GridItem = /*#__PURE__*/styled.div(_templateObject$a || (_templateObject$a =
|
|
|
2776
2794
|
});
|
|
2777
2795
|
|
|
2778
2796
|
var _templateObject$b;
|
|
2779
|
-
|
|
2797
|
+
/**
|
|
2798
|
+
* # IMPORTANT
|
|
2799
|
+
* Please use the `<GridItem />` component instead of this component if possible.
|
|
2800
|
+
* This component was introduced due to incompatibilities between versions of the Chord library.
|
|
2801
|
+
*/
|
|
2802
|
+
|
|
2803
|
+
var GridItemLegacy = /*#__PURE__*/styled.div(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", " / span\n ", ";\n\n @media ", " {\n & {\n grid-column: ", " /\n span ", ";\n }\n }\n\n @media ", " {\n & {\n grid-column: ", " / span\n ", ";\n }\n }\n"])), function (_ref) {
|
|
2804
|
+
var columnStartDesktop = _ref.columnStartDesktop;
|
|
2805
|
+
return columnStartDesktop;
|
|
2806
|
+
}, function (_ref2) {
|
|
2807
|
+
var _ref2$columnSpanDeskt = _ref2.columnSpanDesktop,
|
|
2808
|
+
columnSpanDesktop = _ref2$columnSpanDeskt === void 0 ? 1 : _ref2$columnSpanDeskt;
|
|
2809
|
+
return columnSpanDesktop;
|
|
2810
|
+
}, devices.mobile, function (_ref3) {
|
|
2811
|
+
var columnStartDevice = _ref3.columnStartDevice,
|
|
2812
|
+
columnStartSmallDevice = _ref3.columnStartSmallDevice;
|
|
2813
|
+
return columnStartSmallDevice != null ? columnStartSmallDevice : columnStartDevice;
|
|
2814
|
+
}, function (_ref4) {
|
|
2815
|
+
var _ref4$columnSpanDevic = _ref4.columnSpanDevice,
|
|
2816
|
+
columnSpanDevice = _ref4$columnSpanDevic === void 0 ? 1 : _ref4$columnSpanDevic,
|
|
2817
|
+
columnSpanSmallDevice = _ref4.columnSpanSmallDevice;
|
|
2818
|
+
return columnSpanSmallDevice != null ? columnSpanSmallDevice : columnSpanDevice;
|
|
2819
|
+
}, devices.tablet, function (_ref5) {
|
|
2820
|
+
var columnStartDevice = _ref5.columnStartDevice;
|
|
2821
|
+
return columnStartDevice;
|
|
2822
|
+
}, function (_ref6) {
|
|
2823
|
+
var _ref6$columnSpanDevic = _ref6.columnSpanDevice,
|
|
2824
|
+
columnSpanDevice = _ref6$columnSpanDevic === void 0 ? 1 : _ref6$columnSpanDevic;
|
|
2825
|
+
return columnSpanDevice;
|
|
2826
|
+
});
|
|
2827
|
+
|
|
2828
|
+
var _templateObject$c;
|
|
2829
|
+
var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
2780
2830
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
2781
2831
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
2782
2832
|
return aspectRatio;
|
|
@@ -2794,8 +2844,8 @@ var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$b || (_tem
|
|
|
2794
2844
|
return aspectRatio;
|
|
2795
2845
|
});
|
|
2796
2846
|
|
|
2797
|
-
var _templateObject$
|
|
2798
|
-
var ProgressView = /*#__PURE__*/styled.div(_templateObject$
|
|
2847
|
+
var _templateObject$d, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5;
|
|
2848
|
+
var ProgressView = /*#__PURE__*/styled.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: ", ";\n width: 100%;\n display: flex;\n flex-direction: row;\n"])), function (_ref) {
|
|
2799
2849
|
var height = _ref.height;
|
|
2800
2850
|
return height ? height + "px" : '6px';
|
|
2801
2851
|
});
|
|
@@ -2878,13 +2928,13 @@ var Progress = function Progress(_ref) {
|
|
|
2878
2928
|
}, renderSteps()));
|
|
2879
2929
|
};
|
|
2880
2930
|
|
|
2881
|
-
var _templateObject$
|
|
2882
|
-
var RadioContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
2931
|
+
var _templateObject$e, _templateObject2$4, _templateObject3$3;
|
|
2932
|
+
var RadioContainer = /*#__PURE__*/styled.div(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"])));
|
|
2883
2933
|
var RadioLine = /*#__PURE__*/styled.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 20px;\n grid-template-columns: 1.15em 1fr;\n user-select: none;\n cursor: pointer;\n color: black;\n\n &:focus {\n outline: none;\n }\n\n input[type='radio'] {\n cursor: pointer;\n appearance: none;\n background-color: #ffffff00;\n margin: 0;\n color: black;\n width: 20px;\n height: 20px;\n border: 1px solid black;\n border-radius: 50%;\n position: relative;\n place-content: center;\n display: block;\n }\n\n input[type='radio']::before {\n content: '';\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background-color: #ffffff00;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n input[type='radio']:checked::before {\n background-color: black;\n }\n"])));
|
|
2884
2934
|
var RadioError = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-errorstate);\n"])));
|
|
2885
2935
|
|
|
2886
|
-
var _templateObject$
|
|
2887
|
-
var Wrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
2936
|
+
var _templateObject$f;
|
|
2937
|
+
var Wrapper$1 = /*#__PURE__*/styled.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-", ");\n font-feature-settings: var(--font-feature-settings-", ");\n font-size: var(--font-size-", "-", ");\n font-weight: var(--font-weight-", "-", ");\n letter-spacing: var(--letter-spacing-", "-", ");\n line-height: var(--line-height-", "-", ");\n text-transform: var(--text-transform-", ");\n word-break: var(--word-break-", ");\n margin: var(--margin-", "-", ");\n"])), function (_ref) {
|
|
2888
2938
|
var typography = _ref.typography;
|
|
2889
2939
|
return typography;
|
|
2890
2940
|
}, function (_ref2) {
|
|
@@ -3041,8 +3091,8 @@ var Radio = function Radio(_ref) {
|
|
|
3041
3091
|
}, error)));
|
|
3042
3092
|
};
|
|
3043
3093
|
|
|
3044
|
-
var _templateObject$
|
|
3045
|
-
var Container = /*#__PURE__*/styled.div(_templateObject$
|
|
3094
|
+
var _templateObject$g, _templateObject2$5, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6;
|
|
3095
|
+
var Container = /*#__PURE__*/styled.div(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3046
3096
|
var Radio$1 = /*#__PURE__*/styled.div(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
3047
3097
|
var error = _ref.error,
|
|
3048
3098
|
darkMode = _ref.darkMode,
|
|
@@ -3150,8 +3200,8 @@ var Radio2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
3150
3200
|
}, error)));
|
|
3151
3201
|
});
|
|
3152
3202
|
|
|
3153
|
-
var _templateObject$
|
|
3154
|
-
var ButtonsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
3203
|
+
var _templateObject$h, _templateObject2$6, _templateObject3$5;
|
|
3204
|
+
var ButtonsContainer = /*#__PURE__*/styled.div(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
|
|
3155
3205
|
var IconWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$6 || (_templateObject2$6 = /*#__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 background-color: var(--base-color-lightgrey);\n color: var(--base-color-black);\n\n svg {\n width: var(--rotator-button-icon-width);\n height: var(--rotator-button-icon-width);\n }\n\n svg path {\n fill: var(--base-color-black);\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n\n @media ", " {\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n\n :hover {\n cursor: default;\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n }\n"])), function (_ref) {
|
|
3156
3206
|
var theme = _ref.theme;
|
|
3157
3207
|
return theme.colors.primary;
|
|
@@ -3222,8 +3272,8 @@ var RotatorButtons = function RotatorButtons(_ref) {
|
|
|
3222
3272
|
}, renderNextIcon()));
|
|
3223
3273
|
};
|
|
3224
3274
|
|
|
3225
|
-
var _templateObject$
|
|
3226
|
-
var SecondaryLogoWrapper = /*#__PURE__*/styled.svg(_templateObject$
|
|
3275
|
+
var _templateObject$i;
|
|
3276
|
+
var SecondaryLogoWrapper = /*#__PURE__*/styled.svg(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n path {\n fill: var(--base-color-", ");\n }\n"])), function (_ref) {
|
|
3227
3277
|
var fillColor = _ref.fillColor;
|
|
3228
3278
|
return fillColor;
|
|
3229
3279
|
});
|
|
@@ -3247,8 +3297,8 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
|
|
|
3247
3297
|
})));
|
|
3248
3298
|
};
|
|
3249
3299
|
|
|
3250
|
-
var _templateObject$
|
|
3251
|
-
var SectionSplitterContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
3300
|
+
var _templateObject$j, _templateObject2$7;
|
|
3301
|
+
var SectionSplitterContainer = /*#__PURE__*/styled(Grid)(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
|
|
3252
3302
|
var Splitter = /*#__PURE__*/styled.div(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--base-color-lightgrey);\n"])));
|
|
3253
3303
|
|
|
3254
3304
|
var SectionSplitter = function SectionSplitter(_ref) {
|
|
@@ -3267,8 +3317,8 @@ var SectionSplitter = function SectionSplitter(_ref) {
|
|
|
3267
3317
|
}, /*#__PURE__*/React__default.createElement(Splitter, null)));
|
|
3268
3318
|
};
|
|
3269
3319
|
|
|
3270
|
-
var _templateObject$
|
|
3271
|
-
var SponsorLogoWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
3320
|
+
var _templateObject$k;
|
|
3321
|
+
var SponsorLogoWrapper = /*#__PURE__*/styled.div(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 172px;\n"])));
|
|
3272
3322
|
|
|
3273
3323
|
var SponsorLogo = function SponsorLogo(_ref) {
|
|
3274
3324
|
var _ref$colorLogo = _ref.colorLogo,
|
|
@@ -3478,8 +3528,8 @@ var SponsorLogo = function SponsorLogo(_ref) {
|
|
|
3478
3528
|
})))));
|
|
3479
3529
|
};
|
|
3480
3530
|
|
|
3481
|
-
var _templateObject$
|
|
3482
|
-
var CustomImage = /*#__PURE__*/styled.img(_templateObject$
|
|
3531
|
+
var _templateObject$l, _templateObject2$8;
|
|
3532
|
+
var CustomImage = /*#__PURE__*/styled.img(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: 100px;\n max-width: auto;\n\n @media ", " {\n max-height: 55px;\n }\n\n @media ", " {\n max-height: 45px;\n }\n"])), devices.tablet, devices.mobile);
|
|
3483
3533
|
var SponsorshipStyledIframe = /*#__PURE__*/styled.div(_templateObject2$8 || (_templateObject2$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: transparent;\n height: 80px;\n margin: 0px;\n overflow: hidden;\n padding: 0;\n width: 80px;\n\n & > iframe {\n border: 0;\n display: block;\n margin: 0px;\n padding: 0px;\n overflow: hidden;\n width: 100%;\n height: 100%;\n }\n\n @media ", " {\n & {\n height: 40px;\n width: 40px;\n }\n & iframe {\n height: 80px;\n transform: scale(0.5) translate(-40px, -40px);\n width: 80px;\n }\n }\n"])), devices.mobile);
|
|
3484
3534
|
|
|
3485
3535
|
var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v4/rolex.html?size=80';
|
|
@@ -3512,8 +3562,8 @@ var Sponsorship = function Sponsorship(_ref) {
|
|
|
3512
3562
|
}));
|
|
3513
3563
|
};
|
|
3514
3564
|
|
|
3515
|
-
var _templateObject$
|
|
3516
|
-
var TabText = /*#__PURE__*/styled.a(_templateObject$
|
|
3565
|
+
var _templateObject$m, _templateObject2$9;
|
|
3566
|
+
var TabText = /*#__PURE__*/styled.a(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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-black);\n margin-right: 0px;\n margin-top: 5px;\n text-decoration: none;\n text-transform: uppercase;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (props) {
|
|
3517
3567
|
if (props.withIcon === 'left') {
|
|
3518
3568
|
return "margin-left: 5px;";
|
|
3519
3569
|
}
|
|
@@ -3612,8 +3662,8 @@ var Tab = function Tab(_ref) {
|
|
|
3612
3662
|
}));
|
|
3613
3663
|
};
|
|
3614
3664
|
|
|
3615
|
-
var _templateObject$
|
|
3616
|
-
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$
|
|
3665
|
+
var _templateObject$n, _templateObject2$a;
|
|
3666
|
+
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-family: var(--font-family-navigation);\n font-size: var(--font-size-navigation);\n font-weight: var(--font-weight-navigation);\n line-height: var(--line-height-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n text-transform: var(--text-transform-navigation);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n ", "\n\n @media ", ", ", " {\n &:hover {\n color: var(--base-color-", ");\n border-bottom: 1px solid var(--base-color-", ");\n\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), function (_ref) {
|
|
3617
3667
|
var iconName = _ref.iconName;
|
|
3618
3668
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
|
|
3619
3669
|
}, function (_ref2) {
|
|
@@ -3664,8 +3714,8 @@ var TabLink = function TabLink(_ref) {
|
|
|
3664
3714
|
})) : null, children);
|
|
3665
3715
|
};
|
|
3666
3716
|
|
|
3667
|
-
var _templateObject$
|
|
3668
|
-
var TextAreaWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
3717
|
+
var _templateObject$o, _templateObject2$b, _templateObject3$6, _templateObject4$3;
|
|
3718
|
+
var TextAreaWrapper = /*#__PURE__*/styled.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n"])), function (_ref) {
|
|
3669
3719
|
var width = _ref.width;
|
|
3670
3720
|
return width ? width + "px;" : '100%;';
|
|
3671
3721
|
}, function (_ref2) {
|
|
@@ -3788,8 +3838,8 @@ var TextArea = function TextArea(_ref) {
|
|
|
3788
3838
|
}, error))));
|
|
3789
3839
|
};
|
|
3790
3840
|
|
|
3791
|
-
var _templateObject$
|
|
3792
|
-
var Container$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
3841
|
+
var _templateObject$p, _templateObject2$c, _templateObject3$7, _templateObject4$4, _templateObject5$2, _templateObject6$1;
|
|
3842
|
+
var Container$1 = /*#__PURE__*/styled.div(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3793
3843
|
var InputWrapper = /*#__PURE__*/styled.div(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n"])), function (_ref) {
|
|
3794
3844
|
var width = _ref.width;
|
|
3795
3845
|
if (!width) return 'none';
|
|
@@ -3915,8 +3965,8 @@ var TextField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
3915
3965
|
}, error)));
|
|
3916
3966
|
});
|
|
3917
3967
|
|
|
3918
|
-
var _templateObject$
|
|
3919
|
-
var TextFieldContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
3968
|
+
var _templateObject$q, _templateObject2$d, _templateObject3$8, _templateObject4$5, _templateObject5$3;
|
|
3969
|
+
var TextFieldContainer = /*#__PURE__*/styled.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3920
3970
|
var textStyles = /*#__PURE__*/css(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n"])), function (_ref) {
|
|
3921
3971
|
var theme = _ref.theme;
|
|
3922
3972
|
return theme.fonts.desktop.weights.body[1];
|
|
@@ -3989,8 +4039,8 @@ var TextFieldLegacy = function TextFieldLegacy(_ref) {
|
|
|
3989
4039
|
}, error) : null);
|
|
3990
4040
|
};
|
|
3991
4041
|
|
|
3992
|
-
var _templateObject$
|
|
3993
|
-
var TextLinkWrapper = /*#__PURE__*/styled.a(_templateObject$
|
|
4042
|
+
var _templateObject$r, _templateObject2$e;
|
|
4043
|
+
var TextLinkWrapper = /*#__PURE__*/styled.a(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
|
|
3994
4044
|
var iconName = _ref.iconName;
|
|
3995
4045
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
|
|
3996
4046
|
}, function (_ref2) {
|
|
@@ -4026,8 +4076,8 @@ var TextLogoProduct;
|
|
|
4026
4076
|
TextLogoProduct["Cinema"] = "CINEMA";
|
|
4027
4077
|
})(TextLogoProduct || (TextLogoProduct = {}));
|
|
4028
4078
|
|
|
4029
|
-
var _templateObject$
|
|
4030
|
-
var TickboxError = /*#__PURE__*/styled.div(_templateObject$
|
|
4079
|
+
var _templateObject$s, _templateObject2$f, _templateObject3$9, _templateObject4$6;
|
|
4080
|
+
var TickboxError = /*#__PURE__*/styled.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
4031
4081
|
var dark = _ref.dark;
|
|
4032
4082
|
return dark ? 'white' : 'errorstate';
|
|
4033
4083
|
});
|
|
@@ -4148,8 +4198,8 @@ var Tickbox = function Tickbox(_ref) {
|
|
|
4148
4198
|
}, error)));
|
|
4149
4199
|
};
|
|
4150
4200
|
|
|
4151
|
-
var _templateObject$
|
|
4152
|
-
var Container$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
4201
|
+
var _templateObject$t, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$2;
|
|
4202
|
+
var Container$2 = /*#__PURE__*/styled.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
4153
4203
|
var Tickbox$1 = /*#__PURE__*/styled.div(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
4154
4204
|
var error = _ref.error,
|
|
4155
4205
|
darkMode = _ref.darkMode,
|
|
@@ -4259,8 +4309,8 @@ var Tickbox2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
4259
4309
|
}, error)));
|
|
4260
4310
|
});
|
|
4261
4311
|
|
|
4262
|
-
var _templateObject$
|
|
4263
|
-
var TimerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
4312
|
+
var _templateObject$u, _templateObject2$h, _templateObject3$b, _templateObject4$8, _templateObject5$5, _templateObject6$3, _templateObject7, _templateObject8;
|
|
4313
|
+
var TimerWrapper = /*#__PURE__*/styled.div(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
4264
4314
|
var color = _ref.color;
|
|
4265
4315
|
return color;
|
|
4266
4316
|
});
|
|
@@ -4368,8 +4418,8 @@ var Timer = function Timer(_ref) {
|
|
|
4368
4418
|
}));
|
|
4369
4419
|
};
|
|
4370
4420
|
|
|
4371
|
-
var _templateObject$
|
|
4372
|
-
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$
|
|
4421
|
+
var _templateObject$v;
|
|
4422
|
+
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n & li {\n display: inline-block;\n margin: 0;\n }\n\n & li:before {\n content: '\u2014';\n margin: 0 0.5em;\n }\n\n & li:first-child:before {\n display: none;\n }\n"])));
|
|
4373
4423
|
|
|
4374
4424
|
var TypeTags = function TypeTags(_ref) {
|
|
4375
4425
|
var list = _ref.list;
|
|
@@ -5111,8 +5161,8 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
|
|
|
5111
5161
|
}
|
|
5112
5162
|
});
|
|
5113
5163
|
|
|
5114
|
-
var _templateObject$
|
|
5115
|
-
var VideoPlayButton = /*#__PURE__*/styled.button(_templateObject$
|
|
5164
|
+
var _templateObject$w, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$6, _templateObject6$4, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10;
|
|
5165
|
+
var VideoPlayButton = /*#__PURE__*/styled.button(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fff;\n border: none;\n padding: 12px;\n cursor: pointer;\n"])));
|
|
5116
5166
|
var VideoFullscreenButton = /*#__PURE__*/styled.button(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 56px;\n height: 36px;\n background-color: rgb(26, 26, 26, 0.6);\n border-radius: 5px;\n padding: 5px 14px;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n"])));
|
|
5117
5167
|
var VideoControlsWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n"])));
|
|
5118
5168
|
var VideoControlsInnerWrapper = /*#__PURE__*/styled.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 40px 17px 30px;\n"])));
|
|
@@ -5331,8 +5381,8 @@ var VideoControls = function VideoControls(_ref2) {
|
|
|
5331
5381
|
})));
|
|
5332
5382
|
};
|
|
5333
5383
|
|
|
5334
|
-
var _templateObject$
|
|
5335
|
-
var StepperWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5384
|
+
var _templateObject$x, _templateObject2$j, _templateObject3$d, _templateObject4$a, _templateObject5$7;
|
|
5385
|
+
var StepperWrapper = /*#__PURE__*/styled.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: left;\n"])));
|
|
5336
5386
|
var StepperError = /*#__PURE__*/styled.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n margin-block: 15px 0;\n\n * {\n margin: 0;\n }\n"])), function (_ref) {
|
|
5337
5387
|
var darkMode = _ref.darkMode;
|
|
5338
5388
|
return darkMode ? 'white' : 'errorstate';
|
|
@@ -5559,8 +5609,8 @@ var Component = function Component(_ref) {
|
|
|
5559
5609
|
}, error)));
|
|
5560
5610
|
};
|
|
5561
5611
|
|
|
5562
|
-
var _templateObject$
|
|
5563
|
-
var NavigationWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5612
|
+
var _templateObject$y, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$8, _templateObject6$5, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11;
|
|
5613
|
+
var NavigationWrapper = /*#__PURE__*/styled.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (_ref) {
|
|
5564
5614
|
var isMenuOpen = _ref.isMenuOpen;
|
|
5565
5615
|
return isMenuOpen && "\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: " + zIndexes.overlay + ";\n background-color: var(--base-color-white);\n overflow-y: auto;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n ";
|
|
5566
5616
|
});
|
|
@@ -5584,8 +5634,8 @@ var NavContainer = /*#__PURE__*/styled.div(_templateObject9$1 || (_templateObjec
|
|
|
5584
5634
|
var NavContainerGridItem = /*#__PURE__*/styled(GridItem)(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
|
|
5585
5635
|
var NavTopContainer = /*#__PURE__*/styled.div(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 26px;\n right: 50px;\n top: 20px;\n position: absolute;\n\n @media ", " {\n margin-top: 1px;\n position: inherit;\n }\n"])), devices.mobileAndTablet);
|
|
5586
5636
|
|
|
5587
|
-
var _templateObject$
|
|
5588
|
-
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5637
|
+
var _templateObject$z;
|
|
5638
|
+
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
|
|
5589
5639
|
|
|
5590
5640
|
var Logo = function Logo(_ref) {
|
|
5591
5641
|
var _ref$id = _ref.id,
|
|
@@ -5617,11 +5667,11 @@ var Logo = function Logo(_ref) {
|
|
|
5617
5667
|
}))));
|
|
5618
5668
|
};
|
|
5619
5669
|
|
|
5620
|
-
var _templateObject$
|
|
5621
|
-
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
5670
|
+
var _templateObject$A;
|
|
5671
|
+
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 26px;\n\n @media ", " {\n column-gap: 8px;\n }\n"])), devices.mobile);
|
|
5622
5672
|
|
|
5623
|
-
var _templateObject$
|
|
5624
|
-
var BasketContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
5673
|
+
var _templateObject$B, _templateObject2$l, _templateObject3$f, _templateObject4$c;
|
|
5674
|
+
var BasketContainer = /*#__PURE__*/styled.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n\n ", "\n"])), function (_ref) {
|
|
5625
5675
|
var selected = _ref.selected,
|
|
5626
5676
|
colorPrimary = _ref.colorPrimary;
|
|
5627
5677
|
|
|
@@ -5809,8 +5859,8 @@ var Basket$1 = function Basket(_ref) {
|
|
|
5809
5859
|
}, expiryTime ? basketText : text) : ''));
|
|
5810
5860
|
};
|
|
5811
5861
|
|
|
5812
|
-
var _templateObject$
|
|
5813
|
-
var SearchContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
5862
|
+
var _templateObject$C, _templateObject2$m;
|
|
5863
|
+
var SearchContainer = /*#__PURE__*/styled.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (_ref) {
|
|
5814
5864
|
var selected = _ref.selected,
|
|
5815
5865
|
colorPrimary = _ref.colorPrimary;
|
|
5816
5866
|
|
|
@@ -6102,8 +6152,8 @@ var NavTop = function NavTop(_ref) {
|
|
|
6102
6152
|
}));
|
|
6103
6153
|
};
|
|
6104
6154
|
|
|
6105
|
-
var _templateObject$
|
|
6106
|
-
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
6155
|
+
var _templateObject$D, _templateObject2$n, _templateObject3$g, _templateObject4$d;
|
|
6156
|
+
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
6107
6157
|
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n\n @media ", " {\n column-gap: 15px;\n }\n\n @media ", ", ", " {\n div:last-child > div {\n right: 1px;\n }\n }\n\n @media ", " {\n ", "\n }\n"])), devices.desktop, devices.desktop, devices.largeDesktop, devices.mobileAndTablet, function (props) {
|
|
6108
6158
|
if (props.showMenu) {
|
|
6109
6159
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
|
|
@@ -6245,8 +6295,8 @@ var Tabs = function Tabs(_ref) {
|
|
|
6245
6295
|
}, "MENU"))));
|
|
6246
6296
|
};
|
|
6247
6297
|
|
|
6248
|
-
var _templateObject$
|
|
6249
|
-
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
6298
|
+
var _templateObject$E, _templateObject2$o, _templateObject3$h, _templateObject5$9, _templateObject6$6, _templateObject7$3;
|
|
6299
|
+
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: var(--base-color-transparent);\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
|
|
6250
6300
|
var SvgContainerSearch = /*#__PURE__*/styled.div(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
6251
6301
|
var SvgContainerClose = /*#__PURE__*/styled.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n :hover {\n cursor: pointer;\n && svg path {\n fill: var(--base-color-navigation);\n }\n }\n"])));
|
|
6252
6302
|
var InputContainer = /*#__PURE__*/styled.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: blue;\n width: 100%;\n\n input {\n font-size: var(--font-size-search);\n font-family: var(--font-family-search);\n border: none;\n border-radius: 0;\n outline: none;\n outline-color: var(--base-color-white);\n height: 48px;\n box-sizing: border-box;\n width: 100%;\n -webkit-appearance: none;\n\n &.search-input {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n @media ", " {\n column-gap: 24px;\n }\n }\n"])), devices.mobile);
|
|
@@ -6483,16 +6533,16 @@ var Navigation = function Navigation(_ref) {
|
|
|
6483
6533
|
})))));
|
|
6484
6534
|
};
|
|
6485
6535
|
|
|
6486
|
-
var _templateObject$
|
|
6487
|
-
var FooterSection = /*#__PURE__*/styled.section(_templateObject$
|
|
6536
|
+
var _templateObject$F, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$a, _templateObject6$7;
|
|
6537
|
+
var FooterSection = /*#__PURE__*/styled.section(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
|
|
6488
6538
|
var FooterContainer = /*#__PURE__*/styled.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-height);\n padding-top: var(--footer-padding-top);\n padding-bottom: var(--footer-padding-bottom);\n display: grid;\n grid-template-rows:\n min-content var(--footer-vertical-spacing-lg) min-content var(--footer-vertical-spacing-lg) min-content var(\n --footer-vertical-spacing-sm\n )\n min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2'\n '.'\n 'row3'\n '.'\n 'row4';\n"])));
|
|
6489
6539
|
var PolicyLinksRow = /*#__PURE__*/styled.div(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row1;\n justify-self: center;\n\n @media ", " {\n & {\n justify-self: start;\n grid-area: row2;\n }\n }\n"])), devices.mobile);
|
|
6490
6540
|
var ContactNewsletterRow = /*#__PURE__*/styled.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row2;\n\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), devices.mobile);
|
|
6491
6541
|
var ArtsLogoRow = /*#__PURE__*/styled.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row3;\n justify-self: center;\n\n @media ", " {\n justify-self: start;\n }\n"])), devices.mobile);
|
|
6492
6542
|
var AdditionalInfo = /*#__PURE__*/styled.p(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row4;\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-3);\n line-height: var(--line-height-body-3);\n text-align: center;\n margin: 0;\n padding: 0;\n\n @media ", " {\n text-align: left;\n }\n"])), devices.mobile);
|
|
6493
6543
|
|
|
6494
|
-
var _templateObject$
|
|
6495
|
-
var PolicyLinksList = /*#__PURE__*/styled.ul(_templateObject$
|
|
6544
|
+
var _templateObject$G, _templateObject2$q, _templateObject3$j;
|
|
6545
|
+
var PolicyLinksList = /*#__PURE__*/styled.ul(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 auto;\n padding: 0;\n list-style: none;\n display: flex;\n gap: var(--footer-items-gap);\n\n @media ", " {\n & {\n margin: 0;\n flex-direction: column;\n }\n }\n"])), devices.mobile);
|
|
6496
6546
|
var PolicyLinkItem = /*#__PURE__*/styled.li(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n text-align: center;\n\n @media ", " {\n & {\n text-align: left;\n }\n }\n"])), devices.mobile);
|
|
6497
6547
|
var PolicyLink = /*#__PURE__*/styled.a(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: fit-content;\n text-decoration: none;\n text-transform: uppercase;\n color: var(--base-color-white);\n cursor: pointer;\n"])));
|
|
6498
6548
|
|
|
@@ -6510,8 +6560,8 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
6510
6560
|
}));
|
|
6511
6561
|
};
|
|
6512
6562
|
|
|
6513
|
-
var _templateObject$
|
|
6514
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6563
|
+
var _templateObject$H, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$4, _templateObject8$3;
|
|
6564
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
6515
6565
|
var ContactNewsletterSeparator = /*#__PURE__*/styled.div(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2;\n justify-self: center;\n height: 100%;\n border: 1px solid var(--base-color-white);\n\n @media ", " {\n & {\n grid-column: auto;\n display: none;\n }\n }\n"])), devices.mobile);
|
|
6516
6566
|
var SignUpWrapper = /*#__PURE__*/styled.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n padding-top: 9px;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
6517
6567
|
var SignUpText = /*#__PURE__*/styled.p(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-2);\n line-height: var(--line-height-body-2);\n width: 60%;\n margin: 0 auto;\n height: 60px;\n text-align: center;\n\n @media ", " {\n & {\n width: 100%;\n height: auto;\n text-align: left;\n font-size: 14px;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
@@ -6582,9 +6632,9 @@ var Footer = function Footer(_ref) {
|
|
|
6582
6632
|
}, additionalInfo)))));
|
|
6583
6633
|
};
|
|
6584
6634
|
|
|
6585
|
-
var _templateObject$
|
|
6635
|
+
var _templateObject$I, _templateObject2$s, _templateObject3$l, _templateObject4$g, _templateObject5$c, _templateObject6$9;
|
|
6586
6636
|
var LIST_ITEM_GAP = 32;
|
|
6587
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6637
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
6588
6638
|
var bottomBorder = _ref.bottomBorder;
|
|
6589
6639
|
return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
|
|
6590
6640
|
}, zIndexes.anchor);
|
|
@@ -6848,8 +6898,8 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6848
6898
|
})) : null) : null))));
|
|
6849
6899
|
};
|
|
6850
6900
|
|
|
6851
|
-
var _templateObject$
|
|
6852
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6901
|
+
var _templateObject$J, _templateObject2$t, _templateObject3$m, _templateObject4$h, _templateObject6$a, _templateObject7$5, _templateObject8$4, _templateObject9$2, _templateObject10$2;
|
|
6902
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
6853
6903
|
var sticky = _ref.sticky;
|
|
6854
6904
|
return sticky ? 'sticky' : 'initial';
|
|
6855
6905
|
}, zIndexes.anchor);
|
|
@@ -6909,8 +6959,8 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
6909
6959
|
}, message)));
|
|
6910
6960
|
};
|
|
6911
6961
|
|
|
6912
|
-
var _templateObject$
|
|
6913
|
-
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
6962
|
+
var _templateObject$K, _templateObject2$u, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$6, _templateObject8$5;
|
|
6963
|
+
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-lightgrey);\n padding: 40px;\n\n display: block;\n position: relative;\n\n @media ", " {\n margin-top: 0;\n padding: 40px 20px;\n }\n"])), devices.tablet);
|
|
6914
6964
|
var PromoLabelWrapper = /*#__PURE__*/styled.div(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-self: flex-end;\n height: 15px;\n"])));
|
|
6915
6965
|
var PromoLabel = /*#__PURE__*/styled.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n color: ", ";\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n font-family: var(--font-family-header);\n font-feature-settings: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n font-size: var(--font-size-overline-2);\n line-height: 12px;\n text-align: center;\n letter-spacing: 1px;\n text-transform: uppercase;\n"])), function (_ref) {
|
|
6916
6966
|
var theme = _ref.theme;
|
|
@@ -6990,8 +7040,8 @@ var UpsellCard = function UpsellCard(_ref) {
|
|
|
6990
7040
|
}), link && /*#__PURE__*/React__default.createElement(ButtonContainer, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, link), truncate(link.text, LENGTH_SMALL_TEXT)))));
|
|
6991
7041
|
};
|
|
6992
7042
|
|
|
6993
|
-
var _templateObject$
|
|
6994
|
-
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
7043
|
+
var _templateObject$L;
|
|
7044
|
+
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 75px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n padding-left: 0;\n padding-right: 0;\n }\n\n @media ", " {\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.tablet, devices.mobile);
|
|
6995
7045
|
|
|
6996
7046
|
var UpsellCards = function UpsellCards(_ref) {
|
|
6997
7047
|
var upsellCards = _ref.upsellCards;
|
|
@@ -7009,20 +7059,27 @@ var UpsellCards = function UpsellCards(_ref) {
|
|
|
7009
7059
|
}));
|
|
7010
7060
|
};
|
|
7011
7061
|
|
|
7012
|
-
var _templateObject$
|
|
7013
|
-
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$
|
|
7062
|
+
var _templateObject$M, _templateObject2$v, _templateObject3$o;
|
|
7063
|
+
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: ", ";\n padding: 80px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding-top: 2.5em;\n padding-left: 0;\n padding-right: 0;\n padding-bottom: 2.5em;\n }\n }\n\n @media ", " {\n & {\n padding: 25px;\n padding-top: 2.5em;\n }\n }\n"])), function (_ref) {
|
|
7014
7064
|
var theme = _ref.theme;
|
|
7015
7065
|
return theme.colors.primary;
|
|
7016
7066
|
}, devices.mobile, devices.tablet);
|
|
7017
7067
|
var TitleContainer$2 = /*#__PURE__*/styled.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n }\n"])), devices.mobile);
|
|
7018
7068
|
var TextContainer = /*#__PURE__*/styled.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 2.5em;\n div > :first-child {\n margin-top: 1.5em;\n }\n\n @media ", " {\n margin-top: 0;\n div > :first-child {\n margin-top: 0.5em;\n }\n }\n\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n & {\n div > :first-child {\n margin-top: 1em;\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7019
7069
|
|
|
7020
|
-
var _templateObject$
|
|
7021
|
-
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7070
|
+
var _templateObject$N, _templateObject2$w, _templateObject3$p, _templateObject4$j, _templateObject5$e, _templateObject6$c;
|
|
7071
|
+
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
|
|
7022
7072
|
var LineContainer = /*#__PURE__*/styled.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
|
|
7023
|
-
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])),
|
|
7073
|
+
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n visibility: ", ";\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref) {
|
|
7074
|
+
var isVisible = _ref.isVisible;
|
|
7075
|
+
return isVisible ? 'visible' : 'hidden';
|
|
7076
|
+
}, devices.mobile);
|
|
7024
7077
|
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
|
|
7025
|
-
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])),
|
|
7078
|
+
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n max-height: ", ";\n\n @media print {\n max-height: max-content;\n }\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref2) {
|
|
7079
|
+
var textHeight = _ref2.textHeight;
|
|
7080
|
+
return textHeight;
|
|
7081
|
+
}, devices.mobile);
|
|
7082
|
+
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
|
|
7026
7083
|
|
|
7027
7084
|
var Accordion = function Accordion(_ref) {
|
|
7028
7085
|
var _ref$title = _ref.title,
|
|
@@ -7053,11 +7110,7 @@ var Accordion = function Accordion(_ref) {
|
|
|
7053
7110
|
setIconName = _useState3[1]; // Contents children visibility is set to prevent it from being keyboard tabbable when the accordion is closed
|
|
7054
7111
|
|
|
7055
7112
|
|
|
7056
|
-
var _useState4 = useState(initOpen
|
|
7057
|
-
visibility: 'visible'
|
|
7058
|
-
} : {
|
|
7059
|
-
visibility: 'hidden'
|
|
7060
|
-
}),
|
|
7113
|
+
var _useState4 = useState(initOpen),
|
|
7061
7114
|
childrenVisibility = _useState4[0],
|
|
7062
7115
|
setChildrenVisibility = _useState4[1];
|
|
7063
7116
|
|
|
@@ -7073,11 +7126,7 @@ var Accordion = function Accordion(_ref) {
|
|
|
7073
7126
|
setOpenAccordion(!openAccordion);
|
|
7074
7127
|
setTextHeight(openAccordion ? '0px' : content.current.scrollHeight + "px");
|
|
7075
7128
|
setIconName(openAccordion ? 'Expand' : 'Detract');
|
|
7076
|
-
setChildrenVisibility(openAccordion
|
|
7077
|
-
visibility: 'hidden'
|
|
7078
|
-
} : {
|
|
7079
|
-
visibility: 'visible'
|
|
7080
|
-
});
|
|
7129
|
+
setChildrenVisibility(!openAccordion);
|
|
7081
7130
|
};
|
|
7082
7131
|
|
|
7083
7132
|
var keyDown = function keyDown(e) {
|
|
@@ -7087,7 +7136,9 @@ var Accordion = function Accordion(_ref) {
|
|
|
7087
7136
|
};
|
|
7088
7137
|
|
|
7089
7138
|
var Standfirst = function Standfirst() {
|
|
7090
|
-
return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer,
|
|
7139
|
+
return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
|
|
7140
|
+
isVisible: childrenVisibility
|
|
7141
|
+
}, visibleStandfirst)) : null;
|
|
7091
7142
|
};
|
|
7092
7143
|
|
|
7093
7144
|
var contentContainerId = title + "-accordion-content";
|
|
@@ -7132,23 +7183,21 @@ var Accordion = function Accordion(_ref) {
|
|
|
7132
7183
|
}, /*#__PURE__*/React__default.createElement(AccordionTitle, {
|
|
7133
7184
|
level: displayLevel,
|
|
7134
7185
|
semanticLevel: semanticLevel
|
|
7135
|
-
}, title), children && /*#__PURE__*/React__default.createElement(Icon, {
|
|
7186
|
+
}, title), children && /*#__PURE__*/React__default.createElement(PrintHideWrapper, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
7136
7187
|
iconName: iconName
|
|
7137
|
-
})), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
|
|
7188
|
+
}))), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
|
|
7138
7189
|
"data-testid": "richcontainer",
|
|
7139
7190
|
ref: content,
|
|
7140
|
-
|
|
7141
|
-
maxHeight: "" + textHeight
|
|
7142
|
-
},
|
|
7191
|
+
textHeight: textHeight,
|
|
7143
7192
|
id: contentContainerId,
|
|
7144
7193
|
"aria-live": "polite"
|
|
7145
7194
|
}, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
|
|
7146
|
-
|
|
7195
|
+
isVisible: childrenVisibility
|
|
7147
7196
|
}, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
|
|
7148
7197
|
};
|
|
7149
7198
|
|
|
7150
|
-
var _templateObject$
|
|
7151
|
-
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7199
|
+
var _templateObject$O;
|
|
7200
|
+
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
7152
7201
|
|
|
7153
7202
|
var Accordions = function Accordions(_ref) {
|
|
7154
7203
|
var _ref$items = _ref.items,
|
|
@@ -7166,7 +7215,8 @@ var Accordions = function Accordions(_ref) {
|
|
|
7166
7215
|
visibleStandfirst: accordion.visibleStandfirst,
|
|
7167
7216
|
contentType: accordion.contentType,
|
|
7168
7217
|
displayLevel: accordion.displayLevel,
|
|
7169
|
-
semanticLevel: accordion.semanticLevel
|
|
7218
|
+
semanticLevel: accordion.semanticLevel,
|
|
7219
|
+
initOpen: accordion.initOpen
|
|
7170
7220
|
}, accordion.children);
|
|
7171
7221
|
}));
|
|
7172
7222
|
};
|
|
@@ -7180,8 +7230,8 @@ var Theme = function Theme(_ref) {
|
|
|
7180
7230
|
}, children);
|
|
7181
7231
|
};
|
|
7182
7232
|
|
|
7183
|
-
var _templateObject$
|
|
7184
|
-
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7233
|
+
var _templateObject$P, _templateObject2$x, _templateObject3$q;
|
|
7234
|
+
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: ", ";\n color: var(--base-color-white);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), function (_ref) {
|
|
7185
7235
|
var theme = _ref.theme;
|
|
7186
7236
|
return theme.colors.primary;
|
|
7187
7237
|
}, devices.mobile);
|
|
@@ -7223,8 +7273,8 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
|
7223
7273
|
}))))));
|
|
7224
7274
|
};
|
|
7225
7275
|
|
|
7226
|
-
var _templateObject$
|
|
7227
|
-
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$
|
|
7276
|
+
var _templateObject$Q;
|
|
7277
|
+
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n font-family: var(--font-family-buttons);\n font-size: var(--button-font-size);\n font-weight: var(--button-font-weight);\n color: var(--base-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 .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), function (_ref) {
|
|
7228
7278
|
var bgColor = _ref.bgColor,
|
|
7229
7279
|
theme = _ref.theme;
|
|
7230
7280
|
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.auxiliaryButton;
|
|
@@ -7245,11 +7295,11 @@ var AuxiliaryButton = function AuxiliaryButton(_ref) {
|
|
|
7245
7295
|
}), children);
|
|
7246
7296
|
};
|
|
7247
7297
|
|
|
7248
|
-
var _templateObject$
|
|
7298
|
+
var _templateObject$R, _templateObject2$y, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$d, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
|
|
7249
7299
|
var LENGTH_LARGE_TEXT = 28;
|
|
7250
7300
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
7251
7301
|
var LENGTH_TEXT_TABLET = 10;
|
|
7252
|
-
var CardContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7302
|
+
var CardContainer = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
|
|
7253
7303
|
var isCardClickable = _ref.isCardClickable;
|
|
7254
7304
|
return isCardClickable ? 'pointer' : 'default';
|
|
7255
7305
|
}, function (_ref2) {
|
|
@@ -7271,7 +7321,7 @@ var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject4$k || (_templat
|
|
|
7271
7321
|
return fullWidth ? '0' : '20px';
|
|
7272
7322
|
});
|
|
7273
7323
|
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
7274
|
-
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$
|
|
7324
|
+
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobileAndTablet);
|
|
7275
7325
|
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin-top: var(--editorial-spacing-hover);\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
7276
7326
|
var HighlightTextContainer = /*#__PURE__*/styled(TextContainer$1)(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-primary);\n margin-top: 4px;\n"])));
|
|
7277
7327
|
var SubtitleContainer = /*#__PURE__*/styled.span(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
@@ -7531,9 +7581,9 @@ var Card = function Card(_ref) {
|
|
|
7531
7581
|
dangerouslySetInnerHTML: {
|
|
7532
7582
|
__html: truncatedText
|
|
7533
7583
|
}
|
|
7534
|
-
}), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
7584
|
+
}))), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
7535
7585
|
level: 1
|
|
7536
|
-
}, highlightText))
|
|
7586
|
+
}, highlightText)), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
|
|
7537
7587
|
fullWidth: fullWidth
|
|
7538
7588
|
}, /*#__PURE__*/React__default.createElement(AuxiliaryButton, Object.assign({}, auxiliaryCTA), auxiliaryCTA.text)), links && /*#__PURE__*/React__default.createElement(ButtonsContainer$1, {
|
|
7539
7589
|
ref: node,
|
|
@@ -7547,8 +7597,8 @@ var Card = function Card(_ref) {
|
|
|
7547
7597
|
}, firstButton && /*#__PURE__*/React__default.createElement(FirstButtonComponent, Object.assign({}, restFirstButton), primaryButtonTextTruncate), secondButton && /*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), tertiaryButtonTextTruncate)));
|
|
7548
7598
|
};
|
|
7549
7599
|
|
|
7550
|
-
var _templateObject$
|
|
7551
|
-
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
7600
|
+
var _templateObject$S, _templateObject2$z;
|
|
7601
|
+
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
|
|
7552
7602
|
var GridItemContainer = /*#__PURE__*/styled(GridItem)(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 1 / span 14;\n }\n"])), devices.mobile);
|
|
7553
7603
|
|
|
7554
7604
|
var Cards = function Cards(_ref) {
|
|
@@ -7594,8 +7644,8 @@ var Cards = function Cards(_ref) {
|
|
|
7594
7644
|
}));
|
|
7595
7645
|
};
|
|
7596
7646
|
|
|
7597
|
-
var _templateObject$
|
|
7598
|
-
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7647
|
+
var _templateObject$T, _templateObject2$A, _templateObject3$s, _templateObject4$l, _templateObject5$g;
|
|
7648
|
+
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
|
|
7599
7649
|
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n padding: 30px 0;\n\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), function (_ref) {
|
|
7600
7650
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
7601
7651
|
return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-midgrey)') + ";";
|
|
@@ -7663,8 +7713,8 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
7663
7713
|
}, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString)))))));
|
|
7664
7714
|
};
|
|
7665
7715
|
|
|
7666
|
-
var _templateObject$
|
|
7667
|
-
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$
|
|
7716
|
+
var _templateObject$U, _templateObject2$B, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$e, _templateObject7$8;
|
|
7717
|
+
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
7668
7718
|
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$B || (_templateObject2$B = /*#__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) {
|
|
7669
7719
|
return props.clickable ? 'pointer' : 'default';
|
|
7670
7720
|
}, devices.mobile);
|
|
@@ -7673,7 +7723,7 @@ var ContentSummaryTextWrapper = /*#__PURE__*/styled.div(_templateObject4$m || (_
|
|
|
7673
7723
|
return props.showImage ? 2 : '1 / span 4';
|
|
7674
7724
|
}, devices.mobile);
|
|
7675
7725
|
var ContentSummaryTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
|
|
7676
|
-
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject6$
|
|
7726
|
+
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
7677
7727
|
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
|
|
7678
7728
|
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 ";
|
|
7679
7729
|
});
|
|
@@ -7746,8 +7796,8 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
7746
7796
|
}), link.text)));
|
|
7747
7797
|
};
|
|
7748
7798
|
|
|
7749
|
-
var _templateObject$
|
|
7750
|
-
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$
|
|
7799
|
+
var _templateObject$V, _templateObject2$C, _templateObject3$u, _templateObject4$n, _templateObject5$i;
|
|
7800
|
+
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
|
|
7751
7801
|
var imageToLeft = _ref.imageToLeft;
|
|
7752
7802
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
7753
7803
|
}, devices.mobile);
|
|
@@ -7824,8 +7874,8 @@ var BackgroundColour;
|
|
|
7824
7874
|
BackgroundColour["White"] = "white";
|
|
7825
7875
|
})(BackgroundColour || (BackgroundColour = {}));
|
|
7826
7876
|
|
|
7827
|
-
var _templateObject$
|
|
7828
|
-
var InfoContent = /*#__PURE__*/styled('div')(_templateObject$
|
|
7877
|
+
var _templateObject$W, _templateObject2$D, _templateObject3$v, _templateObject4$o;
|
|
7878
|
+
var InfoContent = /*#__PURE__*/styled('div')(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
|
|
7829
7879
|
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
7830
7880
|
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 32px 0;\n\n ", "}\n"])), function (props) {
|
|
7831
7881
|
if (!props.infoThemed) {
|
|
@@ -7951,8 +8001,8 @@ var Information = function Information(_ref) {
|
|
|
7951
8001
|
}))));
|
|
7952
8002
|
};
|
|
7953
8003
|
|
|
7954
|
-
var _templateObject$
|
|
7955
|
-
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8004
|
+
var _templateObject$X, _templateObject2$E, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$f, _templateObject7$9, _templateObject8$7;
|
|
8005
|
+
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n // remove spacing above/below for all semantic levels of the title\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
7956
8006
|
var theme = _ref.theme;
|
|
7957
8007
|
return theme.colors.primary;
|
|
7958
8008
|
}, function (_ref2) {
|
|
@@ -7969,7 +8019,7 @@ var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$p || (_templateOb
|
|
|
7969
8019
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
7970
8020
|
}, devices.mobile);
|
|
7971
8021
|
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
7972
|
-
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$
|
|
8022
|
+
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
7973
8023
|
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
|
|
7974
8024
|
var PageHeadingText = /*#__PURE__*/styled.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
|
|
7975
8025
|
|
|
@@ -8052,13 +8102,13 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
8052
8102
|
})));
|
|
8053
8103
|
};
|
|
8054
8104
|
|
|
8055
|
-
var _templateObject$
|
|
8056
|
-
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8105
|
+
var _templateObject$Y, _templateObject2$F, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$g, _templateObject7$a, _templateObject8$8;
|
|
8106
|
+
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__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);
|
|
8057
8107
|
var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$F || (_templateObject2$F = /*#__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);
|
|
8058
8108
|
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
8059
8109
|
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
8060
8110
|
var LogoWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
8061
|
-
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$
|
|
8111
|
+
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
8062
8112
|
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
8063
8113
|
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
8064
8114
|
|
|
@@ -8126,8 +8176,8 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
8126
8176
|
}, "Scroll Down")) : null);
|
|
8127
8177
|
};
|
|
8128
8178
|
|
|
8129
|
-
var _templateObject$
|
|
8130
|
-
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8179
|
+
var _templateObject$Z, _templateObject2$G, _templateObject3$y, _templateObject4$r, _templateObject5$l;
|
|
8180
|
+
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
|
|
8131
8181
|
var color = _ref.color;
|
|
8132
8182
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
8133
8183
|
}, devices.mobileAndTablet);
|
|
@@ -8171,8 +8221,8 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
8171
8221
|
}))));
|
|
8172
8222
|
};
|
|
8173
8223
|
|
|
8174
|
-
var _templateObject$
|
|
8175
|
-
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8224
|
+
var _templateObject$_;
|
|
8225
|
+
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
8176
8226
|
|
|
8177
8227
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
8178
8228
|
var link = _ref.link,
|
|
@@ -8192,12 +8242,12 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
8192
8242
|
}))));
|
|
8193
8243
|
};
|
|
8194
8244
|
|
|
8195
|
-
var _templateObject
|
|
8196
|
-
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject
|
|
8245
|
+
var _templateObject$$, _templateObject2$H, _templateObject3$z, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
|
|
8246
|
+
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
|
|
8197
8247
|
var BrandingTextBody = /*#__PURE__*/styled.p(_templateObject2$H || (_templateObject2$H = /*#__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"])));
|
|
8198
8248
|
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
8199
8249
|
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
|
|
8200
|
-
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$
|
|
8250
|
+
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
|
|
8201
8251
|
var invert = _ref.invert,
|
|
8202
8252
|
theme = _ref.theme;
|
|
8203
8253
|
return invert ? theme.colors.white : theme.colors.primary;
|
|
@@ -8319,7 +8369,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
|
|
|
8319
8369
|
var isIOS = function isIOS() {
|
|
8320
8370
|
try {
|
|
8321
8371
|
console.warn('Do not use this on server side rendering, it may throw an error.');
|
|
8322
|
-
if (typeof navigator === undefined) return false;
|
|
8372
|
+
if (typeof navigator === 'undefined') return false;
|
|
8323
8373
|
return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || // iPad on iOS 13 detection
|
|
8324
8374
|
navigator.userAgent.includes('Mac') && 'ontouchend' in document;
|
|
8325
8375
|
} catch (e) {
|
|
@@ -8335,7 +8385,7 @@ var useIOS = function useIOS() {
|
|
|
8335
8385
|
setIOS = _useState[1];
|
|
8336
8386
|
|
|
8337
8387
|
useEffect(function () {
|
|
8338
|
-
if (typeof navigator === undefined) return;
|
|
8388
|
+
if (typeof navigator === 'undefined') return;
|
|
8339
8389
|
setIOS(isIOS());
|
|
8340
8390
|
}, []);
|
|
8341
8391
|
return IOS;
|
|
@@ -8521,8 +8571,8 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8521
8571
|
}), linkText))));
|
|
8522
8572
|
};
|
|
8523
8573
|
|
|
8524
|
-
var _templateObject
|
|
8525
|
-
var MorePages = /*#__PURE__*/styled.span(_templateObject
|
|
8574
|
+
var _templateObject$10, _templateObject2$I, _templateObject3$A, _templateObject4$s;
|
|
8575
|
+
var MorePages = /*#__PURE__*/styled.span(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
|
|
8526
8576
|
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject2$I || (_templateObject2$I = /*#__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"]))); // PageNumber extends bodyText but uses subtitle-1 font size
|
|
8527
8577
|
|
|
8528
8578
|
var PageNumber = /*#__PURE__*/styled.a(_templateObject3$A || (_templateObject3$A = /*#__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) {
|
|
@@ -8598,13 +8648,13 @@ var Pagination = function Pagination(_ref) {
|
|
|
8598
8648
|
}))));
|
|
8599
8649
|
};
|
|
8600
8650
|
|
|
8601
|
-
var _templateObject$
|
|
8602
|
-
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8651
|
+
var _templateObject$11, _templateObject2$J, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$i;
|
|
8652
|
+
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$11 || (_templateObject$11 = /*#__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);
|
|
8603
8653
|
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
8604
8654
|
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
8605
8655
|
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
8606
|
-
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n"])));
|
|
8607
|
-
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$
|
|
8656
|
+
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
8657
|
+
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
|
|
8608
8658
|
|
|
8609
8659
|
var Person = function Person(_ref) {
|
|
8610
8660
|
var person = _ref.person,
|
|
@@ -8655,11 +8705,11 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
8655
8705
|
}));
|
|
8656
8706
|
};
|
|
8657
8707
|
|
|
8658
|
-
var _templateObject$
|
|
8659
|
-
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8708
|
+
var _templateObject$12, _templateObject2$K, _templateObject3$C, _templateObject4$u;
|
|
8709
|
+
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
8660
8710
|
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n"])));
|
|
8661
|
-
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height:
|
|
8662
|
-
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n
|
|
8711
|
+
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 1.5;\n margin-bottom: 4px;\n }\n"])));
|
|
8712
|
+
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
|
|
8663
8713
|
|
|
8664
8714
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
8665
8715
|
return array.reduce(function (acc, item) {
|
|
@@ -8670,12 +8720,18 @@ var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop)
|
|
|
8670
8720
|
var concatenateMusicTitle = function concatenateMusicTitle(musicTitle) {
|
|
8671
8721
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, musicTitle.map(function (title, index) {
|
|
8672
8722
|
if (musicTitle.length > 1 && index === musicTitle.length - 1) {
|
|
8673
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i",
|
|
8723
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", {
|
|
8724
|
+
key: index
|
|
8725
|
+
}, title));
|
|
8674
8726
|
} else if (index > 0) {
|
|
8675
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
8727
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
8728
|
+
key: index
|
|
8729
|
+
}, ", ", title);
|
|
8676
8730
|
}
|
|
8677
8731
|
|
|
8678
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
8732
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
8733
|
+
key: index
|
|
8734
|
+
}, title);
|
|
8679
8735
|
}));
|
|
8680
8736
|
};
|
|
8681
8737
|
|
|
@@ -8727,14 +8783,14 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
8727
8783
|
}));
|
|
8728
8784
|
};
|
|
8729
8785
|
|
|
8730
|
-
var _templateObject$
|
|
8786
|
+
var _templateObject$13, _templateObject2$L, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$j, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
8731
8787
|
var LENGTH_TEXT = 28;
|
|
8732
8788
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
8733
8789
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
8734
8790
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
8735
8791
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
8736
8792
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
8737
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8793
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
|
|
8738
8794
|
var imageToLeft = _ref.imageToLeft;
|
|
8739
8795
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
8740
8796
|
}, devices.tablet, function (_ref2) {
|
|
@@ -8787,7 +8843,7 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$o || (_te
|
|
|
8787
8843
|
var marginBottom = _ref10.marginBottom;
|
|
8788
8844
|
return marginBottom + "px";
|
|
8789
8845
|
});
|
|
8790
|
-
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject6$
|
|
8846
|
+
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
8791
8847
|
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
8792
8848
|
var TextLinkWrapper$2 = /*#__PURE__*/styled.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
8793
8849
|
var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
@@ -9005,10 +9061,10 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9005
9061
|
}))));
|
|
9006
9062
|
};
|
|
9007
9063
|
|
|
9008
|
-
var _templateObject$
|
|
9064
|
+
var _templateObject$14, _templateObject2$M, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$k, _templateObject7$d;
|
|
9009
9065
|
var LENGTH_TEXT$2 = 28;
|
|
9010
9066
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
9011
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9067
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$14 || (_templateObject$14 = /*#__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) {
|
|
9012
9068
|
var imageToLeft = _ref.imageToLeft;
|
|
9013
9069
|
return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
|
|
9014
9070
|
}, devices.tablet, function (_ref2) {
|
|
@@ -9025,7 +9081,7 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$E ||
|
|
|
9025
9081
|
}, devices.mobile);
|
|
9026
9082
|
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 32px;\n\n @media ", " {\n & {\n margin: 0 0 24px;\n }\n }\n }\n"])), devices.mobile);
|
|
9027
9083
|
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
9028
|
-
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$
|
|
9084
|
+
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
|
|
9029
9085
|
var theme = _ref5.theme;
|
|
9030
9086
|
return theme.colors.black;
|
|
9031
9087
|
}, function (_ref6) {
|
|
@@ -9061,8 +9117,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$d || (_templat
|
|
|
9061
9117
|
return '';
|
|
9062
9118
|
});
|
|
9063
9119
|
|
|
9064
|
-
var _templateObject$
|
|
9065
|
-
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9120
|
+
var _templateObject$15;
|
|
9121
|
+
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
9066
9122
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
9067
9123
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
9068
9124
|
return aspectRatio;
|
|
@@ -9266,8 +9322,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9266
9322
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
9267
9323
|
};
|
|
9268
9324
|
|
|
9269
|
-
var _templateObject$
|
|
9270
|
-
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9325
|
+
var _templateObject$16;
|
|
9326
|
+
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
|
|
9271
9327
|
|
|
9272
9328
|
/**
|
|
9273
9329
|
* DEPRECATED. Use RadioGroup2 instead
|
|
@@ -9325,8 +9381,8 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
9325
9381
|
})));
|
|
9326
9382
|
};
|
|
9327
9383
|
|
|
9328
|
-
var _templateObject$
|
|
9329
|
-
var Container$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
9384
|
+
var _templateObject$17, _templateObject2$N, _templateObject3$F;
|
|
9385
|
+
var Container$3 = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9330
9386
|
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
9331
9387
|
var horizontalMode = _ref.horizontalMode;
|
|
9332
9388
|
if (horizontalMode) return 'row';
|
|
@@ -9415,8 +9471,8 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
9415
9471
|
}, error)));
|
|
9416
9472
|
};
|
|
9417
9473
|
|
|
9418
|
-
var _templateObject$
|
|
9419
|
-
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9474
|
+
var _templateObject$18, _templateObject2$O, _templateObject3$G;
|
|
9475
|
+
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
9420
9476
|
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\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"])));
|
|
9421
9477
|
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
|
|
9422
9478
|
|
|
@@ -9480,8 +9536,8 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
9480
9536
|
})))));
|
|
9481
9537
|
};
|
|
9482
9538
|
|
|
9483
|
-
var _templateObject$
|
|
9484
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9539
|
+
var _templateObject$19;
|
|
9540
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n font-size: var(--font-size-title-description);\n line-height: var(--line-height-title-description);\n margin-block-start: 0;\n }\n"])), devices.mobile);
|
|
9485
9541
|
|
|
9486
9542
|
var SectionTitle = function SectionTitle(_ref) {
|
|
9487
9543
|
var title = _ref.title,
|
|
@@ -9509,8 +9565,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
9509
9565
|
}, description))));
|
|
9510
9566
|
};
|
|
9511
9567
|
|
|
9512
|
-
var _templateObject$
|
|
9513
|
-
var stateStyles = /*#__PURE__*/css(_templateObject$
|
|
9568
|
+
var _templateObject$1a, _templateObject2$P, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$l, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
|
|
9569
|
+
var stateStyles = /*#__PURE__*/css(_templateObject$1a || (_templateObject$1a = /*#__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) {
|
|
9514
9570
|
var theme = _ref.theme;
|
|
9515
9571
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
9516
9572
|
}, function (_ref2) {
|
|
@@ -9534,7 +9590,7 @@ var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
|
|
|
9534
9590
|
title: 'Select Arrow'
|
|
9535
9591
|
};
|
|
9536
9592
|
})(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
|
|
9537
|
-
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject6$
|
|
9593
|
+
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
9538
9594
|
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
9539
9595
|
var Options = /*#__PURE__*/styled.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
9540
9596
|
var Option = /*#__PURE__*/styled.li(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
|
|
@@ -9932,8 +9988,8 @@ function Select(_ref3) {
|
|
|
9932
9988
|
}))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
9933
9989
|
}
|
|
9934
9990
|
|
|
9935
|
-
var _templateObject$
|
|
9936
|
-
var Container$4 = /*#__PURE__*/styled.div(_templateObject$
|
|
9991
|
+
var _templateObject$1b, _templateObject2$Q, _templateObject3$I, _templateObject4$y;
|
|
9992
|
+
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
9937
9993
|
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .chord-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .chord-select__control--is-focused {\n border-color: var(--base-color-darkgrey);\n box-shadow: ", ";\n }\n .chord-select__control--menu-is-open {\n .chord-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .chord-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .chord-select__single-value,\n .chord-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n }\n .chord-select__placeholder {\n color: var(--base-color-darkgrey);\n }\n .chord-select__single-value {\n color: var(--base-color-black);\n }\n .chord-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .chord-select--is-disabled {\n .chord-select__control {\n border: 1px solid var(--base-color-lightgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__indicator,\n .chord-select__single-value {\n color: var(--base-color-darkgrey);\n }\n }\n .chord-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-darkgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .chord-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.chord-select__option--is-focused {\n background: var(--base-color-midgrey);\n }\n }\n .chord-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .chord-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .chord-select__menu-notice {\n padding: 20px 20px;\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-align: left;\n }\n .chord-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
9938
9994
|
var width = _ref.width;
|
|
9939
9995
|
if (!width) return 'none';
|
|
@@ -10072,8 +10128,8 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10072
10128
|
})));
|
|
10073
10129
|
};
|
|
10074
10130
|
|
|
10075
|
-
var _templateObject$
|
|
10076
|
-
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
10131
|
+
var _templateObject$1c;
|
|
10132
|
+
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__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 text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
10077
10133
|
var theme = _ref.theme;
|
|
10078
10134
|
return theme.colors.primary;
|
|
10079
10135
|
});
|
|
@@ -10101,8 +10157,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
10101
10157
|
})));
|
|
10102
10158
|
};
|
|
10103
10159
|
|
|
10104
|
-
var _templateObject$
|
|
10105
|
-
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$
|
|
10160
|
+
var _templateObject$1d, _templateObject2$R;
|
|
10161
|
+
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
|
|
10106
10162
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
10107
10163
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
10108
10164
|
return aspectRatio;
|
|
@@ -10150,8 +10206,8 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
10150
10206
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
10151
10207
|
};
|
|
10152
10208
|
|
|
10153
|
-
var _templateObject$
|
|
10154
|
-
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
10209
|
+
var _templateObject$1e, _templateObject2$S, _templateObject3$J;
|
|
10210
|
+
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
10155
10211
|
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
10156
10212
|
var displayAttribution = _ref.displayAttribution;
|
|
10157
10213
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
@@ -10180,13 +10236,13 @@ var Quote = function Quote(_ref) {
|
|
|
10180
10236
|
}, attribution))));
|
|
10181
10237
|
};
|
|
10182
10238
|
|
|
10183
|
-
var _templateObject$
|
|
10184
|
-
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
10239
|
+
var _templateObject$1f, _templateObject2$T, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$m;
|
|
10240
|
+
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
|
|
10185
10241
|
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
10186
10242
|
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
10187
10243
|
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
10188
10244
|
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
10189
|
-
var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$
|
|
10245
|
+
var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
|
|
10190
10246
|
|
|
10191
10247
|
var MiniCard = function MiniCard(_ref) {
|
|
10192
10248
|
var _ref$title = _ref.title,
|
|
@@ -10224,11 +10280,18 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
10224
10280
|
}, title)))));
|
|
10225
10281
|
};
|
|
10226
10282
|
|
|
10227
|
-
var _templateObject$
|
|
10228
|
-
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10229
|
-
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
10230
|
-
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose([""])))
|
|
10231
|
-
var
|
|
10283
|
+
var _templateObject$1g, _templateObject2$U, _templateObject3$L, _templateObject4$A, _templateObject5$s;
|
|
10284
|
+
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1g || (_templateObject$1g = /*#__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"])));
|
|
10285
|
+
var LinkContainer = /*#__PURE__*/styled.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"])));
|
|
10286
|
+
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
10287
|
+
var isVisible = _ref.isVisible;
|
|
10288
|
+
return isVisible ? 'visible' : 'hidden';
|
|
10289
|
+
});
|
|
10290
|
+
var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
|
|
10291
|
+
var isVisible = _ref2.isVisible;
|
|
10292
|
+
return isVisible ? 'visible' : 'hidden';
|
|
10293
|
+
});
|
|
10294
|
+
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n\n"])));
|
|
10232
10295
|
|
|
10233
10296
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
10234
10297
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -10256,14 +10319,6 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10256
10319
|
textHeight = _useState2[0],
|
|
10257
10320
|
setTextHeight = _useState2[1];
|
|
10258
10321
|
|
|
10259
|
-
var _useState3 = useState(initOpen ? {
|
|
10260
|
-
visibility: 'visible'
|
|
10261
|
-
} : {
|
|
10262
|
-
visibility: 'hidden'
|
|
10263
|
-
}),
|
|
10264
|
-
textVisibility = _useState3[0],
|
|
10265
|
-
setTextVisibility = _useState3[1];
|
|
10266
|
-
|
|
10267
10322
|
var readMoreContent = useRef(null);
|
|
10268
10323
|
useEffect(function () {
|
|
10269
10324
|
if (readMoreContent != null && readMoreContent.current && initOpen) {
|
|
@@ -10276,11 +10331,6 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10276
10331
|
if (typeof fullText === 'string' && fullText.length === 0) return;
|
|
10277
10332
|
setIsFullTextOpen(!isFullTextOpen);
|
|
10278
10333
|
setTextHeight(isFullTextOpen ? '0px' : readMoreContent.current.scrollHeight + "px");
|
|
10279
|
-
setTextVisibility(isFullTextOpen ? {
|
|
10280
|
-
visibility: 'hidden'
|
|
10281
|
-
} : {
|
|
10282
|
-
visibility: 'visible'
|
|
10283
|
-
});
|
|
10284
10334
|
};
|
|
10285
10335
|
|
|
10286
10336
|
var handleKeyDown = function handleKeyDown(e) {
|
|
@@ -10291,7 +10341,9 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10291
10341
|
var truncatedText = truncate ? truncateReactNodeString(introText != null ? introText : '', INTRO_CHAR_LIMIT, true) : introText;
|
|
10292
10342
|
|
|
10293
10343
|
var IntroText = function IntroText() {
|
|
10294
|
-
return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$5, null, /*#__PURE__*/React__default.createElement(
|
|
10344
|
+
return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$5, null, /*#__PURE__*/React__default.createElement(IntroTextContainer, {
|
|
10345
|
+
isVisible: !isFullTextOpen
|
|
10346
|
+
}, truncate ? /*#__PURE__*/React__default.createElement("div", {
|
|
10295
10347
|
dangerouslySetInnerHTML: {
|
|
10296
10348
|
__html: "" + truncatedText
|
|
10297
10349
|
}
|
|
@@ -10318,7 +10370,7 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10318
10370
|
maxHeight: "" + textHeight
|
|
10319
10371
|
}
|
|
10320
10372
|
}, /*#__PURE__*/React__default.createElement(FullTextContainer, {
|
|
10321
|
-
|
|
10373
|
+
isVisible: isFullTextOpen
|
|
10322
10374
|
}, fullText)), /*#__PURE__*/React__default.createElement(LinkContainer, null, (fullText || isFullTextOpen) && /*#__PURE__*/React__default.createElement(TextLink, {
|
|
10323
10375
|
tabIndex: 0,
|
|
10324
10376
|
role: "button",
|
|
@@ -10326,15 +10378,113 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10326
10378
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText)));
|
|
10327
10379
|
};
|
|
10328
10380
|
|
|
10329
|
-
var _templateObject$
|
|
10330
|
-
var
|
|
10331
|
-
var
|
|
10332
|
-
var
|
|
10333
|
-
var
|
|
10381
|
+
var _templateObject$1h, _templateObject2$V, _templateObject3$M, _templateObject4$B, _templateObject5$t, _templateObject6$n;
|
|
10382
|
+
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
10383
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
10384
|
+
var Section = /*#__PURE__*/styled.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10385
|
+
var color = _ref.color;
|
|
10386
|
+
return "var(--base-color-" + color + ")";
|
|
10387
|
+
});
|
|
10388
|
+
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
10389
|
+
var Text = /*#__PURE__*/styled.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10390
|
+
var color = _ref2.color;
|
|
10391
|
+
return "var(--base-color-" + color + ")";
|
|
10392
|
+
});
|
|
10393
|
+
var LabelText = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
10394
|
+
var color = _ref3.color;
|
|
10395
|
+
return "var(--base-color-" + color + ")";
|
|
10396
|
+
});
|
|
10397
|
+
|
|
10398
|
+
/**
|
|
10399
|
+
* Password strength indicator component.
|
|
10400
|
+
* This renders some number of lines (6 by default)
|
|
10401
|
+
* which should become active when the user improves
|
|
10402
|
+
* the strength of the entered password.
|
|
10403
|
+
*
|
|
10404
|
+
* ## Sections
|
|
10405
|
+
* To set number of sections it should be passed
|
|
10406
|
+
* as `sections` prop.
|
|
10407
|
+
*
|
|
10408
|
+
* ## Active section
|
|
10409
|
+
* To set number of active sections it should be passed
|
|
10410
|
+
* as `activeSections` prop.
|
|
10411
|
+
*
|
|
10412
|
+
* ## Colors
|
|
10413
|
+
* Color of every element can be controlled by properties:
|
|
10414
|
+
* `sectionsColor`, `activeSectionsColor`,
|
|
10415
|
+
* `textColor`, `strengthLabelColor`.
|
|
10416
|
+
*
|
|
10417
|
+
* ## Text
|
|
10418
|
+
* `text` prop is used to render some message.
|
|
10419
|
+
* For example error (together with proper red color)
|
|
10420
|
+
* or some password requirement. It can be empty.
|
|
10421
|
+
*
|
|
10422
|
+
* ## Strength label
|
|
10423
|
+
* `strengthLabel` prop is used to render strength characteristic
|
|
10424
|
+
* of entered password. For example: `weak`, `normal`, `strong`, etc.
|
|
10425
|
+
* It can be empty.
|
|
10426
|
+
*/
|
|
10427
|
+
|
|
10428
|
+
var PasswordStrength = function PasswordStrength(_ref) {
|
|
10429
|
+
var _ref$sections = _ref.sections,
|
|
10430
|
+
sections = _ref$sections === void 0 ? 6 : _ref$sections,
|
|
10431
|
+
_ref$activeSections = _ref.activeSections,
|
|
10432
|
+
activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
|
|
10433
|
+
_ref$sectionsColor = _ref.sectionsColor,
|
|
10434
|
+
sectionsColor = _ref$sectionsColor === void 0 ? Colors.MidGrey : _ref$sectionsColor,
|
|
10435
|
+
_ref$activeSectionsCo = _ref.activeSectionsColor,
|
|
10436
|
+
activeSectionsColor = _ref$activeSectionsCo === void 0 ? Colors.Black : _ref$activeSectionsCo,
|
|
10437
|
+
_ref$text = _ref.text,
|
|
10438
|
+
text = _ref$text === void 0 ? '' : _ref$text,
|
|
10439
|
+
_ref$textColor = _ref.textColor,
|
|
10440
|
+
textColor = _ref$textColor === void 0 ? Colors.Black : _ref$textColor,
|
|
10441
|
+
_ref$strengthLabel = _ref.strengthLabel,
|
|
10442
|
+
strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
|
|
10443
|
+
_ref$strengthLabelCol = _ref.strengthLabelColor,
|
|
10444
|
+
strengthLabelColor = _ref$strengthLabelCol === void 0 ? Colors.Black : _ref$strengthLabelCol;
|
|
10445
|
+
|
|
10446
|
+
var setSectionColor = function setSectionColor(index) {
|
|
10447
|
+
return index < activeSections ? activeSectionsColor : sectionsColor;
|
|
10448
|
+
};
|
|
10449
|
+
|
|
10450
|
+
var setSectionDataTestId = function setSectionDataTestId(index) {
|
|
10451
|
+
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
10452
|
+
};
|
|
10453
|
+
|
|
10454
|
+
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
10455
|
+
"data-testid": "password-strength-container"
|
|
10456
|
+
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
10457
|
+
"data-testid": "password-strength-sections"
|
|
10458
|
+
}, Array.from({
|
|
10459
|
+
length: sections
|
|
10460
|
+
}, function (_section, i) {
|
|
10461
|
+
return /*#__PURE__*/React__default.createElement(Section, {
|
|
10462
|
+
key: i,
|
|
10463
|
+
color: setSectionColor(i),
|
|
10464
|
+
"data-testid": setSectionDataTestId(i)
|
|
10465
|
+
});
|
|
10466
|
+
})), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
|
|
10467
|
+
color: textColor,
|
|
10468
|
+
"data-testid": "password-strength-text"
|
|
10469
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
10470
|
+
level: 6
|
|
10471
|
+
}, text)), /*#__PURE__*/React__default.createElement(LabelText, {
|
|
10472
|
+
color: strengthLabelColor,
|
|
10473
|
+
"data-testid": "password-strength-label"
|
|
10474
|
+
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10475
|
+
level: 2
|
|
10476
|
+
}, strengthLabel))));
|
|
10477
|
+
};
|
|
10478
|
+
|
|
10479
|
+
var _templateObject$1i, _templateObject2$W, _templateObject3$N, _templateObject4$C, _templateObject5$u;
|
|
10480
|
+
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
10481
|
+
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), Colors.LightGrey);
|
|
10482
|
+
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$N || (_templateObject3$N = /*#__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"])), Colors.Black, Colors.White, Colors.DarkGrey);
|
|
10483
|
+
var MenuItem$1 = /*#__PURE__*/styled.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"])), Colors.Black, function (_ref) {
|
|
10334
10484
|
var isActive = _ref.isActive;
|
|
10335
10485
|
return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
|
|
10336
10486
|
}, Colors.MidGrey);
|
|
10337
|
-
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$
|
|
10487
|
+
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$u || (_templateObject5$u = /*#__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) {
|
|
10338
10488
|
var isOpen = _ref2.isOpen;
|
|
10339
10489
|
return isOpen ? 'block' : 'none';
|
|
10340
10490
|
}, Colors.White, Colors.DarkGrey, MenuItem$1);
|
|
@@ -10504,124 +10654,80 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
10504
10654
|
});
|
|
10505
10655
|
};
|
|
10506
10656
|
|
|
10507
|
-
var _templateObject$
|
|
10508
|
-
var
|
|
10509
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
10510
|
-
var Section = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10511
|
-
var color = _ref.color;
|
|
10512
|
-
return "var(--base-color-" + color + ")";
|
|
10513
|
-
});
|
|
10514
|
-
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
10515
|
-
var Text = /*#__PURE__*/styled.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10516
|
-
var color = _ref2.color;
|
|
10517
|
-
return "var(--base-color-" + color + ")";
|
|
10518
|
-
});
|
|
10519
|
-
var LabelText = /*#__PURE__*/styled.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
10520
|
-
var color = _ref3.color;
|
|
10521
|
-
return "var(--base-color-" + color + ")";
|
|
10522
|
-
});
|
|
10523
|
-
|
|
10524
|
-
/**
|
|
10525
|
-
* Password strength indicator component.
|
|
10526
|
-
* This renders some number of lines (6 by default)
|
|
10527
|
-
* which should become active when the user improves
|
|
10528
|
-
* the strength of the entered password.
|
|
10529
|
-
*
|
|
10530
|
-
* ## Sections
|
|
10531
|
-
* To set number of sections it should be passed
|
|
10532
|
-
* as `sections` prop.
|
|
10533
|
-
*
|
|
10534
|
-
* ## Active section
|
|
10535
|
-
* To set number of active sections it should be passed
|
|
10536
|
-
* as `activeSections` prop.
|
|
10537
|
-
*
|
|
10538
|
-
* ## Colors
|
|
10539
|
-
* Color of every element can be controlled by properties:
|
|
10540
|
-
* `sectionsColor`, `activeSectionsColor`,
|
|
10541
|
-
* `textColor`, `strengthLabelColor`.
|
|
10542
|
-
*
|
|
10543
|
-
* ## Text
|
|
10544
|
-
* `text` prop is used to render some message.
|
|
10545
|
-
* For example error (together with proper red color)
|
|
10546
|
-
* or some password requirement. It can be empty.
|
|
10547
|
-
*
|
|
10548
|
-
* ## Strength label
|
|
10549
|
-
* `strengthLabel` prop is used to render strength characteristic
|
|
10550
|
-
* of entered password. For example: `weak`, `normal`, `strong`, etc.
|
|
10551
|
-
* It can be empty.
|
|
10552
|
-
*/
|
|
10553
|
-
|
|
10554
|
-
var PasswordStrength = function PasswordStrength(_ref) {
|
|
10555
|
-
var _ref$sections = _ref.sections,
|
|
10556
|
-
sections = _ref$sections === void 0 ? 6 : _ref$sections,
|
|
10557
|
-
_ref$activeSections = _ref.activeSections,
|
|
10558
|
-
activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
|
|
10559
|
-
_ref$sectionsColor = _ref.sectionsColor,
|
|
10560
|
-
sectionsColor = _ref$sectionsColor === void 0 ? Colors.MidGrey : _ref$sectionsColor,
|
|
10561
|
-
_ref$activeSectionsCo = _ref.activeSectionsColor,
|
|
10562
|
-
activeSectionsColor = _ref$activeSectionsCo === void 0 ? Colors.Black : _ref$activeSectionsCo,
|
|
10563
|
-
_ref$text = _ref.text,
|
|
10564
|
-
text = _ref$text === void 0 ? '' : _ref$text,
|
|
10565
|
-
_ref$textColor = _ref.textColor,
|
|
10566
|
-
textColor = _ref$textColor === void 0 ? Colors.Black : _ref$textColor,
|
|
10567
|
-
_ref$strengthLabel = _ref.strengthLabel,
|
|
10568
|
-
strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
|
|
10569
|
-
_ref$strengthLabelCol = _ref.strengthLabelColor,
|
|
10570
|
-
strengthLabelColor = _ref$strengthLabelCol === void 0 ? Colors.Black : _ref$strengthLabelCol;
|
|
10571
|
-
|
|
10572
|
-
var setSectionColor = function setSectionColor(index) {
|
|
10573
|
-
return index < activeSections ? activeSectionsColor : sectionsColor;
|
|
10574
|
-
};
|
|
10575
|
-
|
|
10576
|
-
var setSectionDataTestId = function setSectionDataTestId(index) {
|
|
10577
|
-
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
10578
|
-
};
|
|
10579
|
-
|
|
10580
|
-
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
10581
|
-
"data-testid": "password-strength-container"
|
|
10582
|
-
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
10583
|
-
"data-testid": "password-strength-sections"
|
|
10584
|
-
}, Array.from({
|
|
10585
|
-
length: sections
|
|
10586
|
-
}, function (_section, i) {
|
|
10587
|
-
return /*#__PURE__*/React__default.createElement(Section, {
|
|
10588
|
-
key: i,
|
|
10589
|
-
color: setSectionColor(i),
|
|
10590
|
-
"data-testid": setSectionDataTestId(i)
|
|
10591
|
-
});
|
|
10592
|
-
})), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
|
|
10593
|
-
color: textColor,
|
|
10594
|
-
"data-testid": "password-strength-text"
|
|
10595
|
-
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
10596
|
-
level: 6
|
|
10597
|
-
}, text)), /*#__PURE__*/React__default.createElement(LabelText, {
|
|
10598
|
-
color: strengthLabelColor,
|
|
10599
|
-
"data-testid": "password-strength-label"
|
|
10600
|
-
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10601
|
-
level: 2
|
|
10602
|
-
}, strengthLabel))));
|
|
10603
|
-
};
|
|
10604
|
-
|
|
10605
|
-
var _templateObject$1i, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$u, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
|
|
10606
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
10657
|
+
var _templateObject$1j, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$v, _templateObject6$o, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
|
|
10658
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
10607
10659
|
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
10608
10660
|
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
10609
|
-
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\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 padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
10661
|
+
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\n border-bottom: 1px solid;\n border-top: 1px solid;\n border-color: ", ";\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 padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
10662
|
+
return "var(--base-color-" + props.lineColor + ")";
|
|
10663
|
+
}, function (props) {
|
|
10610
10664
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10611
10665
|
}, devices.tablet, devices.mobile);
|
|
10612
|
-
var TableCell = /*#__PURE__*/styled.td(_templateObject5$
|
|
10666
|
+
var TableCell = /*#__PURE__*/styled.td(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
|
|
10667
|
+
return "var(--base-color-" + props.lineColor + ")";
|
|
10668
|
+
}, function (props) {
|
|
10613
10669
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10614
10670
|
}, devices.mobile);
|
|
10615
|
-
var
|
|
10616
|
-
|
|
10617
|
-
});
|
|
10618
|
-
var Pagination$1 = /*#__PURE__*/styled.div(_templateObject7$f || (_templateObject7$f = /*#__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"])));
|
|
10619
|
-
var PageNumber$1 = /*#__PURE__*/styled.button(_templateObject8$c || (_templateObject8$c = /*#__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) {
|
|
10671
|
+
var Pagination$1 = /*#__PURE__*/styled.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
|
|
10672
|
+
var PageNumber$1 = /*#__PURE__*/styled.button(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
|
|
10620
10673
|
var active = _ref.active;
|
|
10621
10674
|
return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";
|
|
10622
10675
|
});
|
|
10623
|
-
var Next = /*#__PURE__*/styled.span(
|
|
10624
|
-
var ScrollButtons = /*#__PURE__*/styled.div(
|
|
10676
|
+
var Next = /*#__PURE__*/styled.span(_templateObject8$c || (_templateObject8$c = /*#__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"])));
|
|
10677
|
+
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 0 0 24px 0;\n\n div:hover {\n background-color: var(--base-color-light-grey);\n }\n\n > div > div {\n background-color: var(--base-color-light-grey);\n }\n\n svg path {\n fill: var(--base-color-black) !important;\n }\n"])));
|
|
10678
|
+
var AriaDescription = /*#__PURE__*/styled.span(_templateObject10$7 || (_templateObject10$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
10679
|
+
|
|
10680
|
+
var Content = function Content(_ref) {
|
|
10681
|
+
var content = _ref.content;
|
|
10682
|
+
return typeof content === 'string' ? /*#__PURE__*/React__default.createElement("div", {
|
|
10683
|
+
dangerouslySetInnerHTML: {
|
|
10684
|
+
__html: content
|
|
10685
|
+
}
|
|
10686
|
+
}) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, content);
|
|
10687
|
+
};
|
|
10688
|
+
var scrollTable = function scrollTable(tableRef, direction) {
|
|
10689
|
+
if (tableRef.current) {
|
|
10690
|
+
var currentScroll = tableRef.current.scrollLeft;
|
|
10691
|
+
var scrollAmount = direction === 'left' ? -300 : 300;
|
|
10692
|
+
tableRef.current.scrollTo({
|
|
10693
|
+
left: currentScroll + scrollAmount,
|
|
10694
|
+
behavior: 'smooth'
|
|
10695
|
+
});
|
|
10696
|
+
}
|
|
10697
|
+
};
|
|
10698
|
+
|
|
10699
|
+
var Cell = function Cell(_ref) {
|
|
10700
|
+
var cell = _ref.cell,
|
|
10701
|
+
cellIndex = _ref.cellIndex,
|
|
10702
|
+
columns = _ref.columns,
|
|
10703
|
+
lineColor = _ref.lineColor;
|
|
10704
|
+
return /*#__PURE__*/React__default.createElement(TableCell, {
|
|
10705
|
+
key: cellIndex,
|
|
10706
|
+
columns: columns,
|
|
10707
|
+
role: "gridcell",
|
|
10708
|
+
lineColor: lineColor
|
|
10709
|
+
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
10710
|
+
content: cell
|
|
10711
|
+
}));
|
|
10712
|
+
};
|
|
10713
|
+
|
|
10714
|
+
var Row = function Row(_ref) {
|
|
10715
|
+
var row = _ref.row,
|
|
10716
|
+
rowIndex = _ref.rowIndex,
|
|
10717
|
+
columns = _ref.columns,
|
|
10718
|
+
lineColor = _ref.lineColor;
|
|
10719
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
|
|
10720
|
+
key: rowIndex
|
|
10721
|
+
}, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
|
|
10722
|
+
return /*#__PURE__*/React__default.createElement(Cell, {
|
|
10723
|
+
key: index,
|
|
10724
|
+
cell: cell,
|
|
10725
|
+
cellIndex: index,
|
|
10726
|
+
columns: columns,
|
|
10727
|
+
lineColor: lineColor
|
|
10728
|
+
});
|
|
10729
|
+
})));
|
|
10730
|
+
};
|
|
10625
10731
|
|
|
10626
10732
|
var Table = function Table(_ref) {
|
|
10627
10733
|
var columns = _ref.columns,
|
|
@@ -10629,7 +10735,8 @@ var Table = function Table(_ref) {
|
|
|
10629
10735
|
children = _ref.children,
|
|
10630
10736
|
lineColors = _ref.lineColors,
|
|
10631
10737
|
rowsPerPage = _ref.rowsPerPage,
|
|
10632
|
-
pagination = _ref.pagination
|
|
10738
|
+
pagination = _ref.pagination,
|
|
10739
|
+
description = _ref.description;
|
|
10633
10740
|
|
|
10634
10741
|
var _useState = useState(0),
|
|
10635
10742
|
currentPage = _useState[0],
|
|
@@ -10639,121 +10746,63 @@ var Table = function Table(_ref) {
|
|
|
10639
10746
|
showScrollButtons = _useState2[0],
|
|
10640
10747
|
setShowScrollButtons = _useState2[1];
|
|
10641
10748
|
|
|
10642
|
-
var Content = function Content(_ref2) {
|
|
10643
|
-
var content = _ref2.content;
|
|
10644
|
-
return typeof content === 'string' ? /*#__PURE__*/React__default.createElement("div", {
|
|
10645
|
-
dangerouslySetInnerHTML: {
|
|
10646
|
-
__html: content
|
|
10647
|
-
}
|
|
10648
|
-
}) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, content);
|
|
10649
|
-
};
|
|
10650
|
-
|
|
10651
|
-
var Cell = function Cell(_ref3) {
|
|
10652
|
-
var cell = _ref3.cell,
|
|
10653
|
-
cellIndex = _ref3.cellIndex,
|
|
10654
|
-
columns = _ref3.columns;
|
|
10655
|
-
return /*#__PURE__*/React__default.createElement(TableCell, {
|
|
10656
|
-
key: cellIndex,
|
|
10657
|
-
columns: columns
|
|
10658
|
-
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
10659
|
-
content: cell
|
|
10660
|
-
}));
|
|
10661
|
-
};
|
|
10662
|
-
|
|
10663
|
-
var Row = function Row(_ref4) {
|
|
10664
|
-
var row = _ref4.row,
|
|
10665
|
-
rowIndex = _ref4.rowIndex,
|
|
10666
|
-
columns = _ref4.columns,
|
|
10667
|
-
lineColor = _ref4.lineColor;
|
|
10668
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
|
|
10669
|
-
key: rowIndex
|
|
10670
|
-
}, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
|
|
10671
|
-
return /*#__PURE__*/React__default.createElement(Cell, {
|
|
10672
|
-
key: index,
|
|
10673
|
-
cell: cell,
|
|
10674
|
-
cellIndex: index,
|
|
10675
|
-
columns: columns
|
|
10676
|
-
});
|
|
10677
|
-
})), /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
|
|
10678
|
-
colSpan: columns
|
|
10679
|
-
}, /*#__PURE__*/React__default.createElement(LineContainer$1, {
|
|
10680
|
-
lineColor: lineColor,
|
|
10681
|
-
role: "presentation"
|
|
10682
|
-
}))));
|
|
10683
|
-
};
|
|
10684
|
-
|
|
10685
10749
|
var lineColor = lineColors != null ? lineColors : Colors.Cinema;
|
|
10686
10750
|
var tableRef = useRef(null);
|
|
10687
|
-
|
|
10688
|
-
|
|
10689
|
-
tableRef.current
|
|
10690
|
-
|
|
10691
|
-
|
|
10692
|
-
|
|
10693
|
-
var horizontalScroll = function horizontalScroll() {
|
|
10694
|
-
if (tableRef.current) {
|
|
10695
|
-
setShowScrollButtons(tableRef.current.scrollWidth > tableRef.current.clientWidth);
|
|
10696
|
-
}
|
|
10697
|
-
};
|
|
10751
|
+
useLayoutEffect(function () {
|
|
10752
|
+
var horizontalScroll = function horizontalScroll() {
|
|
10753
|
+
if (tableRef.current) {
|
|
10754
|
+
setShowScrollButtons(tableRef.current.scrollWidth > tableRef.current.clientWidth);
|
|
10755
|
+
}
|
|
10756
|
+
};
|
|
10698
10757
|
|
|
10699
|
-
useEffect(function () {
|
|
10700
10758
|
horizontalScroll();
|
|
10701
10759
|
window.addEventListener('resize', horizontalScroll);
|
|
10702
10760
|
return function () {
|
|
10703
10761
|
return window.removeEventListener('resize', horizontalScroll);
|
|
10704
10762
|
};
|
|
10705
10763
|
}, []);
|
|
10706
|
-
|
|
10707
|
-
var scrollTable = function scrollTable(direction) {
|
|
10708
|
-
if (tableRef.current) {
|
|
10709
|
-
var currentScroll = tableRef.current.scrollLeft;
|
|
10710
|
-
var scrollAmount = direction === 'left' ? -300 : 300;
|
|
10711
|
-
tableRef.current.scrollTo({
|
|
10712
|
-
left: currentScroll + scrollAmount,
|
|
10713
|
-
behavior: 'smooth'
|
|
10714
|
-
});
|
|
10715
|
-
}
|
|
10716
|
-
};
|
|
10717
|
-
|
|
10718
|
-
var totalRows = Array.isArray(children) ? children.length : 0;
|
|
10764
|
+
var totalRows = Array.isArray(children) ? children.length + 1 : 1;
|
|
10719
10765
|
var totalPages = pagination ? Math.ceil(totalRows / rowsPerPage) : 1;
|
|
10720
|
-
var currentRows = pagination ? Array.isArray(children) ? children.slice(currentPage * rowsPerPage, (currentPage + 1) * rowsPerPage) : [] : children;
|
|
10721
10766
|
var pageNumbers = Array.from({
|
|
10722
10767
|
length: totalPages
|
|
10723
10768
|
}, function (_, i) {
|
|
10724
10769
|
return i;
|
|
10725
10770
|
});
|
|
10726
10771
|
var reducedPageNumbers = reducePages(pageNumbers, currentPage);
|
|
10772
|
+
var currentRows = pagination ? Array.isArray(children) ? children.slice(currentPage * rowsPerPage, (currentPage + 1) * rowsPerPage) : [] : children;
|
|
10773
|
+
var visibleRows = pagination ? Array.isArray(currentRows) ? currentRows.length + 1 : 0 : totalRows;
|
|
10727
10774
|
return /*#__PURE__*/React__default.createElement(Wrapper$7, null, showScrollButtons && /*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
10728
10775
|
onClickPrev: function onClickPrev() {
|
|
10729
|
-
return scrollTable('left');
|
|
10776
|
+
return scrollTable(tableRef, 'left');
|
|
10730
10777
|
},
|
|
10731
10778
|
onClickNext: function onClickNext() {
|
|
10732
|
-
return scrollTable('right');
|
|
10779
|
+
return scrollTable(tableRef, 'right');
|
|
10733
10780
|
}
|
|
10734
10781
|
})), /*#__PURE__*/React__default.createElement(Container$6, {
|
|
10735
10782
|
role: "table",
|
|
10736
10783
|
tabIndex: 0,
|
|
10737
|
-
ref: tableRef
|
|
10738
|
-
|
|
10739
|
-
|
|
10740
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10741
|
-
|
|
10742
|
-
|
|
10743
|
-
|
|
10784
|
+
ref: tableRef,
|
|
10785
|
+
"aria-rowcount": totalRows,
|
|
10786
|
+
"aria-colcount": columns
|
|
10787
|
+
}, /*#__PURE__*/React__default.createElement(AriaDescription, {
|
|
10788
|
+
id: "table-description"
|
|
10789
|
+
}, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement("thead", {
|
|
10790
|
+
role: "rowgroup"
|
|
10791
|
+
}, ' ', /*#__PURE__*/React__default.createElement("tr", {
|
|
10792
|
+
role: "columnheader"
|
|
10793
|
+
}, headings && headings.map(function (heading, index) {
|
|
10744
10794
|
return /*#__PURE__*/React__default.createElement(TableHeader, {
|
|
10745
10795
|
key: index,
|
|
10746
10796
|
role: "columnheader",
|
|
10747
|
-
|
|
10797
|
+
scope: "col",
|
|
10798
|
+
columns: columns,
|
|
10799
|
+
lineColor: lineColor
|
|
10748
10800
|
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
10749
10801
|
content: heading
|
|
10750
10802
|
}));
|
|
10751
|
-
}))), /*#__PURE__*/React__default.createElement("
|
|
10752
|
-
|
|
10753
|
-
},
|
|
10754
|
-
lineColor: lineColor,
|
|
10755
|
-
role: "presentation"
|
|
10756
|
-
}))), /*#__PURE__*/React__default.createElement("tbody", null, Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
|
|
10803
|
+
}))), /*#__PURE__*/React__default.createElement("tbody", {
|
|
10804
|
+
role: "rowgroup"
|
|
10805
|
+
}, ' ', Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
|
|
10757
10806
|
return /*#__PURE__*/React__default.createElement(Row, {
|
|
10758
10807
|
key: rowIndex,
|
|
10759
10808
|
row: row,
|
|
@@ -10761,7 +10810,9 @@ var Table = function Table(_ref) {
|
|
|
10761
10810
|
columns: columns,
|
|
10762
10811
|
lineColor: lineColor
|
|
10763
10812
|
});
|
|
10764
|
-
}))), pagination && totalPages > 1 && /*#__PURE__*/React__default.createElement(
|
|
10813
|
+
}))), pagination && totalPages > 1 && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription, {
|
|
10814
|
+
id: "pagination-description"
|
|
10815
|
+
}, "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, {
|
|
10765
10816
|
key: "previous-page",
|
|
10766
10817
|
onClick: function onClick() {
|
|
10767
10818
|
return setCurrentPage(currentPage - 1);
|
|
@@ -10796,7 +10847,7 @@ var Table = function Table(_ref) {
|
|
|
10796
10847
|
}, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
10797
10848
|
iconName: "DropdownArrow",
|
|
10798
10849
|
direction: "up"
|
|
10799
|
-
})))))));
|
|
10850
|
+
}))))))));
|
|
10800
10851
|
};
|
|
10801
10852
|
|
|
10802
10853
|
var UpsellSection = function UpsellSection(_ref) {
|
|
@@ -10887,8 +10938,8 @@ var LiveChat = function LiveChat() {
|
|
|
10887
10938
|
});
|
|
10888
10939
|
};
|
|
10889
10940
|
|
|
10890
|
-
var _templateObject$
|
|
10891
|
-
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
10941
|
+
var _templateObject$1k, _templateObject2$Y;
|
|
10942
|
+
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
10892
10943
|
var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
|
|
10893
10944
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
10894
10945
|
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
|
|
@@ -10917,8 +10968,8 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
10917
10968
|
}, children)));
|
|
10918
10969
|
};
|
|
10919
10970
|
|
|
10920
|
-
var _templateObject$
|
|
10921
|
-
var InnerModal = /*#__PURE__*/styled.div(_templateObject$
|
|
10971
|
+
var _templateObject$1l, _templateObject2$Z, _templateObject3$P, _templateObject4$E;
|
|
10972
|
+
var InnerModal = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__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);
|
|
10922
10973
|
var CloseButton = /*#__PURE__*/styled.button(_templateObject2$Z || (_templateObject2$Z = /*#__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);
|
|
10923
10974
|
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10924
10975
|
var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$E || (_templateObject4$E = /*#__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"])));
|
|
@@ -11041,8 +11092,8 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
11041
11092
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
11042
11093
|
};
|
|
11043
11094
|
|
|
11044
|
-
var _templateObject$
|
|
11045
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
11095
|
+
var _templateObject$1m;
|
|
11096
|
+
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
11046
11097
|
var theme = _ref.theme;
|
|
11047
11098
|
return theme.colors.primary;
|
|
11048
11099
|
}, function (_ref2) {
|
|
@@ -11983,5 +12034,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1l || (_templa
|
|
|
11983
12034
|
return theme.fonts.tablet.sizes.body[1];
|
|
11984
12035
|
}, devices.desktop, devices.largeDesktop);
|
|
11985
12036
|
|
|
11986
|
-
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, LiveChat, MiniCard, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingStream, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, Button$1 as TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, zIndexes };
|
|
12037
|
+
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, GridItemLegacy, Header, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, LiveChat, MiniCard, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingStream, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, Button$1 as TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, zIndexes };
|
|
11987
12038
|
//# sourceMappingURL=chord.esm.js.map
|